:root{--bg: #e8eef4;--surface: #ffffff;--accent: #5b9ec9;--text: #1e2d3a;--text-muted: #607080;--btn-primary: #4a8fa8;--btn-phov: #3a7090;--btn-secondary: #7a9eae;--btn-shov: #5a8090;--btn-danger: #c94040;--btn-dhov: #a83030;--win-bg: rgba(232, 238, 244, .9);--ghost-fill: rgba(0,0,0,.04);--ghost-stroke: #6a7e8a;--ghost-opacity: .35;--hole-fill: rgba(0,0,0,.1);--boundary-stroke: #2a3d4a;--boundary-opacity: .75;--r-sm: 6px;--r-md: 12px;--r-lg: 20px;--shadow-sm: 0 1px 4px rgba(0,0,0,.1);--shadow-lg: 0 8px 32px rgba(0,0,0,.16)}[data-theme=dark]{--bg: #18232e;--surface: #1e2d3c;--accent: #6ab8dc;--text: #d4e8f8;--text-muted: #7a9ab0;--btn-primary: #3a7898;--btn-phov: #2a6080;--btn-secondary: #4a7890;--btn-shov: #3a6070;--win-bg: rgba(24, 35, 46, .92);--ghost-fill: rgba(255,255,255,.05);--ghost-stroke: #9ab8cc;--ghost-opacity: .45;--hole-fill: rgba(0,0,0,.28);--boundary-stroke: #7aaec8;--boundary-opacity: .88;--shadow-sm: 0 1px 4px rgba(0,0,0,.3);--shadow-lg: 0 8px 32px rgba(0,0,0,.5);--btn-danger: #d95050;--btn-dhov: #c04040}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;touch-action:manipulation}#root{height:100%}.app{display:flex;flex-direction:column;height:100dvh;max-width:700px;margin:0 auto}.header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--surface);box-shadow:var(--shadow-sm);flex-shrink:0;gap:12px}.header-brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:inherit}.header-icon{width:28px;height:28px;flex-shrink:0}.header-name{font-size:1.1rem;font-weight:700;letter-spacing:-.02em}.header-controls{display:flex;align-items:center;gap:12px}.stat{display:flex;flex-direction:column;align-items:center;gap:1px}.stat-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.07em;color:var(--text-muted)}.stat-value{font-size:.92rem;font-weight:600}.stat-mistakes[data-nonzero=true]{color:#d94f4f}.game-area{flex:1;display:flex;align-items:center;justify-content:center;padding:14px;overflow:hidden}.hex-board{width:100%;height:100%;overflow:visible}.hex-hole{fill:var(--hole-fill);stroke:none;pointer-events:none}.hex-ghost{fill:var(--ghost-fill);stroke:var(--ghost-stroke);stroke-width:1.2;opacity:var(--ghost-opacity);pointer-events:none}.hex-boundary{stroke:var(--boundary-stroke);stroke-width:3.5;stroke-linecap:round;pointer-events:none;opacity:var(--boundary-opacity)}.hex-tile{cursor:pointer;outline:none;-webkit-tap-highlight-color:transparent}.hex-tile:focus-visible .hex-cell{stroke:var(--accent);stroke-width:3}.hex-cell{stroke:#0000002e;stroke-width:1.5;transition:filter .16s ease}.hex-tile.hex-slideable:hover .hex-cell{filter:brightness(.87)}.hex-tile.hex-slideable:active .hex-cell{filter:brightness(.76)}.hex-tile.hex-blocked{cursor:default}.hex-arrow line{stroke:#000c}.hex-arrowhead{fill:#000c;stroke:none}.hex-tile.shaking{animation:shake .4s ease-out}@keyframes shake{0%{transform:translate(0)}15%{transform:translate(-5px)}30%{transform:translate(5px)}45%{transform:translate(-4px)}60%{transform:translate(4px)}75%{transform:translate(-2px)}90%{transform:translate(2px)}to{transform:translate(0)}}.footer{display:flex;align-items:center;justify-content:center;gap:12px;padding:12px 16px;background:var(--surface);box-shadow:0 -1px 4px #00000014;flex-shrink:0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;min-height:44px;border:none;border-radius:var(--r-sm);font-size:.9rem;font-weight:600;cursor:pointer;transition:background .16s ease,transform .1s ease,opacity .16s ease;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.btn:active{transform:scale(.96)}.btn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}.btn-primary{background:var(--btn-primary);color:#fff}.btn-primary:hover{background:var(--btn-phov)}.btn-secondary{background:var(--btn-secondary);color:#fff}.btn-secondary:hover{background:var(--btn-shov)}.btn-ghost{background:transparent;color:var(--text);padding:8px 12px}.btn-ghost:hover{background:#00000012}.btn-icon{padding:8px 10px;font-size:1rem}.btn-large{padding:12px 32px;font-size:1rem;border-radius:var(--r-md)}.btn--active{color:var(--accent)}.btn-danger{background:var(--btn-danger);color:#fff}.btn-danger:hover{background:var(--btn-dhov)}.app--paused .game-area{filter:grayscale(1) brightness(.55);pointer-events:none}.app--paused .header{opacity:.45;pointer-events:none}.app--paused .footer{opacity:.7}.pause-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:100}.pause-card{background:var(--surface);border-radius:var(--r-lg);padding:36px 44px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;align-items:center;gap:14px;animation:slideUp .2s ease-out;min-width:240px}.pause-title{font-size:1.4rem;font-weight:700;margin-bottom:4px}.pause-actions{display:flex;flex-direction:column;gap:10px;width:100%}.pause-btn{width:100%}.best-rate{font-size:.88rem;color:var(--text-muted)}.best-rate--new{font-weight:700;color:#e09838}.sw-update-banner{position:fixed;bottom:16px;left:50%;transform:translate(-50%);background:var(--surface);color:var(--text);border-radius:var(--r-sm);box-shadow:var(--shadow-lg);padding:10px 18px;font-size:.88rem;z-index:200;white-space:nowrap}.sw-update-btn{background:none;border:none;color:var(--accent);font-weight:700;cursor:pointer;font-size:inherit;padding:0;text-decoration:underline}.giveup-icon{color:#c94040}.giveup-remaining{font-size:1.1rem;font-weight:600;color:var(--text)}.giveup-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.win-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:var(--win-bg);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:100;animation:fadeIn .3s ease-out}.win-card{background:var(--surface);border-radius:var(--r-lg);padding:40px 48px;text-align:center;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;align-items:center;gap:16px;animation:slideUp .3s ease-out}.win-icon{font-size:3.2rem;color:var(--accent)}.win-card h2{font-size:1.55rem;font-weight:700}.win-stars{font-size:1.6rem;color:#f0b429;letter-spacing:.05em}.win-moves{font-size:.95rem;color:var(--text-muted)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@media (max-width: 480px){.header-name{font-size:.95rem}.header-controls{gap:8px}.win-card{padding:32px 24px}.win-card h2{font-size:1.3rem}}@media (prefers-reduced-motion: reduce){.hex-tile.shaking,.win-overlay,.win-card{animation:none}.hex-cell,.btn{transition:none}}