@import"https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=DM+Mono:wght@400;500&family=DM+Sans:wght@300;400;500&display=swap";*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}.chess-app{--surface:#211913;--surface-hover:#2c2118;--surface-sel:#3d2e14;font-family:DM Sans,sans-serif;background:var(--bg);color:#f0ece3;position:relative;overflow:hidden;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;-webkit-tap-highlight-color:transparent}.board-pattern{position:absolute;inset:0;background-color:var(--bg);background-image:radial-gradient(130% 95% at 50% -12%,#965c2e29,#965c2e00 55%),repeating-conic-gradient(#241710 0% 25%,#1b120b 0% 50%);background-size:100% 100%,58px 58px;background-repeat:no-repeat,repeat}.screen{position:relative;z-index:1}#setup-screen{padding:clamp(1.5rem,5vw,3rem) clamp(1.25rem,5vw,2rem);display:flex;flex-direction:column;gap:clamp(1.1rem,3.2vw,1.6rem);width:100%;max-width:640px;align-self:center;flex:1;justify-content:center;overflow-y:auto}.app-title{text-align:center;font-family:Playfair Display,serif;font-size:clamp(1.9rem,6vw,2.7rem);font-weight:900;letter-spacing:.05em;color:#e8d5a3}.app-title a{color:inherit;text-decoration:none}.app-title a:hover{color:#f0e4bc}.app-subtitle{text-align:center;font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:#666;margin-top:-1rem}.section-label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#888;margin-bottom:8px}.names-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.name-input-wrap{display:flex;align-items:center;gap:10px;background:var(--surface);border:.5px solid rgba(255,255,255,.12);border-radius:8px;padding:10px 14px}.piece-icon{font-size:22px}.name-input{background:none;border:none;outline:none;font-family:DM Sans,sans-serif;font-size:14px;color:#f0ece3;width:100%}.name-input::placeholder{color:#555}.time-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.time-card{background:var(--surface);border:.5px solid rgba(255,255,255,.1);border-radius:10px;padding:12px;cursor:pointer;transition:all .15s;position:relative}.time-card:hover{background:var(--surface-hover);border-color:#e8d5a34d}.time-card.selected{background:var(--surface-sel);border-color:#e8d5a3;border-width:1px}.time-card-type{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#888;margin-bottom:4px}.time-card.bullet .time-card-type{color:#e87b5a}.time-card.blitz .time-card-type{color:#e8c45a}.time-card.rapid .time-card-type{color:#7be8a3}.time-card.classical .time-card-type{color:#5ab4e8}.time-card-name{font-family:DM Mono,monospace;font-size:14px;font-weight:500;color:#f0ece3;margin-bottom:3px}.time-card-desc{font-size:10px;color:#666;line-height:1.4}.check-dot{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;background:#e8d5a3;display:none}.time-card.selected .check-dot{display:block}.side-row{display:flex;gap:10px}.side-btn{flex:1;background:var(--surface);border:.5px solid rgba(255,255,255,.12);border-radius:8px;padding:12px;cursor:pointer;text-align:center;transition:all .15s;font-family:DM Sans,sans-serif}.side-btn:hover{background:var(--surface-hover)}.side-btn.selected{background:var(--surface-sel);border-color:#e8d5a3;border-width:1px}.side-btn-icon{font-size:24px;margin-bottom:4px}.side-btn-label{font-size:12px;color:#aaa;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side-btn.selected .side-btn-label{color:#e8d5a3}.side-btn-role{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#666;margin-top:3px}.side-btn.selected .side-btn-role{color:#e8d5a3}.seat-icon{opacity:.8}.start-btn{-webkit-appearance:none;appearance:none;width:100%;background:#e8d5a3;color:#0d0d0d;border:1px solid #e8d5a3;border-radius:10px;padding:16px;font-family:DM Sans,sans-serif;font-size:15px;font-weight:500;letter-spacing:.08em;cursor:pointer;transition:all .15s}.start-btn:hover{background:#f0e4bc;transform:scale(1.01)}.spacebar-hint{text-align:center;font-size:11px;color:#555;letter-spacing:.08em}#clock-screen{display:none;flex:1;flex-direction:column;min-height:0}#clock-screen>div{flex:1;display:flex;flex-direction:column;min-height:0}.clocks-wrap{display:flex;flex-direction:column;flex:1;min-height:0}.clock-half{display:flex;flex-direction:column;flex:1;min-height:0;transition:background .2s;user-select:none}.clock-half.white-side{background:#ffffff08}.clock-half.black-side{background:#0006}.clock-half.active-turn.white-side{background:#ffffff14}.clock-half.active-turn.black-side{background:#e8d5a30f}.clock-half.inactive-turn .timer-area{opacity:.55}.clock-half.flagged-bg{background:#b4282826!important;opacity:1!important}.timer-area{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(12px,3vh,30px) clamp(12px,4vw,28px);cursor:pointer;min-height:0;touch-action:manipulation}.player-name-display{font-size:clamp(.72rem,2.4vw,1rem);letter-spacing:.12em;text-transform:uppercase;color:#888;margin-bottom:6px;text-align:center}.clock-label{font-size:clamp(.62rem,1.8vw,.85rem);letter-spacing:.15em;text-transform:uppercase;margin-bottom:4px}.clock-label.white-label{color:#aaa}.clock-label.black-label{color:#666}.time-display{font-family:DM Mono,monospace;font-size:clamp(3rem,13vmin,7.5rem);font-weight:500;letter-spacing:-.02em;line-height:1}.time-display.white-time{color:#f5f0e8}.time-display.black-time{color:#c0b99a}.time-display.warning{color:#e8784a!important}.time-display.flagged-color{color:#e84a4a!important}.move-count{font-size:12px;color:#555;margin-top:8px;letter-spacing:.08em}.tap-hint{font-size:11px;color:#555;margin-top:5px;letter-spacing:.1em}.flagged-msg{font-family:Playfair Display,serif;font-size:clamp(1.1rem,4vw,1.6rem);font-weight:700;color:#e84a4a;display:none;margin-top:8px}.flagged-msg.show{display:block}.action-bar{display:flex;gap:12px;padding:12px 20px;background:#1a1a1a;justify-content:center;border-top:1px solid #2a2a2a}.clock-half.bot .action-bar{order:-1;border-top:none;border-bottom:1px solid #2a2a2a}.act-btn{-webkit-appearance:none;appearance:none;font-family:DM Sans,sans-serif;font-size:14px;font-weight:600;letter-spacing:.03em;border-radius:8px;padding:11px 0;cursor:pointer;border:1px solid transparent;transition:all .15s;flex:1;max-width:180px}.act-btn.btn-resign{background:#7a1f1f;color:#faa}.act-btn.btn-resign:not(:disabled):hover{background:#a02828;color:#fcc}.act-btn.btn-resign:disabled{background:#3a2020;color:#9b6f6f;border-color:#5a3030;cursor:not-allowed}.act-btn.btn-win{background:#1a5c30;color:#8fa}.act-btn.btn-win:not(:disabled):hover{background:#227a3e;color:#afc}.act-btn.btn-win:disabled{background:#1c3a26;color:#6a9b7c;border-color:#2f5a3e;cursor:not-allowed}.control-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:#120d08;border-top:.5px solid rgba(255,255,255,.08);position:relative;z-index:5}.game-info-type{font-size:13px;font-weight:500;color:#e8d5a3;letter-spacing:.06em}.game-info-control{font-size:11px;color:#666;margin-top:2px;text-align:center}.ctrl-btn{-webkit-appearance:none;appearance:none;background:var(--surface);border:.5px solid rgba(255,255,255,.15);border-radius:7px;padding:8px 14px;color:#aaa;font-family:DM Sans,sans-serif;font-size:12px;cursor:pointer;transition:all .15s;letter-spacing:.06em}.ctrl-btn:hover{background:var(--surface-hover);color:#e8d5a3}.ctrl-btn.danger:hover{background:#3a1414;border-color:#c83c3c80;color:#e88}.status-dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:5px;vertical-align:middle}.status-dot.running{background:#7be88a;animation:blink 1s infinite}.status-dot.paused{background:#e8c45a}.status-dot.stopped{background:#666}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}.result-overlay{position:absolute;inset:0;z-index:20;display:none;align-items:center;justify-content:center;background:#000000d1}.result-overlay.show{display:flex}.result-box{background:#141414;border:.5px solid rgba(232,213,163,.3);border-radius:16px;padding:2rem 2.5rem;text-align:center;max-width:300px;width:90%}.result-crown{font-size:52px;margin-bottom:12px}.result-title{font-family:Playfair Display,serif;font-size:24px;font-weight:700;color:#e8d5a3;margin-bottom:6px}.result-subtitle{font-size:13px;color:#888;margin-bottom:20px;line-height:1.5}.result-times{display:flex;gap:16px;justify-content:center;margin-bottom:20px}.result-time-item{text-align:center}.result-time-label{font-size:10px;color:#666;letter-spacing:.1em;text-transform:uppercase}.result-time-val{font-family:DM Mono,monospace;font-size:20px;color:#f0ece3;margin-top:2px}.result-new-btn{-webkit-appearance:none;appearance:none;width:100%;background:#e8d5a3;color:#0d0d0d;border:none;border-radius:8px;padding:13px;font-family:DM Sans,sans-serif;font-size:14px;font-weight:500;cursor:pointer;transition:all .15s}.result-new-btn:hover{background:#f0e4bc}.result-secondary-btn{-webkit-appearance:none;appearance:none;width:100%;background:var(--surface);color:#888;border:.5px solid rgba(255,255,255,.15);border-radius:8px;padding:11px;margin-top:8px;font-family:DM Sans,sans-serif;font-size:13px;cursor:pointer;transition:all .15s}.result-secondary-btn:hover{color:#e8d5a3;border-color:#e8d5a366}button,.timer-area,.time-card,.side-btn{touch-action:manipulation}.result-box{max-width:clamp(300px,40vw,380px)}@media(max-width:360px){.time-grid{grid-template-columns:repeat(2,1fr)}}@media(orientation:landscape){.clocks-wrap{flex-direction:row}.clock-half{flex:1 1 0;min-width:0}.control-bar{flex-direction:column;justify-content:center;gap:clamp(10px,2.4vh,20px);padding:clamp(14px,2.6vh,22px) clamp(10px,1.4vw,18px);border-top:none;border-left:.5px solid rgba(255,255,255,.08);border-right:.5px solid rgba(255,255,255,.08);width:auto;min-width:clamp(124px,14vw,190px);text-align:center}.control-bar .game-info-control{text-align:center}.control-bar .ctrl-btn{width:100%}.timer-area{padding:clamp(10px,2.5vh,28px) clamp(12px,2vw,26px)}.time-display{font-size:clamp(2.75rem,11vmin,8rem)}}@media(orientation:landscape)and (min-width:1500px){#clock-screen>div{max-width:1500px;align-self:center;width:100%}}