@font-face{font-family:Anuphan;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/anuphan-thai-600-normal-Co7SjXAc.woff2)format("woff2"),url(/assets/anuphan-thai-600-normal-CeOd1Bty.woff)format("woff")}@font-face{font-family:Anuphan;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/anuphan-latin-600-normal-C3byZ5Vp.woff2)format("woff2"),url(/assets/anuphan-latin-600-normal-DSdXqWS_.woff)format("woff")}@font-face{font-family:IBM Plex Sans Thai;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-sans-thai-thai-400-normal-Bt1rR4gi.woff2)format("woff2"),url(/assets/ibm-plex-sans-thai-thai-400-normal-DKc8V4lk.woff)format("woff")}@font-face{font-family:IBM Plex Sans Thai;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-sans-thai-latin-400-normal-CwmoKdEh.woff2)format("woff2"),url(/assets/ibm-plex-sans-thai-latin-400-normal-YXrLwNa7.woff)format("woff")}@font-face{font-family:IBM Plex Sans Thai;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/ibm-plex-sans-thai-thai-600-normal-DvfsyWAn.woff2)format("woff2"),url(/assets/ibm-plex-sans-thai-thai-600-normal-BOwfviun.woff)format("woff")}@font-face{font-family:IBM Plex Sans Thai;font-style:normal;font-display:swap;font-weight:600;src:url(/assets/ibm-plex-sans-thai-latin-600-normal-BR-dhaTH.woff2)format("woff2"),url(/assets/ibm-plex-sans-thai-latin-600-normal-P_JjY83V.woff)format("woff")}@font-face{font-family:IBM Plex Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2)format("woff2"),url(/assets/ibm-plex-mono-latin-400-normal-CvHOgSBP.woff)format("woff")}:root{--bg:#eef1ef;--panel:#f8faf9;--line:#d5ddda;--fg:#1b2422;--muted:#5d6b67;--accent:#1f7d74;--accent-ink:#fff;--accent-soft:#dcebe8;--stage:#dfe5e2;--danger:#b3412f;--hist-r:#c9483b;--hist-g:#3f9a57;--hist-b:#3f6fc9;--hist-l:#5d6b67;--font-display:"Anuphan", "IBM Plex Sans Thai", system-ui, sans-serif;--font-body:"IBM Plex Sans Thai", system-ui, sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace;--radius-sm:6px;--radius:8px;--radius-lg:10px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#101615;--panel:#161e1c;--line:#26312e;--fg:#e4ebe8;--muted:#8fa09b;--accent:#4fb3a8;--accent-ink:#071211;--accent-soft:#1c3330;--stage:#0b100f;--danger:#e07a66;--hist-r:#e0776b;--hist-g:#6cc285;--hist-b:#7ba2e6;--hist-l:#8fa09b;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#101615;--panel:#161e1c;--line:#26312e;--fg:#e4ebe8;--muted:#8fa09b;--accent:#4fb3a8;--accent-ink:#071211;--accent-soft:#1c3330;--stage:#0b100f;--danger:#e07a66;--hist-r:#e0776b;--hist-g:#6cc285;--hist-b:#7ba2e6;--hist-l:#8fa09b;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:15px;line-height:1.5}h1,h2,h3{font-family:var(--font-display);margin:0;font-weight:600;line-height:1.3}button,input{font:inherit;color:inherit}button{padding:var(--space-1) var(--space-3);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--panel);cursor:pointer}button:hover:not(:disabled){background:var(--accent-soft)}button:disabled{color:var(--muted);cursor:default;opacity:.6}button.primary{border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}button.primary:hover{background:var(--accent);filter:brightness(1.08)}button[aria-pressed=true],button[aria-selected=true]{border-color:var(--accent);background:var(--accent-soft)}:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.app{grid-template-rows:auto minmax(0,1fr);height:100dvh;display:grid}.topbar{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--line);background:var(--panel);flex-wrap:wrap;display:flex}.topbar h1{margin-inline-end:auto;font-size:18px}.workspace{grid-template-columns:270px minmax(0,1fr) 340px;grid-template-areas:"library stage controls";min-height:0;display:grid}.tabs{gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--panel);grid-area:tabs;display:none}.tabs button{flex:1}.tab-dot{width:8px;height:8px;background:var(--accent);vertical-align:middle;border-radius:50%;margin-inline-start:var(--space-1);display:inline-block}.side-tabs{gap:var(--space-2);margin-bottom:var(--space-3);display:flex}.side-tabs button{flex:1}.panel{min-width:0;min-height:0;padding:var(--space-3) var(--space-4);background:var(--panel);overflow-y:auto}.panel-library{border-inline-end:1px solid var(--line);grid-area:library}.panel-controls{border-inline-start:1px solid var(--line);flex-direction:column;grid-area:controls;display:flex}.panel-controls>*{flex:none}@media (width<=1199px){.workspace{grid-template:"stage controls"minmax(0,1fr)"library controls"220px/minmax(0,1fr) 340px}.panel-library{border-block-start:1px solid var(--line);border-inline-end:0}}@media (width<=819px){.app{height:auto;min-height:100dvh;display:block}.workspace{display:block}.tabs{display:flex}.side-tabs{display:none}.panel{border:0;overflow:visible}.panel:not([data-active=true]){display:none}}.dialog{max-width:min(420px,100vw - 32px);padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--panel);color:var(--fg)}.dialog::backdrop{background:#0006}.dialog h2{margin-bottom:var(--space-3);font-size:18px}.shortcut-list{gap:var(--space-2) var(--space-4);margin:0 0 var(--space-4);grid-template-columns:auto 1fr;display:grid}.visually-contents{display:contents}.shortcut-list dt{font-family:var(--font-mono)}.shortcut-list dd{margin:0}.toasts{inset-inline:var(--space-4);bottom:var(--space-4);z-index:10;justify-items:center;gap:var(--space-2);pointer-events:none;display:grid;position:fixed}.toast{max-width:480px;padding:var(--space-2) var(--space-3);border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);overflow-wrap:anywhere}.toast[data-tone=error]{border-color:var(--danger);color:var(--danger)}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important}}.boot{gap:var(--space-3);max-width:480px;padding:var(--space-4);color:var(--fg);overflow-wrap:anywhere;margin:0 auto;display:grid}.boot h1{font-size:18px}.boot p{margin:0}.boot code{color:var(--muted);font-size:13px}.group{border-bottom:1px solid var(--line);padding-block:var(--space-2)}.group summary{align-items:center;gap:var(--space-2);padding-block:var(--space-1);cursor:pointer;font-family:var(--font-display);font-weight:600;display:flex}.group-dot{background:var(--accent);border-radius:50%;width:8px;height:8px}.param{align-items:center;gap:0 var(--space-2);padding-block:var(--space-1);grid-template-columns:minmax(0,1fr) auto auto;display:grid}.param label{overflow-wrap:anywhere;cursor:default;-webkit-user-select:none;user-select:none;min-width:0;font-size:14px}.param-value{min-width:44px;color:var(--muted);font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:end;grid-column:3;font-size:13px}.param-swatch{border:1px solid var(--line);border-radius:50%;width:12px;height:12px}.param-track{grid-column:1/-1;position:relative}.param-track:before{content:"";top:3px;bottom:3px;left:var(--neutral);background:var(--muted);opacity:.6;width:2px;position:absolute}.param input[type=range]{width:100%;accent-color:var(--accent);margin:0;display:block;position:relative}.param[data-kind=hue] input[type=range]{border-radius:var(--radius-sm);appearance:none;background:linear-gradient(90deg,#e61a1a,#e6e61a,#1ae61a,#1ae6e6,#1a1ae6,#e61ae6,#e61a1a);height:12px}.param[data-kind=hue] input[type=range]::-webkit-slider-thumb{border:2px solid var(--panel);background:var(--accent);appearance:none;border-radius:4px;width:14px;height:18px}.param[data-kind=hue] input[type=range]::-moz-range-thumb{border:2px solid var(--panel);background:var(--accent);border-radius:4px;width:14px;height:18px}.export{width:min(420px,100vw - 32px)}.export[open]{gap:var(--space-3);display:grid}.export h2{margin:0}.export fieldset{gap:var(--space-2);border:0;min-width:0;margin:0;padding:0;display:grid}.export legend{margin-bottom:var(--space-1);color:var(--muted);font-size:14px}.export-formats{gap:var(--space-3);flex-wrap:wrap;display:flex}.export-formats label,.export-check{align-items:center;gap:var(--space-2);display:flex}.export input[type=radio],.export input[type=checkbox],.export input[type=range]{accent-color:var(--accent)}.export-quality{gap:var(--space-1);display:grid}.export-info{color:var(--muted);overflow-wrap:anywhere;margin:0;font-size:13px}.export progress{width:100%;accent-color:var(--accent)}.library-title{margin-block:var(--space-3) var(--space-2);color:var(--muted);font-size:14px}.library-empty{margin:0 0 var(--space-2);color:var(--muted);font-size:13px}.library-search,.prompt-rename,.save-form input{width:100%;padding:var(--space-1) var(--space-2);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg)}.tag-list{gap:var(--space-1);margin-block:var(--space-2);flex-wrap:wrap;display:flex}.tag-list button{padding:0 var(--space-2);font-size:13px}.save-bar,.save-form{gap:var(--space-2);margin-bottom:var(--space-3);display:grid}.save-form label{font-size:14px}.save-status{color:var(--muted);margin:0;font-size:13px}.save-actions{gap:var(--space-2);flex-wrap:wrap;display:flex}.save-actions button{flex:auto}.prompt-list{gap:var(--space-2);margin:0;padding:0;list-style:none;display:grid}.prompt-row{gap:2px;display:grid}.prompt-item{width:100%;padding:var(--space-2) var(--space-3);border-radius:var(--radius);text-align:start;gap:2px;display:grid}.prompt-name{overflow-wrap:anywhere;font-weight:600}.prompt-text{color:var(--muted);overflow-wrap:anywhere;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;font-size:13px;display:-webkit-box;overflow:hidden}.prompt-actions{align-items:center;gap:var(--space-1);flex-wrap:wrap;display:flex}.prompt-actions button{padding:0 var(--space-2);font-size:13px}.prompt-actions button.danger{border-color:var(--danger);color:var(--danger)}.prompt-confirm{flex:100%;font-size:13px}.import-export{gap:var(--space-2);margin-top:var(--space-4);display:flex}.import-export button{flex:1}.reference-window{width:min(1120px,100vw - 16px);max-width:none;max-height:calc(100dvh - 16px)}.reference-window[open]{gap:var(--space-3);display:grid}.reference-window h2{margin:0}.reference-body{gap:var(--space-4);grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;display:grid}.reference-images{gap:var(--space-3);display:grid}.reference-images figure{gap:var(--space-1);margin:0;display:grid}.reference-images img,.reference-images canvas{border-radius:var(--radius-sm);object-fit:contain;background:var(--bg);width:100%;height:auto;max-height:34vh;display:block}.reference-images figcaption,.draft-note{color:var(--muted);overflow-wrap:anywhere;margin:0;font-size:13px}.draft-editor{gap:var(--space-2);min-width:0;display:grid}.draft-title{margin:var(--space-1) 0 0;color:var(--muted);font-size:14px}.draft-sliders{gap:var(--space-2) var(--space-3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.draft-field{gap:var(--space-1);font-size:14px;display:grid}.draft-field input,.draft-field textarea{width:100%;padding:var(--space-1) var(--space-2);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg)}.draft-field textarea{resize:vertical}.draft-warnings,.draft-problem{color:var(--danger);overflow-wrap:anywhere;margin:0;font-size:13px}.draft-warnings{padding-inline-start:var(--space-4)}@media (width<=819px){.reference-body,.draft-sliders{grid-template-columns:minmax(0,1fr)}}.stage{background:var(--stage);grid-area:stage;grid-template-rows:minmax(0,1fr) auto auto;min-width:0;min-height:0;display:grid}.stage-view{min-height:0;padding:var(--space-3);place-items:center;display:grid;overflow:hidden}.stage-view[data-zoomed=true]{cursor:grab;place-items:start;overflow:auto}.stage-hint{max-width:320px;color:var(--muted);text-align:center}.stage-frame{flex:none;position:relative}.stage-frame[hidden],.stage-frame canvas[hidden]{display:none}.stage-frame canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.compare-divider{cursor:ew-resize;touch-action:none;width:24px;margin-inline-start:-12px;position:absolute;top:0;bottom:0}.compare-divider:before{content:"";background:var(--panel);width:2px;box-shadow:0 0 0 1px var(--muted);position:absolute;top:0;bottom:0;left:11px}.compare-tag{top:var(--space-2);padding:0 var(--space-2);border-radius:var(--radius-sm);background:var(--panel);color:var(--fg);pointer-events:none;font-size:13px;position:absolute}.compare-tag-before{left:var(--space-2)}.compare-tag-after{right:var(--space-2)}.stage-bar{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-top:1px solid var(--line);background:var(--panel);flex-wrap:wrap;display:flex}.stage-info{min-width:0;color:var(--muted);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;flex:160px;font-size:13px}.segmented{gap:var(--space-1);display:flex}.histogram{border-top:1px solid var(--line);background:var(--panel);font-size:13px}.histogram summary{padding:var(--space-1) var(--space-3);color:var(--muted);cursor:pointer}.histogram svg{width:100%;height:72px;display:block}.histogram path{opacity:.55}.hist-r{fill:var(--hist-r)}.hist-g{fill:var(--hist-g)}.hist-b{fill:var(--hist-b)}.hist-l{fill:var(--hist-l)}@media (width<=819px){.stage{z-index:2;height:45vh;position:sticky;top:0}.histogram{display:none}}