.online-home{max-width:1300px;margin:auto;padding:56px 30px 80px}.online-home h1{font:64px/1.03 Georgia,serif;letter-spacing:-2px;margin:18px 0}.online-home .lede{max-width:580px;color:#68756b;line-height:1.8;font-size:16px}.online-home .home-top{display:flex;align-items:center;justify-content:space-between;gap:30px}.home-emblem{display:flex;align-items:flex-end;max-width:340px;opacity:.9}.home-emblem svg{width:80px;height:130px}.connection-bar{display:flex;align-items:center;gap:15px;padding:12px 4%;background:#dde5d6;color:#264436;min-height:43px;font-size:12px}.connection-bar.offline{background:#f0ddc4;color:#71482c}.connection-bar strong{white-space:nowrap}.connection-bar span{line-height:1.5}.online-forms{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:38px}.online-box{background:#fbf7e9;border:1px solid #c9c9b3;border-radius:14px;padding:30px}.online-box h2,.room-heading h1{font-family:Georgia,serif;font-weight:400}.online-box h2{font-size:30px;margin:0 0 12px}.online-box p{color:#63746a;line-height:1.7}.online-box label,.lobby-own label{display:block;font-size:10px;letter-spacing:1.3px;font-weight:bold;margin-top:18px}.online-box input,.online-box select,.lobby-own input,.lobby-own select{display:block;width:100%;margin:7px 0 14px;padding:13px;border:1px solid #aab5a5;border-radius:6px;background:#fffdf4;color:#203f39;font-size:14px;min-height:46px}.online-box button{margin-top:8px}.online-note{font-size:12px;color:#6b766a;line-height:1.8;margin-top:20px}.recent-rooms{margin-top:28px;display:flex;gap:12px;flex-wrap:wrap}.recent-room{padding:15px 20px;background:#e1e6d7;border:1px solid #bbc7b0;border-radius:7px;text-align:left;cursor:pointer}.recent-room b{display:block;letter-spacing:2px;margin-bottom:7px}.online-room{max-width:1450px;margin:auto;padding:28px 30px 60px}.room-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.room-heading h1{font-size:40px;line-height:1.1;margin:6px 0}.room-heading p{font-size:12px;color:#6a7569;line-height:1.6}.room-invite{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.room-invite input{padding:10px;border:1px solid #abb9a5;border-radius:6px;background:#f8f4e6;color:#264035;max-width:270px;font-size:11px;min-height:40px}.room-code{font-size:12px;letter-spacing:2px;font-weight:bold}.lobby-grid{display:grid;grid-template-columns:repeat(var(--seats),minmax(0,1fr));gap:16px}.lobby-seat{border:1px solid #b9c6ae;border-radius:12px;overflow:hidden;background:#f8f4e6;position:relative}.lobby-seat.mine{outline:2px solid #345848;outline-offset:3px}.lobby-art{height:165px;display:flex;justify-content:center;background:#d5d8c0;border-bottom:1px solid #bbc5ae;overflow:hidden}.lobby-art svg{width:125px;height:190px;align-self:flex-end}.lobby-body{padding:22px}.lobby-body h2{font:26px Georgia,serif;margin:8px 0}.lobby-body p{font-size:12px;line-height:1.7;color:#667761}.seat-eyebrow{font-size:9px;letter-spacing:1.8px;color:#607b66}.seat-status{font-size:11px;font-weight:bold;color:#5b7560;margin-top:15px;display:flex;gap:8px;align-items:center}.seat-status i,.connection-dot{width:7px;height:7px;border-radius:50%;background:#8ca081;display:inline-block}.seat-status.ready{color:#26583e}.seat-status.ready i{background:#387850}.lobby-seat.empty{display:flex;align-items:center;justify-content:center;text-align:center;min-height:370px;background:repeating-linear-gradient(45deg,#f5f2e4,#f5f2e4 9px,#ecebdc 9px,#ecebdc 10px)}.lobby-seat.empty .empty-symbol{font:48px Georgia,serif;color:#9ca88d}.lobby-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:26px;padding-top:24px;border-top:1px solid #c6ccb9}.lobby-bottom p{max-width:700px;color:#5b705e;font-size:13px;line-height:1.7}.presence-label{font-size:8px;letter-spacing:1px;color:#5f7a62;display:block;margin-top:5px}.online-game .player-panel{cursor:default}.online-game .player-panel.mine{box-shadow:inset 0 -3px #dcc293}.online-game .own-seat-label{font-size:9px;color:#537356;letter-spacing:1px}.online-actions .primary,.online-actions .secondary{width:100%;margin-top:10px}.online-actions p{line-height:1.7;font-size:12px}.online-actions select{width:100%;padding:10px;background:#f8f1de;border:1px solid #829681;border-radius:5px;color:#233d34;font-size:12px;margin-top:8px}.online-selected{margin-top:20px;border-top:1px solid #556856;padding-top:18px}.online-selected h3{font:23px Georgia,serif;margin:0 0 10px}.online-targets{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.online-targets button{padding:9px 11px;background:#d8dfc8;color:#244936;border:1px solid #748a70;border-radius:5px;cursor:pointer}.online-targets button[aria-pressed=true]{background:#d4b984}.online-game .live-inspector{align-self:start}.online-game .hand-section{padding-top:18px}.online-game .game-message{margin-top:12px}.online-game .card-button:disabled{opacity:.75}.online-game .card-inspect{min-height:30px}.online-dialog{max-width:min(720px,calc(100vw - 28px));max-height:90vh;border-radius:14px;background:#f4edda;color:#1c3c35;border:1px solid #8b9c82;padding:28px;overflow:auto}.online-dialog h2{font:34px Georgia,serif;margin:0 0 20px}.online-dialog p{line-height:1.7}.online-dialog .dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.online-dialog .reveal-cards{margin:15px auto}.online-dialog::backdrop{background:#0e211bcc;backdrop-filter:blur(4px)}.online-dialog .reveal-notes p{font-size:12px}.online-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:25px;color:#6b7a67;font-size:11px}.online-footer a{color:inherit}.online-match-empty{max-width:500px;margin:80px auto;padding:20px}.room-button{min-height:40px}.online-game .board-toolbar{flex-wrap:wrap}.online-game .card-inspect:focus-visible,.online-room button:focus-visible,.online-home button:focus-visible{outline:3px solid #b67d37;outline-offset:3px}#connection-text{overflow-wrap:anywhere}.online-status-note{font-size:12px;line-height:1.6;color:#789079}.online-game .live-inspector .waiting-note{margin-top:14px}.online-game .unit-switcher{margin:12px 0}.online-game .damage-equation{color:#1c3c35}@media(max-width:1000px){.lobby-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.online-home h1{font-size:52px}.room-heading{align-items:flex-start}.room-heading h1{font-size:32px}.home-emblem{display:none}}@media(max-width:620px){.online-home,.online-room{padding:24px 16px 40px}.online-home h1{font-size:44px}.online-forms{grid-template-columns:1fr;gap:18px;margin-top:26px}.online-box{padding:22px}.room-heading{display:block}.room-invite{margin-top:14px}.room-invite input{max-width:100%;width:100%}.lobby-grid{gap:12px}.lobby-body{padding:14px}.lobby-art{height:125px}.lobby-art svg{height:150px;width:98px}.lobby-body h2{font-size:23px}.lobby-seat.empty{min-height:310px}.lobby-own input,.lobby-own select{font-size:12px;padding:10px}.lobby-bottom{display:block}.lobby-bottom .primary{width:100%;justify-content:center}.connection-bar{align-items:flex-start;gap:10px;padding:10px 16px;font-size:11px}.connection-bar strong{max-width:110px;white-space:normal}.online-footer{align-items:flex-start;flex-wrap:wrap}.online-dialog{padding:20px}.online-dialog h2{font-size:28px}.online-dialog .reveal-cards{gap:8px}.online-game .player-panel .player-identity strong{white-space:normal;overflow-wrap:anywhere}}@media(prefers-reduced-motion:reduce){.online-dialog::backdrop{backdrop-filter:none}.online-room *,.online-home *{animation:none!important;transition:none!important}}
/* Light panels sit on the dark game theme: restate ink colours the theme sets for dark surfaces. */
.online-box,.lobby-seat{color:#1c3c35}
.online-box label,.lobby-own label{color:#3f5a4b}
.online-box .secondary,.lobby-seat .secondary,.online-dialog .secondary{color:#264436;border-color:#7d8f78}
.lobby-seat .quiet,.online-dialog .quiet,.online-dialog .eyebrow{color:#4f6353}
.online-box a.secondary{display:inline-flex;align-items:center;text-decoration:none}
.online-dialog .reveal-cards>div>span,.online-dialog .reveal-notes{color:#4f6353}
.online-dialog .reveal-cards>b{color:#9a6f2c}
.online-dialog .damage-equation>b{color:#6f8070}
.online-dialog .damage-equation>strong{color:#8a5a1c}