@font-face{font-family:Quicksand Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(./quicksand-vietnamese-wght-normal-ei70gACF.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Quicksand Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(./quicksand-latin-ext-wght-normal-CrJ75Ewg.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Quicksand Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(./quicksand-latin-wght-normal-Buj9m_3d.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--bg: #fffcf6;--surface: #fff8ee;--board-frame: #2e2412;--grid-line: rgba(0, 0, 0, .1);--text: #3a3024;--text-soft: #8a7e6c;--gold: #f4b82a;--gold-edge: #d99a00;--gold-soft: #fce3b0;--btn-bg: #ece4d6;--btn-text: #6e6354;--btn-accent-bg: #f4c73a;--btn-accent-text: #6e5310;--x-color: rgba(35, 25, 10, .5);--danger: #e5484d;--success: #2fae7a;--region-0: #4da6f2;--region-1: #46cb8e;--region-2: #b07bef;--region-3: #f2c63a;--region-4: #f56fa8;--region-5: #2fc2bd;--region-6: #97d43c;--region-7: #ef5d6e;--region-8: #6e7be8;--region-9: #5fd6e0;--region-10: #e45fc0;--region-11: #c4d24a;--radius-board: 16px;--radius-card: 22px;--radius-btn: 16px}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{background:var(--bg);color:var(--text);font-family:Quicksand Variable,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;overscroll-behavior:none}#root{min-height:100%;display:flex;justify-content:center}.app{width:100%;max-width:480px;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}.screen{flex:1;display:flex;flex-direction:column;gap:14px;padding:14px 18px 22px}.app-header{display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:9px}.brand-badge{width:36px;height:36px;border-radius:13px;background:var(--gold);box-shadow:inset 0 0 0 2px var(--gold-edge);color:#fff;display:flex;align-items:center;justify-content:center}.brand-badge svg{width:22px;height:22px}.brand-name{font-size:22px;font-weight:700;letter-spacing:.5px}.level-pill{font-size:13px;font-weight:600;color:#6b7a8a;background:#e5eef6;padding:6px 14px;border-radius:999px}.board-wrap{display:flex;justify-content:center}.board{display:grid;width:100%;border:2.5px solid var(--board-frame);border-radius:var(--radius-board);overflow:hidden;touch-action:manipulation;-webkit-user-select:none;user-select:none}.cell{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:0;border:none;background:transparent;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;-webkit-user-select:none;transition:transform .08s ease}.cell:active{transform:scale(.9)}.cell-conflict{animation:shake .25s ease;z-index:2}.cell-conflict:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;box-shadow:inset 0 0 0 3px var(--danger);pointer-events:none}.piece-king{width:72%;height:72%;border-radius:50%;background:var(--gold);box-shadow:inset 0 0 0 2px var(--gold-edge);color:#fff;display:flex;align-items:center;justify-content:center;animation:pop .25s cubic-bezier(.34,1.56,.64,1)}.piece-king svg{width:60%;height:60%}.piece-mark{width:42%;height:42%;color:var(--x-color);display:flex;align-items:center;justify-content:center;animation:fadein .15s ease}.piece-mark svg{width:100%;height:100%}.status-row{display:flex;align-items:center;justify-content:space-between;padding:0 4px;font-size:14px}.status-row .label{color:var(--text-soft);font-weight:600}.status-row .value{font-weight:700}.toolbar{display:flex;gap:10px}.tool-btn{flex:1;border:none;border-radius:var(--radius-btn);padding:13px 0;font-family:inherit;font-size:15px;font-weight:700;color:var(--btn-text);background:var(--btn-bg);display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;transition:transform .08s ease,opacity .15s ease}.tool-btn svg{width:19px;height:19px}.tool-btn:active{transform:scale(.96)}.tool-btn:disabled{opacity:.4;cursor:default}.tool-btn-accent{background:var(--btn-accent-bg);color:var(--btn-accent-text)}.win-banner{margin-top:4px;text-align:center;font-weight:700;font-size:18px;color:var(--success)}@keyframes pop{0%{transform:scale(0)}70%{transform:scale(1.15)}to{transform:scale(1)}}@keyframes fadein{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}.hint-ring{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:3}.hint-ring-x{animation:hintWhite 1.4s ease-in-out infinite}.hint-ring-place{animation:hintGold 1.1s ease-in-out infinite}.hint-ring-bad{animation:hintRed .9s ease-in-out infinite}@keyframes hintWhite{0%,to{box-shadow:inset 0 0 #fff0}50%{box-shadow:inset 0 0 0 3px #fffffff2}}@keyframes hintGold{0%,to{box-shadow:inset 0 0 #f4b82a00}50%{box-shadow:inset 0 0 0 4px var(--gold)}}@keyframes hintRed{0%,to{box-shadow:inset 0 0 #e5484d00}50%{box-shadow:inset 0 0 0 3px var(--danger)}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#281e0f73;display:flex;align-items:center;justify-content:center;padding:24px;z-index:50;animation:overlayIn .18s ease}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}.modal-card{background:var(--surface);border-radius:var(--radius-card);padding:26px 24px 22px;width:100%;max-width:340px;text-align:center;box-shadow:0 18px 44px #281e0f47;animation:cardIn .22s cubic-bezier(.34,1.56,.64,1)}@keyframes cardIn{0%{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}.modal-icon{width:52px;height:52px;border-radius:18px;background:var(--gold-soft);color:var(--gold-edge);display:flex;align-items:center;justify-content:center;margin:0 auto 12px}.modal-icon svg{width:28px;height:28px}.modal-title{margin:0 0 8px;font-size:22px;font-weight:700;color:var(--text)}.modal-swatch{display:inline-block;width:22px;height:22px;border-radius:7px;box-shadow:inset 0 0 0 2px #0000001f;margin-bottom:10px;vertical-align:middle}.modal-text{margin:0 0 18px;font-size:15.5px;line-height:1.55;color:var(--text-soft);font-weight:500}.modal-btn{width:100%;border:none;border-radius:var(--radius-btn);padding:14px 0;font-family:inherit;font-size:16px;font-weight:700;color:var(--btn-text);background:var(--btn-bg);cursor:pointer;transition:transform .08s ease}.modal-btn:active{transform:scale(.97)}.modal-btn-gold{background:var(--gold);color:#fff;box-shadow:inset 0 0 0 2px var(--gold-edge)}.win-crown{width:64px;height:64px;border-radius:50%;background:var(--gold);box-shadow:inset 0 0 0 3px var(--gold-edge);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;animation:pop .4s cubic-bezier(.34,1.56,.64,1)}.win-crown svg{width:34px;height:34px}.win-time{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 16px}.win-time-value{font-size:26px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}.win-best{font-size:12px;font-weight:700;color:var(--btn-accent-text);background:var(--btn-accent-bg);padding:4px 11px;border-radius:999px}.icon-btn{width:38px;height:38px;border-radius:12px;border:none;background:var(--btn-bg);color:var(--btn-text);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .08s ease}.icon-btn:active{transform:scale(.92)}.icon-btn svg{width:22px;height:22px}.topbar-title{font-size:18px;font-weight:700;color:var(--text)}.header-spacer{width:38px}.home{gap:18px}.home-hero{text-align:center;padding:18px 0 4px}.home-crown{width:84px;height:84px;border-radius:28px;background:var(--gold);box-shadow:inset 0 0 0 3px var(--gold-edge);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;animation:pop .4s cubic-bezier(.34,1.56,.64,1)}.home-crown svg{width:46px;height:46px}.home-title{margin:0 0 6px;font-size:38px;font-weight:700;letter-spacing:.5px;color:var(--text)}.home-tag{margin:0 auto;max-width:300px;font-size:15px;line-height:1.5;font-weight:500;color:var(--text-soft)}.home-continue{border:none;border-radius:var(--radius-btn);padding:16px;font-family:inherit;font-size:16px;font-weight:700;color:#fff;background:var(--gold);box-shadow:inset 0 0 0 2px var(--gold-edge);cursor:pointer;transition:transform .08s ease}.home-continue:active{transform:scale(.98)}.home-section{font-size:14px;font-weight:700;color:var(--text-soft);margin-top:4px;padding-left:2px}.size-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.size-card{border:none;border-radius:var(--radius-card);background:var(--surface);box-shadow:inset 0 0 0 1.5px #4a3b2a14;padding:18px 16px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;cursor:pointer;font-family:inherit;transition:transform .08s ease}.size-card:active{transform:scale(.97)}.size-card-title{font-size:22px;font-weight:700;color:var(--text)}.size-card-sub{font-size:13px;font-weight:600;color:var(--text-soft)}.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding-bottom:8px}.level-tile{position:relative;aspect-ratio:1 / 1;border:none;border-radius:var(--border-radius-md, 14px);border-radius:14px;background:var(--surface);box-shadow:inset 0 0 0 1.5px #4a3b2a14;color:var(--text);font-family:inherit;font-size:17px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .08s ease}.level-tile:active{transform:scale(.92)}.level-tile.solved{background:var(--gold-soft);box-shadow:inset 0 0 0 1.5px var(--gold)}.diff-dot{position:absolute;top:6px;right:6px;width:7px;height:7px;border-radius:50%}.diff-easy{background:#46cb8e}.diff-medium{background:#f2c63a}.diff-hard{background:#ef5d6e}.level-check{position:absolute;bottom:5px;color:var(--gold-edge)}.level-check svg{width:14px;height:14px}.modal-btn-text{background:transparent;color:var(--text-soft);margin-top:8px;padding:10px 0}.stats-bar{display:flex;gap:10px}.stat{flex:1;background:var(--surface);box-shadow:inset 0 0 0 1.5px #4a3b2a14;border-radius:var(--radius-btn);padding:9px 14px;display:flex;align-items:baseline;justify-content:space-between}.stat-label{font-size:13px;font-weight:700;color:var(--text-soft)}.stat-value{font-size:18px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}.tutorial-card{position:relative;max-width:360px}.tutorial-skip{position:absolute;top:14px;right:14px;border:none;background:transparent;color:var(--text-soft);font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;padding:4px 6px}.tutorial-visual{min-height:150px;display:flex;align-items:center;justify-content:center;margin:8px 0 18px}.tutorial-dots{display:flex;justify-content:center;gap:7px;margin-bottom:16px}.tutorial-dot{width:7px;height:7px;border-radius:50%;background:#4a3b2a2e;transition:background .2s ease,transform .2s ease}.tutorial-dot.active{background:var(--gold);transform:scale(1.25)}.tutorial-nav{display:flex;gap:10px}.mini-board{display:inline-grid;border:2.5px solid var(--board-frame);border-radius:12px;overflow:hidden}.mini-cell{position:relative;box-sizing:border-box;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center}.mini-king{width:74%;height:74%;border-radius:50%;background:var(--gold);box-shadow:inset 0 0 0 2px var(--gold-edge);color:#fff;display:flex;align-items:center;justify-content:center}.mini-king svg{width:60%;height:60%}.mini-mark{width:42%;height:42%;color:var(--x-color);display:flex}.mini-mark svg{width:100%;height:100%}.mini-bad-ring{position:absolute;top:0;right:0;bottom:0;left:0;box-shadow:inset 0 0 0 3px var(--danger);animation:hintRed .9s ease-in-out infinite}.tap-demo{display:flex;align-items:center;gap:12px}.tap-cell{width:56px;height:56px;border-radius:13px;background:var(--region-9);box-shadow:inset 0 0 0 1.5px #00000014;display:flex;align-items:center;justify-content:center}.tap-arrow{font-size:22px;color:var(--text-soft)}.tools-demo{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.tools-chip{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:var(--radius-btn);background:var(--btn-bg);color:var(--btn-text);font-size:14px;font-weight:700}.tools-chip svg{width:17px;height:17px}.tools-chip-gold{background:var(--btn-accent-bg);color:var(--btn-accent-text)}.home-howto{align-self:center;margin-top:6px;border:none;background:transparent;color:var(--text-soft);font-family:inherit;font-size:15px;font-weight:700;cursor:pointer;padding:8px 12px}