:root{--ink:#f7f2ff;--muted:#b9b2cf;--acid:#d9ff43;--pink:#ff4fa3;--bg:#151329}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 20% 0,#33235c 0,transparent 35%),var(--bg);color:var(--ink);font-family:Arial Black,Arial,sans-serif;min-height:100vh}
.shell{width:min(1500px,100%);margin:auto;padding:20px;min-height:100vh}
header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #ffffff1c;padding:5px 0 18px}
.brand{line-height:.9;transform:rotate(-2deg);font-size:14px}
.brand span{display:block;color:var(--acid);letter-spacing:.25em}
.brand strong{font-size:20px}
.stats{display:flex;gap:24px;font:12px Arial,sans-serif;color:var(--muted);letter-spacing:.08em}
.stats b{display:block;color:white;font:18px Arial Black,Arial}
.intro,.result{max-width:680px;margin:8vh auto;text-align:center;background:linear-gradient(145deg,#292349,#1e1a38);border:1px solid #ffffff1f;border-radius:32px;padding:clamp(28px,6vw,70px);box-shadow:0 30px 80px #08071199}
.mascot,.trophy{font-size:90px;filter:drop-shadow(0 15px 16px #0008);animation:float 2.5s ease-in-out infinite}
.eyebrow{font-size:12px;letter-spacing:.19em;color:var(--acid)}
h1,h2{font-size:clamp(34px,7vw,72px);line-height:.95;margin:18px 0}
.intro>p:not(.eyebrow){font:18px/1.6 Arial,sans-serif;color:var(--muted);max-width:520px;margin:0 auto 30px}
button{appearance:none;border:0;border-radius:99px;background:var(--acid);color:#18152c;font:16px Arial Black,Arial;padding:18px 26px;cursor:pointer;box-shadow:0 8px 0 #879d25;transition:.15s transform}
button:hover{transform:translateY(-2px)}
button:active{transform:translateY(5px);box-shadow:0 3px 0 #879d25}
.round-head{display:flex;justify-content:space-between;align-items:end;margin:22px 0 12px}
.round-head p{margin:0;color:var(--acid);font-size:12px;letter-spacing:.15em}
.round-head h2{font-size:clamp(26px,4vw,44px);margin:5px 0 0}
.round-head #hint{font:15px Arial;color:var(--muted);letter-spacing:0}
.board{position:relative;overflow:hidden;border-radius:20px;background:#070613;border:2px solid #ffffff24;box-shadow:0 25px 70px #090816aa;aspect-ratio:16/9;user-select:none;cursor:crosshair}
.board img{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}
.miss-mark{position:absolute;width:30px;height:30px;transform:translate(-50%,-50%);pointer-events:none}
.miss-mark:before,.miss-mark:after{content:"";position:absolute;top:14px;left:2px;width:26px;height:3px;background:#ff355d;border-radius:4px;box-shadow:0 1px 5px #000}
.miss-mark:before{transform:rotate(45deg)}
.miss-mark:after{transform:rotate(-45deg)}
.found-marker{display:none;position:absolute;width:7%;aspect-ratio:1;border:5px solid var(--acid);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 4px #17152ecc,0 0 28px var(--acid);pointer-events:none}
.found-marker.show{display:block;animation:pop .55s ease}
.hidden{display:none}
.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,100px);background:var(--pink);padding:14px 22px;border-radius:99px;box-shadow:0 10px 30px #0008;transition:.25s;font:14px Arial Black;z-index:5}
.toast.show{transform:translate(-50%,0)}
.score{margin:24px auto 34px;border:2px solid #ffffff22;border-radius:20px;padding:20px;max-width:280px}
.score span,.score small{display:block;color:var(--muted);font:12px Arial;letter-spacing:.1em}
.score strong{display:block;font-size:56px;color:var(--acid)}
@keyframes float{50%{transform:translateY(-10px) rotate(3deg)}
}
@keyframes pop{0%{transform:translate(-50%,-50%) scale(.2)}
65%{transform:translate(-50%,-50%) scale(1.35)}
100%{transform:translate(-50%,-50%) scale(1)}
}
@media(max-width:650px){.shell{padding:10px}
header{align-items:flex-start}
.stats{gap:10px}
.stats span:first-child{display:none}
.board{border-radius:12px}
.round-head{align-items:start}
.round-head #hint{display:none}
.intro,.result{margin:5vh auto;border-radius:24px}
.brand strong{font-size:15px}
}
.part-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 auto 26px;max-width:560px}
.part-picker .part{border-radius:16px;padding:13px 16px;background:#17152c;color:var(--muted);box-shadow:none;border:2px solid #ffffff22;font-size:14px}
.part-picker .part small{display:block;font:11px Arial;letter-spacing:.16em;margin-bottom:4px}
.part-picker .part.active{border-color:var(--acid);color:white;background:#302a4d}
.part-picker .hard.active{border-color:var(--pink)}
button.secondary{display:block;margin:18px auto 0;background:transparent;color:var(--muted);border:1px solid #ffffff33;box-shadow:none;padding:12px 18px;font-size:12px}
.round-tools{text-align:right}.answer-button{margin-top:10px;padding:9px 14px;font-size:12px;background:transparent;color:var(--acid);border:1px solid #d9ff4377;box-shadow:none}.answer-button:hover{transform:none;background:#d9ff4315}.found-marker.answer{border-color:var(--pink);box-shadow:0 0 0 4px #17152ecc,0 0 32px var(--pink)}
