:root{--bg:#0b0f16;--panel:#111823;--border:#1f2a3a;--text:#e6edf3;--muted:#93a1b1;--accent:#2dd4bf;--red:#e31337;--mine:#0f2f33}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:#2b3a50 transparent}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;height:100%}body{background:var(--bg);height:100%;color:var(--text);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);flex-direction:column;margin:0;font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;display:flex}main{flex-direction:column;flex:1;gap:12px;width:100%;max-width:820px;min-height:0;margin:0 auto;padding:16px 16px 10px;display:flex}a{color:var(--accent)}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.hero{align-items:center;gap:12px;display:flex}.icon{border-radius:10px;flex:none}.title{flex:1;min-width:0}h1{margin:0;font-size:1.25rem;line-height:1.2}.status{color:var(--muted);white-space:nowrap;align-items:center;gap:8px;min-width:0;margin:2px 0 0;font-size:.85rem;display:flex}#status-text{text-overflow:ellipsis;overflow:hidden}.dot{background:var(--muted);border-radius:50%;flex:none;width:10px;height:10px}.status[data-state=open] .dot{background:var(--accent);box-shadow:0 0 0 4px #2dd4bf2e}.status[data-state=closed] .dot{background:var(--red)}button{font:inherit;cursor:pointer;color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:8px;min-height:40px;padding:0 14px}@media (hover:hover){button:hover{border-color:var(--accent)}}button.primary{background:var(--accent);border-color:var(--accent);color:var(--bg);font-weight:700}.lang{gap:4px;display:flex}.lang button{min-height:32px;color:var(--muted);padding:0 10px;font-size:.85rem}.lang button[aria-pressed=true]{color:var(--bg);background:var(--accent);border-color:var(--accent);font-weight:700}.card{background:var(--panel);border:1px solid var(--border);border-radius:12px}#bar{flex-wrap:wrap;align-items:center;gap:8px 20px;padding:10px 14px;font-size:.92rem;display:flex}.who{flex-wrap:wrap;align-items:center;gap:6px 8px;min-width:0;display:flex}.who b{color:var(--accent)}#room-name{color:#fbbf24}.muted{color:var(--muted)}.actions{gap:8px;margin-left:auto;display:flex}#people{position:relative}#people summary{cursor:pointer;border:1px solid var(--border);background:var(--bg);-webkit-user-select:none;user-select:none;border-radius:999px;align-items:center;gap:6px;min-height:34px;padding:0 12px;font-size:.9rem;list-style:none;display:flex}#people summary::-webkit-details-marker{display:none}#people summary:after{content:"▾";color:var(--muted)}#people[open] summary{border-color:var(--accent)}#online{z-index:5;background:var(--panel);border:1px solid var(--border);border-radius:12px;min-width:14rem;max-height:50vh;margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 6px);left:0;overflow-y:auto;box-shadow:0 8px 24px #00000080}#online li{overflow-wrap:anywhere;border-radius:8px;padding:6px 10px}#online li.me{color:var(--accent)}#log{flex-direction:column;flex:1;gap:8px;min-height:0;margin:0;padding:14px;list-style:none;display:flex;overflow-y:auto}#log li{background:var(--bg);border:1px solid var(--border);overflow-wrap:anywhere;border-radius:12px;max-width:min(34rem,85%);padding:6px 12px}#log li.mine{background:var(--mine);border-color:#2dd4bf59;align-self:flex-end}#log li b{color:var(--accent);font-size:.75rem;display:block}#log li.other b{color:var(--muted)}#log li time{float:right;color:var(--muted);margin-left:12px;font-size:.7rem}#log li.note{max-width:100%;color:var(--muted);text-align:center;background:0 0;border:none;align-self:center;padding:0;font-size:.85rem}#form{align-items:flex-end;gap:8px;display:flex}.field{flex:1;min-width:0;position:relative}#text{width:100%;min-height:46px;max-height:9.5rem;font:inherit;resize:none;color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:11px 14px;font-size:16px;line-height:1.4;display:block;overflow-y:auto}.count{color:var(--muted);pointer-events:none;font-size:.7rem;position:absolute;bottom:5px;right:10px}.count.near{color:#fbbf24}.count:empty{display:none}#log li span{white-space:pre-wrap}#text:focus{border-color:var(--accent)}#form button{min-height:46px;padding:0 20px}footer{color:var(--muted);border-top:1px solid var(--border);padding-top:8px;font-size:.8rem}footer p{overflow-wrap:anywhere;margin:2px 0}@media (max-width:520px){.actions{width:100%;margin-left:0}.actions button{flex:1}}#log li.note time{display:none}#log li .reactions{clear:both;flex-wrap:wrap;gap:4px;margin-top:4px;display:flex}.chip{background:var(--bg);border-radius:999px;min-height:28px;padding:0 8px;font-size:.85rem;line-height:1}.chip.mine{border-color:var(--accent);background:var(--mine)}.chip.add{color:var(--muted);opacity:.55}#log li:hover .chip.add,.chip.add:focus-visible{opacity:1}@media (hover:none){.chip.add{opacity:.8}}#palette{z-index:10;gap:4px;padding:6px;display:flex;position:fixed;box-shadow:0 8px 24px #00000080}#palette[hidden],#emoji-panel[hidden]{display:none}#palette .chip{min-width:40px;min-height:40px;font-size:1.3rem}#emoji-panel{grid-template-columns:repeat(auto-fill,minmax(38px,1fr));gap:2px;max-height:28vh;padding:6px;display:grid;overflow-y:auto}#emoji-panel button{background:0 0;border:none;border-radius:8px;min-height:38px;padding:0;font-size:1.3rem}#emoji-panel button:hover{background:var(--bg)}.emoji-btn{min-height:46px;padding:0 12px;font-size:1.2rem}@media (hover:none) and (pointer:coarse){.emoji-btn,#emoji-panel{display:none}}@media (min-width:900px){html{font-size:18px}body{font-size:1rem}main{gap:16px;max-width:1040px;padding:24px 24px 14px}.icon{width:56px;height:56px}h1{font-size:1.5rem}button{min-height:44px;padding:0 18px}.lang button{min-height:36px}#bar{padding:12px 18px}#people summary{min-height:38px}#log{padding:18px}#log li{max-width:min(42rem,80%);padding:8px 14px}.chip{min-height:32px}#palette .chip{min-width:46px;min-height:46px;font-size:1.4rem}#emoji-panel{grid-template-columns:repeat(auto-fill,minmax(46px,1fr));max-height:30vh}#emoji-panel button{min-height:44px;font-size:1.5rem}#text{min-height:52px;padding:13px 16px;font-size:1rem}#form button,.emoji-btn{min-height:52px}}.help-btn{min-width:32px;min-height:32px;color:var(--muted);border-radius:50%;padding:0;font-weight:700}#help{width:min(40rem,100% - 24px);max-height:calc(100% - 24px);color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:0 20px 16px;overflow-y:auto}#help::backdrop{background:#000000a6}#help .help-head{background:var(--panel);justify-content:space-between;align-items:center;padding:14px 0 8px;display:flex;position:sticky;top:0}#help h2{margin:0;font-size:1.2rem}#help h3{color:var(--accent);margin:18px 0 4px;font-size:1rem}#help p{color:var(--text);margin:6px 0}#help{width:min(34rem,100% - 24px);max-height:min(78dvh, calc(100dvh - max(env(safe-area-inset-top), 12px) - max(env(safe-area-inset-bottom), 12px) - 8px));font-size:.88rem;line-height:1.45}#help h2{font-size:1.05rem}#help h3{margin-top:12px;font-size:.92rem}#help p{margin:5px 0}@media (max-width:520px){#help{width:calc(100% - 28px);padding:0 14px 12px}#help .help-head button{min-height:34px}}#log li a{color:var(--accent);text-underline-offset:2px;text-decoration:underline}.typing{height:1.5em;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin:-6px 4px -4px;font-size:.85rem;font-style:italic;line-height:1.5;overflow:hidden}#qr{text-align:center;width:min(24rem,100% - 24px);color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:0 20px 16px}#qr::backdrop{background:#000000a6}#qr .help-head{background:0 0;justify-content:space-between;align-items:center;padding:14px 0 8px;display:flex;position:static}#qr h2{margin:0;font-size:1.2rem}#qr img{width:min(100%,320px);height:auto;image-rendering:pixelated;border-radius:8px;margin:8px auto;display:block}#bell{justify-content:center;align-items:center;display:inline-flex}#bell .bell-on,#bell[aria-pressed=false] .bell-on{display:none}#bell[aria-pressed=true] .bell-on,#bell .bell-off{display:inline}#bell[aria-pressed=true] .bell-off{display:none}@media (hover:hover){#bell:hover{color:var(--text);border-color:var(--muted)}}#bell[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}@media (max-width:520px){.hero{gap:8px}.icon{width:36px;height:36px}h1{white-space:nowrap;font-size:1.05rem}.lang button{padding:0 8px}.actions{grid-template-columns:1fr 1fr;width:100%;margin-left:0;display:grid}.actions button{white-space:nowrap;padding:0 8px}}@media (max-width:400px){.icon{display:none}h1{text-overflow:ellipsis;overflow:hidden}}.update{z-index:20;padding:10px 16px;padding-top:calc(10px + env(safe-area-inset-top));background:var(--mine);border-bottom:1px solid var(--accent);flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:.92rem;display:flex;position:sticky;top:0}.update[hidden]{display:none}.update span{flex:16rem}.update button{min-height:36px}@media (max-width:520px){.update span{flex-basis:100%}.update button{flex:1}}@supports (height:100dvh){body{height:100dvh}}@media (max-width:520px){main{gap:8px;padding:10px 12px 8px}#bar{gap:4px 12px;padding:8px 12px}#bar .actions{flex-wrap:wrap;gap:6px;display:flex}#bar .actions button{white-space:nowrap;flex:auto;min-height:38px;padding:0 10px;font-size:.82rem}#people summary{min-height:32px}#log{padding:10px}footer{padding-top:6px}footer p:first-child{display:none}}html.standalone body{padding-bottom:calc(env(safe-area-inset-bottom) * .75)}html.standalone footer{display:none}html.standalone main{padding-bottom:4px}#help code{color:var(--muted);overflow-wrap:anywhere;font-size:.9em}html,body{overscroll-behavior:none}#log{overscroll-behavior:contain}dialog:focus,dialog:focus-visible{outline:none}button{transition:border-color .35s,box-shadow .35s}button.flash{border-color:var(--accent)!important;box-shadow:0 0 0 3px #2dd4bf47!important}button.primary.flash{box-shadow:0 0 0 3px #2dd4bf59!important}#emoji-panel button.flash{box-shadow:none!important}#log li.pending{opacity:.6}.keep{color:#fbbf24;opacity:.8;font-size:.85em}.actions-col{flex-direction:column;gap:6px;min-width:0;margin-left:auto;display:flex}.actions-col .actions{margin-left:0}.new-menu{white-space:nowrap;justify-content:center;align-items:center;gap:6px;font-size:.85rem;display:flex}.new-menu[hidden]{display:none}.new-menu{flex-wrap:wrap}.new-menu .join{flex-basis:100%;justify-content:center;gap:6px;margin-top:2px;display:flex}.new-menu .join input{min-width:0;max-width:22rem;min-height:32px;font:inherit;color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:8px;flex:auto;padding:0 10px;font-size:16px}.new-menu .join input:focus{border-color:var(--accent);outline:none}.join-error{text-align:center;color:var(--red);white-space:normal;flex-basis:100%}.join-error[hidden]{display:none}#bar .new-menu .scan-btn{flex-basis:auto}.new-menu .scan-btn[hidden]{display:none}#scan{text-align:center;width:min(24rem,100% - 24px);color:var(--text);background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:0 20px 16px}#scan::backdrop{background:#000000a6}#scan .help-head{background:0 0;justify-content:space-between;align-items:center;padding:14px 0 8px;display:flex;position:static}#scan h2{margin:0;font-size:1.2rem}#scan video{aspect-ratio:1;object-fit:cover;background:#000;border-radius:8px;width:100%;margin:8px 0;display:block}#bar .new-menu button{min-height:32px;font-size:inherit;flex:none;padding:0 10px;line-height:1}@media (max-width:520px){.actions-col{width:100%;margin-left:0}}@media (max-width:400px){.new-menu{flex-wrap:wrap}.new-menu>span{text-align:center;flex-basis:100%}}#log li.note.back{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;display:flex}#log li.note.back button{min-height:32px;font-size:inherit;padding:0 10px}@media (orientation:landscape) and (max-height:500px){main{gap:6px;padding:6px 12px 4px}.hero{gap:8px}.icon{display:none}h1{font-size:1rem}.hero .status{margin:0}.lang button,.help-btn,#bell{min-height:30px}#bar{gap:4px 12px;padding:6px 12px;font-size:.85rem}#bar .actions{gap:6px}#bar .actions button{min-height:32px;padding:0 10px;font-size:.85rem}#log{min-height:72px}#text{min-height:40px;padding:8px 12px}#form button{min-height:40px}footer{display:none}}@media (max-width:520px){#bar .actions{flex-wrap:nowrap;gap:6px;width:100%;display:flex}#bar .actions:has(#install:not([hidden])){flex-wrap:wrap}#bar .actions button{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;padding:0 6px;font-size:.8rem;overflow:hidden}}html.standalone body{height:auto;position:fixed;inset:0}
