*{box-sizing:border-box}html{background:#061226;color:#f2f7ff;font-family:system-ui,-apple-system,Segoe UI,sans-serif}body{margin:0;background:radial-gradient(circle at 50% 0,#183d66 0,#07162e 45%,#061226 100%);min-height:100vh}a{color:inherit;text-decoration:none}header{max-width:1120px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px}header .brand{font-weight:900;letter-spacing:.03em}header b{color:#ffd46b}nav{display:flex;flex-wrap:wrap;gap:16px;font-size:14px}nav a:hover,.go{color:#ffd46b}main{max-width:1120px;margin:auto;padding:12px 20px 50px}.hero{border:1px solid #365477;border-radius:22px;background:linear-gradient(120deg,#123963,#073253);padding:48px 34px;margin:16px 0 28px}.eyebrow{color:#ffd46b;font-size:12px;letter-spacing:3px}h1{font-size:clamp(30px,5vw,58px);margin:10px 0}p{line-height:1.6;color:#bfd2e7}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.card{background:#102b48;border:1px solid #305576;border-radius:18px;padding:24px;min-height:145px;transition:transform .15s}.card:hover{transform:translateY(-3px);border-color:#65d5ff}.card h2{margin:8px 0}.card p{margin:0 0 15px}.emoji{font-size:40px}.info{margin-top:40px}.game-head{margin-bottom:16px}.game-head h1{font-size:clamp(28px,4vw,42px)}.toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.toolbar label{display:flex;gap:8px;align-items:center}.toolbar select,.toolbar button{background:#173b5e;color:#fff;border:1px solid #5780a0;border-radius:9px;padding:10px;font:inherit}.toolbar button{background:#ffd46b;color:#152336;border:0;font-weight:800;cursor:pointer}.score{font-weight:700;color:#fff}.canvas-wrap{width:100%;max-width:900px;margin:auto;border:3px solid #397eae;border-radius:16px;overflow:hidden;background:#1a77a0}canvas{width:100%;height:auto;display:block;touch-action:none}.touch{display:flex;justify-content:center;gap:12px;margin:18px 0}.touch button{touch-action:none;user-select:none;min-width:68px;min-height:55px;border:1px solid #5b9cc0;border-radius:12px;background:#164265;color:white;font-size:17px;font-weight:800}.note{font-size:13px}footer{text-align:center;padding:30px;color:#8ca9c2;font-size:12px}@media(max-width:650px){header{align-items:flex-start;flex-direction:column;padding:16px}nav{gap:12px}.hero{padding:28px 22px}.touch button{min-width:55px;flex:1}}

.touch{flex-wrap:wrap}.touch button{cursor:pointer;touch-action:none}.touch button:active{background:#2678a6;transform:scale(.97)}.game-head p{max-width:900px}@media(max-width:650px){.touch{gap:6px}.touch button{min-width:50px;min-height:52px;padding:8px 10px}.canvas-wrap{border-width:1px}}

/* v4 cheerful seaside arcade */
body{background:linear-gradient(145deg,#062d6a 0%,#087cbd 43%,#00b3bd 100%);background-attachment:fixed}header{background:#ffffff16;border-radius:0 0 22px 22px}.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#ffdc74,#ff9d8b 42%,#64dbf2);color:#153456;border:3px solid #fff9;box-shadow:0 12px 35px #022e6370}.hero p{color:#194665}.hero .eyebrow{color:#7a3066;font-weight:900}.hero-art{font-size:clamp(24px,4vw,46px);letter-spacing:8px;margin-bottom:16px}.card{background:linear-gradient(145deg,#fffef1,#d8f9ff);color:#133d65;border:3px solid #ffffff;border-bottom:7px solid #ffbd64;box-shadow:0 7px 0 #074d7a50}.card p{color:#386782}.card:hover{transform:translateY(-5px) rotate(-.5deg);border-color:#ffdb73}.card .go{color:#d65d44;font-weight:900}.info h2{color:#fff}.game-head{background:#ffffff18;border-radius:16px;padding:14px}.game-head p{color:#e7faff}

.reverse-flash{animation:reverseFlash .5s ease-out}@keyframes reverseFlash{0%,45%{box-shadow:0 0 0 9px #f73a5f;filter:hue-rotate(150deg)}100%{box-shadow:none;filter:none}}
