@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,500;9..144,700&display=swap');
:root{--ink:#e9e9df;--muted:#96aabc;--paper:#fff2d5;--navy:#091a32;--session-bg:#101f36;--session-color:#fff5d8;--session-accent:#e7b76b;--session-border:#283c52;--suit-red:url('/art/red.webp');--suit-blue:url('/art/blue.webp');--suit-green:url('/art/green.webp');--suit-yellow:url('/art/yellow.webp');--suit-white:url('/art/white.webp');font:15px 'DM Sans',system-ui,sans-serif;background:var(--navy);color:var(--ink)}
*{box-sizing:border-box}body{margin:0;min-width:760px;background:radial-gradient(ellipse at 80% -10%,#26435b 0,transparent 53%),#091a32;color:var(--ink)}
button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #f4d98b;outline-offset:3px}
#shell{max-width:1510px;margin:auto;padding:15px 32px 35px}#notice{border-radius:6px;padding:12px 18px;background:#492c37;color:#fff}#lobby{max-width:1080px;margin:3vh auto}
.hanabi-table{display:flex;flex-direction:column;gap:15px;max-width:1470px;margin:0 auto}
.dashboard{display:flex;align-items:center;justify-content:space-between;gap:25px;border-bottom:1px solid #ffffff24;padding-bottom:13px;min-height:74px}
.score{display:flex;align-items:baseline;gap:8px;flex:0 0 auto}.eyebrow,.resource-label{font-size:11px;color:#a7bad0;letter-spacing:.15em;font-weight:700}
.score .eyebrow{margin-right:7px}.score-value{font:700 43px/1 'Fraunces',Georgia,serif;color:#ffd891}.score-outof{font-size:18px;color:#95a6b7}
.resources{display:flex;align-items:center;gap:35px}.resource{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:10px;row-gap:4px}.resource-label{grid-column:1 / 3}.pips{display:flex;gap:4px}.pip{height:24px;width:24px;border:1px solid #597087;border-radius:50%;display:grid;place-items:center;font-size:16px;color:#67788a;background:#142b43}.pip.clue.lit{background:#225b7f;border-color:#67bbd9;color:#bcefff;box-shadow:0 0 10px #5ed5ed37}.pip.fuse.lit{background:#764631;border-color:#d68e55;color:#ffd399}.resource-value{white-space:nowrap;font-size:13px;font-weight:700;color:#ced9df}.deck-count{display:flex;align-items:baseline;gap:10px}.deck-number{font:700 33px 'Fraunces',serif;color:#f3dcc0}.final-turns{color:#e9b875;font-size:12px;font-weight:700}
.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px}.section-heading h2{font:500 21px 'Fraunces',Georgia,serif;margin:0;color:#f3dfb6}.section-note{color:#849db3;font-size:12px}
.fireworks{padding-bottom:12px;border-bottom:1px solid #ffffff1a}.stacks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.stack{position:relative;min-width:0;overflow:hidden;padding:12px 12px 9px;border:1px solid #51648155;border-radius:9px;background:linear-gradient(#11284265,#0c1934b9),var(--suit) center 43% /cover;box-shadow:inset 0 1px #ffffff1a;text-align:center}.stack.complete{border-color:#edc582;box-shadow:0 0 24px #f1bf6040}.stack-visual{font-size:45px;line-height:1;filter:drop-shadow(0 0 10px #f4dcad92);color:#f7dba7;text-shadow:0 1px 3px #071324}.stack-title{font:700 13px 'DM Sans',sans-serif;letter-spacing:.08em;text-transform:uppercase;text-shadow:0 2px 4px #000}.stack-progress{margin-top:9px;display:flex;justify-content:center;gap:6px}.level{height:24px;width:24px;border-radius:50%;display:grid;place-items:center;background:#051326bf;border:1px solid #8d99a566;color:#8d9eb2;font-size:12px;font-weight:700}.level.built{background:#f4d9a5;color:#17283c;border-color:#fff3cd;box-shadow:0 0 10px #ffcc7d66}
.turnline{display:flex;align-items:baseline;justify-content:space-between;min-height:22px;gap:20px}.turnline strong{font-weight:700;font-size:17px;color:#ffdfa5}.turnline span{font-size:12px;color:#9caec0}
.player-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px 24px}.player-area{border-radius:9px;padding:9px 14px 8px;background:#162e4566;border:1px solid transparent;min-width:0;transition:background .14s,border-color .14s}.player-area.active{background:#27344a91;border-color:#dca75b69}.player-area.targeted{border-color:#f1d78d;box-shadow:0 0 0 1px #f1d78d70}.player-heading{display:flex;align-items:center;gap:10px;min-height:29px;margin-bottom:8px}.player-name{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.turn-tag{font-size:10px;font-weight:700;letter-spacing:.1em;color:#eccc8c}.select-clue{margin-left:auto;border:1px solid #577a93;background:#17384f;color:#cbe5ea;padding:4px 11px;border-radius:5px;font-size:12px;font-weight:700}.select-clue:hover{background:#246180}
.other-hand{display:flex;gap:9px;min-height:111px;overflow:visible;align-items:flex-start}
.fire-card{position:relative;isolation:isolate;flex:0 1 112px;width:112px;aspect-ratio:5/7;border:2px solid #9c8e7a;border-radius:7px;background:#122642;padding:0;color:#fff;overflow:hidden;box-shadow:0 4px 8px #010a19aa;display:block;text-align:left;transition:transform .16s,border-color .16s,box-shadow .16s}
button.fire-card:hover{transform:translateY(-7px);border-color:#ffe7aa;box-shadow:0 7px 20px #0009}
.fire-card.small{flex:0 1 81px;width:81px;min-width:59px;aspect-ratio:5/7}
.fire-card .art{position:absolute;inset:0;background:linear-gradient(0deg,#091829ba 0%,transparent 39%,#08172d73 100%),var(--suit) center/cover}
.fire-card.revealed .rank{position:absolute;left:9px;z-index:2;font:700 32px/1 'Fraunces',Georgia,serif;color:#fff3d0;text-shadow:0 2px 5px #030d19}
.fire-card .rank.top{top:8px}.fire-card .rank.bottom{bottom:8px;left:auto;right:9px;transform:rotate(180deg)}
.fire-card.small .rank{font-size:25px;left:6px}.fire-card.small .rank.bottom{left:auto;right:6px}
.suit-mark{position:absolute;inset:0;display:grid;place-items:center;font-size:39px;color:#fff3d1;text-shadow:0 0 17px #fff5c5b0,0 3px 4px #020b13}
.fire-card.small .suit-mark{font-size:29px}
.fire-card.concealed{background:linear-gradient(155deg,#133452,#081d31);border-color:#b49c75}.fire-card .back-art{position:absolute;inset:5px;background:radial-gradient(ellipse,#bf995e44,#0e304e22 48%,#0c2134),repeating-linear-gradient(45deg,transparent 0 12px,#dec38719 12px 14px);border:1px solid #bd98655e;border-radius:3px}
.fire-card .unknown{position:absolute;top:12%;left:0;right:0;text-align:center;font:500 60px 'Fraunces',serif;color:#dbbd80}
.fire-card.small .unknown{font-size:37px}.fire-card.is-selected{border-color:#ffe2a0;box-shadow:0 0 0 3px #eabb6b,0 12px 24px #0009;transform:translateY(-7px)}
.knowledge{position:absolute;z-index:2;bottom:7px;left:4px;right:4px;display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:wrap;pointer-events:none}
.known{background:#fff3ce;color:#172b41;padding:3px 6px;border-radius:3px;font-size:13px;font-weight:800;text-transform:uppercase}
.known.color-red{background:#f8c5bb}.known.color-blue{background:#b4dafa}.known.color-green{background:#bae8bc}.known.color-yellow{background:#ffe5a0}.known.color-white{background:#fff}
.no-clue{font-size:11px;color:#a6bbcc}.negative-count{position:absolute;top:6px;right:5px;font-size:10px;color:#d1c7ac;background:#102f46d9;padding:2px 4px;border-radius:3px}
.preview-match{border-color:#fff0a8!important;box-shadow:0 0 0 3px #f9da6a,0 0 18px #f5c75799!important;transform:translateY(-5px)!important}
.preview-other{opacity:.34}
.self-area{padding-top:8px;border-top:1px solid #ffffff24}.my-hand{display:flex;gap:14px;padding:10px 5px 12px;min-height:166px}.my-hand .fire-card{flex:0 1 112px}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;min-height:82px;border-top:1px solid #ffffff24;padding:12px 0}.actions h2{margin:0 10px 0 0;font:500 20px 'Fraunces',serif;color:#f3d9a9}.action-note{margin:0;color:#a6b9c7;font-size:12px}.action-options,.clue-options{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.actions button{border:1px solid #5b7893;border-radius:5px;padding:10px 14px;min-height:39px;background:#1d3b56;color:#eef1ed;font-size:13px;font-weight:700}
.actions button.primary{background:#d9ac67;border-color:#f6d497;color:#15243a}.actions button.secondary{background:#2b5972;border-color:#5b8899}.actions button.ghost{background:transparent;color:#b9ccda}.actions button:disabled{opacity:.3;cursor:not-allowed}.actions button:not(:disabled):hover{filter:brightness(1.18)}
.clue-options{width:100%}.actions .clue-color{border-color:#8195aa}.actions .color-red{border-bottom:3px solid #e26e65}.actions .color-blue{border-bottom:3px solid #67baff}.actions .color-green{border-bottom:3px solid #84c89d}.actions .color-yellow{border-bottom:3px solid #f0c66a}.actions .color-white{border-bottom:3px solid #f8f5e3}.clue-separator{font-size:12px;color:#aab9c8;padding:0 4px}.waiting,.outcome{margin:0;font-size:14px;color:#afc0d1}
.history{display:flex;align-items:baseline;gap:14px;color:#96adc0;border-top:1px solid #ffffff12;padding-top:8px}.history-events{display:flex;flex-wrap:wrap;gap:15px}.history-event{font-size:12px;color:#c5cbd0}
dialog{border:1px solid #4d6680;border-radius:11px;background:#13283e;color:#f6e5c9;box-shadow:0 20px 80px #0009;max-width:min(720px,90vw)}dialog::backdrop{background:#030c19c4}.rules-content,.decision-content{padding:22px 26px;line-height:1.5}.rules-content header{display:flex;justify-content:space-between;align-items:center;gap:20px}.rules-content h2,.rules-content h3,.decision-content h2{font-family:'Fraunces',Georgia,serif}.rules-content h2{font-size:30px;margin:0}.rules-content h3{font-size:19px;margin-bottom:4px}.rules-content p{margin-top:4px;color:#c9d6de}.rules-content button,.decision-content button{padding:10px 16px;border-radius:6px;background:#d9ac67;color:#10243b;border:0;font-weight:700}.decision-actions{display:flex;justify-content:flex-end;gap:12px}.decision-actions button[value=cancel]{background:#29455d;color:#fff}
:root{--session-background:#101f36;--session-text:#fff5d8;--session-muted:#b2c2d3;--session-control-bg:#213853;--session-control-border:#4c6380}
.games-lobby-shell,.games-lobby-dialog{--surface:#f6f0de;--surface-soft:#dde7e5;--ink:#17314c;--muted:#597588;--border:#bdcfd0;--action:#286185;--action-ink:#fff}
.games-lobby-shell:has(.games-lobby-directory)::before{content:'';display:block;height:210px;margin-bottom:17px;border-radius:8px;background:#12304e url('/assets/hanabi-cover.webp') center/cover}
@media(max-width:1100px){#shell{padding-inline:17px}.player-grid{gap:8px}.stacks{gap:7px}.stack{padding-inline:6px}.level{width:20px;height:20px}.resources{gap:18px}.other-hand{gap:5px}.fire-card.small{flex-basis:72px}.my-hand .fire-card{flex-basis:99px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

.knowledge-detail{max-width:300px;line-height:1.5;font-size:12px;color:#bdc9d5;overflow-wrap:break-word}.action-options{margin-left:auto}
