:root{font-family:system-ui,-apple-system,"Noto Sans TC",sans-serif;font-size:20px;color:#202020;background:#f8f5ef;--ink:#202020;--red:#b52c26;--accent:#e8392f;--red-deep:#93241f;--green:#176b59;--cream:#f8f5ef;--line:#d9d5cb}*{box-sizing:border-box;font-size:1rem}body{margin:0}header{position:relative;background:#202020;color:#fff;padding:18px max(20px,calc((100vw - 1150px)/2));display:flex;justify-content:space-between;align-items:center;gap:16px;border-bottom:8px solid var(--accent)}header::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:4px;background:repeating-linear-gradient(90deg,#fff 0 30px,transparent 30px 52px);opacity:.7}header strong{display:block;font-weight:900;line-height:1.3}header span{display:block;color:#eee8de}header a{color:#fff;text-decoration-thickness:2px;text-underline-offset:4px}main{max-width:1150px;margin:26px auto;padding:0 16px 64px}.panel{background:#fff;border:2px solid var(--line);border-radius:16px;padding:24px;box-shadow:6px 6px 0 #2020200d;margin-bottom:20px}.narrow{max-width:600px;margin:48px auto}h1,h2,h3{font-size:1rem;line-height:1.45;margin:0 0 14px;font-weight:900}h1{border-left:8px solid var(--accent);padding-left:12px}h2{color:var(--red-deep)}p{line-height:1.6;margin:8px 0 18px;color:#383838}label{display:block;font-weight:700;margin:14px 0;color:var(--ink);line-height:1.45}input,select,textarea{display:block;width:100%;font:inherit;margin-top:8px;padding:12px 14px;border:2px solid #aaa69e;border-radius:9px;background:#fff;color:var(--ink)}input:focus,select:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:3px solid var(--green);outline-offset:3px}textarea{min-height:130px;resize:vertical}button{font:inherit;font-weight:850;cursor:pointer;background:var(--red);color:#fff;border:2px solid var(--red);border-radius:9px;padding:10px 17px;min-height:52px;line-height:1.35}button:hover{background:var(--red-deep);border-color:var(--red-deep)}button.secondary{color:var(--ink);background:#fff;border-color:var(--ink)}button.secondary:hover{background:#f4eee5}button.danger{background:#82231f;border-color:#82231f}button:disabled{opacity:.5;cursor:not-allowed}.grid{display:grid;gap:18px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.heading{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}.heading h1,.heading h2{margin:0}.roomRow,.playerRow,.task,.comment,.cardRow{border:2px solid var(--line);border-radius:11px;padding:16px;margin:12px 0;background:#fffdf9}.roomRow{display:flex;justify-content:space-between;align-items:center;gap:14px}.roomRow strong{display:block;overflow-wrap:anywhere}.muted{color:#4c4c4c}.badge{background:#e5f2ed;color:#145640;border:2px solid #c4dfd2;border-radius:100px;padding:5px 12px;font-weight:800;display:inline-block;margin:4px 5px 4px 0;line-height:1.35}.badge.warn{background:#fff0dc;color:#6f3f0c;border-color:#ead1a5}.badge.loss{background:#fce8e6;color:#86201e;border-color:#eeb6af}#notice{min-height:0}#notice:not(:empty){padding:14px 16px;margin-bottom:18px;background:#fff0dc;color:#583012;border:2px solid #eed1a5;border-radius:9px;white-space:pre-wrap}.choice{display:flex;align-items:flex-start;gap:12px;padding:12px;border-radius:9px;border:2px solid var(--line);margin:8px 0;font-weight:500}.choice input{width:24px;height:24px;min-width:24px;margin:3px 0}.track{border:3px solid var(--ink);background:#f9f8f4;padding:16px 16px 30px;border-radius:11px;min-width:0;position:relative;overflow:hidden}.track::after{content:"";position:absolute;bottom:10px;left:14px;right:14px;height:9px;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);background:repeating-linear-gradient(90deg,transparent 0 16px,var(--ink) 16px 22px,transparent 22px 38px)}.track .card{background:#fff;border:2px solid var(--line);border-left:8px solid var(--green);border-radius:8px;padding:14px;margin:11px 0;overflow-wrap:anywhere}.track .bad{border-left-color:var(--red)}.track .story{background:#fff0dc;border-left:4px solid #b77b18;padding:10px;border-radius:6px;margin-top:10px;color:#50300c}.tabs{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0}.tabs button{background:#fff;color:var(--ink);border-color:var(--ink)}.tabs button.active{background:var(--red);color:#fff;border-color:var(--red)}table{border-collapse:collapse;width:100%;font-size:1rem}th,td{text-align:left;border-bottom:2px solid var(--line);padding:12px;overflow-wrap:anywhere}th{background:#f6ece4}.scroll{overflow:auto}.actions{display:flex;flex-wrap:wrap;gap:9px;align-items:center}.actions button{flex:0 0 auto}.result{background:#e8f3ed;border:2px solid var(--green);border-radius:11px;padding:20px}.result.lost{background:#ffede9;border-color:var(--red)}small{color:#4c4c4c;font-size:1rem}form button{margin-top:10px}[hidden]{display:none!important}@media(max-width:800px){header{padding:16px 20px}.grid.two,.grid.three{grid-template-columns:1fr}.panel{padding:18px}.roomRow{align-items:stretch;flex-direction:column}.roomRow button{width:100%}main{margin-top:18px}}@media(max-width:420px){header{align-items:flex-start;flex-direction:column}.heading{align-items:flex-start;flex-wrap:wrap}.actions{align-items:stretch}.actions button{width:100%}}
.passwordWrap{display:flex;gap:8px;align-items:stretch;margin-top:8px}.passwordWrap input{margin:0;min-width:0;flex:1}.passwordWrap .showPassword{min-width:76px}.avatar{display:block;width:128px;height:128px;max-width:100%;object-fit:contain;background:#faf6ee;border:2px solid #d9d5cb;border-radius:8px;flex:none}.choice .avatar{width:96px;height:96px}.choice span{flex:1;overflow-wrap:anywhere}.roleRow{display:flex;gap:14px;align-items:center}.roleRow strong{display:block;overflow-wrap:anywhere}.cardRow .avatar{margin-bottom:8px}dialog{border:3px solid var(--ink);border-radius:12px;max-width:min(560px,calc(100vw - 26px));width:100%;background:#fffdf9;color:var(--ink);padding:24px}dialog::backdrop{background:#171716a8}.cardAdmin{border:2px solid var(--line);border-radius:12px;padding:16px;margin:14px 0;background:#fffdf9}.cardAdmin .avatar{margin:8px 0}.cardAdmin .actions{margin:10px 0}.backupPanel{border-left:8px solid var(--green)}@media(max-width:520px){.roleRow{align-items:flex-start}.roleRow .avatar{width:96px;height:96px}.choice .avatar{width:72px;height:72px}.passwordWrap{flex-wrap:wrap}.passwordWrap input{flex-basis:60%}}

#previewImage{width:256px;height:256px}
.teamFloat{position:sticky;top:8px;z-index:20;width:max-content;max-width:calc(100% - 16px);margin:12px auto;padding:8px 20px;border:2px solid var(--green);border-radius:999px;background:#f2fbf7f2;color:#145640;font-weight:900;text-align:center;box-shadow:0 6px 20px #17392e30;backdrop-filter:blur(8px)}
.commentFilters{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:16px 0}.commentTag{min-height:42px;padding:6px 14px;background:#fff;color:var(--ink);border:2px solid var(--green);border-radius:999px}.commentTag.active,.commentTag[aria-pressed="true"]{background:var(--green);color:#fff}.commentTag:hover{background:#e5f2ed;color:var(--ink)}.commentTag.active:hover{background:#145640;color:#fff}#roundOutcome{margin-bottom:28px}#roundOutcome .actions{margin-top:18px}
/* Association palette for the shared entrance; room variables express each setting. */
:root{--ink:#153c3a;--red:#157b74;--accent:#219189;--red-deep:#095e59;--green:#167971;--cream:#f0f8f6;--line:#cce3df;--controversy:#a45542;background:var(--cream)}
body{background:linear-gradient(180deg,#e5f4f0 0,#f7fbfa 340px);min-height:100vh}header{background:#fff;color:var(--ink);border-bottom:7px solid var(--accent);box-shadow:0 4px 20px #115b5330}header::after{background:repeating-linear-gradient(90deg,#219189 0 30px,transparent 30px 52px);opacity:.3}header span{color:#365a57}header a{color:#095e59}.brand{display:flex;align-items:center;gap:18px;min-width:0}.brand img{width:112px;height:112px;object-fit:contain;flex:none}.brand strong{font-weight:900}.brand span{margin-top:5px}.panel{box-shadow:4px 6px 0 #0e726114}.panel h1{border-left-color:var(--accent)}h2{color:var(--red-deep)}input:focus,select:focus,textarea:focus,button:focus-visible,a:focus-visible{outline-color:var(--accent)}button{background:var(--red);border-color:var(--red)}button:hover{background:var(--red-deep);border-color:var(--red-deep)}button.secondary:hover{background:var(--cream)}.tabs button.active{background:var(--red);border-color:var(--red)}.track .bad{border-left-color:var(--controversy)}.themeIntro,.scenario{border:2px solid var(--line);border-left:9px solid var(--accent);border-radius:12px;padding:15px 18px;background:#f6fbfa;line-height:1.6}.scenario{margin:0 0 20px;background:var(--cream)}.scenario span{font-weight:900;color:var(--red-deep)}.scenario p{margin:6px 0 0}.themeBadge{border-color:var(--accent);background:var(--cream);color:var(--red-deep)}.lobby-trolley{border-left:7px solid #b48521}.lobby-ark{border-left:7px solid #287ca2}.lobby-bunker{border-left:7px solid #697b3c}.lobby-space{border-left:7px solid #6259a5}
#game.theme-trolley{--ink:#343632;--red:#916013;--red-deep:#69450e;--accent:#c4992a;--green:#536a45;--cream:#fbf5df;--line:#ded2a9;--controversy:#a14632}
#game.theme-ark{--ink:#193e4b;--red:#256f94;--red-deep:#164c72;--accent:#287ca2;--green:#216b70;--cream:#eef7fb;--line:#bad9e6;--controversy:#b5594d}
#game.theme-bunker{--ink:#313c2d;--red:#5e7337;--red-deep:#3b512c;--accent:#70884b;--green:#55734e;--cream:#f3f5e9;--line:#d4dbbf;--controversy:#a0523e}
#game.theme-space{--ink:#292c4f;--red:#574f92;--red-deep:#39366a;--accent:#7164ad;--green:#425f85;--cream:#f2f0fa;--line:#d7d3ec;--controversy:#b25a70}
#game .panel,#game .roomRow,#game .playerRow,#game .task,#game .comment{border-color:var(--line)}#game .panel h2{color:var(--red-deep)}#game .track{border-color:var(--ink);background:var(--cream)}#game .track::after{border-color:var(--ink)}#game.theme-ark .track::after{border:0;height:14px;background:repeating-radial-gradient(ellipse at 12px 20px,transparent 0 9px,#287ca2 10px 12px,transparent 13px 26px)}#game.theme-bunker .track::after{height:9px;border:3px solid #657546;background:repeating-linear-gradient(90deg,#c7d2ac 0 24px,#596a3d 24px 32px)}#game.theme-space .track::after{height:9px;border:0;background:repeating-linear-gradient(90deg,#6a66a6 0 24px,#b6b6d8 24px 28px,transparent 28px 46px)}#game button:not(.secondary):not(.danger){background:var(--red);border-color:var(--red)}#game button:not(.secondary):not(.danger):hover{background:var(--red-deep);border-color:var(--red-deep)}#game .themeBadge{border-color:var(--accent);background:var(--cream);color:var(--red-deep)}#game .track .bad{border-left-color:var(--controversy)}
@media(max-width:520px){.brand{gap:10px}.brand img{width:76px;height:76px}header{gap:10px}.scenario{padding:12px 14px}}
.cardFilters{display:grid;grid-template-columns:minmax(135px,.8fr) minmax(230px,1.45fr) minmax(165px,1fr) minmax(150px,.8fr);gap:14px;align-items:end;margin:18px 0}.cardFilters label{margin:0;min-width:0}.cardFilters input,.cardFilters select{min-height:55px}.cardFilters #cardCount{display:flex;align-items:center;justify-content:center;min-height:55px;white-space:nowrap;margin:0;border-radius:12px}.createActions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.createActions button{margin-top:10px}.createActions .secondary{border-color:var(--red);color:var(--red-deep)}#inviteDialog textarea{font-size:1rem;line-height:1.6;min-height:170px}#inviteDialog #inviteStatus,#inviteFormStatus{min-height:1.5em;margin:8px 0;color:var(--red-deep)}#inviteDialog .actions{margin:12px 0}
@media(max-width:980px){.cardFilters{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.cardFilters{grid-template-columns:1fr}.cardFilters #cardCount{justify-content:flex-start;padding-left:16px}.createActions button{flex:1 1 100%}}
.addCardRow{display:grid;grid-template-columns:minmax(220px,1fr) minmax(145px,.6fr) minmax(180px,.7fr) auto;gap:12px;align-items:end;border:2px solid var(--line);border-radius:12px;padding:14px;background:#f8fbfa}.addCardRow label{margin:0}.addCardRow button{margin:0}.cardBatch{margin:18px 0 12px}.cardBatch #selectedCount{font-weight:800;color:var(--green)}
.cardList{display:grid;gap:7px}.cardLine{display:grid;grid-template-columns:34px 78px minmax(165px,1fr) 88px minmax(145px,.8fr) 76px 82px;gap:10px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:9px 12px;background:#fffdf9;min-width:0}.cardLine:focus-within{position:relative;z-index:2}.cardLine input.cardText{margin:0;min-width:0;padding:9px 10px;height:48px}.cardLine button{min-height:46px;padding:7px 10px}.cardLine .pickCard{margin:0;display:flex;align-items:center}.pickCard input,.cardState input{width:24px;height:24px;margin:0;flex:none}.cardIdentity{display:flex;flex-direction:column;align-items:center;gap:2px;white-space:nowrap;font-weight:700}.cardIdentity .avatar{width:56px;height:56px}.storyMark{display:grid;place-items:center;width:56px;height:56px;border:2px solid var(--line);border-radius:8px;color:var(--green);font-weight:900}.cardState{display:flex;align-items:center;gap:6px;margin:0;white-space:nowrap}
.tagEditor,.rowExtras{position:relative;min-width:0}.tagEditor summary,.rowExtras summary{cursor:pointer;list-style:none;border:2px solid var(--green);border-radius:9px;padding:9px 8px;text-align:center;font-weight:800;min-height:46px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tagEditor summary::-webkit-details-marker,.rowExtras summary::-webkit-details-marker{display:none}.tagEditor summary:hover,.rowExtras summary:hover{background:#e5f2ed}.tagEditor[open],.rowExtras[open]{z-index:10}.rowDropdown{position:absolute;top:calc(100% + 5px);right:0;width:min(400px,calc(100vw - 40px));max-height:min(440px,70vh);overflow:auto;z-index:11;padding:16px;border:2px solid var(--green);border-radius:10px;background:#fff;box-shadow:0 8px 24px #153c3a30}.rowDropdown label{margin:8px 0}.rowDropdown input[type=file]{max-width:100%}.tagChoices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px}.tagOption{display:flex;align-items:center;gap:7px;font-weight:500;min-width:0}.tagOption input{width:23px;height:23px;flex:none;margin:0}.tagOption span{overflow-wrap:anywhere}.rowExtras .actions{gap:7px}.rowExtras .actions button{font-size:1rem}
@media(max-width:980px){.addCardRow{grid-template-columns:repeat(2,minmax(0,1fr))}.cardLine{grid-template-columns:34px 68px minmax(150px,1fr) 86px minmax(130px,.8fr) 72px 78px;gap:6px;padding:8px}.cardIdentity .avatar,.storyMark{width:48px;height:48px}}@media(max-width:720px){.cardLine{grid-template-columns:30px 58px minmax(0,1fr) 76px}.cardLine .cardState{grid-column:3}.cardLine .tagEditor{grid-column:1/3}.cardLine>button{grid-column:3}.cardLine .rowExtras{grid-column:4}.rowDropdown{width:min(330px,calc(100vw - 45px))}}@media(max-width:520px){.addCardRow{grid-template-columns:1fr}.cardLine{grid-template-columns:30px 54px minmax(0,1fr) 76px}.cardLine .cardText{grid-column:3/5}.cardLine .cardState{grid-column:2/3}.cardLine .tagEditor{grid-column:1/3}.cardLine>button{grid-column:3}.cardLine .rowExtras{grid-column:4}.tagChoices{grid-template-columns:1fr}}
.cardPager{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;margin:20px 0 4px;font-weight:800}.cardPager button{min-height:44px}.cardPager span{text-align:center}
@media(max-width:720px){.tagEditor .rowDropdown{left:0;right:auto}.rowExtras .rowDropdown{right:0;left:auto}}
.voiceToggle{display:flex;align-items:center;gap:12px}.voiceToggle input{width:24px;height:24px;flex:none;margin:0}.voiceComposer{margin-top:20px;padding:16px;border:2px solid var(--line);border-radius:12px;background:var(--cream)}.voiceComposer h3{margin:0}.voiceComposer audio,.comment audio{display:block;width:min(100%,440px);margin:12px 0}.voiceComposer p{margin-bottom:8px}.comment .muted{display:block}.adminRoomEntry{margin-bottom:12px}.adminRoomEntry .roomRow{margin-bottom:0}.adminRoomEntry .roomDetail .panel{margin-top:8px;border-color:var(--green)}.cardBatch .danger:disabled{opacity:.5}

#game.theme-trolley .track::after{height:10px;border:0;background:repeating-linear-gradient(115deg,#c4992a 0 14px,#343632 14px 22px)}
#stageDialog{max-height:min(85vh,620px);overflow:auto;border-color:var(--green);box-shadow:0 18px 60px #103c3a55}#stageDialog .stageEyebrow{display:inline-block;margin-bottom:12px;padding:4px 12px;border-radius:999px;background:#e3f3ee;color:#145640;font-weight:900}#stageDialog h2{font-size:1rem;margin-bottom:14px}#stageDialog p{white-space:pre-line}#stageDialog button{width:100%;margin-top:8px}