:root{--bg: #0b0d10;--surface: #14181e;--surface-2: #1b212a;--line: #262e39;--text: #eef2f7;--muted: #98a3b3;--accent: #ffb020;--accent-2: #4b9cff;--danger: #ff6b5e;--radius: 18px;--pad: 18px}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;overscroll-behavior-y:none}body{background-image:radial-gradient(900px 500px at 12% -10%,rgba(255,176,32,.1),transparent 60%),radial-gradient(700px 460px at 92% 4%,rgba(75,156,255,.1),transparent 62%);background-attachment:fixed}main{max-width:620px;margin:0 auto;padding:12px var(--pad) 72px;display:flex;flex-direction:column;gap:14px}.topbar{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top) + 12px) var(--pad) 12px;background:#0b0d10d1;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px}.brand-mark{width:26px;height:26px;border-radius:7px;background:var(--accent);position:relative;box-shadow:inset 0 -3px #00000038}.brand-mark:before,.brand-mark:after{content:"";position:absolute;top:4px;width:7px;height:7px;border-radius:50%;background:#ffffff8c;box-shadow:0 10px #ffffff8c}.brand-mark:before{left:4px}.brand-mark:after{right:4px}.brand-name{font-weight:700;font-size:17px;letter-spacing:-.2px}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--pad)}.hero-title{margin:4px 0 6px;font-size:27px;line-height:1.16;letter-spacing:-.7px;font-weight:800}.hero-sub{margin:0 0 16px;color:var(--muted);font-size:15px}.source-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.source-btn{display:flex;flex-direction:column;align-items:flex-start;gap:3px;padding:13px 11px;background:var(--surface-2);border:1px solid var(--line);border-radius:14px;color:var(--text);cursor:pointer;text-align:left;transition:border-color .16s,transform .16s,background .16s}.source-btn:hover{border-color:var(--accent);transform:translateY(-1px)}.source-btn:active{transform:translateY(0)}.source-icon{font-size:19px}.source-label{font-weight:650;font-size:14px}.source-note{font-size:11px;color:var(--muted);line-height:1.3}.sample-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}.chip{padding:8px 14px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);color:var(--text);font-size:13px;font-weight:600;cursor:pointer}.chip:hover{border-color:var(--accent)}.chip.active{background:var(--accent);color:#1a1204;border-color:var(--accent)}.viewer-card{padding:10px}.viewer-wrap{position:relative;width:100%;aspect-ratio:1 / 1;border-radius:14px;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,#212936,#101419 62%,#0c0f13)}#viewer{width:100%;height:100%;display:block;touch-action:none}.viewer-empty,.viewer-busy{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;pointer-events:none;text-align:center;padding:20px}.viewer-empty p{margin:0;font-weight:650;font-size:15px}.viewer-empty span{font-size:13px;color:var(--muted)}.viewer-busy{background:#0b0d10b8;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:all}.viewer-busy p{margin:0;font-size:14px;color:var(--muted)}.spinner{width:30px;height:30px;border-radius:50%;border:3px solid rgba(255,255,255,.14);border-top-color:var(--accent);animation:spin .85s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.stat-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}.stat{display:flex;flex-direction:column;align-items:center;gap:1px;padding:9px 4px;background:var(--surface-2);border-radius:11px}.stat b{font-size:15px;font-variant-numeric:tabular-nums}.stat span{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px}.warn{margin-top:10px;padding:11px 13px;border-radius:11px;background:#ff6b5e1a;border:1px solid rgba(255,107,94,.32);color:#ffb3ac;font-size:12.5px;line-height:1.45}.controls-card{display:flex;flex-direction:column;gap:18px}.control label{display:block;font-size:13px;font-weight:650;margin-bottom:8px}.control-value{float:right;color:var(--accent);font-weight:600;font-variant-numeric:tabular-nums}.control-hint{margin:7px 0 0;font-size:12px;color:var(--muted);line-height:1.4}input[type=range]{width:100%;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:5px;border-radius:3px;background:var(--surface-2);outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:var(--accent);cursor:pointer;border:3px solid var(--surface);box-shadow:0 2px 8px #0006}.segmented{display:flex;gap:4px;padding:4px;background:var(--surface-2);border-radius:12px}.segmented button{flex:1;padding:9px 8px;border:none;border-radius:9px;background:transparent;color:var(--muted);font-size:13px;font-weight:600;cursor:pointer;transition:background .15s,color .15s}.segmented button.active{background:var(--accent);color:#1a1204}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.toggle-row label{margin-bottom:2px}.toggle-row .control-hint{margin-top:3px}.switch{-moz-appearance:none;appearance:none;-webkit-appearance:none;flex:0 0 auto;width:50px;height:30px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);position:relative;cursor:pointer;transition:background .18s}.switch:after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--muted);transition:transform .18s,background .18s}.switch:checked{background:var(--accent);border-color:var(--accent)}.switch:checked:after{transform:translate(20px);background:#1a1204}.section-heading{margin:14px 0 0;font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:700}.out-card{padding:0;overflow:hidden}.out-head{display:flex;gap:13px;padding:var(--pad);border-bottom:1px solid var(--line)}.out-num{flex:0 0 auto;width:27px;height:27px;border-radius:8px;background:var(--accent);color:#1a1204;display:grid;place-items:center;font-weight:800;font-size:14px}.out-head h3{margin:0 0 3px;font-size:16px;letter-spacing:-.2px}.out-head p{margin:0;font-size:13px;color:var(--muted);line-height:1.45}.out-body{padding:var(--pad);display:flex;flex-direction:column;gap:13px}.out-stats{display:flex;flex-wrap:wrap;gap:8px}.out-stat{padding:7px 12px;border-radius:10px;background:var(--surface-2);font-size:12.5px;color:var(--muted)}.out-stat b{color:var(--text);font-variant-numeric:tabular-nums}.out-actions{display:flex;flex-wrap:wrap;gap:8px}.primary-btn{flex:1 1 auto;min-width:140px;padding:12px 18px;border:none;border-radius:12px;background:var(--accent);color:#1a1204;font-size:14px;font-weight:700;cursor:pointer;transition:filter .15s,opacity .15s}.primary-btn:hover:not(:disabled){filter:brightness(1.08)}.primary-btn:disabled{opacity:.38;cursor:not-allowed}.ghost-btn{padding:11px 16px;border-radius:12px;border:1px solid var(--line);background:transparent;color:var(--text);font-size:13px;font-weight:600;cursor:pointer}.ghost-btn:hover:not(:disabled){border-color:var(--accent)}.ghost-btn:disabled{opacity:.38;cursor:not-allowed}.fineprint{margin:0;font-size:11.5px;color:var(--muted);line-height:1.5}.warn-text{color:#ffb3ac}.parts-table-wrap{max-height:260px;overflow-y:auto;border-radius:11px;border:1px solid var(--line)}.parts-table{width:100%;border-collapse:collapse;font-size:12.5px}.parts-table th{position:sticky;top:0;background:var(--surface-2);padding:9px 11px;text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}.parts-table td{padding:8px 11px;border-top:1px solid var(--line)}.parts-table td:last-child{text-align:right;font-variant-numeric:tabular-nums;font-weight:650}.swatch{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:7px;vertical-align:-1px;border:1px solid rgba(255,255,255,.22)}.legal{margin:6px 0 0;font-size:11px;color:#5f6a7a;line-height:1.55;text-align:center}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;background:#06080ae6;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);display:flex;flex-direction:column}.overlay-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:calc(env(safe-area-inset-top) + 12px) var(--pad) 12px;border-bottom:1px solid var(--line);font-size:14px;font-weight:650}.steps-stage{flex:1;display:grid;place-items:center;padding:16px;min-height:0}.steps-stage svg{max-width:100%;max-height:100%;border-radius:12px}.steps-list{padding:0 var(--pad) 10px;display:flex;flex-wrap:wrap;gap:6px;justify-content:center;max-height:110px;overflow-y:auto}.step-part{padding:5px 10px;border-radius:8px;background:var(--surface-2);font-size:11.5px;color:var(--muted)}.step-part b{color:var(--text)}.overlay-foot{display:flex;gap:9px;padding:12px var(--pad) calc(env(safe-area-inset-bottom) + 16px);border-top:1px solid var(--line)}.sheet{margin:auto;width:min(460px,calc(100% - 32px));background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px}.sheet h3{margin:0 0 9px;font-size:18px}.sheet-text{margin:0 0 16px;font-size:13.5px;color:var(--muted);line-height:1.55}.sheet-note{margin:12px 0 0;font-size:12px;color:var(--muted);line-height:1.5}.sheet-note a{color:var(--accent-2)}.key-field{margin-bottom:13px}.key-field label{display:block;font-size:12px;font-weight:650;margin-bottom:6px}.key-field input,.key-field select{width:100%;padding:11px 13px;border-radius:11px;border:1px solid var(--line);background:var(--surface-2);color:var(--text);font-size:14px;font-family:inherit}.sheet-actions{display:flex;gap:9px;margin-top:18px}.sheet-actions .primary-btn,.sheet-actions .ghost-btn{flex:1}.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom) + 22px);transform:translate(-50%);z-index:120;max-width:min(420px,calc(100% - 32px));padding:12px 18px;border-radius:12px;background:var(--surface-2);border:1px solid var(--line);font-size:13px;line-height:1.45;box-shadow:0 12px 40px #00000080}.toast.error{border-color:#ff6b5e80;color:#ffb3ac}.hidden{display:none!important}@media (min-width: 640px){.hero-title{font-size:32px}main{padding-bottom:90px}}
