@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#090e1c;--panel:#131c2e;--panel2:#1b2940;--line:#2b3950;--muted:#a3b2ca;--white:#f5f8ff;--cyan:#5be7e3;--pink:#f77eb7;--lime:#b7f86d;--gold:#f8c777}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse 75% 65% at 12% 0%,#1b2946 0%,transparent 70%),radial-gradient(ellipse 60% 50% at 100% 80%,#261a3b 0%,transparent 70%),var(--bg);color:var(--white);font-family:'DM Sans',system-ui,sans-serif;min-height:100vh}body:before{content:'';position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(#ffffff04 1px,transparent 1px),linear-gradient(90deg,#ffffff04 1px,transparent 1px);background-size:44px 44px}button,a{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}.shell{max-width:1240px;margin:auto;padding:26px 24px 55px;position:relative}.top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:48px}.brand{display:flex;align-items:center;gap:12px}.logo{width:44px;height:44px;border:1px solid #4d758b;border-radius:12px;display:grid;place-items:center;background:#162c3a;color:var(--cyan);font-size:24px;box-shadow:0 0 24px #5be7e31b}.brandname{font:800 21px 'Space Grotesk',sans-serif;letter-spacing:-.8px}.brandname span{color:var(--cyan)}.subbrand{font-size:10px;letter-spacing:2px;color:var(--muted);margin-top:2px}.topactions{display:flex;gap:10px;align-items:center}.ghost{display:inline-flex;align-items:center;justify-content:center;background:#151f32;border:1px solid var(--line);border-radius:10px;padding:10px 14px;color:#dbe6f4;font-size:12px;font-weight:700}.ghost:hover{border-color:var(--cyan);color:var(--cyan)}.eyebrow{color:var(--cyan);font-size:11px;letter-spacing:2.6px;font-weight:800;text-transform:uppercase}.heading{font:800 clamp(34px,5vw,60px) 'Space Grotesk',sans-serif;letter-spacing:-2.5px;margin:12px 0;line-height:1.08}.heading em{font-style:normal;color:var(--cyan)}.lead{color:#adbbd0;font-size:14px;line-height:1.75;margin:0 0 28px;max-width:800px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:26px 0 18px}.stat{background:#131d2eec;border:1px solid var(--line);border-radius:15px;padding:18px 19px}.statlabel{font-size:11px;letter-spacing:1.2px;color:var(--muted);text-transform:uppercase;font-weight:800}.statvalue{font:800 clamp(23px,3vw,34px) 'Space Grotesk';margin-top:8px}.cyan{color:var(--cyan)}.lime{color:var(--lime)}.pink{color:var(--pink)}.progressbox{border:1px solid var(--line);background:#111a2b;border-radius:14px;padding:16px 20px;margin-bottom:30px}.progressrow{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:var(--muted);font-weight:800;letter-spacing:1.1px;margin-bottom:12px}.progressrow strong{color:var(--cyan)}.track{height:8px;border-radius:100px;background:#2a374c;overflow:hidden}.fill{height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--lime));transition:width .3s}.sectionhead{display:flex;justify-content:space-between;align-items:end;gap:15px;margin:30px 0 16px}.sectiontitle{font:800 21px 'Space Grotesk';margin:0}.sectionnote{font-size:12px;color:var(--muted)}.gamegrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.tile{display:flex;flex-direction:column;gap:11px;min-height:206px;padding:18px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(140deg,#1b2940,#111a2a);transition:transform .2s,border-color .2s,box-shadow .2s;position:relative;overflow:hidden}.tile:hover{transform:translateY(-3px);border-color:#5be7e3a3;box-shadow:0 12px 35px #0005}.tiletop{display:flex;justify-content:space-between;align-items:center}.tileindex{font:800 11px 'Space Grotesk';color:var(--cyan);letter-spacing:1.8px}.tileicon{font-size:23px;color:var(--gold)}.tilename{font:800 18px 'Space Grotesk';line-height:1.15}.tiledesc{font-size:12px;line-height:1.45;color:var(--muted);min-height:34px}.tilebottom{margin-top:auto}.tilexp{display:flex;justify-content:space-between;color:#c7d6e8;font-size:11px;margin-bottom:9px;font-weight:700}.tilebar{height:5px;border-radius:99px;background:#354359;overflow:hidden}.tilebar>div{height:100%;background:var(--cyan)}.tilefoot{margin-top:10px;color:#91a5c0;font-size:10px;letter-spacing:.4px}.footer{border-top:1px solid var(--line);margin-top:42px;padding-top:20px;display:flex;justify-content:space-between;gap:12px;font-size:11px;color:var(--muted)}.game{border:1px solid var(--line);border-radius:19px;overflow:hidden;background:#141f32;margin:28px 0}.gamehead{padding:17px 24px;background:#1a2940;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--line)}.tag{color:var(--cyan);font-size:11px;font-weight:800;letter-spacing:1.4px}.level{color:var(--muted);font-size:11px;font-weight:700}.gamebody{padding:30px 34px}.prompt{font-size:11px;font-weight:800;letter-spacing:1.5px;color:var(--muted);margin-bottom:13px}.expression{font:800 clamp(22px,3.2vw,34px) 'Space Grotesk';margin-bottom:25px;line-height:1.35;white-space:pre-wrap}.options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.option{background:#213047;color:#e5edf9;border:1px solid #344760;border-radius:11px;padding:17px;text-align:left;display:flex;gap:12px;align-items:center;min-height:65px}.option:hover:not(:disabled){border-color:var(--cyan);background:#283c51}.option .key{display:grid;place-items:center;width:26px;height:26px;border:1px solid #52637b;border-radius:7px;flex-shrink:0;color:var(--cyan);font-size:12px}.option.correct{background:#16483f;border-color:var(--cyan)}.option.wrong{background:#502a41;border-color:var(--pink)}.option:disabled{cursor:default}.feedback{display:none;margin-top:22px;background:#0d1728;border:1px solid #304058;border-radius:12px;padding:20px}.feedback.show{display:block}.feedbacktitle{font-weight:800;font-size:13px;letter-spacing:1px}.feedbacktitle.ok{color:var(--lime)}.feedbacktitle.no{color:var(--pink)}.feedback p{line-height:1.65;color:#e0e8f3;margin:13px 0}.feedback .quote{font-style:italic;color:#b8c9df}.next{background:var(--cyan);border:0;border-radius:9px;padding:12px 18px;font-weight:800;color:#0a1a24;margin-top:6px}.next:hover{background:#a0ffed}.gamefoot{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);padding:14px 24px;color:var(--muted);font-size:10px;letter-spacing:.6px}.complete{text-align:center;padding:36px 12px}.complete h2{font:800 35px 'Space Grotesk'}.complete p{color:var(--muted)}.trophy{font-size:50px}.notice{padding:12px 15px;border:1px solid #47516a;background:#19243a;border-radius:11px;color:#c7d5e7;font-size:12px;line-height:1.65;margin:18px 0}.notice strong{color:var(--gold)}.mini{font-size:12px;color:var(--muted)}.back{margin-bottom:24px}.toast{position:fixed;bottom:20px;right:20px;background:#25334a;padding:12px 18px;border:1px solid var(--cyan);border-radius:10px;display:none}.toast.show{display:block}@media(max-width:950px){.gamegrid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:650px){.shell{padding:18px 14px 40px}.top{margin-bottom:30px}.brandname{font-size:17px}.gamegrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.tile{padding:13px;min-height:205px}.tilename{font-size:15px}.tiledesc{font-size:11px}.stats{grid-template-columns:repeat(2,1fr)}.options{grid-template-columns:1fr}.gamebody{padding:22px 17px}.gamefoot{flex-direction:column}.footer{flex-direction:column}.topactions{gap:5px}.ghost{padding:8px 9px;font-size:11px}}@media(max-width:350px){.gamegrid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}
.topactions{display:flex;align-items:center;gap:9px}.topactions button{font-family:inherit;cursor:pointer}

/* Homepage redesign — centered premium arcade */
body[data-page="home"] .shell{max-width:1180px;padding-inline:30px}
body[data-page="home"] .top{display:flex;flex-wrap:wrap;gap:22px;margin-bottom:48px;padding-bottom:22px;border-bottom:1px solid var(--line)}
body[data-page="home"] .brand{flex-shrink:0;gap:14px}
body[data-page="home"] .logo{width:58px;height:58px;font-size:30px}
body[data-page="home"] .brandname{font-size:26px;letter-spacing:-1.2px}
body[data-page="home"] .subbrand{font-size:10px}
.category-nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto}
.category-nav .cat{background:transparent;border:1px solid transparent;color:#b5c4d8;border-radius:9px;padding:10px 12px;font-size:12px;font-weight:800;white-space:nowrap}
.category-nav .cat:hover,.category-nav .cat.active{background:#192c3d;border-color:#426879;color:var(--cyan)}
body[data-page="home"] .topactions{margin-left:0}
body[data-page="home"] main{width:100%}
body[data-page="home"] .heading{font-size:clamp(42px,5.4vw,68px);line-height:1.06}
body[data-page="home"] .lead{max-width:720px}
body[data-page="home"] .stats{grid-template-columns:repeat(3,minmax(0,1fr));max-width:790px;margin:28px 0 58px}
body[data-page="home"] .gamegrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
body[data-page="home"] .tile{min-height:210px;padding:22px}
body[data-page="home"] .tilename{font-size:20px}
body[data-page="home"] .sectionhead{margin-top:12px}
body[data-page="home"] .tile[hidden]{display:none}
@media(max-width:1050px){body[data-page="home"] .category-nav{order:3;width:100%;margin-left:0}body[data-page="home"] .topactions{margin-left:auto}}
@media(max-width:760px){body[data-page="home"] .shell{padding-inline:18px}body[data-page="home"] .gamegrid{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-page="home"] .stats{margin-bottom:38px}}
@media(max-width:540px){body[data-page="home"] .top{gap:14px}body[data-page="home"] .logo{width:48px;height:48px}body[data-page="home"] .brandname{font-size:20px}body[data-page="home"] .topactions{width:100%;margin:0}body[data-page="home"] .category-nav{gap:4px}body[data-page="home"] .category-nav .cat{padding:8px 9px;font-size:11px}body[data-page="home"] .gamegrid{grid-template-columns:1fr}body[data-page="home"] .stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}body[data-page="home"] .stat{padding:12px 9px}body[data-page="home"] .statlabel{font-size:9px;letter-spacing:.2px}body[data-page="home"] .statvalue{font-size:22px}body[data-page="home"] .tile{min-height:185px}}

/* 30-quest catalog */
.catalog-note{color:#a7b7c9;font-size:13px;margin:12px 0 20px;line-height:1.6}.tile-planned{opacity:.68;cursor:default;border-style:dashed!important}.tile-planned .tilebar>div{width:0!important}.tile-planned .tilefoot{letter-spacing:.035em}.category-nav{flex-wrap:wrap}.tile-planned:hover{transform:none!important}
