:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#e6edf3;background:#0b1020;line-height:1.5;font-weight:400}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(135deg,#0b1020,#121a2e)}button,input,select{font:inherit}button{background:#4f8cff;color:#fff;border:none;border-radius:10px;padding:.7rem 1rem;cursor:pointer}button:hover{background:#3f7ef0}.ready-button.ready{background:#2ea043;cursor:default}.ready-button.ready:hover{background:#2ea043}input,select{width:100%;background:#ffffff08;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:.7rem .8rem;color:#fff}select option{color:#0b1020;background:#fff}.app-shell{display:grid;grid-template-columns:360px 1fr;min-height:100vh}.sidebar{padding:1.5rem;background:#0a0e1be6;border-right:1px solid rgba(255,255,255,.08)}.sidebar h1{margin-top:0;font-size:2.2rem}.logo-area{display:flex;align-items:center;gap:.75rem}.logo-area img{width:48px;height:48px;object-fit:contain}.logo-area h1{margin:0}.panel{background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1rem;margin-bottom:1rem}.clock-row{width:min(72vmin,680px);display:flex;justify-content:space-between;align-items:center;gap:1rem}.player-clock-row{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:.75rem}.clock-thresholds{display:flex;flex-direction:column;flex-shrink:0;gap:.15rem;min-width:4rem;font-size:.72rem;font-weight:700}.score-box{min-width:3rem;flex-shrink:0;text-align:center;padding:.6rem .9rem;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#ffffff0d;font-size:1.7rem;font-weight:800;color:#edf3ff;margin-left:auto}.time-input-pair{display:flex;align-items:center;gap:.4rem}.time-input-pair input{width:4rem;flex:none}.time-input-pair span{opacity:.75;font-size:.85rem}.crawford-rule-checkbox{display:flex;align-items:center;gap:.3rem}.crawford-rule-checkbox label{width:100%}.player-clock{position:relative;display:flex;flex-direction:column;flex-shrink:0;gap:.15rem;min-width:160px;padding:.8rem 1rem;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:#ffffff08;color:#edf3ff}.player-clock.active{border-color:#59d38d;box-shadow:0 0 0 1px #59d38d66}.player-clock-name{font-size:.78rem;opacity:.8}.player-clock-value{font-size:1.7rem;font-weight:700;letter-spacing:.04em}.clock-gold{color:#d4af37}.clock-green{color:#2ea043}.clock-default{color:#edf3ff}.player-clock-bank{font-size:.72rem;opacity:.8}.panel label{display:block;margin-bottom:.5rem;color:#aab8d1}.actions{display:flex;flex-direction:column;gap:.75rem}.settings-grid{display:grid;grid-template-columns:1fr;gap:.7rem}.join-row{display:flex;gap:.5rem}.join-row input{flex:1}.match-buttons-row{display:flex;gap:.5rem}.match-buttons-row button{flex:1}.create-pane,.join-pane{display:flex;flex-direction:column;gap:.75rem;padding-top:.25rem}.join-pane{flex-direction:row}.join-pane input{flex:1}.time-control-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}.time-control-button{background:#ffffff0f;border:1px solid rgba(255,255,255,.14);padding:.6rem .4rem;font-size:.85rem}.time-control-button.selected{background:#4f8cff;border-color:#4f8cff}.custom-settings{border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:.6rem .8rem}.custom-settings summary{cursor:pointer;color:#aab8d1;font-size:.9rem}.custom-settings .settings-grid{margin-top:.75rem}.info-box p{margin:.3rem 0}.copy-pane{position:relative}.copy-pane p{margin:0 0 .6rem;color:#aab8d1}.copy-pane-row{display:flex;align-items:center;gap:.6rem}.copy-pane-code{flex:1;font-size:1.3rem;font-weight:700;letter-spacing:.08em}.copy-pane-dismiss{position:absolute;top:.5rem;right:.5rem;width:1.75rem;height:1.75rem;padding:0;line-height:1;background:transparent;border:none;color:#aab8d1;font-size:1.2rem;cursor:pointer}.copy-pane-dismiss:hover{color:#fff;background:transparent}.match-end-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0b1020bf;z-index:20}.tutorial-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(90%,560px);height:min(80%,640px);background:#121a2e;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:1.5rem 2rem;text-align:left;overflow-y:auto;z-index:30}.tutorial-dismiss{position:absolute;top:.5rem;right:.75rem;width:1.75rem;height:1.75rem;padding:0;line-height:1;background:transparent;border:none;color:#aab8d1;font-size:1.2rem;cursor:pointer}.match-end-panel{position:relative;min-width:280px;background:#121a2e;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:1.5rem 2rem;text-align:center}.match-end-panel h2{margin:0 0 1rem}.match-end-dismiss{position:absolute;top:.5rem;right:.75rem;width:1.75rem;height:1.75rem;padding:0;line-height:1;background:transparent;border:none;color:#aab8d1;font-size:1.2rem;cursor:pointer}.match-end-dismiss:hover{color:#fff;background:transparent}.match-end-actions{display:flex;align-items:flex-start;justify-content:center;gap:1rem}.match-end-action{display:flex;flex-direction:column;align-items:center;gap:.3rem}.match-end-substatus{font-size:.75rem;opacity:.75}.rematch-button.selected{border:2px solid #59d38d}.rematch-button:disabled{background:#ffffff14;color:#fff6;cursor:not-allowed}.leave-button{background:#d64545}.leave-button:hover{background:#c23a3a}.match-end-sidebar .match-end-actions{justify-content:flex-start}.error-box{background:#ff5c5c24;border-color:#ff5c5c57;color:#ffb4b4}.player-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}.player-list li{display:flex;justify-content:space-between;background:#ffffff05;border-radius:8px;padding:.5rem .75rem}.tutorial-button-panel{display:flex;justify-content:center;padding-top:4rem;gap:2rem}.tutorial-button{background:#4f8cff;color:#fff;border:none;border-radius:20px;padding:.7rem 1rem;cursor:pointer;display:flex;justify-content:center}.board-panel{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;gap:1.5rem}.board-wrap{width:min(72vmin,680px);max-width:100%}.game-area{display:flex;align-items:center;gap:1.25rem}.board-column{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.cube-column{position:relative;width:64px;height:min(72vmin,680px);flex:none}.cube-box{position:absolute;left:0;width:64px;height:64px;display:flex;align-items:center;justify-content:center;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:#edf3ff;font-size:1.8rem;font-weight:800;color:#0b1020;cursor:pointer;transition:top .5s ease;-webkit-user-select:none;user-select:none}.cube-box.cube-disabled{cursor:default;background:#edf3ff8c;color:#0b102099}.cube-tooltip{display:none;position:absolute;left:100%;top:50%;transform:translateY(-50%);margin-left:.5rem;width:200px;z-index:9999;background:#121a2e;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:.5rem .7rem;font-size:.75rem;font-weight:400;color:#edf3ff;text-align:left;white-space:normal}.cube-box.cube-disabled:hover .cube-tooltip{display:block}.cube-position-center{top:calc(50% - 32px)}.cube-position-top{top:0}.cube-position-bottom{top:calc(100% - 64px)}.cube-decision-box{position:absolute;top:50%;left:100%;transform:translateY(-50%);margin-left:.5rem;width:220px;z-index:5;display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:.6rem .8rem;border-radius:10px;border:1px solid rgba(250,8,8,.836);background:#121a2e;text-align:center;font-size:.8rem}.cube-decision-box.cube-accepted{background:#daffe1d5;border-color:#00bb22e3;color:#0b1020}.cube-decision-box p{margin:0}.cube-decision-timer{font-weight:700}.cube-decision-actions{display:flex;gap:.4rem}.cube-decision-actions button{padding:.4rem .7rem}.empty-board{width:min(72vmin,680px);height:min(72vmin,680px);display:flex;align-items:center;justify-content:center;border:1px dashed rgba(255,255,255,.2);border-radius:16px;background:#ffffff05;color:#c6d4e8}.moves-panel{width:min(72vmin,680px);background:#ffffff08;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:1rem}.game-tabs{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.75rem}.game-tab{background:#ffffff0f;border:2px solid transparent;padding:.4rem .7rem;font-size:.85rem}.game-tab-white{background:#edf3ff;color:#0b1020}.game-tab-black{background:#0b1020;color:#fff;border-color:#ffffff40}.game-tab.selected{border-color:#4f8cff}.move-grid{display:grid;grid-template-columns:repeat(2,minmax(100px,1fr));gap:.5rem}.move-row{display:flex;gap:.5rem;background:#ffffff05;border-radius:8px;padding:.5rem .75rem;cursor:pointer}.move-row.selected{outline:2px solid #4f8cff}@media (max-width: 900px){.app-shell{grid-template-columns:1fr}.sidebar{border-right:none;border-bottom:1px solid rgba(255,255,255,.08)}}