@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.
   ========================================================================== */
:root {
  /* ---- 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: #FBFAFE; /* app canvas behind cards: near-white, faint lilac */
  --surface: #FFFFFF; /* cards, bars, inputs */
  --surface-2: #FAFBFC; /* subtle raised/inset (filter bars, source cells) */
  --surface-3: #FBFBFC; /* read-only cell bg */
  --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: #E8EAEF; /* card border (slightly stronger) */
  --border-4: #E4E6EB; /* control/input border */
  /* ---- 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: #8A8F9C; /* meta, placeholders */
  --text-faint2: #9499A6; /* keys, captions, disabled */
  --on-brand: #FFFFFF; /* fg on a solid brand/coloured fill (primary btn, done marker) — stays white in dark too */
  --icon-faint: #A9AEBA; /* default stroke-icon color in lists */
  /* ---- 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). #1E8457 is the same hue and saturation, two steps darker:
     4.51:1 on --surface-2, 4.67:1 on white. */
  --ok: #1E8457;
  --ok-bar: #27a36b;
  --ok-tint: #E6F4EC; /* Approved / live / 100% */
  --info: #3A6EA5;
  --info-bar: #4581c2;
  --info-tint: #E8F0F8; /* AI draft / in-progress / mid */
  --warn: #9a6a17;
  --warn-bar: #cf982f;
  --warn-tint: #FBF1DF; /* Needs review / low coverage */
  --warn-strong:#c79a3a; /* amber editor border for review state */
  --danger: #C2410C;
  --danger-ink:#C06868;
  --danger-tint: #FBE9E2; /* Empty / Untranslated */
  --danger-cell:#FDF6F6; /* untranslated grid-cell bg */
  --destruct: #D14343; /* destructive actions (delete, remove) */
  /* ---- 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 */
  --fs-display:36px;
  --fw-display:700; /* hero numbers — pricing amount, big stat */
  --fs-page: 22px;
  --fw-page: 700; /* page H1 */
  --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;
  /* ---- Spacing scale (4px base) ---- */
  --s-1: 4px;
  --s-2: 6px;
  --s-3: 8px;
  --s-4: 10px;
  --s-5: 12px;
  --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 scale */
  /* ---- 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 */
  --r-control: 12px; /* 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: 10px; /* small inline buttons */
  --r-card: 16px; /* cards */
  --r-card-lg: 20px; /* large panels */
  --r-pill: 999px;
  /* ---- 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(16,18,30,.04); /* resting card */
  --sh-raise: 0 6px 20px rgba(16,18,30,.09); /* hover card */
  --sh-float: 0 14px 44px rgba(20,22,40,.12); /* modals, menus, popovers */
  --sh-btn: 0 2px 8px rgba(91,91,214,.35); /* primary button, brand-tinted (themes retint) */
  --sh-focus: 0 0 0 3px var(--brand-ring); /* focused control ring */
  --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 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;
  /* 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: 216px;
  --sidebar-w-collapsed: 52px;
  --rail-w: 200px; /* the Folder column — a FLOOR; it grows to fit */
  --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 */
  --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-9); /* UI::PageHeader space below the title row */
  --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: #15161C;
  --surface: #1B1D27;
  --surface-2:#20222D;
  --surface-3:#20222D;
  --surface-light-violet:#201F33;
  /* --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;
  /* 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:#7C8090;
  --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;
  --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: #15161C;
    --surface: #1B1D27;
    --surface-2:#20222D;
    --surface-3:#20222D;
    --surface-light-violet:#201F33;
    /* --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;
    /* 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:#7C8090;
    --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;
    --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);
  }
}
/* 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-4);
  --dz-pagehead-gap: var(--s-5);
}

/* 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 .skiwo-app-shell {
  --content-max: none;
  --rail-bg: var(--brand);
  --rail-edge: color-mix(in srgb, var(--on-brand) 18%, transparent);
  --folderrail-bg: var(--surface);
  --folderrail-hover: var(--surface-2);
  --rail-ink: var(--on-brand);
  --rail-ink-idle: color-mix(in srgb, var(--on-brand) 78%, transparent);
  --rail-icon: color-mix(in srgb, var(--on-brand) 78%, transparent);
  --rail-hover-bg: color-mix(in srgb, var(--on-brand) 10%, transparent);
  --rail-active-bg: color-mix(in srgb, var(--on-brand) 16%, transparent);
  --rail-active-ink: var(--on-brand);
  --rail-active-icon: var(--candy-yellow);
  --rail-toggle-bg: color-mix(in srgb, var(--on-brand) 10%, transparent);
  --sidebar-ink: var(--on-brand);
}
.theme-amondinops .skiwo-app-shell .vs-room--form {
  --skiwo-room-measure: 832px;
}
@media (min-width: 841px) {
  .theme-amondinops .skiwo-app-shell .skiwo-topbar {
    padding-inline-start: 0;
  }
  .theme-amondinops .skiwo-app-shell .skiwo-topbar__lead {
    display: none;
  }
  .theme-amondinops .skiwo-app-shell .skiwo-topbar__center {
    align-self: stretch;
  }
  .theme-amondinops .skiwo-app-shell .skiwo-topbar__search {
    position: relative;
    align-self: stretch;
    display: flex;
    border-inline-end: 1px solid var(--border-2);
  }
  .theme-amondinops .skiwo-app-shell .skiwo-topbar__search .skiwo-field {
    flex: 1 1 auto;
    margin: 0;
  }
  .theme-amondinops .skiwo-app-shell .skiwo-topbar__search .skiwo-input {
    block-size: 100%;
    min-block-size: 0;
    padding-inline: 44px var(--s-5);
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .theme-amondinops .skiwo-app-shell .skiwo-topbar__search .skiwo-input:focus, .theme-amondinops .skiwo-app-shell .skiwo-topbar__search .skiwo-input:focus-visible {
    outline: none;
    background: var(--surface-2);
    box-shadow: inset 0 -2px 0 var(--brand);
  }
  .theme-amondinops .skiwo-app-shell .skiwo-topbar__search::before {
    content: "";
    position: absolute;
    inset-inline-start: var(--s-5);
    inset-block-start: 50%;
    inline-size: 14px;
    block-size: 14px;
    transform: translateY(-50%);
    background: var(--icon-faint);
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='7' cy='7' r='5' fill='none' stroke='%23000' stroke-width='1.6'/%3E%3Cpath d='m11 11 3.5 3.5' stroke='%23000' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
    pointer-events: none;
    z-index: 1;
  }
}
.theme-amondinops .skiwo-app-shell .vs-today__answer .skiwo-empty-state {
  padding-block: 8px;
}
.theme-amondinops .skiwo-app-shell .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 .skiwo-app-shell .vs-today__since .skiwo-list-item__leading .vs-door__mark,
.theme-amondinops .skiwo-app-shell .vs-burning .vs-door__mark {
  inline-size: 10px;
  block-size: 10px;
  border-radius: 3px;
  display: inline-block;
}
.theme-amondinops .skiwo-app-shell .vs-intro .skiwo-fact-list + .skiwo-btn {
  margin-block-start: var(--s-6);
}
.theme-amondinops .skiwo-app-shell .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 .skiwo-app-shell .vs-get-started__act {
  display: flex;
  align-items: center;
  gap: var(--s-3);
}
.theme-amondinops .skiwo-app-shell .vs-burning .skiwo-section-head {
  margin-block-end: 14px;
}
.theme-amondinops .skiwo-app-shell .vs-burning .skiwo-tabs {
  margin-block-end: 18px;
}
.theme-amondinops .skiwo-app-shell .vs-burning .vs-today__caps {
  margin-block-start: 24px;
}
.theme-amondinops .skiwo-app-shell .vs-burning__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.theme-amondinops .skiwo-app-shell .vs-burning__state {
  font-size: var(--fs-meta);
  font-weight: 600;
  color: var(--text);
}
.theme-amondinops .skiwo-app-shell .vs-burning .vs-tone--danger {
  color: var(--danger);
  font-weight: 700;
}
.theme-amondinops .skiwo-app-shell .vs-burning .vs-tone--warn {
  color: var(--warn);
  font-weight: 700;
}
.theme-amondinops .skiwo-app-shell .vs-burning .vs-tone--ok {
  color: var(--ok);
}
.theme-amondinops .skiwo-app-shell .vs-burning__confirm {
  display: contents;
}
.theme-amondinops .skiwo-app-shell .vs-burning__confirm .skiwo-field {
  margin: 0;
  flex: 1 1 40%;
  min-inline-size: 0;
}
.theme-amondinops .skiwo-app-shell .vs-incident > * + * {
  margin-block-start: var(--s-5);
}
.theme-amondinops .skiwo-app-shell .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 .skiwo-app-shell .vs-incident__course {
  margin: 0;
  font-size: var(--fs-body-sm);
  color: var(--text-mid);
}
.theme-amondinops .skiwo-app-shell .vs-incident__body {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}
.theme-amondinops .skiwo-app-shell .vs-incident__timeline {
  flex: 1 1 auto;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
}
.theme-amondinops .skiwo-app-shell .vs-incident__aside {
  flex: none;
  inline-size: 340px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
@media (max-width: 1100px) {
  .theme-amondinops .skiwo-app-shell .vs-incident__body {
    flex-direction: column;
  }
  .theme-amondinops .skiwo-app-shell .vs-incident__aside {
    inline-size: 100%;
  }
}
.theme-amondinops .skiwo-app-shell .vs-incident__significance {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--s-3);
  margin-block-start: var(--s-5);
}
.theme-amondinops .skiwo-app-shell .vs-incident__copy {
  margin: 0;
  white-space: pre-wrap;
  font-family: var(--font-mono);
  font-size: var(--fs-meta);
}
.theme-amondinops .skiwo-app-shell .vs-promises {
  min-inline-size: 0;
}
.theme-amondinops .skiwo-app-shell .vs-promises .skiwo-card {
  overflow-x: auto;
}
.theme-amondinops .skiwo-app-shell .vs-promises > * + * {
  margin-block-start: var(--s-7);
}
.theme-amondinops .skiwo-app-shell .vs-promises__heard {
  font-family: var(--font-mono);
  font-size: var(--fs-meta);
}
.theme-amondinops .skiwo-app-shell .vs-promises__name {
  font-weight: 600;
  color: inherit;
  text-decoration: none;
}
.theme-amondinops .skiwo-app-shell .vs-promises__name:hover {
  text-decoration: underline;
}
.theme-amondinops .skiwo-app-shell .skiwo-page-header__leading {
  display: flex;
  align-items: center;
  margin-block-start: 2px;
  align-self: flex-start;
}
.theme-amondinops .skiwo-app-shell .vs-promise__finding, .theme-amondinops .skiwo-app-shell .vs-promise__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
}
.theme-amondinops .skiwo-app-shell .vs-promise__instructions {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  margin-block-end: var(--s-3);
}
.theme-amondinops .skiwo-app-shell .vs-promise__write {
  margin-block-start: var(--s-3);
}
.theme-amondinops .skiwo-app-shell .vs-promise__write > summary {
  cursor: pointer;
  margin-block-end: var(--s-3);
}
.theme-amondinops .skiwo-app-shell .vs-setup-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.theme-amondinops .skiwo-app-shell .vs-setup-page__rail {
  margin-block-end: 8px;
}
.theme-amondinops .skiwo-app-shell .vs-services {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.theme-amondinops .skiwo-app-shell .vs-services .skiwo-card__body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.theme-amondinops .skiwo-app-shell .vs-services__publish {
  margin-block-start: var(--s-4);
}
.theme-amondinops .skiwo-app-shell .vs-services__publish .skiwo-prose {
  margin-block-end: var(--s-4);
}
.theme-amondinops .skiwo-app-shell .vs-woken__job {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-block: 10px;
}
.theme-amondinops .skiwo-app-shell .vs-woken__job + .vs-woken__job {
  border-block-start: 1px solid var(--border-4);
}
.theme-amondinops .skiwo-app-shell .vs-woken__holder {
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  font-size: var(--fs-body-sm);
  color: var(--text-mid);
}
.theme-amondinops .skiwo-app-shell .vs-setup {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.theme-amondinops .skiwo-app-shell .vs-setup .skiwo-card__body {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.theme-amondinops .skiwo-app-shell .vs-setup__choices {
  margin: 0;
  padding: 0;
  border: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.theme-amondinops .skiwo-app-shell .vs-setup__choices legend {
  padding: 0;
  font-size: 12.5px;
  font-weight: 600;
  margin-block-end: 5px;
}
.theme-amondinops .skiwo-app-shell .vs-setup__choices--grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.theme-amondinops .skiwo-app-shell .vs-setup__choices--grid > .skiwo-choice-card:last-of-type:nth-of-type(odd) {
  grid-column: 1/-1;
}
@media (max-width: 720px) {
  .theme-amondinops .skiwo-app-shell .vs-setup__choices--grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
.theme-amondinops .skiwo-app-shell .vs-setup__row {
  display: flex;
  gap: 10px;
}
.theme-amondinops .skiwo-app-shell .vs-setup__row > * {
  flex: 1 1 50%;
  min-inline-size: 0;
}
.theme-amondinops .skiwo-app-shell .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 .skiwo-app-shell .vs-setup__inline legend {
  float: inline-start;
  inline-size: 100%;
  margin-block-end: var(--s-2);
  color: var(--text-2);
}
.theme-amondinops .skiwo-app-shell .vs-setup__inline > .skiwo-btn {
  align-self: flex-start;
}
.theme-amondinops .skiwo-app-shell .vs-setup__buttons {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-block-start: 4px;
}
.theme-amondinops .skiwo-app-shell .vs-setup__cancel {
  margin-inline-start: auto;
  font-size: var(--fs-body-sm);
  color: var(--text-muted);
}
.theme-amondinops .skiwo-app-shell .vs-setup__fact {
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
}
.theme-amondinops .skiwo-app-shell .vs-setup__preview-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-block-end: 10px;
}
.theme-amondinops .skiwo-app-shell .vs-snippet {
  max-inline-size: 760px;
}
.theme-amondinops .skiwo-app-shell .vs-snippet > * + * {
  margin-block-start: var(--s-5);
}
.theme-amondinops .skiwo-app-shell .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 .skiwo-app-shell .vs-snippet__dot {
  inline-size: 10px;
  block-size: 10px;
  border-radius: var(--r-pill);
  background: var(--border-3);
  flex: none;
}
.theme-amondinops .skiwo-app-shell .vs-snippet__dot.is-on {
  background: var(--ok);
}
.theme-amondinops .skiwo-app-shell .vs-snippet__checking {
  margin-inline-start: auto;
  font-family: var(--font-mono);
  font-size: 11.5px;
}
.theme-amondinops .skiwo-app-shell .vs-woken {
  display: flex;
  align-items: flex-start;
  gap: 28px;
}
.theme-amondinops .skiwo-app-shell .vs-woken__people {
  flex: 1 1 auto;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.theme-amondinops .skiwo-app-shell .vs-woken__ladders {
  flex: 1 1 auto;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (max-width: 1180px) {
  .theme-amondinops .skiwo-app-shell .vs-woken {
    flex-direction: column;
  }
  .theme-amondinops .skiwo-app-shell .vs-woken__people {
    inline-size: 100%;
  }
}
.theme-amondinops .skiwo-app-shell .vs-woken__form {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
}
.theme-amondinops .skiwo-app-shell .vs-woken__form > .skiwo-btn {
  align-self: flex-start;
}
.theme-amondinops .skiwo-app-shell .vs-woken__pick {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--s-3);
  margin-block-start: var(--s-4);
}
.theme-amondinops .skiwo-app-shell .vs-woken__pick .skiwo-field {
  margin: 0;
  flex: 1 1 200px;
}
.theme-amondinops .skiwo-app-shell .vs-people {
  overflow: hidden;
}
.theme-amondinops .skiwo-app-shell .vs-person {
  display: grid;
  grid-template-columns: minmax(220px, 1.1fr) minmax(220px, 1fr) 17rem;
  align-items: center;
  gap: var(--s-4) var(--s-6);
  padding: var(--s-5) var(--s-6);
}
.theme-amondinops .skiwo-app-shell .vs-person + .vs-person {
  border-block-start: 1px solid var(--border-2);
}
@media (max-width: 900px) {
  .theme-amondinops .skiwo-app-shell .vs-person {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }
}
.theme-amondinops .skiwo-app-shell .vs-person__who {
  display: flex;
  align-items: center;
  gap: var(--s-4);
  min-inline-size: 0;
}
.theme-amondinops .skiwo-app-shell .vs-person__name {
  font-size: 14px;
  font-weight: 700;
}
.theme-amondinops .skiwo-app-shell .vs-person__meta {
  margin-block-start: 2px;
  font-size: var(--fs-meta);
  color: var(--text-mid);
}
.theme-amondinops .skiwo-app-shell .vs-person__reach {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-inline-size: 0;
  font-family: var(--font-mono);
  font-size: var(--fs-meta);
  color: var(--text-2);
}
.theme-amondinops .skiwo-app-shell .vs-person__channel {
  overflow-wrap: anywhere;
}
.theme-amondinops .skiwo-app-shell .vs-person__channel i {
  inline-size: 18px;
  color: var(--text-mid);
}
.theme-amondinops .skiwo-app-shell .vs-person__language {
  font-family: var(--font-ui);
  color: var(--text-mid);
}
.theme-amondinops .skiwo-app-shell .vs-person__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--s-2);
}
@media (max-width: 900px) {
  .theme-amondinops .skiwo-app-shell .vs-person__actions {
    justify-content: flex-start;
  }
}
.theme-amondinops .skiwo-app-shell .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 .skiwo-app-shell .vs-person--gone {
  opacity: 0.72;
}
.theme-amondinops .skiwo-app-shell .vs-woken__add {
  align-self: flex-start;
}
.theme-amondinops .skiwo-app-shell .vs-workspace {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
@media (max-width: 980px) {
  .theme-amondinops .skiwo-app-shell .vs-workspace {
    grid-template-columns: 1fr;
  }
}
.theme-amondinops .skiwo-app-shell .vs-workspace__label {
  margin: 14px 0 8px;
  font-size: 12.5px;
  font-weight: 600;
}
.theme-amondinops .skiwo-app-shell .vs-workspace__days {
  margin: 0;
  padding: 0;
  border: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.theme-amondinops .skiwo-app-shell .vs-workspace__days legend {
  padding: 0;
  font-size: 12.5px;
  font-weight: 600;
  margin-block-end: 5px;
}
.theme-amondinops .skiwo-app-shell .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 .skiwo-app-shell .vs-workspace__inline {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--s-3);
  margin-block-start: var(--s-5);
}
.theme-amondinops .skiwo-app-shell .vs-workspace__inline .skiwo-field {
  margin: 0;
  flex: 1 1 160px;
}
.theme-amondinops .skiwo-app-shell .vs-services-page {
  min-inline-size: 0;
}
.theme-amondinops .skiwo-app-shell .vs-services-page .skiwo-card {
  overflow-x: auto;
}
.theme-amondinops .skiwo-app-shell .vs-services-page > * + * {
  margin-block-start: var(--s-5);
}
.theme-amondinops .skiwo-app-shell .vs-service-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.theme-amondinops .skiwo-app-shell .vs-service-row__who {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-inline-size: 0;
}
.theme-amondinops .skiwo-app-shell .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 .skiwo-app-shell .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 .skiwo-app-shell .vs-service {
  max-inline-size: 760px;
}
.theme-amondinops .skiwo-app-shell .vs-service__question {
  display: flex;
  flex-direction: column;
  gap: var(--s-2);
}
.theme-amondinops .skiwo-app-shell .vs-service__question > .skiwo-field__label {
  margin: 0;
}
.theme-amondinops .skiwo-app-shell .vs-service__question > .skiwo-segmented {
  align-self: flex-start;
}
.theme-amondinops .skiwo-app-shell .vs-service__fields {
  display: flex;
  flex-direction: column;
  gap: var(--s-4);
}
.theme-amondinops .skiwo-app-shell .vs-service__fields > .skiwo-btn {
  align-self: flex-start;
}
.theme-amondinops .skiwo-app-shell .vs-index .skiwo-card {
  overflow-x: auto;
}
.theme-amondinops .skiwo-app-shell .vs-index > * + * {
  margin-block-start: var(--s-7);
}
.theme-amondinops .skiwo-app-shell .vs-index__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  margin-block: 18px 10px;
}
.theme-amondinops .skiwo-app-shell .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 .skiwo-app-shell .vs-index__jump-label {
  margin-inline-end: var(--s-2);
}
.theme-amondinops .skiwo-app-shell .vs-index__number {
  font-family: var(--font-mono);
  font-size: var(--fs-meta);
  color: inherit;
  text-decoration: none;
}
.theme-amondinops .skiwo-app-shell .vs-filing .vs-incident__product a {
  color: inherit;
  text-decoration: none;
}
.theme-amondinops .skiwo-app-shell .vs-filing__form {
  display: flex;
  flex-direction: column;
  gap: var(--s-5);
  margin-block-start: var(--s-5);
}
.theme-amondinops .skiwo-app-shell .vs-filing__acts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  margin-block: var(--s-5);
}
.theme-amondinops .skiwo-app-shell .vs-burning__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  margin-block: 18px 16px;
}
.theme-amondinops .skiwo-app-shell .vs-burning__filters-note {
  font-size: 12.5px;
  color: var(--text-mid);
}
.theme-amondinops .skiwo-app-shell .vs-workspace__template-name {
  flex-basis: 100%;
  font-weight: 600;
  font-size: var(--fs-body-sm);
}
.theme-amondinops .skiwo-app-shell .vs-workspace__template + .vs-workspace__template {
  border-block-start: 1px solid var(--border-4);
  padding-block-start: var(--s-5);
}
.theme-amondinops .skiwo-app-shell .vs-workspace__template-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-2) var(--s-4);
  margin-block-start: var(--s-3);
  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;
}
.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-door .vs-attest__row,
.theme-soft-reply.vs-sheet .vs-attest__row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 20px;
  border-block-end: 1px solid var(--hairline);
}
.theme-soft-reply.vs-door .vs-attest__row:last-of-type,
.theme-soft-reply.vs-sheet .vs-attest__row:last-of-type {
  border-block-end: 0;
}
.theme-soft-reply.vs-door .vs-attest__who,
.theme-soft-reply.vs-sheet .vs-attest__who {
  flex: 1;
  min-inline-size: 0;
}
.theme-soft-reply.vs-door .vs-attest__name,
.theme-soft-reply.vs-sheet .vs-attest__name {
  font-size: var(--fs-body);
  font-weight: 600;
}
.theme-soft-reply.vs-door .vs-attest__meta,
.theme-soft-reply.vs-sheet .vs-attest__meta {
  font-size: var(--fs-meta);
  color: var(--text-muted);
}
.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 .skiwo-section-head__title,
.theme-soft-reply.vs-sheet .skiwo-section-head__title {
  font-family: var(--font-display);
  font-size: 27px;
  font-weight: 700;
  line-height: 1.22;
  text-wrap: pretty;
}
.theme-soft-reply.vs-door .vs-door__act,
.theme-soft-reply.vs-sheet .vs-door__act {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.theme-soft-reply.vs-door .vs-door__act .skiwo-btn,
.theme-soft-reply.vs-sheet .vs-door__act .skiwo-btn {
  inline-size: 100%;
  justify-content: center;
}
.theme-soft-reply.vs-door .vs-door__act .skiwo-prose,
.theme-soft-reply.vs-sheet .vs-door__act .skiwo-prose {
  text-align: center;
  color: var(--text-mid);
}

.theme-soft-reply.vs-door {
  color-scheme: dark;
  --bg-app: #17131F;
  --surface: #201A2E;
  --surface-2: #201A2E;
  --text: #F2EFFA;
  --text-2: #F2EFFA;
  --text-mid: #B7AFD1;
  --text-muted: #B7AFD1;
  --text-faint: #B7AFD1;
  --border-2: #322A47;
  --border-3: #4A3F68;
  --hairline: #322A47;
  --brand: #5B3DF5;
  --on-brand: #FFFFFF;
  --warn: #FFD466;
  --warn-tint: #3A2E14;
  --danger: #E75A9B;
  --danger-tint: #3A1626;
  --ok: #5FD9A2;
  --ok-tint: #123526;
  background: var(--bg-app);
  color: var(--text);
}

.theme-soft-reply.vs-document {
  background: var(--bg-app);
  color: var(--text);
}
.theme-soft-reply.vs-document .vs-document__page {
  max-inline-size: 820px;
  margin-inline: auto;
  padding: 40px 32px 56px;
}
.theme-soft-reply.vs-document .vs-document__head {
  margin-block-end: 24px;
}
.theme-soft-reply.vs-document .vs-document__report {
  margin: 0 0 6px;
  font-family: var(--font-mono);
  font-size: 11.5px;
  color: var(--text-mid);
}
.theme-soft-reply.vs-document .skiwo-section-head {
  margin-block: 28px 10px;
}
.theme-soft-reply.vs-document .vs-document__quote {
  font-style: italic;
}
.theme-soft-reply.vs-document .vs-document__meta {
  color: var(--text-mid);
  font-size: var(--fs-meta);
}
.theme-soft-reply.vs-document .vs-document__foot {
  margin-block-start: 36px;
  padding-block-start: 14px;
  border-block-start: 1px solid var(--hairline);
  font-size: var(--fs-body-sm);
}
.theme-soft-reply.vs-document .vs-document__foot p {
  margin: 0 0 4px;
}
@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 .skiwo-btn, .theme-soft-reply.vs-document .skiwo-page-header__actions {
    display: none;
  }
  .theme-soft-reply.vs-document .skiwo-section-head {
    break-after: avoid;
  }
  .theme-soft-reply.vs-document table {
    break-inside: auto;
  }
  .theme-soft-reply.vs-document tr {
    break-inside: avoid;
  }
  .theme-soft-reply.vs-document .vs-document__foot {
    break-inside: avoid;
  }
}

.theme-soft-reply.vs-marketing {
  background: var(--bg-app);
  color: var(--text);
}
.theme-soft-reply.vs-marketing .vs-marketing__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 17px;
  color: inherit;
  text-decoration: none;
}
.theme-soft-reply.vs-marketing .vs-marketing__mark {
  inline-size: 30px;
  block-size: 30px;
  border-radius: 9px;
  background: var(--brand);
  color: var(--on-brand);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
}
@media (max-width: 479px) {
  .theme-soft-reply.vs-marketing .vs-marketing__name {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
}
.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 .skiwo-hero {
  padding: 56px var(--mkt-gutter);
  margin-block-start: 28px;
  background: var(--brand-tint);
  border-radius: 28px;
}
.theme-soft-reply.vs-marketing .skiwo-hero__headline {
  font-family: var(--font-display);
  font-size: clamp(30px, 3.1vw, 44px);
  line-height: 1.12;
  letter-spacing: -0.01em;
}
.theme-soft-reply.vs-marketing .skiwo-hero__note {
  margin-block-start: 20px;
  font-size: var(--fs-body-sm);
  color: var(--text-mid);
}
.theme-soft-reply.vs-marketing .skiwo-hero__subtext {
  font-size: 17px;
  line-height: 1.6;
  max-inline-size: 62ch;
}
.theme-soft-reply.vs-marketing .skiwo-hero__eyebrow {
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--brand-ink);
}
.theme-soft-reply.vs-marketing .vs-access__saidby {
  margin-block-start: 4px;
  font-size: var(--fs-body-sm);
  color: var(--text-mid);
}
.theme-soft-reply.vs-marketing .skiwo-hero + .vs-marketing__section {
  border-block-start: 0;
}
.theme-soft-reply.vs-marketing .vs-plans {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--s-4);
  margin-block: var(--s-4);
}
.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 {
  margin: 0 0 24px;
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-section-head__title {
  font-family: var(--font-display);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.01em;
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-section-head__subtext {
  font-size: 16px;
  line-height: 1.6;
  max-inline-size: 70ch;
}
.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 .skiwo-feature-grid {
  gap: 20px;
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-feature-grid__card {
  padding: 24px;
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-feature-grid__step {
  inline-size: 34px;
  block-size: 34px;
  font-size: 17px;
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-feature-grid__title {
  font-size: 17px;
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-feature-grid__blurb {
  font-size: 14.5px;
  line-height: 1.6;
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-fact-list {
  font-size: 15px;
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-fact-row {
  padding-block: 14px;
  border-block-start: 1px solid var(--hairline);
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-fact-row__label {
  font-weight: 650;
  color: var(--text);
}
.theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-fact-row__value {
  line-height: 1.6;
}
.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;
}
.theme-soft-reply.vs-marketing .vs-marketing__acts {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-block: 24px 16px;
}
.theme-soft-reply.vs-marketing .vs-marketing__night .skiwo-feature-grid--auto {
  grid-template-columns: repeat(5, 1fr);
}
@media (max-width: 1100px) {
  .theme-soft-reply.vs-marketing .vs-marketing__night .skiwo-feature-grid--auto {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .theme-soft-reply.vs-marketing .vs-marketing__night .skiwo-feature-grid--auto {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 900px) {
  .theme-soft-reply.vs-marketing .skiwo-hero {
    padding: 36px 24px;
    border-radius: 20px;
  }
  .theme-soft-reply.vs-marketing .skiwo-hero__headline {
    font-size: 32px;
  }
  .theme-soft-reply.vs-marketing .vs-marketing__section {
    padding-block: 44px;
  }
  .theme-soft-reply.vs-marketing .vs-marketing__section .skiwo-section-head__title {
    font-size: 24px;
  }
}

.vs-vignette {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}
.vs-vignette__phone {
  --surface: #17131F;
  --border-2: #322A47;
  --text: #F2EFFA;
  --text-mid: #B7AFD1;
  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;
  }
}