:root{color-scheme:light;--font-sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", "Source Han Sans SC", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--font-display: "Songti SC", "STSong", "SimSun", "Noto Serif SC", "Source Han Serif SC", serif;--bg: #f4f4f1;--surface: #ffffff;--surface-2: #ebebe6;--ink: #0a0a0a;--ink-2: #30302c;--muted: #70706a;--line: #d4d4ce;--line-strong: #0a0a0a;--accent: #0a0a0a;--accent-soft: #e7e7e2;--on-accent: #ffffff;--teal: #3b3b36;--teal-soft: #e9e9e4;--gold: #5b5b55;--gold-soft: #ededE8;--success: #1c1c1a;--success-soft: #e9e9e4;--danger: #1c1c1a;--danger-soft: #e9e9e4;--btn-primary-bg: #0a0a0a;--btn-primary-bg-hover: #2b2b28;--btn-primary-fg: #ffffff;--radius: 4px;--radius-sm: 2px;--header-height: 64px;--container: 1160px}:root[data-theme=dark]{color-scheme:dark;--bg: #0b0b0b;--surface: #121212;--surface-2: #1a1a1a;--ink: #f3f3ef;--ink-2: #c9c9c2;--muted: #8d8d86;--line: #2b2b2b;--line-strong: #f3f3ef;--accent: #f3f3ef;--accent-soft: #242424;--on-accent: #0a0a0a;--teal: #d0d0c9;--teal-soft: #1c1c1c;--gold: #bdbdb6;--gold-soft: #1d1d1d;--success: #e8e8e2;--success-soft: #1d1d1d;--danger: #e8e8e2;--danger-soft: #1d1d1d;--btn-primary-bg: #f3f3ef;--btn-primary-bg-hover: #d8d8d2;--btn-primary-fg: #0a0a0a}*,*:before,*:after{box-sizing:border-box}html{min-width:320px;background:var(--bg);scroll-behavior:smooth}body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink);font-family:var(--font-sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#root{min-height:100vh}h1,h2,h3,p,ul{margin:0}h1,h2,h3{font-weight:650;line-height:1.18;letter-spacing:-.02em}a{color:inherit}button,input{font-family:inherit}button{-webkit-tap-highlight-color:transparent}::selection{background:var(--ink);color:var(--bg)}:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.container{width:min(var(--container),calc(100% - 2.5rem));margin-inline:auto}.page{display:flex;flex-direction:column;min-height:100vh}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;min-height:40px;padding:.6rem 1rem;border:1px solid transparent;border-radius:var(--radius-sm);background:transparent;color:var(--ink);font:inherit;font-size:.88rem;font-weight:600;line-height:1.2;text-align:center;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{border-color:var(--btn-primary-bg);background:var(--btn-primary-bg);color:var(--btn-primary-fg)}.btn-primary:hover:not(:disabled){border-color:var(--btn-primary-bg-hover);background:var(--btn-primary-bg-hover)}.btn-secondary{border-color:var(--line-strong);background:transparent;color:var(--ink)}.btn-secondary:hover:not(:disabled){background:var(--ink);color:var(--bg)}.btn-danger{border-color:var(--ink);background:var(--ink);color:var(--bg)}.btn-danger:hover:not(:disabled){background:var(--ink-2);border-color:var(--ink-2)}.btn-danger-ghost{border-color:var(--line-strong);background:transparent;color:var(--ink)}.btn-danger-ghost:hover:not(:disabled){background:var(--ink);color:var(--bg)}.btn-small{min-height:30px;padding:.3rem .55rem;font-size:.74rem}.btn-lg{min-height:48px;padding:.75rem 1.2rem;font-size:.94rem}.btn-block{width:100%}.text-button{display:inline-flex;align-items:center;gap:.3rem;padding:0;border:0;background:transparent;color:var(--ink-2);font:inherit;font-size:.78rem;font-weight:600;line-height:1.5;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px;cursor:pointer}.text-button:hover{text-decoration-color:var(--ink)}.danger-text{color:var(--ink)}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;flex-shrink:0;padding:0;border:1px solid var(--line);border-radius:var(--radius-sm);background:transparent;color:var(--ink-2);cursor:pointer;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.icon-button:hover:not(:disabled){border-color:var(--ink);background:var(--ink);color:var(--bg)}.icon-button:disabled{opacity:.35;cursor:not-allowed}.icon-button-subtle{border-color:transparent}.spinner{width:15px;height:15px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite}.brand{display:inline-flex;align-items:center;gap:.65rem;min-width:0;color:var(--ink);text-decoration:none}.logo-mark{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--ink);color:var(--bg)}.logo-mark svg{width:82%;height:82%}.brand-text{display:flex;flex-direction:column;min-width:0;line-height:1.1}.brand-title{display:flex;align-items:baseline;font-size:1rem;font-weight:650;letter-spacing:-.02em;white-space:nowrap}.brand-title strong{font-weight:750}.brand-title span{margin-left:.08rem;color:var(--ink-2);font-weight:450}.brand-subtitle{margin-top:.2rem;color:var(--muted);font-family:var(--font-mono);font-size:.56rem;letter-spacing:.16em}.site-header{position:sticky;top:0;z-index:30;border-bottom:1px solid var(--line-strong);background:var(--bg)}.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:var(--header-height)}.header-actions{display:flex;align-items:center;gap:.9rem}.header-pill{display:inline-flex;align-items:center;gap:.35rem;padding-left:.9rem;border-left:1px solid var(--line);color:var(--muted);font-family:var(--font-mono);font-size:.62rem;letter-spacing:.06em;white-space:nowrap}.header-pill svg{color:var(--muted)}.theme-toggle{display:inline-flex;align-items:center;gap:.4rem;min-height:34px;padding:0 .65rem;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:transparent;color:var(--ink);font-family:var(--font-mono);font-size:.64rem;letter-spacing:.04em;white-space:nowrap;cursor:pointer;transition:background-color .15s ease,color .15s ease}.theme-toggle:hover{background:var(--ink);color:var(--bg)}.home-main{flex:1;padding-top:clamp(2rem,4vw,3.2rem)}.hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);gap:clamp(2.5rem,6vw,5rem);align-items:start;padding:1rem 0 clamp(2.5rem,5vw,4rem)}.hero-copy{padding-top:.4rem}.eyebrow{display:inline-flex;align-items:center;gap:.5rem;color:var(--muted);font-family:var(--font-mono);font-size:.64rem;font-weight:500;letter-spacing:.12em}.eyebrow-dot{width:6px;height:6px;flex-shrink:0;background:var(--ink)}.hero-title{margin:1.15rem 0 1.2rem;font-family:var(--font-display);font-size:clamp(2.7rem,5.6vw,4.35rem);font-weight:600;line-height:1.08;letter-spacing:-.01em}.hero-dim{color:var(--muted)}.hero-lead{max-width:32rem;color:var(--ink-2);font-size:.98rem;line-height:1.9}.hero-specs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:2.2rem 0 0;padding:1rem 0 0;border-top:1px solid var(--line-strong);list-style:none}.hero-specs li{padding:0 1rem;border-left:1px solid var(--line)}.hero-specs li:first-child{padding-left:0;border-left:0}.spec-index{display:block;margin-bottom:.4rem;color:var(--muted);font-family:var(--font-mono);font-size:.58rem;letter-spacing:.1em}.hero-specs strong{display:block;font-size:.84rem;font-weight:650}.hero-specs small{display:block;margin-top:.14rem;color:var(--muted);font-size:.74rem;line-height:1.55}.card{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface)}.card-eyebrow{margin-bottom:.35rem;color:var(--muted);font-family:var(--font-mono);font-size:.62rem;font-weight:500;letter-spacing:.12em}.card-title{display:flex;align-items:center;gap:.4rem;font-size:1.24rem;font-weight:650;letter-spacing:-.02em}.card-description{margin-top:.6rem;color:var(--muted);font-size:.84rem;line-height:1.75}.create-card{padding:clamp(1.35rem,2.4vw,1.8rem);border-top:4px solid var(--ink)}.create-card-head{display:grid;gap:.1rem}.create-form{display:grid;gap:.8rem;margin-top:1.15rem}.create-footnote{display:flex;flex-wrap:wrap;align-items:center;gap:.9rem;margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line);color:var(--muted);font-family:var(--font-mono);font-size:.61rem}.create-footnote span{display:inline-flex;align-items:center;gap:.25rem}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;padding:.7rem .8rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:transparent;color:var(--ink);font:inherit;text-align:left;cursor:pointer}.switch-row:hover{border-color:var(--line-strong)}.switch-copy{display:block;min-width:0}.switch-title{display:flex;align-items:center;gap:.4rem;font-size:.84rem;font-weight:600}.switch-hint{display:block;margin-top:.1rem;color:var(--muted);font-size:.72rem}.switch{width:38px;height:20px;flex-shrink:0;padding:2px;border:1px solid var(--line-strong);border-radius:2px;background:transparent;transition:background-color .15s ease}.switch span{display:block;width:14px;height:14px;border-radius:1px;background:var(--ink);transition:transform .15s ease,background-color .15s ease}.switch.is-on{background:var(--ink)}.switch.is-on span{background:var(--bg);transform:translate(18px)}.password-block{display:grid;gap:.15rem;padding:.8rem;border:1px solid var(--line);border-radius:var(--radius-sm)}.random-button{justify-self:end}.create-success{display:flex;flex-direction:column;align-items:flex-start;gap:.35rem}.success-badge{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;margin-bottom:.3rem;border:1px solid var(--ink);border-radius:var(--radius-sm);background:var(--ink);color:var(--bg)}.create-success .card-title:focus{outline:none}.result-block{width:100%;margin-top:.8rem}.result-label{display:inline-flex;align-items:center;gap:.3rem;color:var(--muted);font-family:var(--font-mono);font-size:.6rem;letter-spacing:.1em}.room-code-row{display:flex;align-items:center;gap:.5rem;margin-top:.35rem}.room-code{display:inline-block;padding:.14rem .4rem;border:1px solid var(--line);border-radius:2px;background:var(--surface-2);font-family:var(--font-mono);font-size:.88rem;font-weight:600;letter-spacing:.06em;line-height:1.55}.room-code-large{padding:.2rem .5rem;font-size:1.02rem}.link-box{display:flex;align-items:center;gap:.5rem;min-width:0;margin-top:.35rem;padding:.55rem .6rem;border:1px solid var(--line);border-radius:2px;background:var(--surface-2);color:var(--ink-2);font-family:var(--font-mono);font-size:.72rem}.link-box>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.link-box>svg{flex-shrink:0;color:var(--muted)}.password-result{padding:.75rem;border:1px dashed var(--line-strong);border-radius:var(--radius-sm);background:transparent}.password-warning{margin-top:.35rem;color:var(--ink-2);font-size:.72rem;line-height:1.6}.success-actions{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;width:100%;margin-top:1.1rem}.again-button{margin-top:.8rem}.join-card{padding:clamp(1.35rem,2.4vw,1.8rem)}.join-form{display:grid;gap:.8rem;margin-top:1.15rem}.password-toggle{justify-self:start;color:var(--muted)}.password-toggle:hover{color:var(--ink)}.field{display:block}.field-label{display:block;margin-bottom:.35rem;color:var(--muted);font-family:var(--font-mono);font-size:.62rem;font-weight:500;letter-spacing:.08em}.input-wrap{position:relative}.input{display:block;width:100%;height:46px;padding:0 .8rem;border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);font:inherit;font-size:.88rem;outline:none;transition:border-color .15s ease}.input::placeholder{color:var(--muted)}.input:hover{border-color:var(--ink)}.input:focus{border-color:var(--ink);outline:2px solid var(--ink);outline-offset:1px}.input-with-action{padding-right:2.7rem}.input-with-leading .input{padding-left:2.4rem}.input-leading{position:absolute;top:50%;left:.8rem;z-index:1;transform:translateY(-50%);color:var(--muted);pointer-events:none}.input-action{position:absolute;top:50%;right:.25rem;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:0;border-radius:2px;background:transparent;color:var(--muted);transform:translateY(-50%);cursor:pointer}.input-action:hover{background:var(--surface-2);color:var(--ink)}.has-error .input{border-style:dashed;border-color:var(--ink)}.field-hint{margin-top:.3rem;color:var(--muted);font-size:.7rem;line-height:1.55}.field-error{margin-top:.3rem;padding-left:.4rem;border-left:2px solid var(--ink);color:var(--ink);font-size:.72rem;font-weight:600;line-height:1.55}.notice{display:flex;align-items:flex-start;gap:.6rem;padding:.75rem .85rem;border:1px solid var(--line);border-left:3px solid var(--ink);background:transparent;color:var(--ink-2);font-size:.8rem;line-height:1.65}.notice-icon{flex-shrink:0;margin-top:.1rem;color:var(--ink)}.notice-copy{min-width:0}.notice-copy strong{display:block;margin-bottom:.1rem;color:var(--ink);font-size:.82rem;font-weight:650}.notice-body p{margin:0}.notice-warning{border-left-style:dashed}.notice-danger{border-left-width:5px}.notice-success{border-left-width:4px}.notice-inline{display:inline-flex;align-items:center;gap:.3rem}.page-notice{margin-top:1rem}.home-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:1.2rem;align-items:start;margin-top:1.5rem}.recent-card{padding:clamp(1.35rem,2.4vw,1.8rem)}.recent-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}.count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;margin-left:.45rem;padding:0 .3rem;border-radius:1px;background:var(--ink);color:var(--bg);font-family:var(--font-mono);font-size:.6rem;font-weight:600;vertical-align:middle}.recent-list{display:flex;flex-direction:column;margin:.9rem 0 0;padding:0;list-style:none}.recent-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--line)}.recent-item:last-child{padding-bottom:0;border-bottom:0}.recent-main{min-width:0}.recent-title-row{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem}.recent-meta{display:flex;align-items:center;gap:.3rem;margin-top:.3rem;color:var(--muted);font-family:var(--font-mono);font-size:.64rem}.recent-actions{display:flex;flex-shrink:0;align-items:center;gap:.3rem}.recent-footnote{margin-top:.9rem;padding-top:.8rem;border-top:1px solid var(--line);color:var(--muted);font-size:.7rem;line-height:1.65}.badge{display:inline-flex;align-items:center;gap:.2rem;padding:.12rem .36rem;border:1px solid var(--line);border-radius:1px;background:transparent;color:var(--muted);font-family:var(--font-mono);font-size:.58rem;font-weight:500;line-height:1.5;white-space:nowrap}.badge-lock{border-style:dashed;border-color:var(--line-strong);color:var(--ink-2)}.badge-muted{color:var(--muted)}.badge-warm{border-color:var(--ink);background:var(--ink);color:var(--bg)}.empty-state{display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:2.1rem 1rem 1.6rem;text-align:center}.empty-state-icon{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;margin-bottom:.4rem;border:1px solid var(--line-strong);border-radius:2px;color:var(--ink-2)}.empty-state strong{font-size:.86rem;font-weight:650}.empty-state p{max-width:23rem;color:var(--muted);font-size:.76rem;line-height:1.7}.how-section{margin:clamp(3rem,6vw,5rem) 0 clamp(2.5rem,5vw,4rem);padding-top:1.5rem;border-top:1px solid var(--line-strong)}.section-heading{display:flex;flex-direction:column;gap:.15rem;margin-bottom:1.2rem}.section-heading h2{font-family:var(--font-display);font-size:clamp(1.7rem,3vw,2.3rem);font-weight:600}.steps-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line)}.step-row{padding:1rem 1.2rem 0 0;border-right:1px solid var(--line)}.step-row:last-child{padding-right:0;border-right:0}.step-number{color:var(--muted);font-family:var(--font-mono);font-size:.6rem;letter-spacing:.08em}.step-row h3{margin:.45rem 0 .25rem;font-size:.92rem;font-weight:650}.step-row p{color:var(--muted);font-size:.78rem;line-height:1.7}.site-footer{margin-top:auto;border-top:1px solid var(--line-strong)}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.5rem 0}.footer-brand{display:flex;flex-direction:column;gap:.15rem}.footer-brand strong{font-size:.84rem;font-weight:650}.footer-brand span,.site-footer p{color:var(--muted);font-family:var(--font-mono);font-size:.6rem}.room-topbar{position:sticky;top:0;z-index:30;border-bottom:1px solid var(--line-strong);background:var(--bg)}.room-topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:60px}.room-topbar-left,.room-topbar-actions{display:flex;align-items:center;gap:.55rem;min-width:0}.topbar-divider{width:1px;height:18px;margin:0 .15rem;background:var(--line)}.room-topbar-label{overflow:hidden;color:var(--muted);font-family:var(--font-mono);font-size:.66rem;text-overflow:ellipsis;white-space:nowrap}.room-main{flex:1;padding-top:clamp(1.2rem,3vw,2rem);padding-bottom:2rem}.room-main>.page-notice{max-width:980px;margin:0 auto 1rem}.state-page{display:flex;flex:1;align-items:center;justify-content:center;padding-block:3rem}.state-panel{display:flex;flex-direction:column;align-items:center;gap:.7rem;width:100%;max-width:580px;margin:clamp(2rem,6vw,4.5rem) auto;padding:clamp(1.5rem,3.5vw,2.3rem);border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);text-align:center}.state-panel-icon{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;margin-bottom:.2rem;border:1px solid var(--line-strong);border-radius:2px;background:transparent;color:var(--ink)}.state-panel-warning .state-panel-icon,.state-panel-danger .state-panel-icon{background:var(--ink);color:var(--bg)}.state-panel h1{font-family:var(--font-display);font-size:clamp(1.55rem,3.4vw,2.1rem);font-weight:600}.state-panel-description{max-width:32rem;color:var(--muted);font-size:.84rem;line-height:1.8}.state-panel-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5rem;margin-top:.8rem}.loading-panel{max-width:440px}.loading-orb{display:flex;align-items:flex-end;gap:4px;height:40px;margin-bottom:.4rem}.loading-orb span{width:4px;background:var(--ink);animation:blink 1.1s ease-in-out infinite}.loading-orb span:nth-child(1){height:16px}.loading-orb span:nth-child(2){height:30px;animation-delay:.12s}.loading-orb span:nth-child(3){height:22px;animation-delay:.24s}.prejoin-card{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(280px,.95fr);gap:clamp(1.5rem,4vw,2.5rem);max-width:980px;margin:clamp(1rem,3vw,2rem) auto;padding:clamp(1.4rem,3vw,2.2rem);border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface)}.prejoin-main{min-width:0}.prejoin-title{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:.4rem 0 .7rem;font-family:var(--font-display);font-size:clamp(1.8rem,3.6vw,2.5rem);font-weight:600}.prejoin-lead{color:var(--ink-2);font-size:.9rem;line-height:1.8}.prejoin-stats{display:flex;flex-wrap:wrap;gap:.35rem;margin:.9rem 0 1rem}.prejoin-stats span{display:inline-flex;align-items:center;gap:.28rem;padding:.24rem .45rem;border:1px solid var(--line);border-radius:2px;color:var(--muted);font-family:var(--font-mono);font-size:.62rem}.prejoin-form{display:grid;gap:.8rem;margin-top:1rem}.prejoin-links{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:.9rem}.prejoin-links a{color:var(--muted);font-size:.76rem;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}.prejoin-links a:hover{color:var(--ink);text-decoration-color:var(--ink)}.prejoin-visual{display:flex;flex-direction:column;justify-content:space-between;gap:1.5rem;min-height:300px;padding:clamp(1.2rem,2.5vw,1.6rem);border:1px solid var(--ink);border-radius:2px;background:var(--ink);color:var(--bg)}.visual-label{color:inherit;font-family:var(--font-mono);font-size:.58rem;letter-spacing:.16em;opacity:.6}.visual-code{font-family:var(--font-mono);font-size:clamp(1.8rem,3.2vw,2.5rem);font-weight:600;letter-spacing:.12em;line-height:1;word-break:break-all}.visual-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem;max-width:240px}.visual-slots span{display:block;aspect-ratio:1.7;border:1px solid currentColor;border-radius:1px;opacity:.32}.visual-slots span.is-filled{background:currentColor;opacity:.92}.visual-caption{font-family:var(--font-mono);font-size:.6rem;opacity:.6}.error-help{display:grid;gap:.2rem;margin:.5rem 0 0;padding-left:1rem;color:var(--ink-2);font-size:.76rem;line-height:1.65}.joining-panel,.reconnect-panel{display:flex;flex-direction:column;align-items:center;gap:.6rem;width:100%;max-width:600px;margin:clamp(1.5rem,5vw,3rem) auto;padding:clamp(1.5rem,3.5vw,2.3rem);border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);text-align:center}.joining-panel h1,.reconnect-panel h1{font-family:var(--font-display);font-size:clamp(1.55rem,3.4vw,2.1rem);font-weight:600}.joining-panel>p,.reconnect-panel>p{color:var(--muted);font-size:.84rem}.joining-orb{display:flex;align-items:flex-end;justify-content:center;gap:3px;width:64px;height:64px;margin-bottom:.4rem;padding:14px;border:1px solid var(--line-strong);border-radius:2px}.joining-orb span{width:4px;background:var(--ink);animation:blink 1.05s ease-in-out infinite}.joining-orb span:nth-child(1){height:14px}.joining-orb span:nth-child(2){height:26px;animation-delay:.12s}.joining-orb span:nth-child(3){height:11px;animation-delay:.24s}.joining-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.7rem;margin-top:.7rem}.reconnect-orb{display:grid;place-items:center;width:64px;height:64px;margin-bottom:.3rem;border:1px solid var(--line-strong);border-radius:2px;color:var(--ink)}.muted-note{color:var(--muted)!important;font-size:.76rem!important}.room-stage{padding:clamp(.6rem,2vw,1.2rem) 0 2rem}.stage-header{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.1rem;padding-bottom:.9rem;border-bottom:1px solid var(--line-strong)}.stage-header h1{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.25rem;font-family:var(--font-display);font-size:clamp(1.7rem,3.4vw,2.35rem);font-weight:600}.stage-stats{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem}.stat-pill{display:inline-flex;align-items:center;gap:.3rem;padding:.26rem .45rem;border:1px solid var(--line);border-radius:2px;color:var(--ink-2);font-family:var(--font-mono);font-size:.62rem;white-space:nowrap}.participant-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}.participant{--level: 0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;min-width:0;min-height:178px;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);transition:border-color .15s ease}.participant.is-speaking{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.participant-avatar{position:relative;z-index:1;display:grid;place-items:center;width:66px;height:66px;border:1px solid var(--line-strong);border-radius:50%;background:var(--avatar-bg, #111111);color:#fff;font-family:var(--font-mono);font-size:.95rem;font-weight:600;letter-spacing:.02em}.participant-avatar:after{content:"";position:absolute;inset:-5px;border:1px solid var(--ink);border-radius:50%;opacity:calc(.08 + var(--level) * .8);transform:scale(calc(1 + var(--level) * .05));transition:opacity .15s ease,transform .15s ease}.participant-avatar>span{position:relative;z-index:1}.participant.is-muted .participant-avatar{opacity:.55}.participant.is-muted .participant-avatar:after{opacity:.06}.participant-mute{position:absolute;right:-4px;bottom:-4px;z-index:2;display:grid;place-items:center;width:20px;height:20px;border:2px solid var(--surface);border-radius:2px;background:var(--ink);color:var(--bg)}.participant-meta{position:relative;z-index:1;text-align:center}.participant-meta strong{display:block;overflow:hidden;max-width:100%;font-size:.86rem;font-weight:650;text-overflow:ellipsis;white-space:nowrap}.participant-state{display:flex;align-items:center;justify-content:center;gap:.25rem;margin-top:.14rem;color:var(--muted);font-family:var(--font-mono);font-size:.6rem}.self-tag{padding:.02rem .18rem;border:1px solid var(--line);border-radius:1px;color:var(--ink-2);font-size:.54rem}.voice-bars{position:relative;z-index:1;display:flex;align-items:flex-end;gap:2px;height:12px;opacity:.3}.voice-bars span{width:2px;height:calc(20% + var(--level) * 70%);background:var(--ink);transition:height .12s ease}.voice-bars span:nth-child(2){height:calc(35% + var(--level) * 60%)}.voice-bars span:nth-child(3){height:calc(25% + var(--level) * 65%)}.voice-bars span:nth-child(4){height:calc(45% + var(--level) * 50%)}.participant.is-speaking .voice-bars{opacity:1}.participant.is-muted .voice-bars{opacity:.1}.participant-empty{border-style:dashed;background:transparent;color:var(--muted)}.empty-slot-icon{display:grid;place-items:center;width:44px;height:44px;border:1px dashed var(--line-strong);border-radius:2px}.empty-slot-icon span{position:relative;width:13px;height:1px;background:var(--line-strong)}.empty-slot-icon span:after{content:"";position:absolute;top:-6px;left:6px;width:1px;height:13px;background:var(--line-strong)}.empty-slot-text{font-family:var(--font-mono);font-size:.6rem}.empty-peers{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin-top:1rem;padding:.9rem 1rem;border:1px dashed var(--line-strong);border-radius:var(--radius);background:transparent}.empty-peers-copy{display:flex;align-items:center;gap:.7rem}.empty-peers-icon{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;flex-shrink:0;border:1px solid var(--line);border-radius:2px;color:var(--ink-2)}.empty-peers strong{font-size:.84rem;font-weight:650}.empty-peers p{margin-top:.1rem;color:var(--muted);font-size:.74rem}.room-footnote{display:flex;align-items:center;justify-content:center;gap:.3rem;margin-top:1.2rem;color:var(--muted);font-family:var(--font-mono);font-size:.6rem;text-align:center}.control-dock{display:flex;width:fit-content;max-width:100%;margin:1.4rem auto 0;overflow:hidden;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface)}.control-button{display:flex;flex-direction:column;align-items:center;gap:.18rem;min-width:86px;padding:.6rem .75rem;border:0;border-left:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font:inherit;cursor:pointer;transition:background-color .15s ease}.control-button:first-child{border-left:0}.control-button:hover{background:var(--surface-2)}.control-icon{display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--line);border-radius:2px;background:transparent}.control-label{color:var(--muted);font-family:var(--font-mono);font-size:.58rem}.mic-control .control-icon{border-color:var(--ink);background:var(--ink);color:var(--bg)}.mic-control.is-muted .control-icon{border-style:dashed;background:transparent;color:var(--ink)}.mic-control .control-label,.leave-control .control-label{color:var(--ink-2)}.leave-control{color:var(--ink)}.leave-control .control-icon{border-color:var(--line-strong)}.status-pill{display:inline-flex;align-items:center;gap:.32rem;padding:.25rem .45rem;border:1px solid var(--line-strong);border-radius:2px;background:transparent;color:var(--ink-2);font-family:var(--font-mono);font-size:.6rem;font-weight:500;line-height:1.4;white-space:nowrap}.status-dot{width:5px;height:5px;flex-shrink:0;background:currentColor}.status-online{border-color:var(--ink);background:var(--ink);color:var(--bg)}.status-pending{border-style:dashed;color:var(--ink-2)}.status-danger{border-color:var(--ink);background:transparent;color:var(--ink)}.status-danger .status-dot{background:var(--ink)}.status-offline{border-style:dotted;color:var(--muted)}.status-neutral{color:var(--muted)}.modal-backdrop{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:1.2rem;background:#0000008c;animation:fade-in .15s ease-out}.modal{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;width:min(430px,100%);padding:1.6rem;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);animation:pop-in .16s ease-out}.modal-symbol{display:grid;place-items:center;width:40px;height:40px;margin-bottom:.25rem;border:1px solid var(--line-strong);border-radius:2px;color:var(--ink)}.modal-symbol.is-danger{background:var(--ink);color:var(--bg)}.modal h2{font-family:var(--font-display);font-size:1.35rem;font-weight:600}.modal p{color:var(--muted);font-size:.83rem;line-height:1.7}.modal-actions{display:flex;gap:.5rem;width:100%;margin-top:.9rem}.modal-actions .btn{flex:1}.toast-viewport{position:fixed;bottom:calc(1.3rem + env(safe-area-inset-bottom));left:50%;z-index:200;display:flex;justify-content:center;width:min(92vw,420px);pointer-events:none;transform:translate(-50%)}.toast{display:flex;align-items:center;gap:.45rem;padding:.62rem .85rem;border:1px solid var(--ink);border-radius:2px;background:var(--ink);color:var(--bg);font-size:.78rem;line-height:1.5;animation:toast-in .18s ease-out}.toast-success,.toast-error{background:var(--ink);color:var(--bg)}.fatal-error{display:grid;place-items:center;min-height:100vh;padding:1.5rem;background:var(--bg)}.fatal-card{display:flex;flex-direction:column;align-items:center;gap:.7rem;width:min(440px,100%);padding:2rem;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);text-align:center}.fatal-mark{display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--line-strong);border-radius:2px;color:var(--ink);font-family:var(--font-mono);font-size:1.3rem;font-weight:600}.fatal-card p{color:var(--muted);font-size:.84rem}.spin{animation:spin 1.1s linear infinite}@keyframes blink{0%,to{opacity:.3;transform:scaleY(.65)}50%{opacity:1;transform:scaleY(1)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes pop-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes toast-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 1020px){.hero{grid-template-columns:minmax(0,1fr) minmax(340px,.85fr);gap:2.2rem}.home-grid{grid-template-columns:1fr}.participant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 860px){.hero{grid-template-columns:1fr;gap:2rem;padding-top:.8rem}.hero-copy{padding-top:0}.hero-title{font-size:clamp(2.6rem,8vw,3.8rem)}.create-card{max-width:620px}.prejoin-card{grid-template-columns:1fr}.prejoin-visual{min-height:220px}.steps-grid{grid-template-columns:1fr}.step-row{padding:.9rem 0;border-right:0;border-bottom:1px solid var(--line)}.step-row:last-child{border-bottom:0}.footer-inner{flex-direction:column;align-items:flex-start;gap:.5rem}}@media (max-width: 720px){:root{--header-height: 60px}.container{width:min(var(--container),calc(100% - 1.5rem))}.header-pill{display:none}.theme-toggle{width:34px;padding:0;justify-content:center}.theme-toggle span,.brand-subtitle{display:none}.home-main{padding-top:1.4rem}.hero{padding-bottom:2.4rem}.hero-title{font-size:clamp(2.45rem,9vw,3.1rem)}.hero-lead{font-size:.92rem}.hero-specs{grid-template-columns:1fr;gap:0;margin-top:1.6rem;padding-top:0;border-top:0}.hero-specs li{padding:.65rem 0;border-top:1px solid var(--line);border-left:0}.hero-specs li:first-child{border-top:1px solid var(--line-strong)}.create-card,.join-card,.recent-card{padding:1.2rem}.success-actions{grid-template-columns:1fr}.recent-item{flex-wrap:wrap;gap:.55rem}.recent-actions{width:100%;justify-content:flex-end}.room-topbar-inner{height:58px;gap:.5rem}.topbar-divider,.room-topbar-label,.room-topbar-actions .status-pill{display:none}.topbar-leave{padding-inline:.6rem}.stage-header{align-items:flex-start;flex-direction:column;gap:.6rem}.stage-stats{width:100%}.participant-grid{gap:.55rem}.participant{min-height:160px;padding:.8rem}.participant-avatar{width:56px;height:56px;font-size:.84rem}.participant-meta strong{font-size:.8rem}.participant-state{font-size:.56rem}.voice-bars{height:10px}.control-dock{position:fixed;bottom:calc(.65rem + env(safe-area-inset-bottom));left:50%;z-index:40;width:calc(100% - 1.4rem);max-width:380px;margin:0;transform:translate(-50%)}.control-button{flex:1;min-width:0;padding-inline:.3rem}.control-icon{width:35px;height:35px}.room-stage{padding-bottom:6.5rem}.room-main{padding-bottom:1rem}.room-page .site-footer{display:none}.toast-viewport{bottom:calc(6.6rem + env(safe-area-inset-bottom))}.prejoin-card{margin-top:.5rem;padding:1.2rem}.prejoin-visual{min-height:190px}.prejoin-title{font-size:1.65rem}.state-panel{padding:1.4rem 1.1rem}.state-panel-icon{width:48px;height:48px}.state-panel-actions .btn{flex:1;min-width:8.5rem}.joining-panel,.reconnect-panel{margin-top:1rem;padding:1.4rem 1.1rem}.empty-peers{align-items:flex-start;flex-direction:column}.empty-peers .btn{width:100%}.room-footnote{align-items:flex-start;padding-inline:.3rem;text-align:left}.modal{padding:1.4rem}.modal-actions{flex-direction:column}}@media (max-width: 480px){.hero-title{font-size:2.35rem}.participant{min-height:148px}.participant-avatar{width:50px;height:50px;font-size:.76rem}.recent-actions .btn{flex:1}.link-box{font-size:.66rem}.prejoin-title{font-size:1.5rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}:root{--font-mono: var(--font-sans);--font-display: var(--font-sans);--font-code: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--bg: #f5f5f3;--surface: #ffffff;--surface-2: #f1f1ee;--ink: #111111;--ink-2: #3c3c39;--muted: #777771;--line: #e2e2dd;--line-strong: #111111;--accent: #111111;--accent-soft: #efefec;--on-accent: #ffffff;--teal: #3c3c39;--teal-soft: #f1f1ee;--gold: #555550;--gold-soft: #f1f1ee;--success: #111111;--success-soft: #f1f1ee;--danger: #111111;--danger-soft: #f1f1ee;--btn-primary-bg: #111111;--btn-primary-bg-hover: #2c2c2c;--btn-primary-fg: #ffffff;--radius: 24px;--radius-sm: 12px}:root[data-theme=dark]{--bg: #0b0b0b;--surface: #151515;--surface-2: #1d1d1d;--ink: #f4f4f2;--ink-2: #c9c9c3;--muted: #8d8d87;--line: #2a2a2a;--line-strong: #f4f4f2;--accent: #f4f4f2;--accent-soft: #242424;--on-accent: #0b0b0b;--teal: #c9c9c3;--teal-soft: #1d1d1d;--gold: #b9b9b3;--gold-soft: #1d1d1d;--success: #f4f4f2;--success-soft: #1d1d1d;--danger: #f4f4f2;--danger-soft: #1d1d1d;--btn-primary-bg: #f4f4f2;--btn-primary-bg-hover: #dcdcd6;--btn-primary-fg: #0b0b0b}body{background:var(--bg)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.site-header{border-bottom-color:var(--line)}.header-inner{height:64px}.header-actions{gap:.5rem}.logo-mark{border-color:var(--line-strong);border-radius:12px}.brand-title{font-size:1.02rem;font-weight:650}.theme-toggle{min-height:36px;border-color:var(--line);border-radius:10px;background:transparent;color:var(--ink);font-family:var(--font-sans);font-size:.75rem;letter-spacing:0}.theme-toggle:hover{border-color:var(--line-strong);background:var(--surface-2);color:var(--ink)}.home-main{display:flex;flex:1;flex-direction:column;justify-content:center;padding:clamp(1.5rem,4vw,3rem) 0 clamp(2rem,4vw,3rem)}.home-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:1.1rem;align-items:start;width:100%;max-width:1040px;margin:0 auto}.home-layout .recent-card,.home-notice{grid-column:1 / -1}.eyebrow{font-family:var(--font-sans);font-size:.75rem;letter-spacing:.02em}.room-main-centered{display:flex;flex-direction:column;justify-content:center}.room-main-centered>.state-panel,.room-main-centered>.prejoin-card,.room-main-centered>.joining-panel,.room-main-centered>.reconnect-panel{margin-top:0;margin-bottom:0}.card{border-color:var(--line);border-radius:24px;background:var(--surface)}.create-card,.join-card,.recent-card{padding:clamp(1.25rem,2.5vw,1.75rem)}.create-card{border-top:1px solid var(--line)}.card-title{font-family:var(--font-sans);font-size:1.35rem;font-weight:650;letter-spacing:-.02em}.card-description{margin-top:.55rem;font-family:var(--font-sans);font-size:.88rem;line-height:1.7}.create-footnote{display:block;margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line);color:var(--muted);font-family:var(--font-sans);font-size:.75rem;letter-spacing:0}.btn{min-height:42px;border-radius:12px;font-family:var(--font-sans);font-size:.9rem}.btn-secondary{border-color:var(--line);background:transparent;color:var(--ink)}.btn-secondary:hover:not(:disabled){border-color:var(--line-strong);background:var(--surface-2);color:var(--ink)}.btn-danger-ghost{border-color:var(--line);background:transparent;color:var(--ink)}.btn-danger-ghost:hover:not(:disabled){border-color:var(--line-strong);background:var(--surface-2);color:var(--ink)}.icon-button{border-color:var(--line);border-radius:10px}.icon-button:hover:not(:disabled){border-color:var(--line-strong);background:var(--surface-2);color:var(--ink)}.text-button{font-family:var(--font-sans)}.field-label{color:var(--muted);font-family:var(--font-sans);font-size:.75rem;letter-spacing:0}.input{border-color:var(--line);border-radius:12px;background:var(--surface)}.input:hover{border-color:var(--line-strong)}.input:focus{border-color:var(--line-strong);outline:3px solid var(--accent-soft);outline-offset:1px}.input-action{border-radius:8px}.has-error .input{border-color:var(--line-strong);border-style:dashed}.switch-row{border-color:var(--line);border-radius:12px}.switch{width:40px;height:22px;padding:2px;border-color:var(--line);border-radius:999px}.switch span{width:16px;height:16px;border-radius:50%}.switch.is-on{border-color:var(--ink);background:var(--ink)}.switch.is-on span{transform:translate(20px)}.password-block{border-color:var(--line);border-radius:12px}.success-badge{border-radius:12px}.result-label{font-family:var(--font-sans);font-size:.7rem;letter-spacing:0}.room-code{border-color:var(--line);border-radius:8px;font-family:var(--font-code)}.link-box{border-color:var(--line);border-radius:10px;font-family:var(--font-code)}.link-box>span{font-family:var(--font-code)}.password-result{border-color:var(--line);border-radius:12px}.recent-meta{font-family:var(--font-sans);font-size:.74rem}.badge{border-color:var(--line);border-radius:6px;font-family:var(--font-sans);font-size:.68rem}.count-badge{border-radius:6px;font-family:var(--font-sans)}.empty-state-icon,.notice{border-color:var(--line);border-radius:12px}.notice-copy,.notice-copy strong{font-family:var(--font-sans)}.site-footer{border-top-color:var(--line)}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.25rem 0}.footer-brand{display:inline;color:var(--ink);font-family:var(--font-sans);font-size:.78rem;font-weight:600}.footer-note{color:var(--muted);font-family:var(--font-sans);font-size:.72rem}.room-topbar{border-bottom-color:var(--line)}.room-topbar-label{font-family:var(--font-sans);font-size:.78rem}.room-main{padding-top:clamp(1.1rem,3vw,1.8rem)}.state-panel{border-color:var(--line);border-radius:24px;background:var(--surface)}.state-panel-icon{border-color:var(--line);border-radius:14px}.state-panel h1,.prejoin-title,.stage-header h1,.modal h2{font-family:var(--font-sans)}.prejoin-card{border-color:var(--line);border-radius:24px}.prejoin-visual{border-radius:20px}.prejoin-stats span{border-color:var(--line);border-radius:8px;font-family:var(--font-sans);font-size:.74rem}.prejoin-links a{font-family:var(--font-sans)}.joining-panel,.reconnect-panel{border-color:var(--line);border-radius:24px}.joining-orb,.reconnect-orb{border-color:var(--line);border-radius:12px}.stage-header{border-bottom-color:var(--line)}.stat-pill{border-color:var(--line);border-radius:8px;font-family:var(--font-sans);font-size:.74rem}.participant{border-color:var(--line);border-radius:20px}.participant.is-speaking{border-color:var(--ink)}.participant-mute{border-radius:6px}.participant-state{font-family:var(--font-sans);font-size:.7rem}.empty-slot-icon{border-color:var(--line);border-radius:10px}.empty-peers{border-color:var(--line);border-radius:20px}.empty-peers-icon{border-color:var(--line);border-radius:10px}.control-dock{border-color:var(--line);border-radius:20px}.control-icon{border-radius:12px}.control-label{font-family:var(--font-sans);font-size:.7rem}.status-pill{border-color:var(--line);border-radius:8px;font-family:var(--font-sans);font-size:.72rem}.room-footnote{font-family:var(--font-sans);font-size:.72rem}.room-topbar-label{font-family:var(--font-sans)}.visual-label{font-family:var(--font-sans);font-size:.68rem;letter-spacing:.04em}.visual-code{font-family:var(--font-code)}.visual-caption{font-family:var(--font-sans);font-size:.72rem}.modal{border-color:var(--line);border-radius:24px}.modal-symbol{border-color:var(--line);border-radius:12px}.toast{border-radius:12px}.fatal-mark{border-color:var(--line);border-radius:12px}@media (max-width: 860px){.home-layout{grid-template-columns:1fr}.home-layout .recent-card{grid-column:auto}.home-main{justify-content:flex-start}}@media (max-width: 720px){.home-main{padding-top:1.1rem}.room-main-centered{justify-content:flex-start}.home-layout{gap:.85rem}.create-card,.join-card,.recent-card{border-radius:20px}.card-title{font-size:1.25rem}.footer-inner{align-items:flex-start;flex-direction:column;gap:.35rem}}