@charset "UTF-8";
/* ==========================================================================
   Skiwo UI — Design Tokens (base / default skin)
   The reusable token CONTRACT. Components reference var(--token) only — never a
   hard-coded value. Per-product themes override these var VALUES (one file, no
   forked stylesheet); dark theme overrides under [data-theme="dark"] at bottom.

   Structure + values lifted from the bemywords design handoff
   (the source handoff files have since been removed from docs/). The
   violet --brand is the catalog's PLACEHOLDER default skin; a dedicated neutral
   Skiwo palette swaps in here later without touching any component.
   ========================================================================== */
/* `.skiwo-light-only`: a theme with no dark look extends it, and keeps every
   light token under data-theme="dark", not only the ones it sets itself
   (VAMOSIGN's sticker drew white words in white fields, docs/platform/v82 §4). */
.skiwo-light-only {
  color-scheme: light;
}

:root, .skiwo-light-only {
  /* ---- Brand (violet — placeholder default skin) ---- */
  --brand: #5B5BD6; /* primary actions, active nav, focus ring, links */
  --brand-hover: #4B4BC4; /* hover/pressed on primary */
  --brand-ink: #4B4BC4; /* brand-colored text on light bg */
  --brand-tint: #EEEDFB; /* active nav bg, icon chips */
  --brand-tint-2: #F4F4FD; /* selected sub-item bg, subtle brand fill */
  --brand-tint-3: #F3EEFC; /* zone bg accents */
  --brand-avatar-bg: #E7E7FA; /* avatar circle bg */
  --brand-border: #D7D6F6; /* brand-tinted hairline (ghost-button outline) */
  --brand-ring: rgba(91,91,214,.12); /* focus ring around active input */
  --brand-deep: #3F3FA8; /* the accent taken deep: chrome stripe, masthead */
  --brand-deep-ink: #FFFFFF; /* text on the deep band */
  --brand-deep-muted: #BFBFE4; /* dim text on the deep band */
  /* ---- The nav rail, both of its faces ----
     A workspace can name these two outright in Branding (2026-09-11); left
     unnamed they are the accent taken tint-ward and deep-ward, which is what
     the chrome derived for itself before. The values here are the default
     palette's, for the pages that carry no workspace palette at all. */
  --sidebar: #DBD4FC; /* the expanded rail */
  --sidebar-ink: #000000; /* labels on it */
  --sidebar-muted: #535160; /* idle labels and icons */
  --sidebar-line: #BCB6D9; /* group dividers */
  --sidebar-accent: #5237DD; /* the active row */
  --sidebar-collapsed: #442EB8; /* the collapsed stripe */
  --sidebar-collapsed-ink: #FFFFFF;
  --sidebar-collapsed-muted: #ABA1DF;
  --sidebar-collapsed-line: #6958C6;
  --sidebar-collapsed-accent: #C0B3FB;
  /* ---- Neutrals / surfaces ---- */
  --bg-app: #EEEEF2; /* app canvas behind cards: a cool grey the white cards lift off, 5.8 L* under them (PLAT-R-309, Gautam 2026-10-17; #F6F6F8 from 7.51.0 to 7.73.0 read as white) */
  --surface: #FFFFFF; /* cards, bars, inputs */
  --surface-2: #FAFAFB; /* subtle raised/inset (filter bars, table heads, source cells) */
  --surface-3: #FBFBFC; /* read-only cell bg; the rail's ground unless a product names --rail-bg */
  --bg-well: #E3E5EB; /* a sunken box inside a sheet: the ground a paper is read on (kit 7.96.0, NeedToKnow's Drive canvas) */
  --surface-light-violet: #FAFAFE; /* active editor-row wash (KeyRow) */
  /* ---- Borders / dividers (light -> strong) ---- */
  --hairline: #F1F2F4; /* in-grid row dividers */
  --border-1: #F0F1F4; /* faint section dividers */
  --border-2: #EAECF0; /* default card/bar border */
  --border-3: #E6E6EB; /* card border (slightly stronger); the rail's edge unless a product names --rail-edge */
  --border-4: #E4E6EB; /* control/input border */
  --control-edge: #8089A1; /* a field's edge: 3.0:1 on the app canvas, 3.5 on the surface (WCAG 1.4.11; v82) */
  /* ---- Text ---- */
  --text: #1B1D27; /* headings, primary values */
  --text-2: #2A2D38; /* strong body */
  --text-3: #3A3D49; /* read-only/source text */
  --text-mid: #4A4E5A; /* secondary labels, ghost-button text */
  --text-muted: #5A5E6B; /* muted body */
  --text-faint: #676C7A; /* meta, placeholders: 4.5:1 on the app canvas, its worst ground (v82) */
  --text-faint2: #676C7A; /* keys, captions, disabled: = faint; any lighter fails 4.5:1 on the canvas (v82) */
  --on-brand: #FFFFFF; /* fg on a solid brand/coloured fill (primary btn, done marker) — stays white in dark too */
  --icon-faint: #82899B; /* default stroke-icon color in lists: 3.0:1 on the canvas (v82) */
  /* ---- Semantic (status) — each has ink + bar + tint(bg) ---- */
  /* --ok is TEXT as well as a dot and a fill: UI::Tones hands the same value to
     StatusBadge's label and StatusDot's dot, so it has to clear 4.5:1 for body
     text, not the 3:1 a dot would need. At #1F8A5B it was 4.18:1 on --surface-2
     and 4.33:1 on white — the only tone of the six that failed, in either mode
     (measured 2026-09-20, prompted by SIGNAR asking before building band
     headings on it). #1C7D53 (v82) holds the hue and clears 4.5:1 on its own
     --ok-tint, where a badge draws it; #1E8457 read 4.1 there. */
  --ok: #1C7D53;
  --ok-bar: #27a36b;
  --ok-tint: #E6F4EC; /* Approved / live / 100% */
  --on-ok: #FFFFFF; /* words on a solid --ok fill (an Approve button), 5.1:1 */
  --info: #3A6EA5;
  --info-bar: #4581c2;
  --info-tint: #E8F0F8; /* AI draft / in-progress / mid */
  --warn: #936516;
  --warn-bar: #cf982f;
  --warn-tint: #FBF1DF; /* Needs review / low coverage */
  --warn-strong:#c79a3a; /* amber editor border for review state */
  --danger: #BF400C;
  --danger-ink:#B85555;
  --danger-tint: #FBE9E2; /* Empty / Untranslated */
  --danger-cell:#FDF6F6; /* untranslated grid-cell bg */
  --destruct: #D14343; /* destructive actions (delete, remove) */
  --on-destruct: #FFFFFF; /* words on a solid --destruct fill (the last button of a retire dialog), 4.57:1 */
  /* ---- Shields (UI::Shield): four hue families for a badge wall, 0 = grey for
     a badge not yet earned. Each family is ink (stroke), deep (glyph), tint (face). ---- */
  --shield-1: #5B5BD6;
  --shield-1-deep: #3F3FA8;
  --shield-1-tint: #EEEDFB;
  --shield-2: #12857A;
  --shield-2-deep: #0B6B61;
  --shield-2-tint: #E3F4F1;
  --shield-3: #B45309;
  --shield-3-deep: #94450A;
  --shield-3-tint: #FBEFDD;
  --shield-4: #2569AC;
  --shield-4-deep: #1D5C96;
  --shield-4-tint: #E4EFFA;
  --shield-0: #B9B6CC;
  --shield-0-deep: #A5A2BC;
  --shield-0-tint: #FFFFFF;
  /* ---- Mode badges ---- */
  --mode-script-ink: #5B5BD6;
  --mode-script-bg: #EEEDFB;
  --mode-standard-ink:#5A5E6B;
  --mode-standard-bg:#EEF0F3;
  /* ---- Candy hue set — avatars, tags, chart series; cycle in this order ---- */
  --candy-violet: #5B3DF5;
  --candy-pink: #DB2777;
  --candy-cyan: #0891B2;
  --candy-amber: #D97706;
  --candy-green: #0F9D76;
  --candy-yellow: #FFE066;
  /* ---- Typography (per-product token, not a fork) ---- */
  --font-ui: "Schibsted Grotesk", system-ui, -apple-system, sans-serif;
  --font-prose: "Hanken Grotesk", system-ui, sans-serif; /* auth rail, marketing prose */
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace; /* keys, IDs, code, numeric */
  --font-display: "Outfit", "Schibsted Grotesk", system-ui, sans-serif; /* the page H1 (SoftReply's heading, the base design: Gautam 2026-10-17, kit 7.73.0); the face is the kit's (ui/_auth_rail.scss) */
  --fs-display:36px;
  --fw-display:700; /* hero numbers — pricing amount, big stat */
  --fs-page: 26px;
  --fw-page: 800; /* page H1, in --font-display (SoftReply's, Gautam 2026-10-17) */
  --fs-h2: 18px;
  --fw-h2: 700; /* card/section headings */
  --fs-title: 15px;
  --fw-title:600; /* card titles, nav items */
  --fs-read: 15.5px; /* text being JUDGED, not skimmed — a
   social post in the deck/composer/
   preview reads at the size it will be
   read at on the platform */
  --fs-body: 13.5px; /* default body / inputs */
  --fs-body-sm:13px;
  --fs-sm: 12.5px; /* secondary controls */
  --fs-meta: 12px; /* meta text */
  --fs-cap: 11px; /* captions, key mono */
  --fs-tiny: 10.5px;
  --fw-tiny: 600; /* status pills, tiny caps labels */
  --lh-tight: 1.4;
  --lh-body: 1.5;
  /* ---- Reading: a long text a person reads top to bottom (a document, a
     policy), set larger and looser than the app around it. Sizes and line
     heights are pixel pairs, the design's own (docs/platform/v45-docs-design,
     Docs Index: "Reading typography" and "Spacing between blocks"). Blocks
     sit --read-gap apart; a heading, an inset block (callout, quote, code), a
     wide block (table, database, image) and a divider add their extra above
     (and below, for the last three). ---- */
  --read-title: 34px;
  --read-title-lh: 42px;
  --read-title-fw: 700;
  --read-title-track: -0.01em;
  --read-h1: 26px;
  --read-h1-lh: 34px;
  --read-h1-fw: 700;
  --read-h2: 21px;
  --read-h2-lh: 30px;
  --read-h2-fw: 650;
  --read-h3: 17px;
  --read-h3-lh: 26px;
  --read-h3-fw: 650;
  --read-body: 16px;
  --read-body-lh: 26px;
  --read-quote: 17px;
  --read-quote-lh: 28px;
  --read-table: 14px;
  --read-table-lh: 20px;
  --read-th: 12.5px;
  --read-th-fw: 600;
  --read-code: 14px;
  --read-code-lh: 22px;
  --read-caption: 13.5px;
  --read-caption-lh: 20px;
  --read-body-narrow: 17px;
  --read-body-narrow-lh: 28px; /* a phone-width column */
  --read-gap: 8px; /* between any two blocks */
  --read-list-gap: 4px; /* list item to list item */
  --read-indent: 24px; /* a list or toggle level */
  --read-above-h1: 28px;
  --read-above-h2: 20px;
  --read-above-h3: 12px;
  --read-around-inset: 8px; /* callout, quote, code */
  --read-around-wide: 16px; /* table, database, image */
  --read-around-rule: 16px; /* a divider */
  --read-title-gap: 20px; /* title to the first block */
  --read-inset-pad-block: 14px;
  --read-inset-pad-inline: 16px; /* a callout's padding */
  --read-handle: 30px; /* a block's handle, left of its text */
  --read-measure: 720px; /* the reading column */
  --read-breakout: 1100px; /* a wide block's cap */
  --read-ground: color-mix(in srgb, var(--text) 5%, var(--surface)); /* code, a table's header row, a page chip: the grey under a block, in either mode and any palette */
  /* ---- Presence: who else is here. Four fixed hues, categorical like the
     candy set, for co-editors' avatars (white initials, >= 4.5:1), carets
     (>= 3:1 on the ground, both modes) and their selections' tint. ---- */
  --presence-1: #0E7490;
  --presence-1-tint: rgba(14, 116, 144, .16);
  --presence-2: #BE185D;
  --presence-2-tint: rgba(190, 24, 93, .14);
  --presence-3: #B45309;
  --presence-3-tint: rgba(180, 83, 9, .16);
  --presence-4: #6D28D9;
  --presence-4-tint: rgba(109, 40, 217, .14);
  /* A menu, a dialog, a side peek: over the page, one step off the surface
     in dark (white in light, like the surface). */
  --raised: #FFFFFF;
  /* ---- Spacing scale (4px base) ---- */
  --s-0: 2px; /* the hairline step: a chip's block padding, a 1px gap that must not touch (kit 7.98.0) */
  --s-1: 4px;
  --s-2: 6px;
  --s-3: 8px;
  --s-4: 10px;
  --s-5: 12px; /* --s-4 is no spacing step since kit 7.79.0 (Gautam 2026-10-17 22:07: control padding is 4, 6, 8, 12): the kit puts no padding, margin or gap on it; it stays for positions and for product sheets not yet moved */
  --s-6: 14px;
  --s-7: 16px;
  --s-8: 18px;
  --s-9: 20px;
  --s-10: 24px;
  --s-11: 32px;
  --s-12: 36px; /* card-scale padding: the top of the control scale */
  --s-13: 48px;
  --s-14: 64px;
  --s-15: 96px;
  --s-16: 128px; /* section padding: a sticker, a band, a palette's offset (kit 7.98.0) */
  /* ---- Radii ---- */
  --r-mark: 5px; /* data marks & inline runs: bar caps, diff spans, inline focus rings */
  --r-chip: 8px; /* below control size: legend swatches, keycaps, small menu rows */
  /* The Page Anatomy's corners (Gautam, 2026-10-14, kit 7.63.0; measured on
     docs/fractal/anatomy/page-anatomy.html): a 36px button or field rounds 8,
     a 28–30px one 7, a menu row 6 (--r-nav). 12/10 until then. */
  --r-control: 8px; /* buttons, inputs, chips */
  /* The one height a field, a select and the press beside them share. A
     field is 36px from its padding and line; a button's line is 1, so it was
     33px, a pill 26px, and a row of them never lined up. */
  --control-h: 36px;
  --r-control-sm: 7px; /* small inline buttons */
  --r-nav: 6px; /* a row in the sidebar, a menu or the workspace switcher */
  --r-card: 12px; /* cards (16px until kit 7.51.0) */
  --r-card-lg: 20px; /* large panels */
  --r-pill: 999px;
  --r-badge: 6px; /* a status badge: a rounded tag, not a pill (kit 7.51.0) */
  /* A bottom sheet on a phone (kit 7.26.0, board 15): its top corners, and how
     far below the top of the screen it starts — the board's 110 of 844, never
     less on a tall screen. Every sheet reads these two (the folder rail's,
     and Docs' comments, E4). */
  --r-sheet: var(--r-card-lg);
  --sheet-top: max(110px, 13dvh);
  /* ---- Over the page, not in it: the modal scrim and the two warning rings.
     Every component that dims the page or rings a control reads these, so a
     workspace palette moves them with everything else. ---- */
  --scrim: rgba(20, 22, 40, .42);
  /* ---- The marked row -------------------------------------------------
     One row in a chart that has to read first however small it is: the AI
     column in a channel breakdown is twenty visits against three thousand,
     and a bar scaled honestly against the largest makes exactly that row
     invisible. Deliberately NOT --brand (the other bars wear it) and not a
     status ink (nothing is wrong). Arrived as a #db2777 literal inside
     UI::ChannelBars with no dark value; it is a token now, with one. */
  --mark: #DB2777;
  --ring-warn: rgba(199, 154, 58, .14);
  --ring-danger:rgba(209, 67, 67, .14);
  /* ---- Shadows ---- */
  --sh-card: 0 1px 2px rgba(20,20,40,.04); /* resting card */
  --sh-raise: 0 6px 20px rgba(16,18,30,.09); /* hover card */
  --sh-float: 0 8px 24px rgba(20,20,40,.12); /* modals, menus, popovers: the anatomy's (kit 7.63.0; 0 14px 44px before) */
  --sh-btn: 0 2px 8px rgba(91,91,214,.35); /* primary button, brand-tinted (themes retint) */
  --sh-brand: 0 10px 28px rgba(91, 91, 214, .18); /* a card lifted in the brand */
  /* ---- The sticker skin (UI::MarketingChrome skin: :sticker, kit 4.8.0) ----
     Read only under .skiwo-mkt--sticker: the ink every outline and offset
     shadow is drawn in, the paper the bar and the cards stand on, the ground
     under the page, the one call to action, six accent washes the nav links
     and the numbered chips rotate through, and the footer's three. The
     values are the v62 marketing design's own (docs/signer/
     v62-marketing-redesign, Site Header 14-24, Site Footer 10), which is how
     the Lookbook preview matches the picture with no theme on; a theme
     overrides any of them, and the two fonts are the theme's alone:
     --mkt-font and --mkt-font-mono fall back to --font-ui and --font-mono. */
  --mkt-ink: #1B1530;
  --mkt-paper: #FFFFFF;
  --mkt-ground: #FFF6E6;
  --mkt-cta: #3F5BFF;
  --mkt-cta-ink: #FFFFFF;
  --mkt-accent-1: #FFE45C;
  --mkt-accent-2: #FF6FAE;
  --mkt-accent-3: #6BE4B8;
  --mkt-accent-4: #FF8A3D;
  --mkt-accent-5: #3F5BFF;
  --mkt-accent-6: #C9B6FF;
  --mkt-foot: #1B1530;
  --mkt-foot-ink: #FFFFFF;
  --mkt-foot-muted: #C9C3DA;
  /* The overlay skin (kit 6.3.0): the bar's ink while it lies on the page's
     first band, and the bar's colour once the page has moved under it. */
  --mkt-overlay-ink: #FFFFFF;
  --mkt-overlay-bar: #1B1530;
  /* The same look on the app's chrome (UI::AppShell skin: :sticker, kit
     4.11.0): the ink, the paper and the accents above, plus the three the
     app draws that the marketing site does not — the ground under the room,
     the rail's idle glyphs on its ink column, and the bar's quiet text.
     docs/signer/v64-app-redesign, App Documents 26-45 and 90-95. */
  --app-sticker-ground: #FBFAFE;
  --app-sticker-rail-idle: #CFC6EA;
  --app-sticker-muted: #4A4260;
  --app-sticker-rule: #DDD6EE;
  --app-sticker-folder: #F7F5FC;
  /* ---- Layout constants ---- */
  --header-h: 60px;
  --topbar-h: 56px; /* UI::Topbar's row, sticky at the window's top, and the rail head's height: one band (Gautam 2026-10-17 15:54, kit 7.73.0; 57px from 7.65.0 to 7.72.0, 44px proposed and rendered first) */
  /* Rail geometry. SoftReply's numbers, promoted to the kit default
     2026-07-31 (Gautam: the LeftTopSideBottom products are one chrome, so the
     widths are the kit's, not each product's) — every product that had been
     redeclaring these now inherits them. */
  --sidebar-w: 232px; /* the Page Anatomy's aside (kit 7.59.0) */
  --sidebar-w-collapsed: 52px;
  --room-gutter: 16px; /* the room's side padding, and the topbar's at the same edge (Gautam 2026-10-17 20:14, "16px looks good", kit 7.75.0; 40px from 7.51.0, when the room was centred at 1280px, to 7.74.5) */
  --rail-w: 248px; /* the Folder column — a FLOOR; it grows to fit (Page Anatomy, kit 7.66.0) */
  --rail-w-max: 320px; /* …up to here, then labels ellipsize */
  --content-max: 1320px;
  --tap-min: 44px; /* minimum mobile hit target */
  --grid-row-h: 32px; /* dense table row height */
  /* ---- Gantt (UI::Gantt) structural constants — geometry only, no colour ---- */
  --gantt-label-w: 200px; /* width of the lane / header label column */
  --gantt-col-w: 34px; /* min width of one time-axis (day) column */
  --gantt-row-h: 30px; /* height of one bar track row */
  /* ---- Kanban (UI::Kanban) structural constants — geometry only, no colour ---- */
  --kanban-col-w: 288px; /* fixed width of one board column */
  --kanban-track-min: 64px; /* min height of a column's card track so an empty
   column still presents a droppable area */
  /* ---- Density — app-chrome spacing that scales comfortable (default) →
     compact. Set [data-density] on the AppShell root; the chrome reads THESE
     (never the raw scale) so a product flips density globally with no
     per-component overrides. Comfortable values equal the current look, so
     existing consumers see no change. Compact lives in the block at file end. */
  --dz-rail-pad: var(--s-5); /* UI::Sidebar outer padding: ONE length, never a two-value pair; the rail head puts it into calc() (kit 7.73.0), and a pair makes that calc invalid, so the head drops 10px into the padding (SoftReply, 2026-10-17) */
  --dz-nav-pad-block: var(--s-2); /* UI::NavItem row padding (block axis) */
  --dz-nav-pad-inline: var(--s-5); /* UI::NavItem row padding (inline axis) */
  --dz-pagehead-gap: var(--s-7); /* UI::PageHeader space below the title row: 16, the gap scale (kit 7.77.0; 20 before) */
  --nt-detractor-ink: #7B3F28;
  --nt-detractor-bg: #FCE8F1;
  --nt-detractor-border: #ECD3CA;
  --nt-passive-ink: #4A5568;
  --nt-passive-bg: #F7FAFC;
  --nt-passive-border: #E2E8F0;
  --nt-promoter-ink: #276749;
  --nt-promoter-bg: #E5F6EB;
  --nt-promoter-border: #CFE6D9;
  --auth-rail-bg: #1B1D27;
  --auth-rail-ink: #FFFFFF;
  --auth-rail-ink-dim: rgba(255, 255, 255, 0.72);
  --auth-rail-accent: #FFFFFF;
  --auth-rail-glow: var(--brand);
  --auth-rail-card-bg: rgba(255, 255, 255, 0.06);
  --auth-rail-card-border: rgba(255, 255, 255, 0.12);
}

/* Dark theme: override token VALUES only — every component references vars, so
   this single mixin re-themes the whole UI. It is included twice: once for the
   reader who CHOSE dark, and once inside a media query for the reader who chose
   to follow their system, because a stored preference of "system" is not a
   value CSS can match on its own. */
[data-theme=dark] {
  --bg-app: #0E0F14; /* 6.6 L* under the dark surface (PLAT-R-309); #15161C until 7.73.0 */
  --surface: #1B1D27;
  --surface-2:#20222D;
  --surface-3:#20222D;
  --bg-well: #111218;
  --surface-light-violet:#201F33;
  --raised: #252734;
  /* Presence after dark: pink and violet move up a step to clear 3:1 on the
     ground and still carry white initials. */
  --presence-2: #DB2777;
  --presence-2-tint: rgba(219, 39, 119, .30);
  --presence-4: #7B52E6;
  --presence-4-tint: rgba(123, 82, 230, .30);
  --presence-1-tint: rgba(14, 116, 144, .34);
  --presence-3-tint: rgba(180, 83, 9, .30);
  /* --hairline and --border-1 were absent here until 2026-08-15, so the two
     FAINTEST light-mode dividers kept their light values (#F1F2F4 / #F0F1F4)
     in dark — which made every "faint" rule the brightest line on the page:
     table row hairlines, the cadence grid's hour rules, section dividers, 37
     files' worth. Faintest in light means faintest in dark. */
  --hairline: #242634;
  --border-1: #262837;
  --border-2: #2A2C38;
  --border-3: #2A2C38;
  --border-4: #313445;
  --control-edge: #6A6E80;
  --brand-avatar-bg: #262648; /* the light value leaked: initials read 2.6:1 (v82) */
  --destruct: #DB6D6D; /* 5.1:1 on the dark surface (#D14343 was 3.2) */
  --on-destruct: #0E0F14; /* ink on the lighter fill: white would read 3.3:1 */
  /* Native form controls (checkboxes, selects, scrollbars) draw themselves
     from the UA's colour scheme, not from our tokens — without this every
     checkbox in dark is a white box with a black tick. */
  color-scheme: dark;
  --text: #ECEDF2;
  --text-2: #D7D9E2;
  --text-3: #C2C5D1;
  --text-mid: #A3A7B5;
  --text-muted:#9499A6;
  --text-faint:#8A8E9C;
  --text-faint2:#9499A6;
  /* Brand text on the dark tint: the light ink left #4B4BC4 on #262648, about
     2:1, on every set or active state (tabs, steps, a set filter). Derived as
     Platform::Palette derives a workspace's: the brand lifted until readable
     on the tint, 4.53:1 there and 5.26:1 on the surface. */
  --brand-ink:#8787E1;
  --brand-tint:#262648;
  --brand-tint-2:#20203B;
  --brand-border:#33335A;
  /* The rail after dark, same derivation as light (see the light block). */
  --sidebar:#261F4C;
  --sidebar-ink:#FFFFFF;
  --sidebar-muted:#ADAABB;
  --sidebar-line:#443E65;
  --sidebar-accent:#9380F9;
  --sidebar-collapsed:#503CB9;
  --sidebar-collapsed-ink:#FFFFFF;
  --sidebar-collapsed-muted:#B0A7E0;
  --sidebar-collapsed-line:#7363C7;
  --sidebar-collapsed-accent:#CCC2FB;
  /* Semantic (status) — absent until 2026-08-15, so every ok/warn/danger TINT
     surface (ConfirmRow shells, Banner fills, stale-claim rows) stayed pale
     pastel in dark. Ink brightens, bar holds, tint goes deep. */
  --ok: #57C28A;
  --ok-bar: #2F8F5F;
  --ok-tint: #17281E;
  --on-ok: #0B1F14; /* the light green after dark carries dark words */
  --info: #7BA7D4;
  --info-bar: #4581C2;
  --info-tint: #17222E;
  --warn: #D8AE5A;
  --warn-bar: #CF982F;
  --warn-tint: #2A2213;
  --danger: #E07856;
  --danger-ink:#D98A8A;
  --danger-tint: #2E1815;
  --danger-cell:#261418;
  /* Shields: ink brightens a step, the face goes deep so the glyph still reads. */
  --shield-1: #8A8AE8;
  --shield-1-deep: #C9C9F2;
  --shield-1-tint: #23234A;
  --shield-2: #3FB5A8;
  --shield-2-deep: #A8E4DC;
  --shield-2-tint: #10302C;
  --shield-3: #D9853A;
  --shield-3-deep: #F3C99A;
  --shield-3-tint: #33220F;
  --shield-4: #5F97D0;
  --shield-4-deep: #B7D2EE;
  --shield-4-tint: #12283D;
  --shield-0: #6F6C86;
  --shield-0-deep: #8B889F;
  --shield-0-tint: #1B1B24;
  /* The page under a modal is already dark, so the scrim has to be deeper to
     read as one at all. */
  --scrim: rgba(0, 0, 0, .62);
  /* Lifted for dark: the light value sits at 4.0:1 on #1B1D27 and this is a
     bar a reader has to find, not read. */
  --mark: #F472B6;
  --ring-warn: rgba(216, 174, 90, .18);
  --ring-danger:rgba(224, 120, 86, .18);
}

@media (prefers-color-scheme: dark) {
  [data-theme=system] {
    --bg-app: #0E0F14; /* 6.6 L* under the dark surface (PLAT-R-309); #15161C until 7.73.0 */
    --surface: #1B1D27;
    --surface-2:#20222D;
    --surface-3:#20222D;
    --bg-well: #111218;
    --surface-light-violet:#201F33;
    --raised: #252734;
    /* Presence after dark: pink and violet move up a step to clear 3:1 on the
       ground and still carry white initials. */
    --presence-2: #DB2777;
    --presence-2-tint: rgba(219, 39, 119, .30);
    --presence-4: #7B52E6;
    --presence-4-tint: rgba(123, 82, 230, .30);
    --presence-1-tint: rgba(14, 116, 144, .34);
    --presence-3-tint: rgba(180, 83, 9, .30);
    /* --hairline and --border-1 were absent here until 2026-08-15, so the two
       FAINTEST light-mode dividers kept their light values (#F1F2F4 / #F0F1F4)
       in dark — which made every "faint" rule the brightest line on the page:
       table row hairlines, the cadence grid's hour rules, section dividers, 37
       files' worth. Faintest in light means faintest in dark. */
    --hairline: #242634;
    --border-1: #262837;
    --border-2: #2A2C38;
    --border-3: #2A2C38;
    --border-4: #313445;
    --control-edge: #6A6E80;
    --brand-avatar-bg: #262648; /* the light value leaked: initials read 2.6:1 (v82) */
    --destruct: #DB6D6D; /* 5.1:1 on the dark surface (#D14343 was 3.2) */
    --on-destruct: #0E0F14; /* ink on the lighter fill: white would read 3.3:1 */
    /* Native form controls (checkboxes, selects, scrollbars) draw themselves
       from the UA's colour scheme, not from our tokens — without this every
       checkbox in dark is a white box with a black tick. */
    color-scheme: dark;
    --text: #ECEDF2;
    --text-2: #D7D9E2;
    --text-3: #C2C5D1;
    --text-mid: #A3A7B5;
    --text-muted:#9499A6;
    --text-faint:#8A8E9C;
    --text-faint2:#9499A6;
    /* Brand text on the dark tint: the light ink left #4B4BC4 on #262648, about
       2:1, on every set or active state (tabs, steps, a set filter). Derived as
       Platform::Palette derives a workspace's: the brand lifted until readable
       on the tint, 4.53:1 there and 5.26:1 on the surface. */
    --brand-ink:#8787E1;
    --brand-tint:#262648;
    --brand-tint-2:#20203B;
    --brand-border:#33335A;
    /* The rail after dark, same derivation as light (see the light block). */
    --sidebar:#261F4C;
    --sidebar-ink:#FFFFFF;
    --sidebar-muted:#ADAABB;
    --sidebar-line:#443E65;
    --sidebar-accent:#9380F9;
    --sidebar-collapsed:#503CB9;
    --sidebar-collapsed-ink:#FFFFFF;
    --sidebar-collapsed-muted:#B0A7E0;
    --sidebar-collapsed-line:#7363C7;
    --sidebar-collapsed-accent:#CCC2FB;
    /* Semantic (status) — absent until 2026-08-15, so every ok/warn/danger TINT
       surface (ConfirmRow shells, Banner fills, stale-claim rows) stayed pale
       pastel in dark. Ink brightens, bar holds, tint goes deep. */
    --ok: #57C28A;
    --ok-bar: #2F8F5F;
    --ok-tint: #17281E;
    --on-ok: #0B1F14; /* the light green after dark carries dark words */
    --info: #7BA7D4;
    --info-bar: #4581C2;
    --info-tint: #17222E;
    --warn: #D8AE5A;
    --warn-bar: #CF982F;
    --warn-tint: #2A2213;
    --danger: #E07856;
    --danger-ink:#D98A8A;
    --danger-tint: #2E1815;
    --danger-cell:#261418;
    /* Shields: ink brightens a step, the face goes deep so the glyph still reads. */
    --shield-1: #8A8AE8;
    --shield-1-deep: #C9C9F2;
    --shield-1-tint: #23234A;
    --shield-2: #3FB5A8;
    --shield-2-deep: #A8E4DC;
    --shield-2-tint: #10302C;
    --shield-3: #D9853A;
    --shield-3-deep: #F3C99A;
    --shield-3-tint: #33220F;
    --shield-4: #5F97D0;
    --shield-4-deep: #B7D2EE;
    --shield-4-tint: #12283D;
    --shield-0: #6F6C86;
    --shield-0-deep: #8B889F;
    --shield-0-tint: #1B1B24;
    /* The page under a modal is already dark, so the scrim has to be deeper to
       read as one at all. */
    --scrim: rgba(0, 0, 0, .62);
    /* Lifted for dark: the light value sits at 4.0:1 on #1B1D27 and this is a
       bar a reader has to find, not read. */
    --mark: #F472B6;
    --ring-warn: rgba(216, 174, 90, .18);
    --ring-danger:rgba(224, 120, 86, .18);
  }
}
/* The focus ring (WCAG 2.4.7, 1.4.11; docs/platform/v82 §1): a surface gap and
   a brand-ink ring, 3:1 or more on every ground (the 12% --brand-ring was 1.1-1.6).
   Declared again on every theme root, because a var() in a custom property
   resolves where it is declared: on :root alone every theme drew the default
   ink. Inset, only the first shadow of a list draws: use
   `inset 0 0 0 2px var(--focus-ring)`. */
:root, .skiwo-ui, [class*=theme-] {
  --focus-ring: var(--brand-ink);
  --focus-gap: var(--surface);
  --sh-focus: 0 0 0 2px var(--focus-gap), 0 0 0 4px var(--focus-ring);
}

/* Density — compact preference. Set [data-density="compact"] on the AppShell
   root (UI::AppShell density: :compact, or the ui-density controller at runtime);
   --header-h + the chrome tokens tighten and the whole shell follows. Comfortable
   is the :root default. NOTE: --tap-min (NavItem touch target) intentionally does
   NOT shrink — compact is a desktop spacing preference, not a hit-target override
   (WCAG 2.5.8 target size stays satisfied). */
[data-density=compact] {
  --header-h: 50px;
  --dz-rail-pad: var(--s-3);
  --dz-nav-pad-block: var(--s-1);
  --dz-nav-pad-inline: var(--s-5);
  --dz-pagehead-gap: var(--s-7);
}

/* The kit is designed for the border-box model; on most surfaces Bootstrap
   supplies it as the substrate. A page loading skiwo_ui WITHOUT Bootstrap
   (PrepperShaker's paid shell) fell back to content-box and every fixed-width
   element grew by its padding — the collapsed 52px sidebar rendered 76px and
   clipped against the content (2026-08-02). Scoped to the kit root; identical
   to Bootstrap's own reset, so co-loading changes nothing. */
.skiwo-ui,
.skiwo-ui *,
.skiwo-ui *::before,
.skiwo-ui *::after {
  box-sizing: border-box;
}

.theme-amondinops .vs-uptime__share {
  font-size: var(--fs-sm);
  color: var(--text-muted);
}
.theme-amondinops .vs-today__caps {
  margin: 32px 0 10px;
  font-size: var(--fs-meta);
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--text-mid);
}
.theme-amondinops .vs-overview__recent .skiwo-list-item__leading .vs-door__mark,
.theme-amondinops .vs-burning .vs-door__mark {
  inline-size: 10px;
  block-size: 10px;
  border-radius: 3px;
  display: inline-block;
}
.theme-amondinops .vs-intro .skiwo-fact-list + .skiwo-btn {
  margin-block-start: var(--s-6);
}
.theme-amondinops .vs-get-started__why {
  margin: 0 0 var(--s-3);
  max-inline-size: 64ch;
  font-size: var(--fs-body-sm);
  color: var(--text-2);
}
.theme-amondinops .vs-get-started__act {
  display: flex;
  align-items: center;
  gap: var(--s-3);
}
.theme-amondinops .vs-burning > .skiwo-card + * {
  margin-block-start: var(--s-7);
}
.theme-amondinops .vs-burning .skiwo-section-head {
  margin-block-end: 14px;
}
.theme-amondinops .vs-burning .skiwo-tabs {
  margin-block-end: 18px;
}
.theme-amondinops .vs-burning .vs-today__caps {
  margin-block-start: 24px;
}
.theme-amondinops .vs-burning__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.theme-amondinops .vs-burning__state {
  font-size: var(--fs-meta);
  font-weight: 600;
  color: var(--text);
}
.theme-amondinops .vs-burning .vs-tone--danger {
  color: var(--danger);
  font-weight: 700;
}
.theme-amondinops .vs-burning .vs-tone--warn {
  color: var(--warn);
  font-weight: 700;
}
.theme-amondinops .vs-burning .vs-tone--ok {
  color: var(--ok);
}
.theme-amondinops .vs-burning__confirm {
  display: contents;
}
.theme-amondinops .vs-burning__confirm .skiwo-field {
  margin: 0;
  flex: 1 1 40%;
  min-inline-size: 0;
}
.theme-amondinops .vs-incident > * + * {
  margin-block-start: var(--s-5);
}
.theme-amondinops .vs-incident__product {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-block-end: 6px;
  font-size: 14px;
  font-weight: 700;
}
.theme-amondinops .vs-incident__hint {
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-incident__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: var(--s-5);
}
.theme-amondinops .vs-incident__failed, .theme-amondinops .vs-incident__follow-up {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
  min-inline-size: 0;
}
.theme-amondinops .vs-incident__happened {
  min-inline-size: 0;
}
.theme-amondinops .vs-incident .skiwo-card {
  overflow-x: auto;
}
.theme-amondinops .vs-incident .skiwo-card form.skiwo-stack > .skiwo-btn {
  align-self: flex-start;
}
@media (max-width: 1100px) {
  .theme-amondinops .vs-incident__body {
    grid-template-columns: minmax(0, 1fr);
  }
}
.theme-amondinops .vs-incident__significance {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--s-3);
  margin-block-start: var(--s-5);
}
.theme-amondinops .vs-incident__copy {
  margin: 0;
  white-space: pre-wrap;
  font-family: var(--font-mono);
  font-size: var(--fs-meta);
}
.theme-amondinops .vs-search > * + * {
  margin-block-start: var(--s-7);
}
.theme-amondinops .vs-search mark {
  padding: 0;
  background: none;
  color: inherit;
  font-weight: 700;
}
.theme-amondinops .vs-promises {
  min-inline-size: 0;
  --table-group-indent: calc(24px + var(--s-3));
}
.theme-amondinops .vs-promises .skiwo-card {
  overflow-x: auto;
}
.theme-amondinops .vs-promises > * + * {
  margin-block-start: var(--s-7);
}
.theme-amondinops .vs-promises__heard {
  font-size: var(--fs-meta);
}
.theme-amondinops .vs-promises__kind {
  display: block;
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .vs-promises__facets {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
}
.theme-amondinops .vs-promises__facets .skiwo-field {
  margin: 0;
  min-inline-size: 220px;
}
.theme-amondinops .vs-promises__group-by {
  display: flex;
  align-items: center;
  gap: var(--s-3);
}
.theme-amondinops .vs-promises__group-label {
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .vs-promises__toggles {
  margin-inline-start: auto;
  align-self: center;
}
.theme-amondinops .vs-promises__state {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
}
.theme-amondinops .vs-promises .vs-product__mark {
  inline-size: 24px;
  block-size: 24px;
  border-radius: 7px;
  font-size: 12px;
}
.theme-amondinops .vs-promises__service {
  color: var(--text);
  text-decoration: none;
}
.theme-amondinops .vs-promises__service:hover {
  text-decoration: underline;
}
.theme-amondinops .vs-promises > .vs-promises__hint {
  margin-block-start: var(--s-4);
}
.theme-amondinops .vs-promises > .vs-promises__chips {
  margin-block-start: var(--s-3);
}
.theme-amondinops .vs-promises__chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
}
.theme-amondinops .vs-promises__clear {
  font-size: var(--fs-sm);
  font-weight: 600;
}
.theme-amondinops .vs-pause {
  display: flex;
  flex-direction: column;
  gap: var(--s-6);
}
.theme-amondinops .vs-pause > * {
  margin: 0;
}
.theme-amondinops .vs-pause .skiwo-field {
  margin: 0;
}
.theme-amondinops .vs-promises__name {
  font-weight: 600;
}
.theme-amondinops .vs-promise__finding, .theme-amondinops .vs-promise__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
}
.theme-amondinops .vs-promise__sentence {
  margin: 0 0 var(--s-4);
  font-size: var(--fs-read);
  overflow-wrap: anywhere;
}
.theme-amondinops .vs-promise__fact {
  white-space: nowrap;
}
.theme-amondinops .vs-promise__instructions {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin-block-end: var(--s-3);
}
.theme-amondinops .vs-promise__write {
  margin-block-start: var(--s-3);
}
.theme-amondinops .vs-promise__write > summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  list-style: none;
  font-size: var(--fs-body-sm);
  font-weight: 600;
}
.theme-amondinops .vs-promise__write > summary::-webkit-details-marker {
  display: none;
}
.theme-amondinops .vs-promise__write > summary::after {
  content: "▸";
  font-size: 11px;
}
.theme-amondinops .vs-promise__write[open] > summary {
  margin-block-end: var(--s-5);
}
.theme-amondinops .vs-promise__write[open] > summary::after {
  content: "▾";
}
.theme-amondinops .vs-promise__write form {
  display: flex;
  flex-direction: column;
  gap: var(--s-5);
}
.theme-amondinops .vs-setup-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.theme-amondinops .vs-services {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.theme-amondinops .vs-services .skiwo-card__body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.theme-amondinops .vs-services__publish {
  margin-block-start: var(--s-4);
}
.theme-amondinops .vs-services__publish .skiwo-prose {
  margin-block-end: var(--s-4);
}
.theme-amondinops .vs-woken__job {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--s-4) var(--s-7);
  padding-block: var(--s-6);
}
.theme-amondinops .vs-woken__job + .vs-woken__job {
  border-block-start: 1px solid var(--border-2);
}
.theme-amondinops .vs-woken__job-who {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-inline-size: 0;
}
.theme-amondinops .vs-woken__job-who strong {
  font-size: var(--fs-body);
  font-weight: 600;
  color: var(--text);
}
.theme-amondinops .vs-woken__pick {
  display: flex;
  align-items: center;
  gap: var(--s-3);
}
.theme-amondinops .vs-woken__pick .skiwo-field {
  margin: 0;
  inline-size: 220px;
}
.theme-amondinops .vs-setup {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.theme-amondinops .vs-setup .skiwo-card__body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.theme-amondinops .vs-setup__panel:not([hidden]) {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.theme-amondinops .vs-setup__choices {
  margin: 0;
  padding: 0;
  border: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.theme-amondinops .vs-setup__choices legend {
  padding: 0;
  font-size: 12.5px;
  font-weight: 600;
  margin-block-end: 5px;
}
.theme-amondinops .vs-setup__choices--grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.theme-amondinops .vs-setup__choices--grid > .skiwo-choice-card:last-of-type:nth-of-type(odd) {
  grid-column: 1/-1;
}
@media (max-width: 720px) {
  .theme-amondinops .vs-setup__choices--grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
.theme-amondinops .vs-setup__row {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.theme-amondinops .vs-setup__row > * {
  flex: 1 1 50%;
  min-inline-size: 0;
}
.theme-amondinops .vs-setup__card > .skiwo-card__body {
  gap: 20px;
}
.theme-amondinops .vs-setup__service {
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
}
.theme-amondinops .vs-setup__what {
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
}
.theme-amondinops .vs-setup__what > .vs-setup__door > summary {
  margin-inline-start: calc(50% + 8px);
}
.theme-amondinops .vs-setup__what .vs-setup__inline {
  display: flex;
  flex-direction: column;
}
.theme-amondinops .vs-setup__door > summary {
  cursor: pointer;
  list-style: none;
  font-size: var(--fs-sm);
  font-weight: 600;
}
.theme-amondinops .vs-setup__door > summary::-webkit-details-marker {
  display: none;
}
.theme-amondinops .vs-setup__door[open] > summary {
  margin-block-end: var(--s-3);
}
.theme-amondinops .vs-setup__more {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.theme-amondinops .vs-setup__big {
  font-size: 16px;
  padding: 13px 14px;
}
.theme-amondinops .vs-setup__effect {
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-setup__warn {
  color: var(--warn);
}
.theme-amondinops .vs-setup__inline {
  gap: var(--s-3);
  padding: var(--s-4) var(--s-5);
  background: var(--surface-2);
  border: 1px solid var(--border-2);
  border-radius: var(--r-card);
}
.theme-amondinops .vs-setup__inline legend {
  float: inline-start;
  inline-size: 100%;
  margin-block-end: var(--s-2);
  color: var(--text-2);
}
.theme-amondinops .vs-setup__inline > .skiwo-btn {
  align-self: flex-start;
}
.theme-amondinops .vs-setup__buttons {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
}
.theme-amondinops .vs-setup__defaults {
  border: 1px solid var(--border-2);
  border-radius: var(--r-card);
  background: var(--surface);
  overflow: hidden;
}
.theme-amondinops .vs-setup__section + .vs-setup__section {
  border-block-start: 1px solid var(--border-2);
}
.theme-amondinops .vs-setup__summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--s-4);
  padding: 15px 18px;
  cursor: pointer;
  list-style: none;
}
.theme-amondinops .vs-setup__summary::-webkit-details-marker {
  display: none;
}
.theme-amondinops .vs-setup__summary small {
  display: block;
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .vs-setup__summary strong {
  font-size: var(--fs-body);
  font-weight: 600;
}
.theme-amondinops .vs-setup__section[open] > .vs-setup__summary {
  background: var(--bg-app);
}
.theme-amondinops .vs-setup__change {
  flex: none;
  font-size: var(--fs-sm);
  font-weight: 600;
}
.theme-amondinops .vs-setup__section[open] .vs-setup__change {
  visibility: hidden;
}
.theme-amondinops .vs-setup__inside {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 14px 18px 18px;
}
.theme-amondinops .vs-setup__ready {
  display: flex;
  gap: 9px;
  margin: 0;
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-setup__ready::before {
  content: "";
  flex: none;
  inline-size: 6px;
  block-size: 6px;
  margin-block-start: 7px;
  border-radius: 50%;
  background: var(--brand);
}
.theme-amondinops .vs-setup__inside > .skiwo-btn {
  align-self: flex-start;
}
.theme-amondinops .vs-setup__preview-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-block-end: 10px;
}
.theme-amondinops .vs-snippet {
  max-inline-size: 760px;
}
.theme-amondinops .vs-snippet > * + * {
  margin-block-start: var(--s-5);
}
.theme-amondinops .vs-snippet__wait {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-block: 22px 16px;
  padding: 16px 20px;
  border: 1px dashed var(--border-3);
  border-radius: var(--r-control);
  font-size: var(--fs-body-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-snippet__dot {
  inline-size: 10px;
  block-size: 10px;
  border-radius: var(--r-pill);
  background: var(--border-3);
  flex: none;
}
.theme-amondinops .vs-snippet__dot.is-on {
  background: var(--ok);
}
.theme-amondinops .vs-snippet__checking {
  margin-inline-start: auto;
  font-family: var(--font-mono);
  font-size: 11.5px;
}
.theme-amondinops .vs-woken {
  display: flex;
  align-items: flex-start;
  gap: 28px;
}
.theme-amondinops .vs-woken__people {
  flex: 1 1 auto;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.theme-amondinops .vs-woken__ladders {
  flex: 1 1 auto;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (max-width: 1180px) {
  .theme-amondinops .vs-woken {
    flex-direction: column;
  }
  .theme-amondinops .vs-woken__people {
    inline-size: 100%;
  }
}
.theme-amondinops .vs-woken__form {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
}
.theme-amondinops .vs-woken__form > .skiwo-btn {
  align-self: flex-start;
}
.theme-amondinops .vs-woken__pick {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--s-3);
  margin-block-start: var(--s-4);
}
.theme-amondinops .vs-woken__pick .skiwo-field {
  margin: 0;
  flex: 1 1 200px;
}
.theme-amondinops .vs-people {
  overflow: hidden;
}
.theme-amondinops .vs-person {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--s-7);
  padding: var(--s-8) var(--s-10);
}
.theme-amondinops .vs-person + .vs-person {
  border-block-start: 1px solid var(--border-2);
}
@media (max-width: 900px) {
  .theme-amondinops .vs-person {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .theme-amondinops .vs-person .vs-person__end {
    grid-column: 2;
    inline-size: auto;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--s-3);
  }
}
.theme-amondinops .vs-person__who {
  min-inline-size: 0;
}
.theme-amondinops .vs-person__name {
  font-size: 14px;
  line-height: 1.55;
  font-weight: 600;
}
.theme-amondinops .vs-person__role {
  font-weight: 400;
  color: var(--text-mid);
}
.theme-amondinops .vs-person__meta {
  margin-block-start: 2px;
  font-size: var(--fs-sm);
  color: var(--text-mid);
  overflow-wrap: anywhere;
}
.theme-amondinops .vs-person__warn {
  color: var(--warn-strong);
  font-weight: 600;
}
.theme-amondinops .vs-person__end {
  display: grid;
  grid-template-columns: 10rem minmax(0, 1fr);
  align-items: center;
  column-gap: var(--s-8);
  inline-size: 28rem;
}
.theme-amondinops .vs-person__duty {
  font-size: var(--fs-sm);
  font-weight: 600;
  color: var(--text-mid);
  white-space: nowrap;
}
.theme-amondinops .vs-person__duty--ok {
  color: var(--ok);
}
.theme-amondinops .vs-person__duty--warn {
  color: var(--warn-strong);
}
.theme-amondinops .vs-person__duty--danger {
  color: var(--danger-ink);
}
.theme-amondinops .vs-person__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-7);
}
.theme-amondinops .vs-person__language-form {
  margin-block-start: var(--s-6);
  padding-block-start: var(--s-5);
  border-block-start: 1px solid var(--border-2);
}
.theme-amondinops .vs-workspace {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media (max-width: 980px) {
  .theme-amondinops .vs-workspace {
    grid-template-columns: 1fr;
  }
}
.theme-amondinops .vs-workspace__label {
  margin: 14px 0 8px;
  font-size: 12.5px;
  font-weight: 600;
}
.theme-amondinops .vs-workspace__days {
  margin: 0;
  padding: 0;
  border: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.theme-amondinops .vs-workspace__days legend {
  padding: 0;
  font-size: 12.5px;
  font-weight: 600;
  margin-block-end: 5px;
}
.theme-amondinops .vs-workspace__mono {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-family: var(--font-mono);
  font-size: var(--fs-meta);
}
.theme-amondinops .vs-workspace__inline {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--s-3);
  margin-block-start: var(--s-5);
}
.theme-amondinops .vs-workspace__inline .skiwo-field {
  margin: 0;
  flex: 1 1 160px;
}
.theme-amondinops .vs-services-page {
  min-inline-size: 0;
}
.theme-amondinops .vs-services-page .skiwo-card:not(:has(.skiwo-search-dropdown)) {
  overflow-x: auto;
}
.theme-amondinops .vs-services-page > * + * {
  margin-block-start: 22px;
}
.theme-amondinops .vs-index__search {
  display: flex;
  gap: var(--s-4);
  align-items: flex-end;
  max-inline-size: 520px;
}
.theme-amondinops .vs-index__search .skiwo-field {
  flex: 1;
}
.theme-amondinops .vs-index__what {
  font-weight: 600;
}
.theme-amondinops .vs-index__nobody {
  color: var(--text-muted);
}
.theme-amondinops .vs-burning__tile {
  position: relative;
}
.theme-amondinops .vs-burning__tile .vs-door__mark {
  position: absolute;
  inset-block-start: -3px;
  inset-inline-end: -3px;
  inline-size: 10px;
  block-size: 10px;
  border-radius: 50%;
  box-shadow: 0 0 0 2px var(--surface);
}
.theme-amondinops .vs-services__hint,
.theme-amondinops .vs-promises__hint {
  margin: var(--s-5) 0 0;
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .vs-service__change {
  font-size: var(--fs-body-sm);
  font-weight: 600;
}
.theme-amondinops .vs-facts__sub {
  display: block;
  flex-basis: 100%;
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-close-form {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--s-7);
}
.theme-amondinops .vs-close-form__foot {
  margin-block-start: var(--s-2);
}
.theme-amondinops .vs-uptime__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin: 10px 0 0;
  font-size: 11.5px;
  color: var(--text-mid);
}
.theme-amondinops .vs-steps {
  border: 1px solid var(--border-2);
  border-radius: var(--r-card);
  background: var(--surface);
  overflow: hidden;
}
.theme-amondinops .vs-step + .vs-step {
  border-block-start: 1px solid var(--border-2);
}
.theme-amondinops .vs-step__inside form.skiwo-stack > .skiwo-btn {
  align-self: flex-start;
}
.theme-amondinops .vs-step__label {
  margin: 0;
  font-size: var(--fs-meta);
  font-weight: 600;
  color: var(--text-mid);
}
.theme-amondinops .vs-step__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-4);
  padding: 15px 18px;
  cursor: pointer;
  list-style: none;
}
.theme-amondinops .vs-step__summary::-webkit-details-marker {
  display: none;
}
.theme-amondinops .vs-step__summary::after {
  content: "▸";
  color: var(--text-mid);
}
.theme-amondinops .vs-step__summary strong {
  display: block;
  font-size: var(--fs-body);
  font-weight: 600;
}
.theme-amondinops .vs-step__summary small {
  display: block;
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-step[open] > .vs-step__summary::after {
  content: "▾";
}
.theme-amondinops .vs-step__inside {
  display: flex;
  flex-direction: column;
  gap: var(--s-6);
  padding: var(--s-7) 18px var(--s-8);
}
.theme-amondinops .vs-step__inside .skiwo-segmented {
  align-self: flex-start;
}
.theme-amondinops .vs-ladder__steps {
  list-style: none;
  margin: 0;
  padding: 0;
}
.theme-amondinops .vs-ladder__rung {
  display: flex;
  align-items: center;
  gap: var(--s-7);
  padding-block: var(--s-6);
}
.theme-amondinops .vs-ladder__num {
  display: grid;
  place-items: center;
  flex: none;
  inline-size: 32px;
  block-size: 32px;
  border-radius: 50%;
  background: var(--brand-tint);
  color: var(--brand-ink);
  font-weight: 600;
}
.theme-amondinops .vs-ladder__who {
  flex: 1;
  min-inline-size: 0;
  line-height: 1.55;
}
.theme-amondinops .vs-ladder__who strong {
  font-size: 14px;
}
.theme-amondinops .vs-ladder__who small {
  display: block;
  margin-block-start: 2px;
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-ladder__now {
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-ladder__wait {
  margin: 0 0 0 15px;
  padding: 2px 0 2px 29px;
  border-inline-start: 2px dashed var(--border-2);
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .vs-ladder__wait--end {
  border-inline-start: 0;
  padding-block-start: var(--s-3);
}
.theme-amondinops .vs-woken__gap-list > summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-block-start: var(--s-3);
  cursor: pointer;
  list-style: none;
  font-size: var(--fs-sm);
  font-weight: 600;
}
.theme-amondinops .vs-woken__gap-list > summary::-webkit-details-marker {
  display: none;
}
.theme-amondinops .vs-woken__gap-list > summary::after {
  content: "▸";
  font-size: 11px;
}
.theme-amondinops .vs-woken__gap-list[open] > summary::after {
  content: "▾";
}
.theme-amondinops .vs-woken__cover-doors {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-3);
  margin-block-start: var(--s-5);
}
.theme-amondinops .vs-woken__gaps {
  margin: var(--s-4) 0 0;
  padding: 0;
  list-style: none;
  font-size: var(--fs-body-sm);
  color: inherit;
}
.theme-amondinops .vs-woken__gaps li {
  padding-block: 6px;
}
.theme-amondinops .vs-woken__gaps li + li {
  border-block-start: 1px solid color-mix(in srgb, currentColor 18%, transparent);
}
.theme-amondinops .vs-scan__form {
  display: flex;
  flex-direction: column;
  gap: var(--s-5);
}
.theme-amondinops .vs-scan__row {
  display: flex;
  align-items: flex-end;
  gap: var(--s-4);
}
.theme-amondinops .vs-scan__row .skiwo-field {
  flex: 1;
}
.theme-amondinops .vs-scan__row > .skiwo-btn {
  min-block-size: 48px;
}
.theme-amondinops .vs-scan__hint {
  margin: 0;
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .vs-scan__hints {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-block-start: calc(6px - var(--s-5));
}
.theme-amondinops .vs-scan__note--app {
  display: none;
}
.theme-amondinops .vs-scan:has(input[value=app]:checked) .vs-scan__note--app {
  display: block;
}
.theme-amondinops .vs-scan:has(input[value=app]:checked) .vs-scan__note--website {
  display: none;
}
.theme-amondinops .vs-more-rows .vs-more + .vs-more {
  margin-block-start: 0;
  border-block-start: 1px solid var(--hairline);
}
.theme-amondinops .vs-more {
  padding-block: var(--s-7);
}
.theme-amondinops .vs-more:first-child {
  padding-block-start: 0;
}
.theme-amondinops .vs-more:last-child {
  padding-block-end: 0;
}
.theme-amondinops .vs-more > summary {
  cursor: pointer;
  font-size: var(--fs-body-sm);
  font-weight: 600;
}
.theme-amondinops .vs-more > summary span {
  margin-inline-start: var(--s-3);
  font-weight: 400;
  color: var(--text-mid);
}
.theme-amondinops .vs-more__inside {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--s-5);
  margin-block-start: var(--s-7);
}
.theme-amondinops .vs-more__inside > * {
  align-self: stretch;
}
.theme-amondinops .vs-more__inside > .skiwo-drawer-root {
  align-self: flex-start;
}
.theme-amondinops .vs-connect__keys {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
  padding: 0 var(--s-10) var(--s-8) calc(var(--s-10) + 36px + var(--s-7));
  border-block-end: 1px solid var(--border-2);
}
.theme-amondinops .vs-connect__keys > details > summary {
  cursor: pointer;
  font-size: var(--fs-sm);
  font-weight: 600;
}
.theme-amondinops .vs-connect__keys > details > .skiwo-code {
  margin-block-start: var(--s-3);
}
.theme-amondinops .vs-service-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.theme-amondinops .vs-service-row__who {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-inline-size: 0;
}
.theme-amondinops .vs-service-row__status {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  font-size: var(--fs-meta);
  color: var(--text-muted);
  white-space: nowrap;
}
.theme-amondinops .vs-product__mark {
  inline-size: 32px;
  block-size: 32px;
  border-radius: 9px;
  background: var(--text-mid);
  color: var(--on-brand);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 13px;
  flex: none;
}
.theme-amondinops .vs-service {
  max-inline-size: 760px;
}
.theme-amondinops .vs-service__fields {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
}
.theme-amondinops .vs-service__fields > .skiwo-btn {
  align-self: flex-start;
}
.theme-amondinops .vs-index .skiwo-card {
  overflow-x: auto;
}
.theme-amondinops .vs-index > * + * {
  margin-block-start: var(--s-7);
}
.theme-amondinops .vs-index__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  margin-block: 18px 10px;
}
.theme-amondinops .vs-index > .vs-index__filters + .vs-index__chips {
  margin-block-start: 0;
}
.theme-amondinops .vs-index__jump {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-2);
  margin-block-end: 16px;
  font-family: var(--font-mono);
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .vs-index__jump-label {
  margin-inline-end: var(--s-2);
}
.theme-amondinops .vs-index__severity {
  display: block;
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .vs-index__number {
  font-family: var(--font-mono);
  font-size: var(--fs-meta);
}
.theme-amondinops .vs-overview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 272px;
  gap: var(--s-12);
  align-items: start;
}
.theme-amondinops .vs-overview__main {
  min-width: 0;
}
.theme-amondinops .vs-overview__main > * + * {
  margin-block-start: 22px;
}
.theme-amondinops .vs-overview__calm .skiwo-card__body > * + * {
  margin-block-start: var(--s-3);
}
.theme-amondinops .vs-overview__calm-title {
  margin: 0;
  font-size: 21px;
  font-weight: 600;
}
.theme-amondinops .vs-overview__calm-line {
  margin: 6px 0 0;
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-overview__services {
  list-style: none;
  margin: 0;
  padding: 0;
}
.theme-amondinops .vs-overview__services li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--s-2);
  padding-block: var(--s-7);
  border-block-end: 1px solid var(--hairline);
}
.theme-amondinops .vs-overview__services a {
  font-weight: 600;
  font-size: var(--fs-body-sm);
}
.theme-amondinops .vs-overview__services small {
  display: block;
  font-size: 11.5px;
  color: var(--text-mid);
}
.theme-amondinops .vs-overview__oncall {
  border-block-start: 1px solid var(--hairline);
  padding-block-start: var(--s-4);
  font-size: var(--fs-sm);
}
.theme-amondinops .vs-overview__oncall p {
  margin: var(--s-1) 0 0;
}
.theme-amondinops .vs-overview__more {
  display: block;
  font-size: var(--fs-body-sm);
  font-weight: 600;
  margin-block-start: var(--s-7);
}
.theme-amondinops .vs-overview__note {
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .vs-overview__calm .skiwo-card__body > .vs-overview__note:last-child {
  border-block-start: 1px solid var(--hairline);
  padding-block-start: var(--s-7);
  margin-block-start: 22px;
}
.theme-amondinops .vs-overview__oncall-title {
  display: block;
  font-size: var(--fs-body-sm);
  color: var(--text);
}
.theme-amondinops .vs-overview__recent > summary {
  cursor: pointer;
  font-size: var(--fs-body-sm);
  font-weight: 600;
}
.theme-amondinops .vs-overview__recent > summary span {
  margin-inline-start: var(--s-3);
  font-weight: 400;
  color: var(--text-mid);
}
.theme-amondinops .vs-overview__recent[open] > summary {
  margin-block-end: var(--s-7);
}
.theme-amondinops .vs-overview__go {
  font-size: var(--fs-body-sm);
  font-weight: 600;
  white-space: nowrap;
}
.theme-amondinops .vs-overview__nothing {
  display: flex;
  align-items: center;
  gap: var(--s-6);
}
.theme-amondinops .vs-overview__nothing strong {
  display: block;
  font-size: var(--fs-body);
}
.theme-amondinops .vs-overview__nothing strong + span {
  display: block;
  margin-block-start: 2px;
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-overview__icon {
  display: grid;
  place-items: center;
  inline-size: 38px;
  block-size: 38px;
  border-radius: 10px;
  background: var(--brand-tint-2);
  color: var(--text-mid);
}
.theme-amondinops .vs-overview__icon--ok {
  background: var(--ok-tint);
  color: var(--ok);
}
.theme-amondinops .vs-overview__icon--danger {
  background: var(--danger-tint);
  color: var(--danger-ink);
}
.theme-amondinops .vs-overview__icon--warn {
  background: var(--warn-tint);
  color: var(--warn-strong);
}
.theme-amondinops .vs-overview__icon--brand {
  background: var(--brand-tint);
  color: var(--brand-ink);
}
.theme-amondinops .vs-overview__answers {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2);
}
.theme-amondinops .vs-overview__steps {
  list-style: none;
  margin: 0;
  padding: 0;
}
.theme-amondinops .vs-overview__steps li {
  display: flex;
  gap: var(--s-4);
  padding-block: var(--s-4);
  border-block-start: 1px solid var(--hairline);
}
.theme-amondinops .vs-overview__steps li:first-child {
  border-block-start: 0;
}
.theme-amondinops .vs-overview__steps li p {
  margin: var(--s-1) 0 0;
  color: var(--text-mid);
}
.theme-amondinops .vs-overview__num {
  display: grid;
  place-items: center;
  flex: none;
  inline-size: 32px;
  block-size: 32px;
  border-radius: 50%;
  background: var(--brand-tint);
  color: var(--brand-ink);
  font-weight: 600;
}
.theme-amondinops .vs-overview .is-done .vs-overview__num {
  background: var(--ok-tint);
  color: var(--ok);
}
.theme-amondinops .vs-overview__step-acts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-4);
  margin-block-start: var(--s-2);
}
@media (max-width: 1100px) {
  .theme-amondinops .vs-overview {
    grid-template-columns: minmax(0, 1fr);
  }
}
.theme-amondinops .vs-next {
  border-inline-start: 3px solid var(--brand);
}
.theme-amondinops .vs-next__title {
  margin: 6px 0 0;
  font-size: 16px;
  font-weight: 600;
}
.theme-amondinops .vs-next__body {
  margin: 6px 0 0;
  font-size: var(--fs-body-sm);
  color: var(--text-mid);
  max-inline-size: 72ch;
}
.theme-amondinops .vs-next__acts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  margin-block-start: 14px;
}
.theme-amondinops .vs-next__acts:empty {
  display: none;
}
.theme-amondinops .vs-next__confirm {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--s-3);
}
.theme-amondinops .vs-next__confirm .skiwo-field {
  margin: 0;
}
.theme-amondinops .vs-spot {
  border-block-start: 3px solid var(--danger);
}
.theme-amondinops .vs-spot--held {
  border-block-start-color: var(--warn);
}
.theme-amondinops .vs-spot__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
}
.theme-amondinops .vs-spot__meta {
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-spot__impact {
  margin: var(--s-6) 0 0;
  font-size: 28px;
  line-height: 1.2;
  max-inline-size: 40ch;
}
.theme-amondinops .vs-spot__cause {
  margin: var(--s-2) 0 0;
  font-size: 14.5px;
}
.theme-amondinops .vs-spot__owner {
  display: flex;
  align-items: center;
  gap: var(--s-5);
  margin-block: var(--s-10);
}
.theme-amondinops .vs-spot__owner .vs-overview__icon {
  inline-size: 32px;
  block-size: 32px;
  border-radius: 50%;
}
.theme-amondinops .vs-spot__owner strong {
  font-size: var(--fs-body-sm);
}
.theme-amondinops .vs-spot__owner span {
  font-size: var(--fs-sm);
}
.theme-amondinops .vs-spot__owner > div strong, .theme-amondinops .vs-spot__owner > div span {
  display: block;
}
.theme-amondinops .vs-spot__owner > div span {
  font-size: var(--fs-sm);
  color: var(--text-mid);
}
.theme-amondinops .vs-spot__acts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-5);
}
.theme-amondinops .vs-follow-up__filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-3);
}
.theme-amondinops .vs-follow-up__eyebrow {
  display: block;
  font-size: var(--fs-meta);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-mid);
  margin-block-end: 4px;
}
.theme-amondinops .vs-follow-up__title {
  display: block;
  font-weight: 600;
}
.theme-amondinops .vs-follow-up__verb {
  font-size: var(--fs-body-sm);
  font-weight: 600;
  white-space: nowrap;
  margin-inline-start: var(--s-4);
}
.theme-amondinops .vs-filing__form {
  display: flex;
  flex-direction: column;
  gap: var(--s-5);
  margin-block-start: var(--s-5);
}
.theme-amondinops .vs-filing__acts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  margin-block: var(--s-5);
}
.theme-amondinops .vs-burning__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  margin-block: 18px 16px;
}
.theme-amondinops .vs-burning__filters-note {
  font-size: 12.5px;
  color: var(--text-mid);
}
.theme-amondinops .vs-workspace__template-name {
  flex-basis: 100%;
  font-weight: 600;
  font-size: var(--fs-body-sm);
}
.theme-amondinops .vs-workspace__template + .vs-workspace__template {
  border-block-start: 1px solid var(--border-4);
  margin-block-start: var(--s-7);
  padding-block-start: var(--s-7);
}
.theme-amondinops .vs-workspace__template-form {
  display: flex;
  flex-direction: column;
  gap: var(--s-5);
}
.theme-amondinops .vs-workspace__template-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--s-5) var(--s-5);
}
.theme-amondinops .vs-workspace__template-fields .skiwo-field {
  margin: 0;
}
.theme-amondinops .vs-workspace__template-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-5);
}
.theme-amondinops .vs-workspace__template-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2) var(--s-4);
  font-size: var(--fs-meta);
  color: var(--text-2);
}

.theme-soft-reply.vs-door,
.theme-soft-reply.vs-sheet {
  min-height: 100dvh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: 20px 16px 28px;
  max-width: 480px;
  margin-inline: auto;
  background: var(--bg-app);
  color: var(--text);
}
.theme-soft-reply.vs-door .vs-door__act,
.theme-soft-reply.vs-sheet .vs-door__act {
  position: sticky;
  bottom: 16px;
}
.theme-soft-reply.vs-door .vs-sheet__body,
.theme-soft-reply.vs-sheet .vs-sheet__body {
  display: contents;
}

.theme-soft-reply.vs-sheet--wide {
  max-width: 960px;
}
.theme-soft-reply.vs-sheet--wide .vs-trust__section {
  margin-block-start: 28px;
}
.theme-soft-reply.vs-sheet--wide .vs-trust__foot {
  margin-block-start: 36px;
}

.vs-trust__facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-block-start: 20px;
}
@media (max-width: 1100px) {
  .vs-trust__facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .vs-trust__facts {
    grid-template-columns: minmax(0, 1fr);
  }
}

.vs-trust__doors {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-block-start: 16px;
}

.vs-trust__h2 {
  font-size: var(--fs-h2);
  margin-block: 0 10px;
}

.vs-trust__h3 {
  font-size: var(--fs-title);
  margin-block: 20px 8px;
}

.vs-trust__now {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.vs-trust__logo {
  inline-size: 30px;
  block-size: 30px;
  border-radius: var(--r-control);
  object-fit: contain;
  flex: none;
}

.theme-soft-reply.vs-door .vs-door__sheet,
.theme-soft-reply.vs-sheet .vs-door__sheet {
  display: flex;
  flex-direction: column;
  gap: 22px;
  padding-block: 6px 28px;
}
.theme-soft-reply.vs-door .vs-door__expiry,
.theme-soft-reply.vs-sheet .vs-door__expiry {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 11.5px;
  color: var(--text-mid);
}
.theme-soft-reply.vs-door .vs-door__product,
.theme-soft-reply.vs-sheet .vs-door__product {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 13.5px;
  font-weight: 700;
}
.theme-soft-reply.vs-door .vs-door__mark,
.theme-soft-reply.vs-sheet .vs-door__mark {
  inline-size: 10px;
  block-size: 10px;
  border-radius: 3px;
  background: var(--text-mid);
  flex: none;
}
.theme-soft-reply.vs-door .vs-door__ref,
.theme-soft-reply.vs-door .vs-door__opened,
.theme-soft-reply.vs-sheet .vs-door__ref,
.theme-soft-reply.vs-sheet .vs-door__opened {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 400;
  color: var(--text-mid);
}
.theme-soft-reply.vs-door .vs-door__opened,
.theme-soft-reply.vs-sheet .vs-door__opened {
  margin-inline-start: auto;
}
.theme-soft-reply.vs-door .vs-door__caps,
.theme-soft-reply.vs-sheet .vs-door__caps {
  margin: 0 0 10px;
  font-size: var(--fs-meta);
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--text-mid);
}
.theme-soft-reply.vs-door .vs-door__woken,
.theme-soft-reply.vs-sheet .vs-door__woken {
  border-block-start: 1px solid var(--hairline);
  padding-block-start: 16px;
}
.theme-soft-reply.vs-door .vs-door__severity-note,
.theme-soft-reply.vs-sheet .vs-door__severity-note {
  margin-inline-start: 10px;
  color: var(--text-mid);
}
.theme-soft-reply.vs-door .vs-door__act,
.theme-soft-reply.vs-sheet .vs-door__act {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.skiwo-ui .vs-paper {
  max-inline-size: 820px;
  padding: 44px 56px 40px;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: var(--r-card);
  counter-reset: vs-paper-section;
}
.skiwo-ui .vs-paper .vs-paper__eyebrow {
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-mid);
}
.skiwo-ui .vs-paper .vs-paper__title {
  margin: 8px 0 22px;
  font-family: var(--font-display);
  font-size: 26px;
  line-height: 1.2;
}
.skiwo-ui .vs-paper .vs-paper__meta {
  padding-block: 14px;
  border-block: 1px solid var(--hairline);
}
.skiwo-ui .vs-paper .vs-paper__section {
  margin-block: 30px 10px;
}
.skiwo-ui .vs-paper .vs-paper__section .skiwo-section-head__title::before {
  counter-increment: vs-paper-section;
  content: counter(vs-paper-section);
  display: inline-block;
  min-inline-size: 22px;
  font-weight: 400;
  color: var(--text-mid);
}
.skiwo-ui .vs-paper .vs-document__quote {
  font-style: italic;
}
.skiwo-ui .vs-paper .vs-document__meta {
  color: var(--text-mid);
  font-size: var(--fs-meta);
}
.skiwo-ui .vs-paper .skiwo-table__scroll + .skiwo-prose {
  margin-block-start: 10px;
}
.skiwo-ui .vs-paper .vs-document__foot {
  margin-block-start: 36px;
  padding-block-start: 14px;
  border-block-start: 1px solid var(--hairline);
  font-size: var(--fs-body-sm);
}
.skiwo-ui .vs-paper .vs-document__foot p {
  margin: 0 0 4px;
}

.theme-soft-reply.vs-document {
  background: var(--bg-app);
  color: var(--text);
}
.theme-soft-reply.vs-document .vs-document__page {
  max-inline-size: 884px;
  margin-inline: auto;
  padding: 32px 32px 56px;
}
.theme-soft-reply.vs-document .vs-document__actions {
  display: flex;
  justify-content: flex-end;
  margin-block-end: 12px;
}
@media print {
  .theme-soft-reply.vs-document {
    background: white;
    color: black;
  }
  .theme-soft-reply.vs-document .vs-document__page {
    max-inline-size: none;
    padding: 0;
  }
  .theme-soft-reply.vs-document .vs-document__actions {
    display: none;
  }
}

@media print {
  .skiwo-ui .vs-paper {
    max-inline-size: none;
    padding: 0;
    border: 0;
  }
  .skiwo-ui .vs-paper .vs-paper__section {
    break-after: avoid;
  }
  .skiwo-ui .vs-paper table {
    break-inside: auto;
  }
  .skiwo-ui .vs-paper tr {
    break-inside: avoid;
  }
  .skiwo-ui .vs-paper .vs-document__foot {
    break-inside: avoid;
  }
}
@media (max-width: 720px) {
  .skiwo-ui .vs-paper {
    padding: 24px 20px;
  }
}
.theme-soft-reply.vs-marketing .vs-marketing__main {
  max-inline-size: var(--content-max);
  margin-inline: auto;
  padding: 0 var(--mkt-gutter) 64px;
}
.theme-soft-reply.vs-marketing .vs-marketing__main .skiwo-legal :is(.skiwo-legal__hero, .skiwo-legal__body, .skiwo-legal__contact) {
  padding-inline: 0;
}
.theme-soft-reply.vs-marketing .vs-marketing__section {
  padding-block: 64px;
  border-block-start: 1px solid var(--hairline);
}
.theme-soft-reply.vs-marketing .vs-marketing__section > * + * {
  margin-block-start: 14px;
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-section-head + * + .skiwo-section-head {
  margin-block-start: 48px;
}
.theme-soft-reply.vs-marketing .vs-marketing__section--slim {
  padding-block: 40px;
}
.theme-soft-reply.vs-marketing .vs-marketing__section--narrow {
  max-inline-size: 640px;
  border: 0;
}
@media (max-width: 900px) {
  .theme-soft-reply.vs-marketing .vs-marketing__section {
    padding-block: 44px;
  }
}

.vs-vignette {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}
.vs-vignette__phone {
  inline-size: 270px;
  padding: 22px 20px;
  border-radius: 24px;
  background: var(--surface);
  border: 1px solid var(--border-2);
  color: var(--text);
  box-shadow: var(--sh-float);
}
.vs-vignette__product {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-block-end: 12px;
  font-size: 11.5px;
  font-weight: 700;
}
.vs-vignette__time {
  margin-inline-start: auto;
  font-family: var(--font-mono);
  font-size: 10.5px;
  color: var(--text-mid);
}
.vs-vignette__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 17px;
  line-height: 1.3;
  margin-block-end: 12px;
}
.vs-vignette__line {
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--text-mid);
  margin-block-end: 14px;
}
.vs-vignette__press {
  padding: 12px;
  border-radius: 10px;
  background: var(--brand);
  color: var(--on-brand);
  text-align: center;
  font-size: 13px;
  font-weight: 700;
}
.vs-vignette__report {
  inline-size: 230px;
  margin-block-start: 44px;
  padding: 20px;
  background: var(--surface);
  border: 1px solid var(--border-2);
  box-shadow: var(--sh-float);
}
.vs-vignette__caps {
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--text-mid);
  margin-block-end: 5px;
}
.vs-vignette__heading {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 14px;
  line-height: 1.3;
  padding-block-end: 8px;
  margin-block-end: 10px;
  border-block-end: 2px solid var(--text);
}
.vs-vignette__facts {
  font-size: 10px;
  line-height: 1.7;
  color: var(--text-mid);
  white-space: pre-line;
}
@media (max-width: 900px) {
  .vs-vignette {
    flex-wrap: wrap;
  }
  .vs-vignette__report {
    margin-block-start: 0;
  }
}