:root{--c-bg:#efeadf;--c-panel:#f8f5ee;--c-ink:#1c1a16;--c-mute:#6d675b;--c-line:#d6cfbf;--c-hot:#d9480f;--c-hot-ink:#fff}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--c-bg);color:var(--c-ink);font:13px/1.4 IBM Plex Sans,ui-sans-serif,system-ui,sans-serif}button,select,input,textarea{font:inherit;color:inherit}button{background:var(--c-panel);border:1px solid var(--c-ink);cursor:pointer;border-radius:3px;padding:4px 9px}button:hover:not(:disabled):not(.on):not(.primary){background:#fff}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:var(--c-hot);color:var(--c-hot-ink);border-color:var(--c-ink);font-weight:600}button.primary:hover{background:#c13f0b}button.danger{color:#a4210b}button.on{background:var(--c-ink);color:#fff}input[type=text],input[type=number],input[type=password],select,textarea{border:1px solid var(--c-line);background:#fff;border-radius:3px;width:100%;padding:4px 6px}textarea{resize:vertical}.app{grid-template-rows:44px 1fr;grid-template-columns:292px 1fr 300px;height:100%;display:grid}.topbar{border-bottom:2px solid var(--c-ink);background:var(--c-panel);grid-column:1/-1;align-items:center;gap:10px;padding:0 12px;display:flex}.logo{flex-direction:column;font:700 17px/1 Fraunces,Georgia,serif;display:flex}.logo .word{letter-spacing:-.01em;font-size:19px}.logo .ai{color:color-mix(in oklab,var(--c-ink) 52%,var(--c-panel))}.logo small{color:var(--c-mute);margin-top:2px;font:400 9.5px IBM Plex Sans,sans-serif}.group{gap:4px;display:flex}.seg{display:flex}.seg button{border-radius:0;margin-left:-1px}.seg button:first-child{border-radius:3px 0 0 3px;margin-left:0}.seg button:last-child{border-radius:0 3px 3px 0}.panel-body .seg{margin-bottom:6px}.panel-body .seg button,.spacer{flex:1}.toggle{cursor:pointer;align-items:center;gap:5px;display:flex}.toggle input{width:auto}.badge{border-color:var(--c-hot);color:#8a2a05;background:#fde6dc}.pop{position:relative}.popover{z-index:50;background:var(--c-panel);border:2px solid var(--c-ink);width:290px;box-shadow:4px 4px 0 var(--c-ink);flex-direction:column;gap:8px;padding:10px;display:flex;position:absolute;top:34px;right:0}.popover.menu{gap:4px;width:200px}.popover.menu button{text-align:left}.left,.right{background:var(--c-panel);border-right:2px solid var(--c-ink);flex-direction:column;min-height:0;display:flex}.right{border-right:0;border-left:2px solid var(--c-ink)}.tabs{border-bottom:1px solid var(--c-ink);display:flex}.tabs button{border:0;border-right:1px solid var(--c-line);background:0 0;border-radius:0;flex:1;padding:8px 4px}.tabs button.on{background:var(--c-ink);color:#fff}.scroll{flex:1;overflow:auto}.panel-body{flex-direction:column;gap:6px;padding:10px;display:flex}.lbl{text-transform:uppercase;letter-spacing:.06em;color:var(--c-ink);margin-top:8px;font:600 10.5px IBM Plex Mono,ui-monospace,monospace}.hint,.meta{color:var(--c-mute);text-transform:none;letter-spacing:0;margin:0;font-family:inherit;font-size:11.5px;font-weight:400}em{color:var(--c-mute);font-style:normal;font-weight:400}.row2{gap:6px;display:flex}.row2>*{flex:1}.row2.head{justify-content:space-between;align-items:center}.row2.head>*{flex:none}.btns{gap:3px;display:flex}.btns button{padding:3px 6px}.ntype{font:700 15px Fraunces,Georgia,serif}.locks{grid-template-columns:1fr 1fr;gap:4px;display:grid}.lock{text-align:left;font-size:11.5px}.lock.on{background:var(--c-hot);color:#fff}.variants{grid-template-columns:1fr 1fr;gap:8px;display:grid}.variant{text-align:left;flex-direction:column;padding:0;display:flex;overflow:hidden}.variant:hover{box-shadow:3px 3px 0 var(--c-ink)}.variant span{border-top:1px solid var(--c-ink);padding:3px 6px;font-size:11px}.thumb{background:#fff;width:100%;height:118px;position:relative;overflow:hidden}.elements,.chips{grid-template-columns:1fr 1fr;gap:5px;display:grid}.chips{grid-template-columns:repeat(4,1fr)}.chips button{padding:3px 2px;font-size:11px}.el{cursor:grab;text-align:left}.layers{gap:0;padding:6px 0}.layer{cursor:pointer;white-space:nowrap;border-top:2px solid #0000;border-bottom:2px solid #0000;gap:4px;padding:3px 6px;display:flex}.layer:hover{background:#fff}.layer.sel{background:var(--c-ink);color:#fff}.layer.over-before{border-top-color:var(--c-hot)}.layer.over-after{border-bottom-color:var(--c-hot)}.layer.over-inside{outline:2px solid var(--c-hot);outline-offset:-2px}.twisty{width:10px;color:var(--c-mute)}.ltype{text-overflow:ellipsis;overflow:hidden}.field{flex-direction:column;gap:2px;display:flex}.field.inline{flex-direction:row;justify-content:space-between;align-items:center}.field label{color:var(--c-mute);font-size:11.5px}.field input[type=checkbox]{width:auto}.num{align-items:center;gap:6px;display:flex}.num input[type=number]{width:62px}.num input[type=range]{flex:1}.field input[type=range]{width:100%}.scoped{border-top:1px dashed var(--c-ink);flex-direction:column;gap:6px;margin-top:12px;padding-top:8px;display:flex}.swatches{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.swatch{cursor:pointer;flex-direction:column;align-items:center;gap:2px;display:flex;position:relative}.swatch input{opacity:0;cursor:pointer;width:100%;height:32px;position:absolute;inset:0}.swatch span{border:1px solid var(--c-ink);border-radius:3px;width:100%;height:32px}.swatch small{color:var(--c-mute);font-size:9.5px}.warn{color:#8a2a05;margin:0;font-size:11.5px}.issues{flex-direction:column;gap:5px;margin:0;padding:0;list-style:none;display:flex}.issue{border:1px solid var(--c-line);border-left:4px solid var(--c-mute);background:#fff;padding:5px 7px}.issue small{color:var(--c-mute);display:block}.issue b{text-transform:uppercase;margin-right:4px;font:600 10px IBM Plex Mono,monospace}.issue.fail{border-left-color:#c92a2a}.issue.warn{border-left-color:#e6a100}.issue.pass{border-left-color:#2f7d4f}.center{background:#cfc8b8 radial-gradient(#b9b19e 1px,#0000 1px) 0 0/14px 14px;min-width:0;min-height:0;display:flex}.canvas-scroll{flex:1;justify-content:center;align-items:flex-start;padding:20px;display:flex;overflow:auto}.stage-wrap{flex:none;position:relative}.stage{box-shadow:0 0 0 1px var(--c-ink),8px 8px 0 #1c1a1659;background:#fff;position:relative}.stage .is-sel{outline-offset:-2px;outline:2px solid var(--c-hot)!important}.stage .is-hover:not(.is-sel){outline:1px dashed var(--c-hot);outline-offset:-1px}.stage [data-edit]{cursor:text}.sel-chip{background:var(--c-hot);color:#fff;pointer-events:none;z-index:20;padding:2px 6px;font:600 10px IBM Plex Mono,monospace;position:absolute}.drop-ind{pointer-events:none;z-index:30;position:absolute}.toast{background:var(--c-ink);color:#fff;z-index:100;border-radius:3px;max-width:70vw;padding:8px 14px;position:fixed;bottom:16px;left:50%;transform:translate(-50%)}.popover hr{border:0;border-top:1px solid var(--c-line);width:100%;margin:2px 0}.callout{border:1px solid var(--c-line);border-left:4px solid var(--c-hot);color:var(--c-mute);background:#fff;margin:0;padding:6px 8px;font-size:11.5px}.parts{border:1px solid var(--c-ink);background:#fff;flex-direction:column;display:flex}.part{border-bottom:1px solid var(--c-line);align-items:center;gap:6px;padding:4px 6px;display:flex}.part:last-child{border-bottom:0}.part.locked{background:#fbefe6}.plabel{flex-direction:column;flex:1;min-width:0;line-height:1.15;display:flex}.plabel small{color:var(--c-mute);white-space:nowrap;text-overflow:ellipsis;font-size:10.5px;overflow:hidden}.lockbtn{text-align:center;border-color:var(--c-line);flex:none;width:24px;padding:2px 0}.lockbtn.on{background:var(--c-hot);color:#fff;border-color:var(--c-ink)}.lockbtn.none{background:0 0;border:0}.mini{flex:none;padding:2px 7px;font-size:11.5px}.seedrow input{flex:1}.seedrow button{flex:none}.seedlabel{text-transform:uppercase;flex:none;font:600 10.5px IBM Plex Mono,monospace}details.content{border:1px solid var(--c-line);background:#fff;margin-top:6px;padding:0}details.content>summary{cursor:pointer;text-transform:uppercase;letter-spacing:.06em;color:var(--c-mute);padding:6px 8px;font:600 10.5px IBM Plex Mono,monospace}details.content>summary small{text-transform:none;letter-spacing:0;margin-left:4px;font-weight:400}details.content[open]{padding-bottom:8px}details.content[open]>summary{color:var(--c-ink)}details.content>:not(summary){margin-left:8px;margin-right:8px}details.content>:not(summary):not(:first-of-type){margin-top:6px}.seedrow{align-items:center}.seedbox{letter-spacing:.04em;word-break:break-all;resize:none;font:12px/1.35 IBM Plex Mono,ui-monospace,monospace}.fontfield{position:relative}.ac{z-index:60;border:1px solid var(--c-ink);box-shadow:3px 3px 0 var(--c-ink);background:#fff;max-height:240px;margin:0;padding:0;list-style:none;position:absolute;top:100%;left:0;right:0;overflow:auto}.ac li{cursor:pointer;justify-content:space-between;gap:8px;padding:4px 7px;display:flex}.ac li.hi{background:var(--c-ink);color:#fff}.ac li small{opacity:.6;font-size:10.5px}.fab,.backdrop{display:none}@media (width<=1100px){.app{grid-template-rows:auto 1fr;grid-template-columns:1fr}.topbar{flex-wrap:wrap;row-gap:6px;padding:6px 10px}.left,.right{z-index:70;visibility:hidden;width:min(340px,88vw);max-width:100vw;padding-bottom:env(safe-area-inset-bottom);box-shadow:none;transition:transform .22s,visibility 0s linear .22s;position:fixed;top:0;bottom:0}.left{border-right:2px solid var(--c-ink);left:0;transform:translate(-100%)}.right{border-left:2px solid var(--c-ink);right:0;transform:translate(100%)}.drawer-left .left,.drawer-right .right{visibility:visible;transition:transform .22s;transform:none;box-shadow:6px 0 #1c1a1640}.drawer-right .right{box-shadow:-6px 0 #1c1a1640}.backdrop{z-index:60;opacity:0;pointer-events:none;background:#1c1a1673;transition:opacity .22s;display:block;position:fixed;inset:0}.drawer-left .backdrop,.drawer-right .backdrop{opacity:1;pointer-events:auto}.fab{z-index:80;bottom:calc(14px + env(safe-area-inset-bottom));background:var(--c-ink);color:#fff;border-radius:22px;align-items:center;gap:6px;min-height:44px;padding:0 16px;font-weight:600;display:flex;position:fixed;box-shadow:0 3px 10px #00000059}.fab:hover:not(:disabled){background:#000}.fab-left{left:14px}.fab-right{right:14px}.drawer-left .fab-right,.drawer-right .fab-left{display:none}.drawer-left .fab-left{left:calc(min(340px,88vw) + 10px)}.drawer-right .fab-right{right:calc(min(340px,88vw) + 10px)}.canvas-scroll{padding:12px 12px 78px}.toast{bottom:76px}}@media (pointer:coarse),(width<=1100px){button,.tabs button{min-height:36px}.layer{padding-top:8px;padding-bottom:8px}.twisty{text-align:center;width:22px}.lockbtn{width:32px}input[type=text],input[type=number],input[type=password],select,textarea{padding:7px 8px;font-size:16px}.ac li{padding:9px 8px}}@media (width<=700px){.logo small,.toggle span{display:none}.topbar{gap:6px}.topbar .group.seg:nth-of-type(2){display:none}.popover{position:fixed;top:56px;left:10px;right:10px;width:auto!important}.chips{grid-template-columns:repeat(2,1fr)}.num input[type=number]{width:72px}}
