:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#08090b;--surface:#0d0f12;--surface-raised:#12151a;--surface-soft:#101216;--canvas:#0a0c0f;--line:#23272d;--line-strong:#343a42;--text:#f4f5f6;--muted:#999fa8;--subtle:#666d76;--accent:#d7ff52;--accent-ink:#121507;--danger:#ff8c8c;--warning:#e9c46a;--radius-xl:24px;--radius-lg:18px;--radius-md:13px}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth;min-width:320px}body{background:var(--bg);min-height:100vh;color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,summary{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,[role=button]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.app-shell{width:min(1420px,100% - 40px);margin:0 auto;padding:18px 0 28px}.site-header{justify-content:space-between;align-items:center;min-height:46px;display:flex}.wordmark{color:var(--text);letter-spacing:.12em;font-size:15px;font-weight:820;text-decoration:none}.wordmark span{color:var(--accent)}.header-meta{color:var(--subtle);letter-spacing:.025em;font-size:11px}.product-intro{grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);align-items:end;gap:48px;padding:44px 2px 30px;display:grid}.kicker{color:var(--accent);letter-spacing:.14em;text-transform:uppercase;margin:0 0 11px;font-size:10px;font-weight:760;line-height:1}h1{letter-spacing:-.055em;max-width:780px;margin:0;font-size:clamp(36px,4.9vw,68px);font-weight:760;line-height:.98}.intro-copy{max-width:510px;color:var(--muted);margin:0 0 4px auto;font-size:14px;line-height:1.65}.studio{border:1px solid var(--line);border-radius:var(--radius-xl);background:var(--surface);grid-template-columns:minmax(0,1fr) 350px;min-width:0;display:grid;overflow:clip}.stage-panel{background:var(--canvas);min-width:0}.stage-toolbar{border-bottom:1px solid var(--line);background:var(--surface);justify-content:space-between;align-items:center;gap:16px;min-height:58px;padding:0 14px 0 18px;display:flex}.workspace-status{min-width:0;color:var(--muted);letter-spacing:.025em;align-items:center;gap:9px;font-size:11px;display:flex}.status-dot{background:#535a63;border-radius:50%;flex:none;width:7px;height:7px}.status-selected,.status-success{background:var(--accent);box-shadow:0 0 0 4px #d7ff5212}.status-processing{background:var(--accent);animation:1.4s ease-in-out infinite pulse}.status-warning{background:var(--warning)}.status-error{background:var(--danger)}.stage-actions{justify-content:flex-end;align-items:center;gap:8px;display:flex}.view-controls{border:1px solid var(--line);background:#090b0e;border-radius:11px;gap:2px;padding:3px;display:inline-flex}.view-controls button{min-height:32px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:8px;padding:0 11px;font-size:10px}.view-controls button.is-active{color:var(--text);background:#1b1f24}.icon-button,.text-button{cursor:pointer;background:0 0;border:0}.icon-button{width:38px;height:38px;color:var(--muted);border-radius:10px;place-items:center;display:grid}.icon-button:hover:not(:disabled){color:var(--text);background:#171a1f}.icon-button svg{width:17px;height:17px}.icon-button svg path,.primary-action svg path,.download-action svg path,.file-card-icon svg path,.preview-fallback svg path,.empty-frame svg path,.empty-spark svg path{stroke:currentColor;stroke-width:1.65px;stroke-linecap:round;stroke-linejoin:round}.canvas-shell{background:var(--canvas);min-width:0;padding:12px}.dropzone,.preview-stage{border-radius:16px;min-height:610px;overflow:hidden}.dropzone{border:1px dashed var(--line-strong);text-align:center;cursor:pointer;background:#0c0e11;place-content:center;justify-items:center;padding:32px;transition:border-color .18s,background-color .18s,transform .18s;display:grid}.dropzone:hover,.dropzone.is-dragging{background:#0f120e;border-color:#d7ff52ad}.dropzone.is-dragging{transform:scale(.998)}.empty-graphic{width:110px;height:96px;margin-bottom:24px;position:relative}.empty-frame{color:#8d949d;background:#12151a;border:1px solid #2b3037;border-radius:22px;place-items:center;display:grid;position:absolute;inset:8px 10px 0 0;transform:rotate(-4deg)}.empty-frame svg{width:38px;height:38px}.empty-spark{width:42px;height:42px;color:var(--accent);background:#15190e;border:1px solid #353c29;border-radius:14px;place-items:center;display:grid;position:absolute;top:0;right:0}.empty-spark svg{width:20px;height:20px}.drop-copy{justify-items:center;gap:6px;display:grid}.drop-copy strong{letter-spacing:-.01em;font-size:18px;font-weight:700}.drop-copy span{color:var(--muted);font-size:13px}.drop-meta{color:#626a73;letter-spacing:.07em;text-transform:uppercase;margin-top:18px;font-size:9px}.preview-stage{isolation:isolate;background-color:#101318;place-items:center;display:grid;position:relative}.preview-bg-checker{background-color:#111419;background-image:linear-gradient(45deg,#1b1f25 25%,#0000 25%),linear-gradient(-45deg,#1b1f25 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#1b1f25 75%),linear-gradient(-45deg,#0000 75%,#1b1f25 75%);background-position:0 0,0 11px,11px -11px,-11px 0;background-size:22px 22px}.preview-bg-black{background:#000}.preview-bg-white{background:#fff}.preview-image{object-fit:contain;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;inset:0}.preview-fallback{color:var(--muted);text-align:center;justify-items:center;gap:8px;padding:28px;display:grid}.preview-fallback svg{width:34px;height:34px;color:var(--subtle);margin-bottom:8px}.preview-fallback strong{text-overflow:ellipsis;white-space:nowrap;max-width:440px;color:var(--text);font-size:13px;font-weight:660;overflow:hidden}.preview-fallback span{max-width:390px;color:var(--subtle);font-size:11px;line-height:1.5}.compare-layer,.compare-slice{position:absolute;inset:0}.compare-slice{overflow:hidden}.compare-divider{z-index:4;pointer-events:none;background:#ffffffe6;width:1px;position:absolute;top:0;bottom:0}.compare-divider span{color:#111317;background:#f4f5f6;border-radius:50%;place-items:center;width:36px;height:36px;margin:-18px 0 0 -18px;font-size:13px;display:grid;position:absolute;top:50%;left:50%;box-shadow:0 4px 24px #0000004d}.compare-range{opacity:0;cursor:ew-resize;z-index:5;width:100%;height:100%;position:absolute;inset:0}.processing-overlay{z-index:8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);text-align:center;background:#080a0cd6;place-content:center;justify-items:center;gap:8px;padding:24px;display:grid;position:absolute;inset:0}.processing-overlay strong{margin-top:7px;font-size:14px;font-weight:690}.processing-overlay>span:last-child{color:var(--muted);font-size:11px}.processing-spinner,.button-spinner{border:2px solid #d7ff5233;border-top-color:var(--accent);border-radius:50%;width:18px;height:18px;animation:.72s linear infinite spin;display:inline-block}.button-spinner{border-color:#111508 #0f120833 #0f120833;width:14px;height:14px}.stage-footer{border-top:1px solid var(--line);background:var(--surface);min-height:54px;color:var(--muted);justify-content:space-between;align-items:center;gap:14px;padding:0 17px;font-size:10px;display:flex}.swatch-group{gap:9px;display:flex}.swatch{cursor:pointer;border:1px solid #343941;border-radius:8px;width:28px;height:28px;padding:0}.swatch.is-active{box-shadow:0 0 0 2px var(--surface), 0 0 0 3px var(--accent)}.swatch-black{background:#000}.swatch-white{background:#fff}.swatch-checker{background-color:#15191f;background-image:linear-gradient(45deg,#2d333c 25%,#0000 25%),linear-gradient(-45deg,#2d333c 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#2d333c 75%),linear-gradient(-45deg,#0000 75%,#2d333c 75%);background-position:0 0,0 4px,4px -4px,-4px 0;background-size:8px 8px}.inspector{border-left:1px solid var(--line);background:var(--surface);min-width:0;padding:22px}.inspector-head{border-bottom:1px solid var(--line);padding:2px 1px 20px}.inspector-head>div{gap:6px;display:grid}.eyebrow{color:var(--accent);letter-spacing:.14em;font-size:9px;font-weight:780}.inspector h2{letter-spacing:-.025em;margin:0;font-size:20px;font-weight:710;line-height:1.15}.inspector-head p{color:var(--muted);margin:10px 0 0;font-size:11px;line-height:1.55}.start-panel{padding-top:20px}.file-card{border:1px solid var(--line);background:#0a0c0f;border-radius:13px;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;margin-top:18px;padding:10px;display:grid}.file-card-icon{width:38px;height:38px;color:var(--muted);background:#12151a;border:1px solid #272c32;border-radius:10px;place-items:center;display:grid}.file-card-icon svg{width:18px;height:18px}.file-summary{gap:4px;min-width:0;display:grid}.file-name{white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:650;overflow:hidden}.file-details{color:var(--subtle);font-size:9px}.text-button{min-height:34px;color:var(--muted);border-radius:8px;padding:0 7px;font-size:10px}.text-button:hover:not(:disabled){color:var(--text);background:#171a1f}.control-section{margin-top:20px}.keep-row label{justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:8px;font-size:11px;font-weight:690;display:flex}.keep-row label em{color:var(--subtle);letter-spacing:.02em;font-size:9px;font-style:normal;font-weight:520}.keep-row input{border:1px solid var(--line);width:100%;height:48px;color:var(--text);background:#090b0e;border-radius:12px;outline:0;padding:0 13px;font-size:16px;transition:border-color .15s,box-shadow .15s}.keep-row input::placeholder{color:#555c65}.keep-row input:focus{border-color:#d7ff528c;box-shadow:0 0 0 3px #d7ff520f}.keep-row p{color:var(--subtle);margin:7px 1px 0;font-size:9px;line-height:1.5}.advanced{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:16px}.advanced summary{cursor:pointer;min-height:44px;color:var(--muted);-webkit-user-select:none;user-select:none;align-items:center;font-size:10px;list-style:none;display:flex}.advanced summary::-webkit-details-marker{display:none}.advanced summary:after{content:"+";color:var(--subtle);margin-left:auto;font-size:16px}.advanced[open] summary:after{content:"−"}.advanced-grid{gap:15px;padding:3px 0 17px;display:grid}.advanced-grid label>span{color:var(--muted);justify-content:space-between;gap:10px;margin-bottom:6px;font-size:9px;display:flex}.advanced-grid output{color:#c0c5ca;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.advanced-grid input[type=range]{width:100%;accent-color:var(--accent)}.message{border:1px solid var(--line);color:var(--muted);background:#0a0c0f;border-radius:10px;margin-top:14px;padding:10px 11px;font-size:10px;line-height:1.5}.message-error{color:#ffb0b0;border-color:#ff8c8c40}.message-warning{color:#ead29f;border-color:#e9c46a38}.action-stack{gap:9px;margin-top:18px;display:grid}.primary-action,.download-action{border-radius:13px;justify-content:center;align-items:center;gap:9px;min-height:50px;font-size:11px;font-weight:740;text-decoration:none;display:inline-flex}.primary-action{background:var(--accent);color:var(--accent-ink);cursor:pointer;border:0}.primary-action-large{width:100%;min-height:54px}.primary-action:hover:not(:disabled){filter:brightness(1.025)}.primary-action:disabled{cursor:wait;opacity:.78}.primary-action svg,.download-action svg{width:17px;height:17px}.download-action{border:1px solid var(--line-strong);color:var(--text);cursor:pointer;background:#14171b}.download-action:hover:not(.is-disabled){background:#191d22;border-color:#4a515b}.download-action.is-disabled{color:#616872;cursor:not-allowed}.privacy-note{color:var(--subtle);align-items:flex-start;gap:8px;margin-top:14px;font-size:9px;line-height:1.5;display:flex}.privacy-note-bottom{border-top:1px solid var(--line);padding-top:15px}.privacy-dot{background:var(--accent);opacity:.7;border-radius:50%;flex:none;width:6px;height:6px;margin-top:4px}.site-footer{color:#555d66;justify-content:space-between;gap:20px;padding:15px 3px 0;font-size:9px;line-height:1.5;display:flex}.site-footer p{margin:0}.visually-hidden{clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:.45}50%{opacity:1}}@media (max-width:1080px){.studio{grid-template-columns:minmax(0,1fr) 320px}.inspector{padding:19px}.dropzone,.preview-stage{min-height:540px}}@media (max-width:900px){.app-shell{width:min(100% - 24px,760px);padding-top:12px}.product-intro{grid-template-columns:1fr;gap:16px;padding:40px 2px 24px}.intro-copy{margin:0}.studio{grid-template-columns:1fr}.inspector{border-left:0;border-top:1px solid var(--line)}.dropzone,.preview-stage{min-height:500px}.site-footer{flex-direction:column;gap:4px}}@media (max-width:560px){.app-shell{width:calc(100% - 14px);padding-top:7px}.header-meta{display:none}.product-intro{padding:34px 4px 20px}h1{font-size:clamp(34px,11.8vw,52px)}.intro-copy{font-size:13px}.studio{border-radius:19px}.stage-toolbar{min-height:54px;padding:0 9px 0 13px}.workspace-status{font-size:10px}.stage-actions{gap:5px;min-width:0}.view-controls{min-width:0}.view-controls button{padding-inline:8px;font-size:9px}.icon-button{width:36px;height:36px}.canvas-shell{padding:7px}.dropzone,.preview-stage{border-radius:13px;min-height:390px}.dropzone{padding:24px 16px}.empty-graphic{margin-bottom:16px;transform:scale(.9)}.drop-copy strong{font-size:16px}.drop-copy span{font-size:12px}.drop-meta{max-width:270px;line-height:1.5}.stage-footer{min-height:52px;padding:0 13px}.inspector{padding:18px 14px 16px}.inspector h2{font-size:19px}.file-card{grid-template-columns:36px minmax(0,1fr) auto}.file-card-icon{width:36px;height:36px}.primary-action,.download-action{min-height:52px}}@media (max-width:380px){.view-controls button{padding-inline:6px}.dropzone,.preview-stage{min-height:350px}.stage-footer>span{display:none}.stage-footer{justify-content:flex-end}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
.pages-mode .privacy-note-bottom{display:none}
:root{--bg:#050505;--surface:#080808;--surface-raised:#0b0b0b;--surface-soft:#090909;--canvas:#060606;--line:#f1eee81a;--line-strong:#f1eee838;--text:#f1eee8;--muted:#f1eee880;--subtle:#f1eee842;--accent:#f1eee8;--accent-ink:#050505;--radius-xl:5px;--radius-lg:4px;--radius-md:3px;--warp-cyan:#76e7ff;--warp-violet:#7c80ff;--warp-magenta:#df80ff;--warp-peach:#ffad9e;--warp-amber:#ffd977}body{background:radial-gradient(circle at 50% 20%, #ffffff05, transparent 34rem), var(--bg);font-family:Helvetica Neue,Arial Nova,Arial,sans-serif;font-weight:300}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,[role=button]:focus-visible{outline-offset:4px;outline:1px solid #f1eee8b8}.app-shell{width:min(92rem,100% - clamp(2rem,7vw,8rem));padding-top:0}.site-header{border-bottom:1px solid var(--line);min-height:5rem}.wordmark{color:#f1eee8bd;letter-spacing:.28em;text-transform:lowercase;padding-left:.2em;font-size:.62rem;font-weight:300}.wordmark span{color:inherit}.header-meta{color:var(--subtle);letter-spacing:.15em;text-transform:lowercase;font-size:.52rem;font-weight:300}.product-intro{grid-template-columns:minmax(0,1.25fr) minmax(17rem,.75fr);gap:clamp(2rem,7vw,7rem);padding:clamp(4.5rem,10vw,8.5rem) 0 clamp(3.5rem,7vw,5.5rem);position:relative}.product-intro:before{content:"";background:linear-gradient(90deg, var(--warp-cyan), var(--warp-violet) 24%, var(--warp-magenta) 48%, var(--warp-peach) 72%, var(--warp-amber));opacity:.42;width:min(32rem,62%);height:1px;position:absolute;top:clamp(2.2rem,5vw,4rem);left:0}.kicker,.eyebrow{color:var(--subtle);letter-spacing:.2em;text-transform:lowercase;font-size:.52rem;font-weight:300}h1{color:#f1eee8eb;letter-spacing:-.045em;max-width:54rem;font-size:clamp(2.5rem,6.4vw,6rem);font-weight:200;line-height:.95}.intro-copy{color:var(--muted);letter-spacing:.05em;font-size:clamp(.72rem,1vw,.88rem);font-weight:300;line-height:1.85}.studio{border-color:var(--line);border-radius:var(--radius-xl);background:var(--surface);box-shadow:none}.stage-panel,.canvas-shell{background:var(--canvas)}.stage-toolbar,.stage-footer,.inspector{background:var(--surface)}.stage-toolbar,.stage-footer,.inspector,.inspector-head,.advanced,.privacy-note-bottom{border-color:var(--line)}.workspace-status,.stage-footer,.inspector-head p,.keep-row label,.keep-row p,.advanced summary,.advanced-grid label>span,.privacy-note{letter-spacing:.04em;font-weight:300}.status-selected,.status-success,.status-processing{box-shadow:none;background:#f1eee8c7}.view-controls{border-color:var(--line);background:0 0;border-radius:2px;padding:0}.view-controls button{letter-spacing:.05em;border-radius:0;font-weight:300}.view-controls button.is-active{color:#f1eee8e0;background:#f1eee814}.icon-button,.text-button,.swatch,.file-card,.file-card-icon,.keep-row input,.message,.primary-action,.download-action{border-radius:3px}.icon-button:hover:not(:disabled),.text-button:hover:not(:disabled){background:#f1eee80d}.dropzone,.preview-stage{border-radius:3px}.dropzone{border:1px solid var(--line-strong);background:#070707}.dropzone:hover,.dropzone.is-dragging{background:#090909;border-color:#f1eee870}.empty-graphic{width:10rem;height:5rem;margin-bottom:2rem}.empty-frame{color:#0000;background:#f1eee838;border:0;border-radius:0;height:1px;inset:50% 0 auto;transform:none}.empty-frame svg{display:none}.empty-spark{color:#f1eee8b3;background:0 0;border:0;border-radius:50% 50% 45% 45%;width:4.2rem;height:2rem;top:calc(50% - 1rem);right:36%}.empty-spark:before{content:"";background:linear-gradient(90deg, transparent, var(--warp-violet), var(--warp-magenta), var(--warp-peach), transparent);opacity:.52;height:1px;position:absolute;inset:50% -3rem auto}.empty-spark svg{width:1rem;height:1rem}.drop-copy strong{color:#f1eee8db;letter-spacing:.02em;font-size:1rem;font-weight:300}.drop-copy span,.drop-meta{letter-spacing:.06em;font-weight:300}.preview-stage,.preview-bg-checker{background-color:#080808}.processing-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#050505e0}.processing-spinner{border-color:#f1eee8d1 #f1eee829 #f1eee829}.swatch.is-active{box-shadow:0 0 0 1px var(--surface), 0 0 0 2px #f1eee8b8}.inspector{padding:clamp(1.25rem,2.5vw,2rem)}.inspector h2{color:#f1eee8db;letter-spacing:-.015em;font-size:1.15rem;font-weight:300}.file-card{background:#070707}.file-card-icon{border-color:var(--line);background:#090909}.keep-row label{color:#f1eee89e;font-weight:300}.keep-row input{border-color:var(--line);color:var(--text);background:#060606}.keep-row input:focus{border-color:#f1eee870;box-shadow:0 0 0 2px #f1eee80d}.advanced-grid input[type=range]{accent-color:#f1eee8cc}.message{background:#070707}.primary-action,.download-action{letter-spacing:.08em;min-height:3.1rem;font-weight:300}.primary-action{color:#050505;background:#f1eee8eb;border:1px solid #f1eee86b;position:relative}.primary-action:before{content:"";background:linear-gradient(90deg, var(--warp-cyan), var(--warp-violet), var(--warp-magenta), var(--warp-peach), var(--warp-amber));opacity:.72;height:1px;position:absolute;top:-1px;left:0;right:0}.download-action{border-color:var(--line-strong);color:#f1eee8d1;background:0 0}.download-action:hover:not(.is-disabled){background:#f1eee80a;border-color:#f1eee861}.privacy-dot{background:#f1eee894}.site-footer{color:#f1eee833;letter-spacing:.08em;text-transform:lowercase;padding-top:1.4rem;font-size:.5rem;font-weight:300}@media (max-width:900px){.app-shell{width:min(100% - 2rem,48rem)}.product-intro{gap:1.5rem}}@media (max-width:560px){.app-shell{width:calc(100% - 1.2rem)}.product-intro{padding-top:4rem}.product-intro:before{width:72%;top:2rem}h1{font-size:clamp(2.5rem,13vw,4.5rem)}.studio{border-radius:3px}.dropzone,.preview-stage{border-radius:2px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}