:root{--bg:#fff;--bg-2:#f4f4f5;--bg-3:#e9e9ec;--stage:#f4f4f5;--ink:#18181b;--ink-2:#3f3f46;--muted:#71717a;--faint:#a1a1aa;--line:#e4e4e7;--line-2:#d4d4d8;--accent:#3358f4;--accent-2:#2747d6;--accent-soft:#eef2ff;--accent-ink:#fff;--danger:#dc2626;--focus:#3358f4;--tan:#c9b98f;--radius:10px;--shadow-sm:0 1px 2px #18181b0f;--shadow:0 1px 2px #18181b0f, 0 8px 24px -6px #18181b1f;--glass:#ffffffdb;--sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif;--serif:"EB Garamond", "Songti SC", "Noto Serif SC", "Source Han Serif SC", STSong, Georgia, serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#18181b;--bg-2:#232327;--bg-3:#2e2e33;--stage:#111113;--ink:#f4f4f5;--ink-2:#d4d4d8;--muted:#a1a1aa;--faint:#71717a;--line:#2e2e33;--line-2:#3f3f46;--accent:#6d8bff;--accent-2:#8aa2ff;--accent-soft:#6d8bff24;--accent-ink:#0b1020;--focus:#8aa2ff;--tan:#a8976d;--shadow-sm:0 1px 2px #0006;--shadow:0 1px 2px #0006, 0 10px 30px -8px #0009;--glass:#1e1e22db;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);font:13px/1.45 var(--sans);-webkit-font-smoothing:antialiased;margin:0;overflow:hidden}button,input,select{font:inherit;color:inherit}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}[hidden]{display:none!important}#app{width:100vw;height:100dvh;display:flex}#sidebar{background:var(--bg);border-right:1px solid var(--line);z-index:5;flex-direction:column;flex:none;width:324px;display:flex}.brand{border-bottom:1px solid var(--line);color:var(--ink);align-items:center;gap:10px;padding:14px 16px;display:flex}.brand-mark{flex:none;width:30px;height:30px}.brand-text{min-width:0}.brand h1{font:650 16px/1.1 var(--sans);letter-spacing:-.01em;margin:0}.brand p{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin:2px 0 0;font-size:11.5px;line-height:1.2;overflow:hidden}.lang-switch{background:var(--bg-2);border:1px solid var(--line);border-radius:8px;flex:none;margin-left:auto;padding:2px;display:inline-flex}.lang-switch button{height:24px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:6px;padding:0 8px;font-size:11.5px;font-weight:600}.lang-switch button[aria-pressed=true]{background:var(--bg);color:var(--ink);box-shadow:var(--shadow-sm)}.lang-switch button:hover{color:var(--ink)}.brand #sidebar-close{margin-left:4px}.scroll{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;padding:4px 0 28px;overflow-y:auto}.group{border-bottom:1px solid var(--line);padding:16px 16px 18px}.group:last-child{border-bottom:0}.group h2{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:0 0 12px;font-size:11px;font-weight:600}:lang(zh-CN) .group h2{letter-spacing:.12em;font-size:12px}.group-head{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.group-head h2{margin:0}.sub{color:var(--ink-2);flex-wrap:wrap;align-items:baseline;gap:6px;margin:14px 0 6px;font-size:12px;font-weight:600;display:flex}.sub.first{margin-top:0}.muted{color:var(--muted);font-weight:400}.fine{color:var(--muted);margin:12px 0 0;font-size:11.5px;line-height:1.5}.row{grid-template-columns:104px 1fr 44px;align-items:center;gap:10px;min-height:32px;display:grid}.row>label{color:var(--ink-2);white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:8px;display:flex;overflow:hidden}.row>select,.row>.seed{grid-column:2/4}.row.stack{grid-template-columns:1fr;gap:6px;margin-bottom:8px}.row output{font-variant-numeric:tabular-nums;text-align:right;color:var(--muted);white-space:nowrap;font-size:11.5px}.crop-grid{grid-template-columns:1fr 1fr;column-gap:14px;display:grid}.crop-grid .row{grid-template-columns:34px 1fr}input[type=number],input[type=text],input[type=search],select{border:1px solid var(--line-2);background:var(--bg);border-radius:8px;width:100%;min-width:0;height:32px;padding:0 10px;transition:border-color .15s,box-shadow .15s}input[type=number]:hover,input[type=text]:hover,input[type=search]:hover,select:hover{border-color:var(--faint)}input:focus-visible,select:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);outline:none}button:focus-visible,summary:focus-visible,.drop:focus-visible{outline:2px solid var(--focus);outline-offset:2px}select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 9px center;background-repeat:no-repeat;padding-right:28px}input[type=checkbox]{appearance:none;border:1.5px solid var(--line-2);background:var(--bg);cursor:pointer;border-radius:5px;flex:none;place-content:center;width:16px;height:16px;margin:0;transition:background .15s,border-color .15s;display:grid}input[type=checkbox]:after{content:"";border:2px solid var(--accent-ink);opacity:0;border-top:0;border-right:0;width:9px;height:5px;transform:rotate(-45deg)translate(1px,-1px)}input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}input[type=checkbox]:checked:after{opacity:1}input[type=checkbox]:focus-visible{outline:2px solid var(--focus);outline-offset:2px}input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:20px;margin:0}input[type=range]::-webkit-slider-runnable-track{background:var(--bg-3);border-radius:99px;height:4px}input[type=range]::-moz-range-track{background:var(--bg-3);border-radius:99px;height:4px}input[type=range]::-moz-range-progress{background:var(--accent);border-radius:99px;height:4px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--bg);border:1.5px solid var(--accent);width:16px;height:16px;box-shadow:var(--shadow-sm);border-radius:50%;margin-top:-6px;transition:transform .1s}input[type=range]::-moz-range-thumb{background:var(--bg);border:1.5px solid var(--accent);width:14px;height:14px;box-shadow:var(--shadow-sm);border-radius:50%}input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.12)}input[type=range]:focus-visible{outline:none}input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 25%, transparent)}.seed{gap:6px;display:flex}.btn{border:1px solid var(--line-2);background:var(--bg);cursor:pointer;white-space:nowrap;height:32px;box-shadow:var(--shadow-sm);border-radius:8px;padding:0 12px;font-weight:550;transition:background .15s,border-color .15s}.btn:hover{background:var(--bg-2)}.btn.small{height:32px;padding:0 10px;font-size:12px}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn.primary:hover{background:var(--accent-2);border-color:var(--accent-2)}.btn.ghost{background:var(--glass);-webkit-backdrop-filter:blur(10px)}.btn.block{width:100%;height:36px;margin-top:12px}.btn:disabled{opacity:.6;cursor:progress}.btn.toggle{height:26px;padding:0 9px;font-size:11.5px}.btn.toggle[aria-pressed=true]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}.link{color:var(--accent);cursor:pointer;background:0 0;border:0;padding:0;font-size:12px;font-weight:500}.icon-btn{cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:6px;padding:6px;font-size:15px}.icon-btn:hover{background:var(--bg-2);color:var(--ink)}.tabs{background:var(--bg-2);border-radius:9px;grid-template-columns:repeat(3,1fr);margin-bottom:14px;padding:3px;display:grid}.tabs button{cursor:pointer;height:28px;color:var(--muted);background:0 0;border:0;border-radius:7px;font-size:12.5px;font-weight:550}.tabs button:hover{color:var(--ink)}.tabs button.active{background:var(--bg);color:var(--ink);box-shadow:var(--shadow-sm)}.preset-grid{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;display:grid}.preset,.struct,.pal{border:1px solid var(--line);background:var(--bg);border-radius:var(--radius);cursor:pointer;flex-direction:column;align-items:center;transition:border-color .15s,box-shadow .15s,background .15s;display:flex}.preset{gap:5px;padding:5px 5px 7px}.preset canvas{aspect-ratio:1.4;border-radius:6px;width:100%;display:block}.preset span,.struct span,.pal span{color:var(--ink-2);text-align:center;font-size:11px;font-weight:550;line-height:1.15}.preset:hover,.struct:hover,.pal:hover{border-color:var(--line-2);background:var(--bg-2)}.preset.active,.struct.active,.pal.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);background:var(--accent-soft)}.preset.active span,.struct.active span,.pal.active span{color:var(--accent)}.struct-grid{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.struct{gap:4px;padding:4px 3px 6px}.struct canvas{aspect-ratio:1.6;border-radius:5px;width:100%;display:block}.struct span{font-size:10.5px}.pal-grid{grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:6px;display:grid}.pal{gap:4px;padding:4px 3px 6px}.pal i{border-radius:5px;flex-direction:column;width:100%;height:26px;display:flex;overflow:hidden}.pal i b{flex:1}.pal span{font-size:10px}.chips{flex-wrap:wrap;gap:6px;margin-bottom:10px;display:flex}.chip{border:1px solid var(--line);background:var(--bg);cursor:pointer;color:var(--ink-2);border-radius:999px;align-items:center;gap:7px;padding:4px 11px 4px 5px;font-size:12px;font-weight:550;transition:border-color .15s,background .15s;display:inline-flex}.chip i{border-radius:50%;width:18px;height:18px;display:block;box-shadow:inset 0 0 0 1px #0000001f}.chip:hover{background:var(--bg-2)}.chip.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent);background:var(--accent-soft);color:var(--accent)}.search{gap:6px;margin-bottom:8px;display:flex}.results{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg);max-height:190px;box-shadow:var(--shadow);margin:0 0 10px;padding:4px;list-style:none;overflow:auto}.results li button{text-align:left;cursor:pointer;width:100%;color:var(--ink-2);background:0 0;border:0;border-radius:7px;padding:7px 9px;font-size:12px}.results li button:hover{background:var(--bg-2);color:var(--ink)}.results li.note{padding:7px 9px;font-size:12px}.coord{border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-2);margin:12px 0 6px;padding:12px}.coord-head{justify-content:space-between;align-items:baseline;margin-bottom:8px;display:flex}.coord-head .sub{margin:0}.coord-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.field{flex-direction:column;gap:4px;display:flex}.field span{color:var(--muted);font-size:11px;font-weight:550}.field input{font-variant-numeric:tabular-nums}.field input[aria-invalid=true]{border-color:var(--danger);box-shadow:0 0 0 3px color-mix(in srgb, var(--danger) 18%, transparent)}.coord-msg{margin:8px 0 0}.coord-msg.error{color:var(--danger)}.status{min-height:18px;color:var(--ink-2);margin:10px 0 0;font-size:12px}.status.error{color:var(--danger)}.credit{margin-top:4px}.drop{border:1.5px dashed var(--line-2);border-radius:var(--radius);cursor:pointer;background:var(--bg-2);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:4px;height:116px;margin-bottom:12px;transition:border-color .15s,background .15s;display:flex}.drop:hover{border-color:var(--faint)}.drop span{color:var(--muted);font-size:12px}.drop.over{border-color:var(--accent);background:var(--accent-soft)}.geo-off-note{margin:0 0 4px}#geo-controls{transition:opacity .2s}#geo-controls.off{opacity:.38;pointer-events:none;filter:grayscale(.7)}details.more{border-top:1px dashed var(--line);margin-top:8px;padding-top:6px}details.more summary{cursor:pointer;color:var(--ink-2);align-items:center;gap:6px;padding:6px 0;font-size:12px;font-weight:600;list-style:none;display:flex}details.more summary::-webkit-details-marker{display:none}details.more summary:before{content:"";border-right:1.6px solid var(--muted);border-bottom:1.6px solid var(--muted);width:6px;height:6px;margin-right:2px;transition:transform .15s;transform:rotate(-45deg)}details.more[open] summary:before{transform:rotate(45deg)}details.more[open] summary{margin-bottom:4px}.label-list{flex-direction:column;gap:6px;margin:4px 0 0;padding:0;list-style:none;display:flex}.label-list li{gap:6px;display:flex}.label-list li button{border:1px solid var(--line-2);background:var(--bg);cursor:pointer;width:32px;color:var(--muted);border-radius:8px;flex:none}.label-list li button:hover{color:var(--danger);border-color:var(--danger)}.label-list li.empty{color:var(--muted);font-size:12px}#stage{background:var(--stage);flex:1;min-width:0;transition:background .4s;position:relative;overflow:hidden}#canvas-host{touch-action:none;position:absolute;inset:0}#canvas-host canvas{display:block}#canvas-host.tool-navigate{cursor:grab}#canvas-host.tool-navigate.dragging{cursor:grabbing}#canvas-host.tool-sculpt{cursor:crosshair}#canvas-host.tool-label{cursor:text}#overlay{pointer-events:none;position:absolute;inset:0}.label{pointer-events:auto;transform-origin:0 0;white-space:nowrap;cursor:default;position:absolute;top:0;left:0}.label .dot{background:var(--label-color);width:6px;height:6px;box-shadow:0 0 0 1.5px var(--label-halo);border-radius:50%;position:absolute;top:-3px;left:-3px}.label .stem{background:var(--label-color);opacity:.75;width:1px;height:22px;position:absolute;bottom:0;left:-.5px}.label .txt{font:italic 600 15px/1 var(--serif);color:var(--label-color);text-shadow:0 0 3px var(--label-halo), 0 0 3px var(--label-halo), 0 0 6px var(--label-halo);letter-spacing:.02em;padding:2px 4px;position:absolute;bottom:22px;left:0;transform:translate(-50%)}.label .txt.cjk,#cartouche .cjk{font-style:normal}#stage.tool-label .label{cursor:move}#cartouche{text-align:center;color:var(--label-color);text-shadow:0 0 4px var(--label-halo);max-width:80%;position:absolute;bottom:62px;left:50%;transform:translate(-50%)}#cartouche .t{font:600 24px/1.15 var(--serif);letter-spacing:.08em;text-transform:uppercase}#cartouche .t.cjk{letter-spacing:.18em}#cartouche .s{font:italic 500 15px/1.3 var(--serif);opacity:.85;margin-top:4px}#toolbar,#viewbar,#compass,.fab{background:var(--glass);-webkit-backdrop-filter:blur(12px)saturate(1.4);border:1px solid var(--line);box-shadow:var(--shadow)}#toolbar{z-index:3;border-radius:12px;align-items:center;gap:4px;max-width:calc(100% - 24px);padding:4px;display:flex;position:absolute;top:14px;left:50%;transform:translate(-50%)}#toolbar .tools,#toolbar .history{gap:2px;display:flex}#toolbar .history{border-left:1px solid var(--line);padding-left:4px}#toolbar button{cursor:pointer;min-width:46px;height:42px;color:var(--ink-2);background:0 0;border:0;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:0 8px;transition:background .15s,color .15s;display:flex}#toolbar button span{font-size:10.5px;font-weight:550}#toolbar button svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}#toolbar button:hover:not(:disabled){background:var(--bg-2);color:var(--ink)}#toolbar button.active{background:var(--accent);color:var(--accent-ink)}#toolbar button:disabled{opacity:.35;cursor:default}#toolbar .brush{border-left:1px solid var(--line);gap:12px;padding:0 10px;display:flex}#toolbar .brush label{color:var(--muted);flex-direction:column;gap:2px;font-size:10.5px;font-weight:550;display:flex}#toolbar .brush input{width:96px}#topright{z-index:4;gap:8px;display:flex;position:absolute;top:14px;right:14px}.menu{position:relative}.menu-pop{background:var(--bg);border:1px solid var(--line);min-width:220px;box-shadow:var(--shadow);border-radius:12px;flex-direction:column;padding:5px;display:flex;position:absolute;top:40px;right:0}.menu-pop button{text-align:left;cursor:pointer;color:var(--ink-2);background:0 0;border:0;border-radius:7px;padding:8px 10px}.menu-pop button:hover{background:var(--bg-2);color:var(--ink)}.menu-pop hr{border:0;border-top:1px solid var(--line);width:auto;margin:4px 2px}#viewbar{z-index:3;border-radius:12px;align-items:center;gap:2px;padding:4px;display:flex;position:absolute;bottom:14px;right:14px}#viewbar button{cursor:pointer;min-width:30px;height:30px;color:var(--ink-2);background:0 0;border:0;border-radius:8px;padding:0 9px;font-size:12px;font-weight:550;transition:background .15s,color .15s}#viewbar #rot-l,#viewbar #rot-r{font-size:16px}#viewbar button:hover{background:var(--bg-2);color:var(--ink)}#viewbar button.active{color:var(--accent);background:var(--accent-soft)}#view-presets{gap:1px;display:flex}#compass{width:44px;height:44px;color:var(--ink);z-index:3;border-radius:50%;place-items:center;display:grid;position:absolute;bottom:16px;left:16px}#compass svg{width:38px;height:38px;overflow:visible}#needle{transform-origin:20px 20px}#hint{color:var(--label-color);opacity:.55;pointer-events:none;white-space:nowrap;font-size:11.5px;transition:opacity .6s;position:absolute;top:74px;left:50%;transform:translate(-50%)}#hint.gone{opacity:0}#busy{background:var(--bg);box-shadow:var(--shadow);border:1px solid var(--line);z-index:6;border-radius:999px;align-items:center;gap:10px;padding:8px 14px;font-weight:550;display:flex;position:absolute;top:74px;left:50%;transform:translate(-50%)}.spinner{border:2px solid var(--bg-3);border-top-color:var(--accent);border-radius:50%;width:14px;height:14px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}#toast{background:var(--ink);color:var(--bg);opacity:0;pointer-events:none;z-index:7;text-align:center;max-width:80%;box-shadow:var(--shadow);border-radius:10px;padding:9px 14px;font-weight:550;transition:opacity .25s,transform .25s;position:absolute;bottom:68px;left:50%;transform:translate(-50%,10px)}#toast.show{opacity:1;transform:translate(-50%)}#label-editor{z-index:8;position:absolute;transform:translate(-50%,-100%)}#label-editor input{width:190px;height:34px;box-shadow:var(--shadow);font:600 15px var(--serif)}.only-mobile{display:none}.fab{z-index:4;cursor:pointer;width:40px;height:40px;color:var(--ink);border-radius:10px;font-size:17px;position:absolute;top:14px;left:14px}@media (max-width:860px){.only-mobile{display:inline-block}#sidebar{width:min(344px,92vw);box-shadow:var(--shadow);z-index:20;transition:transform .25s;position:fixed;inset:0 auto 0 0;transform:translate(-102%)}#sidebar.open{transform:none}#toolbar{flex-wrap:wrap;top:64px;left:12px;transform:none}#toolbar button span{display:none}#toolbar button{min-width:38px;height:36px}#toolbar .brush input{width:72px}#topright{top:14px;right:12px}#share{display:none}#viewbar{justify-content:space-between;bottom:12px;left:12px;right:12px;overflow-x:auto}#view-presets button:nth-child(n+4){display:none}#compass{bottom:62px;left:12px}#hint{display:none}#cartouche{bottom:108px}#cartouche .t{font-size:18px}}
