:root{--bg: #050505;--panel: #0d0e10;--line: #212427;--line-soft: #17191b;--ink: #eceeea;--dim: #7a8184;--beam: #ffc24b;--beam-dim: #a97e26;--danger: #ff6f66;--r: 6px;--mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;--ui: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", sans-serif}*{margin:0;padding:0;box-sizing:border-box}html,body,#app{height:100%}body{font-family:var(--ui);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}#app{display:flex;flex-direction:column;max-width:520px;margin:0 auto;min-height:100%;padding:max(18px,env(safe-area-inset-top)) 20px max(22px,env(safe-area-inset-bottom))}.screen{display:flex;flex-direction:column;gap:16px;flex:1;animation:rise .3s cubic-bezier(.2,.7,.2,1)}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.topbar{display:flex;align-items:center;gap:12px;min-height:38px}.topbar h1{font:600 12px/1 var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}.label,.l,.footnote,.sub{font-family:var(--mono);letter-spacing:.08em}.wordmark{display:flex;align-items:center;gap:9px;padding:2px 0 6px}.wordmark svg{display:block}.wordmark .name{font:600 15px/1 var(--mono);letter-spacing:.06em}.wordmark .proto{margin-left:auto;font:500 10px/1 var(--mono);letter-spacing:.18em;color:var(--dim);border:1px solid var(--line);border-radius:3px;padding:4px 6px}.display{font:800 clamp(30px,9vw,40px)/1.05 var(--ui);letter-spacing:-.02em;margin-top:6px}.display .lit{color:var(--beam)}.sub{color:var(--dim);font-size:11px;letter-spacing:.02em;white-space:nowrap;margin:2px 0 10px}.footnote{margin-top:auto;padding-top:14px;border-top:1px solid var(--line-soft);color:var(--dim);font-size:10px;letter-spacing:.14em;text-transform:uppercase;text-align:center}.hero{border:1px solid var(--line);border-radius:var(--r);background:radial-gradient(340px 130px at 50% 45%,#101113 0%,transparent 100%),var(--panel);padding:6px 2px 2px}.hero svg{display:block;width:100%;height:auto}.hero .phone{fill:#0a0b0c;stroke:#34393d;stroke-width:1.4}.hero .screen-lit{fill:#fff}.hero .screen-dark{fill:#0e1012;stroke:var(--line);stroke-width:1}.hero .detail{stroke:#34393d;stroke-width:1.4;stroke-linecap:round}.hero .qr-cell{fill:#000;transition:opacity .12s steps(1)}.hero .bar-track{fill:#1d2023}.hero .bar-fill{fill:var(--beam)}.hero .pct{font:600 9px var(--mono);letter-spacing:.08em;fill:var(--beam);text-anchor:middle}.hero .rx-label{font:500 6.5px var(--mono);letter-spacing:.22em;fill:var(--dim);text-anchor:middle}.hero .done-mark{stroke:var(--beam);stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round}.hero .bit{fill:var(--beam);opacity:0;offset-path:path("M96 72 C 148 34, 196 42, 234 66");offset-rotate:0deg}.hero .bits .bit:nth-child(2n){offset-path:path("M96 86 C 150 116, 198 106, 234 88")}.hero.playing .bit{animation:fly 1.15s linear infinite}@keyframes fly{0%{offset-distance:0%;opacity:0}10%{opacity:1}82%{opacity:1}to{offset-distance:100%;opacity:0}}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px}.btn{appearance:none;border:1px solid var(--line);border-radius:var(--r);background:transparent;color:var(--ink);font:600 15px var(--ui);padding:15px 20px;cursor:pointer;width:100%;transition:transform .1s ease,background .15s ease,border-color .15s ease;display:flex;align-items:center;justify-content:center;gap:10px}.btn:hover{border-color:#3a3f43}.btn:active{transform:scale(.98)}.btn:focus-visible,.seg-btn:focus-visible{outline:2px solid var(--beam);outline-offset:2px}.btn-primary{background:var(--beam);border-color:var(--beam);color:#0a0800}.btn-primary:hover{background:#ffd07a;border-color:#ffd07a}.btn-ghost{width:auto;padding:8px 12px;font-size:13px;border-radius:4px}.dropzone{border:1px dashed #383d41;border-radius:var(--r);padding:46px 20px;text-align:center;color:var(--dim);font-family:var(--mono);font-size:12px;letter-spacing:.06em;transition:border-color .15s ease,background .15s ease;cursor:pointer}.dropzone.drag{border-color:var(--beam);background:#ffc24b0a}.dropzone strong{display:block;margin-bottom:8px;color:var(--ink);font:600 15px var(--ui);letter-spacing:0}.qr-stage,.viewfinder{position:relative}.qr-stage:after,.viewfinder:after{content:"";position:absolute;inset:-5px;pointer-events:none;background:linear-gradient(var(--beam),var(--beam)) left 0 top 0 / 16px 2px,linear-gradient(var(--beam),var(--beam)) left 0 top 0 / 2px 16px,linear-gradient(var(--beam),var(--beam)) right 0 top 0 / 16px 2px,linear-gradient(var(--beam),var(--beam)) right 0 top 0 / 2px 16px,linear-gradient(var(--beam),var(--beam)) left 0 bottom 0 / 16px 2px,linear-gradient(var(--beam),var(--beam)) left 0 bottom 0 / 2px 16px,linear-gradient(var(--beam),var(--beam)) right 0 bottom 0 / 16px 2px,linear-gradient(var(--beam),var(--beam)) right 0 bottom 0 / 2px 16px;background-repeat:no-repeat}.qr-stage{background:#fff;border-radius:4px;aspect-ratio:1;width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.qr-stage canvas{width:100%;height:100%;image-rendering:pixelated}.viewfinder{border-radius:4px;overflow:hidden;aspect-ratio:3 / 4;background:#000}.viewfinder video{width:100%;height:100%;object-fit:cover}.viewfinder .overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:#00000047;pointer-events:none}.ring{width:128px;height:128px;transform:rotate(-90deg)}.ring .track{fill:none;stroke:#ffffff29;stroke-width:6}.ring .bar{fill:none;stroke:var(--beam);stroke-width:6;stroke-linecap:butt;transition:stroke-dashoffset .25s ease}.ring-label{font:700 22px var(--mono);text-align:center;text-shadow:0 1px 8px rgba(0,0,0,.7)}.stat-row{display:flex;gap:10px}.stat{flex:1;text-align:center;padding:12px 8px}.stat .v{font:700 19px var(--mono);font-variant-numeric:tabular-nums}.stat .l{font-size:10px;color:var(--dim);margin-top:4px;letter-spacing:.18em;text-transform:uppercase}.hint{text-align:center;color:var(--dim);font:500 11px var(--mono);letter-spacing:.08em;min-height:18px}.hint.good{color:var(--beam)}.hint.bad{color:var(--danger)}.file-chip{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r)}.file-chip .name{font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-chip .size{color:var(--dim);font:500 11px var(--mono);letter-spacing:.08em}.seg{display:flex;background:var(--bg);border:1px solid var(--line);border-radius:4px;padding:3px}.seg-btn{flex:1;border:0;background:transparent;color:var(--dim);font:600 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;padding:9px 4px;border-radius:2px;cursor:pointer;transition:background .15s ease,color .15s ease}.seg-btn.active{background:var(--beam);color:#0a0800}input[type=range]{width:100%;accent-color:var(--beam)}.label{font-size:10px;color:var(--dim);margin-bottom:8px;display:block;letter-spacing:.18em;text-transform:uppercase}.done-check{width:80px;height:80px;border-radius:50%;border:2px solid var(--beam);color:var(--beam);display:flex;align-items:center;justify-content:center;font-size:36px;margin:0 auto;animation:pop .4s cubic-bezier(.2,1.6,.4,1)}@keyframes pop{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.error-box{border-color:#ff6f6680;color:var(--danger);text-align:center;font:500 12px var(--mono)}@media(prefers-reduced-motion:reduce){.screen{animation:none}.hero .bit{display:none}.ring .bar{transition:none}}