:root {
  --ink: #151713;
  --muted: #687065;
  --paper: #f4f3ed;
  --card: rgba(255,255,252,.82);
  --line: rgba(21,23,19,.12);
  --green: #3d7a5b;
  --green-deep: #25543d;
  --lime: #c9f36b;
  --orange: #ef8354;
  --shadow: 0 24px 70px rgba(34,43,34,.11);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 82% 8%, rgba(201,243,107,.32), transparent 29rem),
    radial-gradient(circle at 5% 42%, rgba(239,131,84,.1), transparent 24rem),
    var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  min-height: 100vh;
}
button, input, textarea { font: inherit; }
button { cursor: pointer; }
code, pre { font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; }

.page-shell { width: min(1240px, calc(100% - 40px)); margin: 0 auto; }
.topbar { height: 84px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; color: #fff; background: var(--ink); font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 16px; letter-spacing: -.02em; }
.brand small { margin-top: 2px; color: var(--muted); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.topbar-actions { display: flex; align-items: center; gap: 10px; }
.status-pill { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: rgba(255,255,255,.55); border-radius: 999px; padding: 9px 13px; font-size: 12px; color: var(--muted); }
.status-pill i { width: 7px; height: 7px; border-radius: 50%; background: #c5a448; box-shadow: 0 0 0 4px rgba(197,164,72,.12); }
.status-pill.ready i { background: #46a069; box-shadow: 0 0 0 4px rgba(70,160,105,.14); }
.status-pill.error i { background: #c9594f; box-shadow: 0 0 0 4px rgba(201,89,79,.12); }

.hero { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(36px, 7vw, 100px); padding: 72px 0 62px; align-items: center; }
.eyebrow { color: var(--green); font-size: 11px; font-weight: 800; letter-spacing: .18em; }
.hero h1 { margin: 18px 0 24px; max-width: 760px; font-size: clamp(48px, 6.7vw, 88px); line-height: .95; letter-spacing: -.068em; font-weight: 670; }
.hero h1 span { color: var(--green); }
.hero-copy > p { max-width: 660px; margin: 0; color: var(--muted); font-size: 17px; line-height: 1.75; }
.hero-actions { display: flex; gap: 10px; margin-top: 32px; }
.button { border: 1px solid transparent; border-radius: 12px; padding: 12px 18px; font-weight: 700; font-size: 13px; transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.button:hover { transform: translateY(-1px); }
.button.primary { color: white; background: var(--green-deep); box-shadow: 0 10px 24px rgba(37,84,61,.2); }
.button.primary:hover { background: #193f2c; }
.button.secondary { background: rgba(255,255,255,.65); color: var(--ink); border-color: var(--line); }
.button.ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.button.compact { padding: 9px 13px; border-radius: 10px; }
.button.wide { width: 100%; }
.endpoint-line { display: flex; align-items: center; gap: 12px; margin-top: 28px; color: var(--muted); font-size: 10px; letter-spacing: .12em; }
.endpoint-line code { padding: 8px 10px; color: var(--ink); background: rgba(255,255,255,.52); border: 1px solid var(--line); border-radius: 8px; letter-spacing: 0; font-size: 12px; }

.flow-card { position: relative; border: 1px solid rgba(21,23,19,.14); background: rgba(27,32,27,.96); color: white; border-radius: 24px; padding: 22px; box-shadow: var(--shadow); overflow: hidden; }
.flow-card::after { content: ""; position: absolute; width: 180px; height: 180px; right: -80px; top: -90px; border-radius: 50%; background: rgba(201,243,107,.13); filter: blur(2px); }
.flow-head { display: flex; align-items: center; justify-content: space-between; color: #aeb8ad; font-size: 10px; letter-spacing: .13em; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.1); }
.flow-head b { color: var(--lime); font-size: 10px; }
.flow-node { position: relative; display: grid; grid-template-columns: 34px 1fr auto; gap: 14px; align-items: center; padding: 20px 4px; border-bottom: 1px solid rgba(255,255,255,.08); }
.flow-node i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(255,255,255,.08); color: #aeb8ad; font-style: normal; font-size: 10px; }
.flow-node strong, .flow-node small { display: block; }
.flow-node strong { font-size: 14px; }
.flow-node small { color: #8f9b8d; margin-top: 4px; font-size: 11px; }
.flow-node > span { color: #667065; }
.flow-node.active i { background: var(--lime); color: #1d281c; }
.flow-node.active > span { color: var(--lime); }
.flow-foot { display: flex; align-items: center; gap: 9px; padding: 17px 4px 0; color: #93a091; font-size: 11px; }
.pulse { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 5px rgba(201,243,107,.1); }

.metrics { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); border-radius: 18px; background: var(--card); box-shadow: 0 12px 40px rgba(34,43,34,.06); overflow: hidden; }
.metrics article { padding: 23px 26px; border-right: 1px solid var(--line); }
.metrics article:last-child { border-right: 0; }
.metrics span, .metrics small, .metrics strong { display: block; }
.metrics span { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.metrics strong { margin: 7px 0 3px; font-size: 29px; letter-spacing: -.05em; }
.metrics small { color: #939a91; font-size: 11px; }

.console { margin: 34px 0 70px; border: 1px solid var(--line); border-radius: 22px; background: var(--card); box-shadow: var(--shadow); overflow: hidden; }
.tabs { display: flex; gap: 4px; padding: 10px; border-bottom: 1px solid var(--line); overflow-x: auto; }
.tab { border: 0; border-radius: 9px; background: transparent; padding: 10px 14px; color: var(--muted); font-size: 12px; font-weight: 700; white-space: nowrap; }
.tab.active { background: var(--ink); color: white; }
.view { display: none; padding: clamp(22px, 4vw, 40px); }
.view.active { display: block; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.section-heading h2 { margin: 7px 0 0; font-size: 25px; letter-spacing: -.04em; }
.model-chip { padding: 8px 11px; color: var(--green-deep); background: rgba(201,243,107,.34); border-radius: 999px; font-family: monospace; font-size: 11px; }
.worker-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.worker-card { border: 1px solid var(--line); border-radius: 16px; padding: 18px; background: rgba(255,255,255,.48); }
.worker-card-head { display: flex; justify-content: space-between; align-items: center; }
.worker-card h3 { margin: 0; font-size: 15px; }
.worker-card .badge { padding: 5px 8px; border-radius: 999px; background: #eceee8; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.worker-card .badge.ready { background: rgba(201,243,107,.42); color: var(--green-deep); }
.worker-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 18px 0; }
.worker-stats span { color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.worker-stats strong { display: block; margin-top: 3px; font-size: 17px; }
.worker-meta { color: var(--muted); font-size: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.worker-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 15px; }
.worker-actions small { color: var(--muted); font-size: 10px; }
.text-button { border: 0; padding: 3px; background: transparent; color: var(--green); font-size: 11px; font-weight: 800; }
.empty-card { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 150px; border: 1px dashed rgba(21,23,19,.2); border-radius: 16px; color: var(--muted); text-align: center; }
.empty-card strong { color: var(--ink); margin-bottom: 7px; }
.empty-card span { font-size: 12px; }

.member-form { margin: -4px 0 20px; padding: 18px; border-radius: 15px; background: rgba(201,243,107,.15); border: 1px solid rgba(61,122,91,.2); }
.member-form form { display: grid; grid-template-columns: 1.4fr 1fr 1fr auto; gap: 12px; align-items: end; }
label { display: grid; gap: 7px; color: var(--muted); font-size: 11px; font-weight: 700; }
input, textarea { width: 100%; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.72); color: var(--ink); padding: 11px 12px; outline: none; transition: border .15s, box-shadow .15s; }
input:focus, textarea:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(61,122,91,.1); }
textarea { resize: vertical; line-height: 1.55; }
.form-actions { display: flex; gap: 8px; }
.hidden { display: none !important; }
.member-list { display: grid; gap: 12px; }
.member-row { border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.45); overflow: hidden; }
.member-main { display: grid; grid-template-columns: 1.2fr .7fr 1.2fr auto; gap: 20px; align-items: center; padding: 17px 18px; }
.member-name strong, .member-name span { display: block; }
.member-name strong { font-size: 14px; }
.member-name span { color: var(--muted); font-size: 10px; margin-top: 4px; }
.quota strong { font-size: 13px; }
.quota small { color: var(--muted); font-size: 10px; }
.quota-bar { height: 5px; margin-top: 7px; background: #e3e5df; border-radius: 99px; overflow: hidden; }
.quota-bar i { display: block; height: 100%; background: var(--green); border-radius: inherit; }
.member-key-summary { color: var(--muted); font-size: 11px; }
.member-actions { display: flex; gap: 5px; }
.member-details { display: none; padding: 0 18px 17px; }
.member-row.open .member-details { display: block; }
.key-row { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 12px; padding: 10px 12px; background: rgba(244,243,237,.75); border-top: 1px solid var(--line); font-size: 11px; }
.key-row code { overflow: hidden; text-overflow: ellipsis; }
.key-row small { color: var(--muted); }
.revoked { opacity: .52; }

.playground-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 16px; }
.request-panel, .response-panel { min-height: 390px; padding: 19px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.46); }
.request-panel { display: grid; gap: 14px; align-content: start; }
.request-options { display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: 12px; }
.switch-label { display: flex; align-items: center; gap: 8px; padding-bottom: 11px; }
.switch-label input { display: none; }
.switch-label span { position: relative; width: 34px; height: 19px; border-radius: 99px; background: #cfd3cc; transition: background .15s; }
.switch-label span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 13px; height: 13px; border-radius: 50%; background: white; transition: transform .15s; }
.switch-label input:checked + span { background: var(--green); }
.switch-label input:checked + span::after { transform: translateX(15px); }
.response-panel { display: flex; flex-direction: column; background: #1b201b; color: #d9e1d7; }
.response-head { display: flex; justify-content: space-between; padding-bottom: 13px; border-bottom: 1px solid rgba(255,255,255,.09); color: #899588; font-size: 10px; letter-spacing: .12em; }
.response-panel pre { flex: 1; margin: 15px 0 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; line-height: 1.65; }
.usage-lookup { display: flex; align-items: center; gap: 13px; margin-top: 14px; color: var(--muted); font-size: 11px; }

.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.steps article { display: flex; gap: 14px; border: 1px solid var(--line); border-radius: 15px; padding: 18px; background: rgba(255,255,255,.43); }
.steps i { flex: 0 0 28px; display: grid; place-items: center; height: 28px; border-radius: 9px; background: var(--lime); color: var(--green-deep); font-style: normal; font-size: 10px; font-weight: 900; }
.steps strong { font-size: 13px; }
.steps p { color: var(--muted); font-size: 11px; line-height: 1.6; }
.steps code { color: var(--green-deep); font-size: 10px; overflow-wrap: anywhere; }
.code-block { margin-top: 16px; border-radius: 16px; overflow: hidden; background: #1b201b; color: #d9e1d7; }
.code-block > div { display: flex; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid rgba(255,255,255,.09); color: #899588; font-size: 10px; letter-spacing: .1em; }
.code-block pre { margin: 0; padding: 20px; overflow-x: auto; font-size: 12px; line-height: 1.65; }
footer { display: flex; justify-content: space-between; padding: 0 4px 30px; color: var(--muted); font-size: 10px; letter-spacing: .07em; }

dialog { width: min(440px, calc(100% - 32px)); border: 0; border-radius: 20px; padding: 0; color: var(--ink); background: #fbfaf5; box-shadow: 0 30px 100px rgba(20,24,20,.28); }
dialog::backdrop { background: rgba(18,22,18,.52); backdrop-filter: blur(5px); }
dialog form, .secret-dialog-body { position: relative; display: grid; gap: 15px; padding: 28px; }
dialog h2 { margin: 0; font-size: 25px; letter-spacing: -.04em; }
dialog p { margin: -5px 0 4px; color: var(--muted); font-size: 12px; }
.dialog-close { position: absolute; top: 15px; right: 15px; width: 30px; height: 30px; border: 0; border-radius: 9px; background: #eeeee8; color: var(--muted); font-size: 19px; }
.form-error { min-height: 16px; color: #b74b43; font-size: 11px; text-align: center; }
.secret-dialog-body > code { display: block; overflow-wrap: anywhere; padding: 14px; border-radius: 11px; background: #20241f; color: var(--lime); font-size: 11px; line-height: 1.5; }
.toast { position: fixed; left: 50%; bottom: 25px; transform: translate(-50%, 20px); padding: 11px 15px; border-radius: 10px; color: white; background: var(--ink); font-size: 11px; opacity: 0; pointer-events: none; transition: .2s ease; box-shadow: var(--shadow); }
.toast.show { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; padding-top: 50px; }
  .flow-card { max-width: 620px; }
  .metrics { grid-template-columns: 1fr 1fr; }
  .metrics article:nth-child(2) { border-right: 0; }
  .metrics article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .worker-grid, .steps { grid-template-columns: 1fr; }
  .member-main { grid-template-columns: 1fr 1fr; }
  .member-actions { justify-content: flex-end; }
  .playground-grid { grid-template-columns: 1fr; }
  .member-form form { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 580px) {
  .page-shell { width: min(100% - 22px, 1240px); }
  .topbar { height: 72px; }
  .status-pill { display: none; }
  .brand small { display: none; }
  .hero { padding: 38px 3px 40px; gap: 38px; }
  .hero h1 { font-size: 48px; }
  .hero-copy > p { font-size: 14px; }
  .hero-actions { flex-direction: column; }
  .endpoint-line { align-items: flex-start; flex-direction: column; }
  .endpoint-line code { max-width: 100%; overflow-wrap: anywhere; }
  .metrics article { padding: 17px; }
  .metrics strong { font-size: 24px; }
  .console { margin-top: 22px; border-radius: 17px; }
  .view { padding: 20px 15px; }
  .member-main, .member-form form, .request-options { grid-template-columns: 1fr; }
  .member-actions { justify-content: flex-start; }
  .key-row { grid-template-columns: 1fr auto; }
  .key-row small { display: none; }
  .usage-lookup { align-items: flex-start; flex-direction: column; }
  footer { flex-direction: column; gap: 8px; }
}

/* Public product site */
.landing-body { background: #f5f5ef; }
.marketing-nav { width: min(1280px, calc(100% - 48px)); height: 82px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-bottom: 1px solid var(--line); }
.marketing-nav nav { display: flex; gap: 28px; }
.marketing-nav nav a, .marketing-footer a { color: var(--muted); text-decoration: none; font-size: 12px; font-weight: 650; }
.marketing-nav nav a:hover, .marketing-footer a:hover { color: var(--ink); }
.marketing-actions { display: flex; justify-content: flex-end; gap: 8px; }
.marketing-actions a { text-decoration: none; }
.marketing-main { width: min(1280px, calc(100% - 48px)); margin: 0 auto; }
.marketing-hero { min-height: 660px; display: grid; grid-template-columns: 1.03fr .97fr; gap: clamp(36px, 7vw, 96px); align-items: center; padding: 72px 0 84px; }
.availability { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; font-style: normal; }
.availability i { width: 8px; height: 8px; border-radius: 50%; background: #51a46f; box-shadow: 0 0 0 5px rgba(81,164,111,.12); }
.availability b { color: var(--green-deep); }
.availability em { color: #b6bbb3; font-style: normal; }
.marketing-copy h1 { margin: 22px 0 27px; font-size: clamp(52px, 6.3vw, 92px); line-height: .93; letter-spacing: -.075em; font-weight: 660; }
.marketing-copy h1 span { color: var(--green); }
.marketing-copy > p { max-width: 650px; color: var(--muted); font-size: 17px; line-height: 1.75; }
.hero-proof { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 26px; color: var(--muted); font-size: 10px; }
.marketing-terminal { overflow: hidden; border-radius: 23px; background: #171b17; color: #dbe4da; box-shadow: 0 32px 90px rgba(25,31,25,.2); transform: rotate(.7deg); }
.terminal-bar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 14px 17px; border-bottom: 1px solid rgba(255,255,255,.09); color: #839082; font-size: 9px; }
.terminal-bar > span { display: flex; gap: 5px; }
.terminal-bar i { width: 7px; height: 7px; border-radius: 50%; background: #485047; }
.terminal-bar i:first-child { background: #e17956; }.terminal-bar i:nth-child(2) { background: #d5b554; }.terminal-bar i:nth-child(3) { background: #6aa477; }
.terminal-bar b { color: #aab5a8; font-weight: 500; }.terminal-bar em { justify-self: end; color: var(--lime); font-style: normal; }
.marketing-terminal pre { min-height: 330px; margin: 0; padding: 32px 28px; overflow: hidden; white-space: pre-wrap; font-size: 12px; line-height: 1.9; }
.marketing-terminal .dim { color: #97a095; }.marketing-terminal .green { color: #b9de8e; }.marketing-terminal .orange { color: #eab499; }
.terminal-result { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; margin: 0 18px 18px; padding: 15px; border: 1px solid rgba(201,243,107,.12); border-radius: 13px; background: rgba(201,243,107,.06); }
.terminal-result > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: #172016; background: var(--lime); }
.terminal-result b, .terminal-result small { display: block; }.terminal-result b { font-size: 11px; }.terminal-result small { margin-top: 3px; color: #849083; font-size: 9px; }.terminal-result strong { color: var(--lime); font-size: 11px; }
.platform-strip { display: grid; grid-template-columns: 1.4fr auto repeat(3,.55fr); align-items: center; min-height: 98px; padding: 0 25px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,252,.76); box-shadow: 0 14px 48px rgba(34,43,34,.06); }
.platform-strip > div:first-child span, .strip-stat span { display: block; color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.platform-strip code { display: block; margin-top: 6px; color: var(--green-deep); font-size: 12px; }
.strip-stat { padding-left: 25px; border-left: 1px solid var(--line); }.strip-stat strong { display: block; font-size: 24px; letter-spacing: -.04em; }.strip-stat span { margin-top: 3px; }
.marketing-section { padding: 135px 0 95px; }
.marketing-heading { max-width: 680px; }.marketing-heading h2, .model-showcase h2, .developer-section h2, .cta-section h2 { margin: 12px 0 18px; font-size: clamp(35px, 4.5vw, 56px); line-height: 1.02; letter-spacing: -.06em; }.marketing-heading p, .model-showcase p, .developer-section p, .cta-section p { color: var(--muted); line-height: 1.7; }
.feature-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 13px; margin-top: 45px; }
.feature-grid article { min-height: 260px; display: flex; flex-direction: column; padding: 23px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,252,.63); transition: transform .18s, box-shadow .18s; }.feature-grid article:hover { transform: translateY(-4px); box-shadow: 0 18px 50px rgba(34,43,34,.08); }
.feature-grid i { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; color: var(--green-deep); background: rgba(201,243,107,.45); font-style: normal; font-size: 9px; font-weight: 900; }.feature-grid h3 { margin: 29px 0 11px; font-size: 18px; letter-spacing: -.035em; }.feature-grid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }.feature-grid > article > span { margin-top: auto; color: var(--green); font-family: monospace; font-size: 9px; }
.model-showcase { display: grid; grid-template-columns: 1fr .8fr; gap: 80px; align-items: center; padding: 90px clamp(28px,6vw,75px); border-radius: 26px; color: white; background: #1a1f1a; overflow: hidden; }.model-showcase > div { max-width: 590px; }.model-showcase p { color: #96a095; }.model-showcase .button { display: inline-block; margin-top: 16px; color: white; border-color: rgba(255,255,255,.17); background: rgba(255,255,255,.05); text-decoration: none; }
.model-card { padding: 23px; border: 1px solid rgba(255,255,255,.12); border-radius: 19px; background: rgba(255,255,255,.055); box-shadow: inset 0 1px rgba(255,255,255,.05); }.model-top { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px; }.model-logo { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: var(--lime); color: #172016; font-weight: 900; }.model-top b,.model-top small { display: block; }.model-top small { margin-top: 4px; color: #849083; font-size: 10px; }.model-top em { padding: 5px 8px; border-radius: 999px; background: rgba(201,243,107,.12); color: var(--lime); font-size: 8px; font-style: normal; letter-spacing: .1em; }.model-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 28px 0; }.model-tags span { padding: 7px 9px; border-radius: 8px; color: #aeb8ac; background: rgba(255,255,255,.06); font-size: 9px; }.model-route { padding-top: 18px; border-top: 1px solid rgba(255,255,255,.09); }.model-route small { display: block; color: #768075; font-size: 8px; letter-spacing: .13em; }.model-route code { display: block; margin-top: 7px; color: #b9de8e; font-size: 10px; }
.developer-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 75px; align-items: center; padding: 130px 0; }.developer-copy ol { padding: 0; margin: 34px 0 0; list-style: none; }.developer-copy li { display: flex; gap: 13px; padding: 15px 0; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }.developer-copy li b { color: var(--green); font-size: 9px; }.developer-copy code { color: var(--ink); }.landing-code { margin: 0; }.landing-code pre { min-height: 320px; }
.cta-section { display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-bottom: 80px; padding: 55px 60px; border: 1px solid rgba(61,122,91,.18); border-radius: 24px; background: linear-gradient(110deg,rgba(201,243,107,.27),rgba(255,255,255,.7)); }.cta-section h2 { max-width: 700px; font-size: clamp(32px,4vw,50px); }.cta-section .button { flex: 0 0 auto; text-decoration: none; }
.marketing-footer { width: min(1280px,calc(100% - 48px)); min-height: 130px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; border-top: 1px solid var(--line); }.marketing-footer p { justify-self: center; color: var(--muted); font-size: 11px; }.marketing-footer nav { justify-self: end; display: flex; gap: 22px; }

/* Simplified home */
.simple-home { min-height:100vh; color:var(--ink); background:radial-gradient(circle at 78% 11%,rgba(201,243,107,.13),transparent 24rem),#f6f7f3; }
.simple-nav { width:min(1120px,calc(100% - 40px)); height:78px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.simple-nav nav,.simple-footer nav { display:flex; gap:22px; }.simple-nav nav a,.simple-footer a { color:var(--muted); text-decoration:none; font-size:11px; font-weight:700; }.simple-nav nav a:hover,.simple-footer a:hover { color:var(--ink); }
.simple-main { width:min(1120px,calc(100% - 40px)); margin:0 auto; }
.simple-hero { min-height:520px; display:grid; grid-template-columns:1fr .82fr; gap:100px; align-items:center; }
.simple-copy h1 { margin:24px 0 19px; font-size:clamp(62px,8vw,104px); line-height:.9; letter-spacing:-.075em; font-weight:690; }.simple-copy h1 span { color:var(--green); }.simple-copy > p { max-width:520px; margin:0; color:var(--muted); font-size:17px; line-height:1.7; }.simple-copy .hero-actions { margin-top:31px; }
.simple-panel { padding:30px; border:1px solid var(--line); border-radius:20px; background:rgba(255,255,252,.82); box-shadow:0 24px 70px rgba(33,42,33,.09); }.simple-panel-head { display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:9px; font-weight:800; letter-spacing:.12em; }.simple-panel-head em { padding:5px 8px; border-radius:999px; color:var(--green-deep); background:rgba(201,243,107,.38); font-style:normal; font-size:8px; }.simple-panel h2 { margin:32px 0 9px; font-size:28px; letter-spacing:-.05em; }.simple-panel > p { margin:0; color:var(--muted); font-size:11px; }.simple-panel > small { display:block; margin-top:14px; color:#929990; font-size:9px; }
.simple-command { display:grid; grid-template-columns:1fr auto; margin-top:21px; overflow:hidden; border:1px solid #313831; border-radius:10px; background:#1b201b; }.simple-command code { padding:14px; overflow:hidden; color:#c9f36b; font-size:9px; white-space:nowrap; text-overflow:ellipsis; }.simple-command button { border:0; border-left:1px solid rgba(255,255,255,.11); padding:0 14px; color:#ced5cc; background:transparent; font-size:9px; font-weight:800; }
.simple-api { min-height:92px; display:grid; grid-template-columns:1.2fr auto 1fr auto; gap:18px; align-items:center; margin-top:18px; padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.simple-api > div span,.simple-api > div code { display:block; }.simple-api > div span { color:var(--muted); font-size:8px; font-weight:800; letter-spacing:.12em; }.simple-api > div code { margin-top:6px; color:var(--green-deep); font-size:10px; }.simple-api > a { text-decoration:none; }
.simple-footer { width:min(1120px,calc(100% - 40px)); min-height:110px; margin:70px auto 0; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); color:var(--muted); font-size:10px; }

/* Model-only home */
.catalog-home { min-height:100vh; color:var(--ink); background:radial-gradient(circle at 78% 2%,rgba(201,243,107,.1),transparent 24rem),#f7f8f4; }
.catalog-nav { width:min(1180px,calc(100% - 48px)); height:84px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }.catalog-nav nav { display:flex; align-items:center; gap:19px; }.catalog-nav nav a { color:var(--muted); text-decoration:none; font-size:11px; font-weight:750; }.catalog-nav nav .button { color:white; }
.catalog-main { width:min(1180px,calc(100% - 48px)); min-height:calc(100vh - 190px); margin:0 auto; padding:92px 0 70px; }.catalog-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; padding-bottom:42px; }.catalog-heading > div > span { color:var(--green); font-size:9px; font-weight:850; letter-spacing:.18em; }.catalog-heading h1 { margin:12px 0 0; font-size:clamp(52px,7vw,88px); line-height:.92; letter-spacing:-.07em; font-weight:680; }.catalog-health { display:flex; align-items:center; gap:9px; padding:8px 11px; border:1px solid rgba(79,155,104,.18); border-radius:999px; color:var(--green-deep); background:rgba(201,243,107,.16); font-size:9px; font-style:normal; }.catalog-health i { width:7px; height:7px; border-radius:50%; background:#50a46e; box-shadow:0 0 0 5px rgba(80,164,110,.1); }.catalog-health.off { color:#96675d; background:rgba(190,99,77,.08); }.catalog-health.off i { background:#bd665c; }
.catalog-list { border-top:1px solid var(--ink); }.catalog-list article { min-height:112px; display:grid; grid-template-columns:auto 1fr auto auto; gap:20px; align-items:center; border-bottom:1px solid var(--line); transition:padding .18s,background .18s; }.catalog-list article:hover { padding:0 16px; background:rgba(255,255,252,.7); }.catalog-logo { display:grid; place-items:center; width:45px; height:45px; border-radius:13px; color:var(--green-deep); background:var(--lime); font-size:12px; font-weight:900; }.catalog-list strong,.catalog-list small { display:block; }.catalog-list strong { font-size:15px; letter-spacing:-.02em; }.catalog-list small { margin-top:6px; color:var(--muted); font-size:9px; }.catalog-list article > em { display:flex; align-items:center; gap:7px; color:var(--green-deep); font-size:8px; font-style:normal; font-weight:850; text-transform:uppercase; }.catalog-list article > em i { width:6px; height:6px; border-radius:50%; background:#50a46e; }.catalog-list article > a { padding:9px 12px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:rgba(255,255,252,.7); text-decoration:none; font-size:9px; font-weight:800; }.catalog-empty { min-height:180px; display:grid; place-items:center; border-bottom:1px solid var(--line); color:var(--muted); font-size:10px; }
.catalog-footer { width:min(1180px,calc(100% - 48px)); min-height:106px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--line); color:var(--muted); font-size:10px; }.catalog-footer nav { display:flex; gap:20px; }.catalog-footer a { color:var(--muted); text-decoration:none; }

/* User center */
.account-body { background: #eef0eb; }
.auth-gate { min-height: 100vh; padding: 28px; background: radial-gradient(circle at 15% 15%,rgba(201,243,107,.25),transparent 28rem),#eef0eb; }.auth-brand { width: min(1120px,100%); margin: 0 auto 34px; }.auth-card { width: min(1000px,100%); min-height: 570px; margin: 0 auto; display: grid; grid-template-columns: 1fr 440px; overflow: hidden; border: 1px solid var(--line); border-radius: 25px; background: rgba(255,255,252,.8); box-shadow: var(--shadow); }.auth-intro { padding: 70px 60px; color: white; background: #1b201b; }.auth-intro h1 { margin: 18px 0 22px; font-size: 57px; line-height: .96; letter-spacing: -.065em; }.auth-intro h1 span { color: var(--lime); }.auth-intro p { color: #97a195; line-height: 1.7; }.auth-points { display: grid; gap: 12px; margin-top: 50px; color: #b2bbb0; font-size: 11px; }.auth-forms { align-self: center; display: grid; gap: 20px; padding: 48px; }.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border-radius: 10px; background: #eceee8; }.auth-tabs button { border: 0; border-radius: 8px; padding: 10px; color: var(--muted); background: transparent; font-size: 11px; font-weight: 800; }.auth-tabs button.active { color: white; background: var(--ink); }.auth-forms form { display: grid; gap: 15px; }
.quick-auth-option { display:grid; gap:10px; text-align:center; }.quick-auth-option > span { display:flex; align-items:center; gap:10px; color:var(--muted); font-size:9px; }.quick-auth-option > span::before,.quick-auth-option > span::after { content:""; height:1px; flex:1; background:var(--line); }.quick-auth-option small { color:var(--muted); font-size:8px; line-height:1.5; }
.account-shell { min-height: 100vh; display: grid; grid-template-columns: 236px 1fr; }.account-sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 25px 18px; border-right: 1px solid var(--line); background: #f7f7f2; }.account-sidebar .brand { padding: 0 7px 28px; }.account-sidebar nav { display: grid; gap: 4px; margin-top: 12px; }.account-sidebar nav button { display: flex; align-items: center; gap: 12px; width: 100%; border: 0; border-radius: 10px; padding: 11px 12px; color: var(--muted); background: transparent; text-align: left; font-size: 12px; font-weight: 700; }.account-sidebar nav button i { width: 20px; color: #8d958b; font-style: normal; text-align: center; }.account-sidebar nav button:hover { background: #eceee8; }.account-sidebar nav button.active { color: white; background: var(--ink); }.account-sidebar nav button.active i { color: var(--lime); }.sidebar-bottom { display: grid; gap: 11px; margin-top: auto; padding: 15px 11px 3px; border-top: 1px solid var(--line); }.sidebar-bottom a { color: var(--muted); text-decoration: none; font-size: 10px; }.online-dot { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: #50a46e; }
.account-main { min-width: 0; padding: 0 clamp(22px,4vw,58px) 60px; }.account-topbar { min-height: 104px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }.account-topbar > div:first-of-type span { color: var(--green); font-size: 9px; font-weight: 800; letter-spacing: .15em; }.account-topbar h1 { margin: 5px 0 0; font-size: 24px; letter-spacing: -.04em; }.user-menu { display: flex; align-items: center; gap: 10px; }.user-avatar { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 11px; color: var(--green-deep); background: var(--lime); font-size: 12px; font-weight: 900; }.user-menu strong,.user-menu small { display: block; }.user-menu strong { font-size: 11px; }.user-menu small { margin-top: 2px; color: var(--muted); font-size: 9px; }.user-menu .text-button { margin-left: 8px; }.mobile-menu { display: none; }
.account-view { display: none; padding-top: 32px; }.account-view.active { display: block; }.account-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }.account-metrics article { padding: 20px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,252,.78); }.account-metrics span,.account-metrics small,.account-metrics strong { display: block; }.account-metrics span { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .1em; }.account-metrics strong { margin: 10px 0 4px; font-size: 28px; letter-spacing: -.05em; }.account-metrics small { color: #929990; font-size: 9px; }
.overview-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 14px; margin-top: 14px; }.quick-card,.usage-chart-card,.recent-card,.data-card { border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,252,.78); }.quick-card { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; padding: 26px; }.quick-card h2,.usage-chart-card h2,.recent-card h2 { margin: 7px 0 8px; font-size: 18px; letter-spacing: -.035em; }.quick-card p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }.quick-values { display: grid; gap: 10px; }.quick-values label > div { display: grid; grid-template-columns: 1fr auto; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #f2f3ee; }.quick-values code { padding: 10px; overflow: hidden; text-overflow: ellipsis; font-size: 9px; }.quick-values button { border: 0; border-left: 1px solid var(--line); color: var(--green); background: transparent; font-size: 9px; font-weight: 800; }.quick-card > .button { grid-column: 1 / -1; justify-self: start; }.usage-chart-card { padding: 25px; }.card-title { display: flex; justify-content: space-between; align-items: flex-start; }.card-title > strong { color: var(--green); font-size: 25px; }.donut-wrap { display: flex; align-items: center; gap: 26px; margin-top: 22px; }.donut { position: relative; width: 120px; height: 120px; display: grid; place-items: center; align-content: center; border-radius: 50%; background: conic-gradient(var(--green) 0 0%,#e3e5df 0 100%); }.donut::after { content:""; position:absolute; inset:13px; border-radius:50%; background:#fbfbf7; }.donut span,.donut small { position: relative; z-index: 1; }.donut span { font-size: 17px; font-weight: 850; }.donut small { color: var(--muted); font-size: 8px; }.donut-legend { display: grid; gap: 12px; color: var(--muted); font-size: 9px; }.donut-legend span { display: grid; grid-template-columns: auto 1fr; gap: 8px; }.donut-legend i { width: 8px; height: 8px; border-radius: 50%; background: #d9ddd5; }.donut-legend i.used { background: var(--green); }.donut-legend b { grid-column: 2; color: var(--ink); }.recent-card { margin-top: 14px; padding: 24px; }.mini-table { margin-top: 15px; }.mini-table > div { display: grid; grid-template-columns: 1fr auto 80px; gap: 15px; align-items: center; padding: 12px 0; border-top: 1px solid var(--line); }.mini-table > div > span { display: grid; grid-template-columns: auto 1fr; gap: 0 10px; align-items:center; }.mini-table b { font-size: 10px; }.mini-table small { grid-column:2; color:var(--muted); font-size:8px; }.mini-table > div > strong { font-size:10px; }.request-icon { grid-row:1/3; display:grid; place-items:center; width:28px; height:28px; border-radius:8px; color:var(--green); background:rgba(61,122,91,.09); font-style:normal; }
.overview-lower-grid { display:grid; grid-template-columns:1.35fr .65fr; gap:14px; margin-top:14px; }.trend-card,.service-card { padding:24px; border:1px solid var(--line); border-radius:17px; background:rgba(255,255,252,.78); }.trend-card h2,.service-card h2 { margin:7px 0 8px; font-size:18px; letter-spacing:-.035em; }.usage-trend { height:170px; display:grid; grid-template-columns:repeat(7,1fr); gap:12px; align-items:end; margin-top:18px; padding-top:12px; border-bottom:1px solid var(--line); background:repeating-linear-gradient(to bottom,transparent 0,transparent 41px,rgba(34,43,34,.055) 42px); }.usage-trend > div { height:100%; display:grid; grid-template-rows:1fr 16px 15px; gap:4px; align-items:end; text-align:center; }.usage-trend > div > span { width:min(34px,70%); height:100%; justify-self:center; display:flex; align-items:flex-end; }.usage-trend i { display:block; width:100%; min-height:4px; border-radius:7px 7px 2px 2px; background:linear-gradient(180deg,var(--lime),var(--green)); box-shadow:0 5px 13px rgba(61,122,91,.12); }.usage-trend b { color:var(--muted); font-size:8px; }.usage-trend small { color:var(--ink); font-size:8px; }.health-badge { display:inline-flex; align-items:center; gap:6px; padding:6px 9px; border-radius:999px; color:#8b685d; background:rgba(192,97,74,.1); font-size:8px; font-weight:800; }.health-badge i { width:6px; height:6px; border-radius:50%; background:#bf664f; }.health-badge.ready { color:var(--green-deep); background:rgba(201,243,107,.3); }.health-badge.ready i { background:#4f9b68; }.service-lines { display:grid; gap:0; margin-top:14px; }.service-lines > div { display:flex; align-items:center; justify-content:space-between; padding:12px 0; border-top:1px solid var(--line); color:var(--muted); font-size:9px; }.service-lines strong { color:var(--ink); font-size:10px; }.service-card > p { margin:14px 0 0; color:var(--muted); font-size:9px; line-height:1.6; }
.cycle-pill { padding:7px 10px; border:1px solid var(--line); border-radius:999px; color:var(--muted); background:rgba(255,255,252,.7); font-size:9px; }.credit-hero { min-height:230px; display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; padding:35px 40px; border-radius:20px; color:white; background:radial-gradient(circle at 15% 0,rgba(201,243,107,.17),transparent 17rem),#1b201b; box-shadow:0 22px 60px rgba(25,31,25,.12); }.credit-hero > div:first-child > span { color:#8e9a8d; font-size:9px; font-weight:850; letter-spacing:.14em; }.credit-hero strong { display:flex; align-items:baseline; gap:10px; margin:15px 0 10px; }.credit-hero strong small { color:var(--lime); font-size:23px; }.credit-hero strong b { font-size:50px; letter-spacing:-.06em; }.credit-hero p { margin:0; color:#939e92; font-size:10px; }.credit-progress-wrap > div:first-child,.credit-scale { display:flex; justify-content:space-between; color:#8e9a8d; font-size:9px; }.credit-progress-wrap > div:first-child b { color:var(--lime); font-size:13px; }.credit-progress { height:9px; margin:14px 0 11px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.09); }.credit-progress i { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--green),var(--lime)); transition:width .3s; }.credit-scale b { color:#cbd2ca; }.credit-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; margin-top:14px; }.credit-grid article { min-height:190px; display:flex; flex-direction:column; padding:22px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,252,.76); }.credit-grid article > i { display:grid; place-items:center; width:28px; height:28px; border-radius:8px; color:var(--green-deep); background:rgba(201,243,107,.42); font-size:8px; font-style:normal; font-weight:900; }.credit-grid h3 { margin:19px 0 8px; font-size:15px; }.credit-grid p { margin:0; color:var(--muted); font-size:10px; line-height:1.65; }.credit-grid button,.credit-grid article > span { align-self:flex-start; margin-top:auto; color:var(--green); font-size:9px; }.credit-notice { margin-top:14px; }
.panel-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 22px; }.panel-heading h2 { margin: 0 0 7px; font-size: 24px; letter-spacing: -.04em; }.panel-heading p { margin:0; color:var(--muted); font-size:11px; }.notice-card { display:flex; align-items:center; gap:12px; margin-bottom:14px; padding:13px 15px; border:1px solid rgba(61,122,91,.18); border-radius:12px; background:rgba(201,243,107,.13); }.notice-card i { display:grid; place-items:center; width:22px; height:22px; border-radius:7px; background:var(--lime); color:var(--green-deep); font-style:normal; font-size:10px; font-weight:900; }.notice-card p { margin:0; color:var(--muted); font-size:10px; }.data-card { overflow:hidden; }.key-table-head,.account-key-row { display:grid; grid-template-columns:1.35fr .9fr .8fr .6fr 50px; gap:15px; align-items:center; padding:13px 18px; }.key-table-head,.usage-table-head { color:var(--muted); background:#f0f1ec; font-size:8px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.account-key-row { min-height:72px; border-top:1px solid var(--line); }.account-key-row > div:first-child strong,.account-key-row > div:first-child code,.account-key-row > div:nth-child(2) strong,.account-key-row > div:nth-child(2) small { display:block; }.account-key-row strong { font-size:10px; }.account-key-row code,.account-key-row small,.account-key-row span { margin-top:4px; color:var(--muted); font-size:9px; }.account-key-row.disabled { opacity:.5; }.table-status { display:inline-flex !important; align-items:center; gap:6px; width:max-content; padding:5px 7px; border-radius:999px; color:var(--muted) !important; background:#eceee8; font-size:8px !important; font-style:normal; }.table-status i { width:5px; height:5px; border-radius:50%; background:#9da49a; }.table-status.ready { color:var(--green-deep)!important; background:rgba(201,243,107,.28); }.table-status.ready i { background:#4d9567; }.table-status.pending i { background:#c5a448; }.table-status.off i { background:#bd665c; }.account-empty { min-height:170px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--muted); font-size:10px; }.account-empty strong { margin-bottom:6px; color:var(--ink); }.account-empty.compact { min-height:80px; }
.usage-summary-row { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }.usage-summary-row > div { padding:17px; border:1px solid var(--line); border-radius:13px; background:rgba(255,255,252,.72); }.usage-summary-row span,.usage-summary-row strong { display:block; }.usage-summary-row span { color:var(--muted); font-size:8px; letter-spacing:.1em; }.usage-summary-row strong { margin-top:7px; font-size:19px; }.usage-table-head,.usage-account-row { display:grid; grid-template-columns:1fr 1.25fr .5fr .5fr .5fr .7fr; gap:12px; align-items:center; padding:13px 17px; }.usage-account-row { min-height:62px; border-top:1px solid var(--line); color:var(--muted); font-size:9px; }.usage-account-row > span:nth-child(2) strong,.usage-account-row > span:nth-child(2) small { display:block; }.usage-account-row > span:nth-child(2) strong { color:var(--ink); }.usage-account-row > span:nth-child(2) small { margin-top:3px; }.usage-account-row > strong { color:var(--ink); }
.docs-layout { display:grid; grid-template-columns:190px 1fr; min-height:560px; border:1px solid var(--line); border-radius:17px; background:rgba(255,255,252,.75); overflow:hidden; }.docs-layout > nav { display:grid; align-content:start; gap:4px; padding:18px 12px; border-right:1px solid var(--line); background:#f0f1ec; }.docs-layout > nav button { border:0; border-radius:8px; padding:10px; color:var(--muted); background:transparent; text-align:left; font-size:10px; }.docs-layout > nav button.active { color:white; background:var(--ink); }.docs-layout > article { padding:35px; }.docs-layout > article h2 { margin:8px 0 12px; font-size:28px; }.docs-layout > article p { color:var(--muted); font-size:11px; }.docs-layout .code-block { margin-top:25px; }
select { width:100%; border:1px solid var(--line); border-radius:10px; padding:11px 12px; color:var(--ink); background:rgba(255,255,255,.72); }
.quick-values select { min-width:0; padding:10px; border:0; border-radius:0; background:transparent; font-family:monospace; font-size:9px; }

/* Premium relay landing */
.relay-home { min-height:100vh; color:var(--ink); background:#f5f5f0; }
.relay-home::before { content:""; position:fixed; inset:0; pointer-events:none; background:radial-gradient(circle at 78% 12%,rgba(190,239,104,.2),transparent 28%),linear-gradient(rgba(18,27,22,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(18,27,22,.025) 1px,transparent 1px); background-size:auto,48px 48px,48px 48px; }
.relay-nav,.relay-main,.relay-footer { position:relative; width:min(1180px,calc(100% - 48px)); margin:auto; }
.relay-nav { min-height:82px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(18,27,22,.13); }
.relay-nav nav,.relay-footer nav { display:flex; align-items:center; gap:24px; }.relay-nav nav a,.relay-footer a { color:var(--muted); font-size:10px; font-weight:750; text-decoration:none; }.relay-nav nav a:hover,.relay-footer a:hover { color:var(--ink); }
.relay-hero { min-height:570px; display:grid; grid-template-columns:1.14fr .86fr; gap:88px; align-items:center; padding:80px 0 90px; }
.relay-hero-copy h1 { max-width:760px; margin:17px 0 24px; font-size:68px; line-height:.99; letter-spacing:-.065em; }.relay-hero-copy h1 span { color:var(--green); }.relay-hero-copy > p { max-width:580px; margin:0; color:var(--muted); font-size:15px; line-height:1.8; }.relay-hero-copy .hero-actions { margin-top:34px; }
.relay-endpoint-card { padding:18px; border:1px solid rgba(18,27,22,.16); border-radius:22px; background:rgba(255,255,252,.86); box-shadow:0 30px 80px rgba(20,37,28,.12); transform:rotate(1.2deg); }.relay-card-top { display:flex; justify-content:space-between; padding:5px 4px 16px; color:var(--muted); font-size:9px; font-weight:850; letter-spacing:.12em; }.endpoint-preview { padding:18px; border-radius:14px; color:#e8f2e9; background:#13241b; }.endpoint-preview small,.endpoint-preview code { display:block; }.endpoint-preview small { margin-bottom:10px; color:#80ae93; font-size:8px; letter-spacing:.14em; }.endpoint-preview code { overflow:hidden; color:#c8f36b; font-size:11px; text-overflow:ellipsis; }.request-preview { display:grid; grid-template-columns:auto 1fr; gap:13px; margin-top:10px; padding:14px 15px; border:1px solid var(--line); border-radius:12px; background:#fafaf6; }.request-preview span { color:var(--green); font-size:8px; font-weight:900; }.request-preview code { font-size:10px; }.relay-endpoint-card footer { display:flex; justify-content:space-between; padding:17px 5px 3px; color:var(--muted); font-size:8px; }
.pricing-section { padding:86px 0; border-top:1px solid rgba(18,27,22,.13); }.pricing-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:40px; }.pricing-heading h2 { margin:8px 0 7px; font-size:42px; letter-spacing:-.05em; }.pricing-heading p { margin:0; color:var(--muted); font-size:11px; }.pricing-meta { padding:10px 13px; border:1px solid var(--line); border-radius:999px; color:var(--green-deep); background:rgba(201,243,107,.22); font-size:9px; font-weight:800; }
.pricing-table-head,.pricing-list article { display:grid; grid-template-columns:minmax(270px,1fr) 150px 150px 115px 60px; gap:20px; align-items:center; }.pricing-table-head { padding:0 16px 13px; color:var(--muted); font-size:8px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; }.pricing-list { border-top:1px solid var(--ink); }.pricing-list article { min-height:108px; padding:0 16px; border-bottom:1px solid var(--line); transition:background .18s,transform .18s; }.pricing-list article:hover { background:rgba(255,255,252,.76); transform:translateX(4px); }.model-identity { display:flex; align-items:center; gap:17px; min-width:0; }.model-identity strong,.model-identity small { display:block; }.model-identity strong { font-size:14px; }.model-identity small { margin-top:6px; color:var(--muted); font-size:8px; }.pricing-list article > strong { font-size:13px; font-variant-numeric:tabular-nums; }.pricing-list article > em { display:flex; align-items:center; gap:7px; color:var(--green-deep); font-size:8px; font-style:normal; font-weight:850; }.pricing-list article > em i { width:6px; height:6px; border-radius:50%; background:#50a46e; }.pricing-list article > a { padding:9px 11px; border:1px solid var(--line); border-radius:9px; color:var(--ink); background:white; text-align:center; text-decoration:none; font-size:8px; font-weight:850; }
.credits-section { display:grid; grid-template-columns:1fr 1.35fr; gap:70px; align-items:start; margin:35px 0 110px; padding:58px; border-radius:26px; color:#f7faf6; background:#13241b; box-shadow:0 28px 80px rgba(20,37,28,.13); }.credits-section h2 { margin:12px 0 30px; font-size:38px; line-height:1.12; letter-spacing:-.05em; }.credits-section .eyebrow { color:#9fcca9; }.credit-feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }.credit-feature-grid article { min-height:165px; padding:20px; border:1px solid rgba(255,255,255,.12); border-radius:15px; background:rgba(255,255,255,.04); }.credit-feature-grid b,.credit-feature-grid strong,.credit-feature-grid p { display:block; }.credit-feature-grid b { color:#c8f36b; font-size:9px; }.credit-feature-grid strong { margin-top:30px; font-size:12px; }.credit-feature-grid p { margin:9px 0 0; color:#9dafA4; font-size:9px; line-height:1.65; }.credits-section > .button { grid-column:1; justify-self:start; }
.relay-footer { min-height:105px; display:flex; justify-content:space-between; align-items:center; border-top:1px solid rgba(18,27,22,.13); color:var(--muted); font-size:9px; }

/* Wallet and billing */
.wallet-metric { color:#f7faf6!important; background:#163526!important; }.wallet-metric > span,.wallet-metric > small { color:#a9c3b2!important; }.wallet-metric > strong { display:flex; align-items:baseline; gap:4px; color:#c8f36b!important; }.wallet-metric > strong small { font-size:13px; }
.wallet-hero { display:grid; grid-template-columns:1fr auto; gap:40px; align-items:center; margin-bottom:18px; padding:34px 38px; border-radius:21px; color:#f7faf6; background:linear-gradient(135deg,#13241b,#24543b); box-shadow:0 24px 65px rgba(20,49,34,.17); }.wallet-hero > div:first-child > span { color:#9fc5aa; font-size:8px; font-weight:850; letter-spacing:.12em; }.wallet-hero strong { display:flex; align-items:baseline; gap:7px; margin:15px 0 9px; color:#c8f36b; }.wallet-hero strong small { font-size:20px; }.wallet-hero strong b { font-size:48px; letter-spacing:-.05em; }.wallet-hero p { margin:0; color:#a9c3b2; font-size:9px; }.wallet-side { min-width:210px; padding:20px 22px; border:1px solid rgba(255,255,255,.14); border-radius:14px; background:rgba(255,255,255,.05); }.wallet-side span,.wallet-side strong,.wallet-side small { display:block; }.wallet-side span,.wallet-side small { color:#a9c3b2; font-size:8px; }.wallet-side strong { margin:11px 0 7px; color:white; font-size:18px; }
.recharge-packages { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px; }.recharge-packages button { position:relative; min-height:120px; padding:18px; border:1px solid var(--line); border-radius:15px; color:var(--ink); background:rgba(255,255,252,.82); text-align:left; transition:transform .16s,border-color .16s,box-shadow .16s; }.recharge-packages button:hover { transform:translateY(-3px); border-color:var(--green); box-shadow:0 12px 30px rgba(28,65,43,.09); }.recharge-packages button.featured { border-color:#87b44b; background:linear-gradient(145deg,#f9ffeb,#f2f8e9); }.recharge-packages span,.recharge-packages strong,.recharge-packages small { display:block; }.recharge-packages span { color:var(--green); font-size:8px; font-weight:850; letter-spacing:.08em; }.recharge-packages strong { margin:15px 0 6px; font-size:25px; }.recharge-packages small { color:var(--muted); font-size:8px; }
.invite-heading { margin-top: 34px; }
.invite-form { display:grid; grid-template-columns:1.5fr .7fr 1fr auto; gap:12px; align-items:end; margin-bottom:14px; }
.invite-form label { display:grid; gap:7px; color:var(--muted); font-size:10px; }
.invite-form input { min-height:40px; }
.invite-form button { min-height:40px; }
#inviteList > div { grid-template-columns:1fr auto auto auto; }
#inviteList > div > em { grid-column:auto; }
@media (max-width:650px) {
  .invite-form { grid-template-columns:1fr; }
  #inviteList > div { grid-template-columns:1fr auto; }
  #inviteList > div > em { grid-column:2; }
}
.wallet-ledger-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.wallet-card { padding:23px; }.wallet-card h2 { margin:6px 0 0; font-size:17px; }.wallet-list { margin-top:14px; }.wallet-list > div { display:grid; grid-template-columns:1fr auto; gap:7px 14px; align-items:center; padding:13px 0; border-top:1px solid var(--line); }.wallet-list > div > span strong,.wallet-list > div > span small { display:block; }.wallet-list > div > span strong { max-width:260px; overflow:hidden; font-family:monospace; font-size:9px; text-overflow:ellipsis; }.wallet-list > div > span small { margin-top:5px; color:var(--muted); font-size:8px; }.wallet-list > div > b { font-size:10px; }.wallet-list > div > em { grid-column:2; color:var(--muted); font-size:8px; font-style:normal; }.wallet-positive { color:var(--green); }.wallet-negative { color:#a75555; }.checkout-summary { display:flex; justify-content:space-between; align-items:center; padding:14px; border-radius:10px; color:var(--green-deep); background:rgba(201,243,107,.2); font-size:10px; }.checkout-summary strong { font-size:17px; }

.admin-order-card { margin-top:15px; overflow:hidden; }.admin-order-head,.admin-order-row { display:grid; grid-template-columns:minmax(260px,1fr) 120px 110px 100px 100px; gap:14px; align-items:center; }.admin-order-head { padding:13px 18px; border-bottom:1px solid var(--line); color:var(--muted); font-size:8px; font-weight:850; text-transform:uppercase; }.admin-order-row { padding:15px 18px; border-bottom:1px solid var(--line); }.admin-order-row:last-child { border-bottom:0; }.admin-order-row > span:first-child strong,.admin-order-row > span:first-child small { display:block; }.admin-order-row > span:first-child strong { overflow:hidden; font-family:monospace; font-size:9px; text-overflow:ellipsis; }.admin-order-row > span:first-child small { margin-top:5px; color:var(--muted); font-size:8px; }.admin-order-row > strong { font-size:10px; }

@media (max-width: 980px) {
  .simple-hero { grid-template-columns:1fr; gap:40px; padding:75px 0; }.simple-copy h1 { font-size:82px; }.simple-panel { max-width:650px; }.simple-api { grid-template-columns:1fr auto; }
  .marketing-nav { grid-template-columns:1fr auto; }.marketing-nav nav { display:none; }.marketing-hero,.model-showcase,.developer-section { grid-template-columns:1fr; }.marketing-terminal { max-width:700px; transform:none; }.platform-strip { grid-template-columns:1fr auto repeat(2,.5fr); }.platform-strip .strip-stat:last-child { display:none; }.feature-grid { grid-template-columns:1fr 1fr; }.developer-section { gap:35px; }.auth-card { grid-template-columns:1fr; }.auth-intro { display:none; }.auth-forms { min-height:500px; }.account-shell { grid-template-columns:82px 1fr; }.account-sidebar .brand > span:last-child,.account-sidebar nav button:not(.active) { font-size:0; }.account-sidebar nav button { justify-content:center; }.account-sidebar nav button i { font-size:14px; }.account-sidebar nav button.active { font-size:0; }.sidebar-bottom { display:none; }.account-metrics { grid-template-columns:1fr 1fr; }.overview-grid,.overview-lower-grid { grid-template-columns:1fr; }.credit-hero { gap:30px; }.credit-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 650px) {
  .catalog-nav,.catalog-main,.catalog-footer { width:calc(100% - 28px); }.catalog-main { padding:65px 0 45px; }.catalog-heading { align-items:flex-start; flex-direction:column; padding-bottom:34px; }.catalog-heading h1 { font-size:58px; }.catalog-list article { grid-template-columns:auto 1fr auto; min-height:96px; gap:13px; }.catalog-list article > em { display:none; }.catalog-list article:hover { padding:0; }.catalog-footer { min-height:90px; }
  .simple-nav,.simple-main,.simple-footer { width:calc(100% - 24px); }.simple-nav nav a:first-child { display:none; }.simple-hero { min-height:0; padding:62px 0 45px; }.simple-copy h1 { font-size:64px; }.simple-copy > p { font-size:14px; }.simple-copy .hero-actions { display:grid; }.simple-panel { padding:23px 18px; }.simple-api { grid-template-columns:1fr auto; gap:13px; }.simple-api > div:nth-of-type(2),.simple-api > a { display:none; }.simple-footer { align-items:flex-start; flex-direction:column; gap:16px; padding:25px 0; }.simple-footer nav { flex-wrap:wrap; }
  .marketing-nav,.marketing-main,.marketing-footer { width:calc(100% - 24px); }.marketing-actions .ghost { display:none; }.marketing-hero { min-height:0; padding:50px 0; }.marketing-copy h1 { font-size:54px; }.marketing-copy > p { font-size:14px; }.platform-strip { grid-template-columns:1fr auto; padding:18px; }.strip-stat { display:none; }.marketing-section { padding:90px 0 60px; }.feature-grid { grid-template-columns:1fr; }.model-showcase { padding:55px 24px; gap:35px; }.developer-section { padding:85px 0; }.cta-section { align-items:flex-start; flex-direction:column; padding:35px 25px; }.marketing-footer { grid-template-columns:1fr; gap:18px; padding:28px 0; }.marketing-footer p,.marketing-footer nav { justify-self:start; }.auth-gate { padding:15px; }.auth-card { min-height:520px; }.auth-forms { padding:28px 20px; }.account-shell { display:block; }.account-sidebar { position:fixed; z-index:20; width:236px; transform:translateX(-105%); transition:transform .2s; box-shadow:var(--shadow); overflow-y:auto; }.sidebar-open .account-sidebar { transform:none; }.account-sidebar .brand > span:last-child { display:block; }.account-sidebar nav button,.account-sidebar nav button.active { justify-content:flex-start; font-size:12px; }.sidebar-bottom { display:grid; }.account-main { padding:0 14px 40px; }.mobile-menu { display:block; border:0; border-radius:9px; padding:8px 10px; background:var(--ink); color:white; }.account-topbar { gap:12px; }.account-topbar > div:first-of-type { margin-right:auto; }.user-menu > div { display:none; }.account-metrics,.usage-summary-row { grid-template-columns:1fr 1fr; }.quick-card { grid-template-columns:1fr; }.quick-card > .button { grid-column:1; }.donut-wrap { justify-content:center; }.panel-heading { align-items:flex-start; flex-direction:column; }.key-table-head { display:none; }.account-key-row { grid-template-columns:1fr 1fr auto; }.account-key-row > div:nth-child(3),.account-key-row > div:nth-child(4) { display:none; }.usage-table-head { display:none; }.usage-account-row { grid-template-columns:1fr 1fr auto; }.usage-account-row > span:nth-child(3),.usage-account-row > span:nth-child(4),.usage-account-row > span:nth-child(6) { display:none!important; }.docs-layout { grid-template-columns:1fr; }.docs-layout > nav { display:flex; overflow-x:auto; border-right:0; border-bottom:1px solid var(--line); }.docs-layout > article { padding:23px 15px; }.mini-table > div { grid-template-columns:1fr auto; }.mini-table em { display:none!important; }.credit-hero { grid-template-columns:1fr; gap:32px; padding:30px 24px; }.credit-grid { grid-template-columns:1fr; }.usage-trend { gap:5px; }
}

/* Minimal Premium AI Infrastructure — visual system */
:root {
  color-scheme: dark;
  --ink: #f2f2f4;
  --muted: #8c8c96;
  --paper: #09090b;
  --card: #101013;
  --card-raised: #141418;
  --line: rgba(255,255,255,.085);
  --line-strong: rgba(255,255,255,.15);
  --green: #79a7ff;
  --green-deep: #4f86ee;
  --lime: #79a7ff;
  --orange: #d69b65;
  --success: #61c887;
  --warning: #d8ad5c;
  --danger: #d66d73;
  --shadow: 0 18px 60px rgba(0,0,0,.28);
  --ease: cubic-bezier(.2,.8,.2,1);
}

* { scrollbar-color: #2a2a31 transparent; }
html { background: var(--paper); }
body,
.account-body,
.relay-home {
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
::selection { color: #fff; background: rgba(79,134,238,.5); }
a, button, input, textarea, select { -webkit-tap-highlight-color: transparent; }
code, pre, .account-metrics strong, .metrics strong, .wallet-hero strong, .usage-summary-row strong {
  font-family: "SFMono-Regular", "Cascadia Code", Consolas, monospace;
  font-variant-numeric: tabular-nums;
}

/* Shared primitives */
.brand { gap: 11px; }
.brand-mark {
  width: 34px;
  height: 34px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  color: #dce8ff;
  background: #111216;
  box-shadow: inset 0 1px rgba(255,255,255,.05);
  font-size: 10px;
  letter-spacing: .1em;
}
.brand strong { color: #ededf0; font-size: 14px; font-weight: 650; }
.brand small { margin-top: 1px; color: #62626b; font-size: 9px; letter-spacing: .13em; }
.eyebrow { color: var(--green); font-size: 10px; font-weight: 650; letter-spacing: .16em; }
.button {
  min-height: 36px;
  padding: 9px 14px;
  border-radius: 7px;
  font-size: 12px;
  font-weight: 620;
  transition: transform .16s var(--ease), background-color .16s var(--ease), border-color .16s var(--ease), color .16s var(--ease), filter .16s var(--ease);
}
.button:hover { transform: translateY(-1px); filter: brightness(1.06); }
.button:active { transform: translateY(0) scale(.98); }
.button.primary { color: #fff; background: #477fe9; box-shadow: none; }
.button.primary:hover { background: #5289f0; }
.button.secondary,
.button.ghost { color: #d5d5da; border-color: var(--line-strong); background: transparent; }
.button.secondary:hover,
.button.ghost:hover { border-color: rgba(255,255,255,.24); background: rgba(255,255,255,.035); }
.button.compact { min-height: 32px; padding: 7px 11px; border-radius: 6px; }
.text-button { color: #8cb4ff; font-size: 11px; font-weight: 580; opacity: .72; transition: color .16s var(--ease), opacity .16s var(--ease); }
.text-button:hover { color: #b2ccff; opacity: 1; }
label { gap: 7px; color: #9696a0; font-size: 11px; font-weight: 550; }
input, textarea, select {
  border-color: var(--line-strong);
  border-radius: 7px;
  color: #ededf0;
  background: #0d0d10;
  box-shadow: inset 0 1px rgba(255,255,255,.015);
  transition: border-color .16s var(--ease), background-color .16s var(--ease);
}
input::placeholder, textarea::placeholder { color: #53535c; }
input:hover, textarea:hover, select:hover { border-color: rgba(255,255,255,.22); }
input:focus, textarea:focus, select:focus { border-color: #628fdf; background: #101014; box-shadow: none; outline: none; }
select { color-scheme: dark; }
.model-chip,
.cycle-pill,
.table-status,
.health-badge,
.worker-card .badge,
.status-pill {
  border: 1px solid var(--line);
  border-radius: 5px;
  color: #aaaab3;
  background: rgba(255,255,255,.025);
}
.model-chip { padding: 7px 10px; color: #abc5f8; }
.status-pill { padding: 7px 10px; }
.status-pill i, .health-badge i, .table-status i { box-shadow: none; }
.status-pill.ready i, .health-badge.ready i, .table-status.ready i { background: var(--success); }
.status-pill.ready, .health-badge.ready, .table-status.ready { color: #8fd8aa !important; background: rgba(97,200,135,.06); }
.table-status.pending { color: #d6b46f !important; }
.table-status.pending i { background: var(--warning); }
.table-status.off { color: #d9878c !important; }
.table-status.off i { background: var(--danger); }
.notice-card {
  gap: 11px;
  padding: 12px 14px;
  border-color: var(--line);
  border-radius: 8px;
  background: rgba(121,167,255,.035);
}
.notice-card i { width: 20px; height: 20px; border: 1px solid rgba(121,167,255,.2); border-radius: 5px; color: #9dbdff; background: transparent; }
.notice-card p { color: #8e8e98; font-size: 11px; }
.empty-card, .account-empty {
  border-color: var(--line);
  border-radius: 8px;
  color: #73737d;
  background: transparent;
}
.empty-card strong, .account-empty strong { color: #c7c7cc; }

/* Public landing */
.relay-home { overflow-x: hidden; }
.relay-home::before {
  z-index: 0;
  background:
    radial-gradient(circle at 72% 12%, rgba(79,134,238,.085), transparent 31rem),
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: auto, 64px 64px, 64px 64px;
  animation: relayAtmosphere 24s ease-in-out infinite alternate;
}
.relay-nav, .relay-main, .relay-footer { width: min(1200px, calc(100% - 56px)); }
.relay-nav { min-height: 72px; border-color: var(--line); }
.relay-nav nav, .relay-footer nav { gap: 25px; }
.relay-nav nav a, .relay-footer a { color: #82828c; font-size: 11px; font-weight: 520; transition: color .16s var(--ease); }
.relay-nav nav a:hover, .relay-footer a:hover { color: #f1f1f3; }
.relay-hero { min-height: 600px; grid-template-columns: 1.4fr .6fr; gap: 82px; padding: 104px 0 112px; }
.relay-hero-copy { animation: enterUp .42s var(--ease) both; }
.relay-hero-copy h1 { max-width: 800px; margin: 20px 0 27px; color: #f5f5f6; font-size: clamp(52px, 6.2vw, 78px); font-weight: 590; line-height: .98; letter-spacing: -.06em; }
.relay-hero-copy h1 span { color: #a9c5fa; }
.relay-hero-copy > p { max-width: 620px; color: #8b8b95; font-size: 16px; line-height: 1.75; }
.relay-hero-copy .hero-actions { gap: 9px; margin-top: 33px; }
.relay-endpoint-card {
  padding: 0;
  border-color: var(--line-strong);
  border-radius: 10px;
  background: #0d0d10;
  box-shadow: none;
  transform: none;
  animation: enterUp .42s .1s var(--ease) both;
}
.endpoint-preview { position: relative; padding: 22px; border-radius: 9px; color: #dbe7ff; background: #0d0d10; }
.endpoint-preview::before { content: ""; position: absolute; top: 0; left: 22px; width: 46px; height: 1px; background: #6f9df4; }
.endpoint-preview small { margin-bottom: 11px; color: #656570; font-size: 9px; font-weight: 650; letter-spacing: .14em; }
.endpoint-preview code { color: #b7cdf8; font-size: 12px; }
.pricing-section { padding: 96px 0; border-color: var(--line); }
.pricing-heading { margin-bottom: 35px; }
.pricing-heading h2 { margin: 9px 0 8px; color: #ededf0; font-size: 40px; font-weight: 580; letter-spacing: -.045em; }
.pricing-heading p { color: #7d7d87; font-size: 13px; }
.pricing-meta { padding: 7px 10px; border-color: var(--line); border-radius: 5px; color: #9dbcf5; background: transparent; font-size: 10px; font-weight: 540; }
.pricing-table-head, .pricing-list article { grid-template-columns: minmax(270px,1fr) 150px 150px 105px 88px; }
.pricing-table-head { padding: 0 14px 12px; color: #65656f; font-size: 10px; letter-spacing: .07em; }
.pricing-list { border-color: var(--line-strong); }
.pricing-list article { min-height: 84px; padding: 0 14px; border-color: var(--line); transition: background-color .18s var(--ease); }
.pricing-list article:hover { background: rgba(255,255,255,.026); transform: none; }
.catalog-logo { width: 34px; height: 34px; border: 1px solid var(--line-strong); border-radius: 7px; color: #abc7fb; background: #15171c; font-size: 10px; }
.model-identity { gap: 14px; }
.model-identity strong { color: #e2e2e6; font-size: 13px; font-family: "SFMono-Regular", Consolas, monospace; font-weight: 590; }
.model-identity small { color: #666671; font-size: 9px; }
.pricing-list article > strong { color: #c6c6cc; font-size: 12px; font-weight: 520; }
.pricing-list article > em { color: #76ca96; font-size: 9px; font-weight: 570; text-transform: uppercase; }
.pricing-list article > em i { background: var(--success); animation: softPulse 2.8s ease-in-out infinite; }
.pricing-list article > a { padding: 7px 10px; border-color: var(--line-strong); border-radius: 6px; color: #b7b7bf; background: transparent; font-size: 9px; transition: color .16s var(--ease), background-color .16s var(--ease), border-color .16s var(--ease); }
.pricing-list article > a:hover { color: #fff; border-color: rgba(121,167,255,.38); background: rgba(121,167,255,.06); }
.credits-section {
  grid-template-columns: 1fr 1.35fr;
  gap: 72px;
  margin: 36px 0 112px;
  padding: 48px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: #eeeeef;
  background: #0d0d10;
  box-shadow: none;
}
.credits-section h2 { margin: 13px 0 28px; font-size: 36px; font-weight: 560; letter-spacing: -.045em; }
.credits-section .eyebrow { color: #87aff8; }
.credit-feature-grid { gap: 0; border-left: 1px solid var(--line); }
.credit-feature-grid article { min-height: 160px; padding: 18px 21px; border: 0; border-right: 1px solid var(--line); border-radius: 0; background: transparent; }
.credit-feature-grid b { color: #6f9cf2; }
.credit-feature-grid strong { margin-top: 34px; color: #d7d7dc; font-size: 12px; }
.credit-feature-grid p { color: #73737d; font-size: 10px; }
.relay-footer { min-height: 100px; border-color: var(--line); color: #5f5f68; }

/* Authentication */
.auth-gate {
  padding: 28px;
  background:
    radial-gradient(circle at 13% 18%, rgba(79,134,238,.1), transparent 28rem),
    #09090b;
}
.auth-card {
  width: min(1040px,100%);
  min-height: 600px;
  border-color: var(--line);
  border-radius: 10px;
  background: #0d0d10;
  box-shadow: 0 30px 90px rgba(0,0,0,.3);
}
.auth-intro { position: relative; padding: 76px 64px; color: #fff; background: #0b0b0e; overflow: hidden; }
.auth-intro::after { content: ""; position: absolute; right: -180px; bottom: -220px; width: 430px; height: 430px; border-radius: 50%; background: rgba(79,134,238,.08); filter: blur(30px); animation: authOrb 20s ease-in-out infinite alternate; }
.auth-intro h1 { margin: 20px 0 25px; font-size: 52px; font-weight: 580; line-height: 1; letter-spacing: -.055em; }
.auth-intro h1 span { color: #a8c4f8; }
.auth-intro p { max-width: 430px; color: #85858f; font-size: 14px; }
.auth-points { gap: 14px; margin-top: 54px; color: #777781; font-size: 11px; }
.auth-points span::first-letter { color: #7ea8f4; }
.auth-forms { gap: 24px; padding: 50px; background: #101013; }
.auth-tabs { padding: 3px; border: 1px solid var(--line); border-radius: 7px; background: #0b0b0e; }
.auth-tabs button { border-radius: 5px; padding: 9px; color: #777781; background: transparent; font-size: 11px; font-weight: 570; }
.auth-tabs button.active { color: #ededf0; background: #1b1b20; box-shadow: inset 0 0 0 1px var(--line); }
.auth-forms form { gap: 17px; }
.form-error { color: #d77b80; }

/* User console */
.account-shell { grid-template-columns: 224px 1fr; background: #09090b; }
.account-sidebar {
  padding: 22px 14px;
  border-color: var(--line);
  background: #0b0b0e;
}
.account-sidebar .brand { padding: 0 8px 27px; }
.account-sidebar nav { gap: 3px; margin-top: 9px; }
.account-sidebar nav button {
  gap: 11px;
  border-radius: 6px;
  padding: 9px 10px;
  color: #777781;
  font-size: 11px;
  font-weight: 540;
  transition: color .16s var(--ease), background-color .16s var(--ease);
}
.account-sidebar nav button i { width: 18px; color: #60606a; font-family: "SFMono-Regular", Consolas, monospace; font-size: 12px; opacity: .75; }
.account-sidebar nav button:hover { color: #c7c7cd; background: rgba(255,255,255,.03); }
.account-sidebar nav button.active { color: #e9e9ec; background: rgba(121,167,255,.075); box-shadow: inset 2px 0 #6596ef; }
.account-sidebar nav button.active i { color: #91b5fa; opacity: 1; }
.sidebar-bottom { gap: 9px; padding: 16px 10px 3px; border-color: var(--line); }
.sidebar-bottom a { color: #62626c; font-size: 10px; transition: color .16s var(--ease); }
.sidebar-bottom a:hover { color: #bdbdc4; }
.online-dot { background: var(--success); }
.account-main { padding: 0 clamp(25px,4.2vw,64px) 64px; background: #09090b; }
.account-topbar { min-height: 86px; border-color: var(--line); }
.account-topbar > div:first-of-type span { color: #6e94da; font-size: 9px; font-weight: 620; }
.account-topbar h1 { margin-top: 4px; color: #eeeeef; font-size: 28px; font-weight: 590; letter-spacing: -.045em; }
.user-avatar { width: 32px; height: 32px; border: 1px solid var(--line-strong); border-radius: 7px; color: #b9d0fb; background: #16171c; font-size: 11px; }
.user-menu strong { color: #d1d1d6; font-size: 11px; font-weight: 570; }
.user-menu small { color: #686872; font-size: 9px; }
.account-view { padding-top: 36px; animation: enterUp .38s var(--ease) both; }
.account-metrics {
  grid-template-columns: repeat(4,1fr);
  gap: 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.account-metrics article {
  min-width: 0;
  padding: 22px 24px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}
.account-metrics article:first-child { padding-left: 0; }
.account-metrics article:last-child { border-right: 0; }
.account-metrics span { color: #71717b; font-size: 10px; font-weight: 560; letter-spacing: .08em; }
.account-metrics strong { margin: 12px 0 5px; color: #f2f2f4; font-size: clamp(26px,3vw,38px); font-weight: 560; letter-spacing: -.05em; }
.account-metrics small { color: #5f5f69; font-size: 9px; }
.wallet-metric { color: inherit !important; background: transparent !important; }
.wallet-metric > span, .wallet-metric > small { color: #71717b !important; }
.wallet-metric > strong { color: #b8cff9 !important; }
.overview-grid { grid-template-columns: 1.3fr .7fr; gap: 12px; margin-top: 20px; }
.quick-card, .usage-chart-card, .recent-card, .data-card, .trend-card, .service-card {
  border-color: var(--line);
  border-radius: 9px;
  background: #0d0d10;
  box-shadow: none;
}
.quick-card { gap: 28px; padding: 26px; }
.quick-card h2, .usage-chart-card h2, .recent-card h2, .trend-card h2, .service-card h2, .wallet-card h2 { color: #dedee2; font-size: 18px; font-weight: 570; }
.quick-card p, .service-card > p { color: #74747e; font-size: 11px; }
.quick-values label > div { border-color: var(--line); border-radius: 6px; background: #09090b; }
.quick-values code { color: #afb8c8; }
.quick-values button { border-color: var(--line); color: #84adf8; }
.quick-values button:hover { background: rgba(121,167,255,.05); }
.usage-chart-card { padding: 25px; }
.card-title > strong { color: #9ebdfa; font-family: "SFMono-Regular", Consolas, monospace; font-size: 23px; }
.donut { background: conic-gradient(#5f90eb 0 0%, #222228 0 100%); }
.donut::after { background: #0d0d10; }
.donut span { color: #ddddE1; }
.donut small, .donut-legend { color: #70707a; }
.donut-legend i { background: #303038; }
.donut-legend i.used { background: #6c9cf1; }
.donut-legend b { color: #c9c9ce; }
.overview-lower-grid { grid-template-columns: 1.4fr .6fr; gap: 12px; margin-top: 12px; }
.trend-card, .service-card, .recent-card { padding: 24px; }
.usage-trend { border-color: var(--line); background: repeating-linear-gradient(to bottom, transparent 0, transparent 41px, rgba(255,255,255,.035) 42px); }
.usage-trend i { border-radius: 3px 3px 0 0; background: #628fe1; box-shadow: none; transition: height .4s var(--ease); }
.usage-trend b { color: #62626c; }
.usage-trend small { color: #9696a0; }
.service-lines > div, .mini-table > div { border-color: var(--line); color: #777781; }
.service-lines strong, .mini-table b, .mini-table > div > strong { color: #c5c5cb; }
.request-icon { border: 1px solid var(--line); border-radius: 5px; color: #82aaf5; background: transparent; }
.recent-card { margin-top: 12px; }
.panel-heading { margin-bottom: 24px; }
.panel-heading h2 { color: #eeeeef; font-size: 28px; font-weight: 580; }
.panel-heading p { color: #777781; font-size: 12px; }

/* Wallet, keys and usage */
.wallet-hero {
  min-height: 210px;
  padding: 34px 36px;
  border: 1px solid var(--line);
  border-radius: 9px;
  color: #ededf0;
  background: #0d0d10;
  box-shadow: none;
}
.wallet-hero > div:first-child > span { color: #70707a; }
.wallet-hero strong { color: #c2d5fa; }
.wallet-hero strong b { font-size: 46px; font-weight: 540; }
.wallet-hero p { color: #666670; }
.wallet-side { padding: 18px 20px; border-color: var(--line); border-radius: 7px; background: #111115; }
.wallet-side span, .wallet-side small { color: #696973; }
.wallet-side strong { color: #d5d5da; }
.recharge-packages { gap: 0; margin-bottom: 18px; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.recharge-packages button {
  min-height: 112px;
  padding: 18px 20px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  color: #dedee2;
  background: #0c0c0f;
  transition: background-color .18s var(--ease);
}
.recharge-packages button:last-child { border-right: 0; }
.recharge-packages button:hover { transform: none; border-color: var(--line); background: #131318; box-shadow: none; }
.recharge-packages button.featured { border-color: var(--line); background: rgba(121,167,255,.055); }
.recharge-packages span { color: #83aaf3; }
.recharge-packages strong { color: #eeeef0; font-family: "SFMono-Regular", Consolas, monospace; font-weight: 560; }
.recharge-packages small { color: #686872; }
.wallet-ledger-grid { gap: 12px; }
.wallet-list > div { border-color: var(--line); }
.wallet-list > div > span strong { color: #bfc0c6; }
.wallet-list > div > span small, .wallet-list > div > em { color: #6e6e78; }
.wallet-positive { color: #79d29b; }
.wallet-negative { color: #d9878c; }
.checkout-summary { border: 1px solid var(--line); border-radius: 7px; color: #adc7f8; background: rgba(121,167,255,.045); }
.key-table-head, .usage-table-head, .admin-order-head { color: #65656f; background: #0a0a0c; }
.account-key-row, .usage-account-row, .admin-order-row { border-color: var(--line); transition: background-color .16s var(--ease); }
.account-key-row:hover, .usage-account-row:hover, .admin-order-row:hover { background: rgba(255,255,255,.025); }
.account-key-row strong, .usage-account-row > span:nth-child(2) strong { color: #d1d1d6; }
.account-key-row code, .account-key-row small, .account-key-row span, .usage-account-row { color: #777781; }
.account-key-row .text-button { color: #9b7276; opacity: .55; }
.account-key-row:hover .text-button { color: #dc7f85; opacity: 1; }
.usage-summary-row { gap: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.usage-summary-row > div { padding: 18px 22px; border: 0; border-right: 1px solid var(--line); border-radius: 0; background: transparent; }
.usage-summary-row > div:first-child { padding-left: 0; }
.usage-summary-row > div:last-child { border-right: 0; }
.usage-summary-row span { color: #666670; }
.usage-summary-row strong { color: #ddddE1; font-weight: 550; }

/* Playground and docs */
.request-panel, .response-panel { min-height: 410px; padding: 20px; border-color: var(--line); border-radius: 9px; background: #0d0d10; }
.response-panel { color: #c9cad0; background: #0a0a0c; }
.response-head { border-color: var(--line); color: #60606a; }
.response-panel pre { color: #b8c0cf; }
.switch-label span { background: #292930; }
.switch-label input:checked + span { background: #4d7fdc; }
.docs-layout { border-color: var(--line); border-radius: 9px; background: #0d0d10; }
.docs-layout > nav { border-color: var(--line); background: #0a0a0c; }
.docs-layout > nav button { border-radius: 5px; color: #6f6f79; }
.docs-layout > nav button:hover { color: #babac1; background: rgba(255,255,255,.025); }
.docs-layout > nav button.active { color: #e5e5e8; background: rgba(121,167,255,.075); }
.docs-layout > article h2 { color: #ececee; font-size: 28px; font-weight: 570; }
.docs-layout > article p { color: #777781; font-size: 12px; }
.code-block { border: 1px solid var(--line); border-radius: 8px; color: #c5cad4; background: #09090b; }
.code-block > div { border-color: var(--line); color: #65656f; background: #0c0c0f; }
.code-block pre { color: #b8c2d4; }

/* Admin console */
.page-shell { width: min(1240px, calc(100% - 48px)); }
.topbar { height: 74px; border-bottom: 1px solid var(--line); }
.topbar-actions { gap: 9px; }
.hero { gap: clamp(44px, 7vw, 94px); padding: 90px 0 80px; }
.hero h1 { color: #f1f1f3; font-size: clamp(48px,6.2vw,76px); font-weight: 580; }
.hero h1 span { color: #a8c4f8; }
.hero-copy > p { color: #868690; font-size: 15px; }
.endpoint-line { color: #65656f; }
.endpoint-line code { border-color: var(--line); border-radius: 6px; color: #aebfdf; background: #0d0d10; }
.flow-card { padding: 20px; border-color: var(--line); border-radius: 10px; color: #e5e5e8; background: #0d0d10; box-shadow: none; }
.flow-card::after { width: 140px; height: 140px; background: rgba(79,134,238,.05); }
.flow-head { border-color: var(--line); color: #62626c; }
.flow-head b { color: #90b3f6; }
.flow-node { border-color: var(--line); }
.flow-node i { border: 1px solid var(--line); border-radius: 6px; color: #7b7b85; background: #131317; }
.flow-node strong { color: #d3d3d8; }
.flow-node small, .flow-foot { color: #6d6d77; }
.flow-node.active i { color: #aec8fa; background: rgba(121,167,255,.08); }
.flow-node.active > span, .pulse { color: #7fa9f6; background: #6f9df4; box-shadow: none; }
.metrics { gap: 0; border-color: var(--line); border-width: 1px 0; border-radius: 0; background: transparent; box-shadow: none; }
.metrics article { padding: 23px 26px; border-color: var(--line); }
.metrics article:first-child { padding-left: 0; }
.metrics span { color: #65656f; font-size: 9px; }
.metrics strong { color: #efeff1; font-size: 32px; font-weight: 560; }
.metrics small { color: #595962; }
.console { margin: 28px 0 64px; border-color: var(--line); border-radius: 10px; background: #0d0d10; box-shadow: none; }
.tabs { gap: 2px; padding: 8px; border-color: var(--line); }
.tab { border-radius: 6px; color: #70707a; font-size: 11px; font-weight: 540; }
.tab:hover { color: #c6c6cc; background: rgba(255,255,255,.025); }
.tab.active { color: #e7e7ea; background: rgba(121,167,255,.075); }
.view { padding: clamp(24px,4vw,40px); animation: enterUp .35s var(--ease) both; }
.section-heading h2 { color: #eeeeef; font-size: 24px; font-weight: 580; }
.worker-grid { gap: 10px; }
.worker-card { border-color: var(--line); border-radius: 8px; background: #101013; transition: background-color .18s var(--ease), transform .18s var(--ease); }
.worker-card:hover { transform: translateY(-2px); background: #131317; }
.worker-card h3 { color: #d7d7dc; font-size: 13px; }
.worker-card .badge.ready { color: #8bd5a6; background: rgba(97,200,135,.06); }
.worker-stats span, .worker-meta, .worker-actions small { color: #666670; }
.worker-stats strong { color: #d3d3d8; }
.member-form { border-color: rgba(121,167,255,.14); border-radius: 8px; background: rgba(121,167,255,.035); }
.member-row { border-color: var(--line); border-radius: 8px; background: #101013; }
.member-main { transition: background-color .16s var(--ease); }
.member-main:hover { background: rgba(255,255,255,.02); }
.member-name strong, .quota strong { color: #d0d0d5; }
.member-name span, .quota small, .member-key-summary { color: #6f6f79; }
.quota-bar { background: #25252b; }
.quota-bar i { background: #638fe2; }
.key-row { border-color: var(--line); color: #b5b5bc; background: #0c0c0f; }
.steps { gap: 0; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
.steps article { border: 0; border-right: 1px solid var(--line); border-radius: 0; background: #0d0d10; }
.steps article:last-child { border-right: 0; }
.steps i { border: 1px solid var(--line); border-radius: 5px; color: #99baf8; background: transparent; }
.steps strong { color: #d2d2d7; }
.steps p { color: #70707a; }
.steps code { color: #9bb8ee; }
.admin-order-card { border-color: var(--line); }

/* Dialogs and feedback */
dialog {
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  color: #eeeeef;
  background: #111114;
  box-shadow: 0 28px 90px rgba(0,0,0,.58);
}
dialog::backdrop { background: rgba(0,0,0,.72); backdrop-filter: blur(4px); }
dialog form, .secret-dialog-body { gap: 16px; padding: 28px; }
dialog h2 { color: #f0f0f2; font-size: 25px; font-weight: 580; }
dialog p { color: #7a7a84; }
.dialog-close { border: 1px solid var(--line); border-radius: 6px; color: #85858f; background: #17171b; transition: color .16s var(--ease), background-color .16s var(--ease); }
.dialog-close:hover { color: #fff; background: #202026; }
.secret-dialog-body > code { border: 1px solid var(--line); border-radius: 7px; color: #b8cff9; background: #09090b; }
.toast {
  top: 22px;
  right: 22px;
  bottom: auto;
  left: auto;
  padding: 10px 13px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  color: #e8e8eb;
  background: #18181c;
  box-shadow: 0 14px 40px rgba(0,0,0,.35);
  transform: translateY(-10px);
}
.toast.show { transform: translateY(0); }

/* Motion */
@keyframes enterUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes softPulse { 0%,100% { opacity: .65; } 50% { opacity: 1; } }
@keyframes relayAtmosphere { from { transform: translate3d(-1%,0,0); } to { transform: translate3d(1%,1%,0); } }
@keyframes authOrb { from { transform: translate3d(-4%,0,0); } to { transform: translate3d(4%,-4%,0); } }

@media (max-width: 980px) {
  .relay-hero { grid-template-columns: 1fr; gap: 38px; padding: 80px 0; }
  .relay-endpoint-card { max-width: 640px; }
  .credits-section { grid-template-columns: 1fr; gap: 38px; }
  .account-shell { grid-template-columns: 74px 1fr; }
  .account-sidebar { padding-inline: 10px; }
  .account-sidebar nav button { justify-content: center; }
  .account-sidebar nav button i { font-size: 12px; }
  .account-metrics { grid-template-columns: 1fr 1fr; }
  .account-metrics article:nth-child(2) { border-right: 0; }
  .account-metrics article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .account-metrics article:nth-child(3) { padding-left: 0; }
  .overview-grid, .overview-lower-grid { grid-template-columns: 1fr; }
}

@media (max-width: 650px) {
  .relay-nav, .relay-main, .relay-footer { width: calc(100% - 28px); }
  .relay-nav { min-height: 66px; }
  .relay-hero { padding: 62px 0 68px; }
  .relay-hero-copy h1 { font-size: 46px; }
  .relay-hero-copy > p { font-size: 14px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .button { text-align: center; }
  .pricing-section { padding: 68px 0; }
  .pricing-heading h2 { font-size: 34px; }
  .pricing-list article { padding: 18px 4px; }
  .credits-section { padding: 28px 22px; border-radius: 8px; }
  .credits-section h2 { font-size: 29px; }
  .credit-feature-grid { border-top: 1px solid var(--line); border-left: 0; }
  .credit-feature-grid article { min-height: 110px; border-right: 0; border-bottom: 1px solid var(--line); }
  .credit-feature-grid article:last-child { border-bottom: 0; }
  .account-shell { display: block; }
  .account-sidebar { width: 224px; border-color: var(--line); background: #0c0c0f; box-shadow: 18px 0 50px rgba(0,0,0,.4); }
  .account-main { padding: 0 15px 42px; }
  .account-topbar { min-height: 76px; }
  .account-topbar h1 { font-size: 23px; }
  .mobile-menu { border: 1px solid var(--line); border-radius: 6px; color: #d6d6db; background: #121216; }
  .account-metrics, .usage-summary-row { grid-template-columns: 1fr; border-bottom: 0; }
  .account-metrics article, .usage-summary-row > div { padding: 17px 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .account-metrics article:nth-child(3) { padding-left: 0; }
  .quick-card { padding: 20px; }
  .panel-heading h2 { font-size: 24px; }
  .wallet-hero { padding: 26px 22px; }
  .wallet-hero strong b { font-size: 37px; }
  .recharge-packages { grid-template-columns: 1fr 1fr; }
  .recharge-packages button:nth-child(2) { border-right: 0; }
  .recharge-packages button:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .docs-layout > article { padding: 24px 17px; }
  .steps { grid-template-columns: 1fr; }
  .steps article { border-right: 0; border-bottom: 1px solid var(--line); }
  .steps article:last-child { border-bottom: 0; }
  .page-shell { width: min(100% - 24px,1240px); }
  .topbar { height: 68px; }
  .hero { padding: 54px 0 48px; }
  .hero h1 { font-size: 44px; }
  .metrics { grid-template-columns: 1fr 1fr; }
  .metrics article { padding: 18px; }
  .metrics article:first-child { padding-left: 18px; }
  .console { border-radius: 8px; }
  .view { padding: 22px 14px; }
  .toast { top: 14px; right: 14px; left: 14px; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@media (max-width: 980px) {
  .relay-hero { grid-template-columns:1fr; gap:45px; }.relay-endpoint-card { max-width:650px; transform:none; }.pricing-table-head,.pricing-list article { grid-template-columns:minmax(230px,1fr) 120px 120px 60px; }.pricing-table-head span:nth-child(4),.pricing-list article > em { display:none; }.credits-section { grid-template-columns:1fr; gap:35px; }.credits-section > .button { grid-column:1; }.wallet-ledger-grid { grid-template-columns:1fr; }
}
@media (max-width: 650px) {
  .relay-nav,.relay-main,.relay-footer { width:calc(100% - 28px); }.relay-nav nav a:not(.button) { display:none; }.relay-hero { min-height:0; padding:62px 0; }.relay-hero-copy h1 { font-size:50px; }.relay-hero-copy > p { font-size:13px; }.pricing-section { padding:65px 0; }.pricing-heading { align-items:flex-start; flex-direction:column; gap:18px; }.pricing-heading h2 { font-size:36px; }.pricing-table-head { display:none; }.pricing-list article { grid-template-columns:1fr auto; gap:8px 15px; padding:18px 4px; }.pricing-list article > strong { grid-column:2; }.pricing-list article > strong:nth-of-type(2) { display:none; }.pricing-list article > a { grid-column:2; grid-row:1; }.credits-section { margin-bottom:70px; padding:32px 23px; }.credits-section h2 { font-size:30px; }.credit-feature-grid { grid-template-columns:1fr; }.credit-feature-grid article { min-height:120px; }.credit-feature-grid strong { margin-top:16px; }.relay-footer { align-items:flex-start; flex-direction:column; gap:16px; padding:25px 0; }.relay-footer nav { flex-wrap:wrap; }.wallet-hero { grid-template-columns:1fr; padding:28px 23px; }.wallet-side { min-width:0; }.wallet-hero strong b { font-size:39px; }.recharge-packages { grid-template-columns:1fr 1fr; }.admin-order-head { display:none; }.admin-order-row { grid-template-columns:1fr auto; }.admin-order-row > strong:nth-of-type(2),.admin-order-row > .table-status { display:none; }
}

/* Theme controls */
.theme-toggle {
  min-width: 48px;
  height: 32px;
  padding: 0 10px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  color: #a3a3ad;
  background: transparent;
  font-size: 10px;
  font-weight: 590;
  transition: color .16s var(--ease), background-color .16s var(--ease), border-color .16s var(--ease), transform .16s var(--ease);
}
.theme-toggle:hover { color: #f1f1f3; border-color: rgba(255,255,255,.26); background: rgba(255,255,255,.035); transform: translateY(-1px); }
.theme-toggle:active { transform: scale(.98); }
.auth-theme-toggle { position: fixed; z-index: 3; top: 26px; right: 28px; }

/* Light theme */
[data-theme="light"] {
  color-scheme: light;
  --ink: #17181b;
  --muted: #6c7079;
  --paper: #f6f7f9;
  --card: #ffffff;
  --card-raised: #ffffff;
  --line: rgba(18,24,38,.09);
  --line-strong: rgba(18,24,38,.15);
  --green: #326fd7;
  --green-deep: #255fc0;
  --lime: #326fd7;
  --shadow: 0 18px 55px rgba(24,35,55,.08);
}
[data-theme="light"] body,
[data-theme="light"] .account-body,
[data-theme="light"] .relay-home,
[data-theme="light"] .account-shell,
[data-theme="light"] .account-main { color: #17181b; background: #f6f7f9; }
[data-theme="light"] .relay-home::before {
  background:
    radial-gradient(circle at 72% 12%, rgba(50,111,215,.08), transparent 31rem),
    linear-gradient(rgba(18,24,38,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18,24,38,.025) 1px, transparent 1px);
  background-size: auto, 64px 64px, 64px 64px;
}
[data-theme="light"] .brand-mark { color: #255fc0; border-color: rgba(18,24,38,.13); background: #fff; box-shadow: inset 0 1px rgba(255,255,255,.8); }
[data-theme="light"] .brand strong,
[data-theme="light"] .relay-hero-copy h1,
[data-theme="light"] .pricing-heading h2,
[data-theme="light"] .panel-heading h2,
[data-theme="light"] .account-topbar h1,
[data-theme="light"] .section-heading h2 { color: #17181b; }
[data-theme="light"] .brand small,
[data-theme="light"] .relay-nav nav a,
[data-theme="light"] .relay-footer a,
[data-theme="light"] .relay-footer { color: #717680; }
[data-theme="light"] .relay-nav nav a:hover,
[data-theme="light"] .relay-footer a:hover { color: #17181b; }
[data-theme="light"] .relay-hero-copy h1 span { color: #326fd7; }
[data-theme="light"] .relay-hero-copy > p,
[data-theme="light"] .pricing-heading p,
[data-theme="light"] .panel-heading p { color: #686d76; }
[data-theme="light"] .theme-toggle { color: #525965; border-color: rgba(18,24,38,.14); background: rgba(255,255,255,.62); }
[data-theme="light"] .theme-toggle:hover { color: #17181b; border-color: rgba(18,24,38,.23); background: #fff; }
[data-theme="light"] .button.secondary,
[data-theme="light"] .button.ghost { color: #343943; border-color: rgba(18,24,38,.15); background: rgba(255,255,255,.65); }
[data-theme="light"] .button.secondary:hover,
[data-theme="light"] .button.ghost:hover { border-color: rgba(18,24,38,.24); background: #fff; }
[data-theme="light"] .relay-endpoint-card,
[data-theme="light"] .endpoint-preview { color: #25324a; border-color: rgba(18,24,38,.13); background: #fff; }
[data-theme="light"] .endpoint-preview small { color: #7a808a; }
[data-theme="light"] .endpoint-preview code { color: #255fc0; }
[data-theme="light"] .pricing-meta { color: #255fc0; border-color: rgba(18,24,38,.11); background: rgba(255,255,255,.66); }
[data-theme="light"] .pricing-list { border-color: rgba(18,24,38,.18); }
[data-theme="light"] .pricing-list article:hover { background: rgba(18,24,38,.025); }
[data-theme="light"] .catalog-logo { color: #255fc0; border-color: rgba(18,24,38,.11); background: #eef3fc; }
[data-theme="light"] .model-identity strong { color: #252930; }
[data-theme="light"] .model-identity small,
[data-theme="light"] .pricing-table-head { color: #777c85; }
[data-theme="light"] .pricing-list article > strong { color: #3f444d; }
[data-theme="light"] .pricing-list article > a { color: #3a404a; border-color: rgba(18,24,38,.14); background: #fff; }
[data-theme="light"] .pricing-list article > a:hover { color: #255fc0; border-color: rgba(50,111,215,.35); background: #f4f7fd; }
[data-theme="light"] .credits-section { color: #17181b; border-color: rgba(18,24,38,.1); background: #fff; }
[data-theme="light"] .credits-section h2,
[data-theme="light"] .credit-feature-grid strong { color: #262a31; }
[data-theme="light"] .credit-feature-grid,
[data-theme="light"] .credit-feature-grid article { border-color: rgba(18,24,38,.09); }
[data-theme="light"] .credit-feature-grid p { color: #6d727c; }

[data-theme="light"] .auth-gate { background: radial-gradient(circle at 13% 18%,rgba(50,111,215,.1),transparent 28rem),#f3f5f8; }
[data-theme="light"] .auth-card { border-color: rgba(18,24,38,.1); background: #fff; box-shadow: 0 28px 80px rgba(32,45,67,.1); }
[data-theme="light"] .auth-intro { color: #17181b; background: #edf2fa; }
[data-theme="light"] .auth-intro::after { background: rgba(50,111,215,.1); }
[data-theme="light"] .auth-intro h1 { color: #17181b; }
[data-theme="light"] .auth-intro h1 span { color: #326fd7; }
[data-theme="light"] .auth-intro p,
[data-theme="light"] .auth-points { color: #69717e; }
[data-theme="light"] .auth-forms { background: #fff; }
[data-theme="light"] .auth-tabs { border-color: rgba(18,24,38,.1); background: #f2f4f7; }
[data-theme="light"] .auth-tabs button { color: #707580; }
[data-theme="light"] .auth-tabs button.active { color: #20242a; background: #fff; box-shadow: 0 1px 3px rgba(24,35,55,.08), inset 0 0 0 1px rgba(18,24,38,.06); }

[data-theme="light"] input,
[data-theme="light"] textarea,
[data-theme="light"] select { color: #23272e; border-color: rgba(18,24,38,.14); background: #fff; box-shadow: inset 0 1px rgba(18,24,38,.015); }
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder { color: #a2a6ae; }
[data-theme="light"] input:hover,
[data-theme="light"] textarea:hover,
[data-theme="light"] select:hover { border-color: rgba(18,24,38,.23); }
[data-theme="light"] input:focus,
[data-theme="light"] textarea:focus,
[data-theme="light"] select:focus { color: #17181b; border-color: #5684d5; background: #fff; }
[data-theme="light"] label { color: #656b75; }

[data-theme="light"] .account-sidebar { border-color: rgba(18,24,38,.09); background: #fbfbfc; }
[data-theme="light"] .account-sidebar nav button { color: #707680; }
[data-theme="light"] .account-sidebar nav button i { color: #858b94; }
[data-theme="light"] .account-sidebar nav button:hover { color: #30353d; background: rgba(18,24,38,.035); }
[data-theme="light"] .account-sidebar nav button.active { color: #255fc0; background: rgba(50,111,215,.075); box-shadow: inset 2px 0 #326fd7; }
[data-theme="light"] .account-sidebar nav button.active i { color: #326fd7; }
[data-theme="light"] .sidebar-bottom { border-color: rgba(18,24,38,.08); }
[data-theme="light"] .sidebar-bottom a { color: #7a808a; }
[data-theme="light"] .sidebar-bottom a:hover { color: #262b33; }
[data-theme="light"] .account-topbar { border-color: rgba(18,24,38,.08); }
[data-theme="light"] .user-avatar { color: #255fc0; border-color: rgba(18,24,38,.1); background: #edf2fa; }
[data-theme="light"] .user-menu strong { color: #343943; }
[data-theme="light"] .user-menu small { color: #818690; }
[data-theme="light"] .account-metrics,
[data-theme="light"] .usage-summary-row { border-color: rgba(18,24,38,.09); }
[data-theme="light"] .account-metrics article,
[data-theme="light"] .usage-summary-row > div { border-color: rgba(18,24,38,.08); }
[data-theme="light"] .account-metrics span,
[data-theme="light"] .account-metrics small,
[data-theme="light"] .usage-summary-row span { color: #747a84; }
[data-theme="light"] .account-metrics strong,
[data-theme="light"] .usage-summary-row strong { color: #20242a; }
[data-theme="light"] .wallet-metric > span,
[data-theme="light"] .wallet-metric > small { color: #747a84 !important; }
[data-theme="light"] .wallet-metric > strong { color: #255fc0 !important; }
[data-theme="light"] .quick-card,
[data-theme="light"] .usage-chart-card,
[data-theme="light"] .recent-card,
[data-theme="light"] .data-card,
[data-theme="light"] .trend-card,
[data-theme="light"] .service-card,
[data-theme="light"] .wallet-hero,
[data-theme="light"] .request-panel,
[data-theme="light"] .docs-layout,
[data-theme="light"] .wallet-side { color: #24282f; border-color: rgba(18,24,38,.09); background: #fff; }
[data-theme="light"] .quick-card h2,
[data-theme="light"] .usage-chart-card h2,
[data-theme="light"] .recent-card h2,
[data-theme="light"] .trend-card h2,
[data-theme="light"] .service-card h2,
[data-theme="light"] .wallet-card h2 { color: #262a31; }
[data-theme="light"] .quick-card p,
[data-theme="light"] .service-card > p { color: #707680; }
[data-theme="light"] .quick-values label > div { border-color: rgba(18,24,38,.1); background: #f7f8fa; }
[data-theme="light"] .quick-values code { color: #47505d; }
[data-theme="light"] .quick-values button { border-color: rgba(18,24,38,.08); color: #326fd7; }
[data-theme="light"] .donut { background: conic-gradient(#4f7fd5 0 0%,#e5e8ed 0 100%); }
[data-theme="light"] .donut::after { background: #fff; }
[data-theme="light"] .donut span,
[data-theme="light"] .donut-legend b { color: #30343b; }
[data-theme="light"] .donut small,
[data-theme="light"] .donut-legend { color: #7a808a; }
[data-theme="light"] .usage-trend { border-color: rgba(18,24,38,.09); background: repeating-linear-gradient(to bottom,transparent 0,transparent 41px,rgba(18,24,38,.045) 42px); }
[data-theme="light"] .usage-trend b,
[data-theme="light"] .usage-trend small { color: #737983; }
[data-theme="light"] .service-lines > div,
[data-theme="light"] .mini-table > div,
[data-theme="light"] .wallet-list > div { border-color: rgba(18,24,38,.08); color: #737983; }
[data-theme="light"] .service-lines strong,
[data-theme="light"] .mini-table b,
[data-theme="light"] .mini-table > div > strong { color: #343943; }
[data-theme="light"] .wallet-hero strong { color: #255fc0; }
[data-theme="light"] .wallet-hero > div:first-child > span,
[data-theme="light"] .wallet-hero p,
[data-theme="light"] .wallet-side span,
[data-theme="light"] .wallet-side small { color: #747a84; }
[data-theme="light"] .wallet-side { background: #f7f8fa; }
[data-theme="light"] .wallet-side strong { color: #30353d; }
[data-theme="light"] .recharge-packages { border-color: rgba(18,24,38,.09); }
[data-theme="light"] .recharge-packages button { color: #2d323a; border-color: rgba(18,24,38,.08); background: #fff; }
[data-theme="light"] .recharge-packages button:hover { background: #f7f8fa; }
[data-theme="light"] .recharge-packages button.featured { background: rgba(50,111,215,.055); }
[data-theme="light"] .recharge-packages strong { color: #252930; }
[data-theme="light"] .recharge-packages small { color: #777d87; }
[data-theme="light"] .wallet-list > div > span strong { color: #3d434c; }
[data-theme="light"] .wallet-list > div > span small,
[data-theme="light"] .wallet-list > div > em { color: #7b818a; }
[data-theme="light"] .notice-card { border-color: rgba(50,111,215,.12); background: rgba(50,111,215,.035); }
[data-theme="light"] .notice-card p { color: #686f7a; }
[data-theme="light"] .key-table-head,
[data-theme="light"] .usage-table-head,
[data-theme="light"] .admin-order-head { color: #747a84; background: #f5f6f8; }
[data-theme="light"] .account-key-row,
[data-theme="light"] .usage-account-row,
[data-theme="light"] .admin-order-row { color: #676e78; border-color: rgba(18,24,38,.08); }
[data-theme="light"] .account-key-row:hover,
[data-theme="light"] .usage-account-row:hover,
[data-theme="light"] .admin-order-row:hover { background: rgba(18,24,38,.025); }
[data-theme="light"] .account-key-row strong,
[data-theme="light"] .usage-account-row > span:nth-child(2) strong { color: #353a43; }
[data-theme="light"] .docs-layout > nav { border-color: rgba(18,24,38,.08); background: #f5f6f8; }
[data-theme="light"] .docs-layout > nav button { color: #707680; }
[data-theme="light"] .docs-layout > nav button.active { color: #255fc0; background: rgba(50,111,215,.075); }
[data-theme="light"] .docs-layout > article h2 { color: #20242a; }
[data-theme="light"] .docs-layout > article p { color: #6f7580; }

[data-theme="light"] .topbar,
[data-theme="light"] .metrics,
[data-theme="light"] .tabs { border-color: rgba(18,24,38,.09); }
[data-theme="light"] .hero h1 { color: #17181b; }
[data-theme="light"] .hero h1 span { color: #326fd7; }
[data-theme="light"] .hero-copy > p { color: #686e78; }
[data-theme="light"] .endpoint-line { color: #767c85; }
[data-theme="light"] .endpoint-line code { color: #315b9c; border-color: rgba(18,24,38,.1); background: #fff; }
[data-theme="light"] .flow-card,
[data-theme="light"] .console,
[data-theme="light"] .worker-card,
[data-theme="light"] .member-row { color: #24282f; border-color: rgba(18,24,38,.1); background: #fff; }
[data-theme="light"] .flow-card::after { background: rgba(50,111,215,.05); }
[data-theme="light"] .flow-head,
[data-theme="light"] .flow-node { border-color: rgba(18,24,38,.08); }
[data-theme="light"] .flow-head,
[data-theme="light"] .flow-node small,
[data-theme="light"] .flow-foot { color: #757b84; }
[data-theme="light"] .flow-node i { color: #6d737c; border-color: rgba(18,24,38,.09); background: #f5f6f8; }
[data-theme="light"] .flow-node strong { color: #30353d; }
[data-theme="light"] .flow-node.active i { color: #255fc0; background: rgba(50,111,215,.07); }
[data-theme="light"] .metrics span,
[data-theme="light"] .metrics small { color: #737983; }
[data-theme="light"] .metrics strong { color: #20242a; }
[data-theme="light"] .tab { color: #707680; }
[data-theme="light"] .tab:hover { color: #2d323a; background: rgba(18,24,38,.025); }
[data-theme="light"] .tab.active { color: #255fc0; background: rgba(50,111,215,.075); }
[data-theme="light"] .worker-card h3,
[data-theme="light"] .worker-stats strong,
[data-theme="light"] .member-name strong,
[data-theme="light"] .quota strong { color: #343943; }
[data-theme="light"] .worker-stats span,
[data-theme="light"] .worker-meta,
[data-theme="light"] .worker-actions small,
[data-theme="light"] .member-name span,
[data-theme="light"] .quota small,
[data-theme="light"] .member-key-summary { color: #747a84; }
[data-theme="light"] .member-form { border-color: rgba(50,111,215,.12); background: rgba(50,111,215,.035); }
[data-theme="light"] .key-row { color: #4e5560; border-color: rgba(18,24,38,.08); background: #f7f8fa; }
[data-theme="light"] .steps { border-color: rgba(18,24,38,.09); }
[data-theme="light"] .steps article { border-color: rgba(18,24,38,.08); background: #fff; }
[data-theme="light"] .steps strong { color: #343943; }
[data-theme="light"] .steps p { color: #707680; }

[data-theme="light"] dialog { color: #20242a; border-color: rgba(18,24,38,.14); background: #fff; box-shadow: 0 28px 80px rgba(24,35,55,.16); }
[data-theme="light"] dialog::backdrop { background: rgba(28,34,44,.4); }
[data-theme="light"] dialog h2 { color: #20242a; }
[data-theme="light"] dialog p { color: #737983; }
[data-theme="light"] .dialog-close { color: #717680; border-color: rgba(18,24,38,.1); background: #f2f4f7; }
[data-theme="light"] .toast { color: #20242a; border-color: rgba(18,24,38,.12); background: #fff; box-shadow: 0 14px 40px rgba(24,35,55,.14); }

@media (max-width: 650px) {
  [data-theme="light"] .account-sidebar { background: #fbfbfc; box-shadow: 18px 0 50px rgba(24,35,55,.14); }
  .relay-nav .theme-toggle { display: inline-block; }
  .auth-theme-toggle { top: 15px; right: 15px; }
}