:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--paper:#f5f7ff;--surface:#fff;--surface-2:#fafbff;--ink:#13204a;--ink-soft:#5f6887;--ink-faint:#8b92a9;--ink-fainter:#aeb6cc;--blue:#2457e6;--blue-deep:#173bad;--periwinkle:#dfe6ff;--periwinkle-soft:#edf0ff;--mint:#1b9a70;--mint-soft:#ddf7ed;--mint-ink:#1c6655;--mint-ink-2:#197153;--mint-ink-3:#17604c;--mint-ink-soft:#4b7c6f;--mint-line:#bbe7d7;--line:#d8def0;--line-soft:#e3e7f2;--line-softer:#e8ebf4;--line-softest:#edf0f6;--line-strong:#b7c3eb;--line-mid:#c9d1ea;--line-chip:#d4dcfb;--line-input:#cbd2e8;--line-focus:#bdc9f8;--line-hover:#9cafea;--line-panel:#e5e8f4;--line-row:#e8ebf5;--line-card:#e1e5f1;--glass:#ffffffad;--track:#dfe4f3;--surface-hover:#f9faff;--disabled-bg:#e8ebf3;--disabled-ink:#a3aac0;--error:#b4234d;--error-soft:#fff0f3;--error-line:#f2c6d1;--shadow-card:0 10px 30px #1d2f6f14;--shadow-button:0 8px 20px #2457e633;--shadow-soft:0 2px 8px #21316617;--focus-ring:#2457e64d;--focus-ring-soft:#2457e61a;--focus-mint:#1b9a701f;--mint-ring:#1b9a7047;--mint-pulse:#1b9a7033;--display:ui-rounded, "SF Pro Rounded", "Avenir Next", "Segoe UI", sans-serif;--body:"Avenir Next", "Segoe UI", system-ui, -apple-system, sans-serif}*{box-sizing:border-box}html{background:var(--paper);min-width:320px}body{color:var(--ink);background:var(--paper);font-family:var(--body);-webkit-font-smoothing:antialiased;padding-bottom:env(safe-area-inset-bottom);margin:0}button,input{font:inherit}button,a,label{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px}label:has(input:focus-visible){outline:3px solid var(--focus-ring);outline-offset:3px}.app-shell{min-height:100svh;padding-bottom:40px}.topbar,.app-content{width:min(660px,100% - 40px);margin-inline:auto}.topbar{justify-content:space-between;align-items:center;height:80px;display:flex}.brand{color:var(--ink);font-family:var(--display);letter-spacing:-.025em;align-items:center;gap:10px;font-size:17px;font-weight:760;text-decoration:none;display:inline-flex}.brand-mark{color:#fff;background:var(--blue);width:34px;height:34px;box-shadow:none;border-radius:10px 10px 10px 4px;place-items:center;display:grid}.brand-mark svg{width:18px;height:18px}.privacy-pill{color:var(--mint-ink);background:var(--glass);border:1px solid var(--mint-ring);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:999px;align-items:center;gap:8px;padding:9px 13px;font-size:13px;font-weight:650;display:inline-flex}.privacy-pill svg{width:16px;height:16px}.app-content{padding-top:20px}.transfer-card{background:var(--surface);border:1px solid var(--line-panel);border-radius:20px;padding:24px;box-shadow:0 14px 40px #1d2f6f14}.connection-map{grid-template-columns:88px 1fr 88px;align-items:center;gap:16px;min-height:76px;padding:0 10px 16px;display:grid}.device-node{color:var(--ink-faint);white-space:nowrap;justify-items:center;gap:7px;font-size:11px;font-weight:650;display:grid}.device-node svg{box-sizing:content-box;background:var(--paper);border:1px solid var(--line);border-radius:12px;width:28px;height:28px;padding:5px}.device-node.active{color:var(--ink)}.device-node.active svg{color:var(--blue);background:var(--periwinkle-soft);border-color:var(--line-focus)}.connection-line{background:var(--line);border-radius:999px;height:2px;position:relative;overflow:hidden}.connection-line:before,.connection-line:after{content:"";background:var(--line);border-radius:50%;width:7px;height:7px;position:absolute;top:50%;transform:translateY(-50%)}.connection-line:before{left:0}.connection-line:after{right:0}.connection-line span{opacity:0;background:var(--blue);width:42px;height:100%;display:block}.stage-preparing .connection-line span,.stage-waiting .connection-line span,.stage-connecting .connection-line span{opacity:1;animation:1.7s ease-in-out infinite seek}.stage-connected .connection-line,.stage-transferring .connection-line,.stage-complete .connection-line,.stage-connected .connection-line:before,.stage-connected .connection-line:after,.stage-transferring .connection-line:before,.stage-transferring .connection-line:after,.stage-complete .connection-line:before,.stage-complete .connection-line:after{background:var(--mint)}.stage-transferring .connection-line span{opacity:1;background:var(--surface);animation:1.15s linear infinite transfer}@keyframes seek{0%{transform:translate(-50px)}to{transform:translate(320px)}}@keyframes transfer{0%{transform:translate(-50px)}to{transform:translate(320px)}}.mode-switch{background:var(--paper);border:1px solid var(--line-panel);border-radius:15px;grid-template-columns:1fr 1fr;gap:6px;padding:5px;display:grid}.mode-switch button{height:45px;color:var(--ink-soft);cursor:pointer;background:0 0;border:0;border-radius:10px;justify-content:center;align-items:center;gap:9px;font-size:14px;font-weight:690;display:inline-flex}.mode-switch button.selected{color:var(--ink);background:var(--surface);box-shadow:var(--shadow-soft)}.mode-switch svg{width:17px;height:17px}.panel-heading{border-bottom:1px solid var(--line-row);justify-content:space-between;align-items:flex-start;gap:18px;min-height:93px;padding:27px 2px 20px;display:flex}.panel-heading h2{font-family:var(--display);letter-spacing:-.035em;margin:0 0 5px;font-size:23px;line-height:1.2}.panel-heading p{max-width:420px;color:var(--ink-soft);margin:0;font-size:13px;line-height:1.45}.state-dot{color:var(--blue-deep);flex:none;align-items:center;gap:7px;margin-top:4px;font-size:11px;font-weight:720;display:inline-flex}.state-dot:before{content:"";background:var(--blue);width:7px;height:7px;box-shadow:0 0 0 4px var(--focus-ring-soft);border-radius:50%}.state-dot.online{color:var(--mint-ink-2)}.state-dot.online:before{background:var(--mint);box-shadow:0 0 0 4px var(--focus-mint)}.panel-body{gap:16px;padding:22px 2px 10px;display:grid}.drop-zone{min-height:142px;color:var(--ink-soft);background:var(--surface-2);border:1.5px dashed var(--line-strong);cursor:pointer;text-align:center;border-radius:18px;align-content:center;place-items:center;gap:4px;padding:20px;display:grid;position:relative;overflow:hidden}.drop-zone:hover{color:var(--ink);background:var(--periwinkle-soft);border-color:var(--blue)}.drop-zone .sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.drop-actions{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:10px;display:flex}.drop-zone strong{font-size:14px;font-weight:720}.drop-zone>span:last-child{font-size:12px}.drop-icon{width:33px;height:33px;color:var(--blue);background:var(--periwinkle);border-radius:10px;place-items:center;margin-bottom:4px;display:grid}.drop-icon svg{width:18px;height:18px}.file-stack,.download-list{border:1px solid var(--line-soft);border-radius:14px;max-height:164px;overflow-y:auto}.file-summary{color:var(--ink-soft);background:var(--surface-2);border-bottom:1px solid var(--line-softer);justify-content:space-between;padding:9px 12px;font-size:11px;font-weight:650;display:flex}.file-row,.download-row{min-height:57px;color:inherit;background:var(--surface);grid-template-columns:36px minmax(0,1fr) 34px;align-items:center;gap:10px;padding:8px 11px;text-decoration:none;display:grid}.file-row+.file-row,.download-row+.download-row{border-top:1px solid var(--line-softest)}.download-row:hover{background:var(--surface-2)}.file-glyph{width:34px;height:34px;color:var(--blue);background:var(--periwinkle-soft);border-radius:9px;place-items:center;display:grid}.file-glyph svg{width:17px;height:17px}.file-name{gap:1px;min-width:0;display:grid}.file-name strong{text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:670;overflow:hidden}.file-name small{color:var(--ink-soft);font-size:10px}.icon-button{width:30px;height:30px;color:var(--ink-faint);cursor:pointer;background:0 0;border:0;border-radius:8px;place-items:center;display:grid}.icon-button:hover{color:var(--error);background:var(--error-soft)}.icon-button svg,.download-icon svg{width:16px;height:16px}.download-icon{color:var(--blue)}.primary-button,.secondary-button{cursor:pointer;border-radius:13px;justify-content:center;align-items:center;gap:10px;min-height:48px;padding:0 18px;font-size:13px;font-weight:720;display:inline-flex}.primary-button{color:#fff;background:var(--blue);border:1px solid var(--blue);box-shadow:var(--shadow-button)}.primary-button:hover:not(:disabled){background:var(--blue-deep);border-color:var(--blue-deep)}.primary-button:disabled{color:var(--disabled-ink);background:var(--disabled-bg);border-color:var(--disabled-bg);box-shadow:none;cursor:not-allowed}.secondary-button{color:var(--ink);background:var(--surface);border:1px solid var(--line-input)}.secondary-button:hover:not(:disabled){color:var(--blue);border-color:var(--line-hover);background:var(--surface-hover)}.secondary-button:disabled{opacity:.55;cursor:not-allowed}.primary-button svg,.secondary-button svg{width:17px;height:17px}.full{width:100%}.error-banner{color:var(--error);background:var(--error-soft);border:1px solid var(--error-line);border-radius:11px;margin-top:16px;padding:11px 13px;font-size:12px;line-height:1.45}.invite-layout{justify-items:center;gap:14px;display:grid}.qr-frame{background:var(--surface);border:1px solid var(--line-chip);width:208px;height:208px;box-shadow:var(--shadow-card);border-radius:18px;place-items:center;padding:8px;display:grid}.qr-frame img{border-radius:8px;width:192px;height:192px;display:block}.qr-loading{border:3px solid var(--line-chip);border-top-color:var(--blue);border-radius:50%;width:48px;height:48px;animation:1.1s linear infinite pulse}.invite-hint{color:var(--ink-soft);text-align:center;margin:0;font-size:12px;line-height:1.45}.room-state{gap:18px}.room-code-block{background:var(--periwinkle-soft);border:1px solid var(--line-chip);border-radius:17px;justify-items:center;gap:5px;padding:18px;display:grid}.room-code-block>span,.room-code-block small{color:var(--ink-soft);font-size:11px}.room-code-block strong{font-family:var(--display);letter-spacing:.13em;font-size:35px;line-height:1.2}.share-actions{grid-template-columns:1.2fr 1fr;gap:10px;display:grid}.waiting-line{color:var(--ink-soft);justify-content:center;align-items:center;gap:9px;font-size:11px;display:flex}.waiting-line>span{background:var(--blue);border-radius:50%;width:7px;height:7px;animation:1.4s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}.code-field{gap:8px;display:grid}.code-field>span{font-size:12px;font-weight:700}.code-field input{width:100%;height:72px;color:var(--ink);background:var(--surface-2);border:1px solid var(--line-mid);font-family:var(--display);letter-spacing:.13em;text-align:center;text-transform:uppercase;border-radius:15px;padding:0 18px;font-size:28px;font-weight:740}.code-field input::placeholder{color:var(--ink-fainter)}.code-field small{color:var(--ink-soft);font-size:11px}.loading-state,.waiting-receiver{min-height:216px;color:var(--ink-soft);text-align:center;align-content:center;place-items:center;gap:7px;display:grid}.loading-state strong,.waiting-receiver strong{color:var(--ink);font-size:14px}.loading-state>span:last-child,.waiting-receiver>span:last-child{max-width:290px;font-size:11px;line-height:1.5}.loading-orbit{border:1px solid var(--line-chip);border-radius:50%;width:45px;height:45px;margin-bottom:6px;animation:1.5s linear infinite rotate;position:relative}.loading-orbit i{background:var(--blue);border:2px solid #fff;border-radius:50%;width:10px;height:10px;position:absolute;top:-2px;left:16px}@keyframes rotate{to{transform:rotate(360deg)}}.receive-pulse,.ready-check{width:48px;height:48px;color:var(--mint);background:var(--mint-soft);border-radius:50%;place-items:center;display:grid}.receive-pulse{box-shadow:0 0 0 0 var(--mint-pulse);margin-bottom:5px;animation:2s ease-out infinite receive-pulse}.receive-pulse svg,.ready-check svg{width:23px;height:23px}@keyframes receive-pulse{50%{box-shadow:0 0 0 13px #0000}}.safety-code{color:var(--mint-ink-3);background:var(--mint-soft);border:1px solid var(--mint-line);border-radius:13px;grid-template-columns:42px 1fr;align-items:center;gap:12px;padding:12px 14px;display:grid}.safety-code>svg{justify-self:center;width:25px;height:25px}.safety-code>div{grid-template-columns:1fr auto;align-items:baseline;gap:2px 10px;display:grid}.safety-code span,.safety-code small{font-size:10px}.safety-code strong{font-family:var(--display);letter-spacing:.08em;grid-area:1/2/3;font-size:16px}.safety-code small{color:var(--mint-ink-soft)}.ready-summary{background:var(--surface-2);border:1px solid var(--line-card);border-radius:15px;grid-template-columns:50px 1fr;align-items:center;gap:13px;padding:18px;display:grid}.ready-summary>div{gap:3px;display:grid}.ready-summary strong{font-size:13px}.ready-summary span{color:var(--ink-soft);font-size:11px}.progress-block{background:var(--surface-2);border:1px solid var(--line-card);border-radius:14px;gap:10px;padding:16px;display:grid}.progress-block>div:first-child{justify-content:space-between;align-items:center;font-size:12px;display:flex}.progress-block>div:first-child span{color:var(--ink-soft)}.progress-track{background:var(--track);border-radius:999px;height:7px;overflow:hidden}.progress-track span{background:var(--blue);border-radius:inherit;height:100%;transition:width .16s linear;display:block}.network-note{color:var(--ink-faint);text-align:center;margin:18px 3px 0;font-size:10px;line-height:1.45}.config-screen{place-content:center;justify-items:start;width:min(520px,100% - 40px);min-height:100svh;margin:auto;display:grid}.config-mark{color:#fff;background:var(--blue);border-radius:15px 15px 15px 5px;place-items:center;width:48px;height:48px;font-weight:800;display:grid}.config-screen h1{font-family:var(--display);letter-spacing:-.04em;margin:20px 0 8px}.config-screen p{color:var(--ink-soft);line-height:1.6}.config-screen code{color:var(--blue-deep);background:var(--periwinkle);border-radius:5px;padding:2px 6px}@media (max-width:650px){.topbar,.app-content{width:min(100% - 28px,560px)}.topbar{height:72px}.privacy-pill{width:35px;height:35px;color:var(--mint);white-space:nowrap;justify-content:center;gap:0;padding:0;font-size:0;overflow:hidden}.privacy-pill svg{min-width:17px}.app-content{padding-top:8px}.transfer-card{border-radius:16px;padding:18px}.connection-map{grid-template-columns:72px 1fr 72px;gap:9px;padding-inline:2px}.panel-heading{min-height:95px}.panel-heading p{max-width:250px}.state-dot{font-size:0}.room-code-block strong{font-size:29px}.share-actions,.safety-code>div{grid-template-columns:1fr}.safety-code strong{grid-area:auto}.invite-layout{gap:12px}.qr-frame{width:184px;height:184px;padding:6px}.qr-frame img{width:172px;height:172px}.drop-zone{min-height:148px;padding:22px 16px}.code-field input{letter-spacing:.12em;height:64px;min-height:64px;font-size:24px}.primary-button,.secondary-button{min-height:48px}.download-row,.file-row{min-height:52px}}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--paper:#0c1018;--surface:#151a26;--surface-2:#1a2030;--ink:#e9edf8;--ink-soft:#a7b0c7;--ink-faint:#7e879e;--ink-fainter:#6a738b;--blue:#6b8cff;--blue-deep:#a8b8ff;--periwinkle:#243156;--periwinkle-soft:#1b2438;--mint:#3dcaa0;--mint-soft:#12352c;--mint-ink:#9aecd0;--mint-ink-2:#7fe0c0;--mint-ink-3:#b6f3dc;--mint-ink-soft:#8fbfae;--mint-line:#1f4a3d;--line:#2a3348;--line-soft:#2a3348;--line-softer:#252d40;--line-softest:#222938;--line-strong:#3d4c6e;--line-mid:#3a4866;--line-chip:#3a4866;--line-input:#3a4866;--line-focus:#5a6fa0;--line-hover:#6b8cff;--line-panel:#2a3348;--line-row:#252d40;--line-card:#2a3348;--glass:#151a26d1;--track:#2a3348;--surface-hover:#1f2738;--disabled-bg:#252d3c;--disabled-ink:#6a738b;--error:#ff6b8a;--error-soft:#3a1522;--error-line:#6b2a3c;--shadow-card:0 10px 30px #00000059;--shadow-button:0 8px 20px #466eff52;--shadow-soft:0 2px 8px #00000059;--focus-ring:#6b8cff73;--focus-ring-soft:#6b8cff38;--focus-mint:#3dcaa038;--mint-ring:#3dcaa059;--mint-pulse:#3dcaa047}.drop-zone{border-width:1.5px}.primary-button:disabled,.secondary-button:disabled{opacity:.7}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.file-browse-wrap{display:inline-flex;position:relative}.file-browse-input{opacity:0;cursor:pointer;border:0;width:100%;height:100%;margin:0;padding:0;font-size:16px;position:absolute;inset:0}.paired-devices,.pairing-panel,.approval-panel{border-top:1px solid var(--line-strong);margin-top:24px;padding-top:22px}.device-section-heading{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.device-section-heading h3,.download-list h3{margin:0;font-size:16px}.device-section-heading>span,.paired-devices>p,.pairing-panel p,.approval-panel p,.room-expiry,.transfer-details{color:var(--ink-soft);font-size:13px;line-height:1.6}.device-name-field{color:var(--ink-soft);grid-template-columns:90px minmax(0,1fr);align-items:center;gap:12px;margin:16px 0;font-size:13px;display:grid}.device-name-field input{border:1px solid var(--line-input);background:var(--surface-2);width:100%;min-width:0;color:var(--ink);border-radius:9px;padding:9px 12px}.paired-device{border-top:1px solid var(--line);grid-template-columns:24px minmax(0,1fr) auto;align-items:center;column-gap:12px;padding:16px 0;display:grid}.paired-device>svg{width:22px;height:22px;color:var(--blue)}.paired-device-info{gap:3px;min-width:0;display:grid}.paired-device-info strong{overflow-wrap:anywhere;font-size:14px}.paired-device-info span{color:var(--ink-soft);font-size:12px;line-height:1.5}.device-actions,.pair-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.device-actions .secondary-button{min-height:40px;padding:8px 12px}.text-button{color:var(--ink-soft);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;padding:10px 4px;font-size:13px;text-decoration:underline}.device-invitation{background:var(--periwinkle-soft);border-radius:12px;grid-column:1/-1;margin-top:12px;padding:14px}.device-invitation p{margin:0 0 12px;font-size:14px}.pair-actions .primary-button,.pair-actions .secondary-button{flex:auto;width:auto}.safety-confirm{color:var(--ink);align-items:flex-start;gap:10px;margin:16px 0;font-size:13px;line-height:1.6;display:flex}.safety-confirm input{accent-color:var(--blue);flex-shrink:0;width:17px;height:17px;margin-top:4px}.pairing-panel>p{align-items:center;gap:10px;display:flex}.pairing-panel>p svg{width:20px;height:20px;color:var(--mint-ink);flex-shrink:0}.cancel-button{margin-top:16px}.room-expiry{text-align:center;font-variant-numeric:tabular-nums}.transfer-details{margin:12px 0}.pair-notice{overflow-wrap:anywhere}@media (max-width:440px){.device-section-heading{display:block}.device-section-heading>span{margin-top:4px;display:block}.paired-device{grid-template-columns:22px minmax(0,1fr)}.device-actions{grid-column:2;margin-top:8px}}
