
@font-face{font-family:"Marcellus SC";src:url(/ui/fonts/marcellus-sc-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Pinyon Script";src:url(/ui/fonts/pinyon-script-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Geist";src:url(/ui/fonts/geist-sans-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Geist";src:url(/ui/fonts/geist-sans-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Geist";src:url(/ui/fonts/geist-sans-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
:root{
  --color-felt:#0E0F0E;--color-ink:#141210;--color-ink-2:#4A4541;--color-ink-3:#77706A;
  --color-ivory:#F6F2EC;--color-ivory-2:#C9C4BC;--color-ivory-3:#8E8982;
  --color-ground:#F3F1ED;--color-card:#FCFAF5;--color-card-2:#F4EFE6;--color-line:#ECEAE6;--color-line-strong:#DEDBD5;
  --color-bordeaux:#711B24;--color-oxblood:#350406;--color-panel:#FFFFFF;
  --color-on-accent:#FFFFFF;--color-accent-hover:#5E1620;--color-ink-hover:#2C2825;--color-line-soft:#ECEAE6;--color-scrim:rgba(20,18,16,.45);
  --color-ok:#2F6B3F;--color-ok-bg:#EAF3EC;--color-danger:#A12A2A;--color-alert-bg:#FBF5F3;--color-alert-line:rgba(113,27,36,.28);
  --color-on-accent-soft:rgba(255,255,255,.75);--color-on-accent-line:rgba(255,255,255,.4);--color-felt-2:#1A1917;--color-felt-line:#34302C;--color-felt-hover:#262422;
  --shadow-card:0 1px 2px rgba(20,18,16,.04),0 6px 18px rgba(20,18,16,.05);--shadow-dark:0 8px 24px rgba(20,18,16,.18);--shadow-hair:0 1px 2px rgba(20,18,16,.04);--shadow-pop:0 4px 12px rgba(20,18,16,.08);--shadow-modal:0 1px 2px rgba(20,18,16,.04),0 10px 30px rgba(20,18,16,.08);
  --font-display:"Marcellus SC",Georgia,serif;--font-script:"Pinyon Script",cursive;--font-body:"Geist",-apple-system,sans-serif;
  --radius-sm:6px;--radius-md:10px;--radius-lg:14px;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--color-ground) url(/ui/paper.svg);color:var(--color-ink);font:400 14px/1.45 var(--font-body);-webkit-font-smoothing:antialiased}
a{color:inherit}
h1,.display{font:400 40px/1.15 var(--font-display);font-variant:small-caps;letter-spacing:.01em;margin:0 0 24px;color:var(--color-ink)}
h2{font:500 17px/1.3 var(--font-body);margin:0;color:var(--color-ink);text-transform:none;letter-spacing:0}
h3{font:500 15px/1.35 var(--font-body);margin:0}
p{margin:0 0 8px}
.muted,.sub{color:var(--color-ink-3)}
label{display:block;font-weight:500;font-size:13px;color:var(--color-ink);margin:0 0 6px}
input,select,textarea{width:100%;font:inherit;color:var(--color-ink);height:44px;padding:0 14px;border:1px solid var(--color-line-strong);border-radius:var(--radius-sm);background:var(--color-panel);outline:none}
select.compact{width:auto;min-width:180px;height:40px;padding:0 36px 0 14px;font-size:13.5px;appearance:none;-webkit-appearance:none;background:linear-gradient(45deg,transparent 50%,var(--color-ink-2) 50%) calc(100% - 19px) 17px/5px 5px no-repeat,linear-gradient(135deg,var(--color-ink-2) 50%,transparent 50%) calc(100% - 14px) 17px/5px 5px no-repeat,var(--color-panel);cursor:pointer}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
textarea{height:auto;min-height:88px;padding:10px 14px}
input:focus,select:focus,textarea:focus{border-color:var(--color-ink-3)}
button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;font:500 14px var(--font-body);border-radius:var(--radius-sm);border:1px solid var(--color-bordeaux);background:var(--color-bordeaux);color:var(--color-on-accent);cursor:pointer;text-decoration:none;white-space:nowrap}
button:hover,.btn:hover{background:var(--color-accent-hover)}
button.quiet,.btn.quiet,button.secondary,.btn.secondary{background:var(--color-panel);color:var(--color-ink);border-color:var(--color-line-strong)}
button.quiet:hover,.btn.quiet:hover,button.secondary:hover,.btn.secondary:hover{background:var(--color-card-2)}
button:disabled{opacity:.5;cursor:default}
button.wide,.btn.wide{width:100%;height:44px}
code,pre{font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace}
.card,section.card{background:var(--color-panel);border:1px solid var(--color-line);border-radius:var(--radius-lg);box-shadow:0 1px 2px rgba(20,18,16,.04)}
.panel{background:var(--color-card);border:1px solid var(--color-line);border-radius:var(--radius-lg)}
.panel-head{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--color-line)}
.panel-body{padding:18px 20px}
.row{display:flex;align-items:center;gap:10px}
.stack>*+*{margin-top:12px}
.tag,.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--color-ink-2);background:var(--color-card-2);border:1px solid var(--color-line);border-radius:999px;padding:2px 10px}
.msg{min-height:20px;margin:10px 0 0;color:var(--color-bordeaux);font-size:13px}.msg.good{color:var(--color-ok)}
.divider{display:flex;align-items:center;gap:12px;color:var(--color-ink-3);font-size:12px;margin:18px 0}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--color-line-strong)}
.logo{display:inline-flex;align-items:center;gap:10px;font:500 19px var(--font-body);color:var(--color-ink);text-decoration:none}
.logo .mark{width:28px;height:28px;border-radius:7px;background:var(--color-ink);display:inline-flex;align-items:center;justify-content:center}
.logo .mark svg{width:16px;height:16px;fill:#fff}

/* App shell (frame 03) */
.shell{display:grid;grid-template-columns:248px 1fr;min-height:100vh}
.shell.side-last .side{grid-column:1;grid-row:1}.shell.side-last .main{grid-column:2;grid-row:1}
.side{background:var(--color-ground);border-right:1px solid var(--color-line);padding:22px 16px;display:flex;flex-direction:column;gap:18px;position:sticky;top:0;height:100vh}
.side .logo{padding:2px 8px}
.ws{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--color-panel);border:1px solid var(--color-line);border-radius:var(--radius-md);text-decoration:none;color:inherit}
.ws .init{width:22px;height:22px;border-radius:5px;background:var(--color-ink);color:#fff;font:600 11px var(--font-body);display:inline-flex;align-items:center;justify-content:center}
.ws .name{flex:1;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ws .credits{font-size:12px;color:var(--color-ink-2)}
.ws .credits::before{content:'◉ '}
.nav{display:flex;flex-direction:column;gap:2px}
.nav a{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:var(--radius-sm);color:var(--color-ink-2);text-decoration:none;font-size:13.5px;border:1px solid transparent}
.nav a svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.6;flex:none}
.nav a:hover{background:var(--color-card-2)}
.nav a.on{background:var(--color-panel);border-color:var(--color-line);color:var(--color-ink);font-weight:500;box-shadow:0 1px 2px rgba(20,18,16,.05)}
.nav a .count{margin-left:auto;color:var(--color-bordeaux);font-weight:500;font-size:12px}
.nav hr{border:0;border-top:1px solid var(--color-line);margin:10px 8px}
.side .tools{margin-top:auto;border-top:1px solid var(--color-line);padding-top:14px}
.side .tools .label{font-size:12px;color:var(--color-ink-3);padding:0 10px 8px}
.side .tools a{display:flex;align-items:center;gap:10px;padding:6px 10px;color:var(--color-ink-2);text-decoration:none;font-size:13px}
.main{padding:40px 56px 64px;max-width:1180px;width:100%}
.main-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:22px}
.main-head h1{margin:0}
.side .out{font-size:12px;color:var(--color-ink-3);padding:0 10px;background:none;border:0;height:auto;justify-content:flex-start}

/* Onboarding shell (frames 02.x) */
html:has(.ob-top),body:has(.ob-top){background:var(--color-card)}
.ob-top{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;border-bottom:1px solid var(--color-line);background:var(--color-card)}
.ob-steps{display:flex;align-items:center;gap:14px;font-size:13px;color:var(--color-ink-2)}
.ob-bars{display:flex;gap:4px}.ob-bars i{display:block;width:28px;height:3px;border-radius:2px;background:var(--color-line-strong)}.ob-bars i.on{background:var(--color-bordeaux)}
.ob-main{max-width:600px;margin:0 auto;padding:72px 0 80px}
.ob-main.wide{max-width:800px}
.ob-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:32px}
.ob-nav{display:flex;justify-content:space-between;align-items:center;margin-top:40px;padding-top:20px;border-top:1px solid var(--color-line)}
.ob-inline{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 20px;padding:12px 16px;background:var(--color-card);border:1px solid var(--color-line);border-radius:var(--radius-md);font-size:13px;color:var(--color-ink-2)}

/* Sign-in split (frame 01) */
.auth{display:grid;grid-template-columns:640px 1fr;min-height:100vh}
.auth-art{background:url(/ui/grain.svg),var(--color-felt);color:var(--color-ivory);padding:40px 56px;display:flex;flex-direction:column;justify-content:space-between}
.auth-art .logo{color:var(--color-ivory)}.auth-art .logo .mark{background:transparent}.auth-art .logo .mark svg{width:24px;height:24px}
.auth-art .line1{font:400 44px/1.1 var(--font-display);font-variant:small-caps;color:var(--color-ivory);margin:0}
.auth-art .line2{font:400 44px/1.15 var(--font-script);color:var(--color-ivory-2);margin:6px 0 0}
.auth-form{display:flex;align-items:center;justify-content:center;padding:40px}
.auth-form .box{width:380px}
/* Shared page parts (frames 03, 05, 07, 10): card grid, list rows, small and dark buttons, back link, tool chip */
.page-sub{color:var(--color-ink-2);margin:-18px 0 26px}
.back{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--color-ink-2);text-decoration:none;margin:0 0 10px}.back:before{content:"\2190"}
button.sm,.btn.sm{height:34px;padding:0 16px;font-size:13px}
button.ink,.btn.ink{background:var(--color-ink);border-color:var(--color-ink);color:#fff}
button.ink:hover,.btn.ink:hover{background:var(--color-ink-hover)}
.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;list-style:none;margin:0;padding:0}
.card-grid>article,.card-grid>li{background:linear-gradient(180deg,var(--color-panel),var(--color-card));border:1px solid var(--color-line);border-radius:var(--radius-lg);box-shadow:0 1px 2px rgba(20,18,16,.04),0 6px 18px rgba(20,18,16,.05);padding:20px;display:flex;flex-direction:column;gap:8px;min-height:200px}
.card-grid>article h2{font:500 17px/1.35 var(--font-body)}
.card-grid>article p{margin:0;color:var(--color-ink-2);font-size:13px}
.card-foot{margin-top:auto;display:flex;gap:8px;padding-top:16px}.card-foot>:last-child{flex:1}
.rows{list-style:none;margin:0;padding:0}
.rows>li{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--color-line)}.rows>li:first-child{border-top:0}
.panel>.rows{padding:4px 20px}
.split{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px;align-items:start}
.col{display:flex;flex-direction:column;gap:20px;min-width:0}
.panel-head h2{font-size:18px}.panel-body pre{white-space:pre-wrap;margin:0}
.panel.alert{border-color:rgba(113,27,36,.28);background:#FBF5F3}.panel.alert h2,.alert-text{color:var(--color-bordeaux)}
.chip-icon{width:30px;height:30px;border:1px solid var(--color-line);border-radius:7px;background:var(--color-panel);display:inline-flex;align-items:center;justify-content:center;font:600 11px var(--font-body);color:var(--color-ink-2);flex:none}
.card-grid>article.blurred{border-style:dashed;box-shadow:none;background:transparent}
/* Frames 05 and 06: library card parts, the starter command bar and the "what you can ask" groups */
.card-grid .chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.card-head h2{flex:1}
.card-grid>article .per-run{color:var(--color-ink);font-size:13px}
.card-grid>article .reason{color:var(--color-bordeaux);font-size:13px}
.card-grid>article .status{min-height:18px;font-size:13px;color:var(--color-ink-2)}
.card-grid>article[data-coming-soon="true"]{border-style:dashed;box-shadow:none;background:transparent}
.picker{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.cmd{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--color-felt);color:var(--color-ivory);border-radius:var(--radius-lg);padding:0 12px 0 22px;height:64px;margin:0 0 28px;box-shadow:0 6px 18px rgba(20,18,16,.18)}
.cmd code{color:var(--color-ivory);font-size:14px}.cmd .dollar{color:var(--color-ivory-3);margin-right:14px}
.cmd button{background:transparent;border-color:rgba(246,242,236,.22);color:var(--color-ivory);height:36px}
.cmd button:hover{background:rgba(246,242,236,.08)}
.main-head .count{color:var(--color-ink-3);font-size:13px}
.ask-group{margin:0 0 20px;background:var(--color-card);overflow:hidden}
.ask-group .panel-head{padding:16px 20px}.ask-group .panel-head .tools-line{color:var(--color-ink-3);font-size:12.5px}
.ask-rows{list-style:none;margin:0;padding:0}
.ask-rows>li{display:grid;grid-template-columns:230px minmax(0,1fr) 190px 120px;align-items:center;gap:16px;padding:11px 20px;border-top:1px solid var(--color-line)}
.ask-group .panel-head{gap:12px}.ask-group .panel-head h2{margin-right:auto}.ask-rows button[data-copy] svg,.cmd button svg{flex:none}
.ask-rows .ask-label{font-weight:400}.ask-rows .ask-prompt{font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--color-ink-2)}
.ask-rows .ask-access{font-size:13px;color:var(--color-ink-3)}.ask-rows .ask-access.writes{color:var(--color-ink)}
.never{border:1px dashed var(--color-line-strong);border-radius:var(--radius-md);padding:16px 20px;color:var(--color-ink-2);font-size:13px;margin-top:20px}
@media (max-width:1100px){.ask-rows>li{grid-template-columns:1fr 1fr}}
/* Credit mark: a small ringed dot before a credit figure */
.cr{display:inline-block;width:11px;height:11px;border-radius:50%;background:var(--color-ink);vertical-align:-1px;margin-right:6px;box-shadow:inset 0 0 0 2px var(--color-panel),inset 0 0 0 3px var(--color-ink)}
/* Plain data tables and a big-number tile (credits used) */
.data-table{width:100%;border-collapse:collapse;font-size:13.5px}
.data-table th{text-align:left;font-weight:400;color:var(--color-ink-3);padding:8px 0;border-bottom:1px solid var(--color-line)}
.data-table td{padding:12px 0;border-bottom:1px solid var(--color-line)}
.data-table tr:last-child td{border-bottom:0}
.data-table .num{text-align:right;width:140px}
.tile{margin:18px 0}.tile .big{font:500 40px/1.1 var(--font-body);margin-bottom:6px}
.usage-picker{flex-wrap:wrap;margin-bottom:14px}
/* Frames 05 and 05b: agent library groups and the settings page (stepper, choice rows, toggles, live estimate) */
.coin{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.6;vertical-align:-2px;margin:0 3px}
.group-title{font:500 18px/1.3 var(--font-body);margin:36px 0 14px}
.card-grid>article[data-availability="coming_soon"]{border-style:dashed;box-shadow:none;background:transparent;opacity:.6;min-height:110px}
input[type=radio],input[type=checkbox]{width:auto;height:auto}
.stepper{display:flex;align-items:center;gap:8px}.stepper button{width:44px;padding:0}.stepper input{width:72px;text-align:center}.stepper .label{margin-left:8px;color:var(--color-ink-2)}
.choice{display:flex;align-items:center;gap:12px;border:1px solid var(--color-line);border-radius:var(--radius-md);padding:12px 16px;margin:0 0 10px;font-weight:400;font-size:14px;cursor:pointer}
.choice.on{border-color:var(--color-ink);background:var(--color-panel)}.choice .who{margin-left:auto;color:var(--color-ink-2);font-size:13px}
.choice select{width:auto;height:30px;margin-left:auto;padding:0 8px;font-size:13px}
.cap-field{max-width:200px}
.toggle-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 0;border-top:1px solid var(--color-line)}.toggle-row:first-child{border-top:0}
.toggle-row .label{margin:0;font-weight:500}.toggle-row .hint{color:var(--color-ink-3);font-size:13px}
input.switch{appearance:none;-webkit-appearance:none;width:40px;height:24px;border-radius:12px;background:var(--color-line-strong);position:relative;cursor:pointer;margin:0;border:0;flex:none}
input.switch:before{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .12s}
input.switch:checked{background:var(--color-ink)}input.switch:checked:before{left:19px}
.est-big{font:500 40px/1.1 var(--font-body);margin:4px 0 14px}.est-big .coin{width:28px;height:28px}
.est-row{display:flex;justify-content:space-between;padding:10px 0;border-top:1px solid var(--color-line);color:var(--color-ink-2);font-size:13.5px}.est-row b{font-weight:400;color:var(--color-ink)}
.est-actions{display:flex;gap:10px;margin-top:16px}.est-actions>*{flex:1}
.fixed-line{color:var(--color-ink-3);font-size:13px;padding-top:12px;border-top:1px solid var(--color-line);margin:0}
/* Frames 04, 04b and 04c: routines (list, new/edit form, one routine) */
.rt-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px}.rt-head h1{margin:0}
.rt-head .sub{margin:6px 0 0}.rt-head .acts{display:flex;gap:10px;align-items:center}
.rt-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.rt-card{display:grid;grid-template-columns:minmax(0,1fr) auto 220px auto;align-items:center;gap:24px;padding:22px 24px;background:linear-gradient(180deg,var(--color-panel),var(--color-card));border:1px solid var(--color-line);border-radius:var(--radius-lg);box-shadow:0 1px 2px rgba(20,18,16,.04),0 6px 18px rgba(20,18,16,.05)}
.rt-card h2{font-size:18px;margin:0 0 4px}.rt-card p{margin:2px 0;font-size:13px;color:var(--color-ink-2)}
.rt-card.paused{border-style:dashed;box-shadow:none;background:transparent}.rt-card.paused h2,.rt-card.paused p,.rt-card.paused .rt-nums{color:var(--color-ink-3)}
.rt-card.paused .chip-icon{opacity:.55}
.rt-icons{display:flex;gap:8px}
.rt-nums{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--color-ink-2)}.rt-nums b{font-weight:500;font-size:15px;color:var(--color-ink);margin-right:4px}
.rt-card.paused .rt-nums b{color:var(--color-ink-3)}
.rt-go{width:34px;height:34px;padding:0;background:var(--color-panel);color:var(--color-ink);border:1px solid var(--color-line-strong);border-radius:var(--radius-sm)}.rt-go:hover{background:var(--color-card-2)}
.rt-off{opacity:.55;pointer-events:none}
.rt-empty{max-width:520px;margin:90px auto 0;text-align:center}.rt-empty p{color:var(--color-ink-2)}
.rt-connect{display:flex;flex-direction:column;align-items:center;gap:14px;padding:40px 0}
.rt-form{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px;align-items:start}
.rt-card-box{background:var(--color-card);border:1px solid var(--color-line);border-radius:var(--radius-lg);margin:0 0 20px}
.rt-card-box>h2,.rt-card-box>.rt-box-head{padding:18px 20px;border-bottom:1px solid var(--color-line);font-size:18px}
.rt-box-head{display:flex;justify-content:space-between;align-items:center}.rt-box-head h2{font-size:18px}
.rt-box-body{padding:18px 20px}
.rt-agents{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.rt-agent{display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid var(--color-line);border-radius:var(--radius-md);padding:12px 16px;background:var(--color-panel)}
.rt-agent.on{border-color:var(--color-ink)}
.rt-agent.locked{border-style:dashed;background:transparent}.rt-agent.locked .grow,.rt-agent.locked .chip-icon{opacity:.6}
.rt-agent .pick{display:flex;align-items:center;gap:14px;flex:1;min-width:0;margin:0;font-weight:400;cursor:pointer}
.rt-agent .grow{display:flex;flex-direction:column;min-width:0}.rt-agent .grow strong{font-weight:500}.rt-agent .grow .muted{font-size:13px}
.rt-agent .end{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--color-ink-2);white-space:nowrap}
.rt-agent .end input.runs{width:64px;height:34px;padding:0 8px;text-align:center}
.rt-agent .end .why{color:var(--color-ink-3);white-space:normal;text-align:right;max-width:260px}
.rt-fields{display:grid;grid-template-columns:200px minmax(0,1fr);gap:16px 16px;align-items:end}
.rt-days{display:flex;gap:8px;flex-wrap:wrap}
.rt-days button{height:44px;min-width:50px;padding:0 12px;background:var(--color-panel);color:var(--color-ink-2);border:1px solid var(--color-line-strong)}
.rt-days button[aria-pressed="true"]{background:var(--color-ink);border-color:var(--color-ink);color:#fff}
.rt-cap{max-width:200px}
.rt-est-big{font:500 40px/1.1 var(--font-body);margin:4px 0 14px}
.rt-why{min-height:18px;color:var(--color-ink-3);font-size:13px;margin:10px 0 0}
.rt-detail{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px;align-items:start}
.rt-rows{list-style:none;margin:0;padding:4px 20px}
.rt-rows>li{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--color-line)}.rt-rows>li:first-child{border-top:0}
.rt-rows .grow{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.rt-rows .grow strong{font-weight:500}.rt-rows .grow .muted{font-size:13px}
.rt-rows .upto{color:var(--color-ink-2);font-size:13px;white-space:nowrap}
.rt-next{font:400 22px/1.3 var(--font-body);margin:0 0 2px}
.rt-meter{width:100%;height:4px;border:0;border-radius:2px;background:var(--color-line);appearance:none;-webkit-appearance:none;overflow:hidden}
.rt-meter::-webkit-progress-bar{background:var(--color-line)}.rt-meter::-webkit-progress-value{background:var(--color-ink)}.rt-meter::-moz-progress-bar{background:var(--color-ink)}
.rt-trust{color:var(--color-ink-3);font-size:13px;margin:18px 0 0}
.rt-from{color:var(--color-ink-3)}
.rt-danger{border-color:var(--color-line-strong);background:var(--color-panel);color:var(--color-bordeaux)}
/* Tool logos (served at /ui/logos/<id>.svg, drawn only through toolTile) */
.tool-tile{display:inline-flex;align-items:center;justify-content:center;flex:none;background:var(--color-panel);border:1px solid var(--color-line);border-radius:7px;overflow:hidden;vertical-align:middle;color:var(--color-ink-2);font:600 11px var(--font-body)}
.tool-tile img{display:block;width:70%;height:70%;object-fit:contain}
.tool-tile.sm{width:22px;height:22px;border-radius:5px}.tool-tile.md{width:30px;height:30px}.tool-tile.lg{width:40px;height:40px;border-radius:9px}
.tool-tiles{display:inline-flex;align-items:center;gap:6px}
/* Onboarding looks (frames 02.x): one bottom row, split button, list card with header row, coin, tool marks */
.ob-steps .ob-link{font-size:13px;color:var(--color-ink-2);text-decoration:none}.ob-steps .ob-link:hover{color:var(--color-ink)}
.ob-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:28px;font-size:13px;color:var(--color-ink-2)}
.ob-foot .ob-foot-act{display:flex;align-items:center;gap:16px;color:var(--color-ink-2)}
.ob-foot .go{min-width:200px;height:44px;padding:0 28px}
.ob-foot .go::after{content:"\2192";font-size:13px;margin-left:4px}
.ob-foot .go.split{min-width:0}.ob-foot .go.split::after{content:none}
.coin-glyph{width:14px;height:14px;flex:none;vertical-align:-2px}.coin-glyph .disc{fill:var(--color-ink)}.coin-glyph .ring{fill:none;stroke:var(--color-panel);stroke-width:1.3;stroke-dasharray:1.6 1.6}
.split .coin-glyph .disc,[data-split-run] .coin-glyph .disc,.btn.split .coin-glyph .disc,button.split .coin-glyph .disc{fill:var(--color-on-accent)}
.btn.split .coin-glyph .ring,[data-split-run] .coin-glyph .ring,button.split .coin-glyph .ring{stroke:var(--color-bordeaux)}
.btn.split,button.split,[data-split-run]{display:inline-flex;align-items:center;justify-content:center;gap:12px}
.split .sep,[data-split-run] .sep{width:1px;height:14px;background:var(--color-on-accent-line)}.split .amt,[data-split-run] .amt{display:inline-flex;align-items:center;gap:6px}
.list-card{background:var(--color-panel);border:1px solid var(--color-line-strong);border-radius:var(--radius-lg)}
.list-card .list-head{display:flex;align-items:center;gap:14px;padding:14px 20px;font-size:17px;font-weight:500;border-bottom:1px solid var(--color-line)}
.tool-tile svg{display:block;width:70%;height:70%}

.side .tools a{gap:10px}.side .tools a .name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side .tools a .ok{margin-left:auto;color:var(--color-ok)}
.side .tools a .reconnect{margin-left:auto;font-size:12px;color:var(--color-bordeaux);font-weight:500}
.side .tools .empty{display:flex;align-items:center;gap:10px;padding:6px 10px;margin:2px 0;border:1px dashed var(--color-line-strong);border-radius:var(--radius-sm);color:var(--color-ink-3);font-size:13px;text-decoration:none}
.side .tools .empty .sq{width:22px;height:22px;border:1px dashed var(--color-line-strong);border-radius:5px;flex:none}
/* Empty and error states (frames 14a to 14e) */
.state-card{max-width:520px;padding:24px;background:var(--color-panel);border:1px solid var(--color-line);border-radius:var(--radius-lg);box-shadow:var(--shadow-modal)}
.state-card h2{font-size:18px;padding-bottom:16px}
.state-card .rows{border-top:1px solid var(--color-line);border-bottom:1px solid var(--color-line)}
.state-card .rows>li{justify-content:space-between;padding:14px 0}.state-card .rows strong{font-weight:500}
.state-card .btn.wide-cta{width:100%;height:44px;margin-top:20px}
.dashed-card{display:flex;gap:16px;align-items:center;padding:16px 20px;border:1px dashed var(--color-line-strong);border-radius:var(--radius-lg);background:transparent;color:var(--color-ink-3);box-shadow:none}
.card-grid>li.dashed-card{border-style:dashed;box-shadow:none;background:transparent;color:var(--color-ink-3)}
.dashed-card h2{font-size:12px;font-weight:400;color:var(--color-ink-3);margin:0 0 2px}.dashed-card p{margin:0;font-size:13px}.dashed-card .chip-icon{opacity:.55}
.banner{display:flex;align-items:center;gap:14px;padding:12px 20px;margin:0 0 24px;background:var(--color-alert-bg);border:1px solid var(--color-alert-line);border-radius:var(--radius-md);color:var(--color-ink)}
.banner .text{flex:1}.banner .btn{background:var(--color-ink);border-color:var(--color-ink);color:var(--color-on-accent);height:34px;font-size:13px}.banner .btn:hover{background:var(--color-ink-hover)}
.run-steps{list-style:none;margin:0;padding:0}
.run-steps>li{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--color-line)}.run-steps>li:first-child{border-top:0}
.run-steps .mark{width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:12px;flex:none;border:1px solid var(--color-line-strong);color:var(--color-ink-3)}
.run-steps .done .mark{background:var(--color-ok-bg);border-color:var(--color-ok);color:var(--color-ok)}
.run-steps .fail .mark{background:var(--color-alert-bg);border-color:var(--color-danger);color:var(--color-danger)}
.run-steps .idle{color:var(--color-ink-3)}
.scrim{position:fixed;inset:0;background:var(--color-scrim);display:flex;align-items:center;justify-content:center;z-index:50}
.modal{width:min(480px,92vw);padding:24px;background:var(--color-panel);border:1px solid var(--color-line);border-radius:var(--radius-lg);box-shadow:var(--shadow-modal)}
.modal h2{font-size:18px;margin:0 0 8px}.modal .actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
/* Settings (frames 13, 13b): sub-nav, panels, member rows, tool rows, small ghost button */
[hidden]{display:none!important}
.settings{display:grid;grid-template-columns:180px minmax(0,1fr);gap:32px;align-items:start}
.settings-nav{display:flex;flex-direction:column;gap:4px;padding-top:0}
.settings-nav a{display:block;padding:8px 12px;border-radius:var(--radius-sm);border:1px solid transparent;color:var(--color-ink-2);text-decoration:none;font-size:13px}
.settings-nav a:hover{background:var(--color-card-2)}
.settings-nav a.on{background:var(--color-panel);border-color:var(--color-line);color:var(--color-ink);font-weight:500;box-shadow:var(--shadow-hair)}
.set-col{display:flex;flex-direction:column;gap:20px;min-width:0}
.set-panel{background:var(--color-card);border:1px solid var(--color-line-strong);border-radius:var(--radius-lg)}
.set-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--color-line-strong)}
.set-head h2{font-size:18px}
.set-rows{list-style:none;margin:0;padding:0 20px}
.set-rows>li{border-top:1px solid var(--color-line)}.set-rows>li:first-child{border-top:0}
.set-row{display:grid;grid-template-columns:minmax(0,1fr) 132px 150px 200px;align-items:center;gap:16px;padding:16px 0}
.set-who{display:flex;align-items:center;gap:14px;min-width:0}
.set-who .txt{display:flex;flex-direction:column;min-width:0}
.set-who .txt strong{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.set-who .txt span{color:var(--color-ink-2);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.set-you{margin-left:6px;font-weight:400;font-size:13px;color:var(--color-ink-3)}
.set-avatar{width:32px;height:32px;border-radius:8px;border:1px solid var(--color-line-strong);background:var(--color-panel);color:var(--color-ink);font:500 13px var(--font-body);display:inline-flex;align-items:center;justify-content:center;flex:none}
.set-avatar.dark{background:var(--color-ink);border-color:var(--color-ink);color:var(--color-on-accent)}
.set-avatar.dashed{border-style:dashed;color:var(--color-ink-3)}
.set-row select.set-role{height:36px;font-size:13px;padding:0 10px}
.set-role-text{font-size:13px;color:var(--color-ink)}
.set-meta{color:var(--color-ink-2);font-size:13px}
.set-acts{display:flex;justify-content:flex-end;align-items:center;gap:8px}
button.ghost{background:transparent;border-color:transparent;color:var(--color-ink-2)}
button.ghost:hover{background:var(--color-card-2)}
.set-note{margin:12px 0 0 4px;color:var(--color-ink-3);font-size:13px}
.set-flash{margin:0 0 16px;font-size:13.5px;color:var(--color-bordeaux)}.set-flash.good{color:var(--color-ink)}
.set-trow{display:grid;grid-template-columns:minmax(0,1fr) 260px auto;align-items:center;gap:16px;padding:14px 0}
.set-trow .txt{display:flex;flex-direction:column;min-width:0}
.set-trow .txt strong{font-weight:500}
.set-trow .txt span{color:var(--color-ink-2);font-size:13px}
.set-trow .set-who{gap:12px}
.set-panel-inline{margin:0 0 14px 42px;padding:14px 16px;background:var(--color-panel);border:1px solid var(--color-line);border-radius:var(--radius-md)}
.set-panel-inline form{display:flex;align-items:center;gap:10px}
.set-panel-inline input{height:36px;font-size:13px}
.set-panel-inline p{margin:0 0 8px;color:var(--color-ink-2);font-size:13px}
.set-cmd{margin:0 20px 16px;padding:14px 16px;background:var(--color-felt);color:var(--color-ivory);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:space-between;gap:16px}
.set-cmd code{color:var(--color-ivory);word-break:break-all}
.set-cmd button{background:transparent;border-color:var(--color-on-accent-line);color:var(--color-ivory);height:34px;font-size:13px}
.set-add{display:flex;align-items:flex-end;gap:10px;padding:16px 20px;border-top:1px solid var(--color-line)}
.set-add label{flex:1;margin:0;font-size:12px;font-weight:400;color:var(--color-ink-2)}
.set-add input{height:36px;margin-top:4px;font-size:13px}
.set-add button{height:36px;font-size:13px}
.set-line{margin:0;padding:0 20px 16px;color:var(--color-ink-3);font-size:13px}
.set-field{margin:0 0 16px}
@media (max-width:900px){.settings{grid-template-columns:1fr}.set-row,.set-trow{grid-template-columns:1fr}.set-acts{justify-content:flex-start}}
/* Frames 11 and 12: the Credits page, the pack tiles, the dark price panel and the pop-up that offers a smaller run or a top-up */
.cr-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0 0 28px}
.cr-card{display:flex;flex-direction:column;background:var(--color-card);border:1px solid var(--color-line);border-radius:var(--radius-lg);box-shadow:var(--shadow-hair);overflow:hidden}
.cr-card>h2{padding:20px;border-bottom:1px solid var(--color-line);font-size:18px}
.cr-body{display:flex;flex-direction:column;gap:12px;padding:20px;flex:1}
.cr-big{display:flex;align-items:center;gap:12px;font:500 44px/1.1 var(--font-body)}.cr-big .coin-glyph{width:30px;height:30px}
.cr-plan{font:500 22px/1.2 var(--font-body)}
.cr-sub{margin:0;color:var(--color-ink-2);font-size:13.5px}.cr-warn{color:var(--color-bordeaux)}
.cr-packs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.cr-pack{display:flex;flex-direction:column;align-items:flex-start;gap:2px;height:auto;padding:12px 14px;background:var(--color-panel);color:var(--color-ink);border:1px solid var(--color-line)}
.cr-pack:hover{background:var(--color-card-2)}
.cr-pack[aria-pressed="true"]{border-color:var(--color-ink);box-shadow:0 0 0 1px var(--color-ink)}
.cr-pack-n{display:inline-flex;align-items:center;gap:6px;font-size:16px}.cr-pack-p{font-size:13px;color:var(--color-ink-2)}
.cr-spend{margin:0 0 4px}.cr-table .cr-share{display:flex;align-items:center;gap:12px}.cr-table .cr-share .rt-meter{flex:1}
.cr-table td:first-child{font-weight:500}
.cr-note{color:var(--color-ink-3);font-size:13px;margin:18px 0 0}
.plan-dark{background:var(--color-felt) radial-gradient(ellipse at 30% 20%,var(--color-felt-2),transparent 60%);color:var(--color-ivory);border-radius:var(--radius-lg);padding:40px;box-shadow:var(--shadow-dark)}
.plan-dark h2.display{font:400 36px/1.15 var(--font-display);font-variant:small-caps;color:var(--color-ivory);margin:0 0 12px}
.plan-dark .script{font:400 34px/1.15 var(--font-script);color:var(--color-ivory-2);margin:0 0 56px}
.plan-price{font:500 18px var(--font-body);color:var(--color-ivory)}.plan-credits{display:flex;align-items:center;gap:6px;color:var(--color-ivory-2);font-size:13.5px;margin:4px 0 20px}
.plan-dark .coin-glyph .disc{fill:var(--color-ivory)}.plan-dark .coin-glyph .ring{stroke:var(--color-felt)}
.plan-list{list-style:none;margin:0 0 28px;padding:20px 0 0;border-top:1px solid var(--color-felt-line);display:flex;flex-direction:column;gap:12px;font-size:14px}
.plan-list li:before{content:"\2713";margin-right:12px}
button.light,.btn.light{background:var(--color-ivory);border-color:var(--color-ivory);color:var(--color-ink);height:44px;padding:0 36px}
button.light:hover,.btn.light:hover{background:var(--color-ivory-2)}
.choice .grow{flex:1;display:flex;flex-direction:column;gap:2px}.choice .grow .muted{font-size:13px}.choice .grow strong{display:inline-flex;align-items:center;gap:6px;font-weight:500}
.cr-card .choice,.modal.pw .choice{cursor:default}.cr-card .choice button,.modal.pw .choice button{margin-left:auto;flex:none}
.cr-table th.num,.cr-table td.num{width:110px;white-space:nowrap}.cr-table .coin-glyph{margin-right:6px}.cr-table th.cr-share-h{width:260px;padding-left:28px}.cr-table td:last-child{padding-left:28px}
.cr-note{margin-top:18px}
@media (max-width:1100px){.cr-grid{grid-template-columns:1fr}}
@media (max-width:1100px){.rt-form,.rt-detail{grid-template-columns:1fr}.rt-card{grid-template-columns:1fr}}
@media (max-width:1100px){.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.split{grid-template-columns:1fr}}
@media (max-width:700px){.card-grid{grid-template-columns:1fr}}
@media (max-width:900px){.auth{grid-template-columns:1fr}.auth-art{display:none}.shell{grid-template-columns:1fr}.shell.side-last .side,.shell.side-last .main{grid-column:1;grid-row:auto}.side{position:static;height:auto}.main{padding:28px 20px}}
