*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Tahoma,Arial,sans-serif;background:#041020;color:#fff}body{overflow-x:hidden}.bg{position:fixed;inset:0;background:radial-gradient(circle at 15% 10%,#123e83 0,transparent 30%),radial-gradient(circle at 85% 25%,#4b126e55 0,transparent 28%),linear-gradient(145deg,#06172f,#030916 70%);z-index:-2}.bg:after{content:"";position:absolute;inset:0;background-image:linear-gradient(#55aaff0a 1px,transparent 1px),linear-gradient(90deg,#55aaff0a 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(to bottom,#000,transparent)}main{width:min(760px,100%);margin:auto;padding:20px 16px 120px}.brand{text-align:center;padding:18px 8px}.brand .cap{width:64px;height:64px;margin:auto;border:2px solid #ffd35a;border-radius:20px;display:grid;place-items:center;box-shadow:0 0 25px #ffc10755;background:linear-gradient(145deg,#17376b,#09162e);font-size:34px}.brand h1{font-size:clamp(28px,7vw,48px);margin:12px 0 3px;background:linear-gradient(90deg,#ffd65b,#fff1ae,#ffbd31);-webkit-background-clip:text;color:transparent}.brand h2{margin:0;font-size:19px}.brand p{color:#9fc8ff;margin:8px}.panel,.game-card{border:1px solid #377bd366;background:linear-gradient(145deg,#0c2347e8,#07152fe8);box-shadow:0 15px 40px #0008, inset 0 1px #ffffff16;border-radius:24px}.game-card{padding:20px;margin:14px 0;display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;cursor:pointer;transition:.25s}.game-card:hover{transform:translateY(-3px);border-color:#64c9ff}.game-card .ico{width:60px;height:60px;border-radius:18px;display:grid;place-items:center;background:#0b3265;border:1px solid #47baff;box-shadow:0 0 20px #00b7ff44;font-size:30px}.game-card:nth-child(2) .ico{background:#3a195c;border-color:#ce75ff}.game-card:nth-child(3) .ico{background:#0a4b5a;border-color:#31e7ff}.game-card h3{margin:0 0 5px;font-size:21px}.game-card p{margin:0;color:#a9bdd8;font-size:14px}.arrow{font-size:28px;color:#70caff}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px}.btn{border:0;color:#fff;font-weight:800;font-size:16px;border-radius:16px;padding:14px 16px;cursor:pointer;background:linear-gradient(135deg,#1378dd,#05b6f4);box-shadow:0 8px 22px #008cff35,inset 0 1px #ffffff55;transition:.2s}.btn:active{transform:scale(.97)}.btn.purple{background:linear-gradient(135deg,#6531b8,#b53ee7)}.btn.gold{background:linear-gradient(135deg,#b06a00,#ffc42e);color:#161006}.btn.red{background:linear-gradient(135deg,#b91c3b,#ff493e)}.topbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.back{width:44px;height:44px;border-radius:14px;border:1px solid #4986ca;background:#0b2244;color:white;font-size:22px;cursor:pointer}.title{font-weight:900}.hud{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.hearts{display:flex;gap:5px;direction:ltr}.heart{width:27px;height:24px;position:relative;filter:drop-shadow(0 0 5px #ff314f)}.heart:before{content:'♥';font-size:28px;color:#ff405a}.heart.dead:before{color:#34445c;filter:none}.progressLabel{font-weight:bold;direction:ltr}.progress{height:9px;background:#0b1930;border:1px solid #396b9f;border-radius:99px;overflow:hidden;margin:10px 0 16px}.progress>i{display:block;height:100%;width:0;background:linear-gradient(90deg,#00a7ff,#31eaff);box-shadow:0 0 14px #22cfff;transition:width .4s}.tools{display:grid;grid-template-columns:1fr 92px 1fr;gap:10px;align-items:center;margin-bottom:14px}.tool{height:58px;border:1px solid #3977bd;background:linear-gradient(145deg,#102e5b,#07162f);color:#fff;border-radius:17px;font-weight:bold;cursor:pointer;box-shadow:inset 0 1px #ffffff18}.tool:disabled{opacity:.35}.timer{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;margin:auto;background:radial-gradient(circle,#0e294f 50%,#06101f 51%);border:5px solid #23bfff;box-shadow:0 0 25px #00aaff88;font-size:28px;font-weight:900}.timer small{font-size:10px;display:block;text-align:center}.timer.danger{border-color:#ff354f;box-shadow:0 0 28px #ff183f;animation:pulse .65s infinite}@keyframes pulse{50%{transform:scale(1.1)}}.question{padding:22px;margin:10px 0 14px;font-size:20px;line-height:1.7;text-align:center}.options{display:grid;gap:10px}.option{display:grid;grid-template-columns:45px 1fr;align-items:center;text-align:right;border:1px solid #3177bf;background:linear-gradient(145deg,#0d2a55,#071831);color:#fff;border-radius:17px;padding:13px;min-height:60px;font-size:16px;cursor:pointer;transition:.18s}.option:hover{border-color:#5bc7ff;transform:translateX(-2px)}.letter{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;border:2px solid #54a8ff;font-weight:900}.option.correct{background:linear-gradient(135deg,#075a31,#0bbd5b);border-color:#39ff92;box-shadow:0 0 22px #18e87355}.option.wrong{background:linear-gradient(135deg,#5c0b20,#d92b35);border-color:#ff5664;animation:shake .3s}.option.hidden{opacity:.15;pointer-events:none}.option.correct .letter,.option.wrong .letter{border-color:#fff}@keyframes shake{25%{transform:translateX(6px)}75%{transform:translateX(-6px)}}.feedback{padding:14px;text-align:center;border-radius:16px;margin-top:12px;font-weight:bold}.feedback.ok{background:#0c713c55;border:1px solid #2cff85}.feedback.no{background:#9b173555;border:1px solid #ff4963}.fillbox{padding:24px}.fillbox h3{line-height:1.8}.input{width:100%;min-height:115px;border:1px solid #3d78bb;border-radius:17px;background:#06172f;color:white;padding:16px;font-size:17px;outline:none;resize:vertical}.input:focus{border-color:#40d5ff;box-shadow:0 0 16px #00b7ff33}.hint{font-size:13px;color:#92a9c8;margin:10px 0}.case{padding:20px;line-height:1.8}.case .tag{display:inline-block;background:#12417c;border:1px solid #3d94e6;border-radius:99px;padding:5px 12px;font-size:13px}.case h3{color:#ffd75a}.answerbox{margin-top:15px;padding:18px;border:1px solid #25d880;background:#0a513455;border-radius:17px;line-height:1.8}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.stat{padding:16px 8px;text-align:center}.stat b{display:block;font-size:30px;color:#ffd45d}.result{text-align:center;padding:26px}.result .trophy{font-size:65px}.result h2{font-size:32px;color:#ffd65a}.modalWrap{position:fixed;inset:0;background:#000b;display:grid;place-items:center;padding:18px;z-index:20}.modal{width:min(520px,100%);padding:24px}.modal h2{text-align:center}.socials{display:grid;grid-template-columns:1fr 1fr;gap:10px}.social{padding:15px;border-radius:15px;text-decoration:none;color:white;text-align:center;font-weight:bold;border:1px solid #3b80c8;background:#0b2b56}.social.tg{background:#0879ae}.social.fb{background:#174e9c}.social.yt{background:#a80e18}.social.ig{background:linear-gradient(135deg,#7136bd,#d62d77,#ef8d24)}footer{position:fixed;bottom:0;left:0;right:0;text-align:center;padding:10px;background:#020916eF;border-top:1px solid #244a76;font-size:12px;color:#9db0ca;z-index:5}.dev{margin-top:4px;color:#d9e5f6}@media(max-width:500px){main{padding:12px 11px 105px}.game-card{grid-template-columns:55px 1fr auto;padding:15px}.game-card .ico{width:52px;height:52px}.actions{grid-template-columns:1fr}.question{font-size:17px;padding:17px}.option{font-size:14px}.tools{grid-template-columns:1fr 78px 1fr}.timer{width:72px;height:72px}.socials{grid-template-columns:1fr 1fr}}
/* v2 legendary shell */
:root{--accent:#22c7ff;--accent2:#7c4dff;--gold:#ffd45d;--surface:#0a2145e8;--surface2:#07152fe8;--text:#fff;--muted:#9fc8ff;--line:#377bd366;--ok:#27ef83;--bad:#ff405a}body{transition:background .5s,color .5s}body[data-theme="day"]{--accent:#0878d8;--accent2:#00a8c8;--gold:#a96500;--surface:#fffffff2;--surface2:#edf7fff2;--text:#10223a;--muted:#52708f;--line:#2c83bd55;background:#eaf7ff;color:var(--text)}body[data-theme="girl"]{--accent:#ff4fb3;--accent2:#9c5cff;--gold:#ffcf69;--surface:#351334ed;--surface2:#1c1236ed;--text:#fff;--muted:#ffc6e9;--line:#ff74c866;background:#190d27;color:var(--text)}body[data-theme="day"] .bg{background:radial-gradient(circle at 10% 10%,#8bdcffaa,transparent 32%),radial-gradient(circle at 90% 20%,#c6e9ff,transparent 30%),linear-gradient(145deg,#f8fdff,#dff3ff)}body[data-theme="girl"] .bg{background:radial-gradient(circle at 15% 10%,#ff3fa977,transparent 30%),radial-gradient(circle at 85% 25%,#934dff77,transparent 30%),linear-gradient(145deg,#2b0d2b,#110a25 70%)}.panel,.game-card{background:linear-gradient(145deg,var(--surface),var(--surface2));border-color:var(--line);color:var(--text)}.top-controls{position:fixed;top:max(12px,env(safe-area-inset-top));left:14px;z-index:30;display:flex;gap:8px;direction:ltr}.round-control,.theme-control{border:1px solid var(--line);background:var(--surface);color:var(--text);box-shadow:0 8px 24px #0004,inset 0 1px #fff2;backdrop-filter:blur(12px);cursor:pointer}.round-control{width:46px;height:46px;border-radius:15px;font-size:20px}.theme-control{height:46px;border-radius:15px;padding:0 13px;display:flex;align-items:center;gap:7px}.theme-control b{font-size:12px}.landing{min-height:78vh;display:grid;place-items:center;text-align:center;padding:65px 0 20px}.hero-orb{width:100px;height:100px;margin:auto;border-radius:31px;display:grid;place-items:center;font-size:48px;background:linear-gradient(145deg,#153d79,#08172f);border:1px solid var(--gold);box-shadow:0 0 0 8px #ffd45d0b,0 0 45px #ffd45d4a;animation:float 3s ease-in-out infinite}.hero-kicker{display:inline-block;margin-top:22px;padding:7px 15px;border-radius:99px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-weight:800}.landing h1{font-size:clamp(38px,10vw,70px);margin:12px 0 0;line-height:1.05;background:linear-gradient(90deg,var(--gold),#fff3bd,var(--accent));-webkit-background-clip:text;color:transparent;text-shadow:0 12px 50px #0003}.landing h2{font-size:clamp(20px,5vw,30px);margin:8px 0;color:var(--text)}.landing p{color:var(--muted);max-width:570px;line-height:1.8;margin:10px auto 22px}.start-btn{position:relative;overflow:hidden;min-width:min(390px,90vw);border:1px solid #ffffff44;border-radius:22px;padding:18px 28px;color:#fff;font-size:21px;font-weight:900;background:linear-gradient(120deg,var(--accent2),var(--accent),var(--accent2));background-size:200% 100%;box-shadow:0 14px 40px #008cff44,0 0 30px color-mix(in srgb,var(--accent) 40%,transparent);cursor:pointer;animation:shine 3s linear infinite}.start-btn:after{content:"";position:absolute;inset:-40%;background:linear-gradient(90deg,transparent,#fff5,transparent);transform:translateX(-70%) rotate(15deg);animation:sweep 2.6s infinite}.landing-social{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:20px}.social-pill{width:46px;height:46px;border:1px solid var(--line);border-radius:15px;background:var(--surface);display:grid;place-items:center;color:var(--text);text-decoration:none;font-weight:900;box-shadow:0 8px 20px #0003;transition:.25s}.social-pill:hover{transform:translateY(-5px) rotate(-4deg) scale(1.08);box-shadow:0 0 25px var(--accent)}.menu-head{text-align:center;padding:55px 5px 5px}.menu-head h1{font-size:34px;margin:0;color:var(--gold)}.menu-head p{color:var(--muted)}.game-card{position:relative;overflow:hidden}.game-card:before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 25%,#fff1 50%,transparent 75%);transform:translateX(120%);transition:.7s}.game-card:hover:before{transform:translateX(-120%)}.game-card:hover{box-shadow:0 18px 45px #0007,0 0 26px color-mix(in srgb,var(--accent) 35%,transparent)}.game-card .ico{color:#fff}.enter{animation:pageIn .45s cubic-bezier(.2,.8,.2,1)}.celebrate-layer{position:fixed;inset:0;pointer-events:none;z-index:100;overflow:hidden}.particle{position:absolute;left:50%;top:52%;font-size:30px;animation:burst 1.25s cubic-bezier(.15,.7,.25,1) forwards;filter:drop-shadow(0 5px 8px #0006)}.feedback.ok{box-shadow:0 0 30px #2cff8555}.feedback.no{box-shadow:0 0 30px #ff496355}.option.correct{animation:correctPop .5s ease}.option.wrong{animation:wrongShake .45s ease}.modalWrap{animation:fadeIn .25s ease}.modal{animation:modalIn .35s cubic-bezier(.2,.9,.25,1.2)}.social{transition:.22s;position:relative;overflow:hidden}.social:hover{transform:translateY(-4px) scale(1.02);filter:brightness(1.15);box-shadow:0 10px 30px #0005}.sound-off{opacity:.6;filter:grayscale(1)}@keyframes pageIn{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}@keyframes modalIn{from{opacity:0;transform:scale(.82) translateY(20px)}to{opacity:1;transform:none}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes float{50%{transform:translateY(-9px) rotate(2deg)}}@keyframes shine{to{background-position:200% 0}}@keyframes sweep{60%,100%{transform:translateX(120%) rotate(15deg)}}@keyframes correctPop{45%{transform:scale(1.035)}}@keyframes wrongShake{20%{transform:translateX(8px)}40%{transform:translateX(-8px)}60%{transform:translateX(5px)}80%{transform:translateX(-4px)}}@keyframes burst{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}15%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) rotate(var(--r)) scale(1.2)}}@media(max-width:500px){.top-controls{top:9px;left:9px}.landing{padding-top:80px}.hero-orb{width:84px;height:84px}.landing h1{font-size:43px}.menu-head{padding-top:62px}.start-btn{font-size:18px}.theme-control b{display:none}.theme-control{width:46px;justify-content:center;padding:0}}
/* V3 refinements */
.hero-message{font-size:18px!important;font-weight:700;line-height:2!important;color:var(--text)!important}.landing-social{gap:12px}.social-pill{width:52px;height:52px}.social-pill svg{width:25px;height:25px;fill:currentColor}.social-pill.tg{color:#2AABEE}.social-pill.fb{color:#1877F2}.social-pill.yt{color:#FF0033}.social-pill.ig{color:#E4405F}.social-pill.useful{width:auto;padding:0 16px;gap:8px;display:flex;color:#2AABEE;font-size:13px}.social-pill.useful svg{flex:none}.launching{animation:launchOut .72s cubic-bezier(.7,0,.2,1) forwards}.launch-flash{position:fixed;inset:0;z-index:200;pointer-events:none;background:radial-gradient(circle,var(--accent) 0,transparent 62%);animation:flashLaunch .78s ease forwards}.quiz-tools-bottom{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0 4px}.quiz-tools-bottom .tool{height:66px;display:flex;align-items:center;justify-content:center;gap:11px;font-size:15px}.tool-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#ffffff0d;border:1px solid #ffffff22;font-size:20px}.tool-icon svg{width:23px;height:23px;fill:currentColor}.mcq-top-hud{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin:13px 0}.mcq-top-hud .hud{margin:0;display:flex;flex-direction:column;align-items:flex-start;gap:5px}.mcq-top-hud .hud:last-child{align-items:flex-end}.score-chip{padding:8px 12px;border:1px solid var(--line);border-radius:13px;background:var(--surface);font-weight:900;color:var(--gold)}
@keyframes launchOut{0%{opacity:1;transform:scale(1);filter:blur(0)}55%{transform:scale(1.035);filter:blur(1px)}100%{opacity:0;transform:scale(.92) translateY(-25px);filter:blur(10px)}}@keyframes flashLaunch{0%{opacity:0;transform:scale(.2)}45%{opacity:.38}100%{opacity:0;transform:scale(1.8)}}
@media(max-width:500px){.hero-message{font-size:16px!important}.social-pill{width:48px;height:48px}.social-pill.useful{width:100%;max-width:250px;justify-content:center;margin-top:2px}.landing-social{max-width:300px;margin-inline:auto}.mcq-top-hud{grid-template-columns:1fr 76px 1fr}.mcq-top-hud .timer{width:72px;height:72px}.quiz-tools-bottom{position:relative;z-index:2}.quiz-tools-bottom .tool{height:62px}.hud .hearts{gap:5px}.heart{width:24px!important;height:22px!important}}
/* V4: keep global controls clear of quiz score and use a home icon for return */
.back.home-back{display:grid;place-items:center}
.back.home-back svg{width:24px;height:24px;fill:currentColor}
@media(max-width:500px){
body:has(.mcq-top-hud) .top-controls{top:82px;left:10px;flex-direction:column;gap:7px}
body:has(.mcq-top-hud) .round-control,body:has(.mcq-top-hud) .theme-control{width:42px;height:42px;border-radius:13px}
body:has(.mcq-top-hud) .mcq-top-hud{padding-top:6px}
}
/* V5: controls inside games */
body:has(.mcq-top-hud) .top-controls,
body:has(.fillbox) .top-controls,
body:has(.case) .top-controls,
body:has(.result) .top-controls{display:none!important}
.quiz-header-actions{display:flex;align-items:center;gap:8px}
.quiz-header-actions .back{position:static!important}
.quiz-sound{width:48px;height:48px;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--text);display:grid;place-items:center;cursor:pointer;box-shadow:0 8px 22px #0003}
.quiz-sound svg{width:25px;height:25px;fill:currentColor}
@media(max-width:500px){.quiz-sound,.quiz-header-actions .back{width:44px;height:44px;border-radius:14px}}