/* GENERATED — python3 tools/blog-generate.py · DO NOT EDIT BY HAND.
   Source: design/system/components/bundle.css (sections 2, 4, 5, 6, 7, 8, 9, 12, 21, 22, 23, 30, 31 + accessibility). Token root and frame (Button, ConsentBar…) are in the generated section of shared.css. */
/* ── 2 · Site shell and section ───────────────────────────── */
.as-site{background:var(--page);container:assite / inline-size}
.as-container{inline-size:100%;max-inline-size:var(--w-page);margin-inline:auto;padding-inline:var(--space-24)}
.as-section{padding-block:var(--space-96);background:var(--page)}
.as-section--alt{background:var(--page-alt)}
/* First section under a hero: the hero already carries the gap, so the first screen reaches the content. */
.as-container:has(> .as-hero) + .as-section{padding-block-start:var(--space-32)}
.as-sechead{display:flex;flex-direction:column;gap:12px;align-items:center;text-align:center;
  margin-block-end:var(--space-48)}
.as-sechead--start{align-items:flex-start;text-align:start}
.as-sechead h2{font:700 34px/1.12 var(--font-brand);letter-spacing:-.025em;text-wrap:balance;max-inline-size:22ch}
.as-sechead p{font-size:19px;line-height:1.45;color:var(--label-2);max-inline-size:var(--w-text);text-wrap:pretty}
@container assite (max-width:734px){
  .as-container{padding-inline:var(--space-16)}
  .as-section{padding-block:var(--space-64)}
  .as-sechead h2{font-size:26px}
  .as-sechead p{font-size:17px}
}

/* ── 4 · Hero ────────────────────────────────────────────── */
.as-hero{padding-block:var(--space-48) var(--space-32);text-align:center;display:flex;flex-direction:column;
  align-items:center;gap:20px}
.as-hero h1{font:700 48px/1.08 var(--font-brand);letter-spacing:-.03em;text-wrap:balance;max-inline-size:18ch}
.as-hero h1 em{font-style:normal;color:var(--brand-ink)}
.as-hero__lead{font-size:19px;line-height:1.45;color:var(--label-2);max-inline-size:var(--w-text);text-wrap:pretty}
.as-hero__cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 24px;margin-block-start:8px}
.as-hero__badge{margin-block-start:4px;block-size:40px}
.as-hero__badge img{block-size:100%;inline-size:auto;display:block}
.as-hero__support{display:flex;flex-direction:column;align-items:center;gap:10px;margin-block-start:16px}
.as-hero__support-row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px}
.as-hero__support-lbl{font-size:12px;color:var(--label-3);margin-inline-end:4px}
@container assite (max-width:734px){
  .as-hero{padding-block:var(--space-32) var(--space-24)}
  .as-hero h1{font-size:34px}
  .as-hero__lead{font-size:17px}
}
/* Text-page heading (profile, blog post, legal): headline 28. A marketing page carrying a section heading
   (site-title 34; pricing, landing) uses as-hero, so h1 is never smaller than h2. */
.as-pagehead{padding-block:var(--space-64) var(--space-32);display:flex;flex-direction:column;gap:12px}
.as-pagehead h1{font:700 28px/1.15 var(--font-brand);letter-spacing:-.025em;text-wrap:balance;max-inline-size:28ch}
.as-pagehead p{font-size:17px;line-height:1.45;color:var(--label-2);max-inline-size:var(--w-text);text-wrap:pretty}
@container assite (max-width:734px){.as-pagehead{padding-block:var(--space-48) var(--space-24)}}

/* ── 5 · SupportPill (platform · browser): a status indicator, r-pill ── */
.as-pill{display:inline-flex;align-items:center;gap:6px;min-block-size:var(--h-inline);padding:0 12px;
  border-radius:var(--r-pill);background:var(--card);border:1px solid var(--sep);font-size:13px;font-weight:500;
  color:var(--label);white-space:nowrap}
.as-section--alt .as-pill,.as-pill--on-alt{background:var(--card)}
.as-pill__dot{inline-size:7px;block-size:7px;border-radius:var(--r-pill);background:var(--success);flex:0 0 auto}
.as-pill__state{font-size:12px;font-weight:400;color:var(--label-2)}
.as-pill--soon{color:var(--label-2)}
.as-pill--soon .as-pill__dot{background:transparent;box-shadow:inset 0 0 0 1.5px var(--label-3)}
.as-pill__note{font-size:12px;font-weight:400;color:var(--label-3)}
/* a pill carrying a sentence (pricing trust row) wraps in a narrow container */
.as-pill--wrap{white-space:normal;max-inline-size:100%;min-inline-size:0}

/* ── 6 · Feature box ─────────────────────────────────────── */
.as-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--space-20)}
.as-tile{background:var(--card);border-radius:var(--r-tile);padding:var(--space-32);display:flex;flex-direction:column;
  gap:10px;min-inline-size:0;color:inherit;text-decoration:none;font-size:17px;
  transition:box-shadow var(--dur-base) var(--ease-standard),transform var(--dur-base) var(--ease-standard)}
.as-section:not(.as-section--alt) .as-tile{background:var(--page-alt)}
a.as-tile:hover{box-shadow:var(--shadow-card);transform:translateY(-2px)}
.as-tile__ico{inline-size:32px;block-size:32px;color:var(--brand-ink);margin-block-end:6px}
.as-tile__ico .as-ico{inline-size:100%;block-size:100%;stroke-width:1.5}
.as-tile h3{font-size:21px;line-height:1.25;font-weight:600;letter-spacing:-.01em;text-wrap:balance}
.as-tile p{font-size:17px;line-height:1.45;color:var(--label-2);text-wrap:pretty}
.as-tile__media{margin-block-start:auto;padding-block-start:16px}
.as-tile__media img{display:block;inline-size:100%;block-size:auto;border-radius:var(--r-surf)}
/* ordered box list (e.g. checklist): ol/ul without markers */
ol.as-tiles,ul.as-tiles{list-style:none;padding:0}

/* ── 7 · Comparison frame ────────────────────────────────── */
.as-compare{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:var(--space-20);align-items:stretch}
.as-compare__pane{border-radius:var(--r-tile);padding:var(--space-32) var(--space-24);display:flex;flex-direction:column;
  gap:16px;min-inline-size:0}
.as-compare__pane--them{background:var(--page-alt);border:1px solid var(--sep)}
.as-section--alt .as-compare__pane--them{background:var(--page)}
.as-compare__pane--us{background:var(--card);box-shadow:var(--shadow-raise)}
.as-compare__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.as-compare__head h3{font-size:21px;line-height:1.25;font-weight:600;letter-spacing:-.01em}
.as-compare__head span{font-size:13px;color:var(--label-2)}
.as-compare__stage{display:flex;justify-content:center;align-items:flex-start;min-inline-size:0}
.as-compare__stage > *{inline-size:100%;max-inline-size:340px;min-inline-size:280px}
.as-compare__foot{font-size:15px;line-height:1.45;color:var(--label-2)}
.as-compare__stage img{display:block;inline-size:100%;block-size:auto;border-radius:var(--r-surf)}
/* numbered steps in the competitor pane */
.as-compare__list{display:flex;flex-direction:column;gap:var(--space-8);padding-inline-start:var(--space-20);color:var(--label-2)}
@container assite (max-width:860px){.as-compare{grid-template-columns:minmax(0,1fr)}}

/* ── 8 · Pricing card ────────────────────────────────────── */
/* four cards on one row at desktop width, 2 × 2 at ≤ 1024, one column on a phone (W23) */
.as-prices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-20);align-items:stretch}
@container assite (max-width:1024px){.as-prices{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container assite (max-width:734px){.as-prices{grid-template-columns:minmax(0,1fr)}}
.as-price{background:var(--card);border:1px solid var(--sep);border-radius:var(--r-tile);padding:var(--space-24);
  display:flex;flex-direction:column;gap:16px;min-inline-size:0;position:relative}
/* card tones: Free plain grey · Starter brand blue edge · Pro (recommended) soft gradient · Team graphite */
.as-price--free{background:var(--card-2)}
.as-price--starter{border-color:var(--brand)}
.as-price--starter .as-price__name{color:var(--brand-ink)}
.as-price--rec{border:2px solid var(--brand);box-shadow:var(--shadow-raise);background:linear-gradient(180deg,var(--card) 35%,var(--brand-soft))}
.as-price--team{background:var(--label);border-color:var(--label);color:var(--on-brand)}
.as-price--team .as-price__desc,.as-price--team .as-price__list{color:var(--fill)}
.as-price--team .as-price__list .as-ico{color:var(--on-brand)}
.as-price--team .as-btn{background:var(--card);border-color:var(--card);color:var(--label)}
/* a word in place of an amount ("Custom pricing") wraps at a smaller size */
.as-price__amt--text b{font-size:28px;line-height:1.15;letter-spacing:-.01em}
.as-price__top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.as-price__name{font-size:21px;line-height:1.25;font-weight:600;letter-spacing:-.01em}
.as-price__flag{display:inline-flex;align-items:center;min-block-size:22px;padding:0 8px;border-radius:var(--r-pill);
  background:var(--brand-soft);color:var(--brand-ink);font-size:12px;font-weight:600}
.as-price__amt{display:flex;align-items:baseline;gap:6px}
.as-price__amt b{font-size:40px;line-height:1;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.as-price__amt span{font-size:15px;color:var(--label-2)}
.as-price__desc{font-size:15px;line-height:1.45;color:var(--label-2)}
.as-price__list{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px;font-size:15px;line-height:1.4}
.as-price__list li{display:flex;gap:10px;align-items:flex-start}
.as-price__list .as-ico{inline-size:18px;block-size:18px;color:var(--brand-ink);stroke-width:2.2;margin-block-start:1px}
.as-price__list li.is-off{color:var(--label-3)}
.as-price__list li.is-off .as-ico{color:var(--label-3)}
.as-price__cta{margin-block-start:auto;padding-block-start:8px}
.as-price__cta .as-btn{inline-size:100%}
/* campaign / timed free-period marker: success family, text from plans.json + dictionary */
.as-price__flag--offer{background:var(--success-soft);color:var(--success)}
/* pricing section parts: period choice (radio Segment, section 12) · campaign band · trust row · footnote */
.as-prices__period{margin-inline:auto;margin-block-end:var(--space-32)}
.as-prices__promo{margin-block-end:var(--space-24)}
.as-prices__trust{margin-block-start:var(--space-32)}
.as-prices__note{max-inline-size:var(--w-text);text-align:center}
.as-prices__soon{margin-block:var(--space-24) 0;margin-inline:auto}

/* ── 9 · SSS ─────────────────────────────────────────────── */
.as-faq{max-inline-size:780px;margin-inline:auto;background:var(--card);border-radius:var(--r-surf);overflow:hidden}
.as-faq > * + *{border-block-start:1px solid var(--sep)}
.as-faq summary{list-style:none;display:flex;align-items:center;gap:16px;min-block-size:56px;padding:12px 20px;
  cursor:pointer;font-size:17px;line-height:1.35;font-weight:600;transition:background-color var(--dur-fast) var(--ease-standard)}
.as-faq summary::-webkit-details-marker{display:none}
.as-faq summary:hover{background:var(--hover)}
.as-faq summary .as-ico{margin-inline-start:auto;color:var(--label-3);inline-size:18px;block-size:18px;stroke-width:2;
  transition:transform var(--dur-base) var(--ease-standard)}
.as-faq details[open] summary .as-ico{transform:rotate(90deg)}
.as-faq__a{padding:0 20px 18px;font-size:15px;line-height:1.5;color:var(--label-2);max-inline-size:var(--w-text)}
.as-faq details::details-content{block-size:0;overflow:clip;
  transition:block-size var(--dur-base) var(--ease-standard),content-visibility var(--dur-base) allow-discrete}
.as-faq details[open]::details-content{block-size:auto}
.as-faq{interpolate-size:allow-keywords}

/* ── 12 · Toolbar ────────────────────────────────────────── */
.as-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-inline-size:0}
.as-toolbar__sp{flex:1 1 0}
.as-input,.as-select{min-block-size:var(--h-block);padding:0 12px;border:1px solid var(--line-ctl);border-radius:var(--r-ctl);
  background:var(--fill-2);color:var(--label);font-size:13px;min-inline-size:0;
  transition:background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
.as-input:focus,.as-select:focus{background:var(--card);border-color:var(--brand-ink);outline:none;box-shadow:0 0 0 3px var(--brand-soft)}
.as-input::placeholder{color:var(--label-3)}
.as-search{position:relative;display:flex;align-items:center;flex:0 1 18rem;min-inline-size:10rem}
.as-search .as-input{inline-size:100%;padding-inline-start:34px}
.as-search > .as-ico{position:absolute;inset-inline-start:12px;color:var(--label-3);pointer-events:none}
.as-select--sm{min-block-size:var(--h-inline);padding:0 8px;border-radius:var(--r-inner);font-size:12px}
.as-seg{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:var(--r-ctl);background:var(--fill)}
.as-seg button{min-block-size:calc(var(--h-block) - 4px);padding:0 10px;border:0;border-radius:var(--r-inner);background:transparent;
  color:var(--label-2);font-size:12px;font-weight:500;cursor:pointer;transition:background-color var(--dur-fast) var(--ease-standard)}
.as-seg button[aria-pressed="true"]{background:var(--card);color:var(--label);font-weight:600;box-shadow:var(--shadow-seg)}
/* radio variant (form value): fieldset + label + real input; the input covers the option and is invisible */
:where(fieldset.as-seg){margin:0;border:0;min-inline-size:0}
.as-seg__opt{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-4);
  min-block-size:calc(var(--h-block) - 4px);padding:0 10px;border-radius:var(--r-inner);color:var(--label-2);
  font-size:12px;font-weight:500;cursor:pointer;transition:background-color var(--dur-fast) var(--ease-standard)}
.as-seg__opt input{appearance:none;position:absolute;inset:0;inline-size:100%;block-size:100%;margin:0;
  border-radius:inherit;cursor:pointer}
@media (pointer:coarse){.as-seg__opt{min-block-size:var(--h-touch)}}
.as-seg__opt:has(:checked){background:var(--card);color:var(--label);font-weight:600;box-shadow:var(--shadow-seg)}
/* discount rate is a small badge inside the segment; takes no space when empty */
.as-seg__badge{padding:0 var(--space-4);border-radius:var(--r-pill);background:var(--success-soft);color:var(--success);
  font-size:11px;font-weight:600;font-variant-numeric:tabular-nums}
.as-seg__badge:empty{display:none}
/* site size: 44 px bed, centrable block; if it does not fit the option narrows and the badge drops to the next row */
.as-seg--site{display:flex;align-items:stretch;inline-size:fit-content;max-inline-size:100%;padding:var(--space-2)}
.as-seg--site .as-seg__opt{flex:1 1 auto;flex-wrap:wrap;row-gap:0;min-inline-size:0;min-block-size:calc(var(--h-touch) - 4px);
  padding:var(--space-4) var(--space-16);font-size:15px;line-height:1.2;text-align:center}
/* touch: the invisible input also covers the track padding, so the hit area is the 44 px track, look unchanged */
@media (pointer:coarse){.as-seg--site .as-seg__opt input{inset-block:calc(-1 * var(--space-2));block-size:calc(100% + 2 * var(--space-2))}}
.as-fchip{display:inline-flex;align-items:center;gap:6px;min-block-size:var(--h-inline);padding:0 10px;border-radius:var(--r-ctl);
  border:1px solid var(--brand-ink);background:var(--brand-soft);color:var(--brand-ink);font-size:12px;font-weight:500;cursor:pointer}
.as-fchip .as-ico{inline-size:12px;block-size:12px;stroke-width:2.2}
.as-fchip--add{border-color:var(--line-ctl);background:var(--card);color:var(--label-2)}
.as-fchip--add:hover{background:var(--hover)}

/* ── 21 · Form field (FormField) ─────────────────────────── */
.as-field{display:flex;flex-direction:column;gap:6px;min-inline-size:0}
.as-field__top{display:flex;align-items:baseline;gap:8px}
.as-field__label{font-size:13px;font-weight:600;color:var(--label)}
.as-field__opt{font-size:12px;font-weight:400;color:var(--label-2)}
.as-field__count{margin-inline-start:auto;font-size:11px;color:var(--label-3);font-variant-numeric:tabular-nums}
.as-field__help{font-size:12px;line-height:1.4;color:var(--label-2)}
.as-field__error{display:flex;align-items:flex-start;gap:6px;font-size:12px;line-height:1.4;color:var(--danger)}
.as-field__error .as-ico{inline-size:var(--icon-12);block-size:var(--icon-12);margin-block-start:2px;stroke-width:2.2}
.as-input[aria-invalid="true"],.as-select[aria-invalid="true"],.as-textarea[aria-invalid="true"]{border-color:var(--danger)}
.as-input[aria-invalid="true"]:focus,.as-textarea[aria-invalid="true"]:focus{box-shadow:0 0 0 3px var(--danger-soft);border-color:var(--danger)}
.as-input:disabled,.as-select:disabled,.as-textarea:disabled{background:var(--card-2);color:var(--label-3);border-color:var(--sep-2);cursor:not-allowed}
.as-textarea{min-block-size:88px;padding:8px 12px;border:1px solid var(--line-ctl);border-radius:var(--r-ctl);background:var(--fill-2);
  color:var(--label);font-size:13px;line-height:1.45;resize:vertical;inline-size:100%}
.as-textarea:focus{background:var(--card);border-color:var(--brand-ink);outline:none;box-shadow:0 0 0 3px var(--brand-soft)}
.as-choices{display:flex;flex-direction:column;gap:2px;border:0;padding:0;margin:0;min-inline-size:0}
.as-choices legend{font-size:13px;font-weight:600;color:var(--label);padding:0;margin-block-end:4px}
.as-choice{display:flex;align-items:center;gap:8px;min-block-size:var(--h-inline);font-size:13px;color:var(--label);cursor:pointer}
/* native controls are never shown raw: radio and checkbox are drawn with tokens */
.as-choice input{appearance:none;display:grid;place-content:center;inline-size:16px;block-size:16px;margin:0;flex:0 0 auto;
  border:1px solid var(--line-ctl);background:var(--card);cursor:pointer;
  transition:background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard)}
.as-choice input[type="checkbox"]{border-radius:calc(var(--r-inner) - 2px)}
.as-choice input[type="radio"]{border-radius:var(--r-pill)}
.as-choice input:checked{border-color:var(--brand);background:var(--brand)}
.as-choice input[type="radio"]:checked{box-shadow:inset 0 0 0 3px var(--card)}
.as-choice input[type="checkbox"]:checked::after{content:"";inline-size:4px;block-size:8px;border:solid var(--on-brand);
  border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.as-choice input:focus-visible{outline:2px solid var(--brand-ink);outline-offset:2px}
.as-choice input:disabled{border-color:var(--sep-2);background:var(--card-2);cursor:not-allowed}
.as-choice input:disabled + span{color:var(--label-3)}
/* touch: the label is the tap target, box + label together at least h-touch */
@media (pointer:coarse){.as-choice{min-block-size:var(--h-touch)}}
.as-field--site .as-input,.as-field--site .as-select{min-block-size:var(--h-touch);font-size:15px}
.as-field--site .as-field__label{font-size:15px}
.as-form{display:flex;flex-direction:column;gap:var(--space-16);max-inline-size:32rem}
.as-form__actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;padding-block-start:4px}
.as-form__actions--start{justify-content:flex-start}
.as-form--center{margin-inline:auto}
/* horizontal option group (2–5 short options; used instead of Segment on the site) */
.as-choices--row{flex-direction:row;flex-wrap:wrap;column-gap:var(--space-16)}
/* read-only output to copy (long link) */
.as-textarea--output{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
/* Newsletter form (LeadForm): centred heading + single field + checkbox + thank-you state */
.as-lead{display:flex;flex-direction:column;align-items:center;gap:var(--space-16)}
.as-lead__states{display:grid;justify-items:center}
.as-lead__states>[data-email-state]{grid-area:1/1}
.as-lead__states>[data-email-state][hidden]{display:block;visibility:hidden}
.as-lead .as-form{inline-size:100%}
.as-lead .as-choice{align-items:flex-start}
.as-lead .as-choice input{margin-block-start:var(--space-2)}

/* ── 22 · Banner ─────────────────────────────────────────── */
.as-banner{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:var(--r-surf);background:var(--info-soft);
  color:var(--label);font-size:13px;line-height:1.45}
.as-banner > .as-ico{inline-size:var(--icon-20);block-size:var(--icon-20);stroke-width:1.75;color:var(--info);flex:0 0 auto}
.as-banner__body{display:flex;flex-direction:column;gap:2px;min-inline-size:0;flex:1 1 auto}
.as-banner__t{font-weight:600}
.as-banner__act{display:flex;align-items:center;gap:6px;flex:0 0 auto;margin-inline-start:auto}
.as-banner--ok{background:var(--success-soft)}.as-banner--ok > .as-ico{color:var(--success)}
.as-banner--warn{background:var(--warn-soft)}.as-banner--warn > .as-ico{color:var(--warn)}
.as-banner--danger{background:var(--danger-soft)}.as-banner--danger > .as-ico{color:var(--danger)}

/* ── 23 · Icon sizes ─────────────────────────────────────── */
.as-ico--12{inline-size:var(--icon-12);block-size:var(--icon-12);stroke-width:2.2}
.as-ico--16{inline-size:var(--icon-16);block-size:var(--icon-16);stroke-width:1.75}
.as-ico--20{inline-size:var(--icon-20);block-size:var(--icon-20);stroke-width:1.5}
.as-ico--24{inline-size:var(--icon-24);block-size:var(--icon-24);stroke-width:1.5}

/* ── 30 · FormDialog: a native <dialog> for forms of 4+ fields (W23): head + scrolling body + sticky actions ─ */
/* Backdrop = the Modal scrim (black 32 %) written through `shade`, so the site token root gains no raw colour. */
/* margin:auto re-centres it: the site reset sets margin 0 on every .as-web descendant */
.as-fdialog{inline-size:min(100% - var(--space-32),560px);max-block-size:calc(100dvh - var(--space-32));margin:auto;padding:0;border:0;
  border-radius:var(--r-tile);background:var(--card);color:var(--label);box-shadow:var(--shadow-modal);overflow:hidden}
.as-fdialog[open]{display:flex;flex-direction:column}
.as-fdialog::backdrop{background:color-mix(in srgb,var(--shade) 32%,transparent)}
.as-fdialog__head{display:flex;align-items:center;gap:var(--space-12);padding:var(--space-16) var(--space-16) var(--space-16) var(--space-24);
  border-block-end:1px solid var(--sep)}
.as-fdialog__head h2{flex:1 1 auto;min-inline-size:0;font-size:17px;line-height:1.3;font-weight:600;letter-spacing:-.01em}
.as-fdialog__body{flex:1 1 auto;min-block-size:0;overflow:auto;overscroll-behavior:contain;padding:var(--space-24) var(--space-24) 0}
.as-fdialog__body > p{font-size:15px;line-height:1.45;color:var(--label-2);margin-block-end:var(--space-16)}
.as-fdialog .as-form{max-inline-size:none}
/* the form's own action row is the sticky footer: it stays in view while the fields scroll */
.as-fdialog .as-form__actions{position:sticky;inset-block-end:0;margin-inline:calc(var(--space-24) * -1);
  padding:var(--space-16) var(--space-24);background:var(--card-2);border-block-start:1px solid var(--sep)}
.as-fdialog [data-team-thanks]{padding-block-end:var(--space-24)}

/* ── 31 · SendToDesktop sheet (W11d): the FormDialog as a bottom sheet on phones; not full screen, at most 60 % high ─ */
.as-fdialog--sheet{inline-size:100%;max-inline-size:none;max-block-size:60dvh;margin:auto 0 0;
  border-end-start-radius:0;border-end-end-radius:0;padding-block-end:env(safe-area-inset-bottom)}
.as-fdialog--sheet .as-fdialog__body{padding-block-end:0}
.as-fdialog--sheet .as-form__actions{flex-direction:column;align-items:stretch;gap:var(--space-8)}

@media (prefers-reduced-motion:reduce){
  .as-web *,.as-web *::before,.as-web *::after,.as-web,.as-scrim,.as-modal,.as-toast{
    animation-duration:0s !important;animation-iteration-count:1 !important;transition-duration:0s !important}
  a.as-tile:hover,a.as-kpi:hover,.as-btn:active{transform:none}
}
@media (forced-colors:active){
  .as-btn,.as-input,.as-select,.as-pill,.as-status,.as-tile,.as-price,.as-insp,.as-modal,.as-kpi{border:1px solid CanvasText}
  .as-side__item[aria-current="page"],.as-table tbody tr[aria-selected="true"],.as-seg button[aria-pressed="true"],.as-seg__opt:has(:checked){
    outline:2px solid Highlight;outline-offset:-2px}
  .as-choice input{border-color:CanvasText}
  .as-choice input:checked{background:Highlight}
}