:root{--ink:#0d0f13;--steel:#14171d;--steel-raised:#191d24;--rule:#262c35;--rule-bright:#333b46;--text:#dde2e8;--text-dim:#7f8892;--bronze:#c8913f;--bronze-bright:#e2ae5c;--bronze-dim:#6d5228;--patina:#57938a;--alert:#d9645c;--display:"Bodoni Moda", "Didot", Georgia, serif;--sans:"Schibsted Grotesk", "Helvetica Neue", sans-serif;--mono:"DM Mono", "SF Mono", ui-monospace, monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--ink);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;font-size:15px}button{font-family:inherit}.drop-target{height:100%;position:relative}.app{flex-direction:column;height:100%;display:flex}.app-header{background:linear-gradient(180deg, var(--steel-raised), var(--steel));border-bottom:1px solid var(--rule);justify-content:space-between;align-items:center;gap:1rem;padding:.75rem 1.4rem;display:flex;box-shadow:inset 0 1px #ffffff08}.app-header h1{font-family:var(--display);letter-spacing:.06em;white-space:nowrap;margin:0;font-size:1.15rem;font-weight:400}.app-header .arrow{color:var(--bronze);padding:0 .15em}.header-file{align-items:center;gap:.9rem;min-width:0;font-size:.82rem;display:flex}.file-name{font-family:var(--mono);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.file-meta{font-family:var(--mono);color:var(--text-dim);white-space:nowrap;font-size:.75rem}.working-dot{background:var(--bronze);width:7px;height:7px;box-shadow:0 0 8px var(--bronze);border-radius:50%;flex:none;animation:1s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.2}50%{opacity:1}}.ghost-btn{border:1px solid var(--rule-bright);color:var(--text-dim);cursor:pointer;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;background:0 0;border-radius:3px;padding:.32rem .75rem;font-size:.72rem;transition:color .15s,border-color .15s}.ghost-btn:hover{color:var(--bronze-bright);border-color:var(--bronze-dim)}.workspace{flex:1;grid-template-columns:1fr 1fr 320px;min-height:0;display:grid}.viewport-wrap{background:radial-gradient(ellipse 70% 60% at 50% 42%, #1b2027 0%, var(--ink) 72%), repeating-linear-gradient(90deg, transparent 0 39px, #ffffff04 39px 40px);min-width:0;min-height:0;position:relative}.workspace>.viewport-wrap+.viewport-wrap{border-left:1px solid var(--rule)}.viewport{position:absolute;inset:0}.viewport canvas{display:block}.viewport-tag{font-family:var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--text-dim);pointer-events:none;font-size:.66rem;position:absolute;top:.85rem;left:1rem}.viewport-tag:before{content:"";background:var(--bronze-dim);vertical-align:middle;width:14px;height:1px;margin-right:.55rem;display:inline-block}.preset-bar{background:var(--rule);border:1px solid var(--rule);border-radius:3px;gap:1px;max-width:calc(100% - 2rem);display:flex;position:absolute;bottom:.9rem;left:50%;overflow:hidden;transform:translate(-50%)}.preset-btn{background:var(--steel);color:var(--text-dim);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;white-space:nowrap;border:none;padding:.36rem .65rem;font-size:.7rem;transition:background .15s,color .15s}.preset-btn:hover{background:var(--steel-raised);color:var(--bronze-bright)}.viewport-hint,.viewport-empty{color:var(--text-dim);pointer-events:none;font-size:.74rem;position:absolute}.viewport-hint{text-align:center;width:100%;padding:0 1rem;font-size:.72rem;bottom:3.1rem;left:50%;transform:translate(-50%)}.viewport-empty{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;justify-content:center;align-items:center;font-size:.7rem;display:flex;inset:0}.panel{background:linear-gradient(180deg, var(--steel-raised), var(--steel) 22%);border-left:1px solid var(--rule);scrollbar-width:thin;scrollbar-color:var(--rule-bright) transparent;padding:1.2rem 1.25rem 2rem;overflow-y:auto}.panel-section{margin-bottom:1.7rem}.panel-section h2{font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--bronze);align-items:center;gap:.7rem;margin:0 0 .9rem;font-size:.66rem;font-weight:500;display:flex}.panel-section h2:after{content:"";background:linear-gradient(90deg, var(--bronze-dim), transparent);flex:1;height:1px}.control{margin-bottom:1.05rem;display:block}.control-head{justify-content:space-between;align-items:baseline;gap:.6rem;margin-bottom:.38rem;display:flex}.control-label{font-size:.83rem}.control-value{font-family:var(--mono);color:var(--bronze-bright);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.78rem}button.control-value{cursor:text;text-align:right;background:0 0;border:none;padding:0}button.control-value:hover{text-underline-offset:3px;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}button.control-value:focus-visible{outline:1px solid var(--bronze-dim);outline-offset:2px}.text-input{font-family:var(--mono);color:var(--text);background:var(--steel);border:1px solid var(--rule-bright);border-radius:3px;padding:.15rem .3rem;font-size:.78rem}.text-input:focus{border-color:var(--bronze-dim);outline:none}.control-value-edit{font-family:var(--mono);color:var(--bronze-bright);background:var(--steel);border:1px solid var(--bronze-dim);text-align:right;border-radius:3px;width:5.5ch;padding:.05rem .25rem;font-size:.78rem}.control-value-edit:focus{outline:none}.control-hint{color:var(--text-dim);margin-top:.35rem;font-size:.71rem;line-height:1.4;display:block}.control input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:18px}.control input[type=range]::-webkit-slider-runnable-track{background:var(--rule-bright);border-radius:1px;height:2px}.control input[type=range]::-moz-range-track{background:var(--rule-bright);border-radius:1px;height:2px}.control input[type=range]::-webkit-slider-thumb{appearance:none;background:radial-gradient(circle at 35% 30%, var(--bronze-bright), var(--bronze) 60%, #8a6026);border:1px solid #3a2c14;border-radius:50%;width:13px;height:13px;margin-top:-5.5px;transition:box-shadow .15s;box-shadow:0 1px 3px #0009}.control input[type=range]::-moz-range-thumb{background:radial-gradient(circle at 35% 30%, var(--bronze-bright), var(--bronze) 60%, #8a6026);border:1px solid #3a2c14;border-radius:50%;width:13px;height:13px;box-shadow:0 1px 3px #0009}.control input[type=range]:hover::-webkit-slider-thumb{box-shadow:0 0 0 5px #c8913f29,0 1px 3px #0009}.control input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 5px #c8913f29,0 1px 3px #0009}.control-check{cursor:pointer}.check-row{align-items:center;gap:.55rem;display:flex}.check-row input[type=checkbox]{opacity:0;width:0;height:0;position:absolute}.check-box{border:1px solid var(--rule-bright);background:var(--steel);border-radius:3px;flex:none;width:15px;height:15px;transition:background .15s,border-color .15s;position:relative}.check-box:after{content:"";opacity:0;border:1.5px solid #fdf3e2;border-width:0 1.5px 1.5px 0;width:4px;height:8px;transition:opacity .12s;position:absolute;top:1px;left:4px;transform:rotate(42deg)}.control-check:hover .check-box{border-color:var(--bronze-dim)}.check-row input[type=checkbox]:checked+.check-box{background:var(--bronze-dim);border-color:var(--bronze)}.check-row input[type=checkbox]:checked+.check-box:after{opacity:1}.check-row input[type=checkbox]:focus-visible+.check-box{box-shadow:0 0 0 4px #c8913f29}.segmented{background:var(--rule);border:1px solid var(--rule);border-radius:3px;gap:1px;margin-bottom:.7rem;display:flex;overflow:hidden}.segmented.wrap{flex-wrap:wrap}.segmented.wrap .segment{flex:30%}.segment{background:var(--steel);color:var(--text-dim);letter-spacing:.05em;cursor:pointer;white-space:nowrap;border:none;flex:1;padding:.42rem .3rem;font-size:.72rem;transition:background .15s,color .15s}.segment:hover{background:var(--steel-raised);color:var(--text)}.segment.active{background:var(--bronze-dim);color:#fdf3e2}.compass{max-width:9.6rem}.compass .segment{flex:30%;padding:.36rem 0;font-size:.9rem;line-height:1}.segment-blank{background:var(--ink);cursor:default;pointer-events:none}.presets-form{gap:.4rem;margin-bottom:.6rem;display:flex}.presets-name{flex:1;min-width:0}.presets-name::placeholder{color:var(--text-dim)}.ghost-btn:disabled{opacity:.45;cursor:default;color:var(--text-dim);border-color:var(--rule)}.presets-list{flex-direction:column;gap:1px;margin:0;padding:0;list-style:none;display:flex}.presets-item{background:var(--steel);border-radius:3px;align-items:center;gap:.3rem;display:flex}.presets-load{min-width:0;color:var(--text);text-align:left;cursor:pointer;text-overflow:ellipsis;white-space:nowrap;background:0 0;border:none;flex:1;padding:.34rem .5rem;font-size:.78rem;overflow:hidden}.presets-item:hover{background:var(--steel-raised)}.presets-load:hover{color:var(--bronze-bright)}.presets-delete{color:var(--text-dim);cursor:pointer;background:0 0;border:none;flex:none;padding:.2rem .5rem;font-size:.95rem;line-height:1}.presets-delete:hover{color:var(--alert)}.panel-stats{border-top:1px solid var(--rule);padding-top:.9rem;font-size:.78rem}.panel-stats div{justify-content:space-between;gap:.8rem;margin-bottom:.35rem;display:flex}.panel-stats span{color:var(--text-dim)}.panel-stats strong{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:400}.panel-error{color:#f0b3ae;border-left:2px solid var(--alert);background:#d9645c1a;margin:0 0 1.2rem;padding:.65rem .8rem;font-size:.78rem;line-height:1.45}.export-hint{font-family:var(--mono);color:var(--text-dim);margin:-.3rem 0 .8rem;font-size:.7rem;line-height:1.5}.export-hint.heavy{color:var(--bronze)}.primary-btn{background:linear-gradient(180deg, var(--bronze-bright), var(--bronze));color:#241802;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;border:none;border-radius:3px;width:100%;padding:.7rem;font-size:.78rem;font-weight:600;transition:filter .15s}.primary-btn:hover:not(:disabled){filter:brightness(1.12)}.primary-btn:disabled{opacity:.4;cursor:default}.dropzone{cursor:pointer;background:radial-gradient(ellipse 60% 55% at 50% 45%, #1a1f26 0%, var(--ink) 70%);flex:1;justify-content:center;align-items:center;display:flex}.dropzone-inner{text-align:center;padding:3.5rem 4.5rem;animation:.5s ease-out both rise}@keyframes rise{0%{opacity:0;transform:translateY(10px)}}.dropzone-icon{width:96px;height:96px;color:var(--bronze);border:1px solid var(--bronze-dim);background:radial-gradient(circle at 38% 32%,#23282f,#14171d 70%);border-radius:50%;justify-content:center;align-items:center;margin:0 auto 1.6rem;font-size:1.6rem;transition:transform .3s cubic-bezier(.2,.9,.3,1.2),box-shadow .3s;display:flex;box-shadow:0 0 0 7px #c8913f12,0 0 0 8px #c8913f29,0 0 0 20px #c8913f0a,0 14px 34px #0000008c}.dropzone:hover .dropzone-icon{transform:translateY(-3px)scale(1.03);box-shadow:0 0 0 7px #c8913f1f,0 0 0 8px #c8913f4d,0 0 0 24px #c8913f0f,0 18px 40px #0009}.dropzone-inner h2{font-family:var(--display);letter-spacing:.02em;margin:0 0 .5rem;font-size:1.55rem;font-weight:400}.dropzone-inner p{color:var(--text-dim);margin:0;font-size:.85rem}.dropzone-status{font-family:var(--mono);color:var(--bronze)!important;margin-top:1rem!important;font-size:.76rem!important}.dropzone-error{color:#f0b3ae!important;margin-top:1rem!important;font-size:.8rem!important}.drop-overlay{border:1px dashed var(--bronze);font-family:var(--display);letter-spacing:.03em;z-index:40;pointer-events:none;background:#0d0f13e6;border-radius:4px;justify-content:center;align-items:center;font-size:1.3rem;display:flex;position:absolute;inset:12px}.toast{z-index:50;cursor:pointer;max-width:330px;padding:.7rem .9rem;font-size:.78rem;line-height:1.45;position:absolute;bottom:1.1rem;right:1.1rem}.toast-warn{background:var(--steel-raised);border-left:2px solid var(--bronze);color:var(--text);box-shadow:0 10px 26px #00000080}.progress-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:60;background:#0d0f13d1;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.progress-card{text-align:center;background:var(--steel-raised);border:1px solid var(--rule);border-radius:4px;padding:1.8rem 2.6rem;box-shadow:0 20px 50px #0009}.progress-card p{margin:.9rem 0 0;font-size:.86rem}.progress-sub{color:var(--text-dim);font-family:var(--mono);margin-top:.3rem!important;font-size:.71rem!important}.spinner{border:2px solid var(--rule-bright);border-top-color:var(--bronze);border-radius:50%;width:30px;height:30px;margin:0 auto;animation:.85s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=1100px){.workspace{grid-template-rows:1fr 1fr;grid-template-columns:1fr 300px}.panel{grid-area:1/2/3}.workspace>.viewport-wrap+.viewport-wrap{border-left:none;border-top:1px solid var(--rule)}}