:root{--bg:#14161a;--panel:#1d2026;--panel2:#24272f;--panel3:#232830;--fg:#e6e8ee;--muted:#9aa1ad;--accent:#6cc7ff;--line:#333843;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--fg);margin:0;font-family:Yu Gothic UI,Hiragino Kaku Gothic ProN,Meiryo,system-ui,sans-serif;font-size:13px;overflow:hidden}[hidden]{display:none!important}#app{height:100vh;grid-template-columns:minmax(0,1fr) 356px;height:100dvh;display:grid}#stage{background:repeating-conic-gradient(#20232a 0% 25%,#1a1d22 0% 50%) 50%/24px 24px;place-items:center;min-width:0;padding:14px;display:grid;position:relative;overflow:hidden}#frame{line-height:0;position:relative;box-shadow:0 8px 28px #0000008c}#view{image-rendering:auto;touch-action:none;cursor:grab;background:#fff;display:block}#view.dragging{cursor:grabbing}#fold{pointer-events:none;border-left:1px dashed #00000061;width:0;position:absolute;top:0;bottom:0;left:50%}#fold:after{content:"ノド";letter-spacing:.08em;color:#00000073;background:#ffffffb8;border-radius:3px;padding:1px 4px;font-size:10px;position:absolute;top:8px;left:6px}#overlay{pointer-events:none;position:absolute;bottom:14px;left:18px;right:18px}#status{text-overflow:ellipsis;white-space:nowrap;border:1px solid var(--line);max-width:100%;color:var(--muted);font-variant-numeric:tabular-nums;background:#0a0c10b8;border-radius:6px;padding:4px 8px;display:inline-block;overflow:hidden}#side{background:var(--panel);border-left:1px solid var(--line);flex-direction:column;min-height:0;display:flex}#panel{scrollbar-gutter:stable;flex:auto;min-height:0;padding:12px 16px 16px;overflow-y:auto}#output{background:var(--panel3);border-top:1px solid var(--line);flex:none;padding:10px 16px 12px}.brand{margin:0 0 8px}.brand .brand-kicker{letter-spacing:.24em;text-transform:uppercase;color:var(--accent);font-size:10px}.brand h1{letter-spacing:.02em;margin:3px 0 2px;font-size:19px}.brand .brand-sub{color:var(--muted);margin:0;font-size:12px}.mode{margin:0 0 8px}.seg{grid-auto-columns:1fr;grid-auto-flow:column;gap:4px;display:grid}.seg button{background:var(--panel2);padding:5px 6px;font-size:12px}.seg button.on{border-color:var(--accent);color:#fff;background:#23405a}.block{border-top:1px solid var(--line);margin-top:10px;padding:12px 0 6px}.block>h2,.subblock>h3{justify-content:space-between;align-items:baseline;gap:8px;margin:0 0 8px;display:flex}.block>h2{letter-spacing:.06em;color:var(--accent);font-size:12px}.block-toggle{width:auto;min-width:0;color:inherit;font:inherit;letter-spacing:inherit;text-align:left;background:0 0;border:none;flex:auto;align-items:center;gap:6px;margin:-3px 0;padding:3px 0;display:flex}.block-toggle:before{content:"";border-left:4.5px solid var(--muted);border-top:3.5px solid #0000;border-bottom:3.5px solid #0000;flex:none;width:0;height:0;transition:transform .12s;transform:rotate(90deg)}.is-closed>h2>.block-toggle:before,.is-closed>h3>.block-toggle:before{transform:rotate(0)}.block-toggle:hover{color:var(--fg);border:none}.is-closed>h2,.is-closed>h3{margin-bottom:0}.row{grid-template-columns:92px minmax(0,1fr) 54px;align-items:center;gap:8px;margin:7px 0;display:grid}.row>label{color:var(--muted)}.row.wide{grid-template-columns:92px minmax(0,1fr)}.row .val{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}input[type=range]{width:100%;accent-color:var(--accent)}select,button,input[type=number]{border:1px solid var(--line);background:var(--panel2);width:100%;color:var(--fg);font:inherit;border-radius:5px;padding:4px 6px}button{cursor:pointer;padding:7px 8px}button:hover{border-color:var(--accent)}button.primary{background:#23405a;border-color:#3d6f96}button:disabled{opacity:.5;cursor:default}.hint{color:var(--muted);margin:4px 0 0;font-size:11.5px;line-height:1.5}.meta{color:var(--muted);font-variant-numeric:tabular-nums;margin:6px 0 0;font-size:11px;line-height:1.5}.now{color:var(--muted);margin:0 0 4px;font-size:11px}.now b{color:var(--fg);font-weight:600}.checks{flex-wrap:wrap;gap:4px 12px;margin:6px 0;display:flex}.checks label{color:var(--fg);align-items:center;gap:4px;display:flex}.checks input{accent-color:var(--accent)}.buttons{gap:6px;margin-top:8px;display:grid}.buttons.two{grid-template-columns:1fr 1fr}.preset-head{color:var(--muted);letter-spacing:.04em;margin:8px 0 4px;font-size:11px}.preset-head:first-child{margin-top:0}.preset-grid{grid-template-columns:1fr 1fr;gap:3px;display:grid}.preset-grid button{text-align:left;align-items:center;gap:5px;padding:4px 6px;font-size:12px;display:flex}.preset-grid button .key{text-align:center;min-width:14px;color:var(--muted);border:1px solid var(--line);border-radius:3px;flex:none;font-size:10px;line-height:14px}.preset-grid button.on{border-color:var(--accent);background:#23405a}.preset-grid button.on .key{color:var(--accent);border-color:var(--accent)}#output .block{border-top:none;margin:0;padding:0}#output .block>h2{letter-spacing:.06em;color:var(--accent);margin:0 0 6px;font-size:12px}#output .row{grid-template-columns:40px minmax(0,1fr);margin:5px 0}#output .row>label{font-size:11px}#output .buttons{margin-top:8px}#output .hint{margin:6px 0 0;font-size:11px}#output .credit{color:var(--muted);margin:8px 0 0;font-size:11px;line-height:1.55}#output .credit a{color:var(--fg);text-underline-offset:2px;text-decoration:underline}#viewtools{z-index:3;gap:6px;display:none;position:absolute;top:10px;right:10px}#viewtools button{touch-action:manipulation;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#181b21db;border-radius:9px;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;font-size:19px;line-height:1}#viewtools button:active{border-color:var(--accent);background:#23405a}#quickbar{z-index:30;padding:8px max(12px, env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));border-top:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#181b21f5;grid-template-columns:1fr 1.35fr;gap:8px;display:none;position:fixed;bottom:0;left:0;right:0}#quickbar button{width:100%;min-height:46px;padding:8px 10px;font-size:14px}@media (max-width:900px){html,body{height:auto;min-height:100%;overflow:visible}body{padding-bottom:calc(64px + env(safe-area-inset-bottom));-webkit-text-size-adjust:100%}#app{height:auto;min-height:100vh;grid-template-rows:auto auto;grid-template-columns:minmax(0,1fr);min-height:100dvh}#stage{z-index:20;height:clamp(210px,42vh,380px);height:clamp(210px,42dvh,380px);padding:calc(10px + env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) 10px max(10px, env(safe-area-inset-left));border-bottom:1px solid var(--line);align-self:start;position:sticky;top:0;box-shadow:0 10px 26px #00000073}#side{border-top:none;border-left:none}#panel{padding:14px max(14px, env(safe-area-inset-right)) 18px max(14px, env(safe-area-inset-left));flex:none;overflow:visible}#output{padding:12px max(14px, env(safe-area-inset-right)) 16px max(14px, env(safe-area-inset-left))}#output .buttons{gap:8px}#output .credit{font-size:12px}#viewtools{top:calc(8px + env(safe-area-inset-top));right:max(8px, env(safe-area-inset-right));display:flex}#overlay{left:max(8px, env(safe-area-inset-left));right:max(8px, env(safe-area-inset-right));bottom:max(6px, env(safe-area-inset-bottom))}#status{padding:3px 6px;font-size:11px}button,select,input[type=number]{min-height:44px;padding:8px 10px;font-size:16px}.seg button{min-height:42px;font-size:14px}.preset-grid{gap:6px}.preset-grid button{min-height:44px;padding:6px 8px;font-size:13px}.preset-grid button .key{min-width:18px;font-size:11px;line-height:16px}.block-toggle{min-height:44px;margin:-8px 0;padding:8px 0}.reset{min-height:44px;padding:0 4px}.row{grid-template-columns:84px minmax(0,1fr) 58px;gap:8px;margin:9px 0}.row.wide{grid-template-columns:84px minmax(0,1fr)}input[type=range]{min-height:32px}.checks{gap:8px 16px}.checks label{min-height:36px}#output .row{grid-template-columns:48px minmax(0,1fr)}.hint{font-size:12px;line-height:1.65}#quickbar{display:grid}}@media (max-width:900px) and (orientation:landscape){html,body{height:100%;overflow:hidden}body{padding-bottom:0}#app{height:100vh;grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr) 320px;height:100dvh;min-height:0}#stage{z-index:auto;height:auto;padding:10px max(10px, env(safe-area-inset-right)) 10px max(10px, env(safe-area-inset-left));box-shadow:none;border-bottom:none;align-self:stretch;position:relative;top:auto}#side{border-left:1px solid var(--line);padding-bottom:calc(64px + env(safe-area-inset-bottom));overflow-y:auto}#panel{flex:none;min-height:auto;padding:12px 14px 16px;overflow:visible}#output{padding:10px 14px 12px}#viewtools{top:auto;bottom:10px}#quickbar{width:320px;display:grid;left:auto;right:0}}.subblock{margin:12px 0 2px;padding-left:10px}.subblock>h3{color:var(--fg);font-size:12px;font-weight:600}.subhead{letter-spacing:.04em;color:var(--muted);border-top:1px dashed var(--line);margin:12px 0 2px;padding-top:8px;font-size:11px}.reset{width:auto;color:var(--muted);text-underline-offset:2px;background:0 0;border:none;flex:none;padding:0;font-size:11px;text-decoration:underline}.reset:hover{color:var(--accent);border:none}.adv{border-left:2px solid var(--line);margin:8px 0 2px;padding:2px 0 2px 10px}
