/* Sandbox Console (console.ucpsandbox.com), to the Console boards. Same neutrals as the stores; paper is #f4f2ec here. */
:root{--ink:#1d1c19;--ink-2:#5a564d;--ink-3:#3d3a33;--line:#e0dbcf;--line-2:#efebe2;--input:#cfc8b8;--sunken:#f3f0e8;--raised:#faf8f3;--paper:#f4f2ec;--surface:#fff;
  --ok-bg:#e6f1e8;--ok:#2d6a3e;--warn-bg:#fbf0dc;--warn:#7d4b00;--bad-bg:#f9e5e1;--bad:#9a3226;--bad-line:#e8b8ae;--chip:#f2c14e;
  --a:#2a6fa0;--b:#c2571a;--b-soft:#fbeee5;--b-ink:#8a3d12;--you-bg:#e4edf3;--you:#1f4a66;--agent-bg:#f3eadf;--agent:#7a3f12;
  --display:"Fraunces",Georgia,serif;--body:"Instrument Sans",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace}
*{box-sizing:border-box}
body.console{margin:0;min-height:100vh;display:flex;flex-direction:column;font:15px/1.5 var(--body);color:var(--ink);background:var(--paper)}
a{color:var(--ink)}a:hover{color:#000}
h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.01em}h1{font-size:30px}h2{font-size:18px}h3{font-size:16px}
p{margin:0}code,.mono{font-family:var(--mono)}code{font-size:13px}
.muted{color:var(--ink-2)}.small{font-size:13px}.num{font-variant-numeric:tabular-nums}.grow{flex-grow:1}
.hidden-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* header + shell */
.c-header{height:60px;flex-shrink:0;padding:0 24px;display:flex;align-items:center;gap:16px;background:#fff;border-bottom:1px solid var(--line);font-size:14px}
.c-brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:16px;font-weight:600}
.c-brand .mark{width:28px;height:28px;border-radius:6px;background:var(--chip);color:#1d1c19;display:flex;align-items:center;justify-content:center}
.c-header .sep{color:var(--input)}.c-header .mono{font-size:14px;font-weight:500}.c-header a:not(.c-brand){text-decoration:none}.c-header a.strong{font-weight:600}
.c-header .usage{font-size:13px;color:var(--ink-2)}
.c-header .signout button{border:0;background:transparent;font:500 13px var(--body);color:var(--ink-2);cursor:pointer;padding:0}.c-header .signout button:hover{color:var(--ink)}
.avatar{text-decoration:none;width:34px;height:34px;border-radius:50%;background:var(--you-bg);color:var(--you);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700}
.c-flash{margin:0;padding:10px 24px;background:var(--ok-bg);color:var(--ok);font-size:14px;font-weight:500}.c-flash.bad{background:var(--bad-bg);color:var(--bad)}
.c-shell{flex-grow:1;display:flex}
.c-nav{width:232px;flex-shrink:0;padding:20px 12px;display:flex;flex-direction:column;gap:2px;border-right:1px solid var(--line);font-size:15px}
.c-nav a{height:40px;padding:0 12px;display:flex;align-items:center;border-radius:6px;text-decoration:none}.c-nav a[aria-current=page]{background:#e8e3d7;font-weight:600}.c-nav a:hover{background:var(--sunken)}
.c-main{flex-grow:1;min-width:0;padding:32px 40px 48px;display:flex;flex-direction:column;gap:32px}
.c-page{padding:28px 40px 48px;display:flex;flex-direction:column;gap:28px}
.c-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px}.c-head .lead{display:flex;flex-direction:column;gap:6px}.c-head .lead span:not(.v):not(.tag):not(.chip):not(.dot):not(.tag *){font-size:15px;color:var(--ink-2)}
.c-head.top{align-items:flex-start}.c-head .meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:13px;color:var(--ink-2)}

/* controls */
.btn{height:44px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:8px;background:#1d1c19;color:#fff;font:600 15px var(--body);text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{background:#000;color:#fff}.btn.big{height:50px;font-size:16px}.btn.sm{height:38px;padding:0 14px;font-size:13px}.btn.xs{height:32px;padding:0 12px;font-size:13px}
.btn.outline{background:#fff;color:var(--ink);border:1px solid var(--input)}.btn.outline:hover{background:var(--raised);color:var(--ink)}
.btn.ghost{background:transparent;color:var(--ink-2);font-size:12px;height:30px;padding:0 10px}.btn.ghost:hover{color:var(--ink);background:transparent}
.btn[disabled]{background:var(--line);color:var(--ink-2);cursor:not-allowed}
.btn.wide{width:100%}
.field{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500}
.field input[type=text],.field input[type=email],.field input[type=password],.field input[type=number],.field select,.field textarea{height:46px;padding:0 14px;border:1px solid var(--input);border-radius:8px;font:400 16px var(--body);background:#fff;color:var(--ink);width:100%}
.field textarea{height:auto;min-height:88px;padding:12px 14px;line-height:1.45}.field.tall input{height:52px}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--ink);outline-offset:0;border-color:var(--ink)}
.field .err{font-size:13px;font-weight:500;color:var(--bad)}.field .hint{font-size:13px;font-weight:400;color:var(--ink-2)}
.check{display:flex;gap:12px;align-items:flex-start;font-size:14px;cursor:pointer}.check input{width:18px;height:18px;accent-color:#1d1c19;margin:2px 0 0;flex-shrink:0}
.seg{display:inline-flex;padding:3px;border-radius:8px;background:#e8e3d7}
.seg label,.seg a,.seg button{height:36px;padding:0 14px;display:inline-flex;align-items:center;border:0;border-radius:6px;font:600 13px var(--body);color:var(--ink-2);background:transparent;cursor:pointer;text-decoration:none;position:relative}
.seg input{position:absolute;opacity:0;width:0;height:0}.seg label:has(input:checked),.seg a[aria-current=true],.seg .on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.seg.short label,.seg.short a{height:32px;padding:0 12px}
.pills{display:flex;gap:8px;flex-wrap:wrap}
.pills label{height:38px;padding:0 14px;display:inline-flex;align-items:center;border-radius:999px;border:1px solid var(--input);background:#fff;font:500 14px var(--body);cursor:pointer;position:relative}
.pills input{position:absolute;opacity:0;width:0;height:0}.pills label:has(input:checked){background:#1d1c19;border-color:#1d1c19;color:#fff}
.tag{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;background:var(--line-2);color:var(--ink-2);font-size:12px;font-weight:600;white-space:nowrap}
.tag.ok{background:var(--ok-bg);color:var(--ok)}.tag.warn{background:var(--warn-bg);color:var(--warn)}.tag.bad{background:var(--bad-bg);color:var(--bad)}.tag.dark{background:#1d1c19;color:#fff}
.tag.dark .dot{width:6px;height:6px;border-radius:50%;background:var(--chip)}.tag.you{background:var(--you-bg);color:var(--you)}.tag.agent{background:var(--agent-bg);color:var(--agent)}
.tag.plain{background:var(--line-2);color:var(--ink-3)}
.chip{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:4px;font-size:11px;font-weight:700;letter-spacing:.04em}.chip.sample{background:var(--warn-bg);color:var(--warn)}.chip.dark{background:#1d1c19;color:#fff;letter-spacing:0;height:20px;padding:0 7px;font-weight:600}
.v{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:5px;color:#fff;font-size:12px;font-weight:700;flex-shrink:0}.v.a{background:var(--a)}.v.b{background:var(--b)}.v.s{width:18px;height:18px;font-size:11px;border-radius:4px}
.sw{display:inline-block;width:10px;height:10px;border-radius:2px}.sw.a{background:var(--a)}.sw.b{background:var(--b)}

/* cards + tables */
.card{display:flex;flex-direction:column;gap:14px;padding:22px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.card.pad{padding:24px}.card.tight{gap:10px;padding:20px;border-radius:10px}.card.dashed{background:transparent;border:1px dashed var(--input)}
.card .ch{display:flex;flex-direction:column;gap:4px}.card .ch span{font-size:13px;color:var(--ink-2)}
.card h2{font-size:17px}
table.c{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:14px}
table.c th{background:var(--raised);text-align:left;font-size:12px;color:var(--ink-2);letter-spacing:.04em;text-transform:uppercase;font-weight:600;padding:12px 16px;white-space:nowrap}
table.c td{padding:14px 16px;border-top:1px solid var(--line-2);vertical-align:middle}table.c td.r,table.c th.r{text-align:right}table.c a.t{font-weight:600}
table.c.inner{border:0;border-radius:0;background:transparent}table.c.inner th{background:transparent;padding:10px 8px}table.c.inner td{padding:12px 8px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.grid12{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}.span7{grid-column:span 7}.span5{grid-column:span 5}.span8{grid-column:span 8}.span4{grid-column:span 4}
.section{display:flex;flex-direction:column;gap:14px}.section .sh{display:flex;justify-content:space-between;align-items:baseline;gap:16px}.section .sh span{font-size:14px;color:var(--ink-2)}
.links{display:flex;gap:14px;font-size:14px;font-weight:600;padding-top:4px}.links form{display:inline}.links button{border:0;background:transparent;font:600 14px var(--body);color:var(--ink);padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
dl.kv{margin:0;display:flex;flex-direction:column;gap:10px;font-size:14px}dl.kv div{display:flex;justify-content:space-between;gap:12px}dl.kv dt{color:var(--ink-2)}dl.kv dd{margin:0;text-align:right}
dl.kv .total{padding-top:12px;border-top:1px solid var(--line-2);font-size:18px;font-weight:700}dl.kv .total dt{color:var(--ink)}
dl.lines{margin:0;display:flex;flex-direction:column;font-size:14px}dl.lines div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-top:1px solid var(--line-2)}dl.lines dd{margin:0;font-weight:600;text-align:right}
dl.two{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;font-size:13px}dl.two div{display:flex;flex-direction:column;gap:2px}dl.two dt{color:var(--ink-2)}dl.two dd{margin:0;font-weight:600}
.note{padding:12px 14px;border-radius:8px;background:var(--raised);font-size:13px;line-height:1.5;color:var(--ink-3)}
.empty{padding:28px;border-radius:10px;border:1px dashed var(--input);font-size:14px;color:var(--ink-2);display:flex;flex-direction:column;gap:10px;align-items:flex-start}

/* login */
.login{flex-grow:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-height:100vh}
.login .side{background:#1d1c19;color:#e9e5dc;padding:56px 72px;display:flex;flex-direction:column;gap:40px}
.login .side .brand{display:flex;align-items:center;gap:12px;text-decoration:none}.login .side .brand .mark{width:32px;height:32px;border-radius:7px;background:var(--chip);color:#1d1c19;display:flex;align-items:center;justify-content:center}
.login .side .brand b{font-size:18px;font-weight:600;color:#fff}.login .side .brand span{font-size:14px;color:#b8b2a5}
.login .side .pitch{margin-top:auto;display:flex;flex-direction:column;gap:20px}.login .side h1{font-family:var(--display);font-weight:400;font-size:56px;line-height:1.04;letter-spacing:-.02em;color:#fff}
.login .side .pitch p{font-size:17px;line-height:1.55;color:#cfc9bd;max-width:520px}
.login .side .three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding-top:28px;border-top:1px solid #3a3833;font-size:14px;line-height:1.45}
.login .side .three div{display:flex;flex-direction:column;gap:4px}.login .side .three b{color:#fff}.login .side .three span{color:#b8b2a5}
.login .form{display:flex;align-items:center;justify-content:center;padding:40px 24px}
.login form{width:100%;max-width:420px;display:flex;flex-direction:column;gap:20px}.login form .fh{display:flex;flex-direction:column;gap:8px}.login form .fh span{font-size:15px;color:var(--ink-2)}
.login form .fine{font-size:13px;line-height:1.5;color:var(--ink-2)}.login form .alt{align-self:flex-start;font-size:14px;font-weight:600}
.login .field input{height:52px}
.login .ways{width:100%;max-width:420px;display:flex;flex-direction:column;gap:16px}.login .ways .fh{display:flex;flex-direction:column;gap:8px;margin-bottom:4px}.login .ways .fh span{font-size:15px;color:var(--ink-2)}.login .ways .fine{font-size:13px;line-height:1.5;color:var(--ink-2)}
.login .ways .sent{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:8px;background:var(--ok-bg);color:var(--ok);font-size:15px;line-height:1.45}.login .ways .sent.bad{background:var(--bad-bg);color:var(--bad)}
.login .ways .or{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--ink-2)}.login .ways .or::before,.login .ways .or::after{content:"";flex:1;height:1px;background:var(--line)}

/* home */
.stores{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.stores .card .top{display:flex;justify-content:space-between;align-items:center}.stores .card .top b{font-size:16px;font-weight:600}
.stores .card code{font-size:13px;color:var(--ink-2)}.stores .card .sub{font-size:13px;color:var(--ink-2)}
.stores form.copy{display:contents}.stores button.card{text-align:left;font-family:inherit;color:var(--ink);cursor:pointer;align-items:flex-start}
.stores button.card b{font-size:16px;font-weight:600}.stores button.card span{font-size:13px;line-height:1.45;color:var(--ink-2)}
.stores a.upload-card{text-decoration:none;color:var(--ink);align-items:flex-start}.stores a.upload-card b{font-size:16px;font-weight:600}.stores a.upload-card span{font-size:13px;line-height:1.45;color:var(--ink-2)}.stores a.upload-card:hover{border-color:var(--ink-2)}

/* catalogues */
.field input[type=file]{padding:12px 14px;border:1px dashed var(--input);border-radius:8px;background:var(--raised);font:400 14px var(--body);width:100%}
table.catalog-preview td.thumb{width:60px;padding-right:0}table.catalog-preview td.thumb img{width:44px;height:44px;object-fit:cover;border-radius:6px;background:var(--sunken);display:block}
table.c td .t2{display:flex;flex-direction:column;gap:2px}table.c td .t2 b{font-weight:600}table.c td .t2 span{font-size:12px;color:var(--ink-2)}

/* new experiment */
.new{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:32px;align-items:start}
.new .body{grid-column:span 8;display:flex;flex-direction:column;gap:28px}.new aside{grid-column:9 / span 4;position:sticky;top:24px}
.new h2 .n{color:var(--ink-2)}
.types{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.types label{min-height:92px;padding:14px;border-radius:10px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;border:1px solid var(--line);background:var(--raised);cursor:pointer;position:relative}
.types input{position:absolute;opacity:0;width:0;height:0}.types label:has(input:checked){border:2px solid var(--ink);background:#fff;padding:13px}
.types b{font-size:15px;font-weight:600}.types span{font-size:13px;line-height:1.4;color:var(--ink-2)}
.ab{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ab .card{gap:10px;padding:18px;border-radius:10px}.ab .lbl{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600}
.ab .row{padding:10px 12px;border-radius:6px;background:var(--raised);font-size:14px;line-height:1.4;display:flex;justify-content:space-between;align-items:center;gap:10px}
.ab .row.changed{background:var(--b-soft);font-weight:600}.ab .row .chg{flex-shrink:0;height:20px;padding:0 7px;display:inline-flex;align-items:center;border-radius:4px;background:var(--b);color:#fff;font-size:11px;font-weight:700}
.settings{display:none;flex-direction:column;gap:12px;padding:18px;border-radius:10px;background:#fff;border:1px solid var(--line)}.settings.on{display:flex}
.settings .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tasks{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:10px}
.tasks label{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--line-2);font-size:14px;cursor:pointer}.tasks label:first-child{border-top:0}
.tasks label input{width:18px;height:18px;accent-color:#1d1c19;margin:0}.tasks label .shape{font-size:12px;color:var(--ink-2)}
.tasks .custom{padding:12px 16px;border-top:1px solid var(--line-2)}.tasks .custom input{width:100%;height:40px;padding:0 12px;border:1px solid var(--input);border-radius:6px;font:400 14px var(--body)}
.metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.metrics label{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:10px;cursor:pointer;background:#fff;border:1px solid var(--line)}.metrics label:has(input:checked){border:2px solid var(--ink);padding:13px}
.metrics input{width:18px;height:18px;accent-color:#1d1c19;margin:2px 0 0}.metrics b{font-size:15px;font-weight:600;display:block}.metrics span{font-size:13px;color:var(--ink-2)}
.metrics label.off{opacity:.5}
.inline{display:flex;gap:32px;flex-wrap:wrap}.inline > div{display:flex;flex-direction:column;gap:8px}.inline .lbl,.lbl{font-size:14px;font-weight:500}.lbl .muted{font-weight:400}

/* results */
.kpi{display:flex;flex-direction:column;gap:10px;padding:20px;border-radius:12px;background:#fff;border:1px solid var(--line)}
.kpi .l{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600;color:var(--ink-2)}.kpi .l .role{font-size:11px;color:var(--ink-2)}
.kpi .vals{display:flex;align-items:baseline;gap:12px;font-variant-numeric:tabular-nums}.kpi .vals span{display:flex;align-items:baseline;gap:6px}.kpi .vals i{width:8px;height:8px;border-radius:2px;display:inline-block}
.kpi .vals .k{font-size:15px;color:var(--ink-2)}.kpi .vals .va{font-size:22px;font-weight:600}.kpi .vals .vb{font-size:30px;font-weight:700}
.kpi .verdict{font-size:14px;font-weight:600;color:var(--ink-3)}.kpi .verdict.good{color:var(--ok)}.kpi .verdict.bad{color:var(--bad)}.kpi .ci{font-size:12px;color:var(--ink-2)}
.funnel{display:flex;flex-direction:column;gap:14px}.funnel .row{display:flex;align-items:center;gap:12px;padding:6px 8px;border-radius:6px}.funnel .row:hover{background:var(--raised)}
.funnel .stage{width:150px;flex-shrink:0;font-size:14px}.funnel .bars{flex-grow:1;display:flex;flex-direction:column;gap:2px}.funnel .bars span{display:flex;align-items:center;gap:8px}
.funnel .bar{display:block;height:14px;border-radius:0 4px 4px 0}.funnel .bar.a{background:var(--a)}.funnel .bar.b{background:var(--b)}.funnel .pct{font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.legend{display:flex;gap:14px;font-size:13px}.legend span{display:inline-flex;align-items:center;gap:6px}
.models{display:flex;flex-direction:column;gap:6px}.models .row{display:flex;align-items:center;gap:10px;padding:4px 0}.models .name{width:130px;flex-shrink:0;font-size:13px}
.models .track{position:relative;flex-grow:1;height:28px}.models .track .base{position:absolute;left:0;right:0;top:13px;height:1px;background:var(--line-2)}
.models .track .link{position:absolute;top:13px;height:2px;background:var(--input)}.models .dot{position:absolute;top:7px;width:14px;height:14px;border-radius:50%;box-shadow:0 0 0 2px #fff;margin-left:-7px}.models .dot.a{background:var(--a)}.models .dot.b{background:var(--b)}
.models .lab{width:80px;flex-shrink:0;text-align:right;font-size:12px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.models .axis{display:flex;justify-content:space-between;padding-left:130px;padding-right:80px;font-size:11px;color:var(--ink-2)}
.filters{display:flex;gap:12px;align-items:center}
.abline{display:flex;gap:20px;font-size:14px;flex-wrap:wrap}.abline span{display:inline-flex;align-items:center;gap:8px}
.actions{display:flex;gap:10px;flex-wrap:wrap}

/* trace */
.trace{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:start}
.trace main{grid-column:span 8;display:flex;flex-direction:column;gap:20px}.trace aside{grid-column:9 / span 4;display:flex;flex-direction:column;gap:16px}
.trace .task{font-size:26px;font-weight:600;line-height:1.3}
.trace .cols,.step .top{display:grid;grid-template-columns:64px repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.trace .cols{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2);padding:0 4px}
.steps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.step{display:flex;flex-direction:column;gap:6px;padding:14px 16px 8px;border-radius:10px;background:#fff;border:1px solid var(--line)}.step.bad{border-color:var(--bad-line)}
.step .t{font-family:var(--mono);font-size:12px;color:var(--ink-2);padding-top:2px}.step .col{display:flex;flex-direction:column;gap:4px}
.step .call{font-family:var(--mono);font-size:13px;font-weight:500}.step .txt{font-size:13px;line-height:1.45;color:var(--ink-3)}
.step .req{display:flex;gap:8px;align-items:center}.step .req .mono{font-size:12px;color:var(--ink-2)}
.step .st{height:20px;padding:0 7px;display:inline-flex;align-items:center;border-radius:4px;font-family:var(--mono);font-size:11px;font-weight:500;background:var(--line-2);color:var(--ink-2)}.step .st.ok{background:var(--ok-bg);color:var(--ok)}.step .st.bad{background:var(--bad-bg);color:var(--bad)}
.step .flag{align-self:flex-start;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:600;line-height:1.4;background:var(--b-soft);color:var(--b-ink)}.step .flag.bad{background:var(--bad-bg);color:#7e2a20}
.step details{display:flex;flex-direction:column}.step summary{align-self:flex-end;list-style:none;cursor:pointer;height:30px;padding:0 10px;display:inline-flex;align-items:center;font-size:12px;font-weight:600;color:var(--ink-2)}
.step summary::-webkit-details-marker{display:none}.step summary::after{content:"Show request and response"}.step details[open] summary::after{content:"Hide request and response"}
.step .json{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-bottom:6px}
.step pre{margin:0;padding:12px;border-radius:6px;background:#1d1c19;color:#e9e5dc;font:400 12px/1.55 var(--mono);white-space:pre-wrap;word-break:break-word;max-height:360px;overflow:auto}
.verdict{display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.45}.verdict > span{display:flex;gap:10px}
.verdict .ic{flex-shrink:0;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center}.verdict .ic.ok{background:var(--ok-bg);color:var(--ok)}.verdict .ic.bad{background:var(--bad-bg);color:var(--bad)}

/* changes */
.changes th:first-child,.changes td:first-child{width:52px;font-family:var(--mono);font-size:13px;color:var(--ink-2)}
.changes td .t2{display:flex;flex-direction:column;gap:2px}.changes td .t2 b{font-weight:600}.changes td .t2 span{font-size:12px;color:var(--ink-2)}
.changes .act{display:flex;gap:6px;justify-content:flex-end}.changes .act form{display:inline}
.guard{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.guard .edit{display:none;flex-direction:column;gap:12px}.guard .edit.on{display:flex}.guard .edit .field input{height:40px;font-size:14px}
.checks{display:flex;flex-direction:column;gap:4px;font-size:12px}.checks span{display:flex;gap:6px;align-items:center}.checks .ok{color:var(--ok)}.checks .no{color:var(--bad)}

@media (max-width:1100px){.types,.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}.new .body,.new aside{grid-column:span 12}.new aside{position:static}.trace main,.trace aside{grid-column:span 12}.span7,.span5{grid-column:span 12}.stores,.grid3{grid-template-columns:1fr}}
@media (max-width:820px){.login{grid-template-columns:1fr}.login .side{padding:32px 24px}.login .side h1{font-size:36px}.c-nav{display:none}.c-main,.c-page{padding:20px 16px 40px}.c-header{padding:0 16px}.c-header .usage{display:none}.grid2,.grid4,.ab,.metrics,.guard,.types{grid-template-columns:1fr}.trace .cols{display:none}.step .top{grid-template-columns:1fr}.step .json{grid-template-columns:1fr}}

[hidden]{display:none !important}
.v.a,.v.b{color:#fff}
.funnel .pct{white-space:nowrap;flex-shrink:0}.funnel .bars span .bar{max-width:calc(100% - 84px)}
td .mono,td code{white-space:nowrap}
.span6{grid-column:span 6}
.doors{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--line);border-radius:10px;background:var(--raised,#fff);min-width:0}
.doors .dh{display:flex;align-items:center;gap:10px}.doors dd{min-width:0}.doors code{font-size:12px;word-break:break-all}
.logs{gap:24px;margin-top:16px}.logs .span6{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}
.logs .dh{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;padding:16px 18px;background:var(--paper);border-bottom:1px solid var(--line);line-height:1.35}.logs .dh b{font-size:15px}.logs .dh .small{margin-left:auto;white-space:nowrap}
.logs table{table-layout:auto}.logs th{padding-top:14px;padding-bottom:10px}.logs th:first-child,.logs td:first-child{padding-left:18px}.logs th:last-child,.logs td:last-child{padding-right:18px}.logs td.mono{word-break:break-all}.logs .what{font-family:var(--body);font-size:13px;color:var(--ink-2);word-break:normal}
.doors code[data-copied]::after{content:"  copied";color:var(--ok);font-family:inherit}
.how{display:flex;flex-direction:column;gap:8px;align-items:flex-start;font-size:14px;line-height:1.45;min-width:0}.how > span{color:var(--ink-2)}
.snippet{margin:0;width:100%;overflow:auto;padding:12px 14px;border-radius:8px;background:var(--ink,#1D1C19);color:#F3F0E8;font:12px/1.6 'IBM Plex Mono',monospace;white-space:pre}
@media (max-width:1100px){.span6{grid-column:span 12}}
@media (max-width:820px){.login .side .three{grid-template-columns:1fr;gap:12px}.login .side{gap:28px}}
/* Phone: the side nav becomes a scrolling tab row; crumbs shrink; wide tables scroll in their own box; page heads stack. */
@media (max-width:820px){
  .c-shell{flex-direction:column}
  .c-nav{display:flex;flex-direction:row;width:auto;padding:8px 12px;gap:4px;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);scrollbar-width:none;font-size:14px}
  .c-nav a{height:34px;flex-shrink:0;white-space:nowrap}
  .c-header{gap:10px}.c-header .c-brand > span:not(.mark){display:none}
  .c-header .sep,.c-header .mono,.c-header > a:not(.c-brand){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .c-header .sep:not(:last-of-type),.c-header > .mono:not(:last-of-type){display:none}
  table.c{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;position:relative}
  .c-head,.c-head.top{flex-direction:column;align-items:flex-start;gap:14px}
  .c-head .lead h1{font-size:28px}
  .abline{flex-wrap:wrap}.abline code{word-break:break-all}
}
@media (max-width:820px){.doors .kv > div{flex-direction:column;align-items:flex-start;gap:2px}.doors .kv dd{text-align:left}}

/* The site footer (partials/site-footer) inside the console. */
.console footer.hub{flex-shrink:0;margin-top:auto;padding:22px 24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px 24px;flex-wrap:wrap;font-size:13px;line-height:1.5;color:var(--ink-2);background:var(--paper)}
.console footer.hub .links{display:flex;flex-wrap:wrap;gap:8px 20px}.console footer.hub a{color:inherit;font-weight:500}
@media (max-width:820px){.console footer.hub{padding:18px 16px}}

/* Account (design: Console · Account) */
.account{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:20px;align-items:start}
.account .body{grid-column:span 8;display:flex;flex-direction:column;gap:20px}.account aside{grid-column:9 / span 4;display:flex;flex-direction:column;gap:16px}
.account .card h2{font-size:18px}.account .card .ch span{font-size:14px;line-height:1.5}
.account .namerow{display:flex;gap:12px;align-items:flex-end}.account .namerow .field{flex-grow:1}.account .namerow .btn{height:46px}
.account dl.facts{margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding-top:18px;border-top:1px solid var(--line-2);font-size:14px}
.account dl.facts div{display:flex;flex-direction:column;gap:4px}.account dl.facts dt{font-size:13px;color:var(--ink-2)}.account dl.facts dd{margin:0;font-weight:600;word-break:break-all}
.account .way{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--line-2)}.account .way:last-child{padding-bottom:0}
.account .way .ico{width:36px;height:36px;border-radius:8px;background:var(--paper);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.account .way .txt{flex-grow:1;display:flex;flex-direction:column;gap:2px}.account .way .txt b{font-size:15px;font-weight:600}.account .way .txt span{font-size:13px;color:var(--ink-2)}
.account .rowcard{flex-direction:row;justify-content:space-between;align-items:center;gap:16px}.account .acts{display:flex;gap:10px;flex-wrap:wrap}
.account .danger{border-color:var(--bad-line)}.account .danger .btn{align-self:flex-start;background:#fff;color:var(--bad);border:1px solid var(--bad-line)}.account .danger .btn:hover{background:var(--bad);color:#fff;border-color:var(--bad)}
.account aside .card{padding:22px;gap:12px}.account aside h2{font-size:16px}
.account aside ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;font-size:13px}
.account aside li{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--line-2)}.account aside li span{color:var(--ink-2);white-space:nowrap}
.account aside .keep{background:#e8e3d7;border:0;font-size:13px;line-height:1.55;gap:10px}.account aside .keep .links{display:flex;gap:14px;font-weight:600;padding-top:4px}
@media (max-width:1100px){.account .body,.account aside{grid-column:span 12}}
@media (max-width:820px){.account dl.facts{grid-template-columns:1fr}.account .namerow,.account .rowcard{flex-direction:column;align-items:stretch}}

.note.warnnote{background:var(--warn-bg);color:#3d2a00;font-size:14px}

/* Analytics (design: Analytics boards) */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.an{display:flex;flex-direction:column;gap:20px;min-width:0}.an .card{gap:12px;padding:22px}.an .card .ch span{font-size:13px}
.an-pick{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.an-pick select{height:38px;padding:0 32px 0 12px;border:1px solid var(--input);border-radius:8px;background:#fff;font:500 13px var(--body);color:var(--ink);max-width:340px}.an-pick select.mono{font-family:var(--mono,'IBM Plex Mono',monospace)}
.an-tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto}.an-tabs a{height:42px;padding:0 14px;display:flex;align-items:center;font-size:14px;font-weight:500;text-decoration:none;color:var(--ink-2);white-space:nowrap;border-bottom:2px solid transparent}.an-tabs a[aria-current=page]{font-weight:600;color:var(--ink);border-bottom-color:#1d1c19}
.an-kpis{display:grid;gap:14px}.an-kpis.five{grid-template-columns:repeat(5,minmax(0,1fr))}.an-kpis.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.an-kpi{display:flex;flex-direction:column;gap:8px;padding:18px;border-radius:12px;background:#fff;border:1px solid var(--line)}.an-kpi .l{font-size:13px;font-weight:600;color:var(--ink-2)}
.an-kpi .val{font-size:32px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}.an-kpis.four .an-kpi .val{font-size:30px}
.an-kpi .d{font-size:13px;color:var(--ink-2)}.an-kpi .d.up,.an-kpi .d.down,.an-kpi .d.flat{font-weight:600}.an-kpi .d.up{color:var(--ok)}.an-kpi .d.down{color:var(--bad)}.an-kpi .d.flat{color:var(--ink-3)}
.an-bars{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}.an-bars th{width:170px;padding:7px 12px 7px 0;text-align:left;font-weight:400;vertical-align:middle}.an-bars.slim th{width:178px}
.an-bars td{padding:7px 0;vertical-align:middle}.an-bars td.bar{white-space:nowrap}.an-bars td.bar > span{display:inline-block;vertical-align:middle;height:22px;margin-right:8px;border-radius:0 4px 4px 0;background:var(--a)}
.an-bars.slim td.bar > span{height:14px}.an-bars td.bar > span.grey{background:#8a857a}.an-bars td.bar > span.good{background:var(--ok)}.an-bars td.bar b{font-size:13px}.an-bars td.bar small{font-size:12px;color:var(--ink-3)}
.an-bars td.lost{width:130px;text-align:right;font-size:12px;color:var(--ink-2)}.an .more{font-size:13px;font-weight:600;padding-top:4px}
.an-table{width:100%;border-collapse:collapse;font-size:14px;font-variant-numeric:tabular-nums}.an-table th{padding:8px 20px 8px 0;text-align:left;font-size:12px;font-weight:600;color:var(--ink-2);white-space:nowrap}
.an-table td{padding:10px 20px 10px 0;border-top:1px solid var(--line-2);vertical-align:middle}.an-table .r{text-align:right}.an-table th:last-child,.an-table td:last-child{padding-right:0}.an-table td.wrap{word-break:break-word}.an-table .strong{font-weight:500}.an-table code{font-size:12px}
.an .meter{display:flex;align-items:center;gap:8px}.an .meter > span{flex-grow:1;height:10px;border-radius:999px;background:var(--line-2);overflow:hidden}.an .meter i{display:block;height:10px;border-radius:999px;background:var(--a)}.an .meter i.bad{background:var(--bad)}.an .meter b{min-width:44px;text-align:right;font-size:13px;font-weight:500}
.an .door{display:flex;flex-direction:column;gap:6px}.an .door .row{display:flex;justify-content:space-between;gap:12px;font-size:14px}.an .track{height:10px;border-radius:999px;background:var(--line-2);overflow:hidden}.an .track i{display:block;height:10px;border-radius:999px;background:var(--a)}
.an .daily{display:flex;flex-direction:column;gap:6px;padding-top:14px;border-top:1px solid var(--line-2)}.an .daily h3{margin:0;font-size:14px;font-weight:600}
.an .daily .cols{display:flex;align-items:flex-end;gap:3px;height:72px}.an .daily .cols span{flex-grow:1;min-width:2px;border-radius:3px 3px 0 0;background:var(--a)}.an .daily .ends{display:flex;justify-content:space-between;font-size:11px;color:var(--ink-2)}
.an .fact{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:12px 0;border-top:1px solid var(--line-2)}.an .fact > span:first-child{display:flex;flex-direction:column;gap:2px;min-width:0}.an .fact b{font-size:14px;font-weight:600}.an .fact span span{font-size:13px;color:var(--ink-2)}.an .fact .n{font-size:18px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}.an .fact code{font-size:12px}
.an .warnline{border-color:var(--bad-line)}.an .scroll{overflow-x:auto}.an-extras{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.an-extras h2{font-size:16px}
.an-foot{margin:0;font-size:12px;line-height:1.55;color:var(--ink-2);max-width:900px}.span4{grid-column:span 4}.span8{grid-column:span 8}
@media (max-width:1100px){.an-kpis.five,.an-kpis.four{grid-template-columns:repeat(2,minmax(0,1fr))}.an .span4,.an .span8,.an .span6{grid-column:span 12}.an-extras{grid-template-columns:1fr}}
@media (max-width:640px){.an-kpis.five,.an-kpis.four{grid-template-columns:1fr}.an-bars th,.an-bars.slim th{width:120px}.an-bars td.lost{display:none}}
