/* The single source of type, color, and material values for Studio, including portals. */
:root {
  --studio-bg: #181818;
  --studio-panel: #1c1c1c;
  --studio-chrome: #202020;
  --studio-sidebar: #252525b8;
  --studio-composer: #282828dc;
  --studio-raised: #ffffff08;
  --studio-hover: #ffffff0d;
  --studio-selected: #ffffff12;
  --studio-choice-fill: #82b6f01a;
  --studio-choice-hover: #82b6f02b;
  --studio-selection: #38669e;
  --studio-selection-text: #ffffff;
  --studio-border: #ffffff0b;
  --studio-edge: #ffffff13;
  --studio-text: #ededed;
  --studio-muted: #ababab;
  --studio-faint: #939393;
  --studio-accent: #92b8e8;
  --studio-action-blue: #81b8f4;
  --studio-on-action-blue: #102a46;
  --studio-avatar: #167465;
  --studio-avatar-ink: #ffffff;
  --studio-positive: #82b997;
  --studio-negative: #d58b92;
  --studio-warning: #c7ae76;
  --studio-permission: #ef8f69;
  --studio-purple: #bea6dd;
  --studio-positive-fill: #48996a1a;
  --studio-negative-fill: #bd536223;
  --studio-purple-fill: #a573cd1a;
  --studio-menu: #282828eb;
  --studio-shadow: 0 12px 36px #0005, 0 2px 5px #0003, inset 0 1px #ffffff0c;
  --studio-glass: blur(32px) saturate(125%);
  --studio-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --studio-radius-small: 4px;
  --studio-radius-control: 8px;
  --studio-radius-item: 6px;
  --studio-radius-pane: 12px;
  --studio-radius-menu: 12px;
  --studio-radius-dialog: 16px;
  --studio-radius-composer: 20px;
  --studio-radius-pill: 999px;
  --studio-control-size: 28px;
  --studio-control-height: 30px;
  --studio-menu-row-height: 30px;
  --studio-motion-dock: 240ms;
  --studio-motion-quick: 140ms;
  --studio-space-1: 4px;
  --studio-space-2: 8px;
  --studio-space-3: 12px;
  --studio-space-4: 16px;
  --studio-space-5: 24px;
  --studio-space-6: 32px;
  --studio-reading-width: 720px;
  --studio-material-opacity: 0.24;
  --studio-toolbar-height: 40px;
  --studio-pane-shadow: 0 1px 3px #0002, 0 0 0 1px #ffffff05;
  --studio-composer-shadow: 0 4px 16px #00000018, 0 1px 3px #00000014, inset 0 1px #ffffff0a;
  --studio-control-inset: inset 0 1px #ffffff05;
  --studio-font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --studio-font-mono: "SFMono-Regular", "SF Mono", Menlo, Monaco, Consolas, monospace;
  --studio-type-micro: 11px;
  --studio-type-avatar: 10px;
  --studio-type-caption: 12px;
  --studio-type-control: 13px;
  --studio-type-body: 14px;
  --studio-type-subtitle: 15px;
  --studio-type-title: 18px;
  --studio-type-display: 22px;
  --studio-type-glyph: 20px;
  --studio-leading-ui: 1.4;
  --studio-leading-body: 1.55;
  --studio-weight-regular: 400;
  --studio-weight-medium: 500;
  --studio-toggle: #48996a;
  --studio-scrim: #0004;
  --studio-scrim-strong: #0005;
  /* Connector identities are independent of the workspace color scheme. */
  --studio-brand-ink: #fff;
  --studio-brand-neutral: #171717;
  --studio-brand-linear: #5e5dcf;
  --studio-brand-slack: #611f69;
  --studio-brand-postgres: #4169e1;
  --studio-brand-atlassian: #1868db;
  --studio-brand-sentry: #362d59;
  --studio-brand-playwright: #2e8b57;
  --studio-brand-notion: #151515;
  --studio-brand-drive: #2684fc;
  --studio-brand-databricks: #ff3621;
  --studio-brand-snowflake: #29b5e8;
  --studio-brand-bigquery: #4285f4;
  --studio-brand-stripe: #635bff;
}
@media (prefers-color-scheme: light) { :root { 
  --studio-bg: #fbfbfb;
  --studio-material-opacity: 0.12;
  --studio-panel: #fff;
  --studio-chrome: #e9e9e9;
  --studio-composer: #f2f2f2e6;
  --studio-sidebar: #edededb8;
  --studio-raised: #00000004;
  --studio-hover: #00000006;
  --studio-selected: #0000000b;
  --studio-choice-fill: #2b72c912;
  --studio-choice-hover: #2b72c922;
  --studio-selection: #c8defb;
  --studio-selection-text: #152a43;
  --studio-border: #0000000c;
  --studio-edge: #00000018;
  --studio-text: #292929;
  --studio-muted: #666;
  --studio-faint: #696969;
  --studio-accent: #3265a8;
  --studio-action-blue: #1764c0;
  --studio-on-action-blue: #ffffff;
  --studio-positive: #317847;
  --studio-negative: #a33e47;
  --studio-warning: #806323;
  --studio-permission: #b65524;
  --studio-purple: #79529a;
  --studio-positive-fill: #48996a12;
  --studio-negative-fill: #bd536214;
  --studio-purple-fill: #a573cd12;
  --studio-menu: #f7f7f7e8;
  --studio-shadow: 0 12px 36px #0002, 0 2px 5px #0001, inset 0 1px #fff9;
  --studio-pane-shadow: 0 1px 3px #0000000c, 0 0 0 1px #00000006;
  --studio-composer-shadow: 0 3px 12px #00000008, inset 0 1px #fff9;
  --studio-control-inset: inset 0 1px #ffffff80;
 } }

:root[data-translucent="false"] {
  --studio-sidebar: #242424;
  --studio-menu: #292929;
  --studio-composer: #282828;
  --studio-glass: none;
  --studio-material-opacity: 0;
}
:root[data-color-scheme="light"][data-translucent="false"] {
  --studio-sidebar: #efefef;
  --studio-menu: #f8f8f8;
  --studio-composer: #f2f2f2;
}

@media (prefers-reduced-transparency: reduce) {
  :root {
    --studio-sidebar: #242424;
    --studio-menu: #292929;
    --studio-composer: #282828;
    --studio-glass: none;
    --studio-material-opacity: 0;
  }
  @media (prefers-color-scheme: light) { :root { 
    --studio-sidebar: #efefef;
    --studio-menu: #f8f8f8;
    --studio-composer: #f2f2f2;
   } }
}

@media (prefers-contrast: more) {
  :root {
    --studio-border: #ffffff4d;
    --studio-edge: #ffffff70;
    --studio-muted: #d1d1d1;
    --studio-faint: #bdbdbd;
    --studio-sidebar: #242424;
    --studio-menu: #292929;
    --studio-composer: #282828;
    --studio-glass: none;
    --studio-material-opacity: 0;
  }
  @media (prefers-color-scheme: light) { :root { 
    --studio-border: #0000004d;
    --studio-edge: #00000070;
    --studio-muted: #444;
    --studio-faint: #555;
    --studio-sidebar: #efefef;
    --studio-menu: #f8f8f8;
    --studio-composer: #f2f2f2;
   } }
}

html body {
  --color-bg: var(--studio-bg);
  --color-bg-panel: var(--studio-panel);
  --color-bg-elevated: var(--studio-raised);
  --color-bg-subtle: var(--studio-raised);
  --color-surface-solid: var(--studio-panel);
  --color-text: var(--studio-text);
  --color-text-muted: var(--studio-muted);
  --color-text-faint: var(--studio-faint);
  --color-border: var(--studio-border);
  --color-border-strong: var(--studio-edge);
  --color-focus: var(--studio-accent);
  --color-accent: var(--studio-accent);
  --color-success: var(--studio-positive);
  --color-error: var(--studio-negative);
  --color-warning: var(--studio-warning);
  --font-family-sans: var(--studio-font);
  --font-sans: var(--studio-font);
  --font-size-2x-small: var(--studio-type-avatar);
  --font-size-x-small: var(--studio-type-micro);
  --font-size-small: var(--studio-type-caption);
  --font-size-control: var(--studio-type-control);
  --font-size-base: var(--studio-type-body);
  --text-base: var(--studio-text);
  --text-strong: var(--studio-text);
  --text-weak: var(--studio-muted);
  --text-weaker: var(--studio-faint);
  --text-interactive-base: var(--studio-accent);
  --text-on-success-base: var(--studio-positive);
  --text-on-critical-base: var(--studio-negative);
  --text-critical-base: var(--studio-negative);
  --text-on-warning-base: var(--studio-warning);
  --icon-base: var(--studio-muted);
  --icon-weak-base: var(--studio-faint);
  --icon-strong-base: var(--studio-text);
  --background-base: var(--studio-bg);
  --background-stronger: var(--studio-panel);
  --surface-base: var(--studio-panel);
  --surface-inset-base: var(--studio-bg);
  --surface-raised-base: var(--studio-raised);
  --surface-raised-strong: var(--studio-raised);
  --surface-raised-stronger: var(--studio-raised);
  --surface-raised-stronger-non-alpha: var(--studio-panel);
  --surface-base-hover: var(--studio-hover);
  --surface-raised-base-hover: var(--studio-hover);
  --surface-raised-strong-hover: var(--studio-hover);
  --surface-raised-base-active: var(--studio-selected);
  --surface-raised-stronger-hover: var(--studio-hover);
  --surface-critical-weak: var(--studio-negative-fill);
  --input-base: var(--studio-raised);
  --border-base: var(--studio-border);
  --border-weak-base: var(--studio-border);
  --border-weaker-base: var(--studio-border);
  --border-subtle: var(--studio-border);
  --font-family-mono: var(--studio-font-mono);
  --font-weight-medium: var(--studio-weight-medium);
  --font-weight-regular: var(--studio-weight-regular);
  --font-weight-emphasis: var(--studio-weight-medium);
  --surface-float-base: var(--studio-menu);
  --border-focus: var(--studio-accent);
  --border-selected: var(--studio-accent);
  --border-strong-base: var(--studio-edge);

  background: var(--studio-bg);
  color: var(--studio-text);
  font-family: var(--studio-font);
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
}

html body ::selection {
  background-color: var(--studio-selection);
  color: var(--studio-selection-text);
  text-shadow: none;
}

:root {
  color-scheme: dark;
  --bg: var(--studio-bg); --panel: var(--studio-panel); --raised: var(--studio-hover);
  --line: var(--studio-edge); --text: var(--studio-text); --muted: var(--studio-muted); --accent: var(--studio-accent);
  font-family: var(--studio-font); font-size: var(--studio-type-body); line-height: var(--studio-leading-body);
}
@media (prefers-color-scheme: light) { :root { color-scheme: light; } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); }
::selection { background: var(--studio-selection); color: var(--studio-selection-text); }
a { color: var(--accent); text-underline-offset: 3px; }
button, input, select { font: inherit; }
button, .button {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--studio-space-2);
  min-height: 34px; padding: 6px 12px; border: 1px solid transparent; border-radius: var(--studio-radius-control);
  background: var(--studio-action-blue); color: var(--studio-on-action-blue); font-weight: var(--studio-weight-medium);
  font-size: var(--studio-type-control); text-decoration: none; cursor: pointer;
}
button:hover, .button:hover { filter: brightness(1.06); }
button:disabled { opacity: .5; cursor: not-allowed; }
.secondary { background: var(--studio-raised); color: var(--text); border-color: var(--line); }
.secondary:hover { background: var(--studio-hover); filter: none; }
input, select {
  min-width: 0; width: 100%; min-height: 36px; padding: 7px 10px; border: 1px solid var(--line);
  border-radius: var(--studio-radius-control); background: var(--bg); color: var(--text);
}
input[type=checkbox] { width: 18px; min-height: 18px; height: 18px; accent-color: var(--studio-action-blue); }
input:focus-visible, button:focus-visible, a:focus-visible, select:focus-visible, summary:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 3px;
}
label { display: grid; gap: var(--studio-space-2); color: var(--text); font-size: var(--studio-type-control); }
label.check { display: flex; align-items: flex-start; gap: var(--studio-space-2); }
p { line-height: var(--studio-leading-body); }
.muted { color: var(--muted); }
.mono { font-family: var(--studio-font-mono); }
.eyebrow, .subtle, .field-help { color: var(--muted); font-size: var(--studio-type-caption); }
.eyebrow { margin-bottom: var(--studio-space-2); }
h1 { font-size: var(--studio-type-display); line-height: var(--studio-leading-ui); font-weight: 500; letter-spacing: -.02em; margin: 0 0 8px; }
h2 { font-size: var(--studio-type-subtitle); font-weight: 500; margin: 0 0 12px; }
h3 { font-size: var(--studio-type-control); font-weight: 500; margin: 0 0 4px; }
.wordmark { font-size: var(--studio-type-title); font-weight: 550; color: var(--text); text-decoration: none; }
.badge { display: inline-flex; align-items: center; padding: 3px 7px; border: 1px solid var(--line); border-radius: var(--studio-radius-item); font-size: var(--studio-type-caption); color: var(--muted); }
.gate { min-height: 100dvh; display: grid; grid-template-rows: auto 1fr auto; padding: 28px 32px; }
.gate-header { display: flex; align-items: center; gap: var(--studio-space-4); }
.gate-main { width: min(100%,430px); margin: auto; padding: 48px 0; }
.gate-main form { display: grid; gap: var(--studio-space-4); margin-top: 24px; }
.gate-footer { display: flex; justify-content: space-between; gap: 20px; font-size: var(--studio-type-caption); color: var(--muted); }
.oauth { display: grid; gap: var(--studio-space-3); margin: 24px 0; }
.oauth .button { width: 100%; min-height: 40px; }
.notice { padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--studio-radius-control); font-size: var(--studio-type-control); background: var(--panel); margin: 20px 0; }
.error, .field-error { color: var(--studio-negative); }
.error { border-color: var(--studio-negative); }
.field-error { font-size: var(--studio-type-control); margin: 0; }
.success { color: var(--studio-positive); }
.shell { display: grid; grid-template-columns: 224px minmax(0,1fr); min-height: 100dvh; }
.sidebar { padding: 24px 12px; display: flex; flex-direction: column; border-right: 1px solid var(--line); background: var(--studio-sidebar); backdrop-filter: var(--studio-glass); position: sticky; top: 0; height: 100dvh; }
.sidebar .wordmark { padding: 0 12px; }
.sidebar nav { display: grid; gap: 4px; margin-top: 28px; }
.sidebar nav a { padding: 7px 12px; min-height: 34px; border-radius: var(--studio-radius-control); text-decoration: none; color: var(--muted); font-size: var(--studio-type-control); }
.sidebar nav a[aria-current=page] { background: var(--studio-selected); color: var(--text); }
.sidebar nav a:hover { background: var(--studio-hover); }
.sidebar-bottom { margin-top: auto; padding: 24px 12px 0; display: grid; gap: 12px; font-size: var(--studio-type-caption); }
.sidebar-bottom .email { overflow-wrap: anywhere; }
.sidebar-bottom button { padding: 4px 0; background: none; color: var(--muted); justify-content: flex-start; font-weight: 400; }
.main { width: min(100%, 1040px); padding: 40px clamp(24px, 4vw, 64px) 64px; }
.page-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; margin-bottom: 28px; }
.page-header p { margin: 0; max-width: 560px; font-size: var(--studio-type-control); }
.cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.card, .wallet-balance { min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: var(--studio-radius-pane); background: var(--panel); }
.card p:last-child { margin-bottom: 0; }
.amount, .wallet-total { font-size: var(--studio-type-display); font-weight: 500; font-variant-numeric: tabular-nums; margin: 16px 0 8px; }
.small-amount { font-size: var(--studio-type-title); }
.wallet-total { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.wallet-total span { color: var(--muted); font-size: var(--studio-type-control); font-weight: 400; }
.wallet-balance > .muted { font-size: var(--studio-type-control); margin: 0 0 12px; }
.wallet-balance .section-heading { margin-bottom: 8px; }
.wallet-totals { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin: 16px 0; }
.wallet-totals dt { color: var(--muted); font-size: var(--studio-type-caption); }
.wallet-totals dd { margin: 4px 0 0; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.meter { display: block; width: 100%; height: 6px; border: 0; border-radius: var(--studio-radius-pill); margin: 18px 0; background: var(--studio-selected); accent-color: var(--accent); }
meter::-webkit-meter-bar { background: var(--studio-selected); border: 0; }
meter::-webkit-meter-optimum-value { background: var(--accent); }
meter::-moz-meter-bar { background: var(--accent); }
.section { margin-top: 28px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.section-heading h2 { margin: 0; }
.settings-section { margin-top: 28px; }
.settings-row { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.settings-row > div { min-width: 0; }
.numeric { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.budget-form { display: grid; gap: 10px; margin-top: 20px; max-width: 560px; }
.budget-control { display: flex; align-items: center; gap: 10px; }
.budget-control input { max-width: 190px; font-variant-numeric: tabular-nums; }
.budget-control button { flex: none; }
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--studio-radius-control); }
table { width: 100%; border-collapse: collapse; font-size: var(--studio-type-control); text-align: left; }
th { background: var(--studio-raised); color: var(--muted); font-weight: 400; }
td, th { padding: 12px 14px; border-bottom: 1px solid var(--line); }
tr:last-child td { border-bottom: 0; }
.empty { padding: 24px; border: 1px solid var(--line); border-radius: var(--studio-radius-control); }
.empty p { max-width: 470px; margin: 8px 0 0; }
.empty-note { color: var(--muted); font-size: var(--studio-type-control); padding: 16px 0; }
.form { display: grid; gap: 16px; max-width: 620px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.inline { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.rule { border: 0; border-top: 1px solid var(--line); margin: 24px 0; }
.field-help { margin: 0; line-height: var(--studio-leading-body); }
.details { margin-top: 12px; }
.details summary { cursor: pointer; color: var(--text); }
.details .form { margin-top: 20px; }
.skip { position: absolute; left: -10000px; }
.skip:focus { left: 16px; top: 12px; background: var(--panel); color: var(--text); padding: 12px; z-index: 10; }
.operations { display: grid; gap: 16px; }
.operations .card { min-width: 0; }
.operations p, .operations dd { overflow-wrap: anywhere; }
.operations dl { margin: 18px 0 0; }
.operations dt { font-size: var(--studio-type-caption); color: var(--muted); margin-top: 12px; }
.operations dd { margin: 5px 0 0; font-size: var(--studio-type-control); }
@media (max-width: 850px) {
  .shell { grid-template-columns: 1fr; } .sidebar { position: static; height: auto; padding: 20px; border-right: 0; border-bottom: 1px solid var(--line); }
  .sidebar nav { display: flex; flex-wrap: wrap; margin-top: 16px; gap: 4px; } .sidebar-bottom { display: flex; flex-wrap: wrap; align-items: center; padding: 12px 12px 0; }
  .main { padding: 28px 24px; } .cards { grid-template-columns: 1fr; } .page-header { flex-direction: column; }
  .gate { padding: 24px; } .gate-footer { flex-direction: column; gap: 8px; } .form-grid { grid-template-columns: 1fr; }
}
@media (pointer: coarse) { button, .button, input, select, .sidebar nav a { min-height: 44px; } }

.login-page { min-height: 100dvh; display: grid; grid-template-rows: auto 1fr auto; padding: 28px 32px; }
.login-main { width: min(100%,320px); margin: auto; padding: 64px 0; text-align: center; }
.login-mark { margin-bottom: 24px; }
.login-main h1 { margin-bottom: 8px; }
.login-main > p { margin: 0; }
.login-main .notice { margin-top: 24px; text-align: left; }
.login-main .oauth { gap: 12px; margin: 28px 0 20px; }
.login-main .button { height: 44px; gap: 12px; font-size: var(--studio-type-body); font-weight: 400; }
.login-footer { display: flex; justify-content: center; gap: 20px; color: var(--muted); font-size: var(--studio-type-caption); }
.login-footer a { color: var(--muted); }
.account-details { display: grid; gap: 20px; margin: 28px 0; }
.account-details dt { font-size: var(--studio-type-caption); color: var(--muted); }
.account-details dd { margin: 4px 0 0; overflow-wrap: anywhere; }

:root { --research-title: clamp(1.85rem,2.8vw,2.65rem); --research-space: clamp(24px,5vw,64px); }
textarea { font: inherit; color: var(--text); background: var(--panel); border: 1px solid var(--line); border-radius: var(--studio-radius-control); width: 100%; min-width: 0; padding: 14px 16px; line-height: 1.65; resize: vertical; }
textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
textarea::placeholder, input::placeholder { color: var(--muted); opacity: .8; }
.quiet, .quiet:hover { background: transparent; color: var(--muted); border-color: transparent; filter: none; }
.quiet-link, .back-link { color: var(--muted); text-decoration: none; font-size: var(--studio-type-control); }
.quiet-link:hover, .back-link:hover { color: var(--text); }
.research-kicker { display: block; font-size: var(--studio-type-caption); color: var(--muted); margin-bottom: 12px; }
.research-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin: 14px 0 40px; }
.research-heading h1 { font-size: var(--research-title); font-weight: 500; letter-spacing: -.04em; line-height: 1.13; overflow-wrap: anywhere; }
.research-heading p { margin: 12px 0 0; }
.research-heading > .button { flex: none; min-height: 40px; border-radius: var(--studio-radius-menu); }
.research-setup { min-height: 100dvh; display: grid; grid-template-columns: 1fr 1fr; padding: 16px; gap: 16px; }
.setup-content { display: grid; grid-template-rows: auto 1fr auto; min-width: 0; padding: 20px clamp(24px,4vw,64px); }
.setup-form { width: min(100%,400px); margin: auto; padding: 64px 0; }
.setup-form h1 { font-size: clamp(2rem,3.5vw,3.15rem); line-height: 1.1; letter-spacing: -.045em; margin-bottom: 18px; }
.setup-form > .muted { font-size: 1.07rem; max-width: 350px; }
.setup-form form { display: grid; gap: 18px; margin-top: 40px; }
.setup-form input { min-height: 48px; border-radius: var(--studio-radius-menu); padding: 12px 14px; background: var(--panel); }
.setup-form button { min-height: 46px; border-radius: var(--studio-radius-menu); justify-content: space-between; padding-inline: 16px; }
.setup-form .field-help { text-align: center; }
.setup-account { display: flex; gap: 10px; align-items: center; color: var(--muted); font-size: var(--studio-type-caption); flex-wrap: wrap; }
.setup-account > span:not(.profile-initial) { overflow-wrap: anywhere; min-width: 0; }
.setup-account form { margin-left: auto; }
.profile-initial { display: grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 50%; color: var(--text); background: var(--studio-selected); }
.setup-landscape { position: relative; overflow: hidden; border-radius: 24px; min-height: 520px; background: var(--panel); }
.setup-landscape img { display: block; width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.setup-landscape > span { position: absolute; bottom: 32px; inset-inline: 32px; text-align: center; color: white; font-size: var(--studio-type-body); text-shadow: 0 1px 8px #000; }
.research-tools { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 16px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.research-tools form { display: flex; align-items: center; gap: 8px; max-width: 430px; flex: 1; }
.research-tools input { background: transparent; border-color: transparent; padding-inline: 10px; }
.research-tools input:focus-visible { border-color: var(--line); }
.project-list { display: grid; }
.project-row { display: flex; gap: 18px; align-items: center; padding: 24px 12px; margin-inline: -12px; border-bottom: 1px solid var(--line); color: var(--text); text-decoration: none; border-radius: var(--studio-radius-control); }
.project-row:hover { background: var(--studio-hover); }
.project-glyph { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: var(--studio-radius-menu); border: 1px solid var(--line); color: var(--muted); font-size: 20px; }
.project-row > div { flex: 1; min-width: 0; }
.project-row h2 { font-size: 1.05rem; line-height: 1.4; margin: 0 0 5px; overflow-wrap: anywhere; }
.project-row p { color: var(--muted); margin: 0; font-size: var(--studio-type-control); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; }
.project-row time { flex: none; font-size: var(--studio-type-caption); color: var(--muted); }
.row-arrow { color: var(--muted); }
.research-empty { display: grid; justify-items: center; text-align: center; padding: clamp(48px,9vh,96px) 24px; }
.research-orbit { width: 40px; height: 40px; color: var(--muted); margin-bottom: 28px; }
.research-empty h2 { font-size: 1.7rem; letter-spacing: -.025em; margin: 0; }
.research-empty > p { max-width: 350px; margin: 14px 0 28px; }
.research-empty .button { min-height: 42px; padding-inline: 18px; border-radius: var(--studio-radius-menu); }
.research-footnote { display: flex; justify-content: space-between; gap: 20px; padding-top: 24px; border-top: 1px solid var(--line); color: var(--muted); font-size: var(--studio-type-caption); }
.research-footnote a { color: var(--muted); text-decoration: none; }
.research-form { display: grid; gap: 26px; max-width: 760px; }
.research-field { display: grid; gap: 12px; }
.team-invitation { flex-wrap: wrap; align-items: flex-start; }
.team-invitation > div { min-width: min(100%,240px); }
.research-form label { position: relative; font-weight: var(--studio-weight-medium); gap: 12px; }
.research-form :is(input,select) { background: var(--panel); padding: 12px 14px; min-height: 46px; font-weight: 400; font-size: var(--studio-type-control); }
.research-form textarea { font-weight: 400; }
.research-form .optional { position: absolute; top: 0; right: 0; color: var(--muted); font-weight: 400; font-size: var(--studio-type-caption); }
.form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 24px; padding-top: 6px; }
.form-actions button, .editor-save button { min-height: 40px; padding-inline: 18px; border-radius: var(--studio-radius-menu); }
.project-topline { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 32px; }
.back-link { display: inline-flex; padding-block: 8px; }
.project-editor { max-width: none; }
.editor-save { display: flex; justify-content: space-between; align-items: center; gap: 20px; border-top: 1px solid var(--line); padding-block: 20px; }
.project-archive { margin-top: 48px; font-size: var(--studio-type-control); color: var(--muted); }
.project-archive summary { cursor: pointer; width: fit-content; }
.project-archive p { margin: 16px 0; }
.saved-prose { white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--studio-type-body); }
.archived-project h2 { margin-top: 32px; }
.project-pagination { display: flex; align-items: center; justify-content: space-between; padding-top: 24px; }
@media (min-width: 851px) { .main { width: min(100%,1120px); padding-top: 48px; margin-inline: auto; } }
@media (max-width: 850px) {
  .research-setup { grid-template-columns: 1fr; padding: 0; }.setup-content { min-height: 100dvh; padding: 28px 24px; }.setup-landscape { display: none; }
  .research-heading { align-items: flex-start; flex-wrap: wrap; }.research-tools { gap: 12px; }.project-row { gap: 12px; }.project-row time { display: none; }
  .research-footnote { flex-wrap: wrap; }.setup-account { font-size: var(--studio-type-caption); }
}
@media (prefers-reduced-transparency: reduce) { .sidebar { background: var(--panel); backdrop-filter: none; } }

.project-navigation { display: flex; gap: 28px; margin: -8px 0 32px; border-bottom: 1px solid var(--line); }
.project-navigation a { color: var(--muted); text-decoration: none; padding: 12px 0; border-bottom: 2px solid transparent; font-size: var(--studio-type-control); }
.project-navigation a[aria-current] { color: var(--text); border-color: var(--accent); }
.source-upload { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 12px 24px; padding-bottom: 28px; }
.source-upload label { min-width: 0; gap: 12px; }
.source-upload input { padding: 10px; min-height: 44px; font-size: var(--studio-type-control); background: var(--panel); }
.source-upload input::file-selector-button { color: var(--text); background: var(--studio-selected); border: 0; border-radius: var(--studio-radius-control); padding: 7px 10px; margin: -3px 12px -3px 0; cursor: pointer; font: inherit; }
.source-upload button { min-height: 44px; border-radius: var(--studio-radius-menu); }
.source-upload > p { grid-column: 1 / -1; margin: 0; }
.source-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.source-row { display: flex; align-items: center; gap: 16px; border-bottom: 1px solid var(--line); }
.source-download { display: flex; align-items: center; gap: 16px; min-width: 0; flex: 1; padding: 22px 0; text-decoration: none; color: var(--text); }
.source-download:hover strong { text-decoration: underline; text-underline-offset: 3px; }
.source-icon { width: 28px; height: 28px; flex: none; color: var(--muted); }
.source-description { display: grid; gap: 6px; flex: 1; min-width: 0; }
.source-description strong { font-size: var(--studio-type-body); font-weight: var(--studio-weight-medium); overflow-wrap: anywhere; }
.source-description > span, .source-download-label { font-size: var(--studio-type-caption); color: var(--muted); }
.source-download-label { flex: none; }
.source-actions { position: relative; flex: none; }
.source-actions summary { display: grid; place-items: center; cursor: pointer; width: 32px; height: 32px; color: var(--muted); border-radius: var(--studio-radius-control); list-style: none; }
.source-actions summary::-webkit-details-marker { display: none; }
.source-actions summary:hover, .source-actions[open] summary { background: var(--studio-hover); }
.source-actions form { position: absolute; right: 0; top: 38px; width: 240px; padding: 16px; z-index: 2; background: var(--panel); border: 1px solid var(--line); border-radius: var(--studio-radius-menu); box-shadow: 0 8px 24px #0002; }
.source-actions p { font-size: var(--studio-type-control); margin: 0 0 14px; }
.source-actions button { width: 100%; }
.source-empty { padding: 48px 0; border-block: 1px solid var(--line); }
.source-empty h2 { font-size: var(--studio-type-title); font-weight: var(--studio-weight-medium); margin: 0 0 12px; }
.source-empty p { max-width: 430px; margin: 0; }
.source-footnote { margin-top: 24px; }
@media (max-width: 600px) { .source-upload { grid-template-columns: 1fr; gap: 16px; }.source-upload > p { grid-row: 2; }.source-upload button { justify-self: start; }.source-download-label { display: none; } }

.research-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:40px; }
.research-actions > a { display:flex; align-items:center; gap:16px; padding:24px; border:1px solid var(--line); border-radius:var(--studio-radius-pane); text-decoration:none; background:var(--panel); color:var(--text); transition:background var(--studio-duration-fast,140ms) ease; }
.research-actions > a:hover { background:var(--raised); }
.research-actions > a > div { flex:1; min-width:0; }
.research-actions h2 { font-size:var(--studio-type-body); font-weight:500; margin:0 0 7px; }
.research-actions p { font-size:var(--studio-type-control); color:var(--muted); margin:0; }
.action-mark { font-size:22px; color:var(--muted); }
.member-usage { display:grid; gap:5px; min-width:140px; }
.member-usage meter { width:140px; max-width:100%; height:7px; accent-color:var(--accent); }
.member-usage > a { color:var(--accent); margin-top:5px; width:fit-content; }
.member-budget-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; border-block:1px solid var(--line); padding:24px 0; max-width:680px; }
.member-budget-summary > div { display:grid; gap:8px; }
.member-budget-summary strong { font-size:24px; font-weight:500; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.member-budget-form { margin-top:32px; max-width:680px; }
.budget-choices { margin:0; padding:0; border:0; display:grid; gap:16px; }
.budget-choices legend { font-size:var(--studio-type-body); font-weight:500; margin-bottom:20px; }
@media(max-width:760px) { .research-actions { grid-template-columns:1fr; } .member-budget-summary { gap:12px; } .member-budget-summary strong { font-size:20px; } }
@media(prefers-reduced-motion:reduce) { .research-actions > a { transition:none; } }
.research-library-empty { min-height:180px; padding:32px 24px; }
.research-library-empty h2 { font-size:var(--studio-type-body); }
.research-library-empty .research-orbit { display:none; }


:root {
  color-scheme:dark;
  --bg:#0b0b0b; --panel:#121212; --raised:#1c1c1c; --line:#2c2c2c;
  --text:#f2f2f2; --muted:#a8a8a8; --accent:#dedede; --canvas:#080808;
  --action:#f2f2f2; --on-action:#151515; --soft:#222;
  --blue:#acbff5; --blue-soft:#272f43; --lilac:#c9b8ec; --lilac-soft:#342c42;
  --amber:#e3c08b; --amber-soft:#372f24;
  --studio-bg:var(--bg); --studio-panel:var(--panel); --studio-raised:var(--panel);
  --studio-hover:var(--raised); --studio-selected:var(--soft); --studio-text:var(--text);
  --studio-muted:var(--muted); --studio-edge:var(--line); --studio-accent:var(--accent);
  --studio-action-blue:var(--action); --studio-on-action-blue:var(--on-action);
  --studio-selection:#435779; --studio-selection-text:#fff;
  --studio-positive:#a8ceb9; --studio-negative:#ffb5ae;
  --studio-radius-control:8px; --studio-radius-pane:12px;
  --studio-type-caption:12px; --studio-type-control:13px; --studio-type-body:14px;
  --studio-type-subtitle:16px; --studio-type-title:16px; --studio-type-display:36px;
  --portal-type-title:28px;
  --studio-leading-body:1.6; --studio-leading-ui:1.4;
  --studio-font:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-family:var(--studio-font);
}
body { background:var(--canvas); -webkit-font-smoothing:antialiased; }
h1,.setup-form h1 { font-size:var(--portal-type-title); line-height:1.2; letter-spacing:-.035em; }
.setup-form > .muted { font-size:var(--studio-type-body); }
button,.button { min-height:40px; padding:9px 16px; border-radius:8px; transition:background-color 140ms,color 140ms; }
button:hover,.button:hover { filter:none; box-shadow:inset 0 0 0 999px #ffffff0a; }
.secondary { background:var(--panel); border-color:var(--line); }
input,select { min-height:42px; padding:10px 12px; background:var(--panel); }
input[type=checkbox] { min-height:18px; }
input::placeholder,textarea::placeholder { opacity:1; }
:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.icon { width:18px; height:18px; flex:none; }
.brand-mark { width:30px; height:32px; flex:none; }
.wordmark { display:inline-flex; align-items:center; gap:10px; letter-spacing:-.055em; font-size:var(--portal-type-title); font-weight:500; }
.shell { grid-template-columns:228px minmax(0,1fr); padding:10px 10px 10px 0; gap:0; }
.sidebar { min-width:0; height:calc(100dvh - 20px); top:10px; padding:24px 16px 10px; border:0; background:none; backdrop-filter:none; color:var(--text); }
.sidebar .wordmark { padding:0 14px; }
.sidebar-create { display:flex; gap:10px; align-items:center; margin:30px 4px 0; min-height:40px; padding:10px 12px; background:var(--bg); border:1px solid var(--line); border-radius:10px; color:var(--text); text-decoration:none; font-size:var(--studio-type-control); }
.sidebar-create:hover { background:var(--panel); }
.sidebar nav { margin-top:28px; gap:26px; }
.sidebar .desktop-management { margin:0; gap:18px; padding-top:18px; border-top:1px solid var(--line); }
.desktop-management .nav-label { display:none; }
.account-actions a { gap:10px; }
.nav-group { display:grid; gap:5px; }
.nav-label { padding:0 14px 5px; color:var(--muted); font-size:var(--studio-type-caption); }
.sidebar nav a { display:flex; align-items:center; gap:11px; padding:11px 14px; min-height:42px; border-radius:10px;  }
.sidebar nav a[aria-current=page] { background:var(--soft); color:var(--text); font-weight:500; }
.sidebar nav a[aria-current=page] .icon { color:var(--accent); }
.sidebar nav a:not([aria-current]):hover { background:var(--soft); color:var(--text); }
.sidebar-bottom { min-width:0; padding:24px 4px 0; gap:20px; }
.help-link { display:flex; align-items:center; gap:11px; padding:8px 10px; color:var(--muted); text-decoration:none; font-size:var(--studio-type-caption); }
.account-menu { min-width:0; position:relative; border-top:1px solid var(--line); padding-top:14px; }
.account-menu summary { display:flex; align-items:center; gap:10px; padding:8px 4px; cursor:pointer; list-style:none; border-radius:8px; }
.account-menu summary::-webkit-details-marker { display:none; }
.account-avatar { width:32px; height:32px; flex:none; display:grid; place-items:center; border-radius:50%; font-weight:500; background:var(--soft); color:var(--text); }
.account-menu .email { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:var(--studio-type-caption); }
.account-menu .icon { width:14px; }
.account-actions { position:absolute; bottom:calc(100% + 6px); left:0; width:100%; padding:6px; border:1px solid var(--line); border-radius:12px; background:var(--panel); box-shadow:0 8px 24px #0000000a; z-index:5; }
.account-actions a,.account-actions button { display:flex; align-items:center; min-height:44px; padding:10px; width:100%; text-align:left; color:var(--text); text-decoration:none; font-size:var(--studio-type-control); border-radius:8px; }
.account-actions :is(a,button):hover { background:var(--raised); }
.sidebar .mobile-primary,.mobile-navigation { display:none; }
.main { min-width:0; width:100%; max-width:none; margin:0 auto; min-height:calc(100dvh - 20px); padding:34px clamp(24px,4vw,60px) 64px; background:var(--bg); border:1px solid var(--line); border-radius:12px; }
.page-header,.research-heading { margin:0 0 30px; gap:20px; }
.page-header h1,.research-heading h1 { font-size:var(--portal-type-title); line-height:1.15; margin:0; font-weight:500; letter-spacing:-.035em; }
.page-header .eyebrow,.research-kicker { margin:0 0 10px; font-size:var(--studio-type-caption); }
.page-header p { margin-top:12px; font-size:var(--studio-type-body); }
.eyebrow,.research-kicker { overflow-wrap:anywhere; }
.library-heading { align-items:center; }
.research-landscape { margin:0 0 30px; height:clamp(220px,25vw,330px); overflow:hidden; border-radius:12px; background:var(--raised); }
.research-landscape img { display:block; width:100%; height:100%; object-fit:cover; }
.library-toolbar { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 0 18px; border-bottom:1px solid var(--line); }
.library-tabs { display:flex; gap:6px; align-items:center; }
.library-tabs a { display:flex; align-items:center; gap:8px; text-decoration:none; color:var(--muted); padding:9px 12px; border-radius:8px; font-size:var(--studio-type-control); min-height:38px; }
.library-tabs a[aria-current] { background:var(--soft); color:var(--text); }
.library-tabs a span:not(:empty) { font-size:var(--studio-type-caption); padding:1px 5px; background:var(--panel); border-radius:4px; }
.project-search { display:flex; gap:8px; align-items:center; width:270px; min-width:0; padding:0 8px 0 12px; border:1px solid var(--line); border-radius:9px; background:var(--panel); }
.project-search > .icon { width:15px; color:var(--muted); }
.project-search input { border:0; background:none; padding:10px 0; font-size:var(--studio-type-caption); }
.project-search input:focus-visible { outline-offset:0; }
.project-search button { min-height:32px; padding:4px; }
.project-search button .icon { width:15px; }
.project-row { margin:0; padding:24px 10px; border-radius:0; gap:18px; }
.project-glyph { width:42px; height:48px; color:var(--accent); border-color:var(--line); border-radius:9px; background:var(--panel); }
.project-row h2 { font-size:var(--studio-type-body); margin:0 0 5px; }
.project-row p { font-size:var(--studio-type-control); }
.project-row time { font-size:var(--studio-type-caption); }
.research-empty,.research-library-empty { min-height:245px; padding:38px 16px 28px; }
.empty-project-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:12px; background:var(--soft); color:var(--accent); margin-bottom:18px; }
.empty-project-icon .icon { width:23px; height:23px; }
.research-empty h2 { font-size:var(--studio-type-subtitle); letter-spacing:-.02em; }
.research-empty > p { font-size:var(--studio-type-control); max-width:340px; margin:10px 0 20px; }
.page-tabs { display:flex; gap:24px; width:100%; max-width:100%; padding:0; margin-bottom:28px; border:0; border-bottom:1px solid var(--line); background:transparent; border-radius:0; overflow-x:auto; scrollbar-width:thin; }
.page-tabs a { white-space:nowrap; flex:none; padding:12px 0; min-height:44px; text-decoration:none; color:var(--muted); font-size:var(--studio-type-control); border-radius:0; border-bottom:2px solid transparent; }
.page-tabs a[aria-current=page] { color:var(--text); background:transparent; border-bottom-color:var(--accent); font-weight:500; }
.page-tabs a:hover { color:var(--text); }
.page-tabs a:focus-visible { outline-offset:-2px; }
.filter-bar { display:flex; flex-wrap:wrap; gap:12px; align-items:end; margin:0 0 28px; }
.filter-bar label { flex:1; min-width:140px; max-width:260px; color:var(--muted); font-size:var(--studio-type-caption); }
.filter-bar .search-field { flex:2; max-width:none; }
.filter-bar button { min-height:42px; }
.summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-block:1px solid var(--line); margin:0 0 32px; }
.summary-grid > div { min-width:0; padding:26px 24px; }
.summary-grid > div:first-child { padding-left:0; }
.summary-grid > div + div { border-left:1px solid var(--line); }
.summary-grid dt { color:var(--muted); font-size:var(--studio-type-caption); }
.summary-grid dd { margin:12px 0 8px; font-size:var(--studio-type-display); line-height:1.2; font-weight:500; letter-spacing:-.04em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.summary-grid .summary-note { margin:0; line-height:1.6; letter-spacing:0; font-weight:400; color:var(--muted); font-size:var(--studio-type-caption); }
.section-description { color:var(--muted); font-size:var(--studio-type-body); max-width:620px; margin:10px 0 24px; line-height:1.65; }
.model-settings { max-width:720px; padding:28px 0; border-block:1px solid var(--line); display:grid; gap:24px; }
.model-settings > .field-help { margin:-12px 0 0; }
.fusion-save { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.fusion-availability { margin-top:24px; }
.model-settings > label { max-width:320px; }
.model-settings select { width:100%; min-width:0; }
.model-list { list-style:none; padding:0; margin:0; border-top:1px solid var(--line); }
.model-row { display:grid; grid-template-columns:minmax(0,1fr) 130px 150px; gap:20px; padding:23px 4px; border-bottom:1px solid var(--line); align-items:center; }
.model-identity { display:flex; align-items:flex-start; gap:16px; min-width:0; }
.provider-mark { display:grid; place-items:center; width:40px; height:40px; flex:none; border:1px solid var(--line); background:var(--panel); border-radius:12px; font-weight:500; font-size:var(--studio-type-body); color:var(--text); }
.provider-mark svg { width:22px; height:22px; }
.model-identity h2 { margin:0 0 5px; font-size:var(--studio-type-body); font-weight:500; letter-spacing:-.01em; }
.model-identity p { margin:0; font-size:var(--studio-type-caption); color:var(--muted); }
.model-value { font-size:var(--studio-type-control); font-variant-numeric:tabular-nums; }
.model-value small { display:block; color:var(--muted); font-size:var(--studio-type-caption); margin-top:6px; }
.model-capabilities { display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; }
.model-capabilities span { color:var(--muted); font-size:var(--studio-type-caption); padding:3px 6px; background:var(--raised); border-radius:4px; }
.inline-banner { display:flex; align-items:center; gap:18px; padding:22px 24px; border:1px solid var(--line); border-radius:12px; background:var(--panel); margin-bottom:28px; }
.inline-banner > .icon { width:28px; height:28px; color:var(--lilac); }
.inline-banner > div { flex:1; min-width:0; }
.inline-banner h2 { font-size:var(--studio-type-subtitle); margin:0 0 6px; }
.inline-banner p { margin:0; color:var(--muted); font-size:var(--studio-type-control); }
.inline-banner > a { flex:none; }
.plan-layout { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:48px; align-items:start; }
.plan-card { padding:32px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.plan-card .section-heading { align-items:center; }
.plan-card h2 { font-size:var(--studio-type-subtitle); letter-spacing:-.025em; }
.plan-card > .muted { font-size:var(--studio-type-control); }
.plan-price { font-size:var(--studio-type-display); font-weight:500; letter-spacing:-.055em; font-variant-numeric:tabular-nums; margin:30px 0 10px; }
.plan-price span { font-size:var(--studio-type-body); color:var(--muted); font-weight:400; letter-spacing:0; }
.plan-features { padding:24px 0; margin:24px 0; list-style:none; display:grid; gap:16px; border-block:1px solid var(--line); font-size:var(--studio-type-control); }
.plan-features li { display:flex; gap:12px; }
.plan-features li::before { content:'✓'; color:var(--accent); }
.plan-notes { padding-top:8px; }
.plan-notes h2 { font-size:var(--studio-type-body); margin:0 0 10px; }
.plan-notes p { font-size:var(--studio-type-control); color:var(--muted); line-height:1.7; margin:0 0 24px; }
.plan-notes p + h2 { margin-top:30px; }
.status-label { display:inline-flex; align-items:center; gap:7px; font-size:var(--studio-type-caption); color:var(--muted); white-space:nowrap; }
.status-label::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }
.status-label.active { color:var(--studio-positive); }
.plain-list { padding-left:18px; display:grid; gap:12px; color:var(--muted); font-size:var(--studio-type-control); line-height:1.65; }
.usage-bars { display:flex; align-items:end; gap:7px; height:150px; margin:28px 0 14px; }
.usage-bar { flex:1; min-width:0; height:100%; display:flex; align-items:end; }
.usage-bar svg { width:100%; height:100%; overflow:visible; }
.chart-legend { display:flex; justify-content:space-between; color:var(--muted); font-size:var(--studio-type-caption); }
.table-wrap { position:relative; border-radius:12px; background:var(--panel); }
.table-wrap td { vertical-align:middle; padding-block:16px; }
.table-wrap .model-cell { min-width:160px; overflow-wrap:anywhere; }
.table-wrap .date-cell { white-space:nowrap; }
.pagination { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-top:20px; font-size:var(--studio-type-control); }
.table-empty { padding:48px 24px; text-align:center; border:1px solid var(--line); border-radius:12px; }
.table-empty h2 { font-size:var(--studio-type-subtitle); margin-bottom:10px; }
.table-empty p { color:var(--muted); font-size:var(--studio-type-control); margin:0 auto; max-width:420px; }
.login-page { grid-template-columns:1fr 1fr; grid-template-rows:auto 1fr auto; padding:16px; gap:16px; }
.login-header { padding:24px 32px; }
.login-main { width:min(100% - 48px,340px); padding:64px 0; text-align:left; }
.login-main h1 { font-size:var(--portal-type-title); letter-spacing:-.05em; margin-bottom:14px; }
.login-main .oauth { margin-top:32px; }
.login-main .oauth :is(.button,button) { justify-content:flex-start; padding:14px 18px; min-height:52px; font-size:var(--studio-type-body); gap:14px; }
.login-main .oauth span { flex:1; text-align:left; }
.login-main .oauth .icon { width:16px; color:var(--muted); }
.login-main .oauth :is(.button,button):focus-visible { outline-offset:4px; }
.login-main .oauth button:disabled { opacity:1; background:var(--raised); color:var(--muted); }
.signin-status { padding:14px 16px; font-size:var(--studio-type-control); line-height:1.65; border:1px solid var(--line); border-radius:10px; color:var(--muted); }
.login-landscape { grid-column:2; grid-row:1/4; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#080808; }
.login-landscape img { width:100%; height:100%; object-fit:cover; display:block; }
.login-footer { padding:16px 32px; justify-content:space-between; }
.research-setup { background:var(--bg); }
@media(max-width:1100px) and (min-width:851px) {
  .shell { grid-template-columns:206px minmax(0,1fr); }
  .main { padding-inline:30px; }
  .sidebar { padding-inline:12px; }
  .plan-layout { gap:24px; }
  .plan-card { padding:24px; }
  .model-row { grid-template-columns:minmax(0,1fr) 100px 100px; gap:14px; }
}
@media(max-width:850px) {
  .shell { display:block; padding:0; }
  .sidebar { position:relative; top:0; height:auto; padding:18px 24px; display:flex; flex-direction:row; align-items:center; justify-content:space-between; border:0; }
  .sidebar .wordmark { padding:0; font-size:var(--portal-type-title); }
  .sidebar-create,.sidebar .desktop-navigation,.sidebar .desktop-management { display:none; }
  .sidebar-bottom { display:block; margin:0; padding:0; }
  .sidebar-bottom .help-link { display:none; }
  .account-menu { border:0; padding:0; }
  .account-menu summary { padding:0 6px; min-height:44px; }
  .account-menu summary .email { display:none; }
  .account-actions { top:calc(100% + 10px); bottom:auto; left:auto; right:0; width:230px; }
  .sidebar .mobile-primary { position:fixed; z-index:10; bottom:0; left:0; right:0; height:calc(70px + env(safe-area-inset-bottom)); padding:7px 20% calc(7px + env(safe-area-inset-bottom)) 0; margin:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; background:var(--panel); border-top:1px solid var(--line); }
  .sidebar .mobile-primary a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:4px; font-size:var(--studio-type-caption); border-radius:10px; margin:0 4px; min-height:48px; }
  .sidebar .mobile-primary a[aria-current] { background:var(--soft); color:var(--accent); }
  .mobile-navigation { display:block; position:fixed; z-index:11; bottom:calc(7px + env(safe-area-inset-bottom)); right:0; width:20%; }
  .mobile-navigation summary { height:55px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; font-size:var(--studio-type-caption); list-style:none; cursor:pointer; color:var(--muted); }
  .mobile-navigation summary::-webkit-details-marker { display:none; }
  .mobile-navigation[open] summary { color:var(--accent); background:var(--soft); border-radius:10px; margin-inline:4px; }
  .mobile-navigation nav { position:fixed; bottom:calc(80px + env(safe-area-inset-bottom)); left:16px; right:16px; display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:0; padding:16px; max-height:65dvh; overflow-y:auto; border:1px solid var(--line); border-radius:12px; background:var(--panel); box-shadow:0 8px 24px #0000000a; }
  .mobile-navigation .nav-group { display:grid; gap:5px; }
  .mobile-navigation .nav-label { padding-top:8px; }
  .main { min-height:calc(100dvh - 80px); padding:30px 28px calc(110px + env(safe-area-inset-bottom)); border-radius:16px 16px 0 0; border-bottom:0; }
  .library-heading { flex-wrap:nowrap; }
  .page-header { gap:18px; }
  .research-landscape { height:260px; }
  .plan-layout { grid-template-columns:1fr; gap:32px; }
  .plan-card { max-width:620px; }
  .plan-notes { max-width:620px; }
  .login-header,.login-footer { padding-inline:16px; }
}
@media(max-width:600px) {
  .table-wrap:has(.key-table) { border:0; background:none; overflow:visible; }
  .key-table,.key-table tbody { display:block; width:100%; }
  .key-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .key-table tbody tr { display:grid; grid-template-columns:1fr 1fr; padding:18px; margin-bottom:12px; gap:16px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
  .key-table td { min-width:0; padding:0; border:0; font-size:var(--studio-type-caption); overflow-wrap:anywhere; }
  .key-table td::before { content:attr(data-label); display:block; color:var(--muted); font-size:var(--studio-type-caption); margin-bottom:6px; }
  .key-table td:not([data-label])::before { display:none; }
  .key-table :is(.key-name,.key-mask,.key-owner,.key-actions) { grid-column:1/-1; }
  .key-table .key-mask { margin-top:-5px; }
  .key-table .key-name strong { font-size:var(--studio-type-body); }
  .key-table .row-actions { gap:10px; padding-top:4px; }
  .key-table .row-actions a { flex:1; justify-content:center; border:1px solid var(--line); border-radius:8px; text-decoration:none; }
  .sidebar { padding:12px 20px; }
  .main { padding:28px 20px calc(100px + env(safe-area-inset-bottom)); }
  .main :is(button,.button,select,input:not([type=checkbox]):not([type=hidden])) { min-height:44px; }
  .library-heading { align-items:flex-start; gap:12px; }
  .library-heading .button { font-size:var(--studio-type-caption); padding:9px 11px; white-space:nowrap; }
  .library-heading .button .icon { width:14px; }
  .research-landscape { height:200px; border-radius:12px; margin-bottom:24px; }
  .library-toolbar { flex-wrap:wrap; gap:16px; }
  .library-tabs a { min-height:44px; padding-inline:14px; }
  .project-search { width:100%; }
  .project-search input { flex:1; }
  .project-search button { min-width:36px; }
  .project-row { padding:20px 0; gap:12px; }
  .project-row .row-arrow { display:none; }
  .page-tabs { gap:20px; width:100%; }
  .page-tabs a { flex:1; text-align:center; padding:12px 0; font-size:var(--studio-type-caption); min-height:44px; }
  .filter-bar { gap:14px; }
  .filter-bar label { min-width:120px; max-width:none; }
  .filter-bar .search-field { flex-basis:100%; }
  .summary-grid { grid-template-columns:1fr; }
  .summary-grid > div,.summary-grid > div:first-child { padding:20px 0; }
  .summary-grid > div + div { border-left:0; border-top:1px solid var(--line); }
  .inline-banner { padding:20px; flex-wrap:wrap; gap:12px; }
  .inline-banner > div { flex-basis:calc(100% - 44px); }
  .inline-banner > a { margin-left:40px; }
  .model-row { grid-template-columns:1fr 1fr; gap:16px; padding:24px 0; }
  .model-identity { grid-column:1/-1; }
  .model-value { padding-left:56px; font-size:var(--studio-type-caption); }
  .model-value:last-child { padding-left:0; }

  .plan-card { padding:24px; }
  .plan-price { font-size:var(--studio-type-display); }
  .usage-bars { gap:3px; }
  .login-page { display:flex; flex-direction:column; gap:0; padding:0; }
  .login-header { padding:24px; }
  .login-main { padding:40px 0 48px; }
  .login-landscape { min-height:200px; margin:0 16px; }
  .login-landscape img { height:200px; }
  .login-footer { padding:24px; margin-top:auto; }
}
@media(max-width:360px) { .main { padding-inline:16px; }.library-heading { flex-wrap:wrap; }.page-tabs { gap:14px; }.model-value { padding-left:0; }.plan-card { padding:20px; } }
/* Account console: quiet surfaces, readable tables, and controls with real state. */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.count-badge { display:inline-flex; align-items:center; justify-content:center; min-width:24px; min-height:24px; margin-left:10px; padding:2px 7px; background:var(--soft); border-radius:7px; color:var(--muted); font-size:var(--studio-type-caption); font-weight:400; }
.key-list-heading { margin:34px 0 18px; }
.key-list-heading h2 { display:flex; align-items:center; }
.key-table strong { font-size:var(--studio-type-control); font-weight:500; }
.key-table .subtle { margin-top:6px; font-size:var(--studio-type-caption); }
.masked-key { white-space:nowrap; font-size:var(--studio-type-caption); color:var(--muted); }
.row-actions { display:flex; align-items:center; gap:16px; white-space:nowrap; }
.row-actions a { font-size:var(--studio-type-caption); display:inline-flex; align-items:center; min-height:36px; }
.danger-link { color:var(--studio-negative); }
button.danger { background:var(--studio-negative); color:var(--bg); }
.status-badge,.request-status { display:inline-flex; white-space:nowrap; font-size:var(--studio-type-caption); color:var(--muted); }
.empty-glyph { display:grid; place-items:center; width:48px; height:48px; margin:0 auto 20px; border:1px solid var(--line); border-radius:12px; background:var(--soft); color:var(--accent); }
.empty-glyph .icon { width:24px; height:24px; }
.key-empty { padding-block:44px; background:var(--panel); }
.key-empty .button { margin-top:22px; }
.key-reveal input { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:var(--studio-type-caption); }
.key-form { max-width:560px; }
.key-form > label { margin-bottom:22px; }
.key-form > label:has(select) { max-width:240px; }
.key-permission { display:flex; align-items:flex-start; gap:14px; padding:20px 0; border-top:1px solid var(--line); }
.key-permission > .icon { margin-top:2px; color:var(--accent); }
.key-permission strong { font-size:var(--studio-type-control); font-weight:500; }
.key-permission p { margin:6px 0 0; color:var(--muted); font-size:var(--studio-type-caption); line-height:1.6; }
.key-reveal { max-width:780px; border:1px solid var(--line); border-radius:12px; padding:28px; background:var(--panel); }
.key-reveal .key-permission { padding-top:0; border-top:0; }
.key-reveal > label { margin:12px 0 8px; font-size:var(--studio-type-caption); }
.key-copy { display:flex; gap:12px; }
.key-copy input { min-width:0; flex:1; }
.key-copy button { flex:none; }
.key-reveal #copy-status { min-height:18px; }
.usage-period-row { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:22px; }
.month-control { display:flex; align-items:center; gap:8px; }
.month-control .button,.month-control button { width:38px; min-height:40px; padding:8px; }
.month-control label { width:190px; }
.month-control input { background:transparent; border-color:transparent; font-size:var(--studio-type-body); padding-inline:6px; }
.scope-control { width:190px; }
.usage-filters .filter-bar { margin-bottom:30px; }
.usage-filters .filter-bar label { min-width:130px; max-width:none; }
.usage-filters select { max-width:100%; text-overflow:ellipsis; }
.usage-receipt { margin-top:6px; font-size:12px; white-space:normal; }
.usage-receipt summary { color:var(--muted); cursor:pointer; }
.usage-receipt dl { display:grid; grid-template-columns:auto minmax(0,1fr); gap:6px 14px; margin:12px 0; min-width:240px; }
.usage-receipt dt { color:var(--muted); }
.usage-receipt dd { margin:0; overflow-wrap:anywhere; }
.usage-receipt code { font-size:11px; }
.usage-chart { position:relative; padding:4px 0 20px; }
.usage-chart .section-heading { margin-bottom:0; }
.usage-chart .usage-bars { height:165px; padding-top:14px; margin-top:16px; border-bottom:1px solid var(--line); }
.chart-empty { position:absolute; top:46%; left:0; right:0; text-align:center; color:var(--muted); font-size:var(--studio-type-control); }
.usage-empty { padding:30px 0 40px; border-block:1px solid var(--line); color:var(--muted); font-size:var(--studio-type-control); }
.usage-empty p { margin:0 0 16px; }
.access-row { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 4px; border-bottom:1px solid var(--line); scroll-margin-top:40px; }
.access-row .model-identity { align-items:center; }
.access-row .model-identity h2 { font-size:var(--studio-type-body); }
.access-switch { display:flex; align-items:center; gap:10px; min-height:44px; min-width:124px; padding:8px; background:transparent; color:var(--muted); font-size:var(--studio-type-caption); font-weight:400; }
.switch-track { position:relative; display:block; width:34px; height:20px; border-radius:20px; background:var(--line); border:1px solid var(--muted); }
.switch-track::after { content:''; position:absolute; height:14px; width:14px; left:2px; top:2px; border-radius:50%; background:var(--muted); }
.access-switch[aria-checked=true] .switch-track { background:var(--action); border-color:var(--action); }
.access-switch[aria-checked=true] .switch-track::after { left:16px; background:var(--on-action); }
.role-form { display:grid; gap:12px; max-width:240px; padding-top:14px; }
.role-form .field-help { margin:0; }
@media(max-width:600px) {
  .key-list-heading { align-items:flex-start; gap:12px; }
  .key-list-heading > a { font-size:var(--studio-type-caption); text-align:right; min-height:44px; }
  .key-list-heading h2 { font-size:var(--studio-type-body); }
  .key-reveal { padding:20px; }
  .key-copy { flex-direction:column; }
  .usage-period-row { flex-wrap:wrap; }
  .month-control { flex:1; justify-content:space-between; width:100%; }
  .month-control label { flex:1; max-width:210px; }
  .month-control input { width:100%; }
  .scope-control { width:100%; }
  .usage-filters .filter-bar { gap:14px; }
  .usage-filters .filter-bar label { flex-basis:100%; }
  .usage-filters .filter-bar button { flex:1; }
  .usage-chart .usage-bars { height:135px; }
  .access-row { gap:10px; }
  .access-switch { min-width:92px; gap:7px; font-size:var(--studio-type-caption); padding:6px 0; }
  .access-row .model-identity { gap:10px; }
  .access-row .model-identity h2 { font-size:var(--studio-type-control); }
  .access-row .provider-mark { width:32px; height:32px; border-radius:9px; }
  .access-row .provider-mark svg { width:18px; height:18px; }
  .row-actions a { min-height:44px; }
}


/* Account home and billing use the same section edges and control baseline. */
.page-header > :is(a,form) { flex:none; align-self:center; }
.section-heading { gap:18px; }
.section-heading h2 { font-size:var(--studio-type-subtitle); font-weight:500; letter-spacing:-.015em; }
.section-heading > a { font-size:var(--studio-type-caption); }
.download-hero { overflow:hidden; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.download-art { height:clamp(180px,18vw,240px); overflow:hidden; background:var(--soft); }
.download-art img { display:block; width:100%; height:100%; object-fit:cover; }
.download-intro { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:28px 30px; }
.download-intro h2 { font-size:var(--studio-type-subtitle); font-weight:500; letter-spacing:-.035em; margin:0 0 8px; }
.download-intro p { font-size:var(--studio-type-control); margin:0; }
.download-platforms { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid var(--line); }
.download-card { min-width:0; padding:26px 24px; display:flex; flex-direction:column; }
.download-card + .download-card { border-left:1px solid var(--line); }
.platform-icon { display:grid; place-items:center; width:44px; height:44px; background:var(--soft); border-radius:12px; margin-bottom:18px; }
.download-card:nth-child(2) .platform-icon { background:var(--blue-soft); color:var(--blue); }
.download-card:nth-child(3) .platform-icon { background:var(--amber-soft); color:var(--amber); }
.platform-icon .icon { width:24px; height:24px; }
.download-card h3 { font-size:var(--studio-type-subtitle); font-weight:500; margin:0 0 8px; }
.download-card > p { font-size:var(--studio-type-caption); margin:0 0 24px; }
.download-options { margin-top:auto; }
.download-options { display:grid; gap:8px; }
.download-options .button { width:100%; font-size:var(--studio-type-caption); padding-inline:10px; justify-content:center; }
.download-size { font-size:var(--studio-type-caption); color:var(--muted); }
.download-release { padding:20px 30px; border-top:1px solid var(--line); margin:0; font-size:var(--studio-type-control); white-space:pre-line; }
.account-shortcuts { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:28px; }
.account-shortcuts > a { display:flex; align-items:center; gap:16px; padding:24px 0; border-block:1px solid var(--line); text-decoration:none; }
.account-shortcuts > a { color:var(--text); }
.account-shortcuts > a:hover { color:var(--accent); }
.account-shortcuts > a:last-child > .icon:first-child { color:var(--lilac); }
.account-shortcuts > a > .icon:first-child { width:22px; height:22px; color:var(--accent); }
.account-shortcuts > a > .icon:last-child { margin-left:auto; width:16px; }
.account-shortcuts h2 { font-size:var(--studio-type-body); font-weight:500; margin:0 0 6px; }
.account-shortcuts p { font-size:var(--studio-type-caption); color:var(--muted); margin:0; }
.billing-facts { margin:24px 0 0; }
.billing-facts > div { display:flex; align-items:baseline; justify-content:space-between; gap:20px; padding:14px 0; border-top:1px solid var(--line); font-size:var(--studio-type-caption); line-height:1.6; }
.billing-facts dt { color:var(--muted); flex:none; }
.billing-facts dd { margin:0; text-align:right; overflow-wrap:anywhere; }
.payment-table th { font-size:var(--studio-type-caption); font-weight:500; }
.payment-table td { font-size:var(--studio-type-caption); padding-block:22px; }
.payment-table td strong { display:block; font-size:var(--studio-type-control); font-weight:500; }
.payment-table .numeric { font-variant-numeric:tabular-nums; white-space:nowrap; }
.payment-refund { display:block; color:var(--muted); font-size:var(--studio-type-caption); margin-top:6px; }
.payment-receipt { text-align:right; }
.payment-receipt a { display:inline-flex; align-items:center; gap:8px; min-height:36px; }
.billing-filter { display:flex; align-items:end; gap:12px; margin-bottom:24px; }
.billing-filter label { width:190px; font-size:var(--studio-type-caption); color:var(--muted); }
.billing-filter button { min-height:42px; }
.billing-filter > a { display:flex; align-items:center; min-height:42px; font-size:var(--studio-type-caption); }
.billing-pagination { display:flex; justify-content:space-between; margin-top:20px; font-size:var(--studio-type-control); }
.billing-footer { display:flex; justify-content:space-between; gap:20px; margin-top:36px; padding-top:20px; border-top:1px solid var(--line); color:var(--muted); font-size:var(--studio-type-caption); }
@media(min-width:851px) { .desktop-navigation { margin-top:36px!important; } }
@media(max-width:1100px) {
  .download-card { padding:22px 16px; }
}
@media(max-width:700px) {
  .download-platforms { grid-template-columns:1fr; }
  .download-card { display:grid; grid-template-columns:44px 1fr; column-gap:16px; padding:24px; }
  .download-card + .download-card { border-left:0; border-top:1px solid var(--line); }
  .download-card .platform-icon { grid-row:1/3; margin:0; }
  .download-card h3 { align-self:end; margin-bottom:6px; }
  .download-card > p { margin:0; }
  .download-options { grid-column:1/-1; margin-top:20px; }
  .download-intro { align-items:flex-start; padding:24px; }
  .download-intro p { line-height:1.65; }
  .account-shortcuts { grid-template-columns:1fr; gap:0; }
  .account-shortcuts > a + a { border-top:0; }
  .table-wrap:has(.payment-table) { overflow:visible; border:0; background:none; }
  .payment-table,.payment-table tbody { display:block; width:100%; min-width:0; }
  .payment-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .payment-table tbody tr { display:grid; grid-template-columns:1fr 1fr; gap:16px; border:1px solid var(--line); border-radius:12px; padding:20px; margin-bottom:12px; background:var(--panel); }
  .payment-table td { padding:0; border:0; min-width:0; text-align:left; }
  .payment-table td:first-child { grid-column:1/-1; }
  .payment-table td[data-label]::before { content:attr(data-label); display:block; font-size:var(--studio-type-caption); color:var(--muted); margin-bottom:7px; }
  .payment-table td:first-child::before { display:none; }
  .payment-table .payment-receipt { align-self:end; text-align:right; }
  .payment-table .payment-receipt a { min-height:44px; }
}
@media(max-width:600px) {
  .page-header { flex-direction:column; align-items:stretch; }
  .page-header > :is(a,form) { align-self:flex-start; }
  .download-intro { flex-wrap:wrap; gap:16px; }
  .download-art { height:185px; }
  .billing-facts > div { gap:12px; }
  .billing-filter { flex-wrap:wrap; }
  .billing-filter label { flex:1; min-width:160px; }
  .billing-footer { flex-wrap:wrap; }
}

.account-section { display:grid; grid-template-columns:180px minmax(0,1fr); gap:36px; padding:30px 0; border-top:1px solid var(--line); scroll-margin-top:24px; }
.account-section > h2 { font-size:var(--studio-type-subtitle); margin:0; }
.account-section > div { min-width:0; }
.reload-form { min-width:0; width:100%; }
.reload-status { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.credit-summary { display:flex; align-items:baseline; flex-wrap:wrap; gap:16px; }
.credit-summary strong { font-size:var(--studio-type-title); font-weight:500; font-variant-numeric:tabular-nums; }
.credit-purchase { display:flex; align-items:flex-end; flex-wrap:wrap; gap:12px; }
.credit-purchase input { max-width:190px; }
.credit-pending { display:grid; gap:12px; padding-top:16px; border-top:1px solid var(--line); }
.account-section:has(.payment-table) { grid-template-columns:1fr; gap:20px; }
.account-section .empty-note { margin:0; padding:0; }
.billing-plan-summary { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.billing-plan-summary h3 { font-size:var(--studio-type-subtitle); margin:0 0 8px; }
.billing-rate { display:flex; align-items:baseline; gap:8px; font-size:var(--portal-type-title); font-weight:500; letter-spacing:-.035em; white-space:nowrap; font-variant-numeric:tabular-nums; }
.billing-rate span { color:var(--muted); font-size:var(--studio-type-caption); font-weight:400; letter-spacing:0; }
.payment-method-row { display:flex; align-items:center; gap:14px; }
.method-icon { display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--line); border-radius:8px; }
.payment-method-row strong { text-transform:capitalize; font-weight:500; }
.payment-method-row p { margin:4px 0 0; font-size:var(--studio-type-caption); color:var(--muted); }
.payment-method-row > .status-label { margin-left:auto; }
.billing-history-controls { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:24px; flex-wrap:wrap; }
.billing-history-controls .billing-filter { margin:0; }
.download-unavailable { margin-top:auto; font-size:var(--studio-type-caption); color:var(--muted); }
@media(max-width:1100px) { .account-section { grid-template-columns:140px minmax(0,1fr); gap:24px; } }
@media(max-width:700px) { .account-section { grid-template-columns:1fr; gap:22px; }.download-unavailable { grid-column:2; margin-top:12px; } }
@media(max-width:600px) { .billing-plan-summary { align-items:flex-start; flex-direction:column; gap:16px; }.billing-history-controls > a { width:100%; } }

@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }
@media(prefers-reduced-transparency:reduce) { .sidebar,.account-actions,.mobile-navigation nav { backdrop-filter:none; } }
@media(prefers-contrast:more) { :root { --muted:var(--text); --line:var(--muted); }.main,.button,.page-tabs a[aria-current],input,select,textarea { border-width:2px; } }
.reload-control { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.reload-control > p { margin:0; font-size:var(--studio-type-control); }
.reload-control > form { flex:none; }
.reload-switch { min-width:84px; justify-content:flex-end; }
.reload-editor { margin-top:12px; }
.reload-editor > summary { display:inline-flex; align-items:center; gap:8px; min-height:44px; cursor:pointer; list-style:none; font-size:var(--studio-type-control); }
.reload-editor > summary::-webkit-details-marker { display:none; }
.reload-editor > summary .icon { width:14px; height:14px; }
.reload-editor[open] > summary .icon { transform:rotate(180deg); }
.reload-editor .reload-form { padding-top:14px; }
/* Settings and membership share the billing section rhythm. */
.settings-form { display:flex; align-items:flex-end; flex-wrap:wrap; gap:12px; max-width:620px; }
.settings-form label { flex:1; min-width:180px; }
.settings-form button { min-height:42px; }
.settings-account { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; max-width:620px; }
.settings-account > div { min-width:0; }
.account-address { margin:0 0 6px; font-size:var(--studio-type-body); overflow-wrap:anywhere; }
.settings-account .field-help { margin:0; }
.settings-account > form { flex:none; }
.account-section[aria-labelledby=devices-heading] > div { max-width:620px; }
.device-empty { display:flex; align-items:flex-start; gap:14px; padding:20px; border:1px solid var(--line); border-radius:10px; }
.device-empty > .icon { margin-top:2px; color:var(--muted); width:22px; height:22px; }
.device-empty p { margin:0; }
.device-empty .field-help { margin-top:6px; max-width:380px; }
.settings-key-link { display:inline-flex; align-items:center; gap:8px; min-height:44px; margin-top:12px; font-size:var(--studio-type-control); }
.settings-key-link .icon { width:14px; height:14px; }
.table-wrap .member-table :is(td,th),.table-wrap .device-table :is(td,th) { vertical-align:top; padding:20px; }
.member-table { table-layout:fixed; }
.member-table th:first-child { width:34%; }
.member-table th:nth-child(2) { width:16%; }
.member-table th:nth-child(3) { width:28%; }
.member-table th:last-child { width:22%; }
.member-table td { overflow-wrap:anywhere; }
.member-role { text-transform:capitalize; }
.member-table .status-label { line-height:1.6; }
.member-table .member-usage { min-width:0; }
.member-table .member-usage .numeric { text-align:left; }
.member-table .member-usage > a { margin-top:3px; }
.device-table .details { margin-top:0; }
.device-table td:first-child { overflow-wrap:anywhere; }
@media(max-width:1100px) and (min-width:701px) {
  .table-wrap .member-table :is(td,th) { padding:18px 12px; }
}
@media(max-width:700px) {
  .table-wrap:has(> .member-table),.table-wrap:has(> .device-table) { overflow:visible; background:none; border:0; border-radius:0; }
  .member-table,.member-table tbody,.device-table,.device-table tbody { display:block; width:100%; min-width:0; }
  .member-table thead,.device-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .member-table tbody tr,.device-table tbody tr { display:grid; grid-template-columns:1fr 1fr; gap:20px 16px; margin-bottom:12px; padding:20px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
  .table-wrap .member-table td,.table-wrap .device-table td { padding:0; border:0; min-width:0; }
  .member-table td:first-child,.device-table td:first-child { grid-column:1/-1; }
  .member-table td:nth-child(3) { grid-column:1/-1; grid-row:3; }
  .member-table td[data-label]:before,.device-table td[data-label]:before { content:attr(data-label); display:block; color:var(--muted); font-size:var(--studio-type-caption); margin-bottom:8px; }
  .device-table .device-actions { grid-column:1/-1; }
  .member-table .member-usage > a { display:inline-flex; align-items:center; min-height:44px; margin:0; }
  .member-table .details > summary,.device-table .details > summary { min-height:44px; align-content:center; }
}
@media(max-width:400px) { .settings-form label { min-width:0; width:100%; flex:auto; }.settings-form button { width:100%; } }
/* Expandable model rates use native disclosure controls. */
.catalog { border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--panel); }
.catalog-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:24px; }
.catalog-header h2 { margin:0; font-size:var(--studio-type-subtitle); }
.catalog-columns { display:grid; grid-template-columns:minmax(0,1fr) 180px; padding:0 66px 16px 24px; color:var(--muted); font-size:var(--studio-type-caption); }
.catalog-model { border-top:1px solid var(--line); }
.catalog-model summary { display:grid; grid-template-columns:minmax(0,1fr) 180px 18px; align-items:center; gap:24px; padding:20px 24px; cursor:pointer; list-style:none; }
.catalog-model summary::-webkit-details-marker { display:none; }
.catalog-model summary:hover { background:var(--raised); }
.catalog-model summary:focus-visible { outline-offset:-3px; }
.catalog-model[open] summary > .icon { transform:rotate(180deg); }
.catalog-model summary > .icon { color:var(--muted); width:16px; }
.catalog-identity { display:flex; align-items:center; gap:14px; min-width:0; }
.catalog-identity .provider-mark { width:36px; height:36px; border-radius:9px; }
.catalog-identity strong { display:block; font-size:var(--studio-type-body); font-weight:500; overflow-wrap:anywhere; }
.catalog-hint { display:block; margin-top:3px; color:var(--muted); font-size:var(--studio-type-caption); }
.catalog-provider { font-size:var(--studio-type-control); color:var(--muted); }
.catalog-detail { padding:4px 24px 24px; }
.model-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; margin:8px 0 26px; }
.model-facts dt { font-size:var(--studio-type-caption); color:var(--muted); }
.model-facts dd { margin:7px 0 0; font-size:var(--studio-type-control); font-variant-numeric:tabular-nums; }
.catalog-rates { overflow-x:auto; scrollbar-width:thin; }
.catalog-rates table { min-width:560px; width:100%; }
.catalog-rates caption { text-align:left; color:var(--muted); font-size:var(--studio-type-caption); padding-bottom:14px; }
.catalog-rates :is(th,td) { padding:12px 10px; font-size:var(--studio-type-caption); font-variant-numeric:tabular-nums; text-align:right; white-space:nowrap; }
.catalog-rates th { font-weight:400; }
.catalog-rates tbody tr:last-child :is(th,td) { border-bottom:0; }
.catalog-rates tr > :first-child { text-align:left; padding-left:0; }
.catalog-rates tr > :last-child { padding-right:0; }
.catalog-footnote { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:18px; color:var(--muted); font-size:var(--studio-type-caption); }
.catalog-footnote code { overflow-wrap:anywhere; min-width:0; font-size:11px; }
.catalog-footnote a { display:inline-flex; align-items:center; gap:7px; min-height:36px; flex:none; }
.catalog-footnote .icon { width:13px; height:13px; }
.catalog-note { margin:0; padding:18px 24px; border-top:1px solid var(--line); color:var(--muted); font-size:var(--studio-type-caption); }
.catalog-balance { display:grid; grid-template-columns:1fr 18px; align-items:center; gap:2px 16px; padding:10px 16px; border:1px solid var(--line); border-radius:8px; color:var(--text); text-decoration:none; }
.catalog-balance span { color:var(--muted); font-size:var(--studio-type-caption); }
.catalog-balance strong { grid-row:2; font-size:var(--studio-type-subtitle); font-weight:500; font-variant-numeric:tabular-nums; }
.catalog-balance .icon { grid-column:2; grid-row:1/3; width:14px; }
.catalog-balance:hover { background:var(--panel); }
@media(max-width:1100px) {
  .catalog-model summary { grid-template-columns:minmax(0,1fr) 110px 18px; gap:16px; }
  .catalog-columns { grid-template-columns:minmax(0,1fr) 110px; padding-right:58px; }
  .model-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
  .catalog-header { padding:20px; }
  .catalog-columns { display:none; }
  .catalog-model summary { grid-template-columns:minmax(0,1fr) 18px; gap:12px; padding:20px; }
  .catalog-provider { grid-column:1; margin-left:50px; font-size:var(--studio-type-caption); }
  .catalog-model summary > .icon { grid-column:2; grid-row:1/3; }
  .catalog-detail { padding:0 20px 20px; }
  .model-facts { gap:20px 12px; }
  .catalog-footnote { flex-wrap:wrap; gap:8px; }
  .catalog-footnote a { min-height:44px; }
  .catalog-note { padding:18px 20px; }
}
/* Account overview and download options. */
.overview-hero { position:relative; isolation:isolate; min-height:320px; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:#080808; display:flex; flex-direction:column; justify-content:space-between; }
.overview-art { position:absolute; z-index:-2; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:right center; }
.overview-hero:after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,#080808f5,#08080895 32%,#08080800 78%),linear-gradient(0deg,#080808,#08080800 25%); }
.overview-copy { padding:42px 40px; }
.overview-kicker { color:var(--muted); font-size:11px; letter-spacing:.1em; text-transform:uppercase; }
.overview-copy h2 { font-size:clamp(30px,3vw,42px); line-height:1.06; font-weight:450; letter-spacing:-.05em; margin:20px 0; }
.overview-copy p { margin:0; color:#c6c4bf; font-size:14px; line-height:1.65; }
.overview-caption { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:24px 40px; color:var(--muted); font-size:11px; }
.overview-caption span:last-child { color:#d7b68c; }
.overview-platforms { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:20px; }
.overview-platform { min-width:0; padding:24px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.overview-platform > .icon { width:24px; height:24px; margin-bottom:20px; color:var(--text); }
.overview-platform h3 { font-size:var(--studio-type-subtitle); font-weight:500; margin:0 0 6px; }
.overview-platform > p { color:var(--muted); font-size:var(--studio-type-caption); margin:0 0 22px; }
.overview-platform > :is(.button,button) { width:100%; min-height:42px; padding-inline:10px; }
.overview-platform button:disabled { opacity:1; background:var(--raised); color:var(--muted); border-color:var(--line); }
.platform-options { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:0 12px; margin-top:12px; }
.platform-options :is(a,span) { display:inline-flex; align-items:center; min-height:36px; font-size:var(--studio-type-caption); }
.platform-options a { color:var(--text); text-decoration-color:var(--muted); }
.platform-options span { color:var(--muted); }
.overview-availability { margin:14px 0 0; color:var(--muted); font-size:var(--studio-type-caption); }
.overview-compatibility { border-bottom:1px solid var(--line); color:var(--muted); font-size:12px; }
.overview-compatibility summary { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:50px; cursor:pointer; list-style:none; }
.overview-compatibility summary::-webkit-details-marker { display:none; }
.overview-compatibility summary .icon { width:14px; height:14px; }
.overview-compatibility[open] summary .icon { transform:rotate(45deg); }
.overview-compatibility p { margin:0; padding:0 0 20px; max-width:530px; }
.overview-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:28px; }
.overview-links a { position:relative; padding:20px; border:1px solid var(--line); border-radius:9px; text-decoration:none; color:var(--text); transition:border-color 140ms,background-color 140ms; }
.overview-links a:hover { border-color:#666; background:#151515; }
.overview-links a > .icon { margin-bottom:18px; width:18px; height:18px; color:var(--muted); }
.overview-links h2 { margin:0 0 6px; font-size:13px; font-weight:500; }
.overview-links p { margin:0; color:var(--muted); font-size:12px; }
.overview-arrow { position:absolute; right:18px; top:22px; color:var(--muted); }
.overview-arrow .icon { width:14px; height:14px; }
@media(max-width:1100px) {
  .overview-platform { padding:22px 16px; }
  .overview-links { gap:10px; }
  .overview-links a { padding:18px 14px; }
}
@media(max-width:600px) {
  .overview-hero { min-height:310px; }
  .overview-art { object-position:65% center; opacity:.8; }
  .overview-hero:after { background:linear-gradient(90deg,#080808e5,#08080860 60%,#08080800),linear-gradient(0deg,#080808,#08080800 30%); }
  .overview-copy { padding:28px 24px; }
  .overview-copy h2 { font-size:34px; }
  .overview-caption { padding:22px 24px; }
 .overview-platforms { grid-template-columns:1fr; }
  .overview-platform { padding:24px; }
  .platform-options :is(a,span) { min-height:44px; }
  .overview-links { grid-template-columns:1fr; gap:10px; }
  .overview-links a { display:grid; grid-template-columns:22px 1fr; column-gap:14px; padding:20px; }
  .overview-links a > .icon { grid-row:1/3; align-self:center; margin:0; }
  .overview-links h2,.overview-links p { grid-column:2; margin-right:16px; }
  .overview-arrow { top:31px; }
}
@media(prefers-contrast:more) { :root { --line:#777; --muted:#d0d0d0; } }
@media(prefers-reduced-motion:reduce) { .overview-links a { transition:none; } }

