@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans:wght@400;500;600;700&display=swap";:root{--bg-main:#161512;--bg-surface:#1e1c19;--bg-surface-raised:#262421;--bg-surface-hover:#302e2b;--cell-light:#f0d9b5;--cell-dark:#b58863;--cell-light-selected:#f7ec6a;--cell-dark-selected:#dac34b;--cell-light-move:#14551e69;--cell-dark-move:#14551e69;--cell-light-capture:#14551e69;--cell-dark-capture:#14551e69;--cell-light-last:#cdd26a;--cell-dark-last:#aaa23a;--cell-light-win:#aff062;--cell-dark-win:#7ab833;--text-bright:#fff;--text-primary:#bababa;--text-secondary:#999;--text-muted:#666;--text-dim:#444;--accent:#629924;--accent-hover:#78b133;--danger:#cd4545;--white-player:#fff;--white-player-bg:#f0d9b5;--black-player:#999;--black-player-bg:#b58863;--radius-sm:4px;--radius-md:8px;--radius-lg:16px;--shadow-sm:0 2px 4px #0000004d;--shadow-md:0 4px 12px #0006;--shadow-lg:0 12px 40px #0009;--transition-fast:80ms ease;--transition-main:.12s cubic-bezier(.4, 0, .2, 1);--transition-bounce:.2s cubic-bezier(.34, 1.56, .64, 1);--board-size:min(calc(100vw - 32px), 460px);--cell-size:calc(var(--board-size) / 4)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:var(--bg-main);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Noto Sans,Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5;overflow-x:hidden}.game-container{background:var(--bg-main);-webkit-user-select:none;user-select:none;flex-direction:column;align-items:center;gap:0;min-height:100dvh;padding:1.25rem 1rem;display:flex;position:relative}.game-layout{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:1rem;width:100%;display:flex}.game-main{flex-direction:column;align-items:center;gap:.25rem;display:flex}.game-sidebar{width:100%;max-width:calc(var(--board-size) + 16px);flex-direction:column;align-items:stretch;gap:.5rem;margin:0 auto;display:flex}.sidebar-section{background:var(--bg-surface-raised);border-radius:var(--radius-md);border:1px solid var(--bg-surface-hover);flex-direction:column;gap:.8rem;padding:1.2rem;display:flex}.sidebar-mode-label{text-align:center;color:var(--accent);letter-spacing:.1em;text-transform:uppercase;font-size:.75rem;font-weight:700;background:#62992414!important;border-color:#62992433!important;gap:0!important;padding:.4rem 1rem!important}.sidebar-section-title{text-transform:uppercase;letter-spacing:.1rem;color:var(--accent);margin-bottom:.2rem;font-size:.8rem;font-weight:700}.sidebar-section-toggle{cursor:pointer;text-align:left;background:0 0;border:none;justify-content:space-between;align-items:center;width:100%;margin:0;padding:0;display:none}.toggle-icon{color:var(--text-muted);font-family:monospace;font-size:1.2rem}.sidebar-info{color:var(--text-muted);letter-spacing:.06rem;text-transform:uppercase;align-items:center;gap:.5rem;font-size:.8rem;font-weight:600;display:flex}.sidebar-status{flex-direction:column;gap:.4rem;display:flex}.sidebar-history{flex:1;min-width:180px}.history-scroll{max-height:220px;padding-right:.5rem;overflow-y:auto}.history-empty{color:var(--text-dim);text-align:center;opacity:.7;padding:2.5rem 1rem;font-size:.85rem;font-weight:500}.sidebar-controls{background:0 0;border:none;align-items:center;gap:.5rem;padding:0;display:flex}.game-header{text-align:center;z-index:2;width:100%;margin-bottom:1rem;padding:.75rem 0}.title{color:var(--text-bright);letter-spacing:.05rem;text-transform:none;text-shadow:none;font-family:Inter,sans-serif;font-size:1.6rem;font-weight:700}.subtitle{color:var(--text-muted);letter-spacing:.25rem;text-transform:uppercase;margin-top:.25rem;font-size:.8rem;font-weight:500}.game-title{color:var(--text-muted);letter-spacing:.08rem;font-size:1.1rem;font-weight:600}.status-message{color:var(--text-secondary);transition:color var(--transition-main);font-size:.95rem;font-weight:500}.winner-msg{color:var(--accent);text-shadow:0 0 16px #62992480;font-weight:700;animation:1.5s ease-in-out infinite winPulse;font-size:1.25rem!important}.status-message.turn-white{color:var(--text-bright);font-weight:600}.status-message.turn-black{color:var(--text-secondary);font-weight:600}.hand-wrapper{z-index:1;position:relative}.hand-panel{transition:opacity var(--transition-main), transform var(--transition-main);flex-direction:column;align-items:center;gap:.75rem;display:flex}.hand-panel[style*="opacity: 1"]{filter:drop-shadow(0 0 8px #ffffff0d)}.hand-title{align-items:center;gap:.5rem;display:flex;letter-spacing:.12rem!important;text-transform:uppercase!important;font-family:Noto Sans,sans-serif!important;font-size:.85rem!important;font-weight:600!important}.turn-badge{letter-spacing:.07rem;text-transform:uppercase;color:var(--accent);background:#6299242e;border:1px solid #62992459;border-radius:3px;padding:1px 6px;font-size:.6rem;font-weight:700}.hand-panel--active{border-radius:var(--radius-md);outline-offset:6px;outline:1px solid #ffffff1a}.black-hand{margin-bottom:.6rem}.white-hand{margin-top:.6rem}.hand-cards{justify-content:center;gap:1rem;display:flex}.hand-card{border-radius:var(--radius-md);width:70px;height:74px;transition:transform var(--transition-bounce), background-color .1s ease, border-color .1s ease;border:2px solid #0000;flex-direction:column;justify-content:center;align-items:center;gap:2px;display:flex;position:relative;overflow:hidden}.hand-card--available{background:var(--bg-surface-raised);border-color:var(--bg-surface-hover);cursor:pointer}.hand-card--available:hover{background:var(--bg-surface-hover);border-color:var(--text-muted);transform:translateY(-2px)}.hand-card--selected{z-index:2;transform:translateY(-4px)scale(1.05);box-shadow:0 8px 20px #62992466;background:var(--accent)!important;border-color:var(--accent-hover)!important}.hand-card--empty{background:var(--bg-surface);opacity:.35;cursor:default}.hand-card__label{letter-spacing:.06rem;text-transform:uppercase;color:var(--text-muted);margin-top:0;font-size:.65rem;font-weight:600}.hand-card--selected .hand-card__label{color:var(--bg-main)}.board-wrapper{z-index:1}.board-container{background:var(--bg-surface-raised);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:4px}.board-row{display:flex}.cell-label{pointer-events:none;-webkit-user-select:none;user-select:none;z-index:1;font-size:.6rem;font-weight:700;line-height:1;position:absolute}.cell-label-file{bottom:2px;right:3px}.cell-label-rank{top:2px;left:3px}.cell.light .cell-label{color:var(--cell-dark)}.cell.dark .cell-label{color:var(--cell-light)}.cell{width:var(--cell-size);height:var(--cell-size);cursor:default;justify-content:center;align-items:center;transition:background-color .1s;display:flex;position:relative}.cell.light{background:var(--cell-light)}.cell.dark{background:var(--cell-dark)}.cell.light.selected{background:var(--cell-light-selected)}.cell.dark.selected{background:var(--cell-dark-selected)}.cell.light.last-move{background:var(--cell-light-last)}.cell.dark.last-move{background:var(--cell-dark-last)}@keyframes winPop{0%{filter:brightness();transform:scale(1)}35%{filter:brightness(1.5)saturate(1.4);transform:scale(1.13)}to{filter:brightness();transform:scale(1)}}.cell.light.win{background:var(--cell-light-win);animation:.4s ease-out winPop,1.5s ease-in-out .4s infinite winPulse}.cell.dark.win{background:var(--cell-dark-win);animation:.4s ease-out winPop,1.5s ease-in-out .4s infinite winPulse}.cell.target,.cell.can-place{cursor:pointer}.cell.target:hover:after,.cell.can-place:hover:after{content:"";pointer-events:none;background:#ffffff0d;position:absolute;inset:0}.board-row:first-child .cell:first-of-type{border-top-left-radius:var(--radius-md)}.board-row:first-child .cell:last-of-type{border-top-right-radius:var(--radius-md)}.board-row:last-child .cell:first-of-type{border-bottom-left-radius:var(--radius-md)}.board-row:last-child .cell:last-of-type{border-bottom-right-radius:var(--radius-md)}.move-indicator{pointer-events:none;z-index:2;background:#0000002e;border-radius:50%;width:28%;height:28%;position:absolute}.capture-indicator{pointer-events:none;z-index:2;box-shadow:none;background:0 0;border:5px solid #0000002e;border-radius:50%;position:absolute;inset:4%}.place-hint{pointer-events:none;z-index:2;background:#0000001f;border-radius:50%;width:22%;height:22%;position:absolute}.piece-wrapper{z-index:3;line-height:0;position:absolute}.piece-wrapper.scaled{z-index:10}.piece-wrapper.faded{opacity:.4}.drag-ghost{pointer-events:none;z-index:1000;opacity:.85;filter:drop-shadow(0 4px 12px #00000080);position:fixed}@keyframes winPulse{0%,to{filter:brightness()}50%{filter:brightness(1.15)}}.sidebar-controls-row{border-radius:var(--radius-md)!important;border:1px solid var(--bg-surface-hover)!important;background:0 0!important;flex-flow:wrap!important;gap:0!important;width:100%!important;padding:0!important;display:flex!important}.sidebar-controls-row .btn{background:var(--bg-surface-raised);border:none!important;border-right:1px solid var(--bg-surface-hover)!important;white-space:nowrap!important;min-width:50px!important;transition:all var(--transition-main)!important;border-radius:0!important;flex:auto!important;margin:0!important;padding:.5rem .4rem!important}.sidebar-controls-row .btn:last-child{border-right:none!important}@media (hover:hover){.sidebar-controls-row .btn:hover{background:var(--bg-surface-hover)!important;color:var(--text-bright)!important;box-shadow:none!important;transform:none!important}}.btn{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;transition:background-color var(--transition-main), transform var(--transition-main), border-color var(--transition-main);white-space:nowrap;flex:1;justify-content:center;align-items:center;padding:.6rem 1.25rem;font-family:Noto Sans,sans-serif;font-size:.9rem;font-weight:600;display:flex}.btn-sm{border-radius:var(--radius-sm);padding:.5rem .75rem;font-size:.8rem}.btn-active,.sidebar-controls-row .btn.btn-active{background:var(--accent)!important;color:var(--bg-main)!important;border-color:var(--accent-hover)!important}@media (hover:hover){.btn-active:hover,.sidebar-controls-row .btn.btn-active:hover{background:var(--accent-hover)!important;color:var(--bg-main)!important;border-color:var(--accent-hover)!important}}.hand-wrapper--mirrored{transform:rotate(180deg)}.btn-danger{background:var(--danger)!important;color:var(--text-bright)!important;border-color:var(--danger)!important;transition:background 50ms,transform 50ms!important}@media (hover:hover){.btn-danger:hover{transform:translateY(-1px);color:var(--text-bright)!important;background:#b03a3a!important;border-color:#b03a3a!important}}.btn-danger:active{background:#933!important;transform:translateY(0)!important}.btn-danger--confirm{z-index:5;animation:.8s ease-in-out infinite alternate danger-confirm-pulse;box-shadow:0 0 15px #cd454566;color:#fff!important;background:#e13d3d!important;border-color:#ff4d4d!important;font-weight:700!important}@media (hover:hover){.sidebar-controls-row .btn.btn-danger--confirm:hover{background:#ff4d4d!important;border-right:none!important;box-shadow:0 0 12px #ff4d4d4d!important}}.sidebar-controls-row .btn.btn-danger--confirm{border-right:none!important}@keyframes danger-confirm-pulse{0%{background-color:#cd4545;box-shadow:0 0 4px #cd454533}to{background-color:#ff4d4d;box-shadow:0 0 10px #cd454566}}.btn-gold{box-shadow:0 4px 12px #f1c40f33;color:#1a1a1a!important;background:linear-gradient(135deg,#d4af37,#f1c40f)!important;border-color:#f1c40f!important;font-weight:700!important}@media (hover:hover){.btn-gold:hover{transform:translateY(-2px);box-shadow:0 6px 16px #f1c40f66;background:linear-gradient(135deg,#f1c40f,#f39c12)!important}}.btn:disabled{opacity:.35;cursor:default;pointer-events:none}.btn-icon{line-height:1;flex:none!important;padding:.5rem .6rem!important;font-size:1rem!important}@media (hover:hover){.btn:hover{background:var(--bg-surface-hover);color:var(--text-bright);border-color:var(--text-muted);transform:translateY(-1px)}}.moves-panel{overflow:hidden;gap:0!important;padding:0!important}.moves-scroll{scrollbar-width:thin;scrollbar-color:var(--bg-surface-hover) transparent;height:150px;overflow-y:auto}.moves-table{border-collapse:collapse;table-layout:fixed;width:100%;font-family:Noto Sans,monospace;font-size:.82rem}.moves-num{text-align:center;width:28px;color:var(--text-dim);-webkit-user-select:none;user-select:none;background:#00000026;padding:4px 0;font-size:.72rem;font-weight:600}.moves-cell{cursor:pointer;color:var(--text-secondary);transition:background-color var(--transition-main);white-space:nowrap;text-overflow:ellipsis;padding:5px 8px;font-weight:500;overflow:hidden}.moves-cell:hover{background:var(--bg-surface-hover)}.moves-cell--active{color:var(--text-bright);background:#62992440!important}.moves-black{border-left:1px solid #ffffff0a}.moves-table tr:nth-child(odd) .moves-cell{background:#ffffff05}.moves-table tr:nth-child(odd) .moves-cell:hover{background:var(--bg-surface-hover)}.moves-table tr:nth-child(odd) .moves-cell.moves-cell--active{background:#62992440!important}.moves-nav{border-top:1px solid var(--bg-surface-hover);display:flex}.moves-nav__btn{border:none;border-right:1px solid var(--bg-surface-hover);color:var(--text-secondary);cursor:pointer;transition:background-color var(--transition-main), color var(--transition-main);background:0 0;flex:1;justify-content:center;align-items:center;padding:6px 0;display:flex}.moves-nav__btn:last-child{border-right:none}.moves-nav__btn:hover:not(:disabled){background:var(--bg-surface-hover);color:var(--text-bright)}.moves-nav__btn:disabled{opacity:.25;cursor:default}.history-header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.history-header__title{text-transform:uppercase;letter-spacing:.1rem;color:var(--text-muted);font-size:.75rem;font-weight:700}.history-nav{align-items:center;gap:.25rem;display:flex}.history-nav__btn{background:var(--bg-surface-hover);color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;width:24px;height:24px;transition:background-color var(--transition-main), color var(--transition-main);border:1px solid #0000;justify-content:center;align-items:center;font-family:monospace;font-size:1.1rem;line-height:1;display:flex}.history-nav__btn:hover:not(:disabled){background:var(--bg-surface-hover);color:var(--text-bright);border-color:var(--text-muted)}.history-nav__btn:disabled{opacity:.3;cursor:default}.history-nav__live{border:1px solid var(--accent);color:var(--accent);letter-spacing:.06rem;text-transform:uppercase;cursor:pointer;transition:background-color var(--transition-main);white-space:nowrap;background:0 0;border-radius:3px;padding:1px 6px;font-family:Noto Sans,sans-serif;font-size:.65rem;font-weight:700;animation:1.5s infinite pulse}.history-nav__live:hover{background:#62992426}.history-list{flex-direction:column;gap:2px;display:flex}.history-item{border-radius:var(--radius-sm);cursor:pointer;text-align:left;width:100%;transition:background-color var(--transition-main);background:0 0;border:none;align-items:baseline;gap:.4rem;padding:3px 6px;font-family:Noto Sans,monospace;font-size:.8rem;font-weight:500;display:flex}.history-item:hover{background:var(--bg-surface-hover)}.history-item.white{color:var(--text-secondary)}.history-item.black{color:var(--text-muted)}.history-item__num{color:var(--text-dim);min-width:1.4rem;font-size:.7rem}.history-item__action{flex:1}.history-item--active{border-left:2px solid var(--accent);color:var(--text-bright)!important;background:#ffffff0f!important}.history-item--future{opacity:.35}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;background:#000000bf;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-surface-raised);border-radius:var(--radius-lg);width:90%;max-width:500px;box-shadow:var(--shadow-lg);border:1px solid var(--bg-surface-hover);padding:2rem;animation:.3s cubic-bezier(.34,1.56,.64,1) modalIn;position:relative}.modal-title{color:var(--text-bright);letter-spacing:0;margin-bottom:1.25rem;font-size:1.3rem;font-weight:700}.modal-body p{color:var(--text-secondary);margin-bottom:.75rem;font-size:.95rem;line-height:1.7}.accent{color:var(--accent);font-weight:600}.winner-overlay{z-index:50;background:#00000080;justify-content:center;align-items:center;animation:.3s fadeIn;display:flex;position:fixed;inset:0}.winner-content{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-lg);text-align:center;box-shadow:var(--shadow-lg);padding:2.5rem 4rem;animation:.4s cubic-bezier(.22,1,.36,1) modalIn}.winner-announcement{letter-spacing:.15rem;margin-bottom:1.25rem;font-size:2rem;font-weight:700}.winner-overlay.white .winner-announcement{color:var(--text-bright)}.winner-overlay.black .winner-announcement{color:var(--text-primary)}.winner-overlay.white .winner-content{border-color:#fff3}.winner-overlay.black .winner-content{border-color:#9999994d}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalIn{0%{opacity:0;transform:translateY(16px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--bg-surface-hover);border-radius:4px}@media (width>=768px){:root{--board-size:440px}.game-header{pointer-events:none;margin-bottom:0;position:absolute;top:1.5rem;left:0;right:0}.title,.subtitle{pointer-events:auto}.game-layout{flex-direction:row;align-items:center;gap:1.5rem}.game-sidebar{flex-direction:column;align-items:stretch;gap:.75rem;width:320px;max-width:320px;margin:0}.sidebar-section{width:100%;padding:1.2rem}.sidebar-controls-row .btn-history{display:none}.history-collapsible-section{flex:1;min-height:220px;margin-top:0;display:flex!important}.history-scroll{height:220px;max-height:220px}.sidebar-section{width:100%}.sidebar-history{min-width:unset}.history-scroll{height:220px}.sidebar-controls{flex-direction:column;width:100%}.sidebar-controls .btn{width:100%}.title{font-size:1.8rem}.subtitle{font-size:.85rem}.status-message{font-size:1rem}.hand-card{width:80px;height:84px}.hand-card__label{font-size:.75rem}.btn{padding:.6rem 1.75rem;font-size:.95rem}.winner-announcement{font-size:2.5rem}}@media (width<=380px){.game-container{padding:.5rem}.title{font-size:1.25rem}.subtitle{font-size:.7rem}.board-container{padding:4px}.hand-card{width:52px;height:56px}.hand-card__label{font-size:.6rem}.btn{padding:.45rem 1rem;font-size:.8rem}.sidebar-controls-row .btn{font-size:.7rem;padding:.45rem .15rem!important}.status-message{font-size:.85rem}:root{--board-size:calc(100vw - 16px)}}@media (width<=768px){.game-header{display:none}.game-container{min-height:auto;padding:.5rem .75rem}.game-layout{justify-content:flex-start;gap:.5rem}.game-sidebar{flex-direction:column;gap:.5rem;padding-top:.25rem;padding-bottom:1rem;display:flex}.sidebar-section{gap:.35rem;padding:.5rem .6rem}.game-main{gap:.15rem}.sidebar-controls-row{order:1}.sidebar-status{order:2}.moves-panel{order:5}.history-collapsible-section{order:4;animation:.3s fadeIn;display:none}.history-collapsible-section.is-expanded,.sidebar-controls-row .btn-history{display:flex}.sidebar-controls-row .btn{letter-spacing:-.02rem;font-size:.75rem;padding:.5rem .2rem!important}.sidebar-controls-row .btn-icon{flex:none!important;padding:.5rem .4rem!important}.hand-panel{gap:.25rem}.black-hand{margin-bottom:.25rem}.white-hand{margin-top:.25rem}.hand-cards{gap:.3rem}.hand-card{width:54px;height:58px}.history-collapsible{border-top:1px solid var(--bg-surface-hover);margin-top:.5rem;padding-top:.5rem;animation:.3s fadeIn;display:none}.hand-card__label{font-size:.55rem}}@media (height<=600px) and (orientation:landscape){:root{--board-size:min(70vh, 320px)}.game-container{flex-flow:wrap;justify-content:center;gap:.5rem;padding:.5rem}.game-header{display:none}}.menu-container{background:var(--bg-main);justify-content:center;align-items:flex-start;min-height:100dvh;padding:3rem 1rem 4rem;display:flex}.menu-inner{flex-direction:column;align-items:center;gap:2rem;width:100%;max-width:560px;display:flex}@media (width<=768px){.menu-container{padding:1.5rem 1rem 3rem}.menu-inner{gap:1.25rem}}.menu-header{text-align:center}.menu-user-nav{justify-content:center;align-items:center;gap:1rem;margin-top:.5rem;font-size:.85rem;display:flex}.menu-user-link{color:var(--text-secondary);transition:color var(--transition-fast);text-decoration:none}.menu-user-link:hover{color:var(--text-primary)}.menu-user-elo{color:var(--accent);margin-left:.35rem}.mode-toggle{background:var(--bg-surface);border:1px solid var(--bg-surface-raised);border-radius:var(--radius-md);width:100%;max-width:280px;display:flex;overflow:hidden}.mode-toggle__btn{color:var(--text-muted);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:none;flex:1;padding:.6rem 1rem;font-family:inherit;font-size:.9rem;font-weight:600}.mode-toggle__btn:hover:not(:disabled):not(.mode-toggle__btn--active){background:var(--bg-surface-raised);color:var(--text-secondary)}.mode-toggle__btn--active{background:var(--accent);color:#fff}.mode-toggle__btn:disabled{cursor:default;opacity:.7}.menu-searching{background:var(--bg-surface);border:1px solid var(--bg-surface-raised);border-radius:var(--radius-md);flex-direction:column;align-items:center;gap:.75rem;width:100%;padding:1.25rem;display:flex}.menu-searching__top{align-items:center;gap:.6rem;display:flex}.menu-searching-text{color:var(--text-muted);font-size:.9rem}.menu-searching__modes{flex-wrap:wrap;justify-content:center;gap:.4rem;display:flex}.queue-mode-tag{color:var(--accent);border-radius:var(--radius-sm);letter-spacing:.02em;background:#6299241f;border:1px solid #6299244d;padding:.3rem .65rem;font-size:.8rem;font-weight:600;display:inline-block}.menu-invite-section{flex-direction:column;gap:.75rem;width:100%;display:flex}.menu-invite-row{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.menu-heading{text-transform:uppercase;letter-spacing:.18rem;color:var(--text-muted);font-size:.75rem;font-weight:700}.time-grid{grid-template-columns:repeat(4,1fr);gap:.75rem;width:100%;display:grid}.time-tile{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-main), transform var(--transition-bounce), border-color var(--transition-main);color:inherit;flex-direction:column;align-items:center;gap:.35rem;padding:1rem .75rem;font-family:inherit;display:flex}@media (hover:hover){.time-tile:hover:not(:disabled){background:var(--bg-surface-hover);border-color:var(--text-muted);box-shadow:var(--shadow-md);transform:translateY(-3px)}}.time-tile:disabled{opacity:.4;cursor:default}.time-tile__label{color:var(--text-primary);letter-spacing:.02rem;font-family:Inter,sans-serif;font-size:1.6rem;font-weight:700;line-height:1}.time-tile__category{color:var(--text-muted);text-transform:uppercase;letter-spacing:.12rem;font-size:.75rem;font-weight:500}.btn-no-timer{color:var(--text-muted);cursor:pointer;text-underline-offset:3px;transition:color var(--transition-main);background:0 0;border:none;padding:.4rem 1rem;font-family:Noto Sans,sans-serif;font-size:.85rem;font-weight:500;text-decoration:underline}@media (hover:hover){.btn-no-timer:hover{color:var(--text-secondary)}}.time-tile--selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);background:#81b35e1f}@media (hover:hover){.time-tile--selected:hover:not(:disabled){border-color:var(--accent);background:#81b35e2e}}.time-tile:active:not(:disabled){transform:scale(.97)}.time-tile--icon .time-tile__label{justify-content:center;align-items:center;height:1.6rem;display:flex}.custom-tc-panel{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-md);flex-direction:column;gap:1rem;padding:1.25rem;animation:.2s ease-out fadeSlideIn;display:flex}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.custom-tc-inputs{justify-content:center;align-items:flex-end;gap:.75rem;display:flex}.custom-tc-field{flex-direction:column;flex:1;gap:.3rem;max-width:120px;display:flex}.custom-tc-field__label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08rem;font-size:.7rem;font-weight:600}.custom-tc-field__input{background:var(--bg-surface);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-sm);color:var(--text-primary);text-align:center;width:100%;transition:border-color var(--transition-main);-moz-appearance:textfield;outline:none;padding:.5rem .75rem;font-family:Inter,sans-serif;font-size:1.3rem;font-weight:700}.custom-tc-field__input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.custom-tc-field__input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.custom-tc-field__input:focus{border-color:var(--accent)}.custom-tc-plus{color:var(--text-muted);padding-bottom:.5rem;font-size:1.4rem;font-weight:700}.custom-tc-presets{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.custom-tc-preset{background:var(--bg-surface);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:background-color var(--transition-main), border-color var(--transition-main);padding:.35rem .75rem;font-family:Inter,sans-serif;font-size:.8rem;font-weight:600}.custom-tc-preset:hover{background:var(--bg-surface-hover);border-color:var(--text-muted)}.custom-tc-preset--active{border-color:var(--accent);color:var(--accent);background:#81b35e1a}.custom-tc-mode{border-radius:var(--radius-sm);border:1px solid var(--bg-surface-hover);align-self:center;gap:0;display:flex;overflow:hidden}.custom-tc-mode__btn{background:var(--bg-surface);color:var(--text-muted);cursor:pointer;transition:background-color var(--transition-main), color var(--transition-main);border:none;padding:.4rem 1.25rem;font-family:Noto Sans,sans-serif;font-size:.8rem;font-weight:600}.custom-tc-mode__btn:first-child{border-right:1px solid var(--bg-surface-hover)}.custom-tc-mode__btn:hover{background:var(--bg-surface-hover)}.custom-tc-mode__btn--active{color:var(--accent);background:#81b35e26}.custom-tc-panel--locked .custom-tc-field__input:disabled{opacity:.4}.custom-tc-panel--locked .custom-tc-preset:disabled,.custom-tc-panel--locked .custom-tc-mode__btn:disabled{opacity:.4;cursor:default}.custom-tc-divider{border-top:1px solid var(--bg-surface-hover)}.custom-tc-invite{flex-direction:column;align-items:center;gap:.75rem;display:flex}.custom-tc-invite__create{width:100%}.custom-tc-invite__active{background:var(--bg-surface);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-sm);flex-direction:column;align-items:center;gap:.6rem;width:100%;padding:.75rem;display:flex}.custom-tc-invite__code{flex-direction:column;align-items:center;gap:.15rem;display:flex}.custom-tc-invite__code-label{text-transform:uppercase;letter-spacing:.1rem;color:var(--text-muted);font-size:.65rem;font-weight:600}.custom-tc-invite__code-value{letter-spacing:.25rem;color:var(--text-primary);font-family:Inter,monospace;font-size:1.5rem;font-weight:700}.custom-tc-invite__actions{gap:.5rem;display:flex}.custom-tc-invite__cancel{border:1px solid var(--bg-surface-hover)!important;color:var(--text-muted)!important;background:0 0!important}.custom-tc-invite__cancel:hover{border-color:var(--text-muted)!important;color:var(--text-secondary)!important}.custom-tc-invite__join{align-items:center;gap:.5rem;width:100%;display:flex}.custom-tc-action{align-self:center;padding:.6rem 2rem}.menu-search-btn{letter-spacing:.02em;width:100%;margin-top:.5rem;padding:.85rem 1.5rem;font-size:1rem;font-weight:600}.menu-search-btn:disabled{opacity:.5;cursor:default}.rules-section{border-top:1px solid var(--bg-surface-hover);width:100%;padding-top:1.25rem}.rules-toggle{cursor:pointer;width:100%;color:var(--text-muted);text-transform:uppercase;letter-spacing:.18rem;transition:color var(--transition-fast);background:0 0;border:none;justify-content:space-between;align-items:center;padding:.25rem 0;font-family:inherit;font-size:.75rem;font-weight:700;display:flex}.rules-toggle:hover{color:var(--text-secondary)}.rules-toggle__chevron{flex-shrink:0;transition:transform .2s}.rules-toggle__chevron--open{transform:rotate(180deg)}.rules-body{flex-direction:column;gap:1.5rem;margin-top:1.5rem;animation:.2s fadeIn;display:flex}.rules-subtitle{text-transform:uppercase;letter-spacing:.14rem;color:var(--text-dim);font-size:.7rem;font-weight:700}.rules-divider{background:var(--bg-surface-hover);width:100%;height:1px}.rules-label{color:var(--accent);text-transform:uppercase;letter-spacing:.08rem;margin-bottom:.4rem;font-size:.8rem;font-weight:700;display:block}.rules-block{align-items:center;gap:1.25rem;display:flex}.rules-block__boards{flex-shrink:0;gap:.5rem;display:flex}.rules-block__text{flex:1}.rules-block__text p{color:var(--text-secondary);margin:0;font-size:.85rem;line-height:1.6}.mini-board{border:1px solid #ffffff0f;border-radius:3px;flex-shrink:0;grid-template-rows:repeat(4,18px);grid-template-columns:repeat(4,18px);gap:1px;display:grid;overflow:hidden}.mini-cell{width:18px;height:18px;position:relative}.mini-light{background:var(--cell-light)}.mini-dark{background:var(--cell-dark)}.mini-cell.mini-piece:after{content:"";background:var(--accent);border-radius:50%;position:absolute;inset:3px;box-shadow:0 0 5px #62992499}.mini-cell.mini-move:after{content:"";background:#00000059;border-radius:50%;position:absolute;inset:5px;box-shadow:inset 0 0 0 1px #00000026}.mini-cell.mini-capture:after{content:"";background:var(--danger);opacity:.85;border-radius:50%;position:absolute;inset:3px}.piece-cards{grid-template-columns:repeat(4,1fr);gap:.75rem;width:100%;display:grid}.piece-card{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-md);flex-direction:column;align-items:center;gap:.4rem;padding:.85rem .5rem .75rem;display:flex}.piece-card__glyph{pointer-events:none}.piece-card__name{color:var(--text-primary);text-transform:uppercase;letter-spacing:.06rem;font-size:.75rem;font-weight:700}.piece-card__desc{color:var(--text-muted);text-align:center;margin-top:.2rem;font-size:.7rem;line-height:1.45}.phase-cards{align-items:stretch;gap:0;width:100%;display:flex}.phase-card{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-md);flex-direction:column;flex:1;gap:.25rem;padding:.9rem .6rem;display:flex}.phase-arrow{color:var(--text-dim);flex-shrink:0;align-items:center;padding:0 .35rem;font-size:1.1rem;display:flex}.phase-card__turns{text-transform:uppercase;letter-spacing:.1rem;color:var(--accent);font-size:.65rem;font-weight:700}.phase-card__label{color:var(--text-primary);font-size:.8rem;font-weight:700}.phase-card__desc{color:var(--text-muted);font-size:.72rem;line-height:1.4}@media (width<=480px){.time-grid{grid-template-columns:repeat(2,1fr)}.time-tile__label{font-size:1.6rem}.piece-cards{grid-template-columns:repeat(2,1fr)}.phase-cards{flex-direction:column;gap:.5rem}.phase-arrow{display:none}}.player-clock{letter-spacing:.04rem;color:var(--text-secondary);text-align:right;min-width:2.8rem;margin-left:auto;font-family:Inter,monospace;font-size:1rem;font-weight:700}.clock-low{animation:1s ease-in-out infinite clockPulse;color:var(--danger)!important}@keyframes clockPulse{0%,to{opacity:1}50%{opacity:.55}}@media (hover:none) and (pointer:coarse){.cell{-webkit-tap-highlight-color:transparent}.btn{min-width:44px;min-height:44px}.hand-card{min-height:50px}}.menu-divider{background:var(--bg-surface-raised);width:100%;height:1px;margin:.75rem 0}.auth-container{background:var(--bg-main);justify-content:center;align-items:center;min-height:100vh;padding:1.5rem;display:flex}.auth-card{background:var(--bg-surface);border:1px solid var(--bg-surface-raised);border-radius:var(--radius-lg);width:100%;max-width:400px;padding:2rem}.auth-title{text-align:center;margin-bottom:.25rem;font-size:1.6rem}.auth-heading{text-align:center;color:var(--text-secondary);margin:0 0 1.5rem;font-size:1rem;font-weight:500}.auth-form{flex-direction:column;gap:1rem;display:flex}.auth-divider{color:var(--text-muted);align-items:center;gap:.75rem;margin:1rem 0;font-size:.85rem;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:var(--bg-surface-raised);flex:1;height:1px}.auth-footer{text-align:center;color:var(--text-secondary);margin-top:1rem;font-size:.875rem}.legal-page{text-align:left;max-width:600px}.legal-updated{color:var(--text-muted);margin-bottom:1.5rem;font-size:.8rem}.legal-body h2{color:var(--text-primary);margin:1.25rem 0 .4rem;font-size:.95rem;font-weight:600}.legal-body p{color:var(--text-secondary);margin:0 0 .5rem;font-size:.85rem;line-height:1.6}.legal-body ul{color:var(--text-secondary);margin:0 0 .5rem;padding-left:1.25rem;font-size:.85rem;line-height:1.6}.legal-body li{margin-bottom:.25rem}.auth-link{color:var(--accent);text-decoration:none}.auth-link:hover{text-decoration:underline}.form-field{flex-direction:column;gap:.4rem;display:flex}.form-label{color:var(--text-primary);font-size:.85rem;font-weight:500}.form-hint{color:var(--text-muted);font-size:.8rem;font-weight:400}.form-input{background:var(--bg-main);border:1px solid var(--bg-surface-raised);border-radius:var(--radius-sm);color:var(--text-bright);transition:border-color var(--transition-fast);outline:none;padding:.55rem .75rem;font-size:.95rem}.form-input:focus{border-color:var(--accent)}.form-error{border-radius:var(--radius-sm);color:#e88;background:#cd45451f;border:1px solid #cd454566;padding:.5rem .75rem;font-size:.875rem}.btn-primary{background:var(--accent);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast);border:none;padding:.65rem 1.25rem;font-size:.95rem;font-weight:600;text-decoration:none}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:disabled{opacity:.5;cursor:default}.btn-secondary{background:var(--bg-surface-raised);color:var(--text-primary);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast);padding:.65rem 1.25rem;font-size:.95rem;font-weight:500}.btn-secondary:hover{background:var(--bg-surface-hover)}.btn-secondary:disabled{opacity:.5;cursor:default}.btn-full{width:100%}.lobby-container{background:var(--bg-main);justify-content:center;align-items:flex-start;min-height:100vh;padding:2rem 1.5rem;display:flex}.lobby-inner{flex-direction:column;gap:1.5rem;width:100%;max-width:520px;display:flex}.lobby-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.lobby-user{align-items:center;gap:.75rem;display:flex}.lobby-username{color:var(--text-primary);font-weight:500}.lobby-elo{background:var(--bg-surface-raised);color:var(--accent);border-radius:999px;padding:.2rem .6rem;font-size:.85rem;font-weight:700}.lobby-section{background:var(--bg-surface);border:1px solid var(--bg-surface-raised);border-radius:var(--radius-md);flex-direction:column;gap:.75rem;padding:1.25rem;display:flex}.lobby-section-title{text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-size:.8rem;font-weight:600}.lobby-tc-grid{grid-template-columns:repeat(4,1fr);gap:.5rem;display:grid}.lobby-tc-tile{background:var(--bg-main);border:1px solid var(--bg-surface-raised);border-radius:var(--radius-sm);color:var(--text-primary);cursor:pointer;transition:border-color var(--transition-fast), color var(--transition-fast);padding:.5rem;font-size:.9rem;font-weight:600}.lobby-tc-tile:hover{border-color:var(--accent);color:var(--accent)}.lobby-tc-tile--active{border-color:var(--accent);color:var(--accent);background:#62992414}.lobby-invite-row,.lobby-join-row{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.lobby-code-display{color:var(--text-primary);align-items:center;gap:.75rem;font-size:.95rem;display:flex}.lobby-code-input{text-transform:uppercase;letter-spacing:.15em;flex:1;min-width:0;font-family:inherit;font-weight:700}.lobby-code-input::placeholder{text-transform:none;letter-spacing:normal;opacity:.5;font-size:.85rem;font-weight:400}.lobby-notice{border-radius:var(--radius-sm);color:var(--accent);background:#62992414;border:1px solid #62992440;padding:.65rem 1rem;font-size:.9rem}.lobby-notice--warn{color:#daa520;background:#cda54514;border-color:#cda5454d}.lobby-notice--error{color:#e88;background:#cd454514;border-color:#cd45454d}.lobby-footer{justify-content:space-between;padding:0 .25rem;display:flex}.lobby-searching{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.lobby-searching-text{color:var(--text-muted);flex:1;font-size:.9rem}@keyframes spin{to{transform:rotate(360deg)}}.lobby-spinner{border:3px solid #ffffff26;border-top-color:var(--accent);border-radius:50%;flex-shrink:0;width:22px;height:22px;animation:.8s linear infinite spin}.online-disconnect-banner{text-align:center;color:#daa520;background:#cda54526;padding:.4rem 1rem;font-size:.82rem;font-weight:500}.menu-active-game{background:var(--bg-surface-raised);border:1px solid var(--accent);border-radius:var(--radius-md);flex-direction:column;gap:.75rem;width:100%;padding:1rem 1.25rem;animation:.3s ease-out backwards fadeSlideUp;display:flex}.menu-active-game__info{color:var(--text-secondary);text-align:center;font-size:.9rem}.menu-active-game__actions{justify-content:center;gap:.5rem;display:flex}.menu-active-game__actions .btn{flex:1;min-width:0;padding:.5rem 1rem;font-size:.85rem}.first-move-banner{text-align:center;background:var(--bg-surface);border-top:1px solid var(--border-menu);color:var(--accent);z-index:100;padding:.5rem 1rem;font-size:.85rem;font-weight:600;transition:background .3s,color .3s;position:fixed;bottom:0;left:0;right:0}.first-move-banner--urgent{color:var(--danger)}.color-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px;display:inline-block}.color-dot--white{background:#fff;border:1.5px solid #999}.color-dot--black{background:#333;border:1.5px solid #666}.hand-player-name{white-space:nowrap;text-overflow:ellipsis;max-width:120px;font-weight:600;overflow:hidden}.win-banner{align-items:center;flex-direction:row!important;gap:.5rem!important;padding:.6rem 1rem!important}.win-banner .color-dot{width:12px;height:12px}.win-banner__text{color:var(--accent);font-size:1rem;font-weight:700}.win-banner--white{border-color:#ffffff26}.win-banner--black{border-color:#6464644d}.game-over-overlay{z-index:1000;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.game-over-card{background:var(--bg-surface);border:1px solid var(--bg-surface-raised);border-radius:var(--radius-lg);text-align:center;flex-direction:column;gap:.75rem;min-width:260px;padding:2.5rem;display:flex}.game-over-result{color:var(--text-bright);font-size:1.8rem;font-weight:700}.game-over-reason{color:var(--text-secondary);text-transform:capitalize;font-size:.9rem}.game-over-elo{font-size:1.4rem;font-weight:700}.game-over-actions{justify-content:center;gap:.5rem;margin-top:.75rem;display:flex}.elo-gain{color:#6bcf6b}.elo-loss{color:var(--danger)}.game-result-banner{background:var(--bg-surface);border-top:1px solid var(--border-menu);z-index:100;justify-content:center;align-items:center;gap:1rem;padding:.5rem 1rem;display:flex;position:fixed;bottom:0;left:0;right:0}.game-result-banner__text{color:var(--text-bright);font-size:.9rem;font-weight:600}.profile-card{max-width:480px}.profile-top-nav{align-items:center;margin-bottom:.75rem;display:flex}.profile-name-row{justify-content:center;align-items:center;gap:.4rem;display:flex}.profile-edit-btn{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:color var(--transition-fast);background:0 0;border:none;flex-shrink:0;padding:.25rem}.profile-edit-btn:hover{color:var(--text-bright)}.profile-name-edit{align-items:center;gap:.35rem;width:100%;max-width:360px;margin-bottom:.75rem;display:flex}.profile-name-input{flex:1;min-width:0;padding:.4rem .6rem;font-size:1rem}.profile-name-edit .btn-sm{flex:none;padding:.4rem .7rem;font-size:.8rem}.profile-username{text-align:center;color:var(--text-muted);margin-top:-.5rem;margin-bottom:1.5rem;font-size:.9rem}.profile-stats{grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:1.5rem;display:grid}.profile-stat{background:var(--bg-main);border-radius:var(--radius-sm);text-align:center;transition:border-color var(--transition-fast);border:1px solid #0000;padding:.75rem .5rem;position:relative}.profile-stat--has-tooltip:hover{border-color:var(--bg-surface-hover)}.profile-stat--accent .profile-stat__value{color:var(--accent)}.profile-stat--skeleton{min-height:60px}.profile-stat__value{color:var(--text-bright);font-size:1.4rem;font-weight:700}.profile-stat__label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;margin-top:.15rem;font-size:.7rem}.profile-stat__tooltip{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-sm);color:var(--text-secondary);white-space:nowrap;z-index:20;text-align:center;padding:.4rem .6rem;font-size:.72rem;line-height:1.5;display:none;position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%);box-shadow:0 4px 12px #0006}.profile-stat__tooltip:after{content:"";border:5px solid #0000;border-bottom-color:var(--bg-surface-hover);position:absolute;bottom:100%;left:50%;transform:translate(-50%)}.profile-stat--has-tooltip:hover .profile-stat__tooltip{display:block}.profile-section{margin-top:1rem}.profile-section-title{text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:.75rem;font-size:.8rem;font-weight:600}.elo-history-list{flex-direction:column;gap:.4rem;display:flex}.elo-history-row{background:var(--bg-main);border-radius:var(--radius-sm);justify-content:space-between;align-items:center;padding:.35rem .75rem;font-size:.9rem;display:flex}.elo-history-rating{color:var(--text-primary);font-weight:500}.elo-history-change{font-size:.85rem;font-weight:700}.history-item--no-review{cursor:default}.history-item--no-review:hover{background:0 0}.game-history-list{flex-direction:column;gap:.35rem;display:flex}.game-history-item{border-radius:var(--radius-sm);background:var(--bg-main);color:inherit;transition:background var(--transition-fast);align-items:center;gap:.75rem;padding:.5rem;text-decoration:none;display:flex}.game-history-item:hover{background:var(--bg-surface-hover)}.game-mini-board{border:1px solid var(--bg-surface-hover);border-radius:3px;flex-shrink:0;grid-template-rows:repeat(4,1fr);grid-template-columns:repeat(4,1fr);width:72px;height:72px;display:grid;overflow:hidden}.game-mini-cell{position:relative;overflow:hidden}.game-mini-cell.mini-dark{background:var(--cell-dark)}.game-mini-cell.mini-light{background:var(--cell-light)}.game-mini-cell.mini-win-light{background:var(--cell-light-win)}.game-mini-cell.mini-win-dark{background:var(--cell-dark-win)}.game-mini-piece{justify-content:center;align-items:center;display:flex;position:absolute;inset:1px}.game-mini-piece>div{filter:none!important;justify-content:center!important;align-items:center!important;width:100%!important;height:100%!important;margin:0!important;display:flex!important}.game-history-skeleton{pointer-events:none}.skeleton-board{background:var(--bg-surface-hover);animation:1.2s ease-in-out infinite skeleton-pulse}.skeleton-line{background:var(--bg-surface-hover);border-radius:4px;height:12px;animation:1.2s ease-in-out infinite skeleton-pulse}.skeleton-line--short{width:40%}.skeleton-line--long{width:70%}.game-history-empty{text-align:center;color:var(--text-muted);padding:1rem 0;font-size:.85rem}.game-history-pager{justify-content:center;align-items:center;gap:.25rem;margin-top:.75rem;display:flex}.pager-btn{border:1px solid var(--bg-surface-hover);border-radius:var(--radius-sm);background:var(--bg-surface-raised);width:32px;height:32px;color:var(--text-secondary);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);justify-content:center;align-items:center;font-size:.8rem;font-weight:600;display:flex}.pager-btn:hover:not(:disabled){background:var(--bg-surface-hover);color:var(--text-bright)}.pager-btn--active{background:var(--accent)!important;color:var(--bg-main)!important;border-color:var(--accent)!important}.pager-btn:disabled{opacity:.3;cursor:default}.pager-dots{text-align:center;width:24px;color:var(--text-muted);font-size:.8rem}@keyframes skeleton-pulse{0%{background-position:200% 0}to{background-position:-200% 0}}.game-history-info{flex-direction:column;flex:1;gap:.2rem;min-width:0;display:flex}.game-history-top{align-items:center;gap:.5rem;display:flex}.game-history-result{text-transform:uppercase;letter-spacing:.05em;font-size:.8rem;font-weight:700}.result-win{color:var(--accent)}.result-loss{color:#e06666}.result-draw{color:var(--text-muted)}.game-history-opponent{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;overflow:hidden}.game-history-bottom{color:var(--text-muted);align-items:center;gap:.5rem;font-size:.75rem;display:flex}.game-history-elo{font-weight:700}.game-history-time{margin-left:auto}.replay-container{background:var(--bg-main);justify-content:center;min-height:100dvh;padding:1.5rem 1rem;display:flex}.replay-layout{flex-direction:column;align-items:center;gap:.75rem;width:100%;max-width:480px;display:flex}.replay-header{align-items:center;gap:.75rem;width:100%;display:flex}.replay-back{border-radius:var(--radius-sm);background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);width:36px;height:36px;color:var(--text-secondary);transition:background var(--transition-fast);flex-shrink:0;justify-content:center;align-items:center;text-decoration:none;display:flex}.replay-back:hover{background:var(--bg-surface-hover);color:var(--text-bright)}.replay-title{flex-direction:column;gap:.1rem;min-width:0;display:flex}.replay-players{color:var(--text-bright);white-space:nowrap;text-overflow:ellipsis;font-size:.95rem;font-weight:600;overflow:hidden}.replay-result{color:var(--text-muted);font-size:.75rem}.replay-board-area{flex-direction:column;align-items:center;gap:.35rem;width:100%;display:flex}.replay-player-bar{width:100%;max-width:var(--board-size,320px);align-items:center;gap:.5rem;padding:.25rem;display:flex}.replay-player-name{color:var(--text-primary);font-size:.85rem;font-weight:600}.replay-player-elo{color:var(--text-muted);font-size:.75rem}.replay-board{width:100%;max-width:var(--board-size,320px);aspect-ratio:1;border-radius:var(--radius-md);border:2px solid var(--bg-surface-hover);flex-direction:column;display:flex;overflow:hidden}.replay-board-row{flex:1;display:flex}.replay-cell{aspect-ratio:1;transition:background var(--transition-fast);flex:1;justify-content:center;align-items:center;display:flex}.replay-cell.cell-light{background:var(--cell-light)}.replay-cell.cell-dark{background:var(--cell-dark)}.replay-cell.cell-light.cell-win{background:var(--cell-light-win)}.replay-cell.cell-dark.cell-win{background:var(--cell-dark-win)}.replay-controls{align-items:center;gap:.35rem;display:flex}.replay-controls .btn{padding:.5rem .75rem}.replay-play-btn{background:var(--accent)!important;color:#fff!important;border-color:var(--accent)!important}.replay-play-btn:hover{background:#5a9a24!important}.replay-move-counter{color:var(--text-muted);font-size:.75rem}.replay-moves{background:var(--bg-surface-raised);border-radius:var(--radius-md);border:1px solid var(--bg-surface-hover);width:100%;max-height:200px;padding:.25rem;overflow-y:auto}.replay-moves .moves-table{border-collapse:collapse;width:100%}.replay-moves .moves-num{text-align:center;width:28px;color:var(--text-muted);padding:.25rem .15rem;font-size:.75rem}.replay-moves .moves-cell{color:var(--text-primary);cursor:pointer;transition:background var(--transition-fast);border-radius:3px;padding:.25rem .5rem;font-size:.8rem}.replay-moves .moves-cell:hover{background:var(--bg-surface-hover)}.replay-moves .moves-cell--active{color:var(--accent);background:#62992433;font-weight:600}@media (width<=480px){.replay-container{padding:.75rem .5rem}.game-mini-board{width:56px;height:56px}}.auth-splash{background:var(--bg-main);z-index:9999;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;display:flex;position:fixed;inset:0}.auth-splash__logo{flex-direction:column;align-items:center;gap:.5rem;display:flex}.auth-splash__title{color:var(--text-bright);letter-spacing:.1rem;font-family:Inter,sans-serif;font-size:2.5rem;font-weight:700}.auth-splash__subtitle{color:var(--text-muted);letter-spacing:.4rem;text-transform:uppercase;font-size:1rem;font-weight:500}.auth-splash__pawn{filter:drop-shadow(0 0 12px #62992466);justify-content:center;align-items:center;width:64px;height:64px;animation:1.2s ease-in-out infinite pawn-bounce;display:flex}@keyframes pawn-bounce{0%,to{opacity:.8;transform:translateY(0)scaleY(1)}50%{opacity:1;transform:translateY(-25px)scaleY(1.05)}}.connection-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px;margin-right:8px;display:inline-block}.connection-dot.online{background:var(--accent);box-shadow:0 0 8px var(--accent)}.connection-dot.connecting{background:#f1c40f;animation:1.5s infinite connection-pulse}@keyframes connection-pulse{0%{opacity:.4}50%{opacity:1}to{opacity:.4}}.menu-user-nav{justify-content:center;align-items:center;margin-top:1rem;display:flex}.menu-user-group{align-items:center;gap:.75rem;display:flex}.menu-user-link{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-main);-webkit-user-select:none;user-select:none;align-items:center;gap:.6rem;padding:.5rem .9rem;text-decoration:none;display:flex}.menu-user-link:hover{background:var(--bg-surface-hover);border-color:var(--text-muted);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.menu-user-name{color:var(--text-bright);letter-spacing:.01rem;font-size:.95rem;font-weight:600}.menu-user-elo{color:var(--accent);text-transform:capitalize;background:#6299241a;border-radius:4px;padding:1px 6px;font-family:Inter,sans-serif;font-size:.85rem;font-weight:700}.menu-user-link{position:relative}.menu-user-elo-tooltip{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-md);z-index:100;min-width:140px;box-shadow:var(--shadow-lg);padding:.5rem .75rem;display:none;position:absolute;top:calc(100% + 8px);left:50%;transform:translate(-50%)}.menu-user-elo-tooltip:before{content:"";background:var(--bg-surface-raised);border-top:1px solid var(--bg-surface-hover);border-left:1px solid var(--bg-surface-hover);width:8px;height:8px;position:absolute;top:-5px;left:50%;transform:translate(-50%)rotate(45deg)}.menu-user-link:hover .menu-user-elo-tooltip{display:block}.elo-tooltip-row{justify-content:space-between;align-items:center;padding:.2rem 0;font-size:.82rem;display:flex}.elo-tooltip-row+.elo-tooltip-row{border-top:1px solid var(--bg-surface-hover)}.elo-tooltip-label{color:var(--text-secondary);font-weight:500}.elo-tooltip-value{color:var(--text-bright);font-family:Inter,sans-serif;font-weight:700}.btn-logout{background:var(--bg-surface-raised);border:1px solid var(--bg-surface-hover);color:var(--text-muted);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-main);justify-content:center;align-items:center;padding:.55rem;display:flex}.btn-logout:hover{background:var(--danger);color:#fff;border-color:var(--danger);transform:translateY(-1px);box-shadow:0 4px 12px #cd454533}.btn-logout--confirm{background:var(--danger);color:#fff;border-color:var(--danger)}.btn-logout__text{letter-spacing:.02em;font-size:.7rem;font-weight:600}.menu-auth-links{gap:1rem;display:flex}.skeleton-card{min-height:420px;position:relative;overflow:hidden}.skeleton-title{background:var(--bg-surface-hover);border-radius:var(--radius-sm);width:50%;height:2.2rem;margin:0 auto 1.25rem}.skeleton-subtitle{background:var(--bg-surface-hover);border-radius:var(--radius-sm);width:25%;height:.9rem;margin:0 auto 2.5rem}.profile-stats:has(.skeleton-stat){margin-bottom:2rem}.skeleton-stat{background:var(--bg-surface-hover)!important;border-radius:var(--radius-md)!important;height:64px!important;box-shadow:none!important;border:none!important}.skeleton-section{background:var(--bg-surface-hover);border-radius:var(--radius-md);width:100%;height:140px;margin-top:1.5rem}.auth-card [class*=skeleton-]{background:linear-gradient(90deg, var(--bg-surface-hover) 0%, var(--bg-surface-raised) 50%, var(--bg-surface-hover) 100%);background-size:200% 100%;animation:1.5s ease-in-out infinite skeleton-pulse}.menu-live-stats{background:var(--bg-surface-raised);border:1px solid var(--border-menu);color:var(--text-muted);box-shadow:var(--shadow-sm);-webkit-user-select:none;user-select:none;border-radius:20px;align-items:center;gap:1rem;padding:.5rem 1rem;font-size:.85rem;display:flex}.stat-item{align-items:center;gap:6px;display:flex}.stat-item strong{color:var(--text-bright)}.stat-divider{color:var(--border-menu)}.stat-pulse{border-radius:50%;width:6px;height:6px;position:relative}.stat-pulse.online{background-color:var(--success);box-shadow:0 0 8px var(--success)}.stat-pulse.games{background-color:var(--accent);box-shadow:0 0 8px var(--accent)}.menu-bottom-area{flex-direction:column;align-items:center;gap:6px;width:100%;padding-top:.5rem;display:flex}.site-footer{flex-wrap:wrap;justify-content:center;align-items:center;gap:.25rem 1rem;padding:1.5rem 0 .5rem;font-size:.75rem;display:flex}.site-footer__link{color:var(--text-muted);opacity:.6;transition:opacity var(--transition-main);text-decoration:none}.site-footer__link:hover{opacity:1}.leaderboard-page{background:var(--bg-main);justify-content:center;min-height:100dvh;padding:2rem 1rem;display:flex}.leaderboard-page__inner{flex-direction:column;gap:1rem;width:100%;max-width:480px;display:flex}.leaderboard-page__header{align-items:center;gap:1rem;display:flex}.leaderboard-page__back{color:var(--text-muted);align-items:center;gap:4px;font-size:.85rem;text-decoration:none;transition:color .15s;display:flex}.leaderboard-page__back:hover{color:var(--text-bright)}.leaderboard-page__title{color:var(--text-bright);letter-spacing:.5px;font-size:1.3rem;font-weight:700}.lb-tabs--page{justify-content:center}.lb-list--page{max-height:none}.lb-row--page{padding:10px 12px}.btn-leaderboard{color:var(--text-muted);border-radius:8px;align-items:center;gap:6px;padding:6px 12px;font-size:.82rem;text-decoration:none;transition:color .15s,background .15s;display:inline-flex}.btn-leaderboard:hover{color:var(--text-bright);background:var(--bg-surface-hover)}.lb-tabs{gap:4px;display:flex}.lb-tab{background:var(--bg-base);color:var(--text-muted);cursor:pointer;border:1px solid #0000;border-radius:6px;flex:1;padding:4px 6px;font-size:.75rem;transition:all .2s}.lb-tab:hover{background:var(--bg-surface-hover);color:var(--text-normal)}.lb-tab.active{background:var(--bg-surface-raised);border-color:var(--border-menu);color:var(--text-bright);box-shadow:var(--shadow-sm);font-weight:500}.lb-list{flex-direction:column;max-height:250px;padding:4px;display:flex;overflow-y:auto}.lb-row{color:var(--text-normal);border-radius:6px;align-items:center;gap:8px;padding:6px 8px;text-decoration:none;transition:background .2s;display:flex}.lb-row:hover{background:var(--bg-surface-hover)}.lb-rank{color:var(--text-muted);text-align:right;width:16px;font-size:.75rem;font-weight:700}.lb-name{white-space:nowrap;text-overflow:ellipsis;color:var(--text-bright);flex:1;font-size:.85rem;overflow:hidden}.lb-elo{color:var(--accent);font-size:.85rem;font-weight:600}.lb-empty{text-align:center;color:var(--text-muted);padding:1rem;font-size:.8rem}.lb-skeleton-row{pointer-events:none}.skeleton-block{background:var(--bg-surface-hover);border-radius:4px;animation:1.2s ease-in-out infinite skeleton-pulse;display:inline-block}.skeleton-block--rank{width:14px;height:14px}.skeleton-block--name{width:120px;height:14px}.skeleton-block--elo{width:36px;height:14px}.spectate-page{max-width:600px;margin:0 auto;padding:1.5rem 1rem}.spectate-header{align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.spectate-title{color:var(--text-primary);margin:0;font-size:1.4rem;font-weight:700}.spectate-loading,.spectate-empty,.spectate-not-found{color:var(--text-secondary);text-align:center;flex-direction:column;align-items:center;gap:1rem;padding:3rem 1rem;display:flex}.spectate-not-found h2{color:var(--text-primary);margin:0}.spectate-list{flex-direction:column;gap:.75rem;display:flex}.spectate-card{background:var(--bg-surface);color:var(--text-primary);border-radius:8px;padding:1rem 1.25rem;text-decoration:none;transition:background .12s,transform .12s;display:block}.spectate-card:hover{background:var(--bg-surface-hover);transform:translateY(-1px)}.spectate-card__players{flex-wrap:wrap;align-items:center;gap:.5rem;font-size:1rem;font-weight:600;display:flex}.spectate-card__player{align-items:center;gap:.35rem;display:flex}.spectate-card__color{border-radius:50%;flex-shrink:0;width:10px;height:10px;display:inline-block}.spectate-card__color.white{background:#fff;border:1px solid #888}.spectate-card__color.black{background:#333}.spectate-card__elo,.spectate-card__vs{color:var(--text-secondary);font-size:.85rem;font-weight:400}.spectate-card__meta{color:var(--text-secondary);gap:1rem;margin-top:.5rem;font-size:.8rem;display:flex}.spectate-banner{background:var(--bg-surface);border-bottom:1px solid var(--border-color);z-index:20;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;padding:.5rem 1rem;display:flex;position:relative}.spectate-badge{color:var(--text-secondary);background:var(--bg-surface-hover);letter-spacing:.02em;border-radius:999px;align-items:center;gap:.4rem;padding:.3rem .7rem;font-size:.8rem;font-weight:600;display:flex}.spectate-badge svg{opacity:.7}.spectate-badge__dot{background:#e74c3c;border-radius:50%;width:6px;height:6px;animation:2s ease-in-out infinite spectate-pulse}@keyframes spectate-pulse{0%,to{opacity:1}50%{opacity:.35}}.spectate-badge--inline{margin-left:auto;padding:.2rem .5rem;font-size:.75rem}.btn-back{color:var(--text-secondary);white-space:nowrap;flex-shrink:0;font-size:.85rem;text-decoration:none}.btn-back:hover{color:var(--text-primary)}.email-banner{border-radius:var(--radius-md);background:#6299241a;border:1px solid #62992440;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.75rem;padding:.7rem 1rem;animation:.3s ease-out banner-slide-in;display:flex}.email-banner--add{background:#f59e0b1a;border-color:#f59e0b40}.email-banner--add .email-banner__icon,.email-banner--add .email-banner__action{color:#f59e0b}.email-banner--add .email-banner__action:hover{background:#f59e0b26}.email-banner__content{color:var(--text-secondary);flex:1;align-items:center;gap:.6rem;min-width:0;font-size:.82rem;display:flex}.email-banner__icon{color:var(--accent);flex-shrink:0}.email-banner__action{color:var(--accent);cursor:pointer;border-radius:var(--radius-sm);transition:background var(--transition-main);white-space:nowrap;background:0 0;border:none;padding:.3rem .65rem;font-family:inherit;font-size:.8rem;font-weight:600}.email-banner__action:hover{background:#62992426}.email-banner__close{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:color var(--transition-main);background:0 0;border:none;flex-shrink:0;padding:.15rem .35rem;font-size:1.2rem;line-height:1}.email-banner__close:hover{color:var(--text-bright)}@keyframes banner-slide-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#000000b3;justify-content:center;align-items:center;padding:1rem;animation:.2s ease-out modal-fade-in;display:flex;position:fixed;inset:0}.modal-card{background:var(--bg-surface);border:1px solid var(--bg-surface-hover);border-radius:var(--radius-lg);width:100%;max-width:420px;padding:2rem;animation:.25s ease-out modal-scale-in;position:relative}.modal-close{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);transition:color var(--transition-main);background:0 0;border:none;padding:.25rem;font-size:1.5rem;line-height:1;position:absolute;top:1rem;right:1rem}.modal-close:hover{color:var(--text-bright)}.modal-title{color:var(--text-bright);margin-bottom:.5rem;font-family:Inter,sans-serif;font-size:1.2rem;font-weight:700}.modal-desc{color:var(--text-secondary);margin-bottom:1.25rem;font-size:.85rem;line-height:1.5}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.verify-status{text-align:center;flex-direction:column;align-items:center;gap:.75rem;padding:1.5rem 0;display:flex}.verify-icon{border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;font-size:1.6rem;font-weight:700;display:flex}.verify-icon--success{color:var(--accent);background:#62992426;border:2px solid #62992459}.verify-icon--error{color:var(--danger);background:#cd454526;border:2px solid #cd454559}.verify-text{color:var(--text-secondary);max-width:320px;font-size:.9rem;line-height:1.6}.verify-text strong{color:var(--text-bright)}.verify-text--error{color:var(--danger)}