@font-face{font-family:"Press Start 2P";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/press-start-2p.woff2)format("woff2")}:root{--bg:#0a0a0a;--bg-elevated:#121212;--bg-elevated-2:#181818;--border:#242424;--border-strong:#333;--text-h:#fafafa;--text:#a3a3a3;--text-dim:#6b6b6b;--code-bg:#141414;--accent:#f5c518;--accent-strong:#ffd633;--accent-dim:#f5c5181f;--accent-line:#f5c51859;--on-accent:#0a0a0a;--shadow:#0000008c 0 24px 48px -16px, #0006 0 8px 20px -8px;--sans:-apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, Helvetica, Arial, sans-serif;--pixel:"Press Start 2P", var(--sans);--heading:var(--pixel);--mono:"Press Start 2P", ui-monospace, "SF Mono", Consolas, monospace;font:10px/1.85 var(--pixel);letter-spacing:0;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{background:0 0;min-height:100svh;margin:0}body:before{content:"";z-index:-1;background:radial-gradient(820px 360px at 50% -12%,#f5c51829,#0000 70%),linear-gradient(#0606086b,#060608a3),url(/bg.jpg) 50%/cover no-repeat;position:fixed;inset:0}#root{box-sizing:border-box;flex-direction:column;width:100%;min-height:100svh;padding:22px 18px;display:flex}h1,h2,h3{font-family:var(--heading);color:var(--text-h);margin:0;font-weight:650}h1{font-size:19px;line-height:1.5}h2{font-size:12px;line-height:1.5}h3{font-size:10px;line-height:1.4}p{margin:0}a{color:var(--accent);text-decoration:none}button{font:inherit}@media (width<=640px){h1{font-size:15px}}.app{-webkit-backdrop-filter:blur(20px)saturate(125%);background:#1010139e;border:1px solid #ffffff17;border-radius:22px;flex-direction:column;align-items:center;gap:20px;width:100%;max-width:960px;margin:auto;padding:32px 32px 24px;display:flex;box-shadow:0 40px 90px -30px #000000d9,inset 0 1px #ffffff0d}.app__header{text-align:center;flex-direction:column;align-items:center;gap:12px;max-width:640px;display:flex}.app__header h1{letter-spacing:-1.1px;font-size:34px}.app__brand{font-family:var(--heading);letter-spacing:.3px;color:var(--text-h);text-transform:lowercase;align-items:center;gap:9px;font-size:15px;font-weight:650;display:flex}.app__brand-mark{background:var(--accent);border-radius:4px;width:16px;height:16px}.app__features{flex-wrap:wrap;justify-content:center;gap:8px 20px;margin-top:2px;display:flex}.feature{color:var(--text);align-items:center;gap:7px;font-size:13px;display:inline-flex}.feature svg{color:var(--text-dim)}.app__main{grid-template-columns:1fr 1fr;align-items:start;gap:18px;width:100%;max-width:940px;display:grid}.app__action,.app__aside{min-width:0}.panel-card{background:#1414188c;border:1px solid #ffffff12;border-radius:16px;flex-direction:column;display:flex;overflow:hidden}.panel-card__section{text-align:center;flex-direction:column;align-items:center;gap:14px;padding:22px;display:flex}.panel-card__divider{background:var(--border);height:1px;position:relative}.panel-card__divider span{background:var(--bg-elevated-2);border:1px solid var(--border);width:28px;height:28px;color:var(--text-dim);border-radius:999px;justify-content:center;align-items:center;font-size:11px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.panel-card--single{align-items:center;gap:4px;padding-bottom:24px}.app__panel-status{color:var(--text-dim);font-size:13px}@media (width<=820px){.app{border-radius:18px;padding:22px 18px 20px}.app__main{grid-template-columns:1fr;max-width:460px}}.file-drop{border:1.5px dashed var(--border-strong);cursor:pointer;background:var(--bg-elevated-2);border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:7px;width:100%;min-height:132px;padding:20px;transition:border-color .18s,background .18s;display:flex}.file-drop:hover{border-color:var(--accent-line);background:var(--bg-elevated)}.file-drop--active{border-color:var(--accent);background:var(--accent-dim)}.file-drop__icon{color:var(--text-dim);margin-bottom:4px;transition:color .18s}.file-drop:hover .file-drop__icon,.file-drop--active .file-drop__icon{color:var(--accent)}.file-drop__title{color:var(--text-h);font-size:15px;font-weight:550}.file-drop__hint{color:var(--text-dim);font-size:13px}.file-drop__folder{border:1px solid var(--border-strong);color:var(--text);cursor:pointer;background:0 0;border-radius:8px;margin-top:10px;padding:7px 12px;font-size:8px;line-height:1.4;transition:border-color .15s,color .15s}.file-drop__folder:hover{border-color:var(--accent-line);color:var(--accent)}.room-code-display{flex-direction:column;align-items:center;gap:10px;width:100%;padding:32px 28px 20px;display:flex}.room-code-display__label{color:var(--text-dim);text-transform:uppercase;letter-spacing:1px;font-size:12px}.room-code-display__code{cursor:pointer;background:0 0;border:none;gap:6px;padding:2px;display:flex}.room-code-display__code span{font-family:var(--mono);color:var(--text-h);background:var(--bg-elevated-2);border:1px solid var(--border-strong);border-radius:8px;justify-content:center;align-items:center;width:40px;height:54px;font-size:28px;font-weight:600;display:flex}.room-code-display__copy{color:var(--text-dim);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:2px 6px;font-size:12.5px;transition:color .15s;display:inline-flex}.room-code-display__copy:hover{color:var(--accent)}.room-code-display__qr{background:#fff;border-radius:12px;margin-top:10px;padding:11px;line-height:0}.room-code-display__hint{color:var(--text-dim);font-size:12.5px}.room-code-input{gap:8px;width:100%;display:flex}.room-code-input input{min-width:0;font-family:var(--mono);letter-spacing:6px;text-align:center;border:1px solid var(--border-strong);background:var(--bg-elevated-2);color:var(--text-h);border-radius:10px;flex:1;padding:11px 12px;font-size:20px}.room-code-input input::placeholder{color:var(--text-dim);letter-spacing:6px}.room-code-input input:focus{border-color:var(--accent);outline:none}.btn{cursor:pointer;border:1px solid #0000;border-radius:10px;padding:10px 20px;font-size:14px;font-weight:600;transition:background .15s,border-color .15s,transform .1s}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--primary{background:var(--accent);color:var(--on-accent)}.btn--primary:not(:disabled):hover{background:var(--accent-strong)}.btn--ghost{border-color:var(--border-strong);color:var(--text);background:0 0}.btn--ghost:hover{border-color:var(--text-dim);color:var(--text-h)}.transfer-progress{flex-direction:column;align-items:center;gap:12px;width:100%;padding:8px 28px 4px;display:flex}.transfer-progress__status{color:var(--text-h);align-items:center;gap:8px;font-size:15px;font-weight:550;display:flex}.transfer-progress__status-icon--accent{color:var(--accent)}.transfer-progress__meta{color:var(--text-dim);font-size:13px}.transfer-progress__bar{background:var(--bg-elevated-2);border:1px solid var(--border);border-radius:999px;width:100%;height:8px;overflow:hidden}.transfer-progress__bar-fill{background:var(--accent);height:100%;transition:width .15s ease-out}.transfer-progress__error{color:var(--text);background:var(--accent-dim);border:1px solid var(--accent-line);border-radius:8px;padding:8px 12px;font-size:13px}.spinner{border:2px solid var(--border-strong);border-top-color:var(--accent);border-radius:50%;flex:none;width:14px;height:14px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.how{flex-direction:column;gap:14px;width:100%;display:flex}.how__head{flex-direction:column;gap:6px;display:flex}.how__head p{color:var(--text);font-size:13px;line-height:1.5}.how__scene-wrap{background:#1414188c;border:1px solid #ffffff12;border-radius:14px;width:100%;padding:14px 16px}.how-scene{width:100%;height:auto;display:block}.wire{fill:none}.wire-direct{stroke:var(--accent);stroke-width:2px}.wire-sig{stroke:var(--border-strong);stroke-width:1.6px;stroke-dasharray:5 6;animation:1.1s linear infinite flow}.node rect{fill:var(--bg-elevated-2);stroke:var(--border-strong);stroke-width:1.4px}.node__label{fill:var(--text-h);font-size:14px;font-weight:600;font-family:var(--pixel)}.node__screen{fill:none;stroke:var(--text-dim);stroke-width:1.5px}.node__stand{stroke:var(--text-dim);stroke-width:1.5px;stroke-linecap:round;fill:none}.tag rect{fill:var(--bg-elevated);stroke:var(--border-strong);stroke-width:1.2px}.tag__text{fill:var(--text-dim);font-size:11px;font-family:var(--mono)}.direct-label{fill:var(--accent);font-size:12px;font-weight:600;font-family:var(--pixel);letter-spacing:.2px}.packet rect{fill:var(--accent)}.packet__lines{stroke:var(--on-accent);stroke-width:1.4px;stroke-linecap:round;opacity:.8}.packet{animation:2.8s cubic-bezier(.55,0,.45,1) infinite packet}.ping{fill:none;stroke:var(--accent);stroke-width:2px;transform-origin:430px 210px;animation:2.8s ease-out infinite ping}@keyframes packet{0%{opacity:0;transform:translate(0)}5%{opacity:1}56%{opacity:1;transform:translate(236px)}63%{opacity:0;transform:translate(236px)}to{opacity:0;transform:translate(0)}}@keyframes ping{0%,54%{opacity:0;transform:scale(.4)}60%{opacity:.7;transform:scale(1)}76%{opacity:0;transform:scale(2.2)}to{opacity:0;transform:scale(2.2)}}@keyframes flow{to{stroke-dashoffset:-11px}}.how__stepper{flex-wrap:wrap;gap:8px 14px;margin:0;padding:0;list-style:none;display:flex}.how__stepper-item{color:var(--text-h);align-items:center;gap:7px;font-size:12.5px;font-weight:500;display:inline-flex}.how__stepper-num{background:var(--accent-dim);width:19px;height:19px;color:var(--accent);font-family:var(--mono);border-radius:6px;flex:none;justify-content:center;align-items:center;font-size:11px;font-weight:600;display:flex}.app__footer{color:var(--text-dim);text-align:center;font-size:12.5px}@media (prefers-reduced-motion:reduce){.packet{opacity:1;animation:none;transform:translate(118px)}.ping,.wire-sig{animation:none}.spinner{animation-duration:1.6s}}.app__header h1{letter-spacing:0;font-size:17px;line-height:1.7}.app__subtitle{font-size:9px;line-height:1.9}.feature{gap:8px;font-size:8px}.app__brand{letter-spacing:1px;font-size:11px}.panel-card__section h2{font-size:11px}.panel-card__divider span{font-size:7px}.app__panel-status{font-size:8px}.file-drop__title{font-size:10px;line-height:1.5}.file-drop__hint{font-size:8px}.room-code-display__label{letter-spacing:1px;font-size:7px}.room-code-display__code span{width:34px;height:48px;font-size:19px}.room-code-display__copy,.room-code-display__hint{font-size:7.5px}.room-code-input input{letter-spacing:2px;font-size:15px}.room-code-input input::placeholder{letter-spacing:2px}.btn{letter-spacing:0;padding:12px 18px;font-size:9px}.transfer-progress__status{font-size:9.5px;line-height:1.6}.transfer-progress__meta{font-size:8px}.transfer-progress__error{font-size:8px;line-height:1.7}.how__head h2{font-size:12px}.how__head p{font-size:8px;line-height:1.9}.how__stepper-item,.how__stepper-num{font-size:8px}.app__footer{font-size:7px;line-height:1.9}.node__label{font-size:9px}.tag__text{font-size:7px}.direct-label{font-size:8px}@media (width<=640px){.app__header h1{font-size:14px}}
