@import "https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,400;14..32,510;14..32,590&family=JetBrains+Mono:wght@400&display=swap";*,:before,:after{box-sizing:border-box}:root{--color-void:#08090a;--color-carbon:#0f1011;--color-obsidian:#161718;--color-graphite:#23252a;--color-smoke:#383b3f;--color-ash:#62666d;--color-fog:#8a8f98;--color-mist:#d0d6e0;--color-paper:#fff;--color-acid-lime:#e4f222;--color-pulse-green:#27a644;--color-coral-red:#eb5757;--font-ui:"Inter", ui-sans-serif, system-ui, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, monospace;--page-max-width:1200px;--card-padding:24px;--element-gap:8px;--radius-cards:12px;--radius-buttons:6px;--radius-badges:4px;--radius-pills:9999px;--shadow-subtle:#23252a 0 0 0 1px inset}html,body,#root{min-height:100%}body{font-family:var(--font-ui);font-feature-settings:"cv01" on, "ss03" on, "zero" on;color:var(--color-mist);background:var(--color-void);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;font-weight:400;line-height:1.5}a{color:var(--color-mist);text-decoration:none}a:hover{color:var(--color-paper)}.page{max-width:var(--page-max-width);padding:var(--card-padding);flex-direction:column;gap:24px;min-height:100vh;margin:0 auto;display:flex}.page--create{gap:32px}.create-header{flex-direction:column;gap:16px;display:flex}.create-header__main{flex-direction:column;gap:8px;display:flex}.create-header__title{letter-spacing:-.288px;color:var(--color-paper);margin:0;font-size:24px;font-weight:510;line-height:1.33}.create-header__subtitle{color:var(--color-fog);max-width:36rem;margin:0;font-size:15px;line-height:1.6}.create-body{flex-direction:column;gap:16px;width:100%;max-width:28rem;display:flex}.create-status-card{padding:16px 20px}.create-footer-note{color:var(--color-ash);margin:0;font-size:13px;line-height:1.4}.connected-card{flex-direction:column;gap:8px;display:flex}.connected-card__title{color:var(--color-paper);margin:0;font-size:15px;font-weight:510}.connected-card__text{color:var(--color-fog);margin:0;font-size:14px;line-height:1.5}.page__header{gap:var(--element-gap);flex-direction:column;display:flex}.page__section{flex-direction:column;gap:12px;display:flex}.wordmark{letter-spacing:-.704px;color:var(--color-paper);margin:0;font-size:32px;font-weight:510;line-height:1.13}.tagline{color:var(--color-fog);margin:0;font-size:15px;line-height:1.6}.tagline.mono,.mono{font-family:var(--font-mono);letter-spacing:-.013em}.section-title{color:var(--color-fog);text-transform:uppercase;letter-spacing:.04em;margin:0;font-size:13px;font-weight:400}.back-link{color:var(--color-fog);margin-bottom:4px;font-size:13px}.action-row{flex-wrap:wrap;gap:12px;display:flex}.btn{font-family:var(--font-ui);letter-spacing:-.011em;border-radius:var(--radius-buttons);cursor:pointer;border:1px solid #0000;padding:10px 16px;font-size:14px;font-weight:510;transition:opacity .15s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--color-acid-lime);color:var(--color-void)}.btn--ghost{color:var(--color-mist);border-color:var(--color-graphite);background:0 0;padding:8px 12px;font-size:13px;font-weight:400}.btn--pill{color:var(--color-mist);border-radius:var(--radius-pills);background:#ffffff0d;padding:4px 12px;font-size:12px;font-weight:400}.card{background:var(--color-carbon);border-radius:var(--radius-cards);box-shadow:var(--shadow-subtle);padding:var(--card-padding)}.badge{border-radius:var(--radius-badges);padding:2px 8px;font-size:12px;font-weight:400;display:inline-block}.badge--muted,.badge--connecting{color:var(--color-fog);background:#ffffff0d}.badge--success{color:var(--color-pulse-green);background:#27a64426}.badge--error{color:var(--color-coral-red);background:#eb575726}.connection-status{flex-direction:column;gap:10px;display:flex}.connection-status--compact{gap:0}.connection-status__row{align-items:center;gap:10px;display:flex}.connection-status__hint{color:var(--color-fog);margin:0;font-size:14px;line-height:1.5}.connection-status__route{margin:0;font-size:13px;line-height:1.5}.connection-status__route--host,.connection-status__route--srflx{color:var(--color-pulse-green)}.connection-status__route--relay{color:var(--color-fog)}.connection-status--compact .connection-status__route{margin-top:8px}.connection-status__error{color:var(--color-coral-red);margin:0;font-size:13px}.status-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.status-dot--connecting{background:var(--color-fog);animation:1.6s ease-in-out infinite pulse-dot}.status-dot--success{background:var(--color-pulse-green);box-shadow:0 0 8px #27a64480}.status-dot--error{background:var(--color-coral-red)}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.85)}}.session-share{flex-direction:column;gap:20px;width:100%;display:flex}.session-share__header{flex-direction:column;gap:14px;display:flex}.session-share__title{color:var(--color-fog);text-transform:uppercase;letter-spacing:.04em;margin:0;font-size:13px;font-weight:400}.share-tabs{background:var(--color-obsidian);border-radius:var(--radius-buttons);box-shadow:var(--shadow-subtle);align-self:flex-start;gap:4px;padding:3px;display:inline-flex}.share-tabs__tab{font-family:var(--font-ui);color:var(--color-fog);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:6px 14px;font-size:13px;font-weight:400;transition:background .15s,color .15s}.share-tabs__tab:hover{color:var(--color-mist)}.share-tabs__tab--active{color:var(--color-paper);background:#ffffff14}.session-share__code-block{border-bottom:1px solid var(--color-graphite);flex-direction:column;gap:8px;padding-bottom:4px;display:flex}.session-share__code-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.session-share__panel{flex-direction:column;align-items:flex-start;gap:10px;display:flex}.session-share__panel--qr{align-items:stretch}.session-share__label{color:var(--color-ash);text-transform:uppercase;letter-spacing:.04em;font-size:12px}.session-share__code{font-family:var(--font-mono);letter-spacing:.12em;color:var(--color-paper);font-size:28px}.url-field{border:1px solid var(--color-graphite);border-radius:var(--radius-buttons);background:#ffffff05;width:100%;padding:12px 14px}.url-field__text{font-family:var(--font-mono);color:var(--color-mist);word-break:break-all;font-size:12px;line-height:1.5;display:block}.qr-frame{border:1px solid var(--color-graphite);border-radius:var(--radius-cards);background:#ffffff05;justify-content:center;align-items:center;padding:20px;display:flex}.session-share__qr-hint{color:var(--color-ash);text-align:center;margin:0;font-size:13px;line-height:1.4}.qr-code{line-height:0}.input{border-radius:var(--radius-buttons);min-width:0;font-family:var(--font-mono);color:var(--color-mist);letter-spacing:.08em;text-transform:uppercase;background:#ffffff05;border:1px solid #ffffff14;flex:1;padding:12px 14px;font-size:14px}.input:focus{border-color:var(--color-mist);outline:none}.input::placeholder{color:var(--color-ash);text-transform:none;letter-spacing:normal}.join-form{flex-direction:column;gap:12px;display:flex}.join-form__label{color:var(--color-fog);margin:0;font-size:13px}.join-form__row{gap:12px;display:flex}.join-form__error{color:var(--color-coral-red);margin:0;font-size:13px}.create-body--session{width:100%;max-width:60rem}.session-layout{grid-template-columns:1fr minmax(15rem,18rem);align-items:stretch;gap:16px;width:100%;display:grid}.scroll-area{scrollbar-width:thin;scrollbar-color:var(--color-graphite) transparent}.scroll-area::-webkit-scrollbar{width:5px}.scroll-area::-webkit-scrollbar-track{background:0 0;margin:4px 0}.scroll-area::-webkit-scrollbar-thumb{background:var(--color-graphite);border-radius:9999px}.scroll-area::-webkit-scrollbar-thumb:hover{background:var(--color-smoke)}.file-send{border-top:1px solid var(--color-graphite);flex-direction:column;gap:6px;padding-top:8px;display:flex}.file-send__input{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.file-send__error{color:var(--color-coral-red);margin:0;font-size:13px}.file-sidebar{flex-direction:column;min-height:12rem;max-height:min(32rem,60vh);padding:0;display:flex;overflow:hidden}.file-sidebar__header{flex-shrink:0;justify-content:space-between;align-items:center;gap:8px;padding:16px 16px 12px;display:flex}.file-sidebar__title{color:var(--color-fog);text-transform:uppercase;letter-spacing:.04em;margin:0;font-size:13px;font-weight:400}.file-sidebar__count{color:var(--color-ash);border-radius:var(--radius-badges);font-variant-numeric:tabular-nums;background:#ffffff0d;padding:2px 7px;font-size:11px}.file-sidebar__scroll{overscroll-behavior:contain;flex:1;min-height:0;padding:0 10px 4px 16px;overflow:hidden auto}.file-sidebar__empty{color:var(--color-ash);margin:0;padding:8px 0 16px;font-size:14px}.file-sidebar__list{flex-direction:column;gap:8px;margin:0;padding:0 2px 0 0;list-style:none;display:flex}.file-sidebar__note{color:var(--color-ash);border-top:1px solid var(--color-graphite);flex-shrink:0;margin:0;padding:10px 16px 14px;font-size:11px;line-height:1.4}.file-list-item{border:1px solid var(--color-graphite);border-radius:var(--radius-buttons);background:#ffffff05;flex-direction:column;gap:8px;padding:10px;display:flex}.file-list-item__main{flex-direction:column;gap:4px;min-width:0;display:flex}.file-list-item__name{font-family:var(--font-mono);color:var(--color-mist);white-space:nowrap;text-overflow:ellipsis;font-size:11px;line-height:1.4;overflow:hidden}.file-list-item__meta{color:var(--color-ash);flex-wrap:wrap;align-items:center;gap:6px;font-size:11px;display:flex}.file-list-item__badge{text-transform:uppercase;letter-spacing:.04em;border-radius:var(--radius-badges);color:var(--color-fog);background:#ffffff0d;padding:1px 5px;font-size:9px}.file-list-item__badge--sent{color:var(--color-fog)}.file-list-item__badge--received{color:var(--color-mist)}.file-list-item__status{color:var(--color-fog);font-size:11px}.file-list-item__error{color:var(--color-coral-red);font-size:11px;line-height:1.3}.file-list-item__download{text-align:center;align-self:stretch;padding:5px 8px;font-size:11px;text-decoration:none}.chat-panel{flex-direction:column;gap:12px;min-height:20rem;max-height:min(32rem,60vh);padding:16px 16px 20px;display:flex;overflow:hidden}.chat-panel__title{color:var(--color-fog);text-transform:uppercase;letter-spacing:.04em;margin:0;font-size:13px;font-weight:400}.chat-panel__hint{color:var(--color-ash);margin:0;font-size:13px}.message-list{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--color-graphite) transparent;flex-direction:column;flex:1;gap:8px;min-height:0;padding:4px 6px 4px 0;display:flex;overflow:hidden auto}.message-list::-webkit-scrollbar{width:5px}.message-list::-webkit-scrollbar-track{background:0 0}.message-list::-webkit-scrollbar-thumb{background:var(--color-graphite);border-radius:9999px}.message-list::-webkit-scrollbar-thumb:hover{background:var(--color-smoke)}.message-list--empty{justify-content:center;align-items:center}.message-list__empty{color:var(--color-ash);margin:0;font-size:14px}.message-bubble{border-radius:var(--radius-buttons);max-width:85%;padding:10px 14px}.message-bubble--local{border:1px solid var(--color-graphite);background:#ffffff0f;align-self:flex-end}.message-bubble--remote{border:1px solid var(--color-graphite);background:#ffffff05;align-self:flex-start}.message-bubble__text{color:var(--color-mist);white-space:pre-wrap;word-break:break-word;margin:0;font-size:15px;line-height:1.5}.message-bubble--remote .message-bubble__text{color:var(--color-fog)}.chat-input{border-top:1px solid var(--color-graphite);flex-direction:column;gap:8px;padding-top:4px;display:flex}.chat-input__field{resize:vertical;border-radius:var(--radius-buttons);width:100%;min-height:44px;max-height:120px;font-family:var(--font-ui);color:var(--color-mist);background:#ffffff05;border:1px solid #ffffff14;padding:12px 14px;font-size:15px;line-height:1.5}.chat-input__field:focus{border-color:var(--color-mist);outline:none}.chat-input__field:disabled{opacity:.5;cursor:not-allowed}.chat-input__field::placeholder{color:var(--color-ash)}.chat-input__error{color:var(--color-coral-red);margin:0;font-size:13px}.connected-note{color:var(--color-fog);margin:0;font-size:15px}@media (width<=480px){.join-form__row{flex-direction:column}.wordmark{font-size:24px}.create-body{max-width:none}.session-share__code{font-size:22px}.chat-panel{max-height:min(28rem,55vh)}.session-layout{grid-template-columns:1fr}.file-sidebar{max-height:16rem}}