:root{--paper:#e6dfcc;--paper-2:#d9d0b9;--paper-ink:#2a2520;--ink:#15130f;--ink-panel:#15130ff0;--ink-soft:#15130f8c;--text:#ece5d4;--text-2:#c9c0ad;--muted:#9d937f;--line:#ece5d42e;--line-2:#ece5d466;--gold:#d2ad5c;--gold-2:#a8863e;--vermilion:#c8431f;--seal:#a7352b;--lacquer:#3b2214;--font-title:"Ma Shan Zheng", "STKaiti", "KaiTi", serif;--font-body:"Noto Serif SC", "Songti SC", "SimSun", serif;--font-label:"ZCOOL XiaoWei", "Noto Serif SC", serif}*{box-sizing:border-box}html,body{margin:0}body{background:var(--paper);color:var(--text);font-family:var(--font-body);min-height:100vh;line-height:1.8;position:relative;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .25 0 0 0 0 .2 0 0 0 0 .12 0 0 0 .08 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"),radial-gradient(at 20% 10%,#fffaecb3,#0000 55%),radial-gradient(at 85% 85%,#78643c2e,#0000 50%);position:fixed;inset:0}body:after{content:"";pointer-events:none;z-index:0;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900' preserveAspectRatio='xMidYMax slice'><text x='1480' y='560' font-family='Ma Shan Zheng,KaiTi,serif' font-size='300' fill='%2315130f' opacity='.055' text-anchor='middle' writing-mode='tb'>話説天下</text><path d='M0 690 C160 600 260 660 380 600 C500 540 600 620 720 590 C860 550 940 470 1080 520 C1200 560 1300 640 1440 600 C1520 580 1570 610 1600 600 L1600 900 L0 900 Z' fill='%2315130f' opacity='.13'/><path d='M0 760 C220 700 340 760 520 720 C700 680 820 740 980 700 C1140 660 1300 740 1600 690 L1600 900 L0 900 Z' fill='%2315130f' opacity='.16'/><path d='M0 840 C300 800 500 850 800 820 C1100 790 1300 850 1600 810 L1600 900 L0 900 Z' fill='%2315130f' opacity='.2'/></svg>") bottom/cover no-repeat;position:fixed;inset:0}.app{z-index:1;max-width:1480px;margin:0 auto;padding:14px 20px 48px;position:relative}.panel{color:var(--text);isolation:isolate;position:relative}.panel:before{content:"";background:var(--ink-panel);filter:url(#inkEdge);z-index:-1;position:absolute;inset:-6px -10px}.panel:after{content:"";background:var(--ink-soft);filter:url(#inkSoft);z-index:-2;opacity:.55;position:absolute;inset:-18px -26px -22px}.panel h2{font-family:var(--font-title);letter-spacing:.12em;color:var(--text);margin:0;font-size:1.3rem;font-weight:400}.muted{color:var(--muted)}.strip{color:var(--paper-ink);background:#ece5d4eb}.seal{font-family:var(--font-title);color:#fff;background:var(--seal);letter-spacing:.08em;padding:1px 8px;font-size:.85rem;line-height:1.5;display:inline-block;transform:rotate(-2deg);box-shadow:inset 0 0 0 1.5px #ffffff59}.ink-rule{background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 10' preserveAspectRatio='none'><path d='M2 6 C80 2 160 9 260 5 C360 1 440 8 598 4' stroke='%2315130f' stroke-width='1.8' fill='none' stroke-linecap='round' opacity='.75'/></svg>") 50%/100% 100% no-repeat;height:10px}button{font:inherit;font-family:var(--font-label);color:var(--text);border:1px solid var(--line-2);cursor:pointer;letter-spacing:.08em;background:#26231e;padding:6px 16px}button:hover{border-color:var(--gold-2);background:#352f27}button.primary{color:var(--gold);border-color:var(--gold);background:#1a1813;box-shadow:inset 0 0 0 1px #d2ad5c40}button.primary:hover{background:#26231e}button:disabled{opacity:.5;cursor:default}.hdr{color:var(--paper-ink);flex-wrap:wrap;align-items:center;gap:18px;padding:8px 4px 10px;display:flex}.hdr .logo{font-family:var(--font-title);letter-spacing:.12em;align-items:center;gap:10px;font-size:2.1rem;line-height:1;display:flex}.hdr .logo .seal{font-size:1rem}.hdr nav{gap:2px;margin-left:14px;display:flex}.hdr nav a{font-family:var(--font-label);color:var(--paper-ink);letter-spacing:.14em;border:1px solid #0000;padding:6px 16px;text-decoration:none}.hdr nav a.active{background:var(--ink);color:var(--text)}.hdr nav a:hover:not(.active){border-color:#15130f59}.hdr .right{font-family:var(--font-label);align-items:center;gap:14px;margin-left:auto;font-size:.95rem;display:flex}.hdr .live{align-items:center;gap:6px;display:inline-flex}.hdr .live i{background:var(--vermilion);border-radius:50%;width:9px;height:9px;box-shadow:0 0 0 3px #c8431f38}.hdr .live.off i{background:var(--muted);box-shadow:none}@media (width<=760px){.hdr{gap:8px 12px}.hdr .logo{font-size:1.5rem}.hdr .logo .seal{display:none}.hdr nav{margin-left:0}.hdr nav a{padding:4px 10px}.hdr .right{justify-content:flex-end;width:100%;font-size:.85rem}}.main{grid-template-columns:236px minmax(0,1fr) 332px;align-items:start;gap:26px;margin-top:16px;display:grid}.main>*{min-width:0}@media (width<=1100px){.main{grid-template-columns:minmax(0,1fr) 300px}.col-left{order:3;grid-column:1/-1}}@media (width<=760px){.main{grid-template-columns:1fr;gap:22px}.col-right{order:2}.col-left{order:3}.app{padding:10px 14px 34px}.stage .title{flex-wrap:wrap;gap:8px 10px}.stage .title h1{font-size:1.35rem}.player{flex-wrap:wrap;gap:8px 10px}.player input[type=range]{display:none}.player .time{min-width:0}.comments{height:auto;max-height:60vh;position:static}.screen .overlay{padding:16px 14px 10px;font-size:.95rem}}.profile{grid-template-columns:1fr auto;align-items:start;gap:10px 14px;padding:18px 16px 16px;display:grid}.profile .avatar{grid-column:1;width:108px;height:108px}.profile .vname{writing-mode:vertical-rl;font-family:var(--font-title);letter-spacing:.2em;color:var(--text);grid-area:1/2/span 2;margin-top:2px;font-size:1.9rem;line-height:1}.profile .book{font-family:var(--font-label);color:var(--text-2);grid-column:1}.profile .book b{color:var(--vermilion);font-weight:400}.profile dl{border-top:1px solid var(--line);grid-column:1/-1;grid-template-columns:auto 1fr;gap:3px 12px;margin:8px 0 0;padding-top:10px;font-size:.92rem;display:grid}.profile dt{color:var(--muted);font-family:var(--font-label)}.profile dd{font-variant-numeric:tabular-nums;color:var(--text);margin:0}.profile dd b{color:var(--gold);font-weight:600}.profile .sound{grid-column:1/-1;width:100%;margin-top:10px}.programme{margin-top:30px;padding:14px 16px 12px}.programme h2 small{font-family:var(--font-body);color:var(--muted);letter-spacing:0;margin-top:2px;font-size:.78rem;display:block}.programme ol{max-height:46vh;margin:10px 0 0;padding:0;list-style:none;overflow:auto}.programme li{border-bottom:1px solid var(--line);grid-template-columns:3.9em 1fr auto;align-items:baseline;gap:6px;margin:0 -6px;padding:5px 6px;font-size:.86rem;display:grid}.programme li>span:nth-child(2){white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.programme li .t{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.82rem}.programme li.aired{color:var(--muted)}.programme li.on{color:var(--paper-ink);background:#ece5d4eb;font-weight:600}.programme li.on .t{color:var(--paper-ink);opacity:.7}.programme li.wrapped{opacity:.7}.programme .tag{font-family:var(--font-label);color:var(--muted);font-size:.72rem}.programme .tag.live{color:var(--vermilion)}.programme .small{margin:8px 0 0;font-size:.78rem}.stage{padding:0 0 2px}.stage .title{align-items:baseline;gap:14px;padding:12px 18px 4px;display:flex}.stage .title h1{font-family:var(--font-title);letter-spacing:.1em;color:var(--text);margin:0;font-size:1.75rem;font-weight:400}.stage .title .book{font-family:var(--font-label);color:var(--text-2)}.stage .title .seal{margin-left:auto}.screen{aspect-ratio:16/9;background:var(--lacquer);margin:6px 14px 0;position:relative;overflow:hidden;box-shadow:0 0 0 1px #d2ad5c59}.screen svg{width:100%;height:100%;display:block;position:absolute;inset:0}.screen .frame{object-fit:cover;width:94%;height:89.4%;animation:180s ease-in-out infinite alternate kenburns;position:absolute;top:5.3%;left:3%}@keyframes kenburns{0%{transform:scale(1)translate(0)}to{transform:scale(1.06)translate(-1.5%,1%)}}.screen .overlay{color:#fff8e6;text-shadow:0 1px 2px #0009;background:linear-gradient(#1c100600,#1c100694 30%,#1c1006db);max-height:44%;padding:22px 26px 14px;font-size:1.1rem;line-height:1.7;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.screen .overlay .src{color:#ffd9a3;vertical-align:middle;border:1px solid #ffd9a399;margin:0 3px;padding:0 4px;font-size:.72rem}.screen .overlay .q{color:#ffd9a3;font-family:var(--font-label);margin-bottom:4px}.screen .curtain{color:#fff3dc;font-family:var(--font-title);letter-spacing:.3em;background:#1c100666;place-items:center;font-size:2rem;display:grid;position:absolute;inset:0}.player{font-family:var(--font-label);color:var(--text-2);align-items:center;gap:12px;padding:12px 18px;display:flex}.player .pbtn{border-radius:50%;place-items:center;width:40px;height:40px;padding:0;display:grid}.player .pbtn svg{fill:currentColor;width:18px;height:18px}.player .bar{background:#ece5d429;flex:1;height:5px;position:relative}.player .bar i{background:var(--gold);position:absolute;top:0;bottom:0;left:0}.player .time{font-variant-numeric:tabular-nums;text-align:right;min-width:7.5em;font-size:.85rem}.player input[type=range]{width:90px;accent-color:var(--gold)}.stage .fulltext{border-top:1px solid var(--line);margin:0 18px 14px}.stage .fulltext summary{cursor:pointer;font-family:var(--font-label);color:var(--muted);padding:6px 0;font-size:.9rem}.stage .fulltext p{max-height:36vh;color:var(--text-2);margin:4px 0 0;font-size:1rem;overflow:auto}.stage .fulltext .pending{color:#0000}.stage .fulltext .src{color:var(--gold);vertical-align:middle;border:1px solid #d2ad5c80;margin:0 3px;padding:0 4px;font-size:.72rem}@keyframes sway{0%{transform:rotate(-.6deg)}to{transform:rotate(.6deg)}}@keyframes bob{0%{transform:translateY(0)}to{transform:translateY(-6px)}}@keyframes flicker{0%,to{opacity:.55}50%{opacity:.75}}.screen.playing .puppet{transform-origin:50% 100%;animation:3.2s ease-in-out infinite alternate sway}.screen.playing .rider{animation:1.1s ease-in-out infinite alternate bob}.screen.playing .glow{animation:2.6s ease-in-out infinite flicker}.comments{flex-direction:column;height:calc(100vh - 124px);min-height:480px;max-height:860px;padding:14px 16px;display:flex;position:sticky;top:14px}.comments h2 small{font-family:var(--font-body);color:var(--muted);letter-spacing:0;font-size:.78rem;display:block}.comments .list{flex:1;margin:8px 0;padding-right:4px;overflow:auto}.comment{border-bottom:1px solid var(--line);color:var(--text);gap:8px;padding:6px 0;font-size:.95rem;display:flex}.comment i{background:var(--gold);opacity:.8;border-radius:50%;flex:none;width:9px;height:9px;margin-top:11px}.comment .ts{color:var(--muted);font-variant-numeric:tabular-nums;margin-left:auto;font-size:.75rem}.comments form{border-top:1px solid var(--line);color:var(--text-2);align-items:center;gap:6px;padding-top:10px;display:flex}.comments input[type=text]{border:1px solid var(--line-2);min-width:0;color:var(--paper-ink);font:inherit;background:#ece5d4eb;flex:1;padding:8px 10px}.comments input[type=text]::placeholder{color:#8a8070}.comments .icon{place-items:center;width:36px;height:36px;padding:0;display:grid}.comments .icon svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.comments .status{color:var(--muted);margin:6px 0 0;font-size:.85rem}.notice{font-family:var(--font-label);color:var(--paper-ink);border-left:3px solid var(--vermilion);margin:10px 0 0;padding:4px 10px}.screen .quip-card{text-align:center;font-family:var(--font-title);color:#fff8e6;letter-spacing:.06em;background:#15130fc7;padding:22px 28px;font-size:2.1rem;line-height:1.5;position:absolute;top:50%;left:8%;right:8%;transform:translateY(-50%);box-shadow:0 0 0 1px #d2ad5c80,0 0 60px #0006}@media (width<=760px){.screen .quip-card{padding:12px 14px;font-size:1.2rem}}.quip-react{border:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:8px;margin:0 18px 12px;padding:8px 10px;font-size:.9rem;display:flex}.quip-react .q{min-width:12em;color:var(--text-2);font-family:var(--font-label);flex:1}.quip-react button{padding:4px 12px}.quip-react button.on{border-color:var(--gold);color:var(--gold)}.comment .qtag{font-family:var(--font-label);color:var(--gold);border:1px solid #d2ad5c80;flex:none;align-self:flex-start;margin-top:4px;padding:0 6px;font-size:.72rem}.comment.qa.answered .qtag{color:var(--vermilion);border-color:#c8431f99}.comment.qa.skipped .qtag,.comment.qa.expired .qtag{color:var(--muted);border-color:var(--line)}.comment.qa i{background:var(--vermilion)}.askqa{font-family:var(--font-label);color:var(--text-2);cursor:pointer;align-items:center;gap:6px;margin-top:8px;font-size:.88rem;display:flex}.askqa input{accent-color:var(--gold);width:16px;height:16px}.askqa.used{color:var(--muted);cursor:default}
