
:root{
  --red:#c9192e;--red2:#ef3340;--yellow:#f6c800;--ink:#191b25;--muted:#6e7280;
  --paper:#fff;--soft:#f5f6f8;--line:#e4e6ec;--good:#18864b;--bad:#c93e4d;
  --shadow:0 18px 48px rgba(25,27,37,.12);
}
*{box-sizing:border-box} body{margin:0;min-height:100vh;background:
linear-gradient(145deg,#fff8d7 0%,#fff 45%,#ffe9ec 100%);
font-family:Inter,ui-rounded,"Segoe UI",Arial,sans-serif;color:var(--ink)}
button{font:inherit}.app{max-width:1050px;margin:auto;padding:18px}
header{display:flex;justify-content:space-between;align-items:center;gap:16px;
background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.9);
border-radius:22px;padding:13px 17px;box-shadow:var(--shadow);backdrop-filter:blur(10px)}
.brand{display:flex;align-items:center;gap:12px}.logo{width:62px;height:46px;position:relative;
border-radius:12px;overflow:hidden;box-shadow:0 8px 18px rgba(201,25,46,.2);
background:linear-gradient(#c9192e 0 25%,#f6c800 25% 75%,#c9192e 75% 100%)}
.logo:after{content:"»";position:absolute;right:7px;top:-6px;font-size:52px;font-weight:1000;
font-style:italic;color:#fff;text-shadow:-5px 0 0 rgba(255,255,255,.35)}
.logo:before{content:"";position:absolute;left:-18px;top:8px;width:32px;height:5px;background:#fff;
box-shadow:0 11px 0 #fff,0 22px 0 #fff;opacity:.9}
h1{font-size:clamp(22px,4vw,34px);margin:0;letter-spacing:-.05em}
h1 span{color:var(--red)}.tag{font-size:12px;color:var(--muted);font-weight:700}
.stats{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.pill{padding:9px 12px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:13px;font-weight:900}
main{margin-top:18px}.panel{background:rgba(255,255,255,.96);border:1px solid #fff;border-radius:28px;
box-shadow:var(--shadow);padding:clamp(20px,5vw,42px)}.hidden{display:none!important}
.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.14em;font-weight:950;color:var(--red)}
h2{font-size:clamp(32px,6vw,55px);line-height:1.01;letter-spacing:-.055em;margin:10px 0 14px}
.lead{font-size:17px;line-height:1.55;color:#555b68;max-width:760px}
.categories{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:25px 0}
.category{min-height:136px;border:2px solid var(--line);background:#fff;border-radius:20px;padding:15px 10px;
cursor:pointer;transition:.17s;color:var(--ink);text-align:center}
.category:hover,.category.selected{transform:translateY(-3px);border-color:var(--red2);box-shadow:0 10px 20px rgba(201,25,46,.12)}
.category.selected{background:#fff2f3}.category .ico{font-size:32px;display:block}.category b{display:block;margin:8px 0 4px}
.category small{color:var(--muted);line-height:1.3;display:block}.actions{display:flex;gap:10px;flex-wrap:wrap}
.primary,.secondary,.hint-btn{border:0;border-radius:15px;padding:14px 20px;font-weight:950;cursor:pointer;transition:.16s}
.primary{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff;box-shadow:0 9px 20px rgba(201,25,46,.25)}
.secondary{background:#fff;border:1px solid var(--line);color:var(--ink)}.hint-btn{background:#fff5c4;border:1px solid #ead469;color:#725b00}
.primary:hover,.secondary:hover,.hint-btn:hover{transform:translateY(-2px)}
.note{font-size:12px;color:var(--muted);line-height:1.45;margin-top:18px}
.topline{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.progress-track{height:12px;background:#eff0f3;border-radius:999px;overflow:hidden;margin:15px 0 24px}
.progress{height:100%;background:linear-gradient(90deg,var(--yellow),var(--red2));transition:.3s}
.question{text-align:center}.direction{font-size:13px;font-weight:850;color:var(--muted)}
.prompt{font-size:clamp(31px,7vw,62px);line-height:1.06;font-weight:1000;letter-spacing:-.045em;
margin:15px auto 10px;max-width:850px}.tools{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}
.speak{border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 13px;cursor:pointer;font-weight:850}
.answers{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:25px}
.answer{min-height:76px;border:2px solid var(--line);background:#fff;border-radius:18px;padding:14px;
font-weight:900;color:var(--ink);cursor:pointer;transition:.15s}.answer:hover:not(:disabled){border-color:#ec8e98;transform:translateY(-2px)}
.answer.correct{border-color:#41a66d;background:#e9f8ef;color:#11673a}.answer.wrong{border-color:#dc7882;background:#fff0f1;color:#9d2733}
.answer:disabled{cursor:default}.feedback{min-height:66px;margin:17px 0 3px;text-align:center;font-size:18px;font-weight:900}
.feedback small{display:block;margin-top:6px;color:var(--muted);font-size:13px;font-weight:650}.next{display:block;margin:auto}
.cluebox{max-width:640px;margin:15px auto 0;padding:12px 15px;border-radius:15px;background:#fff9d9;border:1px solid #ecd978;
font-weight:800;color:#655300}.results{text-align:center}.big{font-size:70px}.scoreline{font-size:22px;font-weight:950;margin:13px 0}
.review{max-width:760px;text-align:left;margin:25px auto 0}.review-item{padding:13px 0;border-bottom:1px solid var(--line)}
.review-item b{color:var(--red)}.boss-shell{text-align:center}.timer{font-size:64px;font-weight:1000;letter-spacing:-.06em;color:var(--red);margin:5px}
.timerbar{height:10px;border-radius:999px;background:#eee;overflow:hidden;max-width:500px;margin:0 auto 18px}
.timerfill{height:100%;background:var(--red);width:100%}.bossword{font-size:clamp(46px,11vw,92px);font-weight:1000;letter-spacing:-.05em;margin:22px 0}
.wordlist{columns:2;column-gap:30px}.word-item{break-inside:avoid;padding:9px 0;border-bottom:1px solid var(--line)}
.footer{text-align:center;padding:17px;color:var(--muted);font-size:12px}
@media(max-width:760px){.app{padding:9px}.categories{grid-template-columns:1fr 1fr}.answers{grid-template-columns:1fr}
header{align-items:flex-start}.pill{font-size:11px;padding:7px 8px}.logo{width:52px;height:40px}.panel{border-radius:22px}.wordlist{columns:1}}

.site-nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-left:auto}.site-nav a{color:var(--ink);text-decoration:none;font-size:13px;font-weight:850;padding:8px 10px;border-radius:999px}.site-nav a:hover{background:#fff2f3;color:var(--red)}
.legal-page{max-width:900px;margin:18px auto}.legal-page h1{font-size:clamp(36px,7vw,62px);line-height:1;letter-spacing:-.055em;margin:10px 0 18px}.legal-page h2{font-size:25px;letter-spacing:-.025em;margin-top:32px}.legal-page p,.legal-page li{line-height:1.7;color:#4f5562}.legal-page ul{padding-left:22px}.legal-page .company-card{background:#fff8df;border:1px solid #eadb99;border-radius:18px;padding:18px;margin:20px 0}.legal-page a{color:var(--red)}
.site-footer{margin-top:18px;background:rgba(255,255,255,.82);border:1px solid #fff;border-radius:20px;padding:18px;text-align:center;color:var(--muted);font-size:12px}.site-footer nav{display:flex;justify-content:center;gap:13px;flex-wrap:wrap;margin-bottom:9px}.site-footer a{color:var(--ink);text-decoration:none;font-weight:800}
.cookie-banner{position:fixed;left:50%;bottom:10px;z-index:1000;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 20px);background:rgba(25,27,37,.96);color:#fff;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:6px 7px 6px 13px;box-shadow:0 8px 24px rgba(0,0,0,.18);display:flex;gap:9px;align-items:center;backdrop-filter:blur(10px)}.cookie-banner p{margin:0;font-size:11px;line-height:1.2;color:#fff;white-space:nowrap}.cookie-banner p strong{font-weight:800}.cookie-banner a{color:#fff;text-decoration:underline;text-underline-offset:2px}.cookie-banner .cookie-actions{display:flex;gap:5px}.cookie-banner .cookie-actions button{min-height:30px;padding:6px 10px;border-radius:999px;font-size:11px;line-height:1;box-shadow:none}.cookie-banner .cookie-actions .secondary{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.45)}.cookie-banner .cookie-actions .primary{background:#fff;color:#191b25;border:1px solid #fff}.cookie-banner.hidden{display:none!important}
@media(max-width:780px){.site-nav{display:none}.cookie-banner{bottom:7px;max-width:calc(100vw - 14px);padding-left:10px;gap:6px}.cookie-banner p{white-space:normal;font-size:10px;max-width:145px}.cookie-banner .cookie-actions{flex-shrink:0}.cookie-banner .cookie-actions button{padding:6px 8px;font-size:10px}}
