:root{--color-bg: #0a0e1a;--color-surface: #1a1f3d;--color-surface-alt: #141831;--color-secondary: #131832;--color-border: #2a3058;--color-gold: #d4a843;--color-gold-dim: #a07c2e;--color-teal: #2d8a7e;--color-teal-glow: #3adfca;--color-taxi: #e8c840;--color-bus: #4a9e5c;--color-underground: #c44040;--color-text: #e0ddd4;--color-text-muted: #7a7e94;--color-danger: #c44040;--color-success: #4a9e5c;--color-det-blue: #4a90d9;--color-det-red: #d94a4a;--color-det-green: #4ad97e;--color-det-yellow: #d9b44a;--color-det-purple: #9b59b6;--color-mr-x: #6b21a8;--font-heading: "Georgia", "Times New Roman", serif;--font-body: "Segoe UI", system-ui, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", monospace;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;--sp-10: 40px;--dur-fast: .15s;--dur-normal: .3s;--dur-slow: .6s;--ease-expo: cubic-bezier(.16, 1, .3, 1);--ease-inout: cubic-bezier(.4, 0, .2, 1);--shadow-card: 0 2px 8px rgba(0,0,0,.4);--shadow-elevated: 0 4px 24px rgba(0,0,0,.6);--shadow-gold: 0 0 12px rgba(212,168,67,.4);--shadow-teal: 0 0 12px rgba(45,138,126,.5)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden;background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);font-size:14px;-webkit-font-smoothing:antialiased}ul,ol{list-style:none}.hidden{display:none!important}@keyframes pulse-glow{0%,to{stroke-width:2;opacity:.9}50%{stroke-width:5;opacity:1}}@keyframes pulse-teal{0%,to{filter:drop-shadow(0 0 4px var(--color-teal-glow))}50%{filter:drop-shadow(0 0 10px var(--color-teal-glow)) drop-shadow(0 0 4px #fff)}}@keyframes token-arrive{0%{transform:scale(1.6);opacity:.5}to{transform:scale(1);opacity:1}}@keyframes fog-drift{0%{transform:translate(-10px) rotate(0);opacity:.3}50%{transform:translate(10px) rotate(5deg);opacity:.6}to{transform:translate(-10px) rotate(0);opacity:.3}}@keyframes reveal-flash{0%{fill:#6b21a8;opacity:1}50%{fill:#fff;opacity:.9}to{fill:#6b21a8;opacity:.5}}@keyframes fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}#lobby{position:relative;min-height:100vh;overflow:hidden}.title-screen{position:relative;display:flex;align-items:center;justify-content:center;min-height:100vh;z-index:1}.title-bg{position:absolute;inset:0;background:radial-gradient(ellipse at 20% 30%,rgba(45,138,126,.1) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(160,124,46,.08) 0%,transparent 50%),radial-gradient(ellipse at 50% 80%,rgba(107,33,168,.06) 0%,transparent 50%),linear-gradient(180deg,#060a14,#0a0e1a 30%,#111630 70%,#0d1020);z-index:0}.title-fog{position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0%,rgba(200,200,200,.02) 20%,transparent 40%);animation:fog-drift 12s ease-in-out infinite;pointer-events:none}.title-badges{position:absolute;top:var(--sp-6);right:var(--sp-6);display:flex;gap:var(--sp-2);z-index:2}.title-badge{padding:var(--sp-1) var(--sp-4);border-radius:20px;border:1px solid rgba(255,255,255,.2);background:#ffffff0d;color:#ffffffb3;font-size:.8rem;backdrop-filter:blur(4px)}.title-content{position:relative;z-index:1;text-align:center;max-width:520px;width:100%;padding:var(--sp-8);animation:fade-in .6s var(--ease-expo)}.title-logo{font-family:var(--font-heading);font-size:clamp(2.8rem,6vw,4.2rem);color:#f0e6c8;letter-spacing:.04em;text-shadow:0 2px 8px rgba(212,168,67,.4),0 0 40px rgba(212,168,67,.15);margin-bottom:var(--sp-2);line-height:1.1}.title-sub-banner{display:flex;align-items:center;justify-content:center;gap:var(--sp-4);margin-bottom:var(--sp-4)}.title-sub-line{display:block;width:60px;height:1px;background:linear-gradient(90deg,transparent,var(--color-gold),transparent)}.title-sub-text{font-family:var(--font-body);font-size:1rem;color:var(--color-gold);letter-spacing:.25em;font-weight:600}.title-tagline{color:var(--color-text-muted);font-family:var(--font-heading);font-size:.95rem;line-height:1.6;margin-bottom:var(--sp-8)}.title-menu{display:flex;flex-direction:column;gap:var(--sp-4);max-width:380px;margin:0 auto}.title-btn{display:flex;align-items:center;justify-content:center;gap:var(--sp-3);width:100%;padding:var(--sp-4) var(--sp-6);border:1px solid rgba(255,255,255,.15);border-radius:10px;font-family:var(--font-body);font-size:1.05rem;font-weight:600;cursor:pointer;transition:all .2s ease;letter-spacing:.02em}.title-btn-icon{font-size:1.2rem}.title-btn--join{background:linear-gradient(135deg,#2a4a7a,#1a3560);color:#c8daf0;border-color:#4a90d94d}.title-btn--join:hover{background:linear-gradient(135deg,#345a8f,#1f3f72);border-color:#4a90d980;box-shadow:0 4px 20px #4a90d933;transform:translateY(-1px)}.title-btn--create{background:linear-gradient(135deg,#2a6a3a,#1a4a28);color:#c8f0d0;border-color:#4a9e5c4d}.title-btn--create:hover{background:linear-gradient(135deg,#357a45,#1f5530);border-color:#4a9e5c80;box-shadow:0 4px 20px #4a9e5c33;transform:translateY(-1px)}.title-btn--rules{background:linear-gradient(135deg,#2a3a6a,#1a2a50);color:#c0c8e0;border-color:#6478b44d}.title-btn--rules:hover{background:linear-gradient(135deg,#354a80,#1f3560);border-color:#6478b480;box-shadow:0 4px 20px #6478b426;transform:translateY(-1px)}.title-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important;box-shadow:none!important}.title-form{display:flex;flex-direction:column;gap:var(--sp-4);max-width:380px;margin:0 auto;animation:fade-in .3s ease}.form-heading{font-family:var(--font-heading);font-size:1.3rem;color:var(--color-gold);margin-bottom:var(--sp-2)}.title-back-btn{background:none;border:none;color:var(--color-text-muted);font-size:.9rem;cursor:pointer;padding:var(--sp-2);transition:color .2s}.title-back-btn:hover{color:var(--color-text)}input[type=text]{width:100%;padding:var(--sp-3) var(--sp-4);background:#1a1f3dcc;border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);font-family:var(--font-body);font-size:1rem;outline:none;transition:border-color var(--dur-fast) ease}input[type=text]::placeholder{color:var(--color-text-muted)}input[type=text]:focus{border-color:var(--color-gold);box-shadow:0 0 0 2px #d4a84326}.room-list-container{border:1px solid var(--color-border);border-radius:8px;overflow:hidden}.room-list-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-2) var(--sp-4);background:var(--color-surface-alt);color:var(--color-text-muted);font-size:.8rem;border-bottom:1px solid var(--color-border)}.room-list-refresh{background:none;border:none;color:var(--color-gold-dim);font-size:1.1rem;cursor:pointer;padding:2px 6px;border-radius:4px;transition:all .2s}.room-list-refresh:hover{color:var(--color-gold);background:#d4a8431a}.room-list{max-height:240px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--color-border) transparent}.room-list-empty{padding:var(--sp-6) var(--sp-4);text-align:center;color:var(--color-text-muted);font-size:.9rem}.room-list-item{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid rgba(42,48,88,.5);cursor:pointer;transition:background .15s}.room-list-item:last-child{border-bottom:none}.room-list-item:hover{background:#d4a8430f}.room-list-info{display:flex;flex-direction:column;gap:2px}.room-list-host{font-size:.95rem;color:var(--color-text);font-weight:600}.room-list-code{font-size:.75rem;color:var(--color-text-muted);font-family:var(--font-mono)}.room-list-players{font-size:.8rem;color:var(--color-gold-dim);white-space:nowrap}.room-list-right{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.room-list-ingame{font-size:.65rem;padding:1px 6px;border-radius:8px;background:#4a9e5c26;color:var(--color-bus);font-weight:600}.manual-join{color:var(--color-text-muted);font-size:.85rem}.manual-join summary{cursor:pointer;padding:var(--sp-2) 0;user-select:none}.manual-join summary:hover{color:var(--color-text)}.manual-join-row{display:flex;gap:var(--sp-2);margin-top:var(--sp-2)}.manual-join-row input{flex:1}.btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--sp-3) var(--sp-6);border-radius:8px;border:none;font-family:var(--font-body);font-size:.95rem;font-weight:600;cursor:pointer;transition:all var(--dur-fast) ease;letter-spacing:.03em}.btn-primary{background:var(--color-gold);color:#0a0e1a;width:100%;box-shadow:var(--shadow-gold)}.btn-primary:hover:not(:disabled){background:#e0b850;box-shadow:0 0 18px #d4a84399;transform:translateY(-1px)}.btn-secondary{background:transparent;color:var(--color-gold);border:1px solid var(--color-gold)}.btn-secondary:hover:not(:disabled){background:#d4a8431a}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important}.waiting-room{margin-top:var(--sp-6);padding-top:var(--sp-6);border-top:1px solid var(--color-border)}.room-code-display{display:flex;align-items:center;justify-content:center;gap:var(--sp-3);margin-bottom:var(--sp-5)}.room-code-label{color:var(--color-text-muted);font-size:.85rem}.room-code-value{font-family:var(--font-mono);font-size:1.5rem;font-weight:700;color:var(--color-gold);letter-spacing:.25em;text-shadow:var(--shadow-gold);cursor:pointer;user-select:all}.room-code-value:hover{text-shadow:0 0 18px rgba(212,168,67,.7)}.player-list{display:flex;flex-direction:column;gap:var(--sp-2);margin-bottom:var(--sp-5)}.player-list li{padding:var(--sp-2) var(--sp-4);background:var(--color-surface-alt);border-radius:6px;border-left:3px solid var(--color-gold);display:flex;align-items:center;gap:var(--sp-2);font-size:.9rem}.player-list .host-badge{font-size:.7rem;background:var(--color-gold);color:#0a0e1a;padding:1px var(--sp-2);border-radius:4px;font-weight:700;margin-left:auto}.waiting-text{text-align:center;color:var(--color-text-muted);font-size:.85rem;margin-top:var(--sp-3)}#app{display:flex;flex-direction:column;height:100vh;overflow:hidden}.top-bar{display:flex;align-items:center;justify-content:space-between;padding:0 var(--sp-6);height:48px;background:var(--color-secondary);border-bottom:1px solid var(--color-border);flex-shrink:0;z-index:10}.logo{font-family:var(--font-heading);font-size:1.2rem;color:var(--color-gold);letter-spacing:.06em;text-shadow:0 0 8px rgba(212,168,67,.3)}.header-info{display:flex;align-items:center;gap:var(--sp-2)}.badge{display:inline-block;padding:3px var(--sp-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:20px;font-size:.78rem;color:var(--color-text-muted);font-family:var(--font-mono);letter-spacing:.04em}.badge:not(:empty){color:var(--color-text)}.game-layout{display:flex;flex:1;overflow:hidden;min-height:0}.sidebar{background:var(--color-secondary);border-color:var(--color-border);display:flex;flex-direction:column;overflow-y:auto;flex-shrink:0;z-index:10}.sidebar-left{width:240px;border-right:1px solid var(--color-border);padding:var(--sp-4);gap:var(--sp-1)}.sidebar-right{width:260px;border-left:1px solid var(--color-border);padding:var(--sp-4)}.sidebar-title{font-family:var(--font-heading);font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;color:var(--color-gold-dim);padding:var(--sp-2) 0;border-bottom:1px solid var(--color-border);margin-bottom:var(--sp-3);margin-top:var(--sp-3);flex-shrink:0}.sidebar-title:first-child{margin-top:0}#player-panel{display:flex;flex-direction:column;gap:var(--sp-2)}.player-card{display:flex;flex-direction:column;padding:var(--sp-2) var(--sp-3);background:var(--color-surface-alt);border-radius:6px;border-left:3px solid var(--color-border);transition:border-color var(--dur-fast) ease;gap:2px}.player-card--active{border-left-color:var(--color-gold);background:#d4a8430d}.player-card--stranded{opacity:.5}.player-card-name{font-size:.88rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:10ch}.player-card-tickets{display:flex;gap:var(--sp-2);font-size:.72rem;color:var(--color-text-muted);font-family:var(--font-mono)}.player-card-tickets span{display:flex;align-items:center;gap:2px}.stranded-badge{font-size:.65rem;background:var(--color-danger);color:#fff;padding:1px var(--sp-2);border-radius:3px;font-weight:700;width:fit-content}.player-card--blue{border-left-color:var(--color-det-blue)}.player-card--red{border-left-color:var(--color-det-red)}.player-card--green{border-left-color:var(--color-det-green)}.player-card--yellow{border-left-color:var(--color-det-yellow)}.player-card--purple{border-left-color:var(--color-det-purple)}.player-card--mr-x{border-left-color:var(--color-mr-x)}.mrx-history{display:flex;flex-direction:column;gap:var(--sp-1);overflow-y:auto;max-height:220px}.mrx-history li{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1) var(--sp-2);background:var(--color-surface-alt);border-radius:4px;font-size:.78rem;color:var(--color-text-muted);counter-increment:mrx-move}.mrx-history li .move-round{font-family:var(--font-mono);color:var(--color-text-muted);min-width:20px;font-size:.7rem}.mrx-history li .move-transport{font-size:.95rem}.mrx-history li .move-position{font-family:var(--font-mono);color:var(--color-text);font-weight:600}.mrx-history li.reveal{color:var(--color-gold);background:#d4a84314}.mrx-history li.double-first{border-left:2px solid var(--color-mr-x);padding-left:6px}.mrx-history li.double-second{border-left:2px solid var(--color-mr-x);padding-left:6px;opacity:.8}.board-container{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at center,#1a1f3d99,#0a0e1ae6),var(--color-bg);position:relative}#game-board{max-width:100%;max-height:calc(100vh - 140px);width:100%;height:100%;display:block;cursor:grab}#game-board:active{cursor:grabbing}.conn{stroke-linecap:round;pointer-events:none;transition:opacity var(--dur-normal) ease}.conn--taxi{stroke:var(--color-taxi);stroke-width:1.5;stroke-dasharray:4 3;opacity:.3}.conn--bus{stroke:var(--color-bus);stroke-width:2.5;opacity:.5}.station{cursor:default;transition:opacity .2s}.station--valid{cursor:pointer;animation:pulse-teal 1.5s ease-in-out infinite}.station--selected{animation:none}.board-container{position:relative}#board-draw-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:20;cursor:crosshair;touch-action:none}.draw-toolbar{position:absolute;top:var(--sp-2);left:50%;transform:translate(-50%);z-index:25;display:flex;gap:var(--sp-1);padding:var(--sp-1) var(--sp-3);background:#0a0e1ae6;border:1px solid var(--color-border);border-radius:8px;backdrop-filter:blur(4px)}.draw-tool{width:30px;height:30px;border:1px solid var(--color-border);border-radius:6px;background:var(--color-surface-alt);cursor:pointer;font-size:.8rem;display:flex;align-items:center;justify-content:center;transition:all .15s;color:var(--color-text)}.draw-tool:hover{border-color:var(--color-gold-dim)}.draw-tool.active{border-color:var(--color-gold);background:#d4a84326}#draw-toggle-btn.active{background:#d4a84333;border-color:var(--color-gold);color:var(--color-gold)}.transport-picker{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:30;background:#0a0e1af2;border:2px solid var(--color-gold);border-radius:12px;padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2);min-width:180px;backdrop-filter:blur(8px);animation:fade-in .15s ease}.transport-picker-label{color:var(--color-gold);font-size:.85rem;font-weight:600;text-align:center;margin-bottom:var(--sp-1)}.transport-picker-btn{padding:var(--sp-3) var(--sp-4);border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface-alt);color:var(--color-text);font-size:1rem;cursor:pointer;transition:all .15s;text-align:center}.transport-picker-btn:hover{border-color:var(--color-gold);background:#d4a8431a}.transport-picker-taxi{border-left:3px solid var(--color-taxi)}.transport-picker-bus{border-left:3px solid var(--color-bus)}.transport-picker-underground{border-left:3px solid var(--color-underground)}.transport-picker-black{border-left:3px solid #9b59b6}.ticket-remaining{font-size:.8em;opacity:.7;margin:0 4px}.token{transition:transform .3s var(--ease-expo)}.token--mrx{animation:pulse-glow 2s ease-in-out infinite}.token--green .token__circle{fill:var(--color-det-green)}.token--yellow .token__circle{fill:var(--color-det-yellow)}.token--purple .token__circle{fill:var(--color-det-purple)}.token--mr-x-ghost .token__circle{fill:#6b21a840;stroke:#6b21a8;stroke-dasharray:4 3}.token--reveal .token__circle{animation:reveal-flash .8s ease-in-out}.wb-toolbar{display:flex;align-items:center;gap:var(--sp-2);padding-bottom:var(--sp-3);border-bottom:1px solid var(--color-border);margin-bottom:var(--sp-3);flex-wrap:wrap}.wb-tool{width:32px;height:32px;border:1px solid var(--color-border);border-radius:6px;background:var(--color-surface-alt);cursor:pointer;font-size:.85rem;display:flex;align-items:center;justify-content:center;transition:all var(--dur-fast) ease;flex-shrink:0}.wb-tool:hover{border-color:var(--color-gold);transform:scale(1.1)}.wb-tool.active{border-color:var(--color-gold);background:#d4a84326}.sidebar-right{width:300px;border-left:1px solid var(--color-border);padding:var(--sp-3);overflow:hidden;display:flex;flex-direction:column}.btn-icon--exit{border-color:var(--color-danger);color:var(--color-danger)}.btn-icon--exit:hover{background:#c4404026}.right-tabs{display:flex;gap:2px;margin-bottom:var(--sp-2);flex-shrink:0}.right-tab{flex:1;padding:var(--sp-2) var(--sp-2);background:var(--color-surface-alt);border:1px solid var(--color-border);border-radius:6px 6px 0 0;color:var(--color-text-muted);font-size:.75rem;font-weight:600;cursor:pointer;transition:all .15s}.right-tab:hover{color:var(--color-text)}.right-tab.active{background:var(--color-secondary);border-bottom-color:var(--color-secondary);color:var(--color-gold)}.right-panel{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden}.wb-canvas-wrap{flex:1;position:relative;min-height:200px;border-radius:6px;overflow:hidden;background:#141831}.wb-canvas-wrap canvas{display:block;width:100%!important;height:100%!important}.wb-toolbar{display:flex;gap:var(--sp-1);padding:var(--sp-2) 0;flex-shrink:0}.wb-tool{width:32px;height:32px;border:1px solid var(--color-border);border-radius:6px;background:var(--color-surface-alt);cursor:pointer;font-size:.85rem;display:flex;align-items:center;justify-content:center;transition:all .15s}.wb-tool:hover{border-color:var(--color-gold-dim)}.wb-tool.active{border-color:var(--color-gold);background:#d4a8431f}.move-log-container{flex:1;overflow:auto;scrollbar-width:thin;scrollbar-color:var(--color-border) transparent}.move-log-table{width:100%;border-collapse:collapse;font-size:.7rem;font-family:var(--font-mono)}.move-log-table thead{position:sticky;top:0;z-index:1}.move-log-table th{background:var(--color-surface-alt);color:var(--color-text-muted);padding:var(--sp-1) var(--sp-2);text-align:center;border-bottom:1px solid var(--color-border);font-weight:600;font-size:.65rem;white-space:nowrap}.move-log-table td{padding:2px var(--sp-1);text-align:center;border-bottom:1px solid rgba(42,48,88,.3);white-space:nowrap;color:var(--color-text)}.move-log-table tr:hover td{background:#d4a8430d}.move-log-round{color:var(--color-text-muted);font-weight:700}.move-log-reveal td{background:#6b21a81a}.move-log-transport-taxi{color:var(--color-taxi)}.move-log-transport-bus{color:var(--color-bus)}.move-log-transport-underground{color:var(--color-underground)}.move-log-transport-black{color:#9b59b6}.move-log-hidden{color:var(--color-text-muted)}.wb-canvas-wrap{flex:1 1 0;min-height:200px;position:relative;overflow:hidden;border-radius:6px;border:1px solid var(--color-border);background:var(--color-surface-alt);touch-action:none;-webkit-user-select:none;user-select:none}#whiteboard{display:block;width:100%;height:100%;cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none}.wb-placeholder{flex:1;display:flex;align-items:center;justify-content:center;background:var(--color-surface-alt);border-radius:6px;border:1px solid var(--color-border);color:var(--color-text-muted);font-style:italic;font-size:.85rem;text-align:center;position:relative;overflow:hidden;min-height:200px}.wb-placeholder:before,.wb-placeholder:after{content:"";position:absolute;width:100%;height:40px;background:#2d8a7e0f;border-radius:50%;animation:fog-drift 4s ease-in-out infinite}.wb-placeholder:after{width:80%;animation-delay:2s;animation-duration:6s}.bottom-bar{display:flex;align-items:center;justify-content:space-between;padding:0 var(--sp-6);height:56px;background:var(--color-secondary);border-top:1px solid var(--color-border);flex-shrink:0;z-index:10;gap:var(--sp-4)}.turn-info{font-size:.88rem;color:var(--color-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.turn-info.my-turn{color:var(--color-gold);font-weight:600;text-shadow:0 0 8px rgba(212,168,67,.4)}.move-controls{display:flex;align-items:center;gap:var(--sp-2);flex-shrink:0}.transport-btn{display:inline-flex;align-items:center;gap:var(--sp-1);padding:var(--sp-2) var(--sp-3);border-radius:6px;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);font-size:.82rem;cursor:pointer;transition:all var(--dur-fast) ease;white-space:nowrap}.transport-btn:hover:not(:disabled):not(.selected){transform:translateY(-1px)}.transport-btn:disabled{opacity:.3;cursor:not-allowed}.transport-btn.taxi{border-color:var(--color-taxi)}.transport-btn.bus{border-color:var(--color-bus)}.transport-btn.underground{border-color:var(--color-underground)}.transport-btn.black{border-color:var(--color-mr-x)}.transport-btn.taxi:hover:not(:disabled){background:#e8c84026}.transport-btn.bus:hover:not(:disabled){background:#4a9e5c26}.transport-btn.underground:hover:not(:disabled){background:#c4404026}.transport-btn.black:hover:not(:disabled){background:#6b21a826}.transport-btn.selected,.transport-btn.taxi.selected{background:#e8c84033;border-color:var(--color-taxi);box-shadow:0 0 8px #e8c8404d}.transport-btn.bus.selected{background:#4a9e5c33;border-color:var(--color-bus);box-shadow:0 0 8px #4a9e5c4d}.transport-btn.underground.selected{background:#c4404033;border-color:var(--color-underground);box-shadow:0 0 8px #c440404d}.transport-btn.black.selected{background:#6b21a833;border-color:var(--color-mr-x);box-shadow:0 0 8px #6b21a84d}.action-btn{display:inline-flex;align-items:center;gap:var(--sp-1);padding:var(--sp-2) var(--sp-3);border-radius:6px;border:1px solid var(--color-mr-x);background:#6b21a826;color:#c084fc;font-size:.82rem;cursor:pointer;transition:all var(--dur-fast) ease;white-space:nowrap}.action-btn:hover:not(:disabled){background:#6b21a84d;transform:translateY(-1px)}.action-btn:disabled{opacity:.3;cursor:not-allowed}.ticket-count{font-family:var(--font-mono);font-size:.7rem;opacity:.7}.overlay{position:fixed;inset:0;background:#0a0e1ad9;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fade-in .4s var(--ease-expo)}.overlay-card{background:var(--color-surface);border:1px solid var(--color-border);border-top:4px solid var(--color-gold);border-radius:16px;padding:var(--sp-10);max-width:440px;width:90%;box-shadow:var(--shadow-elevated),var(--shadow-gold);text-align:center;display:flex;flex-direction:column;gap:var(--sp-4)}.overlay-card h2{font-family:var(--font-heading);font-size:2rem;color:var(--color-gold);text-shadow:var(--shadow-gold);letter-spacing:.04em}.overlay-card p{color:var(--color-text-muted);font-size:.95rem;line-height:1.6}.overlay-buttons{display:flex;justify-content:center;gap:var(--sp-3);margin-top:var(--sp-2)}.overlay-buttons .btn{min-width:120px}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}.toast{position:fixed;bottom:80px;left:50%;transform:translate(-50%);background:var(--color-danger);color:#fff;padding:var(--sp-3) var(--sp-5);border-radius:8px;font-size:.88rem;font-weight:500;z-index:110;box-shadow:var(--shadow-elevated);animation:fade-in .3s ease;white-space:nowrap}@media(max-width:1024px){.sidebar-right,.sidebar-left{width:200px}}@media(max-width:768px){.sidebar-left,.sidebar-right{display:none}.bottom-bar{flex-direction:column;height:auto;padding:var(--sp-2) var(--sp-3);gap:var(--sp-2)}.move-controls{flex-wrap:wrap;justify-content:center}}.turn-timer{font-family:Courier New,monospace;font-size:1.4rem;font-weight:700;min-width:3.2rem;text-align:center;color:var(--color-accent-gold);transition:color .3s}.turn-timer--warning{color:#f59e0b;animation:timer-pulse 1s ease-in-out infinite}.turn-timer--critical{color:#ef4444;animation:timer-pulse .5s ease-in-out infinite}@keyframes timer-pulse{0%,to{opacity:1}50%{opacity:.4}}.timer-select{margin:var(--sp-4) 0;text-align:center}.timer-label{display:block;color:var(--color-text-muted);font-size:.85rem;margin-bottom:var(--sp-2)}.timer-options{display:flex;gap:var(--sp-2);justify-content:center;flex-wrap:wrap}.timer-option{padding:var(--sp-2) var(--sp-3);border-radius:6px;border:1px solid var(--color-border);background:var(--color-surface-alt);color:var(--color-text-muted);font-size:.85rem;cursor:pointer;transition:all .15s}.timer-option:hover{border-color:var(--color-gold-dim);color:var(--color-text)}.timer-option.active{border-color:var(--color-gold);background:#d4a8431f;color:var(--color-gold);font-weight:600}.option-toggle{margin:var(--sp-3) 0;text-align:center}.toggle-label{display:flex;align-items:center;justify-content:center;gap:var(--sp-3);cursor:pointer;padding:var(--sp-2) var(--sp-4);border-radius:8px;border:1px solid var(--color-border);background:var(--color-surface-alt);transition:all .15s}.toggle-label:hover{border-color:var(--color-gold-dim)}.toggle-label input[type=checkbox]{width:18px;height:18px;accent-color:var(--color-gold);cursor:pointer}.toggle-text{color:var(--color-text);font-size:.9rem;font-weight:600}.toggle-hint{color:var(--color-text-muted);font-size:.75rem}.btn-link{background:none;border:none;color:var(--color-gold);font-family:var(--font-heading);font-size:.95rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:var(--sp-2) 0;opacity:.8;transition:opacity .2s}.btn-link:hover{opacity:1}.btn-icon{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--color-gold-dim);background:transparent;color:var(--color-gold);font-family:var(--font-heading);font-size:.9rem;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,border-color .2s;flex-shrink:0}.btn-icon:hover{background:var(--color-surface);border-color:var(--color-gold)}.rules-card{position:relative;width:min(680px,92vw);max-height:88vh;background:var(--color-surface);border:1px solid var(--color-border);border-top:3px solid var(--color-gold);border-radius:12px;display:flex;flex-direction:column;overflow:hidden}.rules-close{position:absolute;top:12px;right:16px;background:none;border:none;color:var(--color-text-muted);font-size:1.6rem;cursor:pointer;z-index:2;line-height:1;transition:color .2s}.rules-close:hover{color:var(--color-text)}.rules-scroll{overflow-y:auto;padding:var(--sp-8) var(--sp-8) var(--sp-10);scrollbar-width:thin;scrollbar-color:var(--color-border) transparent}.rules-title{font-family:var(--font-heading);font-size:2rem;color:var(--color-gold);margin-bottom:var(--sp-2);letter-spacing:.02em}.rules-flavor{color:var(--color-text-muted);font-style:italic;font-family:var(--font-heading);margin-bottom:var(--sp-8);line-height:1.5}.rules-section{margin-bottom:var(--sp-8)}.rules-section h2{font-family:var(--font-heading);font-size:1.25rem;color:var(--color-text);margin-bottom:var(--sp-3);padding-bottom:var(--sp-2);border-bottom:1px solid var(--color-border);display:flex;align-items:center;gap:var(--sp-2)}.rules-icon{font-size:1.2rem}.rules-section h3{font-family:var(--font-body);font-size:1rem;color:var(--color-gold-dim);margin:var(--sp-4) 0 var(--sp-2)}.rules-section p{color:var(--color-text);line-height:1.65;margin-bottom:var(--sp-2)}.rules-section ul,.rules-section ol{color:var(--color-text);line-height:1.65;padding-left:var(--sp-6);margin-bottom:var(--sp-3)}.rules-section li{margin-bottom:var(--sp-1)}.rules-note{background:var(--color-surface-alt);border-left:3px solid var(--color-gold-dim);padding:var(--sp-3) var(--sp-4);border-radius:0 6px 6px 0;font-size:.9rem;color:var(--color-text-muted)}.rules-highlight{background:#d4a84314;border:1px solid rgba(212,168,67,.2);border-radius:8px;padding:var(--sp-4);margin:var(--sp-3) 0}.rules-highlight h3{margin-top:0;color:var(--color-gold)}.rules-transport-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3);margin:var(--sp-3) 0}.rules-transport{background:var(--color-surface-alt);border-radius:8px;padding:var(--sp-3);text-align:center}.rules-transport p{font-size:.85rem;color:var(--color-text-muted);margin:var(--sp-2) 0 0}.transport-badge{display:inline-block;padding:var(--sp-1) var(--sp-3);border-radius:20px;font-size:.85rem;font-weight:600}.transport-badge.taxi{background:#e8c84026;color:var(--color-taxi)}.transport-badge.bus{background:#4a9e5c26;color:var(--color-bus)}.transport-badge.underground{background:#c4404026;color:var(--color-underground)}.rules-win-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4);margin-top:var(--sp-3)}.rules-win-box{border-radius:8px;padding:var(--sp-4)}.rules-win-box h3{margin-top:0;font-size:1rem}.rules-win-box p{font-size:.9rem;margin-bottom:0}.rules-win-det{background:#4a9e5c14;border:1px solid rgba(74,158,92,.25)}.rules-win-det h3{color:var(--color-success)}.rules-win-mrx{background:#6b21a814;border:1px solid rgba(107,33,168,.25)}.rules-win-mrx h3{color:#9b59b6}@media(max-width:600px){.rules-transport-grid,.rules-win-grid{grid-template-columns:1fr}.rules-scroll{padding:var(--sp-6) var(--sp-4) var(--sp-8)}}