:root{--color-primary: #13bd7e;--color-primary-hover: #42ca98;--color-primary-pressed: #09a56f;--color-primary-inactive: #a1e5cb;--color-primary-surface: #ecfbf5;--color-primary-surface-h: #d0f2e5;--color-text: #eceef0;--color-text-strong: #ffffff;--color-text-muted: #aab2b8;--color-text-subtle: #909aa1;--color-text-inverse: #ffffff;--color-surface: #1c1e21;--color-surface-subtle: #24272b;--color-surface-muted: #141517;--color-surface-selected: #123026;--color-surface-inverse: #0e0f11;--color-border: #313539;--color-border-strong: #474c52;--color-border-muted: #24272b;--color-border-focus: #2fd39a;--color-success: #00bf40;--color-warning: #ff9200;--color-error: #ff4242;--color-info: #2e75b6;--color-warning-surface: #2a2213;--color-warning-ink: #ffb454;--color-error-surface: #2c1512;--color-error-ink: #ff8a84;--c-t-direct-bg: var(--color-surface-selected);--c-t-direct-ink: var(--color-primary-pressed);--c-t-relay-bg: var(--color-warning-surface);--c-t-relay-ink: var(--color-warning-ink);--c-t-unreach-bg: var(--color-error-surface);--c-t-unreach-ink: var(--color-error-ink);--font: "Pretendard", "Noto Sans KR", system-ui, sans-serif;--font-display: "Poppins", "Pretendard", "Noto Sans KR", sans-serif;--tracking: -.025em;--t-xs: .82rem;--t-sm: .94rem;--t-md: 1.06rem;--t-lg: 1.3rem;--t-xl: 1.7rem;--t-2xl: clamp(2rem, 6vw, 3rem);--t-code: clamp(2.4rem, 9vw, 4rem);--s-1: 4px;--s-2: 8px;--s-3: 12px;--s-4: 16px;--s-5: 24px;--s-6: 32px;--s-8: 48px;--r-tag: 4px;--r-input: 8px;--r-btn: 10px;--r-card: 16px;--r-modal: 16px;--r-pill: 9999px;--e-surface: 0px 1px 2px 0px rgba(0, 0, 0, .12), 0px 0px 1px 0px rgba(0, 0, 0, .08), 0px 0px 1px 0px rgba(0, 0, 0, .08);--e-popover: 0px 2px 8px 0px rgba(0, 0, 0, .12), 0px 1px 4px 0px rgba(0, 0, 0, .08), 0px 0px 1px 0px rgba(0, 0, 0, .08);--e-floating: 0px 6px 12px 0px rgba(0, 0, 0, .12), 0px 4px 8px 0px rgba(0, 0, 0, .08), 0px 0px 4px 0px rgba(0, 0, 0, .08);--e-modal: 0px 16px 20px 0px rgba(0, 0, 0, .12), 0px 8px 16px 0px rgba(0, 0, 0, .08), 0px 0px 8px 0px rgba(0, 0, 0, .08);--m-fast: .15s;--m-normal: .2s;--m-slow: .3s;--m-spinner: .9s;--m-ease: cubic-bezier(.2, 0, 0, 1);--m-emph: cubic-bezier(.16, 1, .3, 1);--tap: 44px;--tap-host: 64px;color:var(--color-text);background:var(--color-surface-muted);font-family:var(--font);font-synthesis:none;letter-spacing:var(--tracking)}.klass-wb{--wb-accent: #0084ce;--wb-selected: #eff5ff;--wb-hover: #caf1ff}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{min-height:var(--tap);border-radius:var(--r-input);font:inherit}button{border:0;padding:var(--s-3) var(--s-4);border-radius:var(--r-btn);color:var(--color-surface-inverse);background:var(--color-primary);font-weight:700;cursor:pointer;transition:background var(--m-fast) var(--m-ease),border-color var(--m-fast) var(--m-ease),box-shadow var(--m-fast) var(--m-ease),color var(--m-fast) var(--m-ease),transform var(--m-fast) var(--m-ease)}button:hover{background:var(--color-primary-hover)}button:active{background:var(--color-primary-pressed);transition-duration:0s}button:not(.roster-backdrop):not(.wb-text-placement-layer):active{transform:translateY(1px)}input:focus,a:focus,.roster-sheet summary:focus,.roster-panel:focus{outline:3px solid var(--color-border-focus);outline-offset:3px}button:focus{outline:none}body.kbd-nav button:not(.room-row):not(.wb-text-placement-layer):focus{outline:3px solid var(--color-border-focus);outline-offset:3px}button:disabled{color:var(--color-text-subtle);background:var(--color-surface-muted);cursor:not-allowed;opacity:1}input{width:100%;border:1px solid var(--color-border-strong);padding:var(--s-3) var(--s-4);color:var(--color-text);background:var(--color-surface);font-size:var(--t-md)}input::placeholder{color:var(--color-text-subtle)}label{color:var(--color-text-muted);font-weight:700}h1,h2,p{margin-top:0}.app-shell{min-height:100vh}.topbar{min-height:72px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;padding:0 4vw;border-bottom:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text)}.topbar-session{grid-template-columns:auto minmax(0,1fr) auto;gap:var(--s-5)}.session-context{display:inline-grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--s-3);align-items:center;justify-content:center;min-width:0;color:var(--color-text-muted);font-size:var(--t-sm)}.session-context>span:first-child{white-space:nowrap}.session-context strong{color:var(--color-text-strong);font-family:var(--font-display);letter-spacing:.04em}.brand{display:inline-grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--s-3);align-items:center;min-height:var(--tap);justify-self:start;color:var(--color-text-strong);text-decoration:none;font-size:var(--t-lg);font-weight:800}.brand-mark{display:grid;place-items:center;width:32px;height:32px;color:var(--color-primary)}.brand-mark svg{display:block;width:100%;height:100%}.network-pill,.transport{border-radius:var(--r-pill);padding:var(--s-2) var(--s-3);font-size:var(--t-xs);font-weight:750;transition:background var(--m-normal) var(--m-ease),color var(--m-normal) var(--m-ease)}.transport{display:inline-grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--s-2);align-items:center}.transport-dot,.share-status-dot{width:8px;height:8px;border-radius:var(--r-pill);background:currentColor}.network-pill.online{color:var(--color-text);background:var(--color-surface-selected)}.network-pill.offline{color:var(--color-error-ink);background:var(--color-error-surface)}.truth-banner{padding:var(--s-3) 4vw;background:var(--color-warning-surface);color:var(--color-warning-ink)}main{width:94%;max-width:1440px;margin:0 auto;padding:4vh 0 6vh}.card{border:1px solid var(--color-border);border-radius:var(--r-card);background:var(--color-surface);box-shadow:var(--e-surface)}.landing,.join-card{width:min(620px,100%);margin:clamp(var(--s-3),2vh,var(--s-5)) auto;padding:clamp(var(--s-5),5vw,var(--s-8))}.join-checkpoint{min-height:430px}.join-intro{word-break:keep-all}.join-destination{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-4);align-items:start}.join-destination h1{margin-bottom:0}.selected-room-proof{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-2) var(--s-3);align-items:center;margin-top:var(--s-4);padding:var(--s-3);border:1px solid var(--color-primary);border-radius:var(--r-btn);color:var(--color-primary-hover);background:var(--color-surface-selected)}.selected-room-proof>span{padding:var(--s-1) var(--s-2);border:1px solid var(--color-border);border-radius:var(--r-pill);background:var(--color-surface);font-size:var(--t-xs);font-weight:750}.selected-room-proof>strong{min-width:0;overflow-wrap:break-word}.selected-room-proof>code{grid-column:1 / -1;color:var(--color-text-muted);font-family:var(--font-display);font-size:var(--t-xs);letter-spacing:.04em}.selected-room-proof>.selected-room-match-guidance{grid-column:1 / -1;min-width:0;color:var(--color-text-muted);font-size:var(--t-xs);line-height:1.5;overflow-wrap:break-word}.destination-code{font-family:var(--font-display);letter-spacing:.02em;white-space:nowrap}.destination-action{white-space:nowrap}.change-board{justify-self:end;color:var(--color-primary-hover);background:var(--color-surface-selected)}.control-icon-label{display:inline-grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--s-2);align-items:center;justify-content:center;vertical-align:middle}.field-group{display:grid;gap:var(--s-2)}.field-group label{display:grid;gap:var(--s-1)}.field-group label small,.field-hint{color:var(--color-text-subtle);font-size:var(--t-xs);font-weight:500}.field-hint{margin:0}.segmented-input{position:relative;width:100%;cursor:text}.segment-cells{display:grid;gap:var(--s-1);pointer-events:none}.segmented-input[data-length="8"] .segment-cells{grid-template-columns:repeat(8,minmax(0,1fr))}.segmented-input[data-length="6"] .segment-cells{grid-template-columns:repeat(6,minmax(0,1fr))}.segment-cell{display:grid;place-items:center;min-width:0;height:56px;overflow:hidden;border:1px solid var(--color-border-strong);border-radius:var(--r-input);color:var(--color-text-muted);background:var(--color-surface-subtle);font-family:var(--font-display);font-size:clamp(1.05rem,5vw,1.5rem);font-weight:700;letter-spacing:0;font-variant-numeric:tabular-nums;transition:border-color var(--m-fast) var(--m-ease),background var(--m-fast) var(--m-ease),box-shadow var(--m-fast) var(--m-ease)}.segment-cell.is-filled{color:var(--color-text);background:var(--color-surface)}.segmented-input:focus-within .segment-cell.is-current{border-color:var(--color-border-focus);background:var(--color-surface-selected);box-shadow:0 0 0 2px var(--color-border-focus)}.segment-cell.is-invalid,.segmented-input:focus-within .segment-cell.is-invalid{border-color:var(--color-error);color:var(--color-error-ink);background:var(--color-error-surface);box-shadow:none}.segmented-control{position:absolute;z-index:1;top:0;right:0;bottom:0;left:0;width:100%;height:100%;min-height:0;padding:0;border:0;outline:0;opacity:0;color:transparent;background:transparent;caret-color:transparent;cursor:text}.segmented-control:focus{outline:0}.segmented-input-fallback .segment-cells{display:none}.segmented-input-fallback .segmented-control{position:static;width:100%;height:auto;min-height:var(--tap);padding:var(--s-3) var(--s-4);border:1px solid var(--color-border-strong);opacity:1;color:var(--color-text);background:var(--color-surface);caret-color:auto;font-family:var(--font-display);letter-spacing:.08em}.segmented-input-fallback .segmented-control:focus{outline:3px solid var(--color-border-focus);outline-offset:3px}.landing h1,.join-card h1{color:var(--color-text-strong);font-size:var(--t-2xl);line-height:1.05}.eyebrow{margin-bottom:var(--s-2);color:var(--color-primary-pressed);font-size:var(--t-xs);font-weight:850;letter-spacing:.08em;text-transform:uppercase}.row,.stack{display:grid;gap:var(--s-3)}.row{grid-auto-flow:column;grid-auto-columns:max-content;align-items:center}.stack{margin-top:var(--s-6)}.footnote,.resume-note{color:var(--color-text-subtle);font-size:var(--t-sm)}.landing>.footnote{margin-top:var(--s-3)}.room-list-landing{width:100%;max-width:880px}.room-directory{display:grid;gap:var(--s-3);margin-top:var(--s-5)}.room-directory-message{margin:0;padding:var(--s-4);border:1px solid var(--color-border);border-radius:var(--r-btn);color:var(--color-text-muted);background:var(--color-surface-muted);line-height:1.55;word-break:keep-all}.room-directory-loading{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-3)}.room-directory-loading-label{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-3);align-items:center}.room-directory-skeleton-list{display:grid;gap:var(--s-2)}.room-directory-skeleton-row{display:grid;grid-template-columns:minmax(0,1fr) 7rem;gap:var(--s-3);align-items:center;min-width:0;min-height:var(--tap);padding:var(--s-3);border:1px solid var(--color-border);border-radius:var(--r-btn);background:var(--color-surface)}.room-directory-skeleton-copy,.room-directory-skeleton-chip{display:block;height:var(--s-3);border-radius:var(--r-pill);background:var(--color-surface-subtle);animation:session-skeleton-pulse 1.4s var(--m-ease) infinite alternate}.room-directory-skeleton-copy{width:min(72%,18rem)}.room-directory-warning{color:var(--color-warning-ink);background:var(--color-warning-surface)}.room-list{display:grid;gap:var(--s-2)}.room-row{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--s-3);align-items:center;min-width:0;padding:var(--s-4);border:1px solid var(--color-border);color:var(--color-text);background:var(--color-surface);text-align:left;box-shadow:var(--e-surface)}.room-row:hover{border-color:var(--color-primary);background:var(--color-surface-selected)}.room-row:focus{outline:3px solid var(--color-border-focus);outline-offset:3px}.room-row-copy{display:grid;gap:var(--s-1);min-width:0}.room-row-copy strong,.room-row-copy small{min-width:0;overflow-wrap:break-word}.room-row-copy small{color:var(--color-text-subtle);font-size:var(--t-xs);font-weight:500}.room-status-dot{width:10px;height:10px;border-radius:var(--r-pill);background:var(--color-text-subtle)}.room-row-checking .room-status-dot{border:2px solid var(--color-surface-selected);border-top-color:var(--color-primary);background:transparent;animation:session-status-spin var(--m-spinner) linear infinite}.room-row-reachable .room-status-dot{background:var(--color-success)}.room-row-guest-vlan .room-status-dot,.room-row-blocked .room-status-dot,.room-row-stale .room-status-dot,.room-row-registered-unreachable .room-status-dot{background:var(--color-warning)}.room-status-chip{max-width:240px;padding:var(--s-1) var(--s-2);border:1px solid var(--color-border);border-radius:var(--r-pill);color:var(--color-text-muted);background:var(--color-surface-subtle);font-size:var(--t-xs);font-weight:750;text-align:center;white-space:normal}.room-row-reachable .room-status-chip{color:var(--color-primary-hover);background:var(--color-surface-selected)}.room-match-token{color:var(--color-primary-hover)!important;font-family:var(--font-display);letter-spacing:.04em}.room-fallbacks{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-3);align-items:start;margin-top:var(--s-6);padding-top:var(--s-5);border-top:1px solid var(--color-border)}.room-fallbacks h2{grid-column:1 / -1;margin:0;font-size:var(--t-lg)}.room-qr-help{grid-column:1}.room-qr-copy{grid-column:1;margin:0;color:var(--color-text-muted);font-size:var(--t-sm);line-height:1.5;word-break:keep-all}.room-code-form{grid-column:2;grid-row:2 / span 2;margin-top:0}@media(max-width:640px){.room-row{grid-template-columns:auto minmax(0,1fr)}.room-status-chip{grid-column:2;justify-self:start;max-width:100%}.room-fallbacks{grid-template-columns:minmax(0,1fr)}.room-fallbacks h2,.room-qr-help,.room-qr-copy,.room-code-form{grid-column:1;grid-row:auto}}.error-text{color:var(--color-error-ink);font-weight:700}.room-layout{--session-bar-height: 80px;--wb-gate-safe-inset: 0px;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-4);padding-bottom:calc(var(--session-bar-height) + var(--s-6))}.stage{position:relative;min-width:0;padding:var(--s-4)}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.transport.direct{color:var(--color-text);background:var(--c-t-direct-bg)}.transport.direct .transport-dot{background:var(--color-primary-pressed)}.transport.relay{color:var(--c-t-relay-ink);background:var(--c-t-relay-bg)}.transport.unreachable{color:var(--c-t-unreach-ink);background:var(--c-t-unreach-bg)}main.main-session{width:auto;max-width:none;margin:0;padding:var(--s-3) 4vw 0}.session-shell{--stage-max-h: max(calc(100vh - 152px - var(--session-bar-height)), 320px)}.session-shell .stage{padding:var(--s-2)}.video-frame{position:relative;display:grid;place-items:center;min-height:var(--stage-max-h, 60vh);overflow:hidden;border-radius:var(--r-card);background:var(--color-surface-inverse);color:var(--color-text-subtle)}.video-frame video{width:100%;height:100%;max-height:var(--stage-max-h, 68vh);object-fit:contain}.plane-max-toggle{position:absolute;top:var(--s-3);right:var(--s-3);z-index:6;display:grid;place-items:center;width:var(--tap);height:var(--tap);min-height:var(--tap);padding:0;border-radius:var(--r-btn);color:var(--color-text-inverse);background:var(--color-surface);box-shadow:var(--e-floating)}.plane-max-toggle:hover{color:var(--color-surface-inverse);background:var(--color-primary)}.video-frame.video-frame-max:not(.plane-hidden),.whiteboard-plane.whiteboard-plane-max:not(.plane-hidden){position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;min-height:0;border-radius:0;transform:none;animation:none}.video-frame-max video{max-height:100vh}.whiteboard-plane-max .whiteboard-canvas-surface,.whiteboard-plane-max .whiteboard-canvas{max-height:100vh}.empty-stage{position:absolute;text-align:center}.session-stage-skeleton{position:absolute;top:var(--s-2);right:var(--s-2);bottom:var(--s-2);left:var(--s-2);z-index:8;display:grid;grid-template-rows:1fr auto auto;gap:var(--s-4);min-height:0;padding:var(--s-6);border-radius:var(--r-card);background:var(--color-surface-muted);pointer-events:none}.session-stage-skeleton[data-skeleton-state=closing]{animation:session-skeleton-exit var(--m-fast) var(--m-ease) both}.session-skeleton-block,.roster-skeleton-row{display:block;border-radius:var(--r-btn);background:var(--color-surface-subtle);animation:session-skeleton-pulse 1.4s var(--m-ease) infinite alternate}.session-skeleton-wide{width:100%}.session-skeleton-block:not(.session-skeleton-wide){width:48%;height:var(--s-4)}.session-skeleton-short{width:30%!important}.media-overlay{position:absolute;right:var(--s-4);bottom:var(--s-4);left:var(--s-4);padding:var(--s-4);border:1px solid var(--color-border-strong);border-radius:var(--r-btn);background:var(--color-surface);color:var(--color-text-inverse);text-align:center;box-shadow:var(--e-floating);z-index:4;animation:session-overlay-enter var(--m-fast) var(--m-emph) both}.media-overlay-track-muted{color:var(--color-text-muted)}.presenter-nameplate{position:absolute;top:var(--s-4);left:50%;z-index:4;width:max-content;max-width:calc(100% - var(--s-8));overflow:hidden;padding:var(--s-2) var(--s-4);border:1px solid var(--color-border-strong);border-radius:var(--r-pill);color:var(--color-text-inverse);background:var(--color-surface);text-overflow:ellipsis;white-space:nowrap;transform:translate(-50%);box-shadow:var(--e-floating);animation:session-overlay-enter var(--m-fast) var(--m-emph) both}.plane-hidden{display:none!important}.video-frame:not(.plane-hidden),.whiteboard-plane:not(.plane-hidden){animation:session-plane-enter var(--m-fast) var(--m-emph) both}.whiteboard-plane{position:relative;display:grid;place-items:center;min-height:var(--stage-max-h, 420px);margin:0;overflow:hidden;border:1px solid var(--color-border);border-radius:var(--r-card);background:var(--color-surface)}.wb-floating-chrome{position:absolute;top:var(--s-3);right:calc(var(--s-3) + var(--tap) + var(--s-2));left:var(--s-3);z-index:4;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-3);align-items:start;pointer-events:none}.wb-floating-chrome>*{pointer-events:auto}.presenter-nameplate~[data-plane-surface=whiteboard] .wb-floating-chrome{top:calc(var(--s-3) + var(--tap) + var(--s-2))}.wb-tool-stack{display:grid;gap:var(--s-2);justify-items:start;min-width:0;pointer-events:none}.wb-tool-stack>*{pointer-events:auto}.wb-tool-dock{display:grid;grid-template-columns:auto auto auto minmax(max-content,1fr) auto;grid-row:1;grid-column:1;gap:var(--s-2);align-items:center;min-width:0;max-width:100%;overflow-x:auto;padding:var(--s-2);border:1px solid var(--color-border-strong);border-radius:var(--r-card);background:var(--color-surface);box-shadow:var(--e-floating)}.wb-tool-dock[data-wb-dock-expanded=false]{grid-template-columns:auto}.wb-tool-dock[data-wb-dock-expanded=false]>:not(.wb-dock-toggle){display:none}.wb-tool-dock[data-wb-dock-expanded=true]:after{content:"";display:block;grid-row:1;grid-column:6;width:var(--s-2);height:1px}.wb-dock-toggle .wb-tool-icon{transition:transform var(--m-fast) var(--m-ease)}.wb-tool-dock[data-wb-dock-expanded=true] .wb-dock-toggle .wb-tool-icon{transform:rotate(180deg)}.wb-tool-buttons,.wb-history-buttons{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--s-1);align-items:center}.wb-tool-button,.wb-icon-button{min-height:var(--tap);border:1px solid var(--color-border);color:var(--color-text);background:var(--color-surface);transition:background var(--m-fast) var(--m-ease),border-color var(--m-fast) var(--m-ease),box-shadow var(--m-fast) var(--m-ease),color var(--m-fast) var(--m-ease),transform var(--m-fast) var(--m-ease)}.wb-icon-button{display:grid;place-items:center}.wb-tool-button{min-width:96px;padding:var(--s-2) var(--s-3);text-align:center}.wb-tool-content{display:inline-grid;grid-template-columns:22px auto;gap:var(--s-2);align-items:center;justify-content:center;vertical-align:middle}.wb-icon-button{width:var(--tap);padding:0}.wb-tool-button:not(:disabled):hover,.wb-icon-button:not(:disabled):hover{color:var(--color-text);background:var(--color-surface-selected)}.wb-tool-button:not(:disabled):active,.wb-icon-button:not(:disabled):active{color:var(--color-text);background:var(--color-surface-selected);transform:translateY(1px);transition-duration:0s}.wb-tool-button[aria-pressed=true]{color:var(--color-surface-inverse);background:var(--color-primary)}.wb-tool-button[aria-pressed=true]:not(:disabled):hover{color:var(--color-surface-inverse);background:var(--color-primary-hover)}.wb-tool-button:disabled,.wb-tool-button:disabled:hover,.wb-tool-button:disabled:active,.wb-icon-button:disabled,.wb-icon-button:disabled:hover,.wb-icon-button:disabled:active{color:var(--color-text-subtle);background:var(--color-surface-muted);box-shadow:none;transform:none}.wb-tool-icon{width:22px;height:22px;transition:color var(--m-fast) var(--m-ease)}.wb-sync-status .wb-tool-icon{width:16px;height:16px}.wb-color-control,.wb-width-control{display:grid;gap:var(--s-2);align-items:center;min-height:56px;padding:0 var(--s-2);color:var(--color-text-muted);font-size:var(--t-sm)}.wb-color-control{grid-template-columns:max-content 56px}.wb-width-control{grid-template-columns:max-content 180px}.wb-color-control input[type=color]{width:56px;min-width:56px;height:56px;padding:var(--s-1);border-color:var(--color-border-strong);background:var(--color-surface)}.wb-color-control input[type=color]:focus,.wb-width-control input[type=range]:focus{outline:none}body.kbd-nav .wb-color-control input[type=color]:focus,body.kbd-nav .wb-width-control input[type=range]:focus{outline:3px solid var(--color-border-focus);outline-offset:3px}.wb-width-control input[type=range]{width:180px;min-width:180px;min-height:var(--tap);padding:0;border:0;background:transparent;-webkit-appearance:none}.wb-width-control input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:var(--r-pill);background:var(--color-border-strong)}.wb-width-control input[type=range]::-webkit-slider-thumb{width:24px;height:24px;margin-top:-8px;border:2px solid var(--color-surface);border-radius:var(--r-pill);background:var(--color-primary);box-shadow:var(--e-surface);transition:box-shadow var(--m-fast) var(--m-ease),transform var(--m-fast) var(--m-ease);-webkit-appearance:none}.wb-width-control input[type=range]:active::-webkit-slider-thumb{transform:scale(1.15);box-shadow:var(--e-floating)}.wb-width-control input[type=range]::-moz-range-track{height:8px;border-radius:var(--r-pill);background:var(--color-border-strong)}.wb-width-control input[type=range]::-moz-range-thumb{width:24px;height:24px;border:2px solid var(--color-surface);border-radius:var(--r-pill);background:var(--color-primary);box-shadow:var(--e-surface);transition:box-shadow var(--m-fast) var(--m-ease),transform var(--m-fast) var(--m-ease)}.wb-width-control input[type=range]:active::-moz-range-thumb{transform:scale(1.15);box-shadow:var(--e-floating)}.whiteboard-canvas-stage{position:relative;overflow:hidden;text-align:center}.whiteboard-canvas-surface{position:relative;display:inline-block;max-width:100%;max-height:var(--stage-max-h, 68vh);vertical-align:top}button.wb-text-placement-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:block;width:100%;height:100%;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;cursor:text;touch-action:none}button.wb-text-placement-layer:hover{background:transparent}button.wb-text-placement-layer:active{background:transparent;transform:none}button.wb-text-placement-layer:focus{outline:3px solid var(--wb-accent);outline-offset:-3px}button.wb-text-fallback{min-height:var(--tap);padding:var(--s-2) var(--s-3);color:var(--color-surface-inverse);background:var(--color-primary);box-shadow:var(--e-surface);animation:wb-text-mode-enter var(--m-fast) var(--m-emph) both}button.wb-text-fallback:hover{background:var(--color-primary-hover)}.wb-text-placement-hint{position:absolute;top:50%;left:50%;width:max-content;max-width:calc(100% - var(--s-8));padding:var(--s-3) var(--s-4);border-radius:var(--r-pill);color:var(--color-text-inverse);background:var(--color-surface-inverse);font-weight:700;transform:translate(-50%,-50%);box-shadow:var(--e-floating);pointer-events:none;animation:wb-text-mode-enter var(--m-fast) var(--m-emph) both}.wb-text-placer{position:absolute;z-index:5;display:grid;grid-template-columns:minmax(120px,1fr) auto auto;gap:var(--s-2);align-items:center;width:280px;max-width:calc(100% - var(--s-4));padding:var(--s-2);border:2px solid var(--wb-accent);border-radius:var(--r-btn);background:var(--color-surface);box-shadow:var(--e-popover);transform-origin:top left;animation:wb-placer-enter var(--m-normal) var(--m-emph) both}.wb-text-placer input,.wb-text-placer button{min-height:var(--tap)}.wb-text-placer input{min-width:0;border-color:var(--wb-accent);caret-color:var(--wb-accent)}.wb-text-placer button[type=submit]{color:var(--color-surface-inverse);background:var(--color-primary)}.wb-text-placer button[type=submit]:hover{color:var(--color-surface-inverse);background:var(--color-primary-hover)}.wb-status{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;grid-row:1;grid-column:2;gap:var(--s-2);align-items:center;padding:var(--s-2) var(--s-3);border:1px solid var(--color-border-strong);border-radius:var(--r-pill);color:var(--color-text-muted);background:var(--color-surface);box-shadow:var(--e-surface);font-size:var(--t-sm)}.wb-page-status{font-family:var(--font-display);font-variant-numeric:tabular-nums;color:var(--color-text);font-weight:700;animation:wb-page-tick var(--m-fast) var(--m-emph) both}.wb-sync-status{display:grid;grid-template-columns:14px auto;gap:var(--s-1);align-items:center}.wb-sync-indicator{display:grid;place-items:center;width:14px;min-width:14px;animation:wb-sync-swap var(--m-fast) var(--m-emph) both}.wb-sync-connected .wb-tool-icon{color:var(--color-success)}.wb-sync-spinner{width:14px;height:14px;border:2px solid var(--color-warning-surface);border-top-color:var(--color-warning);border-radius:var(--r-pill);animation:wb-sync-spin var(--m-spinner) linear infinite}.wb-gate-chips{position:absolute;right:var(--s-3);bottom:calc(var(--s-3) + var(--wb-gate-safe-inset));left:var(--s-3);z-index:4;display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--s-2);justify-content:center;overflow-x:auto}.wb-gate-chip{display:grid;grid-template-columns:auto max-content;gap:var(--s-2);align-items:center;min-height:var(--tap);padding:var(--s-2) var(--s-3);border:1px solid var(--color-border);border-radius:var(--r-pill);background:var(--color-warning-surface);color:var(--color-warning-ink);box-shadow:var(--e-surface);font-weight:700;white-space:nowrap}.wb-gate-chip[data-wb-gate-state=open]{animation:session-overlay-enter var(--m-fast) var(--m-emph) both,wb-gate-chip-enter var(--m-normal) var(--m-emph) both}.wb-gate-chip[data-wb-gate-state=closing]{pointer-events:none;animation:wb-gate-chip-exit var(--m-fast) var(--m-ease) both}.whiteboard-canvas{display:block;width:auto;height:auto;max-width:100%;max-height:var(--stage-max-h, 68vh);margin:0 auto;background:var(--color-surface);touch-action:none}.status-rail{display:grid;gap:var(--s-3)}.status-rail:empty{display:none}.status-rail[data-status-state=closing]{animation:session-rail-exit var(--m-fast) var(--m-ease) both;pointer-events:none}.connection-banner,.recovery-card{margin:0;padding:var(--s-4);border-radius:var(--r-card);background:var(--color-warning-surface);color:var(--color-warning-ink)}.connection-banner,.recovery-card,.lna-prompt-callout{animation:session-rail-enter var(--m-fast) var(--m-emph) both}.connection-banner{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-2);align-items:center;justify-content:start}.connection-banner-copy{min-width:0;overflow-wrap:break-word;white-space:normal}.connection-spinner{box-sizing:border-box;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:var(--r-pill);animation:session-status-spin var(--m-spinner) linear infinite}.connection-banner-reconnect-escalated{border:2px solid var(--color-warning);font-weight:700;box-shadow:var(--e-surface)}.media-status{background:var(--color-surface-selected);color:var(--color-text)}.lna-prompt-callout{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-3);align-items:center;background:var(--color-surface-selected);color:var(--color-text)}.lna-callout-icon,.lna-illustration-slot{display:grid;place-items:center;color:var(--color-primary-pressed)}.lna-prompt-callout>span:last-child{display:grid;gap:var(--s-1)}.lna-prompt-callout small{color:var(--color-text-muted);font-size:var(--t-sm)}.lna-recovery-card{display:grid;grid-template-columns:80px minmax(0,1fr);gap:var(--s-4);align-items:start}.lna-illustration-slot{width:80px;height:80px;border-radius:var(--r-card);background:var(--color-surface)}.lna-recovery-copy{min-width:0}.lna-recovery-copy .eyebrow{display:block}.lna-recovery-copy h2{color:var(--color-error-ink)}.lna-recovery-copy ol{display:grid;gap:var(--s-2);margin:0;padding-left:var(--s-5)}.lna-recovery-card button{grid-column:2;justify-self:start}.recovery-card{background:var(--color-error-surface);color:var(--color-error-ink)}.bottom-bar{position:fixed;right:0;bottom:0;left:0;z-index:20;display:grid;grid-template-columns:minmax(220px,360px) minmax(160px,1fr) auto auto;gap:var(--s-4);align-items:center;min-height:var(--session-bar-height);padding:var(--s-3) 4vw;border-top:1px solid var(--color-border-strong);background:var(--color-surface);box-shadow:var(--e-popover);transition:background var(--m-normal) var(--m-ease),border-color var(--m-normal) var(--m-ease),box-shadow var(--m-normal) var(--m-ease)}.bottom-bar-sharing{border-top-color:var(--color-primary);background:var(--color-surface-selected);animation:session-share-bar-enter var(--m-normal) var(--m-emph) both}.bottom-bar-critical-notice{z-index:31}.session-icon{width:20px;height:20px}.plane-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-1);max-width:360px;padding:var(--s-1);border:1px solid var(--color-border-strong);border-radius:var(--r-pill);background:var(--color-surface-muted)}.plane-switch button,.share-action-row button,.roster-sheet summary,.leave-control{min-height:var(--tap);padding:var(--s-2) var(--s-3);text-align:center;white-space:nowrap}.plane-switch button{border-radius:var(--r-pill);color:var(--color-text-muted);background:transparent}.plane-switch button:hover{color:var(--color-text);background:transparent}.plane-switch button[aria-pressed=true]{color:var(--color-surface-inverse);background:var(--color-primary)}.plane-switch button[aria-pressed=true]:hover{color:var(--color-surface-inverse);background:var(--color-primary-hover)}.share-control-slot{position:relative;display:grid;justify-content:center;min-width:0}.share-action-row{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--s-2);align-items:center;justify-content:center}.share-action-row:empty{min-height:var(--tap)}.stop-share-confirm{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--s-2);align-items:center;padding:var(--s-1);border:1px solid var(--color-error);border-radius:var(--r-btn);color:var(--color-error-ink);background:var(--color-error-surface);box-shadow:var(--e-surface);animation:session-confirm-enter var(--m-fast) var(--m-emph) both}.stop-share-confirm>span{padding:0 var(--s-2);font-size:var(--t-sm);font-weight:700}.share-status-chip{position:absolute;bottom:calc(100% + var(--s-4));left:50%;z-index:22;display:grid;grid-template-columns:auto max-content;gap:var(--s-2);align-items:center;width:max-content;max-width:88vw;padding:var(--s-3) var(--s-4);border:1px solid var(--color-border-strong);border-radius:var(--r-btn);transform:translate(-50%);box-shadow:var(--e-floating);animation:session-overlay-enter var(--m-fast) var(--m-emph) both}.share-status-detail{grid-column:1 / -1;max-width:min(420px,80vw);color:inherit;font-size:var(--t-sm);font-weight:500;white-space:normal}.share-status-pending-approval{color:var(--color-warning-ink);background:var(--color-warning-surface);opacity:0;animation:session-pending-reveal var(--m-fast) var(--m-emph) var(--m-fast) both}.share-status-pending-approval .share-status-dot{box-sizing:border-box;border:2px solid currentColor;border-right-color:transparent;background:transparent;animation:session-status-spin var(--m-spinner) linear infinite}.share-status-needs-gesture,.share-status-selecting,.share-status-active{color:var(--color-text);background:var(--color-surface-selected)}.share-status-needs-gesture .share-status-dot,.share-status-selecting .share-status-dot,.share-status-active .share-status-dot{background:var(--color-primary-pressed)}.share-status-selecting .share-status-dot{box-sizing:border-box;border:2px solid var(--color-primary-pressed);border-right-color:transparent;background:transparent;animation:session-status-spin var(--m-spinner) linear infinite}.share-status-active .share-status-dot{animation:session-presenter-pulse 1.8s var(--m-ease) infinite}.share-status-error{color:var(--color-error-ink);background:var(--color-error-surface)}.share-primary{color:var(--color-surface-inverse);background:var(--color-primary)}.share-primary:hover,.share-primary:active{background:var(--color-primary-pressed)}button.share-primary:active{color:var(--color-surface-inverse);background:var(--color-primary-pressed)}.roster-sheet{position:relative}.roster-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:22;display:none;width:100%;height:100%;padding:0;border:0;border-radius:0;background:var(--color-surface-inverse);opacity:.55;cursor:default}button.roster-backdrop:active{background:var(--color-surface-inverse);transform:none}.roster-sheet[open] .roster-backdrop{display:block;animation:session-backdrop-enter var(--m-normal) var(--m-emph) both}.roster-sheet[data-roster-state=closing] .roster-backdrop{animation:session-backdrop-exit var(--m-normal) var(--m-ease) both;pointer-events:none}.roster-sheet summary{border:1px solid var(--color-border-strong);border-radius:var(--r-btn);color:var(--color-text-muted);background:var(--color-surface);font-weight:700;cursor:pointer;list-style:none}.roster-sheet summary::-webkit-details-marker{display:none}.roster-sheet summary:hover{color:var(--color-text);background:var(--color-surface-selected)}.roster-chevron{transition:transform var(--m-fast) var(--m-ease)}.roster-sheet[open] .roster-chevron{transform:rotate(180deg)}.roster-more-icon,.roster-label-narrow{display:none}button.leave-control{color:var(--color-surface-inverse);background:var(--color-error)}button.leave-control:hover,button.leave-control:active{color:var(--color-surface-inverse);background:var(--color-error-ink)}.secondary{color:var(--color-text-muted);background:var(--color-surface-subtle)}button.secondary:hover,button.secondary:active{color:var(--color-text);background:var(--color-surface-selected)}.danger,button.secondary.danger{color:var(--color-surface-inverse);background:var(--color-error)}button.danger:hover,button.secondary.danger:hover,button.danger:active,button.secondary.danger:active{color:var(--color-surface-inverse);background:var(--color-error-ink)}.roster-panel{position:fixed;right:4vw;bottom:calc(var(--session-bar-height) + var(--s-3));z-index:23;width:min(360px,92vw);max-height:60vh;overflow:auto;padding:var(--s-5);border-color:var(--color-border-strong);box-shadow:var(--e-modal)}.roster-sheet[open] .roster-panel{animation:session-roster-enter var(--m-normal) var(--m-emph) both}.roster-sheet[data-roster-state=closing] .roster-panel{animation:session-roster-exit var(--m-normal) var(--m-ease) both;pointer-events:none}.roster ul{display:grid;gap:var(--s-2);margin:0;padding:0;list-style:none}.roster-loading{display:grid;gap:var(--s-2);color:var(--color-text-muted)}.roster-skeleton-row{height:var(--tap)}.roster li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--s-3);align-items:center;padding:var(--s-3);border-radius:var(--r-btn);background:var(--color-surface-muted)}.avatar{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r-pill);background:var(--color-surface-selected);color:var(--color-primary-hover);font-weight:800}.roster li span:last-child{display:grid;min-width:0}.roster-badges{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;gap:var(--s-2);justify-content:start}.roster strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.roster small{color:var(--color-text-muted)}.roster .presenter-badge,.roster .verified-board-badge{color:var(--color-primary-pressed);font-weight:700}.auto-focus-toast{position:absolute;bottom:var(--s-5);left:50%;z-index:6;width:max-content;max-width:86%;padding:var(--s-3) var(--s-4);border:1px solid var(--color-border-strong);border-radius:var(--r-btn);color:var(--color-text-inverse);background:var(--color-surface-inverse);text-align:center;opacity:0;transform:translate(-50%);box-shadow:var(--e-floating);pointer-events:none}.auto-focus-toast-ready{animation:session-auto-focus-toast 4s var(--m-emph) forwards}@keyframes session-auto-focus-toast{0%{opacity:0;transform:translate(-50%,var(--s-2))}5%,92%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,calc(0px - var(--s-1)))}}@keyframes session-plane-enter{0%{opacity:0;transform:translateY(var(--s-1))}to{opacity:1;transform:translateY(0)}}@keyframes session-overlay-enter{0%{opacity:0}to{opacity:1}}@keyframes session-pending-reveal{0%{opacity:0}to{opacity:1}}@keyframes session-status-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes session-presenter-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.82)}}@keyframes session-share-bar-enter{0%{opacity:.88}to{opacity:1}}@keyframes session-confirm-enter{0%{opacity:0;transform:translateY(var(--s-1))}to{opacity:1;transform:translateY(0)}}@keyframes session-backdrop-enter{0%{opacity:0}to{opacity:.55}}@keyframes session-backdrop-exit{0%{opacity:.55}to{opacity:0}}@keyframes session-roster-enter{0%{opacity:0;transform:translate(var(--s-4))}to{opacity:1;transform:translate(0)}}@keyframes session-roster-exit{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(var(--s-4))}}@keyframes session-skeleton-pulse{0%{opacity:.48}to{opacity:.92}}@keyframes session-rail-enter{0%{opacity:0;transform:translateY(calc(0px - var(--s-1)))}to{opacity:1;transform:translateY(0)}}@keyframes session-rail-exit{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(calc(0px - var(--s-1)))}}@keyframes session-skeleton-exit{0%{opacity:1}to{opacity:0}}@media(max-width:820px){.stage{padding:var(--s-2)}.topbar-session{gap:var(--s-2)}.topbar-session .brand>span:last-child{display:none}.session-context{grid-auto-flow:row;gap:var(--s-1);justify-items:center;font-size:var(--t-xs)}.room-layout{--session-bar-height: 176px;--wb-gate-safe-inset: calc(var(--session-bar-height) + var(--s-4))}.bottom-bar{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-2);padding:var(--s-2) var(--s-3)}.plane-switch{grid-column:1 / -1;max-width:none}.share-control-slot{grid-column:1 / span 2;justify-content:stretch}.share-action-row{grid-auto-flow:row;grid-auto-columns:minmax(0,1fr);width:100%}.share-action-row button{width:100%}.stop-share-confirm{grid-auto-flow:row;grid-auto-columns:minmax(0,1fr)}.roster-sheet{grid-column:3;justify-self:stretch}.roster-sheet summary,.leave-control{width:100%;padding-right:var(--s-1);padding-left:var(--s-1);font-size:var(--t-xs)}.leave-control{grid-column:4}.roster-chevron{display:none}.roster-panel{right:var(--s-3);left:var(--s-3);width:auto}.share-status-chip{bottom:calc(100% + var(--tap) + var(--s-6));left:0;max-width:94vw;transform:none}.wb-floating-chrome{grid-template-columns:1fr}.wb-tool-dock{grid-row:1;grid-column:1}.wb-status{grid-row:2;grid-column:1;justify-self:start}.wb-gate-chips{justify-content:start}.join-destination,.lna-recovery-card{grid-template-columns:1fr}.change-board,.lna-recovery-card button{grid-column:1;justify-self:start}}@media(max-width:520px){main.main-session{padding:var(--s-3) var(--s-2) 0}.whiteboard-canvas-surface,.whiteboard-canvas{max-height:none}.plane-switch .control-label,.share-primary .control-label,.leave-control .control-label,.roster-label-wide,.roster-chevron{display:none}[data-session-action=start-capture] .control-label,.roster-more-icon,.roster-label-narrow{display:inline}.presenter-nameplate{top:var(--s-2);max-width:calc(100% - var(--s-4));font-size:var(--t-sm)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}.auto-focus-toast-ready{animation:session-auto-focus-toast-reduced 4s step-end both!important}.share-status-pending-approval{opacity:1;animation:none!important}.share-status-pending-approval .share-status-dot,.share-status-selecting .share-status-dot,.share-status-active .share-status-dot,.connection-banner,.connection-spinner,.room-row-checking .room-status-dot,.bottom-bar-sharing,.roster-sheet[open] .roster-panel,.roster-sheet[open] .roster-backdrop,.recovery-card,.lna-prompt-callout,.video-frame:not(.plane-hidden),.whiteboard-plane:not(.plane-hidden),.media-overlay,.presenter-nameplate,.share-status-chip:not(.share-status-pending-approval),.stop-share-confirm{animation:none!important}.status-rail[data-status-state=closing]{animation:session-rail-exit-reduced 1ms linear both!important}.session-stage-skeleton[data-skeleton-state=closing]{animation:session-skeleton-exit-reduced 1ms linear both!important}.roster-sheet[data-roster-state=closing] .roster-backdrop{animation:session-backdrop-exit-reduced 1ms linear both!important}.roster-sheet[data-roster-state=closing] .roster-panel{animation:session-roster-exit-reduced 1ms linear both!important}.session-skeleton-block,.roster-skeleton-row,.room-directory-skeleton-copy,.room-directory-skeleton-chip,.wb-sync-spinner,button.wb-text-fallback,.wb-text-placement-hint,.wb-text-placer,.wb-page-status,.wb-sync-indicator,.wb-gate-chip[data-wb-gate-state=open]{animation:none!important}.wb-gate-chip[data-wb-gate-state=closing]{animation:wb-gate-chip-exit-reduced 1ms linear both!important}.wb-sync-spinner{border-color:var(--color-warning);border-right-color:transparent}}@keyframes wb-sync-spin{to{transform:rotate(360deg)}}@keyframes wb-text-mode-enter{0%{opacity:0}to{opacity:1}}@keyframes wb-placer-enter{0%{opacity:0;transform:translateY(var(--s-1))}to{opacity:1;transform:translateY(0)}}@keyframes wb-gate-chip-enter{0%{transform:translateY(var(--s-1))}to{transform:translateY(0)}}@keyframes wb-gate-chip-exit{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(var(--s-1))}}@keyframes wb-page-tick{0%{opacity:0;transform:translateY(var(--s-1))}to{opacity:1;transform:translateY(0)}}@keyframes wb-sync-swap{0%{opacity:0}to{opacity:1}}@keyframes wb-gate-chip-exit-reduced{0%,to{opacity:0;transform:none}}@keyframes session-auto-focus-toast-reduced{0%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%)}}@keyframes session-roster-exit-reduced{0%,to{opacity:0;transform:none}}@keyframes session-rail-exit-reduced{0%,to{opacity:0;transform:none}}@keyframes session-skeleton-exit-reduced{0%,to{opacity:0}}@keyframes session-backdrop-exit-reduced{0%,to{opacity:0}}button:disabled,button:disabled:hover,button:disabled:active,.plane-switch button:disabled,.plane-switch button:disabled:hover,.plane-switch button:disabled:active,button.secondary.danger:disabled,button.secondary.danger:disabled:hover,button.secondary.danger:disabled:active{color:var(--color-text-subtle);background:var(--color-surface-muted);box-shadow:none;opacity:1;transform:none}