:root{--canvas:#14151c;--surface:#1c1e27;--surface-2:#252836;--surface-3:#2f3344;--line:#363a4d;--ink:#eceef5;--ink-2:#b7bccc;--muted:#8a90a6;--primary:#7c6cff;--primary-ink:#fff;--primary-soft:#7c6cff29;--ok:#3fcf8e;--warn:#ffb020;--danger:#ff6b6b;--checker-a:#2a2d3a;--checker-b:#232632;--r-sm:8px;--r-md:12px;--r-lg:16px;--font:system-ui, -apple-system, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic UI", Meiryo, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=light]{--canvas:#f4f5f9;--surface:#fff;--surface-2:#f0f1f6;--surface-3:#e4e6ee;--line:#d9dce6;--ink:#1b1d26;--ink-2:#444a5e;--muted:#6b7186;--primary:#5b4ef0;--primary-soft:#5b4ef01f;--checker-a:#e9ebf1;--checker-b:#f6f7fa;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:light){:root:not([data-theme=dark]){--canvas:#f4f5f9;--surface:#fff;--surface-2:#f0f1f6;--surface-3:#e4e6ee;--line:#d9dce6;--ink:#1b1d26;--ink-2:#444a5e;--muted:#6b7186;--primary:#5b4ef0;--primary-soft:#5b4ef01f;--checker-a:#e9ebf1;--checker-b:#f6f7fa;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--canvas);color:var(--ink);font-family:var(--font);-webkit-text-size-adjust:100%;overscroll-behavior:none;font-size:14px;line-height:1.55}button,input,select{font:inherit;color:inherit}button{cursor:pointer}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.app{height:100%;grid-template-rows:auto auto 1fr auto;height:100dvh;display:grid}.topbar{padding:8px 12px;padding-top:max(8px, env(safe-area-inset-top));background:var(--surface);border-bottom:1px solid var(--line);align-items:center;gap:8px;min-width:0;display:flex}.brand{letter-spacing:.02em;white-space:nowrap;font-weight:700}.brand b{color:var(--primary)}.project-name{min-width:0;color:var(--ink-2);text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.btn{border-radius:var(--r-sm);border:1px solid var(--line);background:var(--surface-2);white-space:nowrap;justify-content:center;align-items:center;gap:6px;min-height:36px;padding:6px 12px;display:inline-flex}.btn:hover:not(:disabled){background:var(--surface-3)}.btn:disabled{opacity:.45;cursor:default}.btn.primary{background:var(--primary);border-color:var(--primary);color:var(--primary-ink)}.btn.primary:hover:not(:disabled){filter:brightness(1.08)}.btn.ghost{background:0 0;border-color:#0000}.btn.small{min-height:30px;padding:3px 9px;font-size:13px}.btn.block{white-space:normal;width:100%}.btn.on{background:var(--primary-soft);border-color:var(--primary)}.icon-btn{min-width:40px;padding:6px}.steps{background:var(--surface);border-bottom:1px solid var(--line);scrollbar-width:none;gap:4px;padding:6px 8px;display:flex;overflow-x:auto}.steps::-webkit-scrollbar{display:none}.step{min-height:36px;color:var(--ink-2);background:0 0;border:1px solid #0000;border-radius:999px;flex:1 0 auto;justify-content:center;align-items:center;gap:6px;padding:4px 10px;display:flex}.step .n{background:var(--surface-3);border-radius:50%;place-items:center;width:20px;height:20px;font-size:12px;display:inline-grid}.step.on{background:var(--primary-soft);border-color:var(--primary);color:var(--ink)}.step.on .n{background:var(--primary);color:var(--primary-ink)}.step:disabled{opacity:.4}.work{grid-template-columns:260px 1fr 300px;min-height:0;display:grid}.panel{background:var(--surface);min-height:0;padding:12px;overflow-y:auto}.panel.left{border-right:1px solid var(--line)}.panel.right{border-left:1px solid var(--line)}.panel h2{color:var(--muted);letter-spacing:.04em;margin:4px 0 8px;font-size:13px;font-weight:700}.panel h3{margin:14px 0 6px;font-size:14px}.panel p{color:var(--ink-2);margin:6px 0}.stage-wrap{background-color:var(--checker-b);background-image:linear-gradient(45deg, var(--checker-a) 25%, transparent 25%), linear-gradient(-45deg, var(--checker-a) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, var(--checker-a) 75%), linear-gradient(-45deg, transparent 75%, var(--checker-a) 75%);background-position:0 0,0 12px,12px -12px,-12px 0;background-size:24px 24px;min-width:0;min-height:0;position:relative;overflow:hidden}.stage{position:absolute;inset:0}.stage-tools{gap:6px;display:flex;position:absolute;bottom:10px;right:10px}.stage-msg{text-align:center;color:var(--ink-2);place-items:center;padding:24px;display:grid;position:absolute;inset:0}.fps{color:var(--muted);background:color-mix(in srgb, var(--surface) 80%, transparent);border-radius:6px;padding:2px 6px;font-size:11px;position:absolute;bottom:10px;left:10px}.toolbar{padding:8px;padding-bottom:max(8px, env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--line);gap:6px;display:flex;overflow-x:auto}.toolbar .btn{flex:1 0 auto}.layers{margin:0;padding:0;list-style:none}.layer{border-radius:var(--r-sm);border:1px solid #0000;align-items:center;gap:6px;min-height:40px;padding:6px;display:flex}.layer.on{background:var(--primary-soft);border-color:var(--primary)}.layer .name{text-overflow:ellipsis;white-space:nowrap;text-align:left;background:0 0;border:0;flex:1;min-width:0;padding:4px 2px;overflow:hidden}.layer .role{color:var(--muted);white-space:nowrap;font-size:11px}.layer .eye{width:32px;height:32px;color:var(--ink-2);background:0 0;border:0;border-radius:6px}.layer.hidden .name{opacity:.5}.group-row{color:var(--muted);padding:8px 6px 2px;font-size:12px}.field{gap:4px;margin:10px 0;display:grid}.field>span{color:var(--muted);font-size:12px}.field input[type=text],.field select{border-radius:var(--r-sm);border:1px solid var(--line);background:var(--surface-2);width:100%;min-height:38px;padding:6px 10px}input[type=range]{width:100%;accent-color:var(--primary);min-height:28px}.row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.grid2{grid-template-columns:1fr 1fr;gap:6px;display:grid}.param{border-radius:var(--r-sm);border:1px solid var(--line);background:var(--surface-2);margin:6px 0;padding:8px}.param.on{border-color:var(--primary);background:var(--primary-soft)}.param .head{justify-content:space-between;align-items:center;gap:6px;display:flex}.param .label{text-align:left;background:0 0;border:0;padding:0;font-weight:600}.param .value{font-variant-numeric:tabular-nums;color:var(--muted);font-size:12px}.keys{height:14px;margin:0 8px;position:relative}.keys button{border:2px solid var(--primary);background:var(--surface);border-radius:50%;width:14px;height:14px;margin-left:-7px;padding:0;position:absolute;top:0}.keys button.at{background:var(--primary)}.report{border-radius:var(--r-sm);background:var(--surface-2);border:1px solid var(--line);margin:8px 0;padding:8px 10px}.report ul{margin:4px 0;padding-left:18px}.report .ok{color:var(--ok)}.report .miss{color:var(--warn)}.drop{border:2px dashed var(--line);border-radius:var(--r-lg);text-align:center;background:var(--surface-2);padding:20px 16px}.drop.over{border-color:var(--primary);background:var(--primary-soft)}.import-page{max-width:760px;margin:0 auto;padding:16px;overflow-y:auto}.import-page h1{margin:8px 0 4px;font-size:20px}.import-page h2{margin:20px 0 8px;font-size:15px}.cards{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;display:grid}.card{border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);display:grid;overflow:hidden}.card .thumb{aspect-ratio:1;background-color:var(--checker-b);border:0;place-items:center;padding:0;display:grid}.card .thumb img{max-width:100%;max-height:100%}.card .meta{color:var(--ink-2);padding:8px;font-size:12px}.card .meta b{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:13px;display:block;overflow:hidden}.report.moved{border-color:var(--warn)}.tips{color:var(--ink-2);margin:0;padding-left:20px}.tips li{margin:4px 0}.notice{width:-moz-fit-content;width:fit-content;left:16px;right:16px;bottom:calc(76px + env(safe-area-inset-bottom));border-radius:var(--r-md);background:var(--surface-3);border:1px solid var(--line);z-index:30;align-items:flex-start;gap:10px;max-width:560px;margin:0 auto;padding:10px 14px;display:flex;position:fixed;box-shadow:0 8px 24px #0000004d}.notice.error{border-color:var(--danger)}.busy{z-index:40;background:#00000059;place-items:center;display:grid;position:fixed;inset:0}.busy>div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:16px 20px}.sheet-tabs{display:none}.hint{color:var(--muted);font-size:12px}.sr-only{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}@media (max-width:860px){.work{grid-template-columns:1fr;position:relative}.panel.left,.panel.right{border:0;border-top:1px solid var(--line);border-radius:var(--r-lg) var(--r-lg) 0 0;z-index:10;max-height:62%;display:none;position:absolute;bottom:0;left:0;right:0;box-shadow:0 -10px 30px #00000059}.panel.open{display:block}.sheet-tabs{gap:6px;display:flex}.toolbar{flex-wrap:wrap;overflow-x:visible}.toolbar .btn{padding-left:8px;padding-right:8px}.topbar .wide{display:none}.notice{top:calc(96px + env(safe-area-inset-top));bottom:auto}}@media (max-width:480px){.step{flex:1 1 0;min-width:0;padding:4px 2px;font-size:13px}.step .n{display:none}}.show{z-index:50;background:#000;position:fixed;inset:0}.show-canvas{touch-action:none;width:100%;height:100%;display:block}.show-bar{border-radius:var(--r-md);background:var(--surface);max-width:900px;color:var(--ink);border:1px solid var(--line);padding:10px;transition:opacity .4s;position:absolute;top:12px;left:12px;right:12px;box-shadow:0 6px 24px #00000040}.show-bar.hidden{opacity:0}.show-preview-box{margin-top:6px}.show-preview{border-radius:var(--r-sm);width:160px;transform:scaleX(-1)}.help-backdrop{z-index:60;background:#00000073;justify-content:center;align-items:flex-start;padding:24px 12px;display:flex;position:fixed;inset:0;overflow-y:auto}.help{background:var(--surface);width:100%;max-width:640px;color:var(--ink);border:1px solid var(--line);border-radius:var(--r-lg);padding:16px}.help h3{margin:14px 0 4px;font-size:14px}