:root{--panel-bg:#18120ed1;--panel-border:#f5d28c47;--text-main:#f6ead2;--text-soft:#cdbb9b;--accent-white-team:#f2c14e;--accent-black-team:#9a86d8;--alert:#ff7a5c;--happy:#7ed67e;--chrome-surface:var(--panel-bg);--chrome-ink:var(--text-main);--chrome-shadow:#00000059}html,body{background:#2a2320}html{height:100%}body{min-height:100%}#app{width:100%;height:100dvh;position:relative;overflow:hidden}#game-canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}#top-bar{top:calc(10px + var(--safe-top));z-index:5;align-items:center;gap:10px;display:flex;position:absolute;left:50%;transform:translate(-50%)}#turn-badge{background:var(--panel-bg);border:2px solid var(--accent-white-team);color:var(--text-main);white-space:nowrap;border-radius:999px;padding:10px 18px;font-size:1rem;font-weight:700}#turn-badge[data-side=b]{border-color:var(--accent-black-team)}#undo-button{border:2px solid var(--panel-border);background:var(--panel-bg);color:var(--text-main);cursor:pointer;white-space:nowrap;border-radius:999px;min-height:44px;padding:10px 16px;font-size:1rem;font-weight:700}#home-button{border:2px solid var(--panel-border);background:var(--panel-bg);border-radius:999px;justify-content:center;align-items:center;min-width:44px;min-height:44px;font-size:1.1rem;text-decoration:none;display:flex}#home-button:hover,#top-bar .lang-switch:hover{border-color:var(--accent-white-team)}#top-bar .lang-switch{align-items:center;text-decoration:none;display:inline-flex}#hint-button,#mode-button,#mute-button,#camera-button,#skin-button,#top-bar .lang-switch{border:2px solid var(--panel-border);background:var(--panel-bg);color:var(--text-main);cursor:pointer;white-space:nowrap;border-radius:999px;min-height:44px;padding:10px 14px;font-size:.95rem;font-weight:700}#camera-button:hover,#hint-button:hover,#mode-button:hover,#mute-button:hover,#skin-button:hover{border-color:var(--accent-white-team)}#camera-button:active,#hint-button:active,#mode-button:active,#mute-button:active,#skin-button:active{transform:scale(.96)}#hint-button:disabled,#skin-button:disabled{opacity:.4;cursor:default}#speech-bubble{color:#3a2a10;pointer-events:none;z-index:6;background:#fff8e8;border-radius:16px 16px 16px 4px;max-width:220px;padding:10px 14px;font-size:.9rem;font-weight:700;line-height:1.3;animation:.25s ease-out bubble-pop;position:absolute;top:0;left:0;transform:translate(-50%,-100%);box-shadow:0 6px 18px #00000059}#speech-bubble.hidden{display:none}@keyframes bubble-pop{0%{opacity:0;transform:translate(-50%,-90%)scale(.85)}to{opacity:1;transform:translate(-50%,-100%)scale(1)}}.mode-card{flex-direction:column;align-items:stretch;gap:12px;display:flex}.mode-choice{text-align:left;border:2px solid var(--panel-border);color:var(--text-main);cursor:pointer;background:#ffffff0a;border-radius:16px;align-items:center;gap:14px;min-height:64px;padding:14px 18px;font-size:1rem;display:flex}.mode-choice small{color:var(--text-soft);font-size:.8rem}.mode-choice:hover{border-color:var(--accent-white-team);background:#ffffff14}.mode-icon{font-size:1.8rem}#difficulty-chips{justify-content:center;gap:8px;display:flex}#difficulty-chips button{border:2px solid var(--panel-border);color:var(--text-soft);cursor:pointer;background:0 0;border-radius:999px;min-height:40px;padding:8px 14px;font-weight:700}#difficulty-chips button.active{border-color:var(--accent-black-team);color:var(--text-main);background:#9a86d82e}#camera-hint{top:calc(64px + var(--safe-top));color:var(--text-soft);opacity:.85;pointer-events:none;z-index:4;font-size:.75rem;transition:opacity .6s ease-out;position:absolute;left:50%;transform:translate(-50%)}#camera-hint.faded{opacity:0}#vignette{pointer-events:none;z-index:1;background:radial-gradient(#0000 48%,#0000008c 100%);position:absolute;inset:0}#undo-button:disabled{opacity:.4;cursor:default}#undo-button:not(:disabled):hover{border-color:var(--accent-white-team)}#undo-button:not(:disabled):active{transform:scale(.96)}.tray{bottom:calc(14px + var(--safe-bottom));background:var(--panel-bg);border:1px solid var(--panel-border);z-index:5;border-radius:14px;flex-direction:column;gap:4px;max-width:34vw;padding:10px 14px;display:flex;position:absolute}#tray-white{left:12px}#tray-black{right:12px}.tray-label{color:var(--text-soft);letter-spacing:.02em;white-space:nowrap;font-size:.72rem}.tray-pieces{color:var(--text-main);word-break:break-all;font-size:1.25rem;line-height:1.2}#status-line{bottom:calc(16px + var(--safe-bottom));background:var(--panel-bg);border:1px solid var(--panel-border);color:var(--text-main);text-align:center;z-index:4;border-radius:999px;max-width:min(60vw,480px);padding:10px 20px;font-size:.95rem;font-weight:600;position:absolute;left:50%;transform:translate(-50%)}#status-line[data-tone=alert]{border-color:var(--alert);color:#ffd9cf}#status-line[data-tone=happy]{border-color:var(--happy);color:#dcf5dc}.overlay{z-index:10;background:#120d0aad;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.overlay.hidden{display:none}.overlay-card{background:var(--panel-bg);border:2px solid var(--panel-border);text-align:center;color:var(--text-main);border-radius:22px;max-width:min(86vw,420px);padding:34px 44px}.overlay-card :is(h1,h2){margin-bottom:10px;font-size:2rem}.overlay-card p{color:var(--text-soft);margin-bottom:20px;font-size:1.05rem}#restart-button{background:var(--accent-white-team);color:#3a2a10;cursor:pointer;border:none;border-radius:999px;min-height:48px;padding:14px 28px;font-size:1.1rem;font-weight:800}#restart-button:hover{filter:brightness(1.08)}#restart-button:active{transform:scale(.96)}#loading-track{background:#ffffff1f;border-radius:999px;width:240px;height:10px;margin:0 auto;overflow:hidden}#loading-bar{background:linear-gradient(90deg, var(--accent-white-team), #f5934b);border-radius:999px;width:0%;height:100%;transition:width .25s ease-out}@media (width<=640px){#turn-badge{padding:8px 14px;font-size:.85rem}#camera-button,#hint-button,#mode-button,#mute-button,#skin-button{padding:8px 10px;font-size:.95rem}#top-bar .label{display:none}#top-bar{gap:6px}#camera-hint{display:none}.tray{max-width:44vw;padding:8px 10px}.tray-pieces{font-size:1.05rem}#status-line{bottom:calc(74px + var(--safe-bottom));max-width:88vw;font-size:.85rem}}