*{box-sizing:border-box}:root{--black:#050505;--deep:#07110c;--green:#16a34a;--gold:#facc15;--red:#ef4444;--ink:#020617;--muted:#cbd5e1;--glass:#ffffff14;--glass-strong:#ffffff21;--line:#ffffff21}html,body{background:var(--ink);color:#fff;min-height:100%;margin:0;font-family:Arial,Helvetica,sans-serif}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}.page{background:radial-gradient(circle at 18% 8%,#facc153d,#0000 26%),radial-gradient(circle at 88% 12%,#ef444438,#0000 28%),radial-gradient(circle at 52% 92%,#16a34a38,#0000 32%),linear-gradient(135deg,#020617 0%,#07110c 45%,#050505 100%);min-height:100vh;padding:24px 16px 40px;position:relative;overflow:hidden}.kenteStrip{z-index:5;background:repeating-linear-gradient(90deg,#ef4444 0 36px,#facc15 36px 72px,#16a34a 72px 108px,#111827 108px 144px);width:100%;height:9px;animation:14s linear infinite slideStrip;position:fixed;top:0;left:0}.ghanaGlow{filter:blur(70px);opacity:.38;pointer-events:none;border-radius:999px;width:380px;height:380px;animation:8s ease-in-out infinite floatGlow;position:fixed}.ghanaGlowOne{background:#facc15;top:90px;left:-120px}.ghanaGlowTwo{background:#16a34a;animation-delay:-3s;bottom:120px;right:-140px}.container{z-index:2;max-width:1220px;margin:0 auto;position:relative}.navBar{justify-content:space-between;align-items:center;gap:22px;margin:8px 0 28px;animation:.7s both fadeUp;display:flex}.brandMark{align-items:center;gap:14px;display:flex}.brandIcon{background:linear-gradient(135deg,#facc15f2,#ef4444e0);border-radius:18px;place-items:center;width:54px;height:54px;font-size:28px;animation:2.4s ease-in-out infinite bounceTiny;display:grid;box-shadow:0 18px 45px #facc1538}.brandSmall{color:#fde68a;letter-spacing:.2em;text-transform:uppercase;margin:0;font-size:13px;font-weight:900}.brandBig{color:#fff;margin:3px 0 0;font-size:18px;font-weight:950}.streakBadge{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:linear-gradient(135deg,#facc1533,#ef444429),#ffffff14;border:1px solid #facc1559;border-radius:24px;align-items:center;gap:14px;min-width:220px;padding:14px 16px;animation:.85s both streakPop;display:flex;box-shadow:0 24px 70px #facc151f}.streakIcon{font-size:36px;line-height:1;animation:1.4s ease-in-out infinite flame}.streakLabel{color:#fde68a;text-transform:uppercase;letter-spacing:.14em;margin:0;font-size:11px;font-weight:900}.streakValue{color:#fff;margin:3px 0 0;font-size:23px;font-weight:950}.streakBest{color:#cbd5e1;margin:2px 0 0;font-size:12px}.sloganGameCard{margin-bottom:28px;animation:.6s both fadeUp}.sloganGameHeader{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:24px;display:flex}.sloganTitle{letter-spacing:-.03em;margin:6px 0 4px;font-size:28px}.sloganSub{color:var(--muted);max-width:500px;margin:0;font-size:14px;line-height:1.6}.sloganMeta{flex-direction:column;align-items:flex-end;gap:8px;display:flex}.attemptsBadge{background:#facc151f;border:1px solid #facc154d;border-radius:16px;flex-direction:column;align-items:center;min-width:80px;padding:10px 18px;display:flex}.attemptsNum{color:var(--gold);font-size:32px;font-weight:1000;line-height:1}.attemptsLabel{color:#fde68a;text-transform:uppercase;letter-spacing:.1em;margin-top:2px;font-size:11px}.progressDots{letter-spacing:4px;font-size:22px}.todayDate{color:var(--muted);letter-spacing:.1em;margin:0;font-size:11px}.sloganTabs{gap:8px;margin-bottom:16px;display:flex}.sloganTab{border:1px solid var(--line);color:var(--muted);background:#ffffff0f;border-radius:14px;flex:1;padding:10px;font-size:14px;font-weight:800;transition:all .2s}.sloganTabActive{color:var(--gold);background:#facc151f;border-color:#facc1580}.sloganTabSolved{color:#86efac;background:#16a34a1f;border-color:#16a34a80}.sloganBox{border:1px solid var(--line);background:#02061799;border-radius:22px;padding:22px}.sloganNumber{color:var(--gold);text-transform:uppercase;letter-spacing:.18em;margin:0 0 10px;font-size:11px;font-weight:900}.sloganPrompt{color:#fff;margin:0 0 18px;font-size:clamp(18px,3vw,26px);font-weight:900;line-height:1.4}.sloganBlank{color:var(--gold);letter-spacing:3px;margin-left:8px;animation:1.2s ease-in-out infinite blink;display:inline-block}.sloganInputRow{gap:10px;display:flex}.sloganInput{color:#fff;background:#020617cc;border:1px solid #ffffff2e;border-radius:15px;outline:none;flex:1;padding:13px 16px;font-size:16px;transition:border-color .2s,box-shadow .2s}.sloganInput:focus{border-color:var(--gold);box-shadow:0 0 0 4px #facc151f}.sloganSubmitBtn{color:#020617;white-space:nowrap;background:linear-gradient(135deg,#facc15,#f97316);border:0;border-radius:15px;padding:13px 26px;font-size:16px;font-weight:950;transition:transform .18s,box-shadow .18s}.sloganSubmitBtn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px #facc1540}.sloganFeedback{border-radius:12px;margin:12px 0 0;padding:10px 14px;font-size:15px;font-weight:800}.feedbackGood{color:#86efac;background:#16a34a26}.feedbackBad{color:#fca5a5;background:#ef444424}.sloganSolved{padding:8px 0}.sloganReveal{color:#86efac;margin:0 0 6px;font-size:clamp(18px,3vw,24px);font-weight:900}.sloganSolvedNote{color:var(--muted);margin:0;font-size:13px}.sloganLoading{color:var(--muted);flex-direction:column;align-items:center;gap:16px;padding:40px;display:flex}.spinner{border:3px solid #ffffff1a;border-top-color:var(--gold);border-radius:50%;width:36px;height:36px;animation:.8s linear infinite spin}.sloganResult{text-align:center;flex-direction:column;align-items:center;gap:12px;padding:16px 0 8px;display:flex}.resultEmoji{font-size:56px;animation:1.5s ease-in-out infinite bounceTiny}.resultTitle{letter-spacing:-.02em;margin:0;font-size:26px;font-weight:950}.resultSub{color:var(--muted);margin:0;font-size:15px}.finalScore{background:#facc151a;border:1px solid #facc154d;border-radius:20px;align-items:baseline;gap:8px;padding:14px 28px;display:flex}.finalScoreNum{color:var(--gold);font-size:44px;font-weight:1000;line-height:1}.finalScoreLabel{color:#fde68a;font-size:16px;font-weight:800}.resultSlogans{text-align:left;border:1px solid var(--line);background:#02061780;border-radius:18px;gap:8px;width:100%;max-width:560px;padding:16px;display:grid}.resultSlogan{color:#e2e8f0;margin:0;font-size:15px;font-weight:700;line-height:1.5}.resultActions{flex-direction:column;align-items:center;gap:10px;width:100%;max-width:320px;display:flex}.resultNote{color:var(--muted);margin:0;font-size:13px}.streakWon{color:var(--gold);background:#facc1514;border:1px solid #facc1540;border-radius:20px;padding:10px 22px;font-size:18px;font-weight:900}.shake{animation:.5s shake}.boardTabs{gap:6px;display:flex}.boardTab{border:1px solid var(--line);color:var(--muted);background:#ffffff0f;border-radius:12px;padding:8px 18px;font-size:13px;font-weight:800;transition:all .18s}.boardTabActive{color:var(--gold);background:#facc1524;border-color:#facc1566}.hero{grid-template-columns:minmax(0,1fr) 360px;align-items:stretch;gap:24px;margin-bottom:28px;display:grid}.heroCopy{animation:.8s both fadeUp}.eyebrow,.sectionKicker{color:var(--gold);letter-spacing:.26em;text-transform:uppercase;font-size:13px;font-weight:950}.title{letter-spacing:-.07em;max-width:810px;margin:12px 0;font-size:clamp(42px,6vw,82px);font-weight:1000;line-height:.9}.title span{background:linear-gradient(90deg,#facc15,#fff,#22c55e);color:#0000;-webkit-background-clip:text;display:block}.subtitle{color:var(--muted);max-width:760px;font-size:17px;line-height:1.7}.heroChips{flex-wrap:wrap;gap:10px;margin-top:22px;display:flex}.heroChips span,.miniBadge,.leaderboardMeta span{border:1px solid var(--line);color:#e5e7eb;background:#ffffff14;border-radius:999px;padding:9px 12px;font-size:13px;font-weight:800}.podiumCard{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:linear-gradient(#ffffff1f,#ffffff0d),#020617b8;border:1px solid #ffffff24;border-radius:32px;padding:20px;animation:.9s both fadeUp;box-shadow:0 30px 90px #00000047}.podiumTitle{color:#fde68a;text-transform:uppercase;letter-spacing:.16em;margin:0 0 14px;font-size:12px;font-weight:950}.podiumList{gap:12px;display:grid}.podiumRow{background:#ffffff14;border-radius:20px;grid-template-columns:44px 1fr auto;align-items:center;gap:12px;padding:12px;animation:4s ease-in-out infinite softPulse;display:grid}.podiumRank{color:#020617;background:#facc15;border-radius:14px;place-items:center;height:38px;font-weight:1000;display:grid}.podiumRow strong{display:block}.podiumRow p{color:#cbd5e1;margin:3px 0 0;font-size:12px}.podiumScore{color:#facc15;font-weight:1000}.podiumEmpty{color:#cbd5e1;margin:0}.grid{grid-template-columns:380px minmax(0,1fr);gap:24px;margin-top:26px;display:grid}.card{border:1px solid var(--line);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(#ffffff1b,#ffffff0b),#020617bd;border-radius:30px;padding:22px;animation:.75s both fadeUp;position:relative;box-shadow:0 30px 90px #0000004d}.card:before{content:"";border-radius:inherit;pointer-events:none;opacity:0;background:linear-gradient(135deg,#facc152e,#0000 28% 68%,#16a34a29);transition:opacity .25s;position:absolute;inset:0}.card:hover:before{opacity:1}.card:hover{transition:transform .25s;transform:translateY(-2px)}.card h2{letter-spacing:-.03em;margin:0;font-size:26px}.cardHeader,.leaderboardHeader{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px;display:flex}.sectionKicker{margin-bottom:6px;font-size:11px;display:block}.pulse{animation:1.8s ease-in-out infinite pulseBadge}.field{margin-bottom:16px;display:block}.field span{color:#cbd5e1;margin-bottom:8px;font-size:14px;font-weight:800;display:block}.input{color:#fff;background:#020617b8;border:1px solid #ffffff21;border-radius:17px;outline:none;width:100%;padding:15px 16px;transition:border-color .2s,transform .2s,box-shadow .2s}.input:focus{border-color:var(--gold);transform:translateY(-1px);box-shadow:0 0 0 4px #facc151f}.primaryButton,.secondaryButton{border-radius:17px;width:100%;padding:15px 16px;font-weight:950;transition:transform .18s,box-shadow .18s,opacity .18s}.primaryButton{color:#020617;background:linear-gradient(135deg,#facc15,#f97316);border:0;margin-bottom:12px;box-shadow:0 18px 45px #facc152e}.secondaryButton{color:#fff;background:#ffffff0f;border:1px solid #ffffff24}.primaryButton:hover:not(:disabled),.secondaryButton:hover:not(:disabled){transform:translateY(-2px)scale(1.01)}.status,.ready,.warning{border-radius:17px;margin-top:12px;padding:13px;font-size:14px}.status{color:#e2e8f0;background:#ffffff1a}.ready{color:#86efac;background:#16a34a24;gap:4px;display:grid}.ready strong{color:#bbf7d0}.warning{color:#fecaca;background:#ef444424;margin-bottom:14px}.gameFrameShell{background:#030712;border:1px solid #ffffff1f;border-radius:25px;overflow:hidden}.gameFrameTop{background:#ffffff14;align-items:center;gap:8px;height:38px;padding:0 14px;display:flex}.gameFrameTop p{color:#94a3b8;margin:0 0 0 8px;font-size:12px;font-weight:800}.trafficDot{border-radius:999px;width:11px;height:11px}.trafficDot.red{background:#ef4444}.trafficDot.yellow{background:#facc15}.trafficDot.green{background:#22c55e}.gameFrameWrap{aspect-ratio:16/9;background:#000;overflow:hidden}.gameFrame{border:0;width:100%;height:100%}.leaderboard{margin-top:24px}.leaderboardMeta{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.tableWrap{border:1px solid #ffffff1a;border-radius:22px;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14px}thead{color:#f8fafc;background:linear-gradient(90deg,#ef444433,#facc1526,#16a34a2e)}th,td{text-align:left;padding:15px 16px}tbody tr{border-top:1px solid #ffffff17;transition:background .2s,transform .2s}tbody tr:hover{background:#fff1}.score{color:var(--gold);font-weight:1000}.rankPill{color:#fde68a;background:#facc1524;border-radius:999px;place-items:center;min-width:42px;padding:6px 9px;font-weight:950;display:inline-grid}.empty{text-align:center;color:#94a3b8;padding:34px}@keyframes fadeUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes floatGlow{0%,to{transform:translate(0,0)scale(1)}50%{transform:translate(28px,-24px)scale(1.08)}}@keyframes flame{0%,to{transform:rotate(-5deg)scale(1)}50%{transform:rotate(6deg)scale(1.12)}}@keyframes streakPop{0%{opacity:0;transform:translateY(-12px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes bounceTiny{0%,to{transform:translateY(0)rotate(-3deg)}50%{transform:translateY(-5px)rotate(3deg)}}@keyframes pulseBadge{0%,to{box-shadow:0 0 #22c55e2e}50%{box-shadow:0 0 0 7px #22c55e00}}@keyframes softPulse{0%,to{background:#ffffff14}50%{background:#facc151c}}@keyframes slideStrip{0%{background-position:0 0}to{background-position:144px 0}}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}@media (max-width:980px){.hero,.grid{grid-template-columns:1fr}.podiumCard{order:-1}.sloganGameHeader{flex-direction:column}.sloganMeta{flex-flow:wrap;align-items:flex-start;gap:12px}}@media (max-width:700px){.page{padding:20px 12px 32px}.navBar{flex-direction:column;align-items:stretch}.streakBadge{width:100%}.title{font-size:clamp(38px,14vw,62px)}.card,.podiumCard{border-radius:24px;padding:18px}.cardHeader,.leaderboardHeader{flex-direction:column}th,td{padding:12px 13px}.sloganInputRow{flex-direction:column}.sloganSubmitBtn,.boardTabs{width:100%}.boardTab{flex:1}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}