:root {
  --canvas: #090b0e;
  --canvas-raised: #0e1116;
  --surface: #131720;
  --surface-raised: #181d27;
  --surface-inset: #0d1015;
  --line: #2d3440;
  --line-strong: #4b5665;
  --ink: #f0f3ec;
  --muted: #a2acb7;
  --dim: #687380;
  --lime: #d7ff3f;
  --lime-ink: #172000;
  --pink: #ff8fbd;
  --cyan: #83d8e6;
  --lilac: #baacff;
  --success: #83dda7;
  --warning: #f7c667;
  --danger: #ff8993;
  --radius-sm: .45rem;
  --radius: .76rem;
  --radius-lg: 1.15rem;
  --shadow-low: 0 .7rem 1.6rem rgba(0, 0, 0, .18);
  --shadow-float: 0 1.5rem 4rem rgba(0, 0, 0, .30);
  --display: "Bahnschrift SemiCondensed", "Arial Narrow", "Aptos Display", sans-serif;
  --sans: "Aptos", "Segoe UI Variable", "Helvetica Neue", sans-serif;
  --mono: "Cascadia Mono", "SFMono-Regular", Consolas, monospace;
  --ease: cubic-bezier(.22, 1, .36, 1);
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--canvas); scroll-behavior: smooth; }
body { min-width: 320px; min-height: 100vh; margin: 0; overflow-x: hidden; background: var(--canvas); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.5; }
body::selection { background: var(--lime); color: var(--lime-ink); }
button, input, textarea, select { font: inherit; }
button, select { cursor: pointer; }
button:disabled, input:disabled, textarea:disabled, select:disabled { cursor: not-allowed; opacity: .6; }
a { color: inherit; text-decoration: none; }
img, video { max-width: 100%; }
button { border: 0; }
h1, h2, h3, h4, p, dl, dd, dt, figure, pre { margin: 0; }
ul, ol { margin: 0; padding: 0; }
table { border-collapse: collapse; }
[hidden] { display: none !important; }

:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: fixed; z-index: 90; top: .7rem; left: 1rem; transform: translateY(-180%); border-radius: .35rem; background: var(--lime); padding: .62rem .9rem; color: var(--lime-ink); font-size: .78rem; font-weight: 800; transition: transform 150ms var(--ease); }
.skip-link:focus { transform: translateY(0); }
.page-wrap { width: min(100%, 1440px); margin: 0 auto; padding-right: clamp(1rem, 3vw, 2.5rem); padding-left: clamp(1rem, 3vw, 2.5rem); }
.app-page { padding-top: clamp(2rem, 5vw, 4.5rem); padding-bottom: clamp(3.5rem, 8vw, 8rem); }
.eyebrow { color: var(--lime); font-family: var(--mono); font-size: .64rem; font-weight: 750; letter-spacing: .14em; line-height: 1.4; text-transform: uppercase; }
.button-row { display: flex; flex-wrap: wrap; gap: .65rem; align-items: center; }
.button { display: inline-flex; min-height: 2.58rem; align-items: center; justify-content: center; gap: .58rem; border: 1px solid transparent; border-radius: var(--radius-sm); padding: .62rem .9rem; font-size: .78rem; font-weight: 780; letter-spacing: .01em; transition: transform 150ms var(--ease), background-color 150ms var(--ease), border-color 150ms var(--ease), color 150ms var(--ease); }
.button:hover:not(:disabled) { transform: translateY(-1px); }
.button:active:not(:disabled) { transform: translateY(0); }
.button--lime { background: var(--lime); color: var(--lime-ink); }
.button--lime:hover:not(:disabled) { background: #e4ff77; }
.button--quiet { border-color: var(--line); background: var(--surface); color: var(--ink); }
.button--quiet:hover:not(:disabled) { border-color: var(--line-strong); background: var(--surface-raised); }
.button--text { min-height: auto; background: transparent; color: var(--muted); padding-inline: .2rem; text-decoration: underline; text-underline-offset: .2em; }
.button--text:hover:not(:disabled) { color: var(--ink); }
.button--large { min-height: 3rem; padding-inline: 1.05rem; }
.button--full { width: 100%; }
.link-button { background: transparent; color: var(--muted); font-size: .76rem; font-weight: 700; }
.link-button:hover { color: var(--ink); }
.quiet-link { display: inline-flex; gap: .42rem; align-items: center; border-bottom: 1px solid var(--line-strong); padding-bottom: .2rem; color: var(--ink); font-size: .77rem; font-weight: 750; }
.quiet-link:hover { border-color: var(--lime); color: var(--lime); }

/* Shell */
.site-header { position: sticky; z-index: 40; top: 0; padding: .7rem clamp(.65rem, 2vw, 1.25rem); border-bottom: 1px solid color-mix(in srgb, var(--line) 74%, transparent); background: color-mix(in srgb, var(--canvas) 91%, transparent); }
@supports (backdrop-filter: blur(1px)) { .site-header { backdrop-filter: blur(18px) saturate(115%); } }
.site-header__inner { display: grid; width: min(100%, 1490px); min-height: 2.6rem; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem; align-items: center; margin: 0 auto; }
.brand { display: inline-flex; gap: .58rem; align-items: center; color: var(--ink); font-family: var(--mono); font-size: .7rem; font-weight: 800; letter-spacing: .14em; white-space: nowrap; }
.brand__mark { display: grid; width: 1.55rem; height: 1.55rem; grid-template-columns: 1fr 1fr; overflow: hidden; border: 1px solid var(--ink); border-radius: 50%; transform: rotate(-8deg); }
.brand__mark i:first-child { background: var(--lime); }
.brand__mark i:last-child { background: var(--surface-raised); }
.brand__mark--small { display: inline-grid; width: 1.1rem; height: 1.1rem; margin-right: .32rem; vertical-align: -.23rem; }
.site-nav { display: flex; gap: .08rem; align-items: center; justify-content: center; }
.site-nav a { position: relative; padding: .55rem .68rem; color: var(--muted); font-size: .76rem; font-weight: 730; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--ink); }
.site-nav a[aria-current="page"]::after { position: absolute; right: .68rem; bottom: .12rem; left: .68rem; height: 2px; background: var(--lime); content: ""; }
.site-header__actions { display: flex; gap: .5rem; align-items: center; justify-content: flex-end; }
.credit-chip { display: inline-flex; min-height: 2rem; gap: .35rem; align-items: center; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-inset); padding: .25rem .68rem; color: var(--muted); font-size: .68rem; }
.credit-chip > span:first-child { color: var(--lime); font-size: .55rem; }
.credit-chip strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.account-link { max-width: 9rem; overflow: hidden; color: var(--muted); font-size: .74rem; font-weight: 730; text-overflow: ellipsis; white-space: nowrap; }
.account-link:hover { color: var(--ink); }
.menu-toggle { display: none; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); padding: .55rem .67rem; color: var(--ink); font-size: .7rem; font-weight: 800; }
.mock-banner { display: flex; gap: .55rem; justify-content: center; border-bottom: 1px solid #5e4d25; background: #292313; padding: .48rem 1rem; color: #f8d98b; font-size: .72rem; text-align: center; }
.mock-banner span:first-child { font-family: var(--mono); font-weight: 800; letter-spacing: .07em; }
.site-footer { display: grid; grid-template-columns: 1fr auto auto; gap: 1rem; align-items: center; border-top: 1px solid var(--line); padding: 1.25rem clamp(1rem, 3vw, 2.5rem); color: var(--dim); font-family: var(--mono); font-size: .66rem; line-height: 1.55; }
.site-footer > div { color: var(--ink); font-size: .68rem; font-weight: 800; letter-spacing: .1em; }
.site-footer nav { display: flex; gap: .9rem; }
.site-footer a:hover { color: var(--lime); }

/* Common app surfaces */
.page-heading { display: flex; gap: 2rem; align-items: end; justify-content: space-between; margin-bottom: clamp(1.5rem, 4vw, 3rem); }
.page-heading > div { max-width: 48rem; }
.page-heading h1 { margin-top: .45rem; font-family: var(--display); font-size: clamp(3rem, 7vw, 6rem); font-weight: 650; letter-spacing: -.055em; line-height: .86; }
.page-heading p:not(.eyebrow) { max-width: 43rem; margin-top: 1rem; color: var(--muted); font-size: .96rem; line-height: 1.75; }
.field { display: grid; gap: .44rem; }
.field > label, .upload-field > label, .inline-field > span, .scope-fieldset legend { color: var(--muted); font-size: .68rem; font-weight: 790; letter-spacing: .06em; text-transform: uppercase; }
.field > label span, .upload-field > label span { color: var(--dim); font-weight: 650; text-transform: none; }
.field-control { width: 100%; min-height: 2.66rem; border: 1px solid var(--line); border-radius: var(--radius-sm); outline: none; background: var(--surface-inset); padding: .66rem .73rem; color: var(--ink); font-size: .86rem; line-height: 1.45; transition: border-color 150ms var(--ease), box-shadow 150ms var(--ease), background-color 150ms var(--ease); }
.field-control:hover { border-color: var(--line-strong); background: #12161c; }
.field-control:focus { border-color: var(--lime); box-shadow: 0 0 0 3px rgba(215,255,63,.15); }
textarea.field-control { min-height: 8.8rem; resize: vertical; }
.field-hint { color: var(--dim); font-size: .72rem; line-height: 1.55; }
.field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.field-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-message { min-height: 1.15rem; margin-top: .75rem; color: var(--danger); font-size: .75rem; line-height: 1.55; }
.form-message--status { color: var(--muted); }
.form-message--success { color: var(--success); }
.form-message--warning { color: var(--warning); }
.loading-ring { display: inline-block; width: 1.3rem; height: 1.3rem; border: 2px solid var(--line-strong); border-top-color: var(--lime); border-radius: 50%; animation: spin 800ms linear infinite; }
.empty-state { display: grid; min-height: 12rem; place-items: center; align-content: center; gap: .55rem; border: 1px dashed var(--line); background: color-mix(in srgb, var(--surface-inset) 78%, transparent); padding: 1.6rem; color: var(--muted); text-align: center; }
.empty-state > span:not(.loading-ring) { color: var(--lime); font-family: var(--display); font-size: 2.8rem; line-height: 1; }
.empty-state h2, .empty-state h3 { color: var(--ink); font-size: .95rem; }
.empty-state p { max-width: 24rem; font-size: .78rem; line-height: 1.6; }
.section-line { display: flex; gap: 1rem; align-items: end; justify-content: space-between; }
.section-line h2 { margin-top: .28rem; font-family: var(--display); font-size: clamp(1.75rem, 3vw, 2.6rem); font-weight: 650; letter-spacing: -.04em; line-height: .95; }

/* Homepage: restrained Jelly Stage */
.home-stage { position: relative; isolation: isolate; overflow: clip; background: #080a0e; }
.home-stage__canvas { position: absolute; z-index: -1; inset: 0; width: 100%; height: min(56rem, 100vw); opacity: .68; pointer-events: none; }
.home-stage__grid { position: absolute; z-index: -2; inset: 0 0 auto; height: min(56rem, 100vw); opacity: .86; background-color: #080a0e; background-image: linear-gradient(90deg, rgba(215,255,63,.16) 1px, transparent 1px), linear-gradient(rgba(240,243,236,.07) 1px, transparent 1px), linear-gradient(104deg, rgba(5,7,10,.92) 0%, rgba(5,7,10,.72) 42%, rgba(5,7,10,.48) 69%, rgba(5,7,10,.89) 100%), radial-gradient(circle at 76% 17%, rgba(255,143,189,.16), transparent 20rem), url("/static/visuals/frameway-jelly-atlas-v2.webp"); background-position: 0 0, 0 0, center, center, 55% 50%; background-repeat: repeat, repeat, no-repeat, no-repeat, no-repeat; background-size: min(11vw, 10rem) min(11vw, 10rem), min(11vw, 10rem) min(11vw, 10rem), cover, auto, cover; }
.home-hero { display: grid; min-height: min(49rem, calc(100vh - 4rem)); grid-template-columns: minmax(0, 1.04fr) minmax(24rem, .96fr); gap: clamp(1rem, 3vw, 3rem); align-items: center; padding-top: clamp(3rem, 7vw, 7rem); padding-bottom: clamp(4rem, 7vw, 7rem); }
.home-hero__copy { position: relative; z-index: 1; max-width: 45rem; }
.home-hero h1 { max-width: 12ch; margin-top: 1rem; color: #f8fbf2; font-family: var(--display); font-size: clamp(3.7rem, 8.1vw, 7.8rem); font-weight: 650; letter-spacing: -.055em; line-height: .88; }
.home-hero h1 em { color: var(--lime); font-style: normal; }
.home-hero__lede { max-width: 36rem; margin-top: 1.55rem; color: #c3cbd4; font-size: clamp(.95rem, 1.3vw, 1.08rem); line-height: 1.78; }
.home-hero .button-row { margin-top: 2rem; }
.hero-facts { display: grid; max-width: 39rem; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: clamp(2.4rem, 5vw, 4.5rem); border: 1px solid rgba(240,243,236,.15); background: rgba(240,243,236,.15); }
.hero-facts div { min-height: 4.25rem; background: rgba(9,11,14,.78); padding: .65rem .75rem; }
.hero-facts dt { color: #8d98a5; font-family: var(--mono); font-size: .54rem; font-weight: 750; letter-spacing: .09em; }
.hero-facts dd { margin-top: .38rem; color: #edf1e8; font-size: .76rem; font-weight: 750; }
.poster-stack { position: relative; z-index: 1; min-height: 32rem; max-width: 41rem; justify-self: center; width: 100%; }
.poster-card { position: absolute; display: flex; overflow: hidden; flex-direction: column; justify-content: space-between; border: 1px solid rgba(240,243,236,.25); color: #f4f7ef; box-shadow: var(--shadow-float), inset 0 1px 0 rgba(255,255,255,.12); transition: transform 300ms var(--ease), border-color 300ms var(--ease); }
.poster-card:hover { border-color: var(--lime); transform: translateY(-.36rem) rotate(0deg); }
.poster-card::before { position: absolute; inset: 0; z-index: -1; content: ""; }
.poster-card--primary { top: 13%; left: 2%; width: 59%; min-width: 15rem; height: 64%; padding: 1.35rem 1.2rem 1.5rem; background-color: #252234; background-image: linear-gradient(145deg, rgba(255,143,189,.38), rgba(15,18,25,.74) 38%, rgba(15,18,25,.94)), url("/static/visuals/frameway-poster-create-v1.webp"); background-position: center, 53% 39%; background-size: cover; transform: rotate(-7deg); }
.poster-card--primary::before { background: radial-gradient(circle at 72% 16%, rgba(215,255,63,.76), transparent 23%), linear-gradient(130deg, transparent 40%, rgba(131,216,230,.30)); }
.poster-card--secondary { top: 2%; right: 5%; width: 47%; min-width: 12.5rem; height: 48%; padding: 1.1rem; background-color: #10222b; background-image: linear-gradient(150deg, rgba(131,216,230,.24), rgba(15,18,25,.90) 55%), url("/static/visuals/frameway-poster-models-v1.webp"); background-position: center, 53% 36%; background-size: cover; transform: rotate(4deg); }
.poster-card--tertiary { right: 8%; bottom: 3%; width: 55%; min-width: 13.5rem; height: 42%; padding: 1.1rem; background-color: #211f38; background-image: linear-gradient(145deg, rgba(186,172,255,.36), rgba(17,19,28,.92) 58%), url("/static/visuals/frameway-poster-route-v1.webp"); background-position: center, 56% 42%; background-size: cover; transform: rotate(-2deg); }
.poster-card__index, .poster-card__code { color: #c2c9d1; font-family: var(--mono); font-size: .58rem; font-weight: 750; letter-spacing: .12em; }
.poster-card strong { font-family: var(--display); font-size: clamp(2rem, 4vw, 3.7rem); font-weight: 650; letter-spacing: -.045em; line-height: .88; }
.poster-card--secondary strong { font-size: clamp(1.65rem, 3vw, 2.8rem); }
.poster-card--tertiary strong { font-size: clamp(1.4rem, 2.5vw, 2.35rem); }
.poster-card__note { max-width: 13rem; color: #d3d8dc; font-size: .72rem; line-height: 1.55; }
.poster-card__accent { position: absolute; right: 11%; bottom: 9%; left: 11%; height: .22rem; background: var(--lime); }
.poster-card__code { color: var(--lime); }
.stage-control { position: absolute; z-index: 4; right: max(1rem, env(safe-area-inset-right)); top: calc(100vh - 3.75rem); display: inline-flex; min-height: 2.5rem; gap: .5rem; align-items: center; border: 1px solid rgba(240,243,236,.20); border-radius: 999px; background: rgba(13,16,21,.87); padding: .45rem .78rem; color: var(--ink); font-family: var(--mono); font-size: .61rem; font-weight: 750; letter-spacing: .05em; }
.stage-control:hover { border-color: var(--lime); }
.stage-control__dot { width: .47rem; height: .47rem; border-radius: 50%; background: var(--lime); }
.stage-control[aria-pressed="true"] .stage-control__dot { background: var(--dim); }
.route-section { display: grid; grid-template-columns: minmax(15rem, .69fr) minmax(0, 1.31fr); gap: clamp(2rem, 7vw, 8rem); padding-top: clamp(4rem, 10vw, 10rem); padding-bottom: clamp(4rem, 10vw, 10rem); }
.section-intro h2, .pricing-heading h2, .handoff-section h2 { max-width: 14ch; margin-top: .75rem; color: #f4f6ee; font-family: var(--display); font-size: clamp(2.8rem, 5.2vw, 5.3rem); font-weight: 650; letter-spacing: -.05em; line-height: .88; }
.route-list { list-style: none; border-top: 1px solid rgba(240,243,236,.18); }
.route-list li { display: grid; grid-template-columns: 3.4rem minmax(0, 1fr) auto; gap: 1rem; align-items: start; border-bottom: 1px solid rgba(240,243,236,.18); padding: 1.4rem 0; }
.route-list li > span { color: var(--lime); font-family: var(--mono); font-size: .72rem; font-weight: 750; letter-spacing: .1em; }
.route-list h3 { color: #f4f6ee; font-size: 1rem; }
.route-list p { max-width: 34rem; margin-top: .42rem; color: #aeb8c2; font-size: .84rem; line-height: 1.65; }
.route-list a { display: inline-flex; gap: .42rem; align-items: center; border-bottom: 1px solid rgba(240,243,236,.35); padding-bottom: .17rem; color: #f4f6ee; font-size: .73rem; font-weight: 750; white-space: nowrap; }
.route-list a:hover { border-color: var(--lime); color: var(--lime); }
.pricing-section { padding-top: clamp(3rem, 6vw, 6rem); padding-bottom: clamp(4rem, 8vw, 8rem); }
.pricing-section::before { display: block; height: 1px; background: rgba(240,243,236,.2); content: ""; }
.pricing-heading { display: flex; gap: 2rem; align-items: end; justify-content: space-between; padding-top: clamp(2rem, 5vw, 4.5rem); }
.pricing-heading > p { max-width: 29rem; color: #aeb8c2; font-size: .86rem; line-height: 1.75; }
.pricing-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 2.25rem; border: 1px solid rgba(240,243,236,.15); background: rgba(240,243,236,.15); }
.pricing-meta > div { min-height: 7rem; background: rgba(12,15,20,.86); padding: 1rem; }
.pricing-meta span, .pricing-meta small { display: block; color: #8995a0; font-family: var(--mono); font-size: .57rem; font-weight: 700; letter-spacing: .1em; }
.pricing-meta strong { display: block; margin: .48rem 0 .15rem; color: #f2f5ed; font-size: .91rem; font-variant-numeric: tabular-nums; }
.pricing-meta small { font-family: var(--sans); font-size: .68rem; font-weight: 600; letter-spacing: 0; }
.pricing-grid { display: grid; grid-template-columns: minmax(0, 1.34fr) minmax(14rem, .66fr); gap: 1px; margin-top: 1px; border: 1px solid rgba(240,243,236,.15); background: rgba(240,243,236,.15); }
.pricing-panel { min-height: 20rem; background: rgba(13,16,21,.92); padding: clamp(1.2rem, 3vw, 2.2rem); }
.pricing-panel--voice { background: linear-gradient(170deg, rgba(255,143,189,.11), rgba(13,16,21,.94) 46%); }
.pricing-panel--motion { grid-column: 1 / -1; min-height: 0; background: linear-gradient(115deg, rgba(137,255,82,.08), rgba(13,16,21,.94) 40%); }
.panel-title h3, .ai-catalog h3 { margin-top: .45rem; color: #f4f6ee; font-family: var(--display); font-size: clamp(1.8rem, 3vw, 2.7rem); font-weight: 650; letter-spacing: -.04em; line-height: .96; }
.rate-table { margin-top: 1.6rem; border: 1px solid rgba(240,243,236,.15); }
.rate-table__head, .rate-table__body > div { display: grid; grid-template-columns: .55fr 1fr 1fr; gap: .5rem; }
.rate-table__head { border-bottom: 1px solid rgba(240,243,236,.15); padding: .55rem .7rem; color: #8995a0; font-family: var(--mono); font-size: .56rem; font-weight: 700; letter-spacing: .08em; }
.rate-table__body > div { border-bottom: 1px solid rgba(240,243,236,.11); padding: .88rem .7rem; color: #c5cdd4; font-size: .76rem; font-variant-numeric: tabular-nums; }
.rate-table__body > div:last-child { border-bottom: 0; }
.rate-table strong { color: var(--lime); font-size: .85rem; }
.panel-note { margin-top: 1rem; color: #9ba7b1; font-size: .74rem; line-height: 1.7; }
.price-large { margin-top: 2.1rem; color: var(--lime); font-family: var(--display); font-size: clamp(3.2rem, 5.5vw, 5.4rem); font-weight: 650; letter-spacing: -.06em; line-height: .83; }
.price-currency { margin-top: .55rem; color: #f2f5ed; font-size: .86rem; font-weight: 740; }
.pricing-panel--voice .panel-note { margin-top: 2.5rem; border-top: 1px solid rgba(240,243,236,.15); padding-top: 1rem; }
.pricing-secondary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-top: 1px; border: 1px solid rgba(240,243,236,.15); background: rgba(240,243,236,.15); }
.pricing-secondary article { min-height: 11.5rem; background: #10141a; padding: 1.05rem; }
.pricing-secondary h3 { margin-top: .42rem; color: #f3f6ed; font-family: var(--display); font-size: 1.38rem; font-weight: 650; letter-spacing: -.035em; }
.pricing-secondary strong { display: block; margin-top: 1.25rem; color: var(--lime); font-family: var(--mono); font-size: .78rem; font-variant-numeric: tabular-nums; }
.pricing-secondary p:last-child { margin-top: .55rem; color: #9ea9b2; font-size: .7rem; line-height: 1.6; }
.pricing-secondary code { color: #d4dee4; font-family: var(--mono); font-size: .92em; }
.ai-catalog { display: grid; grid-template-columns: minmax(15rem, .43fr) minmax(0, 1.57fr); gap: clamp(1.5rem, 5vw, 5rem); margin-top: 1px; border: 1px solid rgba(240,243,236,.15); background: rgba(13,16,21,.92); padding: clamp(1.2rem, 3vw, 2.25rem); }
.ai-catalog__intro p:not(.eyebrow) { margin-top: .8rem; color: #aeb8c2; font-size: .79rem; line-height: 1.7; }
.ai-catalog__intro strong { color: #f4f6ee; }
.ai-rates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; border: 1px solid rgba(240,243,236,.15); background: rgba(240,243,236,.15); }
.ai-rates > article { min-height: 15rem; background: #11151c; padding: 1.1rem; }
.ai-rates article > p { color: #8995a0; font-family: var(--mono); font-size: .57rem; font-weight: 700; letter-spacing: .1em; }
.ai-rates h4 { margin-top: .35rem; color: #f4f6ee; font-family: var(--display); font-size: 1.65rem; font-weight: 650; letter-spacing: -.04em; }
.ai-rates dl { margin-top: 1.25rem; }
.ai-rates dl > div { display: flex; gap: .6rem; justify-content: space-between; border-top: 1px solid rgba(240,243,236,.12); padding: .66rem 0; font-size: .72rem; }
.ai-rates dt { color: #aeb8c2; }
.ai-rates dd { color: var(--lime); font-family: var(--mono); font-size: .66rem; font-weight: 750; font-variant-numeric: tabular-nums; text-align: right; }
.service-disclaimer { margin-top: 1px; border: 1px solid rgba(240,243,236,.15); background: linear-gradient(110deg, rgba(215,255,63,.11), rgba(13,16,21,.96) 38%); padding: clamp(1.2rem, 3vw, 2.25rem); }
.service-disclaimer h3 { margin-top: .48rem; color: #f4f6ee; font-family: var(--display); font-size: clamp(1.45rem, 3vw, 2.4rem); font-weight: 650; letter-spacing: -.04em; }
.service-disclaimer p:last-child { max-width: 63rem; margin-top: .68rem; color: #b4bec7; font-size: .8rem; line-height: 1.78; }
.handoff-section { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(15rem, .9fr); gap: clamp(2rem, 6vw, 6rem); align-items: end; margin-bottom: clamp(3.5rem, 8vw, 8rem); border-top: 1px solid rgba(240,243,236,.2); padding-top: clamp(2.5rem, 6vw, 5.5rem); }
.handoff-section > div:last-child { max-width: 29rem; }
.handoff-section p:not(.eyebrow) { color: #adb7c0; line-height: 1.76; }
.handoff-section .button { margin-top: 1.3rem; }

/* Login */
.auth-layout { display: grid; min-height: calc(100vh - 7rem); grid-template-columns: minmax(17rem, .9fr) minmax(24rem, 1.1fr); }
.auth-poster { position: relative; display: flex; overflow: hidden; flex-direction: column; justify-content: space-between; min-height: 36rem; background: linear-gradient(136deg, rgba(8,10,14,.18), rgba(8,10,14,.88) 72%), radial-gradient(circle at 75% 18%, rgba(255,143,189,.61), transparent 18rem), radial-gradient(circle at 20% 76%, rgba(131,216,230,.45), transparent 18rem), #1e1e32; padding: clamp(2rem, 5vw, 5rem); }
.auth-poster::before, .auth-poster::after { position: absolute; border: 1px solid rgba(240,243,236,.3); content: ""; }
.auth-poster::before { width: 53%; height: 36%; right: 9%; bottom: 19%; border-radius: 31% 12% 28% 9%; background: rgba(186,172,255,.18); transform: rotate(10deg); }
.auth-poster::after { width: 57%; height: 27%; left: -15%; top: 16%; border-radius: 12% 36% 7% 28%; background: rgba(215,255,63,.16); transform: rotate(-8deg); }
.auth-poster > * { position: relative; z-index: 1; }
.auth-poster p, .auth-poster span { color: #c5cdd4; font-family: var(--mono); font-size: .62rem; font-weight: 750; letter-spacing: .12em; }
.auth-poster strong { max-width: 8ch; color: #f5f8ee; font-family: var(--display); font-size: clamp(3rem, 6vw, 6rem); font-weight: 650; letter-spacing: -.06em; line-height: .85; }
.auth-panel { display: grid; place-items: center; background: var(--canvas); padding: clamp(2rem, 6vw, 6rem) clamp(1rem, 6vw, 8rem); }
.auth-panel__inner { width: min(100%, 29rem); }
.auth-panel h1 { margin-top: .5rem; font-family: var(--display); font-size: clamp(2.5rem, 4vw, 4.2rem); font-weight: 650; letter-spacing: -.055em; line-height: .86; }
.auth-intro { margin-top: .95rem; color: var(--muted); font-size: .89rem; line-height: 1.7; }
.auth-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 2rem; border: 1px solid var(--line); background: var(--line); }
.auth-tabs button { background: var(--surface-inset); padding: .75rem; color: var(--muted); font-size: .78rem; font-weight: 780; }
.auth-tabs button[aria-selected="true"] { background: var(--surface-raised); color: var(--lime); }
.auth-form { display: grid; gap: .95rem; margin-top: 1.4rem; }
.auth-form .form-message { margin-top: -.1rem; margin-bottom: -.5rem; }
.auth-footnote { margin-top: 1.2rem; color: var(--dim); font-size: .7rem; line-height: 1.65; }

/* Studio */
.workflow-tabs, .workspace-tabs { display: flex; overflow-x: auto; gap: .25rem; border-bottom: 1px solid var(--line); padding-bottom: .65rem; }
.workflow-tabs button, .workspace-tabs button { flex: 0 0 auto; background: transparent; padding: .62rem .72rem; color: var(--muted); font-size: .78rem; font-weight: 760; }
.workflow-tabs button span { margin-right: .35rem; color: var(--dim); font-family: var(--mono); font-size: .63rem; }
.workflow-tabs button[aria-selected="true"], .workspace-tabs button[aria-selected="true"] { border-bottom: 2px solid var(--lime); color: var(--ink); }
.workflow-tabs button[aria-selected="true"] span { color: var(--lime); }
.workspace-tabs { display: none; }
.studio-workspace { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(16rem, .55fr) minmax(17rem, .7fr); gap: 1px; margin-top: 1rem; border: 1px solid var(--line); background: var(--line); }
.workspace-pane { min-width: 0; background: var(--surface); padding: clamp(1rem, 2.2vw, 1.55rem); }
.workspace-pane--quote { background: #10141a; }
.workspace-pane--result { background: #131722; }
.pane-heading { display: flex; gap: .78rem; border-bottom: 1px solid var(--line); padding-bottom: 1rem; }
.pane-heading > span { color: var(--dim); font-family: var(--mono); font-size: 1.04rem; font-weight: 750; letter-spacing: -.08em; }
.pane-heading h2 { font-size: .91rem; }
.pane-heading p { margin-top: .14rem; color: var(--dim); font-size: .69rem; line-height: 1.55; }
.studio-form { display: grid; gap: .98rem; margin-top: 1.25rem; }
.upload-field { display: grid; gap: .44rem; }
.file-input { width: 100%; border: 1px dashed var(--line-strong); border-radius: var(--radius-sm); background: var(--surface-inset); padding: .63rem; color: var(--muted); font-size: .72rem; }
.file-input[aria-invalid="true"] { border-color: var(--danger); }
.file-input::file-selector-button { margin-right: .65rem; border: 0; border-radius: .3rem; background: var(--surface-raised); padding: .44rem .6rem; color: var(--ink); font-size: .69rem; font-weight: 750; }
.file-input:hover::file-selector-button { background: #252c37; }
.upload-list { display: grid; gap: .38rem; list-style: none; }
.upload-item { display: flex; gap: .55rem; align-items: center; justify-content: space-between; border: 1px solid #37434c; background: #121a1a; padding: .42rem .55rem; color: #b6c8c6; font-size: .69rem; }
.upload-item button { background: transparent; color: var(--muted); font-size: .68rem; text-decoration: underline; text-underline-offset: .17em; }
.upload-item button:hover { color: var(--danger); }
.advanced-options { border-top: 1px solid var(--line); padding-top: .8rem; }
.advanced-options summary { color: var(--muted); font-size: .75rem; font-weight: 750; cursor: pointer; }
.advanced-options[open] summary { color: var(--ink); }
.advanced-options > .field { margin-top: .8rem; }
.check-row { display: grid; grid-template-columns: 1rem minmax(0, 1fr); gap: .7rem; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-inset); padding: .74rem; color: var(--ink); cursor: pointer; }
.check-row:has(input:checked) { border-color: #728b3b; background: #171e13; }
.check-row input { width: 1rem; height: 1rem; margin: .11rem 0 0; accent-color: var(--lime); }
.check-row strong { display: block; font-size: .75rem; }
.check-row small { display: block; margin-top: .16rem; color: var(--muted); font-size: .67rem; line-height: 1.55; }
.form-feedback .form-message { margin: 0; }
.quote-card { margin-top: 1.25rem; border: 1px solid var(--line); background: var(--surface-inset); padding: 1rem; }
.quote-card__state { color: var(--lime); font-family: var(--mono); font-size: .63rem; font-weight: 750; letter-spacing: .09em; }
.quote-card dl { display: grid; gap: .68rem; margin-top: 1.15rem; }
.quote-card dl > div { display: flex; gap: .6rem; justify-content: space-between; border-top: 1px solid var(--line); padding-top: .62rem; }
.quote-card dt { color: var(--muted); font-size: .7rem; }
.quote-card dd { color: var(--ink); font-family: var(--mono); font-size: .69rem; font-weight: 750; font-variant-numeric: tabular-nums; text-align: right; }
.quote-card__note { margin-top: 1rem; color: var(--dim); font-size: .7rem; line-height: 1.6; }
.quote-rule { margin-top: 1rem; border-left: 2px solid var(--warning); background: #211c12; padding: .72rem .8rem; }
.quote-rule strong { color: #f2d287; font-size: .73rem; }
.quote-rule p { margin-top: .22rem; color: #cfc39e; font-size: .67rem; line-height: 1.6; }
.workspace-pane--quote .quiet-link { margin-top: 1.2rem; }
.studio-result { margin-top: 1.25rem; }
.studio-result .empty-state { min-height: 20rem; }
.result-links { display: flex; gap: 1rem; margin-top: 1rem; }
.result-links a { border-bottom: 1px solid var(--line-strong); padding-bottom: .16rem; color: var(--muted); font-size: .7rem; font-weight: 750; }
.result-links a:hover { border-color: var(--lime); color: var(--lime); }
.studio-task-result { display: grid; gap: .75rem; border: 1px solid #385148; background: #111d18; padding: 1rem; }
.studio-task-result h3 { color: var(--success); font-size: .84rem; }
.studio-task-result p { color: #b6cac0; font-size: .73rem; line-height: 1.65; }
.studio-task-result a { color: var(--lime); font-size: .74rem; font-weight: 750; }
.motion-billing { display: grid; gap: .55rem; margin-top: .75rem; border: 1px solid #385148; background: #101a16; padding: .72rem; }
.motion-billing > p { color: #d6e8ba; font-family: var(--mono); font-size: .61rem; font-weight: 750; letter-spacing: .08em; }
.motion-billing dl { display: grid; gap: .36rem; }
.motion-billing dl > div { display: flex; gap: .65rem; justify-content: space-between; border-top: 1px solid rgba(182,202,192,.18); padding-top: .38rem; }
.motion-billing dt, .motion-billing dd { font-size: .69rem; line-height: 1.45; }
.motion-billing dt { color: #b6cac0; }
.motion-billing dd { color: var(--ink); font-family: var(--mono); font-variant-numeric: tabular-nums; text-align: right; }
.motion-billing small { color: var(--dim); font-size: .64rem; line-height: 1.5; }

/* Tasks */
.task-toolbar, .gallery-toolbar { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; justify-content: space-between; margin-bottom: 1rem; }
.inline-field { display: grid; width: min(100%, 13rem); gap: .38rem; }
.inline-field .field-control { min-height: 2.35rem; }
.poll-indicator { display: inline-flex; min-height: 2rem; gap: .48rem; align-items: center; color: var(--muted); font-size: .72rem; }
.poll-indicator > span { width: .46rem; height: .46rem; border-radius: 50%; background: var(--dim); }
.poll-indicator[data-state="active"] > span { background: var(--lime); box-shadow: 0 0 0 .22rem rgba(215,255,63,.11); }
.poll-indicator[data-state="paused"] > span { background: var(--warning); }
.task-list { display: grid; gap: .8rem; }
.task-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; border: 1px solid var(--line); background: var(--surface); padding: 1rem; }
.task-card__top { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; }
.task-kind { color: var(--ink); font-size: .83rem; font-weight: 800; }
.task-id { color: var(--dim); font-family: var(--mono); font-size: .62rem; overflow-wrap: anywhere; }
.status-badge { display: inline-flex; gap: .34rem; align-items: center; border: 1px solid var(--line); border-radius: 999px; padding: .24rem .48rem; color: var(--muted); font-family: var(--mono); font-size: .58rem; font-weight: 750; letter-spacing: .05em; }
.status-badge::before { width: .42rem; height: .42rem; border-radius: 50%; background: currentColor; content: ""; }
.status-badge--queued, .status-badge--submitting, .status-badge--polling, .status-badge--archiving { color: var(--cyan); }
.status-badge--succeeded { color: var(--success); }
.status-badge--failed { color: var(--danger); }
.status-badge--reconciliation { color: var(--warning); }
.task-card__prompt { max-width: 59rem; margin-top: .65rem; color: var(--muted); font-size: .78rem; line-height: 1.6; overflow-wrap: anywhere; }
.task-card__details { display: flex; flex-wrap: wrap; gap: .5rem 1rem; margin-top: .7rem; color: var(--dim); font-family: var(--mono); font-size: .62rem; }
.task-card__actions { display: flex; flex-wrap: wrap; gap: .45rem; align-items: start; justify-content: end; }
.task-card__actions .button { min-height: 2.15rem; font-size: .68rem; }
.task-error { margin-top: .75rem; border-left: 2px solid var(--danger); background: #261719; padding: .64rem .7rem; color: #f3b0b6; font-size: .72rem; line-height: 1.6; }
.task-error--reconciliation { border-color: var(--warning); background: #262012; color: #efcf8c; }
.task-results { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; }
.task-result-link { border-bottom: 1px solid var(--line-strong); color: var(--lime); font-size: .72rem; font-weight: 750; }
.task-text-result { display: grid; gap: .55rem; margin-top: .75rem; border: 1px solid #3b4b55; background: #10181c; padding: .72rem; }
.task-text-result > p { color: #a9c6ce; font-family: var(--mono); font-size: .6rem; font-weight: 750; letter-spacing: .08em; }
.task-text-result pre { max-height: 15rem; overflow: auto; margin: 0; color: #d9e8e5; font-family: var(--mono); font-size: .72rem; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.task-text-result .button { justify-self: start; min-height: 2rem; font-size: .66rem; }
.task-text-result small { color: var(--warning); font-size: .66rem; }
.task-policy { margin-top: 2.5rem; border: 1px solid var(--line); background: linear-gradient(105deg, rgba(255,137,147,.09), var(--surface) 48%); padding: 1.35rem; }
.task-policy h2 { margin-top: .45rem; font-family: var(--display); font-size: clamp(1.5rem, 3vw, 2.35rem); font-weight: 650; letter-spacing: -.04em; }
.task-policy p:last-child { max-width: 60rem; margin-top: .7rem; color: var(--muted); font-size: .79rem; line-height: 1.75; }
.task-policy strong { color: var(--ink); }

/* Credits */
.credit-overview { display: grid; grid-template-columns: minmax(14rem, .67fr) minmax(18rem, 1.33fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.credit-balance, .redeem-card { background: var(--surface); padding: clamp(1.2rem, 3vw, 2.2rem); }
.credit-balance { background: linear-gradient(145deg, rgba(215,255,63,.15), rgba(19,23,32,.97) 55%); }
.credit-balance h2 { margin-top: .85rem; color: var(--lime); font-family: var(--display); font-size: clamp(4rem, 7vw, 7rem); font-weight: 650; letter-spacing: -.07em; line-height: .78; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.credit-balance > p { margin-top: .55rem; color: var(--ink); font-family: var(--mono); font-size: .7rem; font-weight: 750; letter-spacing: .1em; }
.credit-balance small { display: block; max-width: 19rem; margin-top: 2.3rem; color: var(--muted); font-size: .72rem; line-height: 1.65; }
.redeem-card h2 { margin-top: .42rem; font-family: var(--display); font-size: clamp(1.85rem, 3vw, 2.65rem); font-weight: 650; letter-spacing: -.04em; }
.redeem-card > p:not(.eyebrow) { max-width: 37rem; margin-top: .6rem; color: var(--muted); font-size: .8rem; line-height: 1.65; }
.redeem-card form { margin-top: 1.5rem; }
.redeem-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; }
.ledger-section { margin-top: 2rem; }
.ledger-table-wrap, .table-scroll { overflow-x: auto; margin-top: 1rem; border: 1px solid var(--line); }
.ledger-table, .admin-table { width: 100%; min-width: 37rem; background: var(--surface); font-size: .76rem; }
.ledger-table th, .admin-table th { padding: .72rem .8rem; border-bottom: 1px solid var(--line); color: var(--dim); font-family: var(--mono); font-size: .59rem; font-weight: 750; letter-spacing: .08em; text-align: left; text-transform: uppercase; }
.ledger-table td, .admin-table td { border-bottom: 1px solid color-mix(in srgb, var(--line) 75%, transparent); padding: .78rem .8rem; color: var(--muted); vertical-align: middle; }
.ledger-table tr:last-child td, .admin-table tr:last-child td { border-bottom: 0; }
.ledger-table td:nth-child(3), .ledger-table td:nth-child(4) { color: var(--ink); font-family: var(--mono); font-variant-numeric: tabular-nums; }
.ledger-positive { color: var(--success) !important; }
.ledger-negative { color: var(--danger) !important; }

/* Keys */
.key-layout { display: grid; grid-template-columns: minmax(17rem, .72fr) minmax(0, 1.28fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.key-create, .key-list-section { background: var(--surface); padding: clamp(1.2rem, 3vw, 2.1rem); }
.key-create h2, .key-list-section h2 { margin-top: .42rem; font-family: var(--display); font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 650; letter-spacing: -.04em; }
.key-create form { display: grid; gap: 1rem; margin-top: 1.25rem; }
.scope-fieldset { display: grid; gap: .5rem; min-width: 0; margin: 0; border: 0; padding: 0; }
.scope-fieldset > p { margin: -.1rem 0 .1rem; color: var(--dim); font-size: .7rem; line-height: 1.55; }
.key-list { display: grid; gap: .7rem; margin-top: 1.2rem; }
.key-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .7rem; border: 1px solid var(--line); background: var(--surface-inset); padding: .8rem; }
.key-row h3 { color: var(--ink); font-size: .82rem; overflow-wrap: anywhere; }
.key-row p { margin-top: .25rem; color: var(--dim); font-family: var(--mono); font-size: .63rem; overflow-wrap: anywhere; }
.key-scopes { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .6rem; }
.key-scope { border: 1px solid #3a4751; border-radius: 999px; background: #121b1f; padding: .15rem .38rem; color: #a8c3cb; font-family: var(--mono); font-size: .57rem; }
.secret-reveal { margin-top: 1.5rem; border: 1px solid #718a39; background: linear-gradient(120deg, #182014, #121812 58%); padding: clamp(1.1rem, 3vw, 2rem); }
.secret-reveal h2 { margin-top: .38rem; color: #f1f8dd; font-family: var(--display); font-size: clamp(1.7rem, 3vw, 2.55rem); font-weight: 650; letter-spacing: -.04em; }
.secret-reveal > p:not(.eyebrow) { max-width: 44rem; margin-top: .6rem; color: #bfcaad; font-size: .78rem; line-height: 1.65; }
.secret-reveal code { display: block; overflow-x: auto; margin-top: 1rem; border: 1px solid #546833; background: #0c1109; padding: .8rem; color: var(--lime); font-family: var(--mono); font-size: .76rem; white-space: nowrap; }
.secret-reveal .button-row { margin-top: 1rem; }

/* Gallery */
.asset-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: .8rem; }
.asset-card { position: relative; overflow: hidden; border: 1px solid var(--line); background: var(--surface); }
.asset-preview { display: grid; width: 100%; min-height: 12rem; place-items: center; background: var(--surface-inset); color: var(--muted); }
.asset-preview img, .asset-preview video { width: 100%; height: 13rem; object-fit: cover; }
.asset-preview audio { width: calc(100% - 1.4rem); }
.asset-card__body { padding: .75rem; }
.asset-card h2 { overflow: hidden; color: var(--ink); font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.asset-card p { margin-top: .22rem; color: var(--dim); font-family: var(--mono); font-size: .6rem; overflow-wrap: anywhere; }
.asset-card__actions { display: flex; gap: .55rem; align-items: center; justify-content: space-between; margin-top: .7rem; }
.asset-card__actions a, .asset-card__actions button { border-bottom: 1px solid var(--line-strong); background: transparent; color: var(--muted); font-size: .68rem; font-weight: 740; }
.asset-card__actions a:hover { border-color: var(--lime); color: var(--lime); }
.asset-card__actions button:hover { border-color: var(--danger); color: var(--danger); }

/* Developer documentation */
.developer-layout { display: grid; grid-template-columns: minmax(12rem, .36fr) minmax(0, 1.64fr); gap: clamp(2rem, 6vw, 6rem); }
.doc-nav { position: sticky; top: 5.4rem; display: grid; align-self: start; border-top: 1px solid var(--line); }
.doc-nav a { border-bottom: 1px solid var(--line); padding: .67rem .2rem; color: var(--muted); font-size: .75rem; font-weight: 730; }
.doc-nav a:hover { color: var(--lime); }
.doc-content { display: grid; gap: 3.5rem; max-width: 52rem; }
.doc-content section { scroll-margin-top: 6rem; }
.doc-content h2 { margin-top: .4rem; color: var(--ink); font-family: var(--display); font-size: clamp(2rem, 4vw, 3.6rem); font-weight: 650; letter-spacing: -.05em; line-height: .9; }
.doc-content p:not(.eyebrow) { margin-top: .85rem; color: var(--muted); font-size: .87rem; line-height: 1.78; }
.doc-content code { color: #d7e2e7; font-family: var(--mono); font-size: .84em; }
.doc-content p code { border: 1px solid var(--line); background: var(--surface-inset); padding: .12rem .28rem; }
.doc-content pre { overflow-x: auto; margin-top: 1.1rem; border: 1px solid var(--line); border-left: 2px solid var(--lime); background: #0c0f14; padding: 1rem; color: #dce7cf; font-size: .76rem; line-height: 1.72; }
.doc-content pre code { color: inherit; }
.model-list { display: grid; gap: .65rem; margin-top: 1rem; }
.model-list > p { border: 1px dashed var(--line); margin: 0 !important; padding: 1rem; color: var(--dim) !important; font-size: .75rem !important; }
.model-entry { border: 1px solid var(--line); background: var(--surface); padding: .85rem; }
.model-entry h3 { color: var(--ink); font-size: .86rem; }
.model-entry p { margin-top: .2rem !important; color: var(--dim) !important; font-size: .68rem !important; }
.model-entry dl { display: grid; gap: .35rem; margin-top: .7rem; }
.model-entry dl > div { display: flex; gap: 1rem; justify-content: space-between; border-top: 1px solid var(--line); padding-top: .4rem; color: var(--muted); font-size: .72rem; }
.model-entry dd { color: var(--lime); font-family: var(--mono); font-size: .68rem; }
.doc-callout { border: 1px solid #465337; background: #151b13; padding: 1.2rem; }
.doc-callout ul { display: grid; gap: .6rem; margin-top: 1rem; padding-left: 1.25rem; color: #c1cfb3; font-size: .8rem; line-height: 1.65; }

/* Admin */
.admin-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; border: 1px solid var(--line); background: var(--line); }
.admin-summary > div { background: var(--surface); padding: 1rem; }
.admin-summary span { display: block; color: var(--dim); font-family: var(--mono); font-size: .59rem; font-weight: 750; letter-spacing: .09em; }
.admin-summary strong { display: block; margin-top: .35rem; color: var(--lime); font-family: var(--display); font-size: clamp(1.85rem, 3.5vw, 3.2rem); font-weight: 650; letter-spacing: -.05em; line-height: .85; font-variant-numeric: tabular-nums; }
.admin-actions-grid, .admin-data-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 1.25rem; border: 1px solid var(--line); background: var(--line); }
.admin-form-card, .admin-section { background: var(--surface); padding: clamp(1rem, 2.5vw, 1.5rem); }
.admin-form-card h2, .admin-section h2 { margin-top: .35rem; font-family: var(--display); font-size: clamp(1.65rem, 2.8vw, 2.45rem); font-weight: 650; letter-spacing: -.04em; }
.admin-form-card form { display: grid; gap: .85rem; margin-top: 1rem; }
.admin-section { margin-top: 1.25rem; border: 1px solid var(--line); }
.admin-section .section-line > p { max-width: 22rem; color: var(--muted); font-size: .72rem; line-height: 1.55; text-align: right; }
.admin-data-grid .admin-section { margin-top: 0; border: 0; }
.reconcile-list { display: grid; gap: .65rem; margin-top: 1rem; }
.reconcile-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, .7fr); gap: 1rem; border: 1px solid #604e25; background: #211d13; padding: .8rem; }
.reconcile-card h3 { color: #f1d583; font-size: .82rem; overflow-wrap: anywhere; }
.reconcile-card p { margin-top: .28rem; color: #d8c895; font-size: .7rem; line-height: 1.55; overflow-wrap: anywhere; }
.reconcile-card form { display: grid; gap: .45rem; }
.reconcile-card label { color: #c8b97f; font-size: .63rem; font-weight: 740; }
.reconcile-card .field-control { min-height: 2.3rem; border-color: #5d522d; background: #17140c; }
.secret-code-list { display: grid; gap: .38rem; margin-top: 1rem; }
.secret-code-list code { margin: 0; }
.audit-list { display: grid; gap: .55rem; list-style: none; margin-top: 1rem; }
.audit-list li { border-bottom: 1px solid var(--line); padding-bottom: .55rem; color: var(--muted); font-size: .72rem; line-height: 1.55; }
.audit-list li:last-child { border-bottom: 0; }
.audit-list strong { color: var(--ink); }

@keyframes spin { to { transform: rotate(360deg); } }

@media (max-width: 1050px) {
  .home-hero { grid-template-columns: minmax(0, 1fr) minmax(19rem, .8fr); }
  .studio-workspace { grid-template-columns: minmax(0, 1fr) minmax(16rem, .65fr); }
  .workspace-pane--result { grid-column: 1 / -1; }
  .ai-catalog { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
  .site-header__inner { grid-template-columns: auto auto 1fr; gap: .6rem; }
  .menu-toggle { display: inline-flex; justify-self: start; }
  .site-nav { position: absolute; top: calc(100% + .35rem); right: .7rem; left: .7rem; display: grid; justify-content: stretch; border: 1px solid var(--line); background: var(--surface-raised); padding: .35rem; box-shadow: var(--shadow-float); }
  .site-nav a { padding: .75rem; }
  .site-nav a[aria-current="page"]::after { right: auto; bottom: .35rem; left: .75rem; width: 1.35rem; }
  .site-header__actions { gap: .35rem; }
  .account-link, .site-header__actions .link-button { display: none; }
  .home-hero { min-height: auto; grid-template-columns: 1fr; padding-top: 4.5rem; }
  .home-hero__copy { max-width: none; }
  .poster-stack { min-height: 29rem; max-width: 34rem; margin-top: 1rem; }
  .stage-control { position: relative; top: auto; right: auto; margin: -2.6rem 1rem 2rem auto; }
  .route-section, .handoff-section { grid-template-columns: 1fr; }
  .pricing-heading { display: block; }
  .pricing-heading > p { margin-top: 1rem; }
  .pricing-grid { grid-template-columns: 1fr; }
  .developer-layout { grid-template-columns: 1fr; }
  .doc-nav { position: static; display: flex; overflow-x: auto; gap: .15rem; border-top: 0; border-bottom: 1px solid var(--line); }
  .doc-nav a { flex: 0 0 auto; border-bottom: 0; }
  .key-layout, .credit-overview { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .site-footer { grid-template-columns: 1fr; gap: .65rem; }
  .page-heading { display: block; }
  .page-heading > .button, .page-heading > a { margin-top: 1.15rem; }
  .field-grid, .field-grid--three { grid-template-columns: 1fr; }
  .home-stage__canvas { display: none; }
  .home-stage__grid { height: 37rem; }
  .home-hero h1 { font-size: clamp(3.15rem, 14vw, 5rem); }
  .hero-facts, .pricing-meta { grid-template-columns: 1fr; }
  .poster-stack { min-height: 25rem; }
  .poster-card--primary { width: 58%; min-width: 0; }
  .poster-card--secondary { width: 48%; min-width: 0; }
  .poster-card--tertiary { width: 56%; min-width: 0; }
  .poster-card strong { font-size: clamp(1.65rem, 8vw, 2.9rem); }
  .poster-card--secondary strong { font-size: clamp(1.35rem, 6vw, 2.3rem); }
  .poster-card--tertiary strong { font-size: clamp(1.18rem, 5vw, 1.8rem); }
  .route-list li { grid-template-columns: 2.5rem 1fr; }
  .route-list a { grid-column: 2; justify-self: start; }
  .ai-rates, .pricing-secondary { grid-template-columns: 1fr; }
  .auth-layout { grid-template-columns: 1fr; }
  .auth-poster { min-height: 15rem; padding: 1.5rem; }
  .auth-poster strong { font-size: 3.2rem; }
  .auth-poster span { display: none; }
  .auth-panel { padding: 2.5rem 1rem 4rem; }
  .workspace-tabs { display: flex; margin-top: 1rem; }
  .studio-workspace { display: block; margin-top: 0; border-top: 0; }
  .workspace-pane { border-bottom: 1px solid var(--line); }
  .workspace-pane--result { border-bottom: 0; }
  .workspace-pane[data-workspace-panel][hidden] { display: none !important; }
  .task-card { grid-template-columns: 1fr; }
  .task-card__actions { justify-content: start; }
  .redeem-row { grid-template-columns: 1fr; }
  .admin-summary { grid-template-columns: repeat(2, 1fr); }
  .admin-actions-grid, .admin-data-grid { grid-template-columns: 1fr; }
  .reconcile-card { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .admin-summary, .admin-actions-grid, .admin-data-grid, .admin-section, .admin-form-card { min-width: 0; }
  .admin-summary > div { min-width: 0; overflow: hidden; padding: .78rem; }
  .admin-summary strong { font-size: 2rem; overflow-wrap: anywhere; }
  .admin-section .section-line { flex-wrap: wrap; align-items: flex-start; }
  .admin-section .section-line > p { max-width: none; text-align: left; }
}

@media (max-width: 430px) {
  .site-header__actions .button--quiet { display: none; }
  .credit-chip span:last-child { display: none; }
  .credit-chip { padding-inline: .55rem; }
  .brand { font-size: .62rem; }
  .home-hero { padding-top: 3.25rem; }
  .poster-stack { min-height: 22rem; }
  .poster-card { padding: .8rem; }
  .poster-card__note { font-size: .62rem; }
  .rate-table__head, .rate-table__body > div { grid-template-columns: .45fr 1fr 1fr; gap: .3rem; }
  .rate-table__body > div { font-size: .65rem; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .home-stage__canvas { display: none; }
}