@font-face{font-family:'Inter';font-weight:400;font-style:normal;font-display:swap;src:url(fonts/inter-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Inter';font-weight:600;font-style:normal;font-display:swap;src:url(fonts/inter-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-weight:400;font-style:normal;font-display:swap;src:url(fonts/newsreader-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-weight:400;font-style:italic;font-display:swap;src:url(fonts/newsreader-latin-400-italic.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-weight:700;font-style:normal;font-display:swap;src:url(fonts/newsreader-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-weight:700;font-style:italic;font-display:swap;src:url(fonts/newsreader-latin-700-italic.woff2) format('woff2')}
:root{--bg:#262624;--text:#e6e4da;--muted:#8f8d85;--border:#3a3936;--hover:#33322f;--accent:#e29776;--select:rgba(226,151,118,.26);--thumb:#46453f;--font:'Newsreader',Georgia,serif;--ui:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;color-scheme:dark}
*{box-sizing:border-box}[hidden]{display:none!important}
html,body{height:100%;margin:0}
body{background:var(--bg);color:var(--text);font-family:var(--font);display:flex;overflow:hidden;height:100vh;height:100dvh}
::selection{background:var(--select)}
*{scrollbar-width:thin;scrollbar-color:var(--thumb) transparent}
button{font-family:var(--ui);font-size:13px;color:var(--text);background:transparent;border:1px solid var(--border);border-radius:4px;padding:6px 12px;cursor:pointer}
button:hover{background:var(--hover)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
#side{width:min(260px,80vw);flex:none;border-right:1px solid var(--border);padding:20px 16px;display:flex;flex-direction:column;gap:18px;font-family:var(--ui);font-size:13px;transition:margin .2s;background:var(--bg);overflow-y:auto}
#side.closed{margin-left:calc(-1*min(260px,80vw))}
#side h1{font-family:var(--font);font-weight:500;font-size:24px;margin:0;color:var(--accent)}
#side h2{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 8px;font-weight:600}
#side p{margin:0;color:var(--muted);line-height:1.5}
.room{padding:6px 10px;border-radius:4px;background:var(--hover)}
.you{display:flex;align-items:center;gap:10px}
#main{flex:1;min-width:0;display:flex;flex-direction:column;position:relative}
#top{height:48px;flex:none;display:flex;align-items:center;gap:12px;padding:0 12px;border-bottom:1px solid var(--border);font-family:var(--ui);font-size:13px}
#top b{font-weight:600}#top span{color:var(--muted)}#state{margin-left:auto;color:var(--accent)}
#log{flex:1;overflow-y:auto;padding:12px 0;overscroll-behavior:contain}
#log>*{max-width:760px;margin-left:auto;margin-right:auto}
.m{display:grid;grid-template-columns:36px 1fr auto;gap:12px;padding:3px 16px;position:relative}
.m:hover{background:var(--hover)}.m.flash{background:var(--select)}
.av{width:36px;height:36px;border-radius:4px;display:grid;place-items:center;font:600 16px var(--ui);color:#1f1e1d;text-transform:uppercase}
.g{padding-top:0}.g .av{visibility:hidden;height:1px}.g .h{display:none}
.h{font-family:var(--ui);line-height:1.2;margin-bottom:2px}.n{font-weight:600;font-size:14px}
time{font-size:11px;color:var(--muted);margin-left:8px}
.t{font-size:17px;line-height:1.45;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere}
.e{height:1.5em;width:1.5em;vertical-align:-.4em}.big .e{height:52px;width:52px}
.rp{font:12px var(--ui);color:var(--muted);border-left:2px solid var(--accent);padding-left:8px;margin:2px 0 4px;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rb{align-self:start;opacity:0;font-size:11px;padding:3px 8px}.m:hover .rb,.rb:focus{opacity:1}
@media(pointer:coarse){.rb{opacity:.6}}
.sys{font:12px var(--ui);color:var(--muted);text-align:center;padding:6px}
#new{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(86px + env(safe-area-inset-bottom));background:var(--accent);color:#1f1e1d;border:0;font-weight:600;border-radius:4px;box-shadow:none}
#new:hover{background:#eaa88b}
#rbar{display:flex;gap:10px;align-items:center;padding:6px 16px;border-top:1px solid var(--border);font:12px var(--ui);color:var(--muted)}
#rbar span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#comp{padding:10px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--border);position:relative}
#row{display:flex;gap:8px;align-items:flex-end;max-width:760px;margin:0 auto}
#box{flex:1;resize:none;background:transparent;border:1px solid var(--border);border-radius:4px;color:var(--text);font:17px/1.4 var(--font);padding:8px 10px;max-height:120px;min-width:0}
#box:focus{outline:2px solid var(--accent);outline-offset:0;border-color:transparent}
#cnt{max-width:760px;margin:4px auto 0;font:11px var(--ui);color:var(--muted);height:14px;text-align:right}
#pk{position:absolute;left:16px;right:16px;bottom:100%;max-width:520px;margin:0 auto;background:var(--bg);border:1px solid var(--border);border-radius:4px;padding:8px;display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:2px;max-height:260px;overflow-y:auto}
#pk button{border:0;padding:4px;display:grid;place-items:center}#pk img{width:34px;height:34px}
#lim{position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(38,38,36,.96);z-index:9;display:grid;place-content:center;text-align:center;gap:12px;padding:24px}
#lim h2{font-weight:500;font-size:26px;margin:0;color:var(--accent)}#lim p{margin:0;color:var(--muted);max-width:420px;line-height:1.5}
#clock{font:600 22px var(--ui);color:var(--text)}
@media(max-width:760px){#side{position:fixed;z-index:5;height:100%;top:0;left:0}#side.closed{margin-left:calc(-1*min(260px,80vw) - 2px)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

:root{--ease:cubic-bezier(.32,.72,0,1)}
#main{overflow:hidden}
button{transition:background .3s var(--ease),transform .3s var(--ease),opacity .3s var(--ease),border-color .3s var(--ease)}
button:active{transform:scale(.94)}
#side{transition:margin .55s var(--ease)}
#top .oc{color:var(--muted)}#top{padding:0 12px 0 16px}
.m{grid-template-columns:36px minmax(0,1fr);transition:background .35s var(--ease)}
.b{min-width:0}.rb{position:absolute;right:12px;top:2px}
.m.in{animation:in .45s var(--ease)}
@keyframes in{from{opacity:0;transform:translateY(10px)}}
#lw{position:relative;flex:1;min-height:0;display:flex}#log{overflow-x:hidden}
#new{bottom:14px;left:50%;opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,12px);transition:opacity .4s var(--ease),transform .5s var(--ease),visibility .4s,background .3s}
#new.on{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
#rbar{max-height:0;opacity:0;padding-top:0;padding-bottom:0;border-top-width:0;overflow:hidden;transition:max-height .45s var(--ease),opacity .35s var(--ease),padding .45s var(--ease)}
#rbar.on{max-height:48px;opacity:1;padding-top:6px;padding-bottom:6px;border-top-width:1px}
#pk{position:static;max-width:none;margin:0;border:0;border-top:1px solid var(--border);border-radius:0;padding:0 12px;max-height:0;opacity:0;overflow:hidden;transition:max-height .5s var(--ease),opacity .35s var(--ease),padding .5s var(--ease)}
#pk.on{max-height:200px;opacity:1;padding:8px 12px;overflow-y:auto}
#pk button:hover{transform:scale(1.18);background:transparent}
#lim{opacity:0;visibility:hidden;transition:opacity .6s var(--ease),visibility .6s}#lim.on{opacity:1;visibility:visible}
.rm{display:block;width:100%;text-align:left;border:0;padding:7px 10px;margin-bottom:2px;color:var(--muted)}
.rm.act{background:var(--hover);color:var(--text)}.rm:hover{color:var(--text)}
.wide{width:100%;margin-top:8px}
.rl p{padding-left:1em;text-indent:-1em;margin-bottom:6px}
.av{background-size:cover}.hint{font-size:12px}
.rm{display:flex;justify-content:space-between;gap:8px}.rm small{font-size:11px;opacity:.7}.rm.full:not(.act){opacity:.4;cursor:not-allowed}
.m.mod{background:rgba(238,122,106,.1);box-shadow:inset 3px 0 0 #ee7a6a;animation:warn 1.6s var(--ease)}
.mod .n{color:#ff8f80}.mod .n::after{content:'MOD';font:600 9px var(--ui);letter-spacing:.08em;border:1px solid #ee7a6a;border-radius:3px;padding:1px 4px;margin-left:8px;vertical-align:1px}
@keyframes warn{0%{background:rgba(238,122,106,.35)}}
#row{align-items:flex-end}
#box{min-height:44px;height:44px;line-height:24px;padding:9px 12px;overflow-y:hidden;max-height:200px;max-height:min(200px,30dvh);transition:height .2s var(--ease)}
#emo,#go{width:44px;height:44px;padding:0;display:grid;place-items:center;flex:none}
#go{background:var(--accent);border:0;color:#1f1e1d}#go:hover{background:#eaa88b}
#go:disabled{opacity:.3;cursor:default;background:var(--accent);transform:none}
.t{white-space:normal}.ln{min-height:1.45em}
.q{border-left:3px solid #55534d;padding-left:10px;color:#cfcdc3}
.li{padding-left:1em;text-indent:-1em}
.u{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.sp{background:#46453f;border-radius:3px;padding:0 3px;cursor:pointer;transition:background .35s var(--ease),color .35s var(--ease)}
.sp:not(.show){color:transparent;user-select:none}.sp:not(.show) img{opacity:0}.sp.show{background:rgba(230,228,218,.1)}
#box{transition:none}
.rb{top:-12px;right:16px;background:var(--bg);opacity:0;pointer-events:none;z-index:2}
.m:hover .rb{opacity:1;pointer-events:auto}
@media(pointer:coarse){.rb{display:none}.m{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}}
.rx{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}.rx:empty{display:none}
.chip{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:12px;font:12px var(--ui)}
.chip img{width:18px;height:18px}.chip.me{border-color:var(--accent);background:var(--select)}
#sheet{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s}
#sheet.on{opacity:1;visibility:visible}
#sh{width:min(420px,100%);background:#2d2c2a;border:1px solid var(--border);border-radius:14px 14px 0 0;padding:12px 12px calc(12px + env(safe-area-inset-bottom));transform:translateY(40px);transition:transform .5s var(--ease)}
#sheet.on #sh{transform:none}
#qr{display:flex;justify-content:space-around;padding-bottom:10px;border-bottom:1px solid var(--border);margin-bottom:6px}
#qr button{border:0;padding:6px}#qr button:hover{transform:scale(1.15);background:transparent}#qr img{width:36px;height:36px}
.mi{display:block;width:100%;text-align:left;border:0;padding:13px 12px;font-size:15px}
#scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:4;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s}
#scrim.on{opacity:1;visibility:visible}
.e,.chip img,#pk img,#qr img{pointer-events:none;-webkit-user-drag:none;user-select:none;-webkit-touch-callout:none}
#qr{display:grid;grid-template-columns:repeat(auto-fill,minmax(46px,1fr));justify-content:normal;gap:2px;max-height:210px;max-height:min(210px,32dvh);overflow-y:auto}
.lbl{grid-column:1/-1;font:11px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:6px 4px 2px}
#pk{width:100%;max-width:760px;align-self:center;margin:0 auto}
#sh{width:min(440px,100%)}
.foot{margin-top:auto;padding-bottom:env(safe-area-inset-bottom)}
html{-webkit-text-size-adjust:100%}button,.m{-webkit-tap-highlight-color:transparent}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--thumb);border-radius:4px}::-webkit-scrollbar-track{background:transparent}
#ts{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);z-index:30}
#mreport{color:#ff8f80}
.adm{display:block;overflow:auto;height:auto;padding:24px;font-family:var(--ui);font-size:14px}
.adm input,.adm textarea{display:block;width:100%;max-width:420px;margin:6px 0 14px;background:transparent;border:1px solid var(--border);border-radius:4px;color:var(--text);padding:9px 12px;font:14px var(--ui)}
.adm button{margin:0 8px 8px 0}.adm pre{white-space:pre-wrap;color:var(--muted)}
