:root{--bg:#eef1ec;--surface:#fff;--ink:#1d2733;--muted:#5e6b78;--line:#d5dbd3;--own:#2e55d9;--own-ink:#fff;--signal:#d99a1c;--live:#2f9e6b;--danger:#b93a26;--focus:#2e55d9;--avatar-l:42%;--font-display:"Bricolage Grotesque",system-ui,sans-serif;--font-body:"Atkinson Hyperlegible",system-ui,sans-serif;--step--1:.8125rem;--step-0:1rem;--step-1:1.25rem;--step-2:1.75rem;--step-3:2.5rem;--radius-bubble:1.125rem;--radius-control:.625rem;--control-height:calc(3rem + 3px);--gutter:16px;--content:46rem;--target:2.75rem;--dur-fast:.14s;--dur-med:.22s;--ease-out:cubic-bezier(.2,.8,.2,1);--shadow-pop:0 12px 32px #10182024,0 2px 6px #10182014;--shadow-sheet:0 0 48px #1018202e;--scrim:#10182061;--z-menu:20;--z-overlay:30;--z-toast:40;--buncss-light:initial;--buncss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--buncss-light: ;--buncss-dark:initial;--bg:#12171d;--surface:#1b222b;--ink:#e5e9ee;--muted:#93a0ad;--line:#2a333e;--own:#4f74f0;--signal:#e8b44a;--live:#4cc48c;--danger:#f07a63;--focus:#7d9bff;--avatar-l:62%;--shadow-pop:0 12px 32px #00000073,0 2px 6px #0000004d;--shadow-sheet:0 0 48px #00000080;--scrim:#0000008c}}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:var(--step-0);-webkit-font-smoothing:antialiased;margin:0;line-height:1.5}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.screen{max-width:var(--content);padding:0 var(--gutter);width:100%;height:100%;margin:0 auto}.screen--center{display:grid;align-items: center;max-width:30rem;height:auto;min-height:100%}.screen--center:has(>.top-bar){grid-template-rows:auto 1fr}.panel{padding:2rem 0}.headline{font-family:var(--font-display);font-size:var(--step-3);letter-spacing:-.02em;text-wrap:balance;margin:0 0 .75rem;font-weight:700;line-height:1.05}.lede{color:var(--muted);max-width:34ch;margin:0 0 2rem}.field{display:grid;gap:.375rem;margin-bottom:1.25rem}.field__label{font-weight:700;font-size:var(--step--1)}.input{font:inherit;color:inherit;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius-control);width:100%;padding:.75rem .875rem}input.input,select.input{height:var(--control-height)}.input:focus{border-color:var(--focus);outline:none}.input::placeholder{color:var(--muted);opacity:.7}.input--code{font-family:var(--font-display);font-size:var(--step-2);letter-spacing:.08em;padding-block-start:0;padding-block-end:0;font-weight:600;line-height:1}.button{display:inline-flex;font:inherit;border-radius:var(--radius-control);cursor:pointer;text-decoration:none;white-space:nowrap;transition:background-color var(--dur-fast)ease,border-color var(--dur-fast)ease,color var(--dur-fast)ease,transform var(--dur-fast)var(--ease-out);border:1.5px solid #0000;align-items: center;gap:.5rem;padding:.75rem 1.25rem;font-weight:700}.button:not(:disabled):active,.icon-button:active{transform:scale(.97)}.button--primary:not(:disabled):hover{background:color-mix(in srgb,var(--own)88%,var(--ink))}.button:disabled{cursor:default;opacity:.5}.button--primary{background:var(--own);color:var(--own-ink)}.button--quiet{color:var(--ink);border-color:var(--line);background:0 0}.button--chip{color:var(--ink);border-color:var(--line);font-size:var(--step--1);background:0 0;border-radius:999px;min-height:2.5rem;padding:.375rem .875rem}@media (pointer:coarse){.button--chip{min-height:var(--target)}}.button--chip:not(:disabled):hover,.button--quiet:not(:disabled):hover{border-color:var(--ink)}.form-error{color:var(--danger);font-size:var(--step--1);margin:.5rem 0}.landing-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.5rem}.back-link{display:inline-flex;color:var(--muted);text-decoration:none;font-weight:700;font-size:var(--step--1);align-items: center;gap:.375rem}.back-link:hover{color:var(--ink)}.name-hint--available{color:var(--live)}.name-hint--taken,.name-hint--invalid{color:var(--danger)}.invite-from{margin-bottom:.25rem}.invite-room{display:flex;flex-wrap:wrap;align-items: center;gap:.75rem;margin:1rem 0 1.75rem}.invite-room__type{color:var(--muted);font-size:var(--step--1)}.field__row{display:flex;gap:.5rem}.field__hint{color:var(--muted);font-size:var(--step--1)}.headline--spaced{margin-top:1.5rem}.room-list{margin-top:2rem}.room-list__title{font-family:var(--font-display);font-size:var(--step-1);margin:0 0 .5rem}.room-list__empty{color:var(--muted);margin:0}.room-list__items{list-style:none;overflow-y:auto;max-height:18rem;margin:0;padding:0}.room-list__item{display:flex;border-top:1.5px solid var(--line);justify-content:space-between;align-items: center;gap:1rem;padding:.75rem 0}.room-list__info{display:grid;min-width:0}.room-list__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}.room-list__meta{color:var(--muted);font-size:var(--step--1)}.visibility{display:grid;border:0;gap:.5rem;margin:0 0 1.25rem;padding:0}.visibility legend{margin-bottom:.375rem;padding:0}.visibility__option{display:flex;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius-control);cursor:pointer;align-items: flex-start;gap:.75rem;padding:.75rem .875rem}.visibility__option:has(input:checked){border-color:var(--own)}.visibility__option input{accent-color:var(--own);margin:.3rem 0 0}.visibility__text{display:grid}.visibility__label{font-weight:700}.visibility__description{color:var(--muted);font-size:var(--step--1)}.room-code{display:inline-flex;font-family:var(--font-display);font-weight:700;font-size:var(--step-2);letter-spacing:.04em;gap:.375rem;line-height:1}.room-code__segment{background:var(--ink);color:var(--bg);border-radius:.375rem;padding:.3rem .5rem .4rem}.chat{display:grid;grid-template-rows:auto 1fr auto auto;grid-template-columns:minmax(0,1fr)}.chat-header{display:grid;grid-template-columns:auto minmax(0,1fr)auto;border-bottom:1.5px solid var(--line);align-items: start;gap:.75rem;padding:1.25rem 0 1rem}.chat-header__name{font-family:var(--font-display);letter-spacing:-.01em;overflow-wrap:anywhere;margin:.125rem 0 .5rem;font-size:1.5rem;font-weight:700;line-height:1.15}.chat-header__meta{display:flex;font-size:var(--step--1);color:var(--muted);flex-wrap:wrap;align-items: center;gap:.5rem .75rem}.chat-header__status{display:inline-flex;align-items: center;gap:.375rem}.chat-header__type{border:1px solid var(--line);border-radius:999px;padding:.0625rem .5rem}.status-dot{background:var(--muted);border-radius:50%;flex:none;width:.5rem;height:.5rem}.status-dot--live,.status-dot--on{background:var(--live)}.status-dot--closed{background:var(--danger)}.status-dot--connecting,.status-dot--reconnecting{background:var(--signal);animation:1.2s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.3}}.message-scroller{overflow-y:auto;min-height:0;padding:1rem 0}.message-list{list-style:none;display:grid;gap:.75rem;margin:0;padding:0}.empty-state{color:var(--muted);text-align:center;max-width:32ch;margin:2rem auto}.system-message{display:flex;font-size:var(--step--1);color:var(--muted);text-align:center;flex-wrap:wrap;justify-content:center;gap:.375rem}.system-message time{opacity:.7}.message{display:flex;align-items: flex-start;gap:.625rem;max-width:min(36rem,85%)}.message__row{display:flex;align-items: center;gap:.25rem;min-width:0}.message--continued{margin-top:-.5rem}.message--own{justify-content:flex-end;margin-left:auto}.message__body{display:grid;gap:.2rem;min-width:0}.message--own .message__body{justify-items:end}.message__author{font-size:var(--step--1);padding-left:.875rem;font-weight:700}.message__bubble{background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius-bubble)var(--radius-bubble)var(--radius-bubble).25rem;white-space:pre-wrap;overflow-wrap:anywhere;margin:0;padding:.625rem .875rem}.message--own .message__bubble{background:var(--own);border-color:var(--own);color:var(--own-ink);border-radius:var(--radius-bubble)var(--radius-bubble).25rem var(--radius-bubble)}.message__bubble--deleted,.message--own .message__bubble--deleted{border-style:dashed;border-color:var(--line);color:var(--muted);background:0 0;font-style:italic}.message__time{color:var(--muted);font-variant-numeric:tabular-nums;padding:.125rem .875rem 0;font-size:.75rem}.message__delete{display:inline-grid;color:var(--muted);cursor:pointer;opacity:0;transition:opacity var(--dur-fast)ease,background-color var(--dur-fast)ease,color var(--dur-fast)ease;background:0 0;border:0;border-radius:999px;flex:none;place-items: center;width:2rem;height:2rem}.message__delete:hover{color:var(--danger);background:var(--surface)}.message:hover .message__delete{opacity:1}.message__delete:focus-visible{opacity:1}@media (hover:none){.message__delete{opacity:1}}.message__bubble a{color:inherit;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}.avatar,.avatar-spacer{flex:none;width:2rem;height:2rem;margin-top:1.6rem}.message--continued .avatar-spacer{margin-top:0}.avatar{display:grid;background:hsl(var(--hue)55% var(--avatar-l));color:#fff;font-family:var(--font-display);border-radius:50%;place-items: center;font-size:.75rem;font-weight:700}.composer{border-top:1.5px solid var(--line);padding:.75rem 0 1rem}.composer__row{display:flex;align-items: flex-end;gap:.5rem}.composer__input{resize:none;field-sizing:content;max-height:10rem}@media (max-width:560px){.headline{font-size:var(--step-2)}.room-code{font-size:var(--step-1)}.message{max-width:92%}}@media (prefers-reduced-motion:reduce){.status-dot{animation:none!important}}.icon-button{display:inline-grid;width:var(--target);height:var(--target);color:var(--ink);border:1.5px solid var(--line);cursor:pointer;transition:border-color var(--dur-fast)ease,background-color var(--dur-fast)ease,transform var(--dur-fast)var(--ease-out);background:0 0;border-radius:999px;flex:none;place-items: center}.icon-button:hover{background:var(--surface);border-color:var(--ink)}.button--danger{background:var(--danger);color:#fff}.button--chip svg,.menu__item svg{flex:none}.menu{position:relative}.menu__popup{position:absolute;z-index:var(--z-menu);background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius-control);box-shadow:var(--shadow-pop);transform-origin:top right;animation:pop-in var(--dur-fast)var(--ease-out);min-width:15rem;padding:.375rem;top:calc(100% + .375rem);right:0}.menu__who{border-bottom:1px solid var(--line);color:var(--muted);font-size:var(--step--1);margin:0 0 .25rem;padding:.5rem .75rem .625rem}.menu__who strong{color:var(--ink)}.menu__item{display:flex;font:inherit;color:var(--ink);text-align:left;border-radius:calc(var(--radius-control) - .25rem);cursor:pointer;background:0 0;border:0;align-items: center;gap:.625rem;width:100%;padding:.625rem .75rem}.menu__item:hover{background:var(--bg)}.menu__item:focus-visible{background:var(--bg)}.menu__item--danger{color:var(--danger)}.menu__error{position:absolute;white-space:nowrap;right:0}.drawer-backdrop,.sheet-backdrop{position:fixed;z-index:var(--z-overlay);background:var(--scrim);animation:fade-in var(--dur-med)ease;inset:0}.drawer{position:absolute;overflow-y:auto;padding:1rem var(--gutter);background:var(--surface);border-right:1.5px solid var(--line);width:min(22rem,88vw);inset:0 auto 0 0}.drawer__head,.sheet__head{display:flex;justify-content:space-between;align-items: center;gap:1rem;margin-bottom:1rem}.drawer__title,.sheet__title{font-family:var(--font-display);font-size:var(--step-1);margin:0}.drawer__empty{color:var(--muted)}.drawer__list{list-style:none;margin:0;padding:0}.drawer__item{display:flex;color:var(--ink);text-decoration:none;border-radius:calc(var(--radius-control) - .25rem);justify-content:space-between;align-items:baseline;gap:1rem;padding:.75rem .5rem}.drawer__item:hover,.drawer__item[aria-current=page]{background:var(--bg)}.drawer__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700}.drawer__count{display:inline-flex;color:var(--muted);font-size:var(--step--1);flex:none;align-items: center;gap:.375rem}.sheet{position:absolute;overflow-y:auto;padding:1rem var(--gutter)2rem;background:var(--surface);border-left:1.5px solid var(--line);width:min(28rem,100vw);inset:0 0 0 auto}.sheet:focus{outline:none}.sheet__section{border-top:1.5px solid var(--line);padding:1.25rem 0}.sheet__heading{display:flex;font-size:var(--step-0);justify-content:space-between;align-items:baseline;margin:0 0 .75rem}.sheet__count{color:var(--muted);font-size:var(--step--1);font-weight:400}.sheet__section--danger .button--danger{margin-top:.5rem}.facts{display:grid;grid-template-columns:auto 1fr;gap:.5rem 1rem;margin:0 0 1.25rem}.facts dt{font-weight:700;font-size:var(--step--1)}.facts dd{color:var(--muted);font-size:var(--step--1);margin:0}.invite-share{display:flex;align-items: flex-start;gap:1rem}.invite-share__link{display:grid;justify-items:start;gap:.5rem;min-width:0}.invite-share__url{font-size:var(--step--1);overflow-wrap:anywhere}.qr{border-radius:.375rem;flex:none;width:7.5rem;height:7.5rem}.people{list-style:none;margin:0;padding:0}.people__item{display:flex;align-items: center;gap:.625rem;padding:.5rem 0}.people__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}.people__tag{display:inline-flex;color:var(--signal);font-size:var(--step--1);align-items: center;gap:.25rem;font-weight:700}.status-dot--off{background:var(--line)}.typing-indicator{color:var(--muted);font-size:var(--step--1);min-height:1.25rem;margin:0;font-style:italic}.snackbar-region{position:fixed;z-index:var(--z-toast);width:min(30rem,calc(100vw - 2*var(--gutter)));bottom:6rem;left:50%;transform:translate(-50%)}.snackbar{background:var(--ink);color:var(--bg);border-radius:var(--radius-control);box-shadow:var(--shadow-pop);display:flex;animation:rise-in var(--dur-med)var(--ease-out);justify-content:center;align-items: center;gap:.5rem;margin:0;padding:.75rem 1rem}@media (max-width:560px){.sheet{width:100vw}}.top-bar{display:flex;align-items: center;gap:.75rem;padding:1rem 0 0}.brand{display:inline-flex;font-family:var(--font-display);font-weight:700;font-size:var(--step-0);letter-spacing:.04em;text-decoration:none;gap:.25rem;line-height:1}.brand__segment{background:var(--ink);color:var(--bg);border-radius:.3rem;padding:.3rem .45rem .375rem}.brand__segment--accent{background:var(--own);color:var(--own-ink)}.name-hint{display:inline-flex;align-items: center;gap:.375rem}.field__hint.name-hint--available{color:var(--live)}.field__hint.name-hint--taken,.field__hint.name-hint--invalid{color:var(--danger)}.room-list__meta{display:inline-flex;align-items: center;gap:.375rem}.composer__row .button--primary{min-height:var(--control-height)}.menu__item,.drawer__item,.visibility__option{transition:background-color var(--dur-fast)ease,border-color var(--dur-fast)ease}.visibility__option:hover{border-color:color-mix(in srgb,var(--own)45%,var(--line))}.drawer{animation:slide-in-left var(--dur-med)var(--ease-out)}.sheet{animation:slide-in-right var(--dur-med)var(--ease-out);box-shadow:var(--shadow-sheet)}.spin{animation:.9s linear infinite spin}@keyframes fade-in{0%{opacity:0}}@keyframes pop-in{0%{opacity:0;transform:scale(.96)translateY(-4px)}}@keyframes rise-in{0%{opacity:0;transform:translateY(8px)}}@keyframes slide-in-left{0%{transform:translate(-100%)}}@keyframes slide-in-right{0%{transform:translate(100%)}}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width:560px){.screen--center:has(>.top-bar){align-items: start}.chat-header__name{font-size:var(--step-1)}.composer__send-label{position:absolute;overflow:hidden;clip-path:inset(50%);white-space:nowrap;width:1px;height:1px}}@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important}}.drawer__home{justify-content:flex-start;align-items: center;gap:.75rem}.drawer__section{border-top:1.5px solid var(--line);color:var(--muted);font-size:var(--step--1);margin:1rem 0 .25rem;padding:.75rem .5rem 0;font-weight:700}.invite-code{display:grid;justify-items:start;gap:.5rem;margin-bottom:1rem}.faq{border-top:1.5px solid var(--line);margin-top:3rem;padding-top:1.5rem}.faq__title{font-family:var(--font-display);font-size:var(--step-1);margin:0 0 .5rem}.faq__item{border-bottom:1px solid var(--line)}.faq__item summary{display:flex;cursor:pointer;list-style:none;justify-content:space-between;gap:1rem;padding:.875rem 0;font-weight:700}.faq__item summary::-webkit-details-marker{display:none}.faq__item summary:after{content:"+";color:var(--muted);transition:transform var(--dur-fast)ease;flex:none;font-weight:400}.faq__item[open] summary:after{transform:rotate(45deg)}.faq__item p{color:var(--muted);max-width:60ch;margin:0 0 1rem}.noscript{padding:0 var(--gutter);max-width:30rem;margin:2rem auto}
