:root{
  --console-ink:#0a2540;
  --console-muted:#66758c;
  --console-line:#dce4ee;
  --console-soft:#f7f9fc;
  --console-surface:#fff;
  --console-accent:#635bff;
  --console-radius:12px;
  --console-shadow:0 8px 26px rgba(10,37,64,.06);
}

body.authenticated-layout{
  min-height:100vh;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  background:var(--console-soft);
  color:var(--console-ink);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:14px;
  line-height:1.55;
}

/* Keep the shared footer at the viewport bottom on short pages while
   allowing it to follow the content naturally on longer pages. */
body.authenticated-layout > main{flex:1 0 auto;width:100%}
body.authenticated-layout > .auth-footer{flex:0 0 auto}

body.authenticated-layout :where(button,input,select,textarea){font:inherit}
body.authenticated-layout :where(h1,h2,h3,p){text-wrap:pretty}
body.authenticated-layout :where(h1){font-size:clamp(30px,3.2vw,40px);line-height:1.08;letter-spacing:-.035em}
body.authenticated-layout :where(h2){font-size:22px;line-height:1.25;letter-spacing:-.02em}
body.authenticated-layout :where(h3){font-size:16px;line-height:1.35}
body.authenticated-layout :where(.eyebrow){margin-bottom:8px;font-size:11px;letter-spacing:.11em}
body.authenticated-layout :where(.intro,.subtitle,.page-heading p:not(.eyebrow)){font-size:15px;line-height:1.6;color:var(--console-muted)}

body.authenticated-layout :where(.portal,.transactions-shell,.docs-shell){max-width:1280px;margin-left:auto;margin-right:auto}
body.authenticated-layout :where(.portal,.transactions-shell){padding:30px 30px 52px}
body.authenticated-layout .shell{max-width:1280px;margin-left:auto;margin-right:auto;padding-left:30px;padding-right:30px}

body.authenticated-layout :where(.card,.transaction-card,.wallet,.statusbox,.mcp-endpoint,.access-strip,.test-workflow,.checkout){
  border-color:var(--console-line);
  border-radius:var(--console-radius);
  box-shadow:none;
}
body.authenticated-layout :where(.card,.transaction-card,.wallet,.mcp-endpoint,.access-strip,.test-workflow){background:var(--console-surface)}
body.authenticated-layout :where(.card){padding:24px}

body.authenticated-layout :where(.btn,.button,.primary,.secondary,.refresh-button,.copy-button,.create-button){
  min-height:40px;
  border-radius:8px;
  font-size:13px;
  font-weight:750;
}
body.authenticated-layout :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  min-height:40px;
  border-radius:8px;
  border-color:#cbd5e1;
}

body.authenticated-layout :where(.row,.key-row,.detail-row){padding-top:12px;padding-bottom:12px}
body.authenticated-layout :where(.steps){margin-top:22px;padding-top:20px}
body.authenticated-layout :where(.step){padding-top:8px;padding-bottom:8px}
body.authenticated-layout :where(pre){border-radius:9px;font-size:12px;line-height:1.55}

body.authenticated-layout .auth-footer{
  width:100%;
  margin:28px 0 0;
  padding:20px 30px 24px;
  box-sizing:border-box;
  border-top:1px solid var(--console-line);
}

/* Documentation uses the full centered content column because its table of
   contents now lives in the shared application sidebar. */
body.authenticated-layout .documentation-page{max-width:none;padding-top:20px}
body.authenticated-layout .docs-shell{width:100%;max-width:1120px;margin-top:0}
body.authenticated-layout .docs-grid{max-width:1040px;margin:26px auto 0;gap:0}
body.authenticated-layout .docs-grid-single .docs{width:100%;max-width:1040px;margin:0 auto}
body.authenticated-layout .docs section{padding-top:24px;padding-bottom:24px}
body.authenticated-layout .docs-hero{max-width:900px;margin-left:auto;margin-right:auto;padding:6px 0 4px}

/* Transaction tables remain dense enough to scan without excessive vertical scrolling. */
body.authenticated-layout .toolbar{padding:14px;gap:10px}
body.authenticated-layout .toolbar input,
body.authenticated-layout .toolbar select{height:40px}
body.authenticated-layout th{padding:11px 14px}
body.authenticated-layout td{padding:13px 14px}

/* Checkout and authorization retain their two-column task layout with calmer sizing. */
body.authenticated-layout .checkout{box-shadow:var(--console-shadow)}
body.authenticated-layout .checkout .summary{padding:32px}
body.authenticated-layout .checkout:not(.connected) .payment{width:0;padding:0}
body.authenticated-layout .checkout.connected .payment{padding:32px}
body.authenticated-layout .checkout .payment:has(#authorize){width:auto;padding:32px}
body.authenticated-layout .checkout .amount{font-size:38px}

@media(max-width:920px){
  body.authenticated-layout :where(.portal,.transactions-shell){padding:24px 18px 42px}
  body.authenticated-layout .shell{padding-left:18px;padding-right:18px}
  body.authenticated-layout .auth-footer{padding-left:18px;padding-right:18px}
}

@media(max-width:640px){
  body.authenticated-layout{font-size:13px}
  body.authenticated-layout :where(h1){font-size:30px}
  body.authenticated-layout :where(h2){font-size:20px}
  body.authenticated-layout :where(.intro,.subtitle,.page-heading p:not(.eyebrow)){font-size:14px}
  body.authenticated-layout :where(.card){padding:20px}
  body.authenticated-layout .checkout .summary,
  body.authenticated-layout .checkout.connected .payment{padding:22px}
  body.authenticated-layout .checkout .payment:has(#authorize){padding:22px}
}