:root{--kd-navy:#1b2a4a;--kd-gold:#f59e0b;--kd-gold-dk:#b45309;--kd-green:#10b981;--kd-red:#ef4444;--kd-blue:#3b82f6;--font-main:"Nunito", system-ui, -apple-system, sans-serif;--r-lg:20px;--r-md:14px;--r-sm:8px}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}html,body{width:100%;height:100%;font-family:var(--font-main);color:var(--kd-navy);background:#0f172a;overflow:hidden}.game-container{background:#0f172a;width:100vw;height:100dvh;position:relative;overflow:hidden}#game-root{justify-content:center;align-items:center;width:100%;height:100%;display:flex}#game-root canvas{object-fit:contain;max-width:100%;max-height:100%;display:block;box-shadow:0 10px 30px #00000080}.game-hud{z-index:50;pointer-events:none;justify-content:space-between;align-items:center;gap:12px;display:flex;position:absolute;top:12px;left:12px;right:12px}.game-hud>*{pointer-events:auto}.hud-left,.hud-right{align-items:center;gap:10px;display:flex}.hud-back-btn,.hud-icon-btn{width:42px;height:42px;-webkit-backdrop-filter:var(--family-blur);backdrop-filter:var(--family-blur);color:var(--kd-navy);cursor:pointer;background:#ffffffe6;border:2px solid #e2e8f0;border-radius:50%;justify-content:center;align-items:center;font-size:1.15rem;font-weight:900;text-decoration:none;transition:transform .15s,background-color .15s;display:flex;box-shadow:0 4px 12px #00000026}.hud-back-btn:hover,.hud-icon-btn:hover{background:#fff;transform:scale(1.08)}.hud-title-wrap{-webkit-backdrop-filter:var(--family-blur);backdrop-filter:var(--family-blur);background:#ffffffeb;border:2px solid #e2e8f0;border-radius:999px;align-items:center;gap:8px;padding:6px 14px;display:flex;box-shadow:0 4px 12px #0000001f}.hud-game-icon{font-size:1.3rem}.hud-game-title{color:var(--kd-navy);font-size:.92rem;font-weight:900;line-height:1.1}.hud-hw-title{color:#64748b;white-space:nowrap;text-overflow:ellipsis;max-width:180px;font-size:.72rem;font-weight:700;overflow:hidden}.prompt-banner{z-index:45;color:#fff;border:3px solid var(--kd-gold);text-align:center;pointer-events:none;background:linear-gradient(135deg,#1e293b,#0f172a);border-radius:999px;justify-content:center;align-items:center;max-width:min(720px,92vw);padding:14px 32px;animation:.3s ease-out bannerPop;display:flex;position:absolute;top:84px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #00000073}.prompt-text{letter-spacing:.3px;min-width:0;font-size:1.75rem;font-weight:900}.prompt-banner .kv-speak{--kv-size:36px;pointer-events:auto;margin-left:10px}@keyframes bannerPop{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.hearts-hud,.score-hud,.progress-hud{-webkit-backdrop-filter:var(--family-blur);backdrop-filter:var(--family-blur);color:var(--kd-navy);background:#ffffffeb;border:2px solid #e2e8f0;border-radius:999px;align-items:center;gap:4px;padding:6px 14px;font-size:.92rem;font-weight:900;display:flex;box-shadow:0 4px 12px #0000001f}.score-hud{color:#b45309}.progress-hud{color:#2563eb}.touch-controls{z-index:40;pointer-events:none;justify-content:space-between;align-items:flex-end;display:flex;position:absolute;bottom:20px;left:20px;right:20px}.touch-controls>*{pointer-events:auto}.d-pad{flex-direction:column;align-items:center;gap:6px;display:flex}.d-pad-row{gap:8px;display:flex}.touch-btn{width:60px;height:60px;-webkit-backdrop-filter:var(--family-blur);backdrop-filter:var(--family-blur);color:var(--kd-navy);touch-action:manipulation;background:#ffffffd9;border:2px solid #cbd5e1;border-radius:50%;justify-content:center;align-items:center;font-size:1.4rem;font-weight:900;display:flex;box-shadow:0 6px 16px #0003}.touch-btn:active{background:#fff;transform:scale(.92)}.action-jump{background:var(--kd-gold);color:#fff;border-color:#fde68a;width:72px;height:72px;font-size:1.8rem}.overlay-layer{-webkit-backdrop-filter:var(--family-blur);backdrop-filter:var(--family-blur);z-index:100;background:#0f172ad1;justify-content:center;align-items:center;padding:20px;animation:.25s ease-out fadeIn;display:flex;position:absolute;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.overlay-card{border-radius:var(--r-lg);text-align:center;background:#fff;border:3px solid #e2e8f0;width:100%;max-width:480px;padding:32px;animation:.3s cubic-bezier(.175,.885,.32,1.275) slideUp;box-shadow:0 20px 40px #00000059}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}.intro-icon,.celebration-icon,.gameover-icon{margin-bottom:12px;font-size:3.8rem}.intro-title,.overlay-card h2{color:var(--kd-navy);margin-bottom:8px;font-size:1.8rem;font-weight:900}.intro-sub,.completion-sub{color:#64748b;margin-bottom:20px;font-size:1rem}.intro-info-pills{flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:24px;display:flex}.info-pill{color:#475569;background:#f1f5f9;border:1.5px solid #e2e8f0;border-radius:999px;padding:5px 12px;font-size:.82rem;font-weight:800}.btn-cta{border-radius:var(--r-md);color:#fff;cursor:pointer;background:linear-gradient(135deg,#f59e0b,#d97706);border:none;width:100%;padding:14px 24px;font-size:1.15rem;font-weight:900;text-decoration:none;transition:transform .15s,filter .15s;display:inline-block;box-shadow:0 6px 18px #f59e0b59}.btn-cta:hover{filter:brightness(1.06);transform:translateY(-2px)}.btn-secondary{border-radius:var(--r-md);width:100%;color:var(--kd-navy);cursor:pointer;background:#f1f5f9;border:1.5px solid #cbd5e1;padding:12px 20px;font-size:.95rem;font-weight:800;text-decoration:none;transition:background .15s;display:block}.btn-secondary:hover{background:#e2e8f0}.intro-hint{color:#94a3b8;margin-top:14px;font-size:.8rem;font-weight:700}.stats-grid{grid-template-columns:1fr 1fr;gap:12px;margin:20px 0 24px;display:grid}.stat-box{border-radius:var(--r-md);background:#f8fafc;border:1.5px solid #e2e8f0;padding:12px}.gold-box{background:#fef3c7;border-color:#fde68a}.stat-label{color:#64748b;text-transform:uppercase;margin-bottom:2px;font-size:.75rem;font-weight:800;display:block}.stat-val{color:var(--kd-navy);font-size:1.35rem;font-weight:900}.gold-box .stat-val{color:#b45309}.overlay-actions{flex-direction:column;gap:10px;display:flex}.read-first-card{text-align:left;flex-direction:column;max-width:600px;max-height:85vh;display:flex}.read-first-header{align-items:center;gap:10px;margin-bottom:12px;display:flex}.read-first-icon{font-size:2.2rem}.read-first-title{color:var(--kd-navy);font-size:1.4rem;font-weight:900;line-height:1.2}.read-first-badge{color:#0369a1;background:#e0f2fe;border-radius:999px;margin-bottom:10px;padding:3px 10px;font-size:.75rem;font-weight:800;display:inline-block}.reading-story-box{border-radius:var(--r-md);color:#334155;white-space:pre-wrap;-webkit-user-select:text;user-select:text;background:#f8fafc;border:1.5px solid #e2e8f0;max-height:42vh;margin-bottom:18px;padding:18px;font-size:1.02rem;line-height:1.65;overflow-y:auto}.read-first-hint{color:#64748b;text-align:center;margin-bottom:16px;font-size:.85rem;font-weight:700}@media (width<=640px){.hud-hw-title{display:none}.prompt-text{font-size:1.15rem}.prompt-banner{padding:10px 18px;top:68px}.read-first-card{max-height:90vh;padding:20px}.reading-story-box{max-height:38vh;font-size:.95rem}}