@font-face{font-family:Manrope;src:url(/fonts/manrope.ttf) format("truetype");font-weight:200 800;font-display:swap}:root{font-family:Manrope,Arial,sans-serif;color:#edf1f9;background:#080c16;font-synthesis:none;--mint:#9aefd6;--muted:#9caac0;--line:#252e40;--panel:#111824;color-scheme:dark;font-weight:500;font-size:14px}*{box-sizing:border-box}body{margin:0}button,input,summary{font:inherit}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;border:0;background:none;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;transition:background .16s,color .16s,border-color .16s}button:disabled{opacity:.35;cursor:default}button:not(:disabled):active{transform:translateY(1px)}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,canvas:focus-visible{outline:2px solid var(--mint);outline-offset:5px}button:hover:not(:disabled){color:#fff}::selection{background:#9aefd6;color:#081911}input{caret-color:var(--mint)}.icon{width:20px;height:20px;flex-shrink:0}a{color:inherit;text-decoration:none}h2,h3,p{margin:0}#app{min-height:100svh;height:100svh;display:flex;flex-direction:column;overflow:hidden}.topbar{height:100px;flex-shrink:0;padding:0 38px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #1b2333;background:#0a0f1a;z-index:3}.brand{display:flex;align-items:center;gap:13px;font-size:23px;font-weight:750;letter-spacing:-.9px}.brand-mark{color:var(--mint);display:grid;place-items:center;width:41px;height:41px}.brand-mark .icon{width:41px;height:41px;stroke-width:1.35}.brand-caption{display:block;color:var(--muted);font-size:11px;letter-spacing:.2px;font-weight:450;margin-top:3px}.top-actions{display:flex;gap:24px;align-items:center}.quiet{color:#aab6cb;padding:0 10px;font-size:12px;font-weight:600;border-radius:8px}.quiet:hover:not(:disabled),.icon-button:hover:not(:disabled){background:#202b3b;color:#fff}.primary{background:var(--mint);color:#102922;font-size:12px;font-weight:800;padding:0 21px;min-height:44px;border-radius:9px;box-shadow:0 5px 18px #0002}.primary:hover:not(:disabled){background:#b8ffe8;color:#102922}.primary .icon{width:17px;height:17px}.mobile-export{display:none}.workspace{position:relative;flex:1;min-height:0}.stage{position:absolute;inset:0 0 0 316px;overflow:hidden}#canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair;outline-offset:-5px}.canvas-top,.canvas-bottom{position:absolute;left:32px;right:35px;display:flex;justify-content:space-between;align-items:center;z-index:1;pointer-events:none}.canvas-top{top:28px}.canvas-bottom{bottom:24px}.canvas-top button,.canvas-top input,.canvas-bottom button{pointer-events:auto}.artwork-name{display:flex;align-items:center;gap:10px;color:#8191a9}.artwork-name>.icon{width:14px;height:14px}.artwork-name input{background:transparent;color:#b6c3d6;border:0;padding:8px 0;width:110px;font-size:12px;outline-offset:3px}.sample-tag{font-size:9px;border:1px solid #263347;border-radius:5px;padding:5px 7px;letter-spacing:.1px;color:#8d9db5}.icon-button{width:44px;flex-shrink:0;border-radius:8px;color:#aab6cb}.canvas-hint{display:flex;align-items:center;gap:9px;color:#8493ac;font-size:11px}.canvas-hint .icon{width:15px;height:15px}.canvas-hint strong{font-weight:600;color:#b0bed2}.canvas-bottom .quiet{font-size:10px;gap:7px}.canvas-bottom .icon{height:14px;width:14px}.touch-hint{display:none}.tools{position:absolute;left:32px;top:36px;width:270px;z-index:2}.tool-intro{display:flex;align-items:center;gap:8px;color:#b7c3d4;margin:0 0 20px 5px;font-size:11px}.little-star{color:var(--mint);display:flex}.little-star .icon{width:15px;height:15px}.tool-body{background:var(--panel);border:1px solid #293144;border-radius:16px;padding:21px 18px 0;box-shadow:0 20px 40px #03060c33}.label-row{display:flex;justify-content:space-between;align-items:center;gap:6px}.label-row h2,.label-row label{font-size:12px;font-weight:650;letter-spacing:.1px}.tiny-label{font-size:8px;color:#8b9bb3}.brush-modes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:13px}.brush-mode{border:1px solid #2c3548;min-height:85px;border-radius:9px;flex-direction:column;gap:6px;position:relative;color:#98a8c0;font-size:12px}.brush-mode .icon{width:27px;height:27px;stroke-width:1.35}.brush-mode.selected{background:#17302e;border-color:#5da68f;color:#a6f5da}.brush-mode:hover:not(:disabled){background:#1c2b36}.brush-mode kbd{position:absolute;top:7px;right:7px;font-size:7px;color:#8a9caf;border:0;background:none;padding:0;min-width:0}.brush-mode.selected kbd{color:#7cae9e}.palette-section{margin-top:26px}.label-row>#palette-name{font-size:10px;color:var(--mint);font-weight:550}.palettes{display:flex;gap:3px;justify-content:space-between;margin-top:11px}.palette{position:relative;padding:5px;min-width:44px;min-height:44px;border-radius:50%;border:1px solid transparent}.palette-orb{height:29px;width:29px;display:block;border-radius:50%;background:radial-gradient(circle at 27% 22%,var(--c1),transparent 70%),radial-gradient(circle at 80% 70%,var(--c3),transparent 65%),var(--c2);box-shadow:inset 0 0 4px #fff3}.palette.selected{border-color:#a0e7d2}.palette:hover{background:#263146}.palette-check{display:none;position:absolute;inset:0;align-items:center;justify-content:center;color:#fff}.palette.selected .palette-check{display:flex}.palette-check .icon{width:14px;height:14px;stroke-width:2;filter:drop-shadow(0 1px 2px #000)}.palette-description{font-size:9px;color:#8f9db4;margin:8px 1px 0}.sliders{display:flex;flex-direction:column;gap:24px;margin-top:26px}.label-row output{font-size:11px;color:#c8d7e7;font-variant-numeric:tabular-nums}.label-row output span{font-size:9px;color:#899ab3}input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:44px;min-height:44px;background:transparent;margin:8px 0 0;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(to right,#99ddc7 var(--progress),#30394b var(--progress))}input[type=range]::-moz-range-track{height:3px;border-radius:3px;background:#30394b}input[type=range]::-moz-range-progress{height:3px;background:#99ddc7}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;height:12px;width:12px;border:3px solid #d8f9ec;border-radius:50%;background:#b2e7d6;margin-top:-4.5px;box-shadow:0 2px 6px #0005}input[type=range]::-moz-range-thumb{height:8px;width:8px;border:2px solid #d8f9ec;border-radius:50%;background:#b2e7d6}.range-ends{display:flex;justify-content:space-between;color:#8d9ab0;font-size:8px;margin-top:0}.history-actions{display:flex;gap:0;margin-top:24px;border-top:1px solid #273044;padding:10px 0}.history-actions .quiet{font-size:10px;gap:7px;padding:0 7px}.history-actions .icon{width:16px;height:16px}.history-actions .icon-button{width:44px}.divider{height:17px;width:1px;background:#2a3446;margin:auto 6px auto auto}.tool-note{margin-top:17px;text-align:center;color:#74869f;font-size:9px}.footer{height:49px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 38px;border-top:1px solid #1b2434;background:#0a0f1a;z-index:3;font-size:9px;color:#8091aa}.save-status{display:flex;align-items:center;gap:7px}.status-dot{height:5px;width:5px;border-radius:50%;background:#91ddbf}.status-dot.unsaved{background:#e4b47b}.footer-center{font-size:9px;color:#7687a1}.keyboard-button{font-size:9px;gap:8px;min-height:44px;padding:0}.keyboard-button kbd{font-size:10px;border-color:#384154;color:#a4b2c7;width:20px;height:20px;display:grid;place-items:center}kbd{font-family:inherit;font-size:10px;display:inline-block;border:1px solid #3c495f;background:#172133;border-radius:4px;padding:2px 5px;line-height:1.4;white-space:nowrap}.empty-message{position:absolute;top:44%;left:10%;right:10%;text-align:center;pointer-events:none}.empty-message>span{font-size:clamp(20px,3vw,34px);font-weight:600;letter-spacing:-.8px;color:#c2d5e2}.empty-message p{font-size:12px;color:#90a6b9;margin-top:12px}.empty-message[hidden],.sample-tag[hidden]{display:none}#brush-cursor{position:absolute;border:1px solid var(--brush-color,#9aefd6);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;opacity:0;z-index:1;background:#9aefd605;min-width:8px;min-height:8px}#brush-cursor:after{content:"";position:absolute;width:3px;height:3px;border-radius:50%;background:var(--brush-color);top:calc(50% - 1.5px);left:calc(50% - 1.5px)}#brush-cursor.visible{opacity:.55}.focus-mode .tools{display:none}.focus-mode .stage{left:0}.toast{position:fixed;bottom:75px;left:50%;transform:translate(-50%,12px);opacity:0;pointer-events:none;padding:13px 21px;background:#1d3434;border:1px solid #496c65;color:#d3f8e9;border-radius:10px;max-width:min(90vw,500px);width:max-content;font-size:12px;z-index:20;transition:opacity .2s,transform .2s;box-shadow:0 8px 25px #0003;text-align:center}.toast.visible{opacity:1;transform:translate(-50%)}dialog{border:1px solid #354052;background:#111a28;color:#e6eff8;border-radius:20px;padding:34px;max-width:490px;width:calc(100% - 32px);box-shadow:0 30px 100px #0007;max-height:calc(100svh - 40px);overflow-y:auto}dialog::backdrop{background:#030710ba;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.dialog-close{position:absolute;right:13px;top:13px}.dialog-mark{display:grid;place-items:center;width:54px;height:54px;border:1px solid #31594f;border-radius:15px;color:var(--mint);margin-bottom:24px}.dialog-mark .icon{width:29px;height:29px}dialog h2{font-size:24px;letter-spacing:-.7px;font-weight:650;margin:0 25px 17px 0;line-height:1.3;text-wrap:balance}.about-lines{font-size:12px;color:#b2c1d5;line-height:1.9}.help-grid{border-top:1px solid #2a3547;border-bottom:1px solid #2a3547;margin:25px 0;padding:20px 0;display:grid;gap:18px}.help-grid h3{font-size:12px;color:#d9ede8;margin-bottom:7px}.help-grid p{color:#a8b9ce;font-size:11px;line-height:1.75}summary{cursor:pointer;color:#bad7ce;font-size:12px;min-height:36px;line-height:36px}dl{display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px 14px;margin:10px 0 20px;font-size:10px;color:#b5c7da}dd{margin:0;text-align:right}.dialog-done{width:100%;margin-top:21px;min-height:46px}.dialog-subtitle{font-size:12px;color:#a7b9ce;line-height:1.8;max-width:55ch}.export-options{margin:24px 0 0;padding:0;border:0}.export-options legend{font-size:11px;color:#d7e1ed;margin-bottom:12px}.export-options label{position:relative;display:flex;align-items:center;gap:15px;padding:15px;border:1px solid #2d3b50;border-radius:9px;margin:8px 0;font-size:12px;cursor:pointer;min-height:70px}.export-options label:has(input:checked){border-color:#91d0b9;background:#19312f}.export-options label:has(input:focus-visible){outline:2px solid var(--mint);outline-offset:3px}.export-options small{display:block;color:#96abc1;font-size:10px;margin-top:4px}.export-options input{position:absolute;opacity:0}.format-icon{display:block;border:1.5px solid #a3bec4;border-radius:3px;width:28px;height:19px;flex-shrink:0;margin:0 4px}.format-icon.portrait{width:16px;height:27px;margin:0 10px}.format-icon.square{width:23px;height:23px;margin:0 6.5px}.radio-mark{width:15px;height:15px;border:1px solid #668278;border-radius:50%;margin-left:auto}.export-options input:checked~.radio-mark{border:4px solid #a2e9ce}.export-footnote{color:#8fa5bc;font-size:10px;text-align:center;margin-top:15px}.canvas-fallback{position:absolute;top:40%;left:10%;right:10%;color:#c8e1d7;text-align:center;font-size:18px;line-height:1.7}*{scrollbar-width:thin;scrollbar-color:#3b5060 #101824}@media(min-width:1500px){.tools{left:48px;width:286px;top:48px}.stage{left:356px}.tool-body{padding:25px 22px 0}.palette-section{margin-top:30px}.sliders{margin-top:30px;gap:28px}.history-actions{margin-top:30px}.topbar,.footer{padding:0 48px}}@media(max-height:760px)and (min-width:761px){.topbar{height:82px}.tools{top:20px}.tool-intro{margin-bottom:13px}.tool-body{padding-top:15px}.brush-mode{min-height:70px}.palette-section{margin-top:17px}.sliders{margin-top:16px;gap:14px}.history-actions{margin-top:16px}.tool-note{margin-top:12px}.footer{height:42px}.canvas-top{top:18px}}@media(max-width:1000px)and (min-width:761px){.tools{left:20px;width:270px}.stage{left:295px}.topbar,.footer{padding:0 25px}.sample-tag{display:none}.canvas-top,.canvas-bottom{left:20px;right:20px}.desktop-hint,.footer-center{display:none}.palette{min-width:44px;padding:3px}.tiny-label{display:none}}@media(max-width:760px){#app{height:auto;min-height:100svh;overflow:visible}.topbar{height:78px;padding:0 18px;gap:10px}.brand{font-size:19px;letter-spacing:-.6px;gap:7px}.brand-caption{font-size:8px;letter-spacing:.1px}.brand-mark{width:30px;height:35px}.brand-mark .icon{width:32px;height:32px}.top-actions{gap:5px}.about-button{width:44px;padding:0}.about-button span{display:none}.about-button .icon{width:18px;height:18px}.top-actions .primary{padding:0 13px;gap:7px;font-size:11px;min-height:42px}.top-actions .primary>span:not(.mobile-export){display:none}.mobile-export{display:inline}.workspace{display:flex;flex-direction:column;min-height:0;flex:none}.stage{position:relative;inset:auto;height:clamp(320px,44svh,490px);width:100%;flex-shrink:0}.canvas-top{top:12px;left:20px;right:13px}.artwork-name{gap:8px}.artwork-name input{font-size:11px;width:99px}.sample-tag{font-size:7px;padding:4px 5px}.canvas-top>.icon-button{width:44px;min-height:44px}.canvas-top>.icon-button .icon{width:17px;height:17px}.canvas-bottom{bottom:11px;left:21px;right:14px}.canvas-hint{font-size:9px;gap:6px}.canvas-hint .icon{height:12px;width:12px}.canvas-bottom .quiet{font-size:9px;min-height:44px;gap:5px;padding:0 5px}.canvas-bottom .icon{width:12px;height:12px}.desktop-hint{display:none}.touch-hint{display:inline}.tools{position:relative;left:auto;top:auto;width:auto;margin:0 16px;z-index:2}.tool-intro{display:none}.tool-body{padding:18px 17px 0;border-radius:15px;display:grid;grid-template-columns:1fr 1fr;gap:0 20px;position:relative}.tool-body>.label-row{grid-column:1}.tool-body .tiny-label{display:none}.brush-modes{grid-column:1 / -1;grid-row:2;gap:8px;margin-top:10px}.brush-mode{min-height:48px;gap:9px;font-size:11px;flex-direction:row}.brush-mode .icon{width:23px;height:23px}.brush-mode kbd{display:none}.palette-section{grid-column:1 / -1;grid-row:3;margin:16px 0 0;display:flex;align-items:center;gap:10px}.palette-section .label-row{gap:5px;flex:1;flex-direction:column;align-items:flex-start}.label-row h2,.label-row label{font-size:11px}.label-row>#palette-name{font-size:8px}.palettes{gap:0;margin:0;flex-wrap:nowrap;justify-content:flex-start}.palette{min-width:44px;min-height:44px;padding:5px;width:44px}.palette-orb{height:29px;width:29px}.palette-check .icon{width:11px;height:11px}.palette-description{display:none}.sliders{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:22px}.label-row output{font-size:10px}.range-ends{font-size:7px}input[type=range]{margin-top:8px;height:29px}.history-actions{grid-column:1 / -1;justify-content:center;margin-top:18px;padding:6px 0;gap:10px}.history-actions .quiet{padding:0 12px;font-size:11px}.history-actions .icon-button{width:44px}.divider{margin:auto 6px;height:16px}.tool-note{font-size:8px;margin-top:13px;margin-bottom:16px}.footer{position:relative;height:44px;padding:0 23px;font-size:8px;margin-top:auto}.footer-center{display:none}.keyboard-button{font-size:8px}.keyboard-button kbd{width:18px;height:18px}.empty-message>span{font-size:22px}.empty-message p{font-size:10px}.focus-mode .stage{height:calc(100svh - 122px)}.toast{bottom:65px;font-size:11px;max-width:calc(100% - 30px);padding:12px 17px}.about-lines{font-size:11px}dialog{padding:28px 23px}dialog h2{font-size:23px}.dialog-mark{margin-bottom:20px}.help-grid{margin:21px 0}dl{grid-template-columns:1fr;gap:5px}dd{text-align:left;margin-bottom:7px}.dialog-done{margin-top:14px}}@media(pointer:coarse){input[type=range]{min-height:44px;margin-top:0}.range-ends{margin-top:-5px}.palette{min-height:44px}.desktop-hint{display:none}.touch-hint{display:inline}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}