/* Montserrat (SIL OFL 1.1), self-hosted from @fontsource-variable/montserrat */
@font-face{font-family:Montserrat;font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/montserrat-latin-wght-normal.woff2) format("woff2-variations"),url(fonts/montserrat-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Montserrat;font-style:normal;font-display:swap;font-weight:100 900;src:url(fonts/montserrat-latin-ext-wght-normal.woff2) format("woff2-variations"),url(fonts/montserrat-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{--o:#FA4616;--ink:#1d2430;--mut:#6b7480;--line:#e3e5e8;--bg:#E6E6E6}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font:400 13.5px/1.45 Montserrat,system-ui,sans-serif;color:var(--ink);background:var(--bg);overflow:hidden}
#cv{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}
#logo{position:fixed;top:20px;left:24px;height:68px}
#logo svg{height:100%;width:auto;display:block}
aside{position:fixed;top:16px;right:16px;height:calc(100vh - 32px);width:372px;background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.7);border-radius:12px;box-shadow:0 8px 30px rgba(20,28,40,.12);display:flex;flex-direction:column;overflow:hidden;transition:height .4s cubic-bezier(.4,0,.2,1)}
header{border-bottom:1px solid var(--line);transition:border-color .3s;padding:20px 16px 16px 20px;display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.abody{display:flex;flex-direction:column;flex:1;min-height:0;transform-origin:top right;transition:opacity .25s ease .1s,transform .35s cubic-bezier(.4,0,.2,1),visibility 0s}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--o);margin:0 0 6px}
h1{white-space:nowrap;font-size:22px;line-height:1.15;font-weight:700;margin:0 0 8px;letter-spacing:-.01em}
h1 em{font-style:normal;color:var(--o)}
header p{margin:0;color:var(--mut);font-size:12.5px}
.btns{display:flex;padding:14px 20px}
button{font:inherit;cursor:pointer}
.pill{flex:1;font-size:12.5px;font-weight:600;border:1.5px solid var(--o);color:#fff;background:var(--o);border-radius:999px;padding:9px 16px;transition:.15s}
.pill:hover{background:#d93a10;border-color:#d93a10}
button:focus-visible,input:focus-visible,select:focus-visible,#cv:focus-visible,.vh:focus-visible+label{outline:2px solid var(--o);outline-offset:2px}
button:disabled{cursor:not-allowed;opacity:.5}
#tree{overflow:auto;flex:1;padding:8px 0}
.row{display:flex;align-items:center;gap:6px;min-height:32px;padding:2px 12px 2px calc(10px + var(--d)*18px);border-left:3px solid transparent;cursor:pointer}
.row[hidden]{display:none}
.row:hover{background:#f5f6f7}
.row.sel{background:rgba(250,70,22,.09);border-left-color:var(--o)}
.row.sel .name{font-weight:600}
.row.off .name{opacity:.4}
.row .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;border:0;background:none;color:inherit;padding:4px 0;font:inherit}
.row input{accent-color:var(--o);margin:0;cursor:pointer}
.chev{width:20px;height:20px;border:0;background:none;color:var(--mut);padding:0;border-radius:4px;font-size:10px;transition:transform .15s}
.chev.open{transform:rotate(90deg);color:var(--o)}
.chev.none{visibility:hidden}
.iso{width:24px;height:24px;border:1.5px solid var(--line);border-radius:50%;background:#fff;color:var(--mut);font-size:12px;padding:0;line-height:1}
.iso:hover,.iso.on{background:var(--o);border-color:var(--o);color:#fff}
#msg{position:fixed;inset:0;display:grid;place-content:center;gap:12px;text-align:center;pointer-events:none;color:var(--mut)}
#msg[hidden]{display:none}#msg p{margin:0;max-width:34em;padding:0 24px}#error{color:#b8330f;font-weight:600}#error:empty,#status:empty{display:none}
@media(max-width:720px){#logo{height:44px;top:12px;left:14px}aside{top:auto;left:8px;right:8px;bottom:8px;width:auto;height:42vh}}
#help{position:fixed;top:108px;left:16px;width:292px;transition:top .4s cubic-bezier(.4,0,.2,1),width .4s cubic-bezier(.4,0,.2,1);max-height:calc(100vh - 124px);overflow:auto;background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.7);border-radius:12px;box-shadow:0 8px 30px rgba(20,28,40,.1);color:#5d6670;font-size:12px;line-height:1.5}
.hhead{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 14px 14px 18px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#4a525c}
#hmin,#amin{flex:none;width:28px;height:28px;border:1.5px solid #c9cdd2;border-radius:50%;background:rgba(255,255,255,.8);color:#6b7480;font-size:14px;padding:0;line-height:1}
#hmin:hover,#amin:hover{border-color:var(--o);color:var(--o)}
.hwrap{display:grid;grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .4s cubic-bezier(.4,0,.2,1)}
.hbody{overflow:hidden;min-height:0}
.hin{padding:0 16px 16px;transition:opacity .25s ease .1s,transform .35s cubic-bezier(.4,0,.2,1)}
#help.min .hwrap{grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .4s cubic-bezier(.4,0,.2,1),visibility 0s linear .4s}
#help.min .hin{opacity:0;transform:translateY(-8px) scale(.97);transition:opacity .2s ease,transform .35s cubic-bezier(.4,0,.2,1)}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
aside.min header{border-bottom-color:transparent}
aside.min .abody{opacity:0;transform:translateY(-10px) scale(.97);visibility:hidden;pointer-events:none;transition:opacity .2s ease,transform .35s cubic-bezier(.4,0,.2,1),visibility 0s linear .4s}
.mice{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px;text-align:center}
.mice figure{margin:0}.mice svg{width:34px;height:auto;display:block;margin:0 auto 6px}
.mice figcaption{font-size:11px;line-height:1.35}.mice b{display:block;color:#4a525c;font-size:11.5px}
.mb{fill:#fff;stroke:#9aa1a9;stroke-width:1.4}.mw{fill:#d5d9dd;stroke:#9aa1a9;stroke-width:1}
.mb.hl,.mw.hl{fill:var(--o);stroke:var(--o)}
#help ul{margin:0;list-style:none;display:grid;gap:16px;border-top:1px solid rgba(0,0,0,.08);padding:16px 0 0}
#help li b{color:#4a525c}
@media(max-width:720px){h1{white-space:normal}#help{top:64px;left:8px;right:8px;width:auto;max-height:calc(58vh - 80px)}}
/* Model picker, local preview, view tools */
.pick{padding:14px 20px 10px;border-bottom:1px solid var(--line);display:grid;gap:8px}
.pick .eyebrow{margin:0}
.pick-row{display:flex;gap:8px;align-items:center}
.pick-step{display:grid;gap:8px}
#model-select,#step-select{flex:1;min-width:0;font:inherit;font-weight:600;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:8px;padding:7px 10px}
.ghost{flex:none;font-size:12px;font-weight:600;border:1.5px solid var(--o);color:var(--o);background:rgba(255,255,255,.8);border-radius:999px;padding:7px 12px;cursor:pointer;transition:.15s}
.ghost:hover:not(:disabled){background:var(--o);color:#fff}
.ghost.file{flex:1;text-align:center}
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
#notice{margin:0;color:var(--mut);font-size:12px}#notice:empty{display:none}
.btns{gap:10px;align-items:center}
.tools{display:flex;gap:6px}
.tool{width:34px;height:34px;border:1.5px solid var(--line);border-radius:50%;background:#fff;color:var(--mut);font-size:15px;padding:0;line-height:1}
.tool:hover:not(:disabled){border-color:var(--o);color:var(--o)}
.row .chev,.row .iso{flex:none}
#cv:focus-visible{outline-offset:-4px}
#msg.done{inset:auto;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* Sign-in card and session bar */
html[data-auth="pending"] aside,html[data-auth="pending"] #help,html[data-auth="signed-out"] aside,html[data-auth="signed-out"] #help,html[data-auth="signed-out"] #msg{display:none}
#auth{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:min(420px,calc(100vw - 32px));background:rgba(255,255,255,.85);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.7);border-radius:12px;box-shadow:0 8px 30px rgba(20,28,40,.12);padding:24px}
#auth[hidden],#auth [hidden]{display:none}
#auth h1{white-space:normal;margin:0 0 12px}
#auth form{display:grid;gap:8px}
#auth label{font-weight:600;font-size:12.5px}
#auth input{font:inherit;padding:9px 12px;border:1.5px solid var(--line);border-radius:8px;background:#fff;color:var(--ink)}
#auth .hint{margin:0 0 6px;color:var(--mut)}
#auth .pill{margin-top:4px}
#auth-status{margin:12px 0 0;color:var(--mut)}#auth-status:empty{display:none}
#auth-status.error{color:#b8330f;font-weight:600}
.session{display:flex;align-items:center;gap:8px;padding:10px 20px;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--mut)}
.session[hidden]{display:none}
.session .who{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.session .ghost{text-decoration:none}
@media(max-width:720px){#auth{top:auto;bottom:16px;transform:translateX(-50%)}}
