@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:600;src:url(./baloo-2-vietnamese-600-normal-C5EqHgu0.woff2)format("woff2"),url(./baloo-2-vietnamese-600-normal-CGkk4Wtx.woff)format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:600;src:url(./baloo-2-latin-600-normal-tIfxVoAe.woff2)format("woff2"),url(./baloo-2-latin-600-normal-B4tNaogw.woff)format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:800;src:url(./baloo-2-vietnamese-800-normal-ConLnEgt.woff2)format("woff2"),url(./baloo-2-vietnamese-800-normal-GQACmpuv.woff)format("woff")}@font-face{font-family:"Baloo 2";font-style:normal;font-display:swap;font-weight:800;src:url(./baloo-2-latin-800-normal-BbF3Etk1.woff2)format("woff2"),url(./baloo-2-latin-800-normal-B8BXfZF7.woff)format("woff")}:root{--sky:#bfe6ff;--ink:#3b2b5c;--ink-soft:#6b5a8e;--cream:#fffaf0;--gold:#ffc94a;--gold-deep:#e89a12;--leaf:#6fc45a;--card:#fffcf5f5;--shadow:0 6px 0 #3b2b5c2e, 0 12px 28px #3b2b5c2e;--font:"Baloo 2", system-ui, sans-serif}*{box-sizing:border-box}html,body{background:var(--sky);height:100%;color:var(--ink);font-family:var(--font);overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;margin:0;overflow:hidden}#game,#ui{position:fixed;inset:0}#ui{pointer-events:none}#ui>*{pointer-events:auto}.screen{padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:2.5vh;display:flex;position:absolute;inset:0}.loading{background:linear-gradient(#7cc8ff,#eaf7ff)}.title{pointer-events:none;justify-content:space-between}.title>*{pointer-events:auto}.title-bottom{flex-direction:column;align-items:center;gap:1vh;display:flex}.logo{color:#fff;text-shadow:0 .06em 0 var(--ink-soft), 0 .1em 0 var(--ink), 0 .16em .3em #3b2b5c59;-webkit-text-stroke:.035em var(--ink);paint-order:stroke fill;margin:0;font-weight:800;line-height:.9}.logo-top{font-size:clamp(36px,11vh,96px);display:block}.logo-bottom{color:#fff3c4;font-size:clamp(24px,7vh,60px);display:block}.bar{border:3px solid var(--ink);background:#ffffffb3;border-radius:999px;width:min(420px,60vw);height:22px;overflow:hidden}.bar-fill{background:linear-gradient(var(--gold), var(--gold-deep));height:100%;transition:width .2s ease-out}.hint{color:var(--ink-soft);margin:0;font-size:clamp(13px,2.6vh,18px);font-weight:600}.btn-play,.btn{font-family:var(--font);color:var(--ink);border:3px solid var(--ink);background:linear-gradient(#ffe48a, var(--gold) 55%, var(--gold-deep));box-shadow:var(--shadow);cursor:pointer;border-radius:999px;font-weight:800;transition:transform 80ms}.btn-play{min-height:48px;padding:.15em 1.6em;font-size:clamp(22px,6vh,40px);animation:1.6s ease-in-out infinite pulse}.btn{min-height:44px;padding:6px 28px;font-size:18px}.btn-play:active,.btn:active{transform:translateY(3px)scale(.98)}@keyframes pulse{50%{transform:scale(1.05)}}.toast{left:50%;bottom:max(16px, env(safe-area-inset-bottom));background:var(--card);border:3px solid var(--ink);width:min(560px,100% - 32px);box-shadow:var(--shadow);text-align:center;border-radius:16px;padding:10px 18px;font-weight:600;position:absolute;transform:translate(-50%)}.dim{background:#1e14328c}.card{background:var(--card);border:3px solid var(--ink);width:min(460px,100%);max-height:100%;box-shadow:var(--shadow);text-align:left;border-radius:22px;padding:18px 22px;overflow:auto}.card h2{text-align:center;margin:0 0 6px;font-size:20px}.card ol{margin:0 0 12px;padding-left:22px;font-weight:600;line-height:1.5}.card .btn{margin:0 auto;display:block}.share-icon{border:2px solid;border-radius:6px;padding:0 4px;font-size:.8em;display:inline-block}.rotate{z-index:10;background:linear-gradient(#7cc8ff,#eaf7ff);font-size:20px;font-weight:800}.rotate p{max-width:300px;margin:0}.phone{border:5px solid var(--ink);background:#fff;border-radius:14px;width:64px;height:108px;animation:2.2s ease-in-out infinite turn;position:relative}.phone-notch{background:var(--ink);border-radius:4px;width:20px;height:5px;margin-left:-10px;position:absolute;top:6px;left:50%}@keyframes turn{0%,25%{transform:rotate(0)}60%,to{transform:rotate(-90deg)}}@media (prefers-reduced-motion:reduce){.btn-play,.phone{animation:none}}