@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;600;700&display=swap');
:root{--ink:#20251f;--muted:#77776c;--paper:#f4f0e6;--panel:#fffdf7;--line:#ded7c7;--jade:#557766;--red:#9b4f3d;--gold:#a98645}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 20% 0%,#e9e3d5 0,#f4f0e6 48%,#ece7db 100%);color:var(--ink);font-family:"Noto Serif SC","Songti SC",serif;min-height:100vh}.shell{max-width:1100px;margin:auto;padding:34px 24px 20px}.top{display:flex;justify-content:space-between;align-items:center;margin:0 0 25px;padding:10px 4px 18px;border-bottom:1px solid #cfc6b3}.top h1{font-size:35px;letter-spacing:.16em;margin:3px 0}.top p,.join p{margin:0;color:var(--muted);font-size:14px}.eyebrow{font-size:11px;letter-spacing:.14em;color:var(--gold);text-transform:uppercase}.connection{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:13px}.dot{width:8px;height:8px;border-radius:50%;background:#aaa}.dot.on{background:#56846b;box-shadow:0 0 0 4px #56846b20}.room-tag,.badge{border:1px solid var(--line);border-radius:99px;padding:5px 10px;color:var(--jade);font-size:12px}.room-tag b{letter-spacing:.08em}.panel{background:var(--panel);border:1px solid var(--line);box-shadow:0 7px 22px #49391b0a;border-radius:5px;padding:21px}.join{max-width:510px;margin:40px auto 80px}.join h2{margin:0 0 7px;font-size:23px}.join form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end;margin-top:20px}.join label{font-size:12px;color:var(--muted)}input{width:100%;font:inherit;background:#fff;border:1px solid var(--line);border-radius:3px;padding:10px 11px;margin-top:6px;color:var(--ink);outline:none}input:focus{border-color:var(--jade);box-shadow:0 0 0 3px #55776616}button{font:inherit;cursor:pointer;border:1px solid #bdb49f;background:#faf8f1;color:var(--ink);padding:10px 14px;border-radius:3px;transition:.15s}button:hover{border-color:var(--jade);color:var(--jade);transform:translateY(-1px)}button.primary{background:var(--jade);color:white;border-color:var(--jade)}button.primary:hover{background:#456453}.error{color:var(--red);font-size:13px;margin-top:10px}.hidden{display:none!important}.layout{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(250px,.8fr);gap:18px}.maincol{display:grid;gap:16px;align-content:start}.sectionhead{display:flex;justify-content:space-between;align-items:center;gap:10px}.sectionhead h2{font-size:18px;margin:0}.status{background:linear-gradient(125deg,#fffdf7,#f7f4e9)}.status h2{margin:4px 0 0;font-size:21px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;border-top:1px solid var(--line);margin-top:17px;padding-top:14px}.stat span{display:block;font-size:12px;color:var(--muted);margin-bottom:7px}.stat b{display:flex;align-items:center;gap:7px;font-weight:500}.stat em{font-style:normal;font-size:14px}.bar{height:7px;width:min(78px,50%);background:#eee7d9;border-radius:99px;overflow:hidden}.bar i{display:block;height:100%;width:100%;background:var(--red);border-radius:99px}.bar.qi i{background:var(--jade)}.story p{line-height:1.9;font-size:15px;margin:12px 0 19px}.actions{display:flex;gap:9px;flex-wrap:wrap}.actions button{font-size:13px}.story small{display:block;color:var(--muted);margin-top:13px;font-size:11px}.chatpanel{min-height:285px;display:flex;flex-direction:column}.muted{font-size:12px;color:var(--muted)}.messages{height:170px;overflow:auto;border-block:1px solid #eee8dc;margin:13px 0;padding:8px 3px}.message{font-size:13px;line-height:1.7;padding:3px 0;overflow-wrap:anywhere}.message .time{color:#aaa;margin-right:8px;font-size:11px}.message .who{color:var(--jade);margin-right:5px}.message.sys{color:var(--muted);font-style:italic}.chatform{display:flex;gap:8px}.chatform input{margin:0;flex:1}.chatform button{padding-inline:17px}.people{min-height:360px}.players{display:grid;gap:9px;margin-top:17px}.player{border:1px solid #eee8dc;padding:11px;border-radius:3px}.playerhead{display:flex;justify-content:space-between;gap:6px}.playerhead b{font-size:14px;font-weight:600}.playerhead span,.player small{color:var(--muted);font-size:11px}.player small{display:block;margin-top:5px}.player.me{border-color:#b5c7b7;background:#f6f9f3}.tip{margin-top:22px;padding:12px;background:#f7f4e9;color:var(--muted);font-size:12px;line-height:1.8}footer{text-align:center;color:#9a9589;font-size:11px;margin-top:23px}@media(max-width:720px){.shell{padding:22px 14px}.top{align-items:flex-start;gap:10px}.top h1{font-size:29px}.connection{flex-wrap:wrap;justify-content:flex-end}.join form{grid-template-columns:1fr 1fr}.join form button{grid-column:1/-1}.layout{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.people{min-height:0}}