.lobby-container{min-height:100vh;background:linear-gradient(140deg,#e6f7ff,#f8efff 55%,#fff4e0);padding:24px}.lobby-card{max-width:920px;margin:0 auto;background:#fff;border:1px solid #dce6f4;border-radius:16px;padding:24px;box-shadow:0 16px 40px #1420371f}.lobby-card h1{margin:0;color:#102142}.subtitle{color:#4a5a79;margin-top:8px}.status-line{font-weight:600;margin:10px 0 20px}.status-line.connected{color:#1a7f3c}.status-line.disconnected{color:#b42318}.invite-banner{background:#eef6ff;border:1px solid #b3d4f7;border-radius:10px;padding:12px 16px;margin-bottom:16px;color:#1d4e89;font-size:14px}.form-row{margin-bottom:16px}.form-row label{display:block;margin-bottom:6px;color:#2d3d5e;font-weight:600}.text-input{width:100%;border:1px solid #cad5e8;border-radius:10px;padding:10px 12px;font-size:15px;background:#fdfefe}.inline-row{display:flex;gap:10px}.btn{border:none;border-radius:10px;padding:10px 14px;font-weight:600;cursor:pointer;transition:opacity .15s}.btn-primary{background:#0046c7;color:#fff}.btn-secondary{background:#e6ecf8;color:#1f3158}.btn:disabled{cursor:not-allowed;opacity:.55}.error-line{margin-top:8px;color:#b42318}.rooms-section{margin-top:20px}.rooms-section h2{margin-bottom:12px}.rooms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}.room-card{border:1px solid #d8e1f1;border-radius:12px;padding:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:#f8fbff}.room-card h3{margin:0;font-size:16px}.room-card p{margin:4px 0 0;color:#4a5a79;font-size:13px}.header-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;flex-wrap:wrap}.btn-github{display:inline-flex;align-items:center;gap:6px;background:#24292e;color:#fff;padding:8px 16px;border-radius:8px;font-weight:600;font-size:13px;text-decoration:none;white-space:nowrap;transition:background .15s}.btn-github:hover{background:#3a3f44}.empty-state{color:#4a5a79}.rules-toggle{margin-top:20px;text-align:center}.btn-rules{background:#f0edff;color:#4a3f8a;border:1px solid #d4ccf5;padding:10px 24px}.rules-content{margin-top:16px;background:#f9f8ff;border:1px solid #e0dcf5;border-radius:12px;padding:20px}.rules-content h3{margin:0 0 16px;color:#2e2664}.rules-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.rules-list h4{margin:0 0 8px;font-size:15px}.rules-list p,.rules-list li{font-size:13px;line-height:1.6;color:#444}.rules-list ul,.rules-list ol{margin:0;padding-left:18px}@media(max-width:680px){.lobby-container{padding:12px}.lobby-card{padding:14px}.inline-row{flex-direction:column}.rules-list{grid-template-columns:1fr}}.site-footer{max-width:920px;margin:24px auto 0;text-align:center;padding:20px 0 12px;color:#5b6b8a;font-size:14px}.site-footer strong{color:#2d3d5e}.social-links{display:flex;justify-content:center;gap:16px;margin-top:10px}.social-links a{color:#5b6b8a;transition:color .15s,transform .15s;display:inline-flex}.social-links a:hover{color:#0046c7;transform:scale(1.15)}.chess-board{display:grid;grid-template-columns:repeat(14,minmax(28px,48px));border:2px solid #4a6fa5;border-radius:4px;overflow:hidden;-webkit-user-select:none;user-select:none}.square{width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;border:none;padding:0;cursor:default;position:relative;font-size:0;outline:none}.square.dead{background:transparent;pointer-events:none}.square.light{background:#f0d9b5}.square.dark{background:#b58863}.square.selected{background:#ff6!important}.square.valid-move{cursor:pointer}.square.last-move{background:#cdd26a!important}.square.clickable{cursor:pointer}.move-dot{width:30%;height:30%;border-radius:50%;background:#00000040;position:absolute}.capture-ring{position:absolute;inset:3px;border-radius:50%;border:3px solid rgba(0,0,0,.25)}.piece{font-size:clamp(18px,3vw,34px);line-height:1;z-index:1;font-weight:400}.piece.white{color:#fff;text-shadow:0 0 3px #000,0 1px 3px rgba(0,0,0,.6)}.piece.black{color:#1a1a2e;text-shadow:0 0 1px rgba(255,255,255,.3)}.piece.red{color:#c0392b;text-shadow:0 0 2px rgba(0,0,0,.3)}.piece.blue{color:#2471a3;text-shadow:0 0 2px rgba(0,0,0,.3)}@media(max-width:680px){.chess-board{grid-template-columns:repeat(14,minmax(20px,30px))}}.game-container{min-height:100vh;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);color:#e0e0e0;padding:12px;display:flex;flex-direction:column;align-items:center}.waiting-room{max-width:600px;margin:20px auto;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:24px;display:flex;flex-direction:column;gap:16px}.waiting-room h1{margin:0;font-size:24px}.your-info{font-size:15px}.invite-section{background:#ffffff0d;padding:14px;border-radius:10px;text-align:center}.invite-hint{margin-top:8px;font-size:13px;color:#aaa}.players-list h2{font-size:18px;margin-bottom:10px}.player-row{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;margin-bottom:6px;background:#ffffff0a}.player-row.empty{opacity:.4}.color-dot{width:14px;height:14px;border-radius:50%;flex-shrink:0}.color-dot.white{background:#f5f5f5;border:1px solid #999}.color-dot.red{background:#e74c3c}.color-dot.black{background:#34495e}.color-dot.blue{background:#3498db}.color-dot.empty{background:#555}.color-label{margin-left:auto;font-size:13px;color:#aaa}.color-badge{font-weight:700;padding:2px 8px;border-radius:4px}.color-badge.white{background:#f5f5f5;color:#333}.color-badge.red{background:#e74c3c;color:#fff}.color-badge.black{background:#34495e;color:#fff}.color-badge.blue{background:#3498db;color:#fff}.hint-text{color:#aaa;font-size:14px;text-align:center}.game-header{width:100%;max-width:800px;background:#ffffff0f;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px 16px;margin-bottom:12px}.header-top{display:flex;justify-content:space-between;align-items:center}.header-top h2{margin:0;font-size:18px}.header-info{display:flex;justify-content:space-between;align-items:center;margin:8px 0;flex-wrap:wrap;gap:8px}.turn-timer{display:flex;align-items:center;gap:6px;background:#ffffff1a;padding:6px 14px;border-radius:20px;font-weight:700;font-size:16px;color:#7fdbca;transition:color .3s,background .3s}.turn-timer.urgent{color:#f39c12;background:#f39c1226}.turn-timer.critical{color:#e74c3c;background:#e74c3c33;animation:timer-pulse .6s ease-in-out infinite}.timer-icon{font-size:18px}.timer-value{font-variant-numeric:tabular-nums;min-width:32px;text-align:center}@keyframes timer-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.turn-banner{display:flex;align-items:center;gap:10px;margin:10px 0 8px;padding:10px 16px;border-radius:10px;border:2px solid transparent;transition:border-color .3s,background .3s}.turn-banner.white{background:#f5f5f51a;border-color:#f5f5f566}.turn-banner.red{background:#e74c3c1a;border-color:#e74c3c66}.turn-banner.black{background:#34495e26;border-color:#34495e80}.turn-banner.blue{background:#3498db1a;border-color:#3498db66}.turn-banner.my-turn{animation:my-turn-glow 1.5s ease-in-out infinite}@keyframes my-turn-glow{0%,to{box-shadow:0 0 8px #ffd7004d}50%{box-shadow:0 0 20px #ffd70099}}.color-dot.large{width:20px;height:20px}.turn-text{font-weight:700;font-size:16px;flex:1}.next-up{font-size:12px;color:#aaa;white-space:nowrap}.player-cards{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0}.player-card{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:10px;border:2px solid transparent;background:#ffffff0a;transition:border-color .3s,background .3s,transform .2s;font-size:13px}.player-card.active-turn{border-color:gold;background:#ffd70014;transform:scale(1.05);animation:card-pulse 1.5s ease-in-out infinite}.player-card.next-turn{border-color:#ffffff40;border-style:dashed}.player-card.eliminated{opacity:.35;text-decoration:line-through}@keyframes card-pulse{0%,to{box-shadow:0 0 4px #ffd70033}50%{box-shadow:0 0 12px #ffd70073}}.player-card-name{font-weight:600}.player-card-side{color:#888;font-size:11px}.turn-badge{background:gold;color:#1a1a2e;font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px;text-transform:uppercase;animation:badge-blink 1s ease-in-out infinite}.next-badge{background:#ffffff26;color:#ccc;font-size:10px;font-weight:600;padding:2px 6px;border-radius:4px}.elim-badge{background:#e74c3c4d;color:#e74c3c;font-size:10px;font-weight:600;padding:2px 6px;border-radius:4px}@keyframes badge-blink{0%,to{opacity:1}50%{opacity:.6}}.status-text{font-size:13px;color:#ccc;margin:4px 0}.header-actions{display:flex;gap:8px;margin-top:6px}.btn{border:none;border-radius:8px;padding:10px 18px;font-weight:600;cursor:pointer;font-size:14px;transition:opacity .15s}.btn:hover{opacity:.85}.btn:disabled{cursor:not-allowed;opacity:.5}.btn-primary{background:#3498db;color:#fff}.btn-secondary{background:#ffffff1a;color:#ccc}.btn-invite{background:#27ae60;color:#fff;width:100%}.btn-start{background:#f39c12;color:#fff;padding:14px;font-size:16px;width:100%}.btn-leave{background:#e74c3c33;color:#e74c3c}.btn-small{padding:6px 12px;font-size:12px;background:#ffffff1a;color:#ccc;border:none;border-radius:6px;cursor:pointer}.btn-small:hover{background:#fff3}.game-board{display:flex;justify-content:center;padding:8px 0 24px}.rules-panel{background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:20px;margin:8px 0;max-width:800px;width:100%}.rules-panel h3{margin:0 0 16px;font-size:20px}.rules-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.rule-section h4{margin:0 0 8px;color:#3498db;font-size:15px}.rule-section ul{margin:0;padding-left:18px}.rule-section li{margin-bottom:5px;font-size:13px;line-height:1.5;color:#ccc}.game-over-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.game-over-card{background:#1a1a2e;border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:32px;text-align:center;max-width:400px}.game-over-card h2{margin:0 0 16px;font-size:28px}.game-over-card p{font-size:18px;margin-bottom:24px}.status-line{color:#8ab4f8;font-size:13px;margin-top:8px;text-align:center}@media(max-width:680px){.game-container{padding:8px}.waiting-room{padding:16px}.rules-grid{grid-template-columns:1fr}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.app{width:100%;min-height:100vh}:root{color:#ffffffde;background-color:#242424}a{color:#646cff;text-decoration:none}a:hover{color:#535bf2}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.container{max-width:1200px;margin:0 auto;padding:20px;text-align:center}