:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--font-display:Georgia, "Palatino Linotype", "Book Antiqua", serif;--font-ui:system-ui, -apple-system, "Segoe UI", sans-serif;--font-brand:"Source Code Pro", ui-monospace, Consolas, monospace;--bg:#101015;--panel:#ffffff0d;--panel-border:#ffffff1c;--text:#f1ede2;--muted:#f1ede2a6;--gold:#f0c56a;--felt:#1d6b45;--white-side:#f4efe2;--black-side:#2a2622;--alert:#e0324a;--info:#5aa8ff}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font-ui);margin:0;overflow:hidden}#app{width:100vw;height:100vh;position:relative}.hidden{display:none!important}button{font:inherit;color:var(--text);cursor:pointer;background:linear-gradient(#3a3428,#262219);border:1px solid #f0c56a59;border-radius:6px;min-height:28px;padding:0 12px;font-size:13px;transition:background .15s,border-color .15s,transform 50ms}button:hover:not(:disabled){background:linear-gradient(#4a4232,#2f2a1f);border-color:#f0c56acc}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.45;cursor:default}input[type=text],select{font:inherit;color:inherit;background:#0006;border:1px solid #fff3;border-radius:5px;padding:5px 7px;font-size:13px}input[type=radio]{accent-color:var(--gold)}.screen{position:absolute;inset:0}.screen:not(#screen-game){background:radial-gradient(ellipse at center, #1d6b4559, transparent 65%), var(--bg);justify-content:center;align-items:center;display:flex;overflow-y:auto}.screen-panel{border:1px solid var(--panel-border);box-sizing:border-box;text-align:center;background:#101214d9;border-radius:12px;width:90%;max-width:560px;max-height:92vh;padding:30px 34px;overflow-y:auto;box-shadow:0 20px 60px #00000080}.screen-panel h1{font-family:var(--font-brand);color:var(--gold);letter-spacing:-.025em;margin:4px 0 10px;font-size:24px;font-weight:600}.screen-panel h2{font-family:var(--font-display);color:#f4ecd8;margin:0 0 18px;font-size:21px}.welcome-logo{filter:drop-shadow(0 6px 14px #00000080);width:min(220px,50vw);height:auto;margin:0 auto 4px;display:block}.piece-white{color:var(--white-side)}.piece-black{color:var(--gold)}.screen-hint{color:var(--muted);margin:0 0 20px;font-size:13px;line-height:1.5}.mode-card-grid{flex-direction:column;gap:12px;margin-bottom:22px;display:flex}.mode-card{box-sizing:border-box;background:linear-gradient(#245c3f,#173e2a);border-color:#f0c56a73;flex-direction:column;align-items:center;gap:4px;width:100%;min-height:44px;padding:12px 16px;font-size:15px;display:flex}.mode-card:hover:not(:disabled){background:linear-gradient(#2c7049,#1c4b33)}.mode-card strong{font-size:15px}.mode-card span{color:var(--muted);font-size:12px}.welcome-panel .mode-card{max-width:260px;margin:0 auto}.rules{text-align:left;color:var(--muted);margin-top:22px;font-size:13px;line-height:1.5}.rules summary{cursor:pointer;text-align:center;color:var(--gold)}.rules ul{padding-left:18px}.setup-row{text-align:left;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px;font-size:13px;display:flex}.setup-row label{white-space:nowrap;align-items:center;gap:6px;display:flex}.setup-label{min-width:100px;color:var(--muted);flex-shrink:0}.load-game-row input[type=text]{flex:1;min-width:100px}.inline-note{color:var(--muted);font-size:11px;font-style:italic}.inline-status{color:#ffb066;min-height:1.2em;margin:0 0 8px;font-size:12px}.setup-actions{justify-content:space-between;align-items:center;gap:12px;margin-top:12px;display:flex}.setup-actions .mode-card{flex:1;min-height:0;padding:9px 16px}#online-status{display:block}.screen-panel.lobby-panel{text-align:left;max-width:960px}.lobby-header{align-items:center;gap:12px;margin-bottom:16px;display:flex}.lobby-header h2{margin:0}.lobby-you{color:var(--muted);flex:1;font-size:13px}.lobby-grid{grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:20px;display:grid}@media (width<=760px){.lobby-grid{grid-template-columns:minmax(0,1fr)}}.lobby-section{margin-bottom:18px}.lobby-section h3{font-family:var(--font-display);color:#f4ecd8;margin:0 0 8px;font-size:15px}.lobby-host .setup-row{background:#1d6b452e;border:1px solid #ffffff1a;border-radius:8px;margin-bottom:0;padding:10px 12px}.lobby-list{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.lobby-list li{background:#00000040;border:1px solid #ffffff14;border-radius:6px;align-items:center;gap:10px;padding:7px 10px;font-size:13px;display:flex}.lobby-list li.is-you{border-color:#f0c56a99}.lobby-list li.is-invited{background:#4ade8014;border-color:#4ade8099}.lobby-name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:600;overflow:hidden}.lobby-detail{color:var(--muted);font-size:12px}.lobby-badge{background:#ffffff1a;border-radius:999px;padding:1px 8px;font-size:11px}.lobby-badge.status-hosting{color:#9ef0b8;background:#4ade8033}.lobby-badge.status-playing{color:#ffd08a;background:#f5a62333}.lobby-empty{color:var(--muted);margin:0;font-size:12px;font-style:italic}.invite-box{background:#00000040;border:1px dashed #f0c56a80;border-radius:6px;margin:8px 0;padding:8px 10px}.invite-row{flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:4px;font-size:13px;display:flex}.invite-code{letter-spacing:3px;color:var(--gold);-webkit-user-select:all;user-select:all;font-family:Consolas,Courier New,monospace;font-size:18px}.invite-banner{color:var(--gold);border:1px solid #f0c56a73;border-radius:6px;margin:0 0 16px;padding:8px 10px;font-size:13px}.lobby-code-form{flex-wrap:wrap;align-items:center;gap:8px;margin-top:8px;display:flex}.lobby-code-form input{text-transform:uppercase;letter-spacing:2px;width:9em}.chat-log{word-break:break-word;background:#0000004d;border:1px solid #ffffff14;border-radius:6px;height:150px;margin-bottom:6px;padding:6px 8px;font-size:12px;line-height:1.5;overflow-y:auto}.chat-who{color:#c9b896;margin-right:4px;font-weight:700}.chat-line.chat-white .chat-who{color:var(--white-side)}.chat-line.chat-black .chat-who{color:var(--gold)}.chat-form{gap:4px;display:flex}.chat-form input{flex:1;min-width:0;font-size:12px}#chat-panel .chat-log{height:90px}#screen-game{grid-template:"topbar topbar"38px"sidebar board"minmax(0,1fr)/270px minmax(0,1fr);display:grid}@media (width<=820px){#screen-game{grid-template:"topbar"38px"board"minmax(0,1fr)"sidebar"/minmax(0,1fr)}#sidebar{max-height:38vh}}#top-bar{font-family:var(--font-brand);letter-spacing:-.025em;color:var(--gold);white-space:nowrap;background:linear-gradient(#2a1d12,#1a120b);border-bottom:1px solid #f0c56a4d;grid-area:topbar;justify-content:space-between;align-items:center;gap:12px;padding:0 14px;font-size:15px;font-weight:600;display:flex}#top-bar-right{align-items:center;gap:8px;min-width:0;display:flex}#mode-badge{font-family:var(--font-ui);letter-spacing:0;color:var(--muted);text-overflow:ellipsis;font-size:12px;font-weight:400;overflow:hidden}.fullscreen-btn{z-index:1;width:32px;height:32px;color:var(--gold);letter-spacing:0;cursor:pointer;background:0 0;border:1px solid #f0c56a59;border-radius:5px;flex:none;place-items:center;padding:0;font-size:18px;line-height:1;display:grid;position:relative}.fullscreen-btn:after{content:"";position:absolute;inset:-6px}.fullscreen-btn[hidden]{display:none}.fullscreen-btn:hover{background:#f0c56a1f}#welcome-fullscreen-btn{background:#101214d9;width:34px;height:34px;font-size:19px;position:absolute;top:12px;right:12px}#welcome-fullscreen-btn:hover{background:#f0c56a1f}#sidebar{background:#17181c;border-right:1px solid #ffffff0f;flex-direction:column;grid-area:sidebar;gap:10px;padding:10px;font-size:13px;display:flex;overflow-y:auto}.skin-panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:8px;padding:9px 11px}.panel-title{font-family:var(--font-display);color:var(--gold);justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px;font-size:13px;font-weight:700;display:flex}.player-card{border:1px solid #ffffff1a;border-left:4px solid var(--white-side);background:#0a0c0e80;border-radius:8px;align-items:center;gap:10px;margin-bottom:6px;padding:6px 8px;transition:box-shadow .2s,border-color .2s;display:flex}#clock-black{border-left-color:var(--black-side)}.player-card.is-turn{border-color:var(--gold);animation:1.4s ease-in-out infinite plate-pulse;box-shadow:0 0 0 2px #f0c56a4d,0 0 18px #f0c56a4d}.player-card.clock-low.is-turn{border-color:var(--alert);animation:none;box-shadow:0 0 0 2px #e0324a73,0 0 18px #e0324a66}@keyframes plate-pulse{50%{box-shadow:0 0 0 2px #f0c56a8c,0 0 26px #f0c56a80}}.face-portrait{width:44px;height:60px;image-rendering:pixelated;background:#00000059;border-radius:5px;flex-shrink:0}.player-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.player-name{font-weight:700}.clock-time{font-variant-numeric:tabular-nums;font-size:18px;font-weight:700}.clock-low .clock-time{color:var(--alert)}.clock-ring{flex-shrink:0;width:34px;height:34px;transform:rotate(-90deg)}.clock-track{fill:none;stroke:#ffffff1f;stroke-width:3px}.clock-progress{fill:none;stroke:var(--gold);stroke-width:3px;stroke-linecap:round;transition:stroke-dashoffset .2s linear}.clock-low .clock-progress{stroke:var(--alert)}#clock-select{font-family:var(--font-ui);padding:2px 4px;font-size:11px;font-weight:400}#clock-panel.clock-untimed .clock-ring,#clock-panel.clock-untimed .clock-time{opacity:.4}#turn-indicator{justify-content:center;align-items:center;gap:8px;margin-top:2px;font-size:13px;font-weight:600;display:flex}#turn-indicator .dot{border:1px solid #f0c56a99;border-radius:50%;width:11px;height:11px}.captures-row{grid-template-columns:52px minmax(0,1fr);gap:8px;font-size:12px;line-height:1.6;display:grid}.captures-label{color:var(--muted)}.captures-list{letter-spacing:1px;font-size:16px;line-height:1.3}#move-history-scroll{max-height:140px;overflow-y:auto}#move-history-list{font-variant-numeric:tabular-nums;margin:0;padding:0 0 0 24px;font-size:12px;line-height:1.7}#move-history-list li::marker{color:var(--muted)}#move-history-list li{white-space:nowrap}#move-history-list .black-move{color:var(--muted);margin-left:10px}#controls{flex-wrap:wrap;gap:6px;display:flex}#board-area{background:#111116;grid-area:board;min-width:0;min-height:0;position:relative;overflow:hidden}#scene{touch-action:none;width:100%;height:100%;display:block}#board2d-wrapper{background:radial-gradient(#23794fbf,#0d3d2799 55%,#0000 80%),#111116;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.board-frame{background:linear-gradient(#7a4a24,#5b3418 50%,#43240f);border-radius:10px;padding:12px;box-shadow:0 14px 40px #0009,inset 0 0 0 1px #f0d28c40}#scene2d{touch-action:none;border-radius:2px;display:block;box-shadow:0 0 0 1px #f0d28c59}#status-banner{color:var(--text);pointer-events:none;white-space:nowrap;background:#0a0c0ed9;border:1px solid #f0c56a80;border-radius:20px;padding:8px 18px;font-size:15px;font-weight:600;animation:.25s ease-out toast-in;position:absolute;top:16px;left:50%;transform:translate(-50%)}#status-banner.status-alert{border-color:#e0324acc;box-shadow:0 0 18px #e0324a59}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-8px)}}.dialog{background:#00000073;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.dialog-box{text-align:center;background:#17181c;border:1px solid #f0c56a80;border-radius:12px;width:90%;max-width:460px;padding:20px 24px;animation:.2s ease-out dialog-in;box-shadow:0 20px 60px #0009}@keyframes dialog-in{0%{opacity:0;transform:translateY(-8px)}}.dialog-box.compact{width:auto}.dialog-box h3{font-family:var(--font-display);color:var(--gold);margin:0 0 4px;font-size:20px}.dialog-box p{color:var(--muted);margin:0 0 14px;font-size:13px}.dialog-actions{justify-content:center;gap:10px;display:flex}.dialog-actions .mode-card{width:auto;min-width:120px}.promotion-btn{color:#16161c;background:linear-gradient(#f6f2e8,#ddd6c6);width:58px;height:58px;padding:0;font-size:36px;line-height:1}.promotion-btn:hover:not(:disabled){background:linear-gradient(#fff,#ebe5d6)}#loading{background:#0a0a0e99;border-radius:6px;padding:6px 10px;font-size:13px;position:absolute;bottom:16px;right:16px}.lang-switch{display:inline-flex}.lang-switch button{min-height:24px;font-size:12px;font-family:var(--font-ui);letter-spacing:.5px;border-radius:0;padding:0 9px}.lang-switch button:first-child{border-radius:6px 0 0 6px}.lang-switch button:last-child{border-radius:0 6px 6px 0}.lang-switch button+button{margin-left:-1px}.lang-switch button.active{background:var(--gold);border-color:var(--gold);color:#1a120b;font-weight:700}.lang-switch-global{z-index:5;position:absolute;top:14px;left:14px}#app:has(#screen-game:not(.hidden)) .lang-switch-global{display:none}.account-notice{color:var(--gold);border:1px solid #f0c56a73;border-radius:6px;margin:0 0 16px;padding:8px 10px;font-size:13px}.account-notice.hidden{display:none}.account-notice a{color:inherit;font-weight:600;text-decoration:underline}
