:root{--bg: #120a0c;--bg-2: #1c1014;--panel: #24151a;--panel-2: #2e1b21;--line: #4b2c31;--gold: #c9a15a;--gold-dim: #8a6f42;--crimson: #a3262e;--crimson-hi: #c8363f;--text: #ecdfcd;--muted: #a08d7f;--paper: #e8dabb;--paper-2: #d8c69f;--ink: #2b1a14;--t-time: #2f4a7a;--t-place: #3d6b46;--t-person: #6a3f7d;--t-weapon: #9a2a2f;--t-motive: #1f6f73;--serif: "Songti SC", "STSong", "Noto Serif CJK SC", "Source Han Serif SC", "SimSun", serif;--sans: -apple-system, "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}body{min-height:100dvh;background:radial-gradient(120% 60% at 50% -10%,rgba(163,38,46,.28),transparent 70%),repeating-linear-gradient(90deg,rgba(0,0,0,.16) 0 2px,transparent 2px 46px),var(--bg);background-attachment:fixed}h1,h2,h3,h4,p{margin:0}button,input,textarea{font:inherit;color:inherit}main{width:100%;max-width:560px;margin:0 auto;padding:12px 16px calc(28px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px}.dim{color:var(--muted)}.gold{color:var(--gold)}.notice{text-align:center;color:var(--muted);padding:10px 0}.btn{appearance:none;border:1px solid var(--gold-dim);background:var(--panel-2);color:var(--text);padding:12px 18px;border-radius:4px;font-size:16px;letter-spacing:.08em;cursor:pointer;transition:transform .08s,background .15s,border-color .15s}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:linear-gradient(180deg,#d6b06a,#b48a45);border-color:#e6c88a;color:#2a1608;font-family:var(--serif);font-weight:700}.btn.danger{background:linear-gradient(180deg,var(--crimson-hi),var(--crimson));border-color:#e0646b;color:#fff3ea;font-family:var(--serif);font-weight:700}.btn.ghost{background:transparent;border-style:dashed;color:var(--muted)}.btn:focus-visible,.seat:focus-visible,.link:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:2px}.link{appearance:none;background:none;border:none;color:var(--gold);cursor:pointer;padding:6px 4px;font-size:14px}input,textarea{background:var(--bg-2);border:1px solid var(--line);border-radius:4px;padding:12px;font-size:16px;width:100%;resize:none}input::placeholder,textarea::placeholder{color:#6d5b52}.panel{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:12px}.panel>h2,.panel>summary{font-size:13px;font-weight:600;letter-spacing:.14em;color:var(--gold);display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.panel>summary{margin-bottom:0;cursor:pointer}.panel[open]>summary{margin-bottom:10px}.panel h2 small{color:var(--muted);font-weight:400;letter-spacing:.02em}.seg{display:inline-flex;border:1px solid var(--line);border-radius:4px;overflow:hidden}.seg button{appearance:none;background:transparent;border:none;border-right:1px solid var(--line);padding:6px 11px;font-size:13px;color:var(--muted);cursor:pointer}.seg button:last-child{border-right:none}.seg button.on{background:var(--gold);color:#2a1608;font-weight:600}.seg button:disabled{cursor:default}.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%);background:#3a1216;border:1px solid var(--crimson-hi);color:#ffe1dc;padding:10px 16px;border-radius:4px;z-index:60;max-width:calc(100vw - 32px);box-shadow:0 8px 24px #00000080}.net-banner{position:sticky;top:0;z-index:50;text-align:center;background:var(--crimson);padding:6px;font-size:13px}.home{min-height:100dvh;justify-content:center;gap:16px;max-width:380px}.marquee{text-align:center;padding:26px 0 30px;margin-bottom:8px;border-top:1px solid var(--gold-dim);border-bottom:1px solid var(--gold-dim);position:relative}.marquee:before,.marquee:after{content:"";position:absolute;left:0;right:0;height:1px;background:var(--gold-dim);opacity:.45}.marquee:before{top:4px}.marquee:after{bottom:4px}.marquee h1{font-family:var(--serif);font-size:68px;font-weight:900;letter-spacing:.18em;margin-right:-.18em;line-height:1.25;color:var(--gold);text-shadow:0 2px 0 #5d3f17,0 0 34px rgba(201,161,90,.35)}.marquee-sub{font-size:12px;letter-spacing:.5em;margin-right:-.5em;color:var(--muted)}.field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted);letter-spacing:.1em}.or{text-align:center;color:var(--muted);font-size:12px;letter-spacing:.4em}.join{display:flex;gap:8px}.join input{text-align:center;letter-spacing:.4em;font-variant-numeric:tabular-nums}.join .btn{flex:none}.lobby-head{display:flex;align-items:center;justify-content:space-between}.room-code{text-align:right;line-height:1.1}.room-code span{display:block;font-size:11px;letter-spacing:.3em;color:var(--muted)}.room-code strong{font-family:var(--serif);font-size:34px;letter-spacing:.16em;color:var(--gold);font-variant-numeric:tabular-nums}.roster{list-style:none;margin:0 0 10px;padding:0}.roster li{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid rgba(75,44,49,.6)}.roster li:last-child{border-bottom:none}.roster-name{flex:1;min-width:0}.roster em,.seat-tags em,.reveal-who em{font-style:normal;font-size:11px;margin-left:6px;padding:1px 6px;border:1px solid currentColor;border-radius:2px;opacity:.9;white-space:nowrap}.seat-no{flex:none;width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:13px;background:var(--bg-2);border:1px solid var(--gold-dim);color:var(--gold);font-variant-numeric:tabular-nums}.lobby .btn.ghost{width:100%;font-size:14px}.config-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;flex-wrap:wrap}.config-row small{color:var(--muted);font-size:12px}.dock{display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px}.topbar-room{line-height:1.1}.topbar-room span{display:block;font-size:10px;color:var(--muted);letter-spacing:.2em}.topbar-room strong{font-family:var(--serif);color:var(--gold);letter-spacing:.12em;font-variant-numeric:tabular-nums}.track{display:flex;align-items:center;gap:10px;font-size:13px}.track-round,.track-label{font-family:var(--serif);font-weight:700;color:var(--gold);letter-spacing:.08em}.track ol{list-style:none;display:flex;margin:0;padding:0;gap:4px}.track li{padding:2px 8px;border:1px solid var(--line);border-radius:2px;color:var(--muted);font-size:12px}.track li.done{color:var(--gold-dim);border-color:transparent}.track li.on{background:var(--crimson);border-color:var(--crimson-hi);color:#fff}.seats{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:6px}.seat{appearance:none;text-align:left;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;padding:7px 8px;min-height:52px;background:var(--panel);border:1px solid var(--line);border-radius:6px;color:var(--text);cursor:default;transition:border-color .15s,background .15s,transform .1s}.seat:disabled{opacity:1}.seat .seat-no{grid-row:1 / span 2}.seat-name{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.seat-tags{display:flex;flex-wrap:wrap;gap:3px;min-height:16px}.seat-tags em{margin-left:0;font-size:10px;padding:0 4px;line-height:15px}.seat-tags .first{color:#f0c98a;background:#c9a15a24}.seat-tags .votes{color:#ff9a8f}.seat.me{border-color:var(--gold-dim)}.seat.active{border-color:var(--gold);background:var(--panel-2);box-shadow:0 0 0 1px var(--gold) inset}.seats.selecting .seat:not(.off){cursor:pointer;border-style:dashed;border-color:var(--gold-dim)}.seats.selecting .seat.off{opacity:.45}.seat.picked,.seats.selecting .seat.picked{border:1px solid var(--crimson-hi);background:#3a1318;box-shadow:0 0 0 1px var(--crimson-hi) inset;transform:translateY(-1px)}.role{font-family:var(--serif);font-weight:700}em.role-culprit,.role-culprit strong{color:#ff6b6b}em.role-accomplice,.role-accomplice strong{color:#e39a4c}em.role-innocent,.role-innocent strong{color:#8fc7a0}.stage{animation:rise .25s ease-out}@keyframes rise{0%{opacity:0;transform:translateY(6px)}}.prompt{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--gold-dim);border-radius:6px;padding:14px;display:flex;flex-direction:column;gap:8px}.prompt.mine{border-left-color:var(--crimson-hi);background:linear-gradient(180deg,#33161b,var(--panel))}.prompt h3{font-family:var(--serif);font-size:19px;letter-spacing:.06em;display:flex;align-items:center;gap:8px}.prompt p{color:var(--muted);font-size:14px}.actions{display:flex;gap:8px;margin-top:4px}.actions .btn{flex:1}.actions .btn.ghost{flex:0 1 auto;font-size:14px}.actions:empty{display:none}.countdown{margin-left:auto;font-family:var(--sans);font-size:14px;font-weight:600;color:var(--gold);font-variant-numeric:tabular-nums}.countdown.urgent{color:#ff7a70}.type-pick{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.type-btn{appearance:none;border:1px solid rgba(255,255,255,.18);background:var(--c);color:#fff;padding:14px 0;border-radius:4px;font-family:var(--serif);font-weight:700;font-size:16px;cursor:pointer}.type-btn:disabled{background:transparent;border-style:dashed;color:#6d5b52;text-decoration:line-through;cursor:not-allowed}.type-chip{display:inline-block;background:var(--c);color:#fff;font-family:var(--serif);font-size:13px;font-weight:700;padding:1px 7px;border-radius:2px;letter-spacing:.06em;white-space:nowrap}.t-time{--c: var(--t-time)}.t-place{--c: var(--t-place)}.t-person{--c: var(--t-person)}.t-weapon{--c: var(--t-weapon)}.t-motive{--c: var(--t-motive)}.identity{display:flex;flex-direction:column;align-items:stretch;gap:14px}.id-card{align-self:center;width:210px;height:300px;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px;text-align:center;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none;cursor:pointer;color:var(--gold);background:repeating-linear-gradient(45deg,rgba(201,161,90,.07) 0 6px,transparent 6px 12px),#2a0f14;border:1px solid var(--gold-dim);box-shadow:0 0 0 5px #2a0f14,0 0 0 6px var(--gold-dim),0 14px 30px #00000080}.id-card strong{font-family:var(--serif);font-size:34px;letter-spacing:.2em;margin-right:-.2em}.id-card p{font-size:13px;color:var(--muted)}.id-card.shown{background:linear-gradient(180deg,var(--paper),var(--paper-2));color:var(--ink)}.id-card.shown strong{font-size:54px}.id-card.shown p,.id-card.shown small{color:#5a463a}.id-card.shown.role-culprit strong{color:#a3161e}.id-card.shown.role-accomplice strong{color:#9a5a12}.id-card.shown.role-innocent strong{color:#2f6b45}.chat{background:var(--bg-2);border:1px solid var(--line);border-radius:4px;padding:8px 10px;max-height:200px;min-height:64px;overflow-y:auto;display:flex;flex-direction:column;gap:6px}.msg{display:flex;gap:8px;font-size:14px;align-items:baseline}.msg b{flex:none;color:var(--gold);font-family:var(--serif)}.msg.own b{color:#ff9a8f}.msg span{overflow-wrap:anywhere}.composer{display:flex;gap:8px;align-items:stretch}.composer .btn{flex:none;font-size:14px;padding:0 14px}.card{--w: 62px;flex:none;width:var(--w);height:calc(var(--w) * 1.42);border-radius:calc(var(--w) * .09);position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(160deg,var(--paper),var(--paper-2));color:var(--ink);box-shadow:inset 0 0 0 2px var(--paper),inset 0 0 0 3.5px var(--c),0 2px 6px #00000073;user-select:none;-webkit-user-select:none;transition:transform .12s,box-shadow .12s,opacity .12s}.card-sm{--w: 42px}.card-lg{--w: 130px}.card-type{position:absolute;top:calc(var(--w) * .12);left:0;right:0;text-align:center;font-family:var(--serif);font-weight:700;font-size:calc(var(--w) * .2);color:var(--c);letter-spacing:.1em}.card-face{font-family:Georgia,"Times New Roman",var(--serif);font-weight:700;font-size:calc(var(--w) * .52);line-height:1;margin-top:calc(var(--w) * .22);color:var(--ink)}.card.tappable{cursor:pointer}.card.selected{transform:translateY(-10px);box-shadow:inset 0 0 0 2px var(--paper),inset 0 0 0 3.5px var(--c),0 0 0 2px var(--gold),0 10px 18px #0000008c}.card.dimmed{opacity:.38}.card.odd{box-shadow:inset 0 0 0 2px var(--paper),inset 0 0 0 3.5px var(--c),0 0 0 2px var(--crimson-hi),0 2px 8px #c8363f99}.card-back{background:repeating-linear-gradient(45deg,rgba(201,161,90,.16) 0 4px,transparent 4px 8px),#4a141a;color:var(--gold);box-shadow:inset 0 0 0 2px #4a141a,inset 0 0 0 3px var(--gold-dim),0 2px 6px #00000073;font-family:var(--serif);font-weight:900;font-size:calc(var(--w) * .36)}.card-back.selected{box-shadow:inset 0 0 0 2px #4a141a,inset 0 0 0 3px var(--gold-dim),0 0 0 2px var(--gold),0 10px 18px #0000008c}.pool-row{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid rgba(75,44,49,.6)}.pool-row:first-of-type{border-top:none;padding-top:0}.pool-meta{flex:none;width:50px;white-space:nowrap;display:flex;flex-direction:column;align-items:flex-start;gap:4px;font-size:12px;color:var(--muted)}.pool-cards{display:flex;flex-wrap:wrap;gap:5px;perspective:600px}.pool-cards .card{animation:flip .5s ease-out backwards}@keyframes flip{0%{transform:rotateY(90deg) scale(.9);opacity:0}}.private-body{position:relative;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;display:flex;flex-direction:column;gap:10px}.role-line{font-size:14px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px}.role-line em{font-style:normal;font-size:16px}.role-line .dim{font-size:12px}.mask{color:var(--gold-dim);letter-spacing:.2em}.hand{display:flex;gap:8px;padding:12px 0 4px;justify-content:center;flex-wrap:wrap}.hold-hint{text-align:center;font-size:12px;letter-spacing:.3em;color:var(--gold-dim)}.inv-list{list-style:none;margin:0;padding:0;font-size:13px;color:var(--muted);display:flex;flex-direction:column;gap:3px}.inv-list b{color:var(--text)}.modal{position:fixed;inset:0;z-index:70;background:#080304d1;display:grid;place-items:center;animation:fade .15s}@keyframes fade{0%{opacity:0}}.modal-box{display:flex;flex-direction:column;align-items:center;gap:14px;padding:24px 32px 0;background:var(--panel);border:1px solid var(--gold-dim);border-radius:8px;overflow:hidden;min-width:230px}.modal-box small{color:var(--gold);letter-spacing:.1em}.modal-box p{font-size:12px;color:var(--muted)}.modal-timer{align-self:stretch;margin:4px -32px 0;height:3px;background:var(--gold);transform-origin:left;animation:drain 5s linear forwards}@keyframes drain{to{transform:scaleX(0)}}.journal h2{justify-content:flex-start}.events{list-style:none;margin:0;padding:0;max-height:220px;overflow-y:auto;font-size:13px;display:flex;flex-direction:column;gap:4px}.events li{color:var(--muted);padding-left:10px;border-left:2px solid var(--line)}.events .ev-investigate{color:var(--text);border-left-color:var(--t-time)}.events .ev-type,.events .ev-reveal{color:var(--text);border-left-color:var(--gold)}.events .ev-accuse,.events .ev-result{color:#ffc9c2;border-left-color:var(--crimson-hi)}.speech-log{max-height:260px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.speech-log h4{font-size:12px;color:var(--gold-dim);letter-spacing:.2em;margin:4px 0}.result{display:flex;flex-direction:column;gap:12px}.verdict{text-align:center;padding:22px 16px;border-radius:6px;border:1px solid var(--gold-dim);background:var(--panel)}.verdict small{letter-spacing:.4em;color:var(--muted)}.verdict strong{display:block;font-family:var(--serif);font-size:32px;letter-spacing:.12em;margin:4px 0 8px}.verdict.good strong{color:#a6d8b3}.verdict.bad strong{color:#ff7a70}.verdict p{color:var(--muted);font-size:14px}.reveal-table{display:flex;flex-direction:column;gap:6px}.reveal-row{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:9px 10px;display:flex;flex-direction:column;gap:8px}.reveal-who{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:14px}.reveal-who .hit{color:#8fc7a0}.reveal-who .miss{color:var(--muted)}.reveal-cards{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.reveal-cards .lbl{font-size:11px;color:var(--muted);writing-mode:vertical-rl;letter-spacing:.2em}.reveal-cards .lbl:not(:first-child){margin-left:8px}@media(min-width:720px){main.game,main.lobby{max-width:680px}.seats{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}.modal-timer{animation-duration:5s!important}}
