@font-face{font-family:Bedpro;src:url(/fonts/Bedpro.ttf)format("truetype");font-display:swap}@font-face{font-family:Outfit;src:url(/fonts/Outfit-Variable.ttf)format("truetype");font-weight:100 900;font-display:swap}:root{--navy:#0e1128;--navy-deep:#090b1c;--panel:#12162f;--hairline:#232948;--ink:#e9eaf2;--muted:#8a8fa8;--brand-gradient:linear-gradient(90deg, #b9d98d 0%, #eb6e24 40%, #f16522 70%, #ec4029 100%);--accent:#eb6e24}*{box-sizing:border-box}body{background:var(--navy-deep);color:var(--ink);margin:0;font-family:Outfit,system-ui,sans-serif;font-size:15px;line-height:1.4}.app{max-width:1280px;margin:0 auto;padding:1.5rem 1.5rem 3rem}.app-header{padding:.5rem 0 1.25rem}.app-title{letter-spacing:.04em;text-transform:uppercase;background:var(--brand-gradient);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-family:Bedpro,Outfit,sans-serif;font-size:clamp(1.6rem,4vw,2.4rem)}.app-subtitle{color:var(--muted);margin:.25rem 0 0}.app-main{grid-template-columns:320px minmax(0,1fr);align-items:start;gap:1.5rem;display:grid}@media (width<=820px){.app-main{grid-template-columns:minmax(0,1fr)}}.controls{background:var(--panel);border:1px solid var(--hairline);border-radius:12px;flex-direction:column;gap:1.1rem;padding:1.25rem;display:flex}.field{flex-direction:column;gap:.45rem;display:flex}.field-label{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);justify-content:space-between;align-items:baseline;font-size:.78rem;font-weight:600;display:flex}.slider-value{color:var(--ink);text-transform:none;letter-spacing:0;font-family:ui-monospace,monospace;font-size:.8rem}textarea,select,input[type=text]{background:var(--navy-deep);border:1px solid var(--hairline);color:var(--ink);font:inherit;border-radius:8px;width:100%;padding:.55rem .7rem}textarea{resize:vertical;min-height:4.5rem}textarea:focus-visible,select:focus-visible,input:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.check{color:var(--ink);cursor:pointer;align-items:center;gap:.5rem;font-size:.9rem;display:inline-flex}.check input{accent-color:var(--accent)}input[type=range]{width:100%;accent-color:var(--accent)}.segmented{border:1px solid var(--hairline);border-radius:8px;display:flex;overflow:hidden}.segmented button{border:none;border-right:1px solid var(--hairline);color:var(--muted);font:inherit;cursor:pointer;text-transform:capitalize;background:0 0;flex:1;padding:.45rem .4rem;font-size:.85rem}.segmented button:last-child{border-right:none}.segmented button.active{background:var(--navy);color:var(--ink);box-shadow:inset 0 -2px 0 var(--accent)}.preview-column{flex-direction:column;gap:1rem;min-width:0;display:flex}.preview{flex-direction:column;gap:.6rem;display:flex}.preview-stage{border:1px solid var(--hairline);border-radius:12px;justify-content:center;align-items:center;min-height:320px;padding:1.5rem;display:flex;overflow:hidden}.preview-stage.checkerboard{background:repeating-conic-gradient(#3a3f5c 0% 25%,#23273f 0% 50%) 0 0/24px 24px}.preview-canvas{object-fit:contain;max-width:100%;max-height:60vh}.preview-loading{color:var(--muted)}.preview-meta{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.readout{color:var(--muted);font-family:ui-monospace,monospace;font-size:.85rem}.badge-warning{color:#f28b7d;background:#ec402926;border:1px solid #ec402980;border-radius:999px;padding:.15rem .6rem;font-size:.75rem}.export-bar{background:var(--panel);border:1px solid var(--hairline);border-radius:12px;flex-wrap:wrap;align-items:center;gap:.75rem;padding:.85rem 1rem;display:flex}.export-bar .segmented{flex:none;width:90px}.export-filename{flex:180px;align-items:center;gap:.3rem;min-width:0;display:flex}.export-ext{color:var(--muted);font-family:ui-monospace,monospace}.btn-primary,.btn-secondary{font:inherit;cursor:pointer;border:none;border-radius:8px;padding:.55rem 1.1rem;font-weight:600}.btn-primary{background:var(--brand-gradient);color:#0b0d20}.btn-secondary{background:var(--navy);border:1px solid var(--hairline);color:var(--ink)}button:disabled{opacity:.6;cursor:wait}