*{box-sizing:border-box}html,body{color:#4a3420;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;background:#fff3e2;height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif}#app{width:100vw;height:100dvh;position:relative;overflow:hidden}#game-container{position:absolute;inset:0}#game-container canvas{touch-action:none;display:block;width:100%!important;height:100%!important}.stage-hidden{display:none!important}ruby{ruby-align:center}rt{color:#8a6a45;-webkit-user-select:none;user-select:none;font-size:.55em;font-style:italic;font-weight:400}#session-progress{color:#7a5636;pointer-events:none;z-index:5;background:#ffffffd9;border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .7rem;font-size:.78rem;font-weight:700;display:flex;position:absolute;top:.6rem;left:.6rem}.progress-dots{gap:.28rem;display:flex}.progress-dot{box-sizing:border-box;background:0 0;border:2px solid #d9a15b;border-radius:999px;width:.5rem;height:.5rem}.progress-dot.done{background:#f0b429;border-color:#f0b429}.progress-dot.current{background:#ffdca0;border-color:#c1401f}#catch-ui-layer{pointer-events:none;flex-direction:column;align-items:center;gap:.3rem;padding:.75rem;display:flex;position:absolute;top:0;left:0;right:0}#meaning-prompt{color:#7a5636;text-align:center;background:#fffc;border-radius:14px;max-width:32rem;margin:0;padding:.4rem .9rem;font-size:.85rem;line-height:1.35}#door-status{color:#8a6a45;min-height:1.1em;font-size:.78rem}#door-hp{color:#c2185b;font-size:.78rem;font-weight:700}#door-hp[data-low=true]{color:#fff;background:#e0164b;border-radius:999px;padding:.2rem .7rem;font-size:1.15rem;animation:.9s ease-in-out infinite hp-low-pulse;box-shadow:0 2px 12px #e0164b8c}@keyframes hp-low-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.15)}}#low-hp-vignette{pointer-events:none;z-index:3;position:fixed;inset:0;box-shadow:inset 0 0 #e0164b00}#low-hp-vignette[data-visible=true]{animation:.9s ease-in-out infinite low-hp-vignette-pulse}@keyframes low-hp-vignette-pulse{0%,to{box-shadow:inset 0 0 3rem .5rem #e0164b4d}50%{box-shadow:inset 0 0 5.5rem 1.5rem #e0164b9e}}#match-ui-layer{pointer-events:none;flex-direction:column;align-items:center;gap:.3rem;padding:.75rem;display:flex;position:absolute;top:0;left:0;right:0}#match-prompt{color:#2f7a52;text-align:center;background:#ffffffd9;border-radius:14px;max-width:32rem;margin:0;padding:.4rem .9rem;font-size:.85rem;line-height:1.35}#match-status{color:#3c8a63;min-height:1.1em;font-size:.78rem}#match-hp{color:#c2185b;font-size:.78rem;font-weight:700}#milestone-round-progress{color:#2f7a52;background:#ffffffd9;border-radius:999px;align-items:center;gap:.4rem;padding:.3rem .7rem;font-size:.75rem;font-weight:700;display:flex}#controls-layer{padding:0 0 calc(1.25rem + env(safe-area-inset-bottom));justify-content:center;display:flex;position:absolute;bottom:0;left:0;right:0}.action-btn{color:#4a3420;touch-action:none;-webkit-user-select:none;user-select:none;background:#f0b429e6;border:none;border-radius:999px;width:4.6rem;height:4.6rem;font-size:1.1rem;font-weight:700}.action-btn:active{background:#d99e1f}#balloon-ui-layer{height:33vh;padding:.75rem .75rem calc(.75rem + env(safe-area-inset-bottom));pointer-events:none;flex-direction:column;justify-content:flex-start;align-items:center;gap:.3rem;display:flex;position:absolute;bottom:0;left:0;right:0}.balloon-instruction{color:#2b5578;text-align:center;background:#ffffffd9;border-radius:14px;max-width:32rem;margin:0;padding:.35rem .9rem;font-size:.8rem}#balloon-prompt{color:#2b5578;text-align:center;background:#ffffffd9;border-radius:14px;max-width:32rem;margin:0;padding:.7rem .9rem .4rem;font-size:1.05rem;font-weight:700;line-height:1.9}#balloon-status{color:#3c6a8c;min-height:1.1em;font-size:.78rem}#balloon-hp{color:#c2185b;font-size:.78rem;font-weight:700}#writing-ui-layer{z-index:4;background:#fff8ef;justify-content:center;align-items:center;padding:1rem;display:flex;position:absolute;inset:0}.writing-card{text-align:center;flex-direction:column;align-items:center;gap:.6rem;width:100%;max-width:22rem;display:flex}.writing-eyebrow{letter-spacing:.03em;text-transform:uppercase;color:#8a6bc2;margin:0;font-size:.8rem;font-weight:600}.writing-meaning{color:#7a5636;margin:0;font-size:.85rem;font-style:italic}.writing-progress{flex-wrap:wrap;justify-content:center;gap:.35rem;margin:0;display:flex}.writing-progress-dot{color:#b8a6d9;background:#fff;border:2px solid #d9c7f0;border-radius:50%;flex:none;justify-content:center;align-items:center;width:1.8rem;height:1.8rem;font-size:.9rem;font-weight:600;transition:background .2s,border-color .2s,color .2s,transform .2s;display:flex}.writing-progress-dot.active{color:#5a3d8a;background:#efe6fa;border-color:#8a6bc2;transform:scale(1.12)}.writing-progress-dot.done{color:#fff;background:#8a6bc2;border-color:#8a6bc2}#writing-status{color:#5a3d8a;min-height:1.4em;margin:0;font-size:1.1rem;font-weight:700}.writing-target{touch-action:none;background:#fff;border:2px solid #d9c7f0;border-radius:16px;width:260px;height:260px;box-shadow:0 8px 20px #5a3d8a26}.writing-hint{color:#7a5636;margin:0;font-size:.85rem;line-height:1.4}.writing-review-btn{margin:0;display:none}.writing-review-btn.visible{display:flex}#writing-feedback{color:#5a3d8a;min-height:1.6em;margin:0;font-size:1.1rem;font-weight:700;display:none}#writing-feedback.visible{display:block}#writing-summary-card .writing-summary-hanzi{color:#4a3420;margin:.9rem 0 .5rem;font-size:1.6rem;font-weight:700;line-height:2.3}#writing-summary-card .writing-summary-rating{margin:.3rem 0 .6rem;font-size:1.3rem}#writing-summary-card .writing-summary-hp{color:#c2185b;margin:0 0 1.25rem;font-size:.95rem;font-weight:600}#cloud-save-btn{z-index:6;color:#7a5636;cursor:pointer;background:#ffffffd9;border:none;border-radius:999px;padding:.35rem .7rem;font-family:inherit;font-size:.78rem;font-weight:700;position:absolute;top:.6rem;right:.6rem}#cloud-save-btn:hover{background:#fffffffa}#cloud-save-btn:focus-visible{outline-offset:2px;outline:2px solid #4a3420}#session-summary-card,#level-intro-card,#writing-summary-card,#balloon-intro-card,#balloon-success-card,#milestone-intro-card,#milestone-round-card,#milestone-final-card,#resurface-card,#match-hint-card,#cloud-save-card{background:#4a342073;justify-content:center;align-items:center;padding:1rem;display:none;position:absolute;inset:0}#session-summary-card.visible,#level-intro-card.visible,#writing-summary-card.visible,#balloon-intro-card.visible,#balloon-success-card.visible,#milestone-intro-card.visible,#milestone-round-card.visible,#milestone-final-card.visible,#resurface-card.visible,#match-hint-card.visible,#cloud-save-card.visible{display:flex}#session-summary-card .card,#level-intro-card .card,#writing-summary-card .card,#balloon-intro-card .card,#balloon-success-card .card,#milestone-intro-card .card,#milestone-round-card .card,#milestone-final-card .card,#resurface-card .card,#match-hint-card .card,#cloud-save-card .card{text-align:center;background:#fff8ef;border-radius:20px;width:100%;max-width:340px;padding:1.75rem 1.5rem;box-shadow:0 12px 30px #4a342040}#level-intro-card .eyebrow,#writing-summary-card .eyebrow,#balloon-intro-card .eyebrow,#milestone-intro-card .eyebrow,#milestone-round-card .eyebrow,#milestone-final-card .eyebrow,#resurface-card .eyebrow,#match-hint-card .eyebrow,#cloud-save-card .eyebrow{letter-spacing:.03em;text-transform:uppercase;color:#b98a4a;margin:0;font-size:.8rem;font-weight:600}#balloon-intro-card .balloon-intro-sentence{color:#2b5578;margin:1.1rem 0 1.25rem;font-size:1.3rem;font-weight:700;line-height:2.1}#milestone-intro-card .milestone-intro-text{color:#4a3420;margin:1.1rem 0 1.25rem;font-size:1rem;line-height:1.5}#milestone-intro-card .milestone-intro-text [data-milestone-intro-count]{color:#2f7a52;font-weight:700}#milestone-round-card .milestone-round-headline{color:#4a3420;margin:.9rem 0 .4rem;font-size:1.1rem;font-weight:700}#milestone-round-card .milestone-round-hp{color:#c2185b;margin:0 0 1.25rem;font-size:1rem;font-weight:600}#milestone-final-card .milestone-final-hp{color:#c2185b;margin:.9rem 0 .4rem;font-size:1.5rem;font-weight:700}#milestone-final-card .milestone-final-trend,#milestone-final-card .milestone-final-best{color:#7a5636;margin:0 0 .4rem;font-size:.9rem}#milestone-final-card .milestone-final-best:not(:empty){margin-bottom:1.25rem}#level-intro-card .intro-meaning-zh{color:#4a3420;margin:1.1rem 0 1rem;font-size:1.3rem;font-weight:700;line-height:2.1}.icon-btn{cursor:pointer;color:inherit;background:0 0;border:none;flex-direction:column;align-items:center;gap:.15rem;margin:0 auto 1rem;font-size:1.6rem;line-height:1;display:flex}.icon-btn .icon-btn-label{color:#b98a4a;font-size:.7rem;font-weight:600}.icon-btn:focus-visible{outline-offset:2px;outline:2px solid #4a3420}#level-intro-card .intro-meaning-en{color:#4a3420;background:#f0b4292e;border-radius:12px;margin:-.4rem 0 1.25rem;padding:.5rem .75rem;font-size:.95rem;line-height:1.4}#level-intro-card .intro-meaning-en.hidden{display:none}#start-level-btn,#writing-continue-btn,#start-balloon-btn,#balloon-continue-btn,#start-milestone-btn,#milestone-round-continue-btn,#milestone-final-continue-btn,#resurface-continue-btn,#match-hint-dismiss-btn{color:#fff8ef;cursor:pointer;background:#c1401f;border:none;border-radius:999px;padding:.65rem 1.6rem;font-size:1rem;font-weight:600}#start-level-btn:hover,#writing-continue-btn:hover,#start-balloon-btn:hover,#balloon-continue-btn:hover,#start-milestone-btn:hover,#milestone-round-continue-btn:hover,#milestone-final-continue-btn:hover,#resurface-continue-btn:hover,#match-hint-dismiss-btn:hover{background:#a83618}#start-level-btn:focus-visible,#writing-continue-btn:focus-visible,#start-balloon-btn:focus-visible,#balloon-continue-btn:focus-visible,#start-milestone-btn:focus-visible,#milestone-round-continue-btn:focus-visible,#milestone-final-continue-btn:focus-visible,#resurface-continue-btn:focus-visible,#match-hint-dismiss-btn:focus-visible{outline-offset:2px;outline:2px solid #4a3420}#match-hint-card .hint-hanzi{color:#4a3420;margin:.9rem 0 1rem;font-size:1.5rem;font-weight:700;line-height:2.3}#match-hint-card .hint-meaning{color:#4a3420;margin:0 0 1.25rem;font-size:1rem;line-height:1.45}#resurface-card .resurface-title{color:#4a3420;margin:.6rem 0 1rem;font-size:1.15rem;line-height:1.4}#resurface-card .resurface-hanzi{color:#4a3420;margin:0 0 .5rem;font-size:1.4rem;font-weight:700}#resurface-card .resurface-meaning{color:#7a5636;margin:0 0 1.1rem;font-size:.95rem;line-height:1.4}#cloud-save-card .cloud-save-text{color:#4a3420;margin:.9rem 0 .6rem;font-size:.9rem;line-height:1.4}#cloud-save-card .cloud-code{letter-spacing:.08em;color:#4a3420;background:#f0b4292e;border-radius:12px;margin:0 0 .9rem;padding:.5rem .75rem;font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:1.4rem;font-weight:700}#cloud-save-card .cloud-restore-label{margin-top:1.1rem}#cloud-save-card .cloud-restore-row{gap:.4rem;margin:0 0 .75rem;display:flex}#cloud-restore-input{text-transform:uppercase;color:#4a3420;background:#fff;border:1px solid #d9a15b;border-radius:10px;flex:1;min-width:0;padding:.5rem .6rem;font-family:ui-monospace,SF Mono,Consolas,monospace;font-size:1rem}#cloud-restore-input:focus-visible{outline-offset:1px;outline:2px solid #4a3420}#cloud-save-card .cloud-status{color:#7a5636;min-height:1.2em;margin:0 0 1rem;font-size:.85rem}#cloud-copy-btn,#cloud-restore-btn{color:#fff8ef;cursor:pointer;background:#c1401f;border:none;border-radius:999px;padding:.55rem 1.1rem;font-family:inherit;font-size:.9rem;font-weight:600}#cloud-copy-btn:hover,#cloud-restore-btn:hover{background:#a83618}#cloud-copy-btn:focus-visible,#cloud-restore-btn:focus-visible{outline-offset:2px;outline:2px solid #4a3420}#cloud-save-card .cloud-close-btn{color:#b98a4a;cursor:pointer;background:0 0;border:none;margin:0 auto;padding:.4rem;font-family:inherit;font-size:.85rem;font-weight:600;display:block}#dev-controls{bottom:calc(6.25rem + env(safe-area-inset-bottom));right:calc(.5rem + env(safe-area-inset-right));z-index:6;flex-direction:column;align-items:flex-end;gap:.3rem;display:flex;position:absolute}#balloon-ui-layer:not(.stage-hidden)~#dev-controls{top:calc(2.6rem + env(safe-area-inset-top));bottom:auto}#dev-controls button{color:#7a5636;cursor:pointer;background:#ffffffb3;border:1px dashed #b98a55;border-radius:6px;max-width:9.5rem;padding:.25rem .5rem;font-family:inherit;font-size:.65rem}#dev-controls button:hover{background:#fffffff2}#balloon-success-card .eyebrow{color:#2f8f5b;margin:0 0 .5rem;font-size:.95rem;font-weight:700}#balloon-success-card .success-hanzi{color:#4a3420;margin:.5rem 0 1rem;font-size:1.5rem;font-weight:700;line-height:2.3}#balloon-success-card .success-label{letter-spacing:.03em;text-transform:uppercase;color:#b98a4a;margin:.7rem 0 .1rem;font-size:.7rem;font-weight:600}#balloon-success-card .success-meaning-zh,#balloon-success-card .success-sentence{color:#4a3420;margin:.4rem 0 0;font-size:1.05rem;font-weight:600;line-height:2.1}#balloon-continue-btn{margin-top:1.25rem}#session-summary-card .headline{margin:0 0 .5rem;font-size:1.1rem;font-weight:700}#session-summary-card .hanzi-list{color:#c1401f;margin:.5rem 0;font-size:1.4rem;font-weight:700}#session-summary-card .subline{color:#7a5636;margin:.5rem 0 0;font-size:.9rem}#play-again-btn{color:#fff8ef;cursor:pointer;background:#c1401f;border:none;border-radius:999px;margin-top:1.25rem;padding:.55rem 1.15rem;font-size:.9rem;font-weight:600}#play-again-btn:hover{background:#a83618}#play-again-btn:focus-visible{outline-offset:2px;outline:2px solid #4a3420}