/* Hallmark · genre: modern-minimal · theme: Teal (owner update 2026-11-03) · shape: app screen
 * scope: app · signature: one clear instruction and its grounded target · finish-review: subagent · 7 findings · 7 resolved after scoring fixes · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S4 R5 V3 · weakest: V, shared account conventions intentionally preserve the approved layout with the owner’s teal accent and keep task controls predictable. */
/* Hallmark · answered F4 · Only the ink button is primary. Cotton secondary controls follow the teal palette, and prelaunch plan actions use this subdued treatment. */
:root {
  color-scheme: light;
  --space-3xs: 2px; --space-2xs: 4px; --space-xs: 8px; --space-sm: 12px; --space-md: 16px; --space-lg: 24px; --space-xl: 40px; --space-2xl: 64px; --space-3xl: 96px; --space-4xl: 144px;
  --text-xs: 0.8125rem; --text-sm: 0.875rem; --text-md: 1rem; --text-lg: 1.25rem; --text-xl: 1.5625rem; --text-2xl: 1.953rem; --text-3xl: 2.441rem;
  --text-display-s: clamp(2.25rem, 4vw + 0.5rem, 3.75rem); --text-display: clamp(2.75rem, 5vw + 1rem, 5.25rem);
  --text-section: clamp(2rem, 2.5vw + 1rem, 3.5rem); --text-title: clamp(1.25rem, 0.75vw + 0.875rem, 1.625rem); --text-lead: clamp(1.125rem, 0.35vw + 1rem, 1.375rem);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); --ease-in: cubic-bezier(0.7, 0, 0.84, 0); --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms; --dur-short: 220ms; --dur-long: 420ms;
  --color-error: oklch(52% 0.19 27); --color-success: oklch(50% 0.12 150);
  --container: 1440px; --gutter: 64px; --gap-columns: 32px; --section-gap-s: 120px; --section-gap: 144px; --section-gap-l: 176px;
  --z-base: 1; --z-raised: 10; --z-dropdown: 100; --z-sticky: 200; --z-sticky-nav: 300; --z-modal: 400; --z-toast: 500; --z-tooltip: 600;
  --color-paper: oklch(97% 0.006 55); --color-paper-2: oklch(94.5% 0.007 55); --color-paper-3: oklch(91.5% 0.009 55);
  --color-ink: oklch(21% 0.012 38); --color-ink-2: oklch(29% 0.013 40); --color-muted: oklch(47% 0.013 45);
  --color-rule: oklch(87% 0.009 55); --color-rule-2: oklch(81% 0.011 55);
  --color-accent: #8cbdb8; --color-accent-ink: oklch(21% 0.012 38); --color-accent-2: #286b68; --color-focus: #286b68;
  --color-cotton: oklch(98.8% 0.0045 80); --color-desk: oklch(94.3% 0.008 64); --color-print: oklch(23% 0.012 38);
  --color-board: oklch(22% 0.011 40); --color-board-type: oklch(96.5% 0.006 70); --color-paid: #286b68;
  --tex-cotton: url("cotton.svg"); --tex-desk: url("felt.svg");
  --shade: 32% 0.03 50; --lit: 100% 0.005 80; --deep: 7% 0.01 40;
  --font-display: "Chillax", ui-sans-serif, system-ui, sans-serif; --font-body: var(--font-display);
  --font-outlier: var(--font-display);
  --radius-card: 8px; --radius-input: 6px; --radius-pill: 999px; --radius-stock: 8px; --rule-hair: 1px;
  --shadow-card: 0 1px 2px oklch(20% 0.01 35 / 0.05);
  --edge-stock: inset 0 1px 0 oklch(var(--lit) / 0.9), inset 0 -1px 0 oklch(var(--shade) / 0.07), 0 0 0 0.5px oklch(var(--shade) / 0.22), 0 1px 0 oklch(var(--shade) / 0.12);
  --cast-stock: 6px 5px 10px -6px oklch(var(--shade) / 0.3); --cast-stock-lift: 12px 10px 18px -8px oklch(var(--shade) / 0.3);
  --press-groove: inset 1px 1.5px 2px oklch(var(--shade) / 0.16), inset -1px -1px 0 oklch(var(--lit) / 0.9), 0 0 0 0.5px oklch(var(--shade) / 0.2);
  --tracking-display: -0.03em; --display-weight: 600;
}

/* Chillax by Indian Type Foundry. Unmodified official Fontshare variable font.
 * One self-hosted file covers the complete 200–700 weight range.
 * License: assets/Chillax-LICENSE.txt. */
@font-face { font-family: "Chillax"; src: url("assets/chillax-variable.woff2") format("woff2"); font-weight: 200 700; font-style: normal; font-display: swap; }

/* The approved main-page wordmark, shared by every PLAINGuide surface. */
.wordmark { display: inline-flex; align-items: center; gap: var(--space-sm); min-height: 48px; font-size: 23px; font-weight: 600; letter-spacing: -0.035em; text-decoration: none; white-space: nowrap; }
.brand-name { white-space: nowrap; }
.brand-ai { color: var(--color-accent-2); }
.brand-mark { width: 25px; height: 30px; display: block; position: relative; flex: 0 0 auto; transform: rotate(-8deg); }
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; width: 19px; height: 25px; border: 2px solid var(--color-ink); border-radius: 3px; background: var(--color-paper); }
.brand-mark::before { inset: 0 auto auto 0; }
.brand-mark::after { inset: 5px auto auto 6px; background: var(--color-ink); }
@media (max-width: 40rem) {
  .wordmark { font-size: 19px; gap: var(--space-xs); }
  .brand-mark { transform: scale(0.8) rotate(-8deg); }
}

:root{--color-accent-hover:#a6cdc9;--color-contrast-paper:#fff;--color-contrast-surface:#eee;--color-contrast-ink:#111;--color-contrast-muted:#333;--color-contrast-rule:#666;--color-contrast-border:#555;--color-contrast-accent:#add5d0;--color-contrast-accent-strong:#1d5754;}


*{box-sizing:border-box}
[hidden]{display:none!important}
html{font-size:16px;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-body)}
body{margin:0;line-height:1.6}
button,input,select,textarea{font:inherit;color:inherit}
button,a,input,select,textarea{touch-action:manipulation}
button,a{ -webkit-tap-highlight-color:transparent}
a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
button{cursor:pointer}
button:disabled{cursor:wait;background:var(--color-paper-2);color:var(--color-muted);border-color:var(--color-rule-2)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}
h1,h2,h3,p{margin:0}
h1{font-size:2.074rem;line-height:1.18;font-weight:600;letter-spacing:-.025em}
h2{font-size:1.44rem;line-height:1.3;font-weight:600;letter-spacing:-.015em}
h3{font-size:1.15rem;line-height:1.4;font-weight:600}
p{max-width:68ch}
p+p{margin-top:var(--space-md)}
.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.skip:focus{position:absolute;background:var(--color-paper);padding:var(--space-sm);z-index:10}
.site-header,.site-footer{max-width:1280px;margin:auto;padding:var(--space-lg) var(--space-xl)}
.site-header{display:flex;gap:var(--space-lg);align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-rule)}
.site-nav,.account-nav{display:flex;gap:var(--space-lg);align-items:center;flex-wrap:wrap}
.site-nav a,.account-nav a{display:inline-flex;align-items:center;min-height:44px}
.site-nav a{text-decoration:none}
.site-nav .small-link{border:1px solid var(--color-rule-2);padding:0 var(--space-md);border-radius:var(--radius-input)}
.app-shell{max-width:1100px;margin:auto;padding:48px var(--space-xl) var(--space-3xl);min-height:70vh}
.account-nav{border-bottom:1px solid var(--color-rule);margin-bottom:var(--space-xl);gap:28px}
.account-nav a{padding:0 0 var(--space-md);text-decoration:none;border-bottom:2px solid transparent}
.account-nav a[aria-current=page]{border-bottom-color:var(--color-accent-2);font-weight:600}
.page-intro{margin-bottom:32px}
.page-intro p{margin-top:var(--space-md);color:var(--color-muted);font-size:1.125rem}
.auth-layout{display:grid;grid-template-columns:1fr 1.12fr;gap:80px;align-items:start;max-width:960px;margin:var(--space-lg) auto}
.auth-aside{padding-top:var(--space-lg)}
.auth-aside h1{font-size:2.488rem}
.auth-aside p{margin-top:20px}
.auth-form,.surface{background:var(--color-cotton);border:1px solid var(--color-rule);border-radius:var(--radius-card);padding:32px}
.auth-form h2{margin-bottom:var(--space-lg)}
.auth-form>p:last-child{margin-top:var(--space-lg);font-size:.938rem}
.field{margin-bottom:20px}
.field label{display:block;font-weight:500;margin-bottom:var(--space-xs)}
.field input,.field select,.field textarea{width:100%;min-height:48px;padding:var(--space-sm) var(--space-sm);border:1px solid var(--color-muted);border-radius:var(--radius-input);background:var(--color-cotton)}
.field textarea{resize:vertical;min-height:100px}
.field-hint,.muted,.helper-note{font-size:.938rem;color:var(--color-muted)}
.field-hint{margin-top:var(--space-xs)}
.password-row{display:flex;gap:var(--space-xs)}
.password-row input{min-width:0}
.password-row button{border:0;background:transparent;min-width:56px;min-height:44px;text-decoration:underline}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:var(--space-sm) 20px;gap:var(--space-xs);border:1px solid var(--color-rule-2);border-radius:var(--radius-input);background:var(--color-cotton);text-decoration:none;font-weight:500;line-height:1.4;transition:background var(--dur-micro)}
.button:hover{background:var(--color-paper-2)}
.button.primary{background:var(--color-ink);border-color:var(--color-ink);color:var(--color-cotton);box-shadow:var(--edge-stock),var(--cast-stock)}
.button.primary:hover{background:var(--color-print)}
.button.quiet{background:transparent}
.actions{display:flex;flex-wrap:wrap;gap:var(--space-sm);align-items:center;margin-top:var(--space-lg)}
.notice{border:1px solid var(--color-rule-2);background:var(--color-paper-2);padding:var(--space-md) 20px;margin:20px 0;color:var(--color-ink);overflow-wrap:anywhere}
.notice.error{border-color:var(--color-error)}
.notice p+p{margin-top:var(--space-xs)}
.check{display:flex;align-items:flex-start;gap:var(--space-sm);margin:20px 0;min-height:44px}
.check input{margin-top:var(--space-xs);min-width:20px;width:20px;height:20px;accent-color:var(--color-accent-2)}
.section{margin-top:var(--space-xl);padding-top:32px;border-top:1px solid var(--color-rule)}
.section>h2{margin-bottom:20px}
.section>p{margin-top:var(--space-sm)}
.two-column{display:grid;grid-template-columns:1.3fr 1fr;gap:48px}
.steps{list-style:none;counter-reset:steps;padding:0;margin:var(--space-lg) 0}
.steps li{counter-increment:steps;position:relative;padding:20px 0 var(--space-lg) 52px;border-top:1px solid var(--color-rule)}
.steps li:before{content:counter(steps);position:absolute;left:0;top:20px;font-size:1.2rem;font-weight:600;color:var(--color-muted)}
.steps h3{margin-bottom:var(--space-xs)}
.allowance{font-variant-numeric:tabular-nums;font-size:2.488rem;line-height:1.2;margin:var(--space-lg) 0 var(--space-xs)}
.allowance small{font-size:1rem;color:var(--color-muted)}
progress{display:block;width:100%;height:10px;accent-color:var(--color-accent-2);margin:20px 0}
.data-list{margin:var(--space-lg) 0}
.data-list>div{display:flex;justify-content:space-between;gap:20px;padding:var(--space-md) 0;border-bottom:1px solid var(--color-rule)}
.data-list dd{margin:0;text-align:right;overflow-wrap:anywhere}
.plan-list{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-lg);margin-top:var(--space-lg)}
.plan{padding:28px;border:1px solid var(--color-rule-2);border-radius:var(--radius-card);background:var(--color-cotton)}
.price{font-size:2rem;font-weight:600;margin-top:20px}
.price span{font-size:1rem;font-weight:400}
.plan ul{padding-left:20px}
.plan li{margin:var(--space-sm) 0}
.article{max-width:760px;margin:auto}
.article h2{margin-top:var(--space-xl);margin-bottom:var(--space-md)}
.article h3{margin-top:28px;margin-bottom:var(--space-sm)}
.article ul{padding-left:var(--space-lg)}
.article li{margin:var(--space-xs) 0}
.article .lead{font-size:1.25rem;margin:20px 0 32px}
.article details,.settings-disclosure{border-top:1px solid var(--color-rule);padding:20px 0}
.article summary,.settings-disclosure summary{cursor:pointer;font-size:1.15rem;font-weight:500;min-height:44px;padding:var(--space-xs) 0}
.settings-disclosure>div{padding-top:20px;max-width:520px}
.site-footer{border-top:1px solid var(--color-rule);display:flex;justify-content:space-between;gap:var(--space-lg);flex-wrap:wrap;color:var(--color-muted);font-size:.938rem}
.site-footer nav{display:flex;gap:var(--space-lg);flex-wrap:wrap}
.site-footer a{min-height:44px;display:inline-flex;align-items:center}
.loading{max-width:600px}
.loading span{display:block;height:18px;background:var(--color-paper-3);border-radius:4px;margin:var(--space-md) 0}
.loading span:nth-child(2){width:65%}
.loading p{margin-top:var(--space-lg)}
.empty{padding:28px 0}
.empty h3{margin-bottom:var(--space-sm)}
.request-list{padding:0;list-style:none}
.request-list li{padding:20px 0;border-bottom:1px solid var(--color-rule)}
.request-list code{overflow-wrap:anywhere;font-size:.8rem}
.guidance h2{margin-bottom:20px}
.guidance .instruction{font-size:1.25rem;line-height:1.5}
.target-label{margin-top:20px;display:flex;align-items:center;gap:var(--space-sm);font-size:1rem}
.target-dot{width:16px;height:16px;border:3px solid var(--color-accent-2);outline:2px solid var(--color-cotton);border-radius:3px;flex-shrink:0}
.expected{margin-top:var(--space-lg);border-top:1px solid var(--color-rule);padding-top:20px}
.expected h3{font-size:.938rem;color:var(--color-muted);margin-bottom:var(--space-xs)}
.helper-note{margin-top:20px}
.panel{max-width:620px;padding:20px;margin:auto}
.panel-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-sm);margin-bottom:28px}
.panel-header button{background:transparent;border:0;min-height:44px;text-decoration:underline}
.panel .page-intro h1{font-size:1.728rem}
.panel .surface{padding:var(--space-lg)}
.panel .actions{align-items:stretch}
.panel .actions .button{flex-grow:1}
.panel .guidance{padding:var(--space-2xs)}
.panel small{color:var(--color-muted)}
.demo-workspace{border:1px solid var(--color-rule-2);border-radius:var(--radius-card);padding:var(--space-lg);margin-bottom:var(--space-lg);background:var(--color-cotton)}
.demo-workspace .targeted{outline:3px solid var(--color-accent-2);outline-offset:5px}
.demo-workspace button{margin:20px 0}
.demo-pointer{font-weight:600;color:var(--color-ink)}
.code-output{display:block;padding:var(--space-md);background:var(--color-paper-2);overflow-wrap:anywhere;user-select:all;margin:var(--space-md) 0}

@media(max-width:760px){.site-header,.site-footer{padding:var(--space-md) 20px}
.site-header{flex-wrap:wrap;gap:var(--space-xs)}
.site-nav{gap:var(--space-md)}
.app-shell{padding:28px 20px var(--space-2xl)}
.auth-layout,.two-column,.plan-list{grid-template-columns:1fr;gap:28px}
.auth-layout{margin:0}
.auth-aside{padding:0}
.auth-aside h1{font-size:2.074rem}
.auth-form,.surface{padding:var(--space-lg)}
.account-nav{gap:20px;margin-bottom:28px}
.account-nav a{padding-bottom:var(--space-sm)}
.site-footer{display:block}
.site-footer nav{margin-top:var(--space-md);gap:var(--space-md)}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}

html[data-large-text=true]{font-size:19px}
html[data-contrast=true]{--color-paper:var(--color-contrast-paper);--color-cotton:var(--color-contrast-paper);--color-paper-2:var(--color-contrast-surface);--color-ink:var(--color-contrast-ink);--color-muted:var(--color-contrast-muted);--color-rule:var(--color-contrast-rule);--color-rule-2:var(--color-contrast-border);--color-accent:var(--color-contrast-accent);--color-accent-2:var(--color-contrast-accent-strong)}

@media(max-width:760px){.site-nav{gap:var(--space-sm);font-size:.875rem}
.site-nav .small-link{padding-inline:var(--space-sm)}
.site-nav{width:100%;justify-content:space-between}
.auth-aside .muted{margin-top:var(--space-sm)}
.auth-form .notice{padding:var(--space-sm) var(--space-md)}
}


h1,h2{text-wrap:balance}
.price{font-variant-numeric:tabular-nums}
::selection{background:var(--color-accent);color:var(--color-accent-ink)}
html{scrollbar-color:var(--color-rule-2) var(--color-paper)}
.button{background:var(--color-cotton)}
.button:active{background:var(--color-paper-3);border-color:var(--color-ink)}
.button.primary:active{background:var(--color-print);border-color:var(--color-ink);box-shadow:none}
.button:disabled,.button.primary:disabled{background:var(--color-paper-2);color:var(--color-muted);border-color:var(--color-rule-2);cursor:wait}
.example-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--space-xl);row-gap:var(--space-sm);align-items:start}
.example-instruction{grid-column:2;grid-row:1}
.example-layout .demo-workspace{grid-column:1;grid-row:1 / 3}
.example-confirm{grid-column:2;grid-row:2}
.example-confirm .actions{margin-top:0}
@media(max-width:760px){
  .account-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-xs) var(--space-md)}
  .example-layout{display:flex;flex-direction:column;gap:var(--space-lg)}
  .example-layout>section{width:100%}
  .example-layout .expected{margin-top:var(--space-sm);padding-top:var(--space-sm)}
  .example-layout .guidance h2{margin-bottom:var(--space-sm)}
}



.support-message{white-space:pre-wrap;overflow-wrap:anywhere}
.annual-saving { color: var(--color-accent-2); font-size: var(--text-sm); }
.billing-period { max-width: 22rem; margin-block: var(--space-xl) var(--space-lg); }
.capture-help{min-width:0}.capture-help .field{display:grid;gap:.5rem;margin-block:1.25rem}.capture-help input[type=file]{display:block;width:100%;max-width:20rem;margin-top:.5rem;font:inherit;font-size:var(--text-sm)}.capture-preview{position:relative;margin-block:1rem;background:var(--color-paper-2);border:1px solid var(--color-rule-2);line-height:0}.capture-preview img{width:100%;height:auto;display:block}.capture-region{position:absolute;border:3px solid var(--color-accent-2);box-shadow:0 0 0 2px var(--color-cotton);pointer-events:none;min-width:3px;min-height:3px}.capture-coordinates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}.capture-coordinates label{display:grid;gap:.35rem}.capture-coordinates input{width:100%;min-width:0}.capture-help fieldset{margin-block:1rem;border:1px solid var(--color-rule-2);padding:1rem}.capture-help .check{margin-block:1.25rem}.capture-help .actions{flex-wrap:wrap}.capture-help .button{white-space:normal}

/* Shared two-plan pricing: identical on landing, pricing and account screens. */
.pricing-picker{margin-top:32px;min-width:0}
.billing-selector{border:0;padding:0;margin:0 0 var(--space-lg);display:flex;flex-wrap:wrap;gap:var(--space-sm)}
.billing-selector legend{font-size:1rem;font-weight:500;margin-bottom:var(--space-sm)}
.billing-selector label{display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 18px;border:1px solid var(--color-rule-2);border-radius:var(--radius-input);cursor:pointer;background:var(--color-cotton);font-size:1rem}
.billing-selector label:has(input:checked){background:var(--color-paper-2);border-color:var(--color-accent-2)}
.billing-selector input{accent-color:var(--color-accent-2);width:18px;height:18px;margin:0;flex:none}
.billing-selector input:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}
.billing-selector small{display:inline-block;margin-left:var(--space-xs);color:var(--color-accent-2);font-size:.875rem;font-weight:600}
.pricing-picker .plan-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-lg);margin:0}
.pricing-picker .plan{display:flex;flex-direction:column;min-width:0;padding:32px;border:1px solid var(--color-rule-2);border-radius:var(--radius-card);background:var(--color-cotton)}
.pricing-picker .plan h3{margin:0;font-size:1.5rem;font-weight:600;line-height:1.3}
.pricing-picker .plan-description{margin:var(--space-sm) 0 0;font-size:1rem;color:var(--color-muted)}
.pricing-picker .price{margin:28px 0 0;font-size:2.5rem;font-weight:600;line-height:1.2;font-variant-numeric:tabular-nums;letter-spacing:-.025em}
.pricing-picker .price span{font-size:1rem;font-weight:400;letter-spacing:0;white-space:nowrap}
.pricing-picker .plan-charge{margin:var(--space-xs) 0 0;font-size:.938rem}
.pricing-picker .annual-saving{margin:var(--space-xs) 0 0;font-size:.938rem;color:var(--color-muted);min-height:3em}
.pricing-picker .plan-quota{margin:var(--space-lg) 0 0;padding-top:var(--space-lg);border-top:1px solid var(--color-rule);font-size:1rem}
.pricing-picker .plan-quota strong{display:block;font-size:1.125rem;font-weight:600}
.pricing-picker .plan-feature{font-size:1rem;margin:var(--space-sm) 0 var(--space-lg)}
.pricing-picker .plan-action{margin-top:auto;padding-top:var(--space-xs)}
.pricing-picker .plan-action .button{max-width:100%;white-space:normal}
.pricing-picker [data-cycle=year]{display:none}
.pricing-picker:has(input[value=year]:checked) [data-cycle=month]{display:none}
.pricing-picker:has(input[value=year]:checked) [data-cycle=year]{display:block}

/* One billing switch, shared by public pricing and account checkout. */
.billing-selector.billing-selector-switch{align-items:center;gap:var(--space-sm) var(--space-md)}
.billing-selector.billing-selector-switch .billing-toggle{display:inline-flex;gap:var(--space-sm);padding:0;min-height:48px;border:0;border-radius:0;background:transparent;color:var(--color-muted)}
.billing-toggle-control{position:relative;display:inline-flex;align-items:center;flex:none;width:56px;height:44px}
.billing-selector-switch .billing-toggle-control input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;z-index:1}
.billing-toggle-track{position:relative;display:block;width:56px;height:32px;border-radius:32px;background:var(--billing-switch-track,var(--color-muted));box-shadow:inset 0 0 0 1px var(--billing-switch-edge,transparent);transition:background-color var(--dur-short) var(--ease-in-out)}
.billing-toggle-track::before{content:"";position:absolute;top:4px;left:4px;width:24px;height:24px;border-radius:50%;background:var(--billing-switch-thumb,var(--color-cotton));transform:translateX(0);transition:transform var(--dur-short) var(--ease-in-out)}
.billing-toggle-control input:checked + .billing-toggle-track{background:var(--billing-switch-on,var(--color-accent-2))}
.billing-toggle-control input:checked + .billing-toggle-track::before{transform:translateX(24px);background:var(--billing-switch-on-thumb,var(--color-cotton))}
.billing-toggle-control input:focus-visible + .billing-toggle-track{outline:3px solid var(--color-focus);outline-offset:4px}
.billing-toggle-control input:disabled{cursor:not-allowed}
.billing-toggle-control input:disabled + .billing-toggle-track{opacity:.55}
.billing-toggle:not(:has(input:checked)) .billing-month-label,.billing-toggle:has(input:checked) .billing-year-label{color:var(--color-ink)}
.billing-selector-switch .billing-saving{margin:0;font-size:.875rem;color:var(--color-accent-2);white-space:nowrap}
@media(prefers-reduced-motion:reduce){.billing-toggle-track,.billing-toggle-track::before{transition:none}}
.pricing-allowance-note{margin:20px 0 0;font-size:.938rem;color:var(--color-muted);max-width:68ch}
@media(max-width:42rem){.pricing-picker .plan-list{grid-template-columns:minmax(0,1fr)}.pricing-picker .plan{padding:var(--space-lg)}.billing-selector{gap:var(--space-xs)}.billing-selector label{padding:10px var(--space-sm)}.billing-selector small{margin-left:var(--space-2xs)}}
/* End shared two-plan pricing. */
/* Administration uses the existing paper, ink and teal system with a persistent section menu. */
.pricing-page{max-width:100%}.pricing-page>p,.pricing-page>h2,.pricing-page>section,.pricing-page>.notice{max-width:760px}
.admin-layout{display:grid;grid-template-columns:216px minmax(0,1fr);gap:var(--space-xl);align-items:start}
.admin-menu{display:grid;gap:var(--space-xs);position:sticky;top:24px}
.admin-menu button{background:transparent;border:1px solid transparent;border-radius:var(--radius-input);padding:var(--space-md);text-align:left;min-height:80px;line-height:1.4}
.admin-menu button:hover{background:var(--color-paper-2)}
.admin-menu button[aria-pressed=true]{background:var(--color-cotton);border-color:var(--color-rule-2);box-shadow:inset 3px 0 var(--color-accent-2)}
.admin-menu span{display:block;font-weight:600}.admin-menu small{display:block;font-size:.813rem;line-height:1.5;color:var(--color-muted);margin-top:6px}
.admin-panel{min-width:0}.admin-panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;border-bottom:1px solid var(--color-rule-2);padding-bottom:var(--space-lg);margin-bottom:28px}
.admin-panel-heading p{margin-top:var(--space-xs);color:var(--color-muted)}.admin-panel-heading>.button{flex:none}
.admin-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.admin-summary>section{min-width:0}.admin-section{border-top:1px solid var(--color-rule-2);padding-top:32px;margin-top:32px}
.admin-section-heading{margin-bottom:20px}.admin-section-heading>p,.admin-section>h3+p{margin-top:var(--space-sm)}
.admin-panel .data-list>div{padding:var(--space-md) 0;align-items:baseline}.admin-panel .data-list dt{color:var(--color-muted);overflow-wrap:anywhere}.admin-panel .data-list dd{max-width:60%}
.admin-panel .settings-disclosure{margin-top:20px}.admin-panel .settings-disclosure form{padding:20px 0 0;max-width:620px}
.admin-reference{font-size:.813rem;overflow-wrap:anywhere;color:var(--color-muted)}
.admin-footnote{margin-top:32px;font-size:.938rem;color:var(--color-muted)}
.admin-status{display:inline-block;font-size:.875rem;border:1px solid var(--color-rule-2);border-radius:var(--radius-input);padding:3px 9px;background:var(--color-paper-2);white-space:nowrap;text-transform:capitalize}
.table-scroll{position:relative;overflow-x:auto;max-width:100%;margin-top:var(--space-lg);overscroll-behavior-x:contain}
.table-scroll:focus-visible{outline:3px solid var(--color-focus);outline-offset:4px}
.admin-table,.help-matrix{border-collapse:collapse;width:100%;text-align:left;table-layout:fixed;min-width:620px}
.admin-table caption,.help-matrix caption{text-align:left;font-size:.938rem;color:var(--color-muted);padding-bottom:var(--space-md)}
.admin-table th,.admin-table td,.help-matrix th,.help-matrix td{padding:20px var(--space-md);border-bottom:1px solid var(--color-rule-2);vertical-align:top;overflow-wrap:anywhere}
.admin-table th:first-child,.admin-table td:first-child,.help-matrix th:first-child,.help-matrix td:first-child{padding-left:0}
.admin-table th:last-child,.admin-table td:last-child,.help-matrix th:last-child,.help-matrix td:last-child{padding-right:0}
.admin-table thead th,.help-matrix thead th{font-weight:500;font-size:.875rem;color:var(--color-muted);padding-top:0;padding-bottom:14px}
.admin-table tbody th{font-weight:400}.admin-table .button{min-height:44px;padding:9px var(--space-sm);font-size:.875rem;white-space:normal}
.admin-table .admin-record-title{display:block;font-weight:600;font-size:1rem}.admin-record-meta{display:block;font-size:.875rem;color:var(--color-muted);margin-top:var(--space-xs)}
.admin-snippet{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.admin-email{font-size:.938rem}
.admin-table pre{white-space:pre-wrap;word-break:break-word;max-width:100%;font-size:.813rem}
.admin-table summary{cursor:pointer;min-height:44px;font-size:.875rem}
.admin-filters{padding:0 0 var(--space-lg);border-bottom:1px solid var(--color-rule);margin-bottom:28px}.admin-filters>form{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) auto;gap:var(--space-md);align-items:end}
.admin-filters .field{margin:0}.admin-filters>.field{max-width:320px}.admin-filters form>.notice{grid-column:1/-1}.admin-filters form>button{margin:0;white-space:nowrap;padding-inline:14px;font-size:.938rem}
.admin-loading{margin:20px 0;color:var(--color-muted)}
.admin-conversation{list-style:none;padding:0;margin:var(--space-lg) 0 0}.admin-conversation li{border-bottom:1px solid var(--color-rule-2);padding:var(--space-lg) 0}.admin-conversation li:first-child{border-top:1px solid var(--color-rule-2)}
.admin-message-heading{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-md);flex-wrap:wrap;margin-bottom:var(--space-md)}.admin-message-heading time{font-size:.875rem;color:var(--color-muted)}
.admin-original-message{border-left:3px solid var(--color-accent-2);padding:var(--space-2xs) 0 var(--space-2xs) 20px;margin:var(--space-lg) 0}.admin-original-message h4{font-size:1rem;font-weight:600;margin:0 0 var(--space-sm)}
.admin-section>form{margin-top:var(--space-lg)}.admin-form-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:20px}
.admin-confirmation{border-top:1px solid var(--color-rule);margin:var(--space-lg) 0;padding:var(--space-lg) 0 0;max-width:520px}.admin-confirmation h3{margin-bottom:var(--space-lg)}
@media(min-width:70rem){.app-shell:has(.admin-workspace){max-width:1280px}}
@media(max-width:60rem){.admin-layout{grid-template-columns:minmax(0,1fr);gap:32px}.admin-menu{position:static;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-xs)}.admin-menu button{padding:var(--space-sm);min-height:76px}.admin-menu small{display:none}.admin-filters>form{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}.admin-filters form>button{justify-self:start}.admin-summary{gap:var(--space-lg)}}
@media(max-width:40rem){.admin-menu{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-menu button{min-height:56px}.admin-panel-heading{gap:var(--space-sm)}.admin-panel-heading h2{font-size:1.3rem}.admin-panel-heading .button{padding:10px 14px}.admin-summary{grid-template-columns:minmax(0,1fr);gap:var(--space-md)}.admin-filters>form,.admin-form-columns{grid-template-columns:minmax(0,1fr)}.admin-panel .data-list>div{gap:var(--space-md)}.admin-table,.help-matrix{min-width:580px}.admin-section{padding-top:var(--space-lg);margin-top:var(--space-lg)}}

.admin-table thead th:first-child{width:34%}.admin-table thead th:last-child{width:20%}

@media(forced-colors:active){:root{--billing-switch-track:Canvas;--billing-switch-thumb:CanvasText;--billing-switch-on:Highlight;--billing-switch-on-thumb:HighlightText;--billing-switch-edge:CanvasText}.billing-toggle-track{forced-color-adjust:none}}
/* Native-app approval keeps the public code prominent without exposing tokens. */
.desktop-connect{max-width:46rem}.desktop-connect .surface{padding:clamp(1.5rem,4vw,3rem)}.desktop-matching-code{font-size:clamp(1.8rem,6vw,3rem);font-weight:650;letter-spacing:.12em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
