:root{--bg: #000;--surface: #050505;--surface-2: #0d0d0d;--ink: #fff;--muted: #a3a3a3;--quiet: #6f6f6f;--border: #262626;--border-strong: #f5f5f5;--mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;--sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;color:var(--ink);background:var(--bg);font-family:var(--sans);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{min-width:320px;min-height:100vh;margin:0;color:var(--ink);background:var(--bg)}button,input,textarea{font:inherit}::selection{color:#000;background:#fff}.app-shell{display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px;width:100%;height:100vh;height:100dvh;overflow:hidden;padding:16px;background:#000}.topbar,.workspace{width:min(100%,1500px);margin-inline:auto}.topbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;min-height:52px}.brand{display:flex;align-items:center;min-width:0;gap:12px}.brand-mark{display:inline-grid;width:38px;height:38px;flex:0 0 auto;place-items:center;color:#000;background:#fff;border:1px solid #fff;border-radius:4px}.brand h1{margin:0;overflow:hidden;color:var(--ink);font-size:22px;font-weight:740;line-height:1.05;letter-spacing:0;text-overflow:ellipsis;white-space:nowrap}.brand p{margin:4px 0 0;overflow:hidden;color:var(--muted);font-size:12px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.offline-pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:36px;padding:0 12px;color:var(--ink);background:transparent;border:1px solid var(--border);border-radius:4px;font-size:12px;font-weight:680;white-space:nowrap}.mode-tabs{display:grid;grid-template-columns:1fr 1fr;width:max-content;padding:3px;background:#000;border:1px solid var(--border);border-radius:999px;overflow:hidden}.mode-tabs button,.primary-button,.secondary-button,.icon-button,.play-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:4px;font-family:inherit;font-weight:720;line-height:1;cursor:pointer;transition:background .12s ease,color .12s ease,border-color .12s ease,opacity .12s ease}.mode-tabs button{min-width:118px;min-height:34px;padding:0 12px;color:#d7d7d7;background:#000;border-radius:999px;font-size:12px;white-space:nowrap}.mode-tabs button:last-child{border-right:0}.mode-tabs button.active{color:#000;background:#fff}.workspace{display:grid;min-height:0;height:100%;gap:12px}.sender-view{grid-template-columns:minmax(330px,.88fr) minmax(430px,1.12fr)}.receiver-view{grid-template-columns:minmax(420px,1fr) minmax(360px,.82fr)}.panel{display:flex;min-width:0;min-height:0;overflow:hidden;flex-direction:column;padding:12px;color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:6px}.section-title{display:flex;align-items:center;flex:0 0 auto;gap:8px;min-height:28px;margin-bottom:10px;color:var(--ink)}.section-title svg{flex:0 0 auto}.section-title>div{min-width:0}.section-title h2{margin:0;color:var(--ink);font-size:16px;font-weight:740;line-height:1.1;letter-spacing:0}.section-title p{margin:2px 0 0;overflow:hidden;color:var(--muted);font-size:12px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}.section-meter{margin-left:auto;color:var(--muted);font:700 12px/1 var(--mono);white-space:nowrap}.drop-zone{display:grid;flex:0 0 auto;min-height:88px;place-items:center;gap:6px;padding:12px;color:var(--muted);text-align:center;background:var(--surface-2);border:1px dashed #4a4a4a;border-radius:4px}.drop-zone.dragging{color:var(--ink);background:#141414;border-color:#fff}.drop-zone strong{color:var(--ink);font-size:14px}.drop-zone span{color:var(--muted);font-size:12px}.field{display:grid;flex:0 0 auto;gap:6px;margin-top:10px}.field span{color:var(--muted);font-size:11px;font-weight:720}.field input,.field textarea{width:100%;box-sizing:border-box;color:var(--ink);background:#000;border:1px solid var(--border);border-radius:4px;font:13px/1.45 var(--mono);outline:none;transition:border-color .12s ease,background .12s ease}.field input{height:36px;padding:0 10px}.text-field{flex:1 1 0;min-height:0}.field textarea{height:100%;min-height:0;padding:10px;resize:none}.field.received{flex:1 1 0;min-height:0}.field input:focus,.field textarea:focus{background:#050505;border-color:#fff}.primary-button,.secondary-button,.play-button{flex:0 0 auto;min-height:36px;padding:0 12px;font-size:13px}.primary-button{width:100%;margin-top:10px;color:#000;background:#fff;border:1px solid #fff}.secondary-button,.icon-button{color:var(--ink);background:transparent;border:1px solid var(--border)}.play-button{min-width:118px;color:#000;background:#fff;border:1px solid #fff}.icon-button{width:36px;height:36px;flex:0 0 auto}button:hover:not(:disabled){color:#000;background:#e8e8e8;border-color:#e8e8e8}.secondary-button:hover:not(:disabled),.icon-button:hover:not(:disabled){color:#000;background:#fff;border-color:#fff}button:disabled{cursor:not-allowed;opacity:.35}.qr-stage,.camera-frame,.empty-result{min-height:0;background:#000;border:1px solid var(--border);border-radius:4px}.qr-stage{display:grid;position:relative;flex:1 1 auto;overflow:hidden;place-items:center;padding:12px}.qr-stage img{position:absolute;top:12px;right:12px;bottom:12px;left:12px;width:calc(100% - 24px);height:calc(100% - 24px);max-width:none;max-height:none;box-sizing:border-box;background:transparent;border:0;border-radius:2px;object-fit:contain}.empty-qr,.empty-result,.camera-placeholder{display:grid;place-items:center;gap:10px;color:var(--quiet);text-align:center}.empty-qr{width:min(100%,360px);max-height:100%;aspect-ratio:1;border:1px dashed #3d3d3d;border-radius:4px}.qr-error{position:absolute;right:12px;bottom:12px;max-width:calc(100% - 24px);padding:9px 10px;color:var(--ink);background:#000;border:1px solid #fff;border-radius:4px;font-size:12px}.progress-block{flex:0 0 auto;margin-top:10px}.progress-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;color:var(--muted);font-size:12px}.progress-row strong{color:var(--ink)}.progress-track{height:7px;overflow:hidden;background:#1d1d1d;border:1px solid var(--border);border-radius:999px}.progress-track span,.progress-track.receiver span{display:block;height:100%;background:#fff;border-radius:inherit;transition:width .18s ease}.player-controls{display:flex;align-items:center;flex:0 0 auto;flex-wrap:wrap;gap:8px;margin-top:10px}.stat-grid{display:grid;flex:0 0 auto;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}.stat{min-width:0;padding:9px;background:#000;border:1px solid var(--border);border-radius:4px}.stat span{display:block;margin-bottom:5px;overflow:hidden;color:var(--muted);font-size:11px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.stat strong{display:block;overflow:hidden;color:var(--ink);font-size:14px;text-overflow:ellipsis;white-space:nowrap}.file-meta,.result-preview,.download-controls{flex:0 0 auto;margin-top:9px}.file-meta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;padding:9px;color:var(--ink);background:#000;border:1px solid var(--border);border-radius:4px}.file-meta strong,.file-meta span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-meta strong{font-size:13px;line-height:1.2}.file-meta span,.file-meta code{color:var(--muted);font:700 11px/1.2 var(--mono)}.file-meta code{justify-self:end;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.result-preview{display:grid;min-height:0;max-height:120px;overflow:auto;gap:6px;padding:10px;color:var(--ink);background:#000;border:1px solid var(--border);border-radius:4px;font:12px/1.45 var(--mono);word-break:break-word}.result-preview.is-binary{place-items:center;min-height:72px;color:var(--muted);text-align:center;font-family:inherit}.download-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.download-controls .primary-button,.download-controls .secondary-button{width:auto;margin-top:0}.payload-details{flex:0 0 auto;margin-top:9px;color:var(--muted);font-size:12px}.payload-details summary{cursor:pointer;color:var(--ink);font-weight:720}.payload-details pre{max-height:92px;overflow:auto;padding:10px;color:var(--ink);background:#000;border:1px solid var(--border);border-radius:4px;font:11px/1.45 var(--mono);white-space:pre-wrap;word-break:break-all}.hint-box,.alert,.complete-banner{display:flex;align-items:flex-start;flex:0 0 auto;gap:8px;margin-top:9px;padding:10px;color:var(--ink);background:#000;border:1px solid var(--border);border-radius:4px;font-size:12px;line-height:1.35}.alert.error{border-color:#fff}.complete-banner{align-items:center;font-weight:800}.camera-frame{display:grid;position:relative;flex:1 1 0;overflow:hidden;place-items:center}.camera-frame video{width:100%;height:100%;min-height:0;object-fit:cover}.scan-reticle{position:absolute;width:min(68%,360px);aspect-ratio:1;border:2px solid rgba(255,255,255,.9);border-radius:4px;box-shadow:0 0 0 999px #00000059;pointer-events:none}.scan-reticle:after{content:"";position:absolute;top:12px;right:12px;bottom:12px;left:12px;border:1px dashed rgba(255,255,255,.38);border-radius:2px}.camera-placeholder{position:absolute;top:0;right:0;bottom:0;left:0;color:var(--muted);background:#000}.frame-map{display:grid;flex:0 0 auto;grid-template-columns:repeat(40,minmax(0,1fr));gap:3px;margin-top:10px;padding:10px;background:#000;border:1px solid var(--border);border-radius:4px}.frame-map span{height:8px;background:#242424;border-radius:1px}.frame-map span.done{background:#fff}.frame-map.empty span{background:#171717}.empty-result{flex:1 1 0;padding:18px}.empty-result strong{color:var(--ink);font-size:14px}.empty-result span{max-width:320px;color:var(--muted);font-size:12px;line-height:1.4}.spin{animation:spin .9s linear infinite}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1040px){.topbar{grid-template-columns:minmax(0,1fr) auto}.offline-pill{display:none}.workspace{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}@media(max-width:760px){.app-shell{gap:8px;padding:8px}.topbar{grid-template-columns:minmax(0,1fr) auto;gap:6px;min-height:0}.brand{gap:8px}.brand-mark{width:30px;height:30px}.brand-mark svg{width:18px;height:18px}.brand h1{font-size:17px}.brand p{display:none}.mode-tabs button{min-width:86px;min-height:30px;padding:0 8px;font-size:12px}.mode-tabs button svg{width:16px;height:16px}.workspace{grid-template-columns:1fr;gap:8px}.sender-view{grid-template-rows:minmax(0,.4fr) minmax(0,.6fr)}.receiver-view{grid-template-rows:minmax(0,.56fr) minmax(0,.44fr)}.panel{padding:9px;border-radius:4px}.section-title{gap:6px;min-height:20px;margin-bottom:6px}.section-title svg{width:16px;height:16px}.section-title h2{font-size:13px}.section-title p{display:none}.drop-zone{min-height:42px;grid-template-columns:auto 1fr auto;gap:7px;padding:6px;text-align:left}.drop-zone>svg{width:17px;height:17px}.drop-zone strong{font-size:12px}.drop-zone span{display:none}.field{gap:4px;margin-top:6px}.field span{font-size:10px}.field input{height:30px;padding:0 8px}.field textarea{padding:7px;font-size:11px;line-height:1.35}.primary-button,.secondary-button,.play-button{min-height:31px;padding:0 9px;font-size:12px}.primary-button{margin-top:6px}.icon-button{width:31px;height:31px}.qr-stage{padding:6px}.qr-stage img{top:6px;right:6px;bottom:6px;left:6px;width:calc(100% - 12px);height:calc(100% - 12px)}.empty-qr svg{width:48px;height:48px}.progress-block,.player-controls,.stat-grid,.file-meta,.result-preview,.download-controls,.payload-details,.hint-box,.alert,.complete-banner,.frame-map{margin-top:6px}.progress-row{margin-bottom:4px;font-size:11px}.progress-track{height:6px}.player-controls{gap:6px}.stat-grid{gap:5px}.stat{padding:6px}.stat span{margin-bottom:3px;font-size:9px}.stat strong{font-size:11px}.file-meta{grid-template-columns:minmax(0,1fr);gap:4px;padding:6px}.file-meta strong{font-size:11px}.file-meta span,.file-meta code{font-size:10px}.file-meta code{justify-self:start}.result-preview{max-height:72px;padding:7px;font-size:10px;line-height:1.35}.result-preview.is-binary{min-height:48px}.download-controls{gap:6px}.payload-details{font-size:11px}.payload-details pre{max-height:58px;padding:7px;font-size:10px}.hint-box,.alert,.complete-banner{gap:6px;padding:7px;font-size:11px;line-height:1.25}.camera-frame{min-height:0}.camera-placeholder svg{width:34px;height:34px}.scan-reticle{width:min(70%,250px)}.frame-map{grid-template-columns:repeat(24,minmax(0,1fr));gap:2px;padding:7px}.frame-map span{height:6px}.empty-result{padding:12px}.empty-result svg{width:34px;height:34px}.empty-result strong{font-size:12px}.empty-result span{font-size:11px}}@media(max-width:760px)and (max-height:720px){.app-shell{gap:6px;padding-block:6px}.topbar{min-height:0}.brand-mark{width:28px;height:28px}.brand h1{font-size:16px}.mode-tabs button{min-height:28px}.sender-view{grid-template-rows:minmax(0,.48fr) minmax(0,.52fr)}.input-panel .section-title{display:none}.drop-zone{min-height:36px}.drop-zone .secondary-button{min-height:28px}.primary-button,.secondary-button,.play-button,.icon-button{min-height:29px}.input-panel .field{margin-top:4px}.input-panel .text-field{flex:0 0 48px}.input-panel .field textarea{height:34px;min-height:34px;overflow:hidden}.input-panel .primary-button{margin-top:4px}.icon-button{width:29px;height:29px}}@media(max-width:430px){.brand-mark{display:none}.brand h1{font-size:16px}.mode-tabs button{min-width:78px;padding:0 6px;gap:5px}}