/* RigVault Phase A: product tokens (--rv-*) with AXIOM platform bridge (--fv-*) */

:root {
    --rv-bg: #0f1115;
    --rv-surface-1: #161a20;
    --rv-surface-2: #1c2128;
    --rv-accent: #3b82f6;
    --rv-accent-hover: #2563eb;
    --rv-text: #e6edf3;
    --rv-text-muted: #9aa4b2;
    --rv-border: #262c36;
    --rv-danger: #f87171;
    --rv-success: #34d399;
    --rv-warn: #fbbf24;
    --rv-good: #10b981;
    --rv-doc-pdf: #e0585a;
    --rv-doc-docx: var(--rv-cobalt-bright);
    --rv-doc-image: var(--rv-good);
    --rv-space-1: 8px;
    --rv-space-2: 16px;
    --rv-space-3: 24px;
    --rv-space-4: 32px;
    --rv-radius: 10px;
    --rv-font: "Segoe UI", "Helvetica Neue", Arial, sans-serif;

    --rv-cat-guitars: #f97316;
    --rv-cat-strings: #14b8a6;
    --rv-cat-amps: #eab308;
    --rv-cat-pedals: #22c55e;
    --rv-cat-mics: #06b6d4;
    --rv-cat-interfaces: #8b5cf6;
    --rv-cat-cables: #ec4899;
    /* Cases/Accessories 2026-09-05: previously #64748b/#78716c, two near-identical
       desaturated grays differing only by a subtle cool/warm undertone - hard to tell
       apart at a glance even with normal color vision, and the exact kind of distinction
       color vision deficiency washes out first. Accessories moved to a clearly warm,
       moderately saturated tan/bronze so the two read as genuinely different colors
       (hue and chroma both, not just lightness) rather than two flavors of gray. */
    --rv-cat-cases: #64748b;
    --rv-cat-accessories: #a8763e;
    --rv-cat-brass: #c2410c;
    --rv-cat-computers-tablets: #38bdf8;
    --rv-cat-devices: #6366f1;
    --rv-cat-dj-equipment: #d946ef;
    --rv-cat-drums: #b91c1c;
    --rv-cat-keyboards-synths: #a855f7;
    --rv-cat-lighting: #a3e635;
    --rv-cat-mandolins: #92400e;
    --rv-cat-mixers-consoles: #4f46e5;
    --rv-cat-monitors: #0284c7;
    --rv-cat-pa-live-sound: #059669;
    --rv-cat-power: #f43f5e;
    --rv-cat-racks: #57534e;
    --rv-cat-recording: #7c3aed;
    --rv-cat-stage-equipment: #475569;
    --rv-cat-stands: #94a3b8;
    --rv-cat-studio: #9333ea;
    --rv-cat-video: #a21caf;
    --rv-cat-wireless: #0f766e;
    --rv-cat-woodwinds: #4d7c0f;
    --rv-cat-default: var(--rv-text-muted);

    --rv-res-pro: #eab308;
    --rv-res-booking: #8b5cf6;
    --rv-res-gear-modeling: #06b6d4;
    --rv-res-gear-pedalboard: #22c55e;
    --rv-res-gear-plugins: #f97316;
    --rv-res-insurance: #f43f5e;
    --rv-res-default: var(--rv-text-muted);

    --fv-bg: var(--rv-bg);
    --fv-surface: var(--rv-surface-1);
    --fv-surface-elevated: var(--rv-surface-2);
    --fv-accent: var(--rv-accent);
    --fv-text: var(--rv-text);
    --fv-text-muted: var(--rv-text-muted);
    --fv-border: var(--rv-border);
}

*, *::before, *::after { box-sizing: border-box; }

.cc-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

html, body {
    margin: 0;
    min-height: 100vh;
    min-height: 100dvh;
    color: var(--rv-text);
    font-family: var(--rv-font);
    line-height: 1.5;
}

/* Solid canvas color lives on html ONLY, not body - see body::before below for why. This is also
   what iOS overscroll bounce actually paints (the propagated root/canvas background), consistent
   with rigvault-mobile-background-bleed-brief-2026-08-31, and html-only is the spec-correct place
   for it regardless. */
html {
    background-color: var(--rv-bg);
}

/* "Dual Glow" background: a fixed, viewport-anchored pseudo-element rather than a background-image
   on html/body directly. Two separate bugs stacked here, both confirmed live on production before
   fixing:
   1. background-position percentages (the "10% -10%" / "100% 105%" anchors below) resolve against
      the element's own box - on html/body with default background-attachment, that box is the full
      scrollable DOCUMENT height, not the viewport. Any app-shell page taller than roughly one
      viewport (dashboard, settings, any list) pushed both glows off-canvas entirely. `position:
      fixed` here fixes that - percentages now resolve against the viewport, so both glows land in
      the same visual spot on every page regardless of content length.
   2. Even after fixing #1, nothing was visible - tested by temporarily swapping in neon test colors
      live and still seeing zero trace of them anywhere on the page. Root cause: `body` previously
      carried its own opaque `background-color` (the line removed above), and per the CSS painting
      order, a stacking context's own in-flow background paints AFTER (on top of) its negative
      z-index descendants - z-index: -1 only puts an element behind normal in-flow content, and
      body's own solid background counts as exactly that. So body's opaque color was painting over
      this pseudo-element on every page, unconditionally. Confirmed fixed live by temporarily setting
      body's background-color to transparent - the glow appeared immediately, in the exact expected
      position. Fix: the solid color now lives on html only (see above), leaving body with no
      background-color of its own, so this pseudo-element (z-index: -1, behind normal content, but
      no longer behind an opaque body layer) is what actually shows.
   z-index: -1 is deliberately not paired with `background-attachment: fixed` instead of a
   pseudo-element - that property has known iOS Safari scroll-repaint jank, which this approach
   avoids entirely since nothing repaints on scroll. */
body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image:
        radial-gradient(1200px 700px at 10% -10%, #1e2a45 0%, transparent 55%),
        radial-gradient(1000px 650px at 100% 105%, #241a38 0%, transparent 52%),
        linear-gradient(180deg, #12151b 0%, var(--rv-bg) 100%);
}

a { color: var(--rv-accent); text-decoration: none; }
a:hover { color: var(--rv-accent-hover); }

/* Skip link: hidden until keyboard-focused, first tab stop on the page */
.cc-skip-link {
    position: absolute;
    top: -48px;
    left: var(--rv-space-2);
    z-index: 100;
    padding: 10px 16px;
    background: var(--rv-accent);
    color: #fff;
    border-radius: 8px;
    font-weight: 600;
    transition: top 0.2s ease;
}
.cc-skip-link:focus {
    top: var(--rv-space-2);
    color: #fff;
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-accent) 35%, transparent);
}

.cc-page--auth {
    min-height: 100vh;
    min-height: 100dvh;
    display: grid;
    place-items: center;
    padding: var(--rv-space-3);
}

.cc-auth {
    width: min(100%, 420px);
    display: grid;
    gap: var(--rv-space-3);
}

.cc-auth__brand {
    text-align: center;
}

.cc-auth__mark {
    display: block;
    margin: 0 auto var(--rv-space-2);
    filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.35));
}
.cc-auth__wordmark {
    display: block;
    width: min(320px, 90%);
    height: auto;
    margin: 0 auto var(--rv-space-2);
    filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.35));
}

.cc-auth__title {
    margin: 0;
    font-size: 2rem;
    letter-spacing: 0.02em;
}

.cc-auth__lead {
    margin: var(--rv-space-1) 0 0;
    color: var(--rv-text-muted);
}

.cc-auth__panel,
.cc-panel {
    background: color-mix(in srgb, var(--rv-surface-1) 92%, transparent);
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    padding: var(--rv-space-3);
    box-shadow: 0 1px 2px color-mix(in srgb, black 20%, transparent), 0 8px 20px -16px color-mix(in srgb, black 55%, transparent);
}
a.cc-panel {
    color: inherit;
    text-decoration: none;
}
a.cc-panel:hover {
    color: inherit;
    border-color: var(--fv-accent);
}

.cc-heading { margin: 0 0 var(--rv-space-1); font-size: 1.5rem; }
.cc-subheading { margin: 0 0 var(--rv-space-2); font-size: 1.1rem; }
.cc-copy { margin: 0 0 var(--rv-space-2); color: var(--rv-text-muted); }
.cc-copy--muted { opacity: 0.85; }
.cc-page-description { max-width: 640px; line-height: 1.5; }
.cc-meta { margin: var(--rv-space-2) 0 0; color: var(--rv-text-muted); font-size: 0.925rem; }

.cc-form { display: grid; gap: var(--rv-space-2); }
.cc-auth__panel > .cc-form + .cc-form { margin-top: var(--rv-space-2); }
.cc-field { display: grid; gap: 6px; }
.cc-field--inline {
    display: flex;
    align-items: center;
    gap: 10px;
}
.cc-field--inline .cc-label {
    margin: 0;
    font-weight: 500;
}
.cc-field[hidden] {
    display: none !important;
}
.cc-label { font-size: 0.875rem; color: var(--rv-text-muted); }
.cc-input {
    width: 100%;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid var(--rv-border);
    background: var(--rv-surface-2);
    color: var(--rv-text);
    font-size: 16px;
}

.cc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 8px;
    border: 1px solid transparent;
    font: inherit;
    cursor: pointer;
    text-decoration: none;
}

.cc-btn--primary {
    background: var(--rv-accent);
    color: #fff;
}

.cc-btn--primary:hover { background: var(--rv-accent-hover); color: #fff; }

.cc-btn--ghost {
    background: transparent;
    border-color: var(--rv-border);
    color: var(--rv-text);
}
.cc-btn--secondary {
    background: var(--rv-surface-2);
    border-color: var(--rv-border);
    color: var(--rv-text);
}
.cc-btn--secondary:hover {
    background: var(--rv-surface-1);
    color: var(--rv-text);
}

.cc-btn--block { width: 100%; }
.cc-btn--icon {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex-shrink: 0;
}
.cc-btn--icon svg {
    display: block;
    flex-shrink: 0;
}
.cc-btn--icon span { font-size: 0.875rem; }

.cc-actions { display: flex; flex-wrap: wrap; gap: var(--rv-space-2); }

.cc-alert {
    padding: 10px 12px;
    border-radius: 8px;
    margin: 0 0 var(--rv-space-2);
}

.cc-alert--error {
    background: rgba(248, 113, 113, 0.12);
    border: 1px solid rgba(248, 113, 113, 0.35);
    color: #fecaca;
}

.cc-page--app {
    min-height: 100vh;
    min-height: 100dvh;
    padding-bottom: 72px;
}

.cc-shell {
    display: grid;
    grid-template-columns: var(--rv-sidebar-width, 260px) 1fr;
    min-height: 100vh;
    min-height: 100dvh;
    transition: grid-template-columns 0.22s ease;
}
html.rv-preinit-collapsed .cc-shell,
html:not(.rv-sidebar-hydrated) .cc-shell {
    transition: none !important;
}
.cc-shell.rv-sidebar-settling {
    transition: none !important;
}

.cc-sidebar {
    position: relative;
    border-right: 1px solid var(--rv-border);
    background: var(--rv-surface-1);
    padding: var(--rv-space-3) var(--rv-space-2);
    min-width: 0;
}

.cc-sidebar__brand {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: var(--rv-space-3);
}

.cc-sidebar__wordmark {
    height: 22px;
    width: auto;
}

.cc-sidebar__nav,
.cc-sidebar__link {
    display: grid;
    gap: 6px;
}

.cc-sidebar__divider {
    height: 1px;
    background: var(--rv-border);
    margin: 8px 12px;
}

.cc-faq__divider {
    border: 0;
    height: 1px;
    background: var(--rv-border);
    margin: var(--rv-space-3) 0;
}

.cc-faq__section-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: var(--rv-space-2);
    flex-wrap: wrap;
}
.cc-faq__page-link {
    font-size: 0.85rem;
    color: var(--rv-text-muted);
    white-space: nowrap;
    transition: color 0.15s ease;
}
.cc-faq__page-link:hover,
.cc-faq__page-link:focus-visible {
    color: var(--rv-accent);
}

.cc-combo__empty[hidden] {
    display: none;
}
.cc-combo__already[hidden] {
    display: none;
}

/* Real search-dropdown widget (2026-09-17 rebuild, see combo.js) - was previously relying on
   native <datalist> suggestions, which never reliably showed. This renders and positions its
   own menu instead. */
.cc-combo {
    position: relative;
}
.cc-combo__menu {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 30;
    max-height: 260px;
    overflow-y: auto;
    background: var(--rv-surface-2);
    border: 1px solid var(--rv-border);
    border-radius: 8px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
    padding: 4px;
}
.cc-combo__option {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    padding: 8px 10px;
    border-radius: 6px;
    font: inherit;
    color: var(--rv-text);
    cursor: pointer;
}
.cc-combo__option:hover,
.cc-combo__option.is-active {
    background: var(--rv-surface-1);
}
.cc-combo__option--create {
    color: var(--rv-accent);
    border-top: 1px solid var(--rv-border);
    margin-top: 2px;
    padding-top: 10px;
}
.cc-combo__empty-row {
    padding: 8px 10px;
    color: var(--rv-text-muted);
    font-size: 0.85em;
}

/* Category color dot on Loadout requirement rows (Christian, 2026-09-17: "color coding would be
   helpful across the entire app... use category colors"). Reuses the same --rv-cat-* family
   tokens and --cat-color custom property already used by .cc-pill--cat on the Assets index. */
.cc-cat-dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: var(--cat-color, var(--rv-cat-default));
    margin-right: 7px;
    vertical-align: middle;
    flex: none;
}
.cc-panel__header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rv-space-2);
    margin-bottom: var(--rv-space-2);
}
.cc-panel__header-row .cc-subheading {
    margin: 0;
}
#assigned-assets,
#loose-consumables {
    scroll-margin-top: 88px;
}

.cc-case-assign {
    margin-bottom: var(--rv-space-3);
}

.cc-table__num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.cc-table-title-btn {
    display: inline;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.cc-table-title-btn:hover strong {
    color: var(--rv-accent);
}

.cc-table .cc-truncate {
    display: block;
    max-width: 280px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cc-case-item-edit__form {
    display: grid;
    gap: var(--rv-space-2);
    padding: var(--rv-space-2) 0;
}

.cc-case-item-edit__actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.cc-case-item-add {
    margin-top: var(--rv-space-3);
    padding-top: var(--rv-space-3);
    border-top: 1px solid var(--rv-border);
}

.cc-case-item {
    display: grid;
    gap: var(--rv-space-2);
    align-items: start;
}

.cc-case-item__form {
    display: grid;
    gap: var(--rv-space-2);
    flex: 1;
}

.cc-sidebar__link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    color: var(--rv-text-muted);
}

.cc-sidebar__link.is-active {
    background: var(--rv-surface-2);
    color: var(--rv-text);
}

.cc-sidebar__link.is-disabled {
    opacity: 0.45;
    pointer-events: none;
}

.cc-main { display: grid; grid-template-rows: auto 1fr; }

.cc-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rv-space-2);
    min-height: 52px;
    padding: 0 var(--rv-space-3);
    border-bottom: 1px solid var(--rv-border);
    background: color-mix(in srgb, var(--rv-surface-1) 90%, transparent);
}
.cc-topbar__left {
    display: flex;
    align-items: center;
    gap: var(--rv-space-2);
    min-width: 0;
}
.cc-topbar__title {
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cc-breadcrumb {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    overflow: hidden;
}
.cc-breadcrumb__link {
    color: var(--rv-text-muted);
    white-space: nowrap;
    text-decoration: none;
}
.cc-breadcrumb__link:hover {
    color: var(--rv-text);
    text-decoration: underline;
}
.cc-breadcrumb__current {
    font-weight: 600;
    color: var(--rv-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}
.cc-breadcrumb__sep {
    color: var(--rv-text-muted);
    opacity: 0.5;
    flex-shrink: 0;
}
.cc-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.cc-topbar__actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
.cc-topbar__actions form {
    margin: 0;
}
.cc-sidebar-toggle {
    display: none;
}

.cc-content { padding: var(--rv-space-3); }
.cc-content--detail {
    display: grid;
    gap: var(--rv-space-3);
    align-content: start;
}
.cc-content--detail .cc-panel > .cc-subheading,
.cc-content--detail .cc-panel .cc-panel__head .cc-subheading,
.cc-content--detail .cc-panel > .cc-panel__header-row .cc-subheading {
    text-transform: uppercase;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--rv-text-muted);
}

.cc-page-header { margin-bottom: var(--rv-space-3); }

.cc-admin-nav {
    display: flex;
    flex-wrap: wrap;
    gap: var(--rv-space-1);
    margin: 0 0 var(--rv-space-3);
}

.cc-admin-nav .cc-pill.is-active,
.cc-admin-nav .cc-pill[aria-current="page"] {
    border-color: var(--fv-accent);
    background: color-mix(in srgb, var(--fv-accent) 22%, var(--fv-surface-elevated));
}

.cc-kv {
    display: grid;
    gap: 0;
    margin: 0;
}

.cc-kv div {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: var(--rv-space-2);
    padding: 10px 0;
    border-bottom: 1px solid var(--rv-border);
}
.cc-kv div:first-child { padding-top: 0; }
.cc-kv div:last-child { border-bottom: none; padding-bottom: 0; }

.cc-kv dt { color: var(--rv-text-muted); margin: 0; }
.cc-kv dd { margin: 0; }

/* Team invite form - Crew section-access grid (2026-09-16). A fixed label column keeps every
   row aligned regardless of label length ("Assets" vs "Asset Pricing & Value"), and capping
   the select's width stops it stretching to the full panel width the way a text .cc-input
   normally does. Previously built from .cc-toggle-list + .cc-field--inline, which had no fixed
   column and let long labels wrap the row into a ragged two-line mess. */
.cc-access-grid {
    display: grid;
    gap: 0;
    margin: var(--rv-space-2) 0 0;
}
.cc-access-grid__row {
    display: grid;
    grid-template-columns: 180px 160px;
    align-items: center;
    gap: var(--rv-space-2);
    padding: 8px 0;
    border-bottom: 1px solid var(--rv-border);
}
.cc-access-grid__row:first-child { padding-top: 0; }
.cc-access-grid__row:last-child { border-bottom: none; padding-bottom: 0; }
.cc-access-grid__label { font-size: 0.875rem; color: var(--rv-text-muted); }
.cc-access-grid__row .cc-input { width: auto; }
@media (max-width: 480px) {
    .cc-access-grid__row { grid-template-columns: 1fr; gap: 4px; }
    .cc-access-grid__row .cc-input { width: 100%; }
}

/* Settings > Team's inline edit row (2026-09-16): a colspan cell holding a full .cc-form,
   directly beneath the member row its Edit button toggles. Overrides the generic .cc-table td
   rules (including the mobile flex/space-between conversion) since this cell isn't a data
   column, it's a form. */
.cc-team-edit-row td {
    background: var(--rv-surface-2);
}
@media (max-width: 900px) {
    .cc-team-edit-row td {
        display: block;
        text-align: left;
    }
}

.cc-mobile-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    display: none;
    grid-template-columns: repeat(5, 1fr);
    background: var(--rv-surface-1);
    border-top: 1px solid var(--rv-border);
    z-index: 20;
    padding-bottom: env(safe-area-inset-bottom);
}

.cc-mobile-nav__item {
    display: grid;
    justify-items: center;
    gap: 4px;
    padding: 8px 4px;
    font-size: 0.72rem;
    color: var(--rv-text-muted);
    background: none;
    border: 0;
}

.cc-mobile-nav__item.is-active { color: var(--rv-accent); }
.cc-mobile-nav__item.is-disabled { opacity: 0.4; pointer-events: none; }

.cc-icon { flex-shrink: 0; }

@media (min-width: 901px) {
    .cc-sidebar-toggle {
        display: inline-flex;
        gap: 2px;
        padding-inline: 6px;
    }
    .cc-sidebar-toggle__chevron {
        display: inline-flex;
        transition: transform 0.22s ease;
    }
    .cc-shell.is-collapsed .cc-sidebar-toggle__chevron,
    html.rv-preinit-collapsed .cc-sidebar-toggle__chevron {
        transform: scaleX(-1);
    }
    .cc-sidebar__edge {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: 4px;
        padding: 0;
        border: 0;
        background: transparent;
        cursor: col-resize;
        z-index: 2;
    }
    .cc-sidebar__edge:hover,
    .cc-sidebar__edge:focus-visible {
        background: var(--rv-border);
        outline: none;
    }
    .cc-nav-backdrop {
        display: none !important;
    }

    .cc-shell.is-collapsed,
    html.rv-preinit-collapsed .cc-shell {
        grid-template-columns: var(--rv-sidebar-rail-width, 72px) 1fr;
    }

    .cc-shell.is-collapsed .cc-sidebar,
    html.rv-preinit-collapsed .cc-sidebar {
        overflow: hidden;
    }

    .cc-shell.is-collapsed .cc-sidebar__brand,
    html.rv-preinit-collapsed .cc-sidebar__brand {
        justify-content: center;
    }

    .cc-shell.is-collapsed .cc-sidebar__brand-text,
    html.rv-preinit-collapsed .cc-sidebar__brand-text {
        display: none;
    }

    .cc-shell.is-collapsed .cc-sidebar__link,
    html.rv-preinit-collapsed .cc-sidebar__link {
        justify-content: center;
        padding: 10px 8px;
        gap: 0;
    }

    .cc-shell.is-collapsed .cc-sidebar__link > span,
    html.rv-preinit-collapsed .cc-sidebar__link > span {
        display: none;
    }

    .cc-shell.is-collapsed .cc-sidebar__link .cc-icon,
    html.rv-preinit-collapsed .cc-sidebar__link .cc-icon {
        width: 32px;
        height: 32px;
    }

    .cc-shell.is-collapsed .cc-sidebar__divider,
    html.rv-preinit-collapsed .cc-sidebar__divider {
        margin: 8px 6px;
    }
}

@media (max-width: 900px) {
    .cc-shell { grid-template-columns: 1fr; }
    .cc-shell.is-collapsed,
    html.rv-preinit-collapsed .cc-shell { grid-template-columns: 1fr; }
    .cc-sidebar-toggle__chevron,
    .cc-sidebar__edge { display: none; }
    .cc-mobile-nav { display: grid; }
    .cc-page--app { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
    .cc-sidebar-toggle { display: inline-flex; }
    .cc-sidebar,
    .cc-nav-backdrop,
    .cc-main {
        grid-row: 1;
        grid-column: 1;
    }
    .cc-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: min(280px, 85vw);
        z-index: 45;
        transform: translateX(-100%);
        transition: transform 0.2s ease;
        display: flex;
        flex-direction: column;
        min-height: auto;
        opacity: 1;
        pointer-events: auto;
        overflow: auto;
    }
    .cc-shell.is-collapsed .cc-sidebar,
    html.rv-preinit-collapsed .cc-sidebar {
        opacity: 1;
        pointer-events: auto;
        overflow: auto;
    }
    .cc-shell.is-mobile-nav-open .cc-sidebar {
        transform: translateX(0);
    }
    .cc-nav-backdrop {
        position: fixed;
        inset: 0;
        z-index: 40;
        background: color-mix(in srgb, var(--rv-bg) 55%, transparent);
        backdrop-filter: blur(4px);
        border: 0;
        padding: 0;
        margin: 0;
        cursor: pointer;
    }
    .cc-nav-backdrop[hidden] {
        display: none;
    }
}

/* Split login layout: wordmark + intro on left (centered), form on right, stacks on mobile */
.cc-page--split {
    min-height: 100vh;
    min-height: 100dvh;
    display: grid;
}
.cc-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 100vh;
    min-height: 100dvh;
}
.cc-split__art {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: var(--rv-space-4);
    background: radial-gradient(900px 500px at 30% 20%, color-mix(in srgb, var(--rv-accent) 22%, var(--rv-surface-1)) 0%, var(--rv-surface-1) 60%);
    border-right: 1px solid var(--rv-border);
}
.cc-split__wordmark {
    width: min(420px, 80%);
    height: auto;
    margin: 0 auto var(--rv-space-3);
    filter: drop-shadow(0 12px 32px rgba(0, 0, 0, 0.45));
}
.cc-split__eyebrow {
    margin: 0 0 var(--rv-space-1);
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--rv-accent);
}
.cc-split__tagline {
    margin: 0 0 var(--rv-space-1);
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.35;
    max-width: 420px;
    color: var(--rv-text);
}
.cc-split__sub {
    margin: 0;
    font-size: 1rem;
    line-height: 1.55;
    max-width: 400px;
    color: var(--rv-text-muted);
}
.cc-split__form {
    display: grid;
    place-items: center;
    padding: var(--rv-space-4);
}
.cc-split__form-inner {
    width: min(100%, 380px);
    display: grid;
    gap: var(--rv-space-3);
}
.cc-split__shield {
    display: block;
    width: 96px;
    height: auto;
    margin: 0 auto;
    filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.35));
}
.cc-split__lead {
    text-align: center;
    margin: 0;
    color: var(--rv-text-muted);
}
@media (max-width: 860px) {
    .cc-split {
        grid-template-columns: 1fr;
    }
    .cc-split__art {
        border-right: none;
        border-bottom: 1px solid var(--rv-border);
        padding: var(--rv-space-3);
    }
    .cc-split__wordmark {
        width: min(260px, 70%);
    }
    .cc-split__form {
        padding: var(--rv-space-3);
    }
}
/* Cobalt accent for marketing surfaces */
:root {
    --rv-cobalt: #1e3fae;
    --rv-cobalt-bright: #3355ff;
}
.cc-alert--success {
    background: rgba(51, 85, 255, 0.12);
    border: 1px solid rgba(51, 85, 255, 0.35);
    color: #bfd0ff;
}
textarea.cc-input {
    font: inherit;
    resize: vertical;
    min-height: 120px;
}

html { scroll-behavior: smooth; }

html { scroll-behavior: smooth; }

/* Marketing landing page */
.cc-page--marketing {
    min-height: 100vh;
    min-height: 100dvh;
}
.cc-nav {
    position: sticky;
    top: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--rv-space-2) var(--rv-space-4);
    background: color-mix(in srgb, var(--rv-bg) 85%, transparent);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--rv-border);
}
.cc-nav__brand { display: flex; align-items: center; }
.cc-nav__wordmark { height: 52px; width: auto; }
.cc-nav__links { display: flex; align-items: center; gap: var(--rv-space-3); }
.cc-nav__toggle {
    display: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: var(--rv-text);
    cursor: pointer;
}
.cc-nav__toggle:hover { background: var(--rv-surface-2); }
.cc-nav__toggle-icon { position: relative; display: inline-block; width: 22px; height: 22px; }
.cc-nav__icon {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    transition: opacity 0.4s ease, transform 0.4s ease;
}
.cc-nav__icon--shield {
    opacity: 0;
    transform: rotate(-25deg) scale(0.6);
    color: var(--rv-cobalt-bright);
}
.cc-nav__toggle[aria-expanded="true"] .cc-nav__icon--burger {
    opacity: 0;
    transform: rotate(20deg) scale(0.6);
}
.cc-nav__toggle[aria-expanded="true"] .cc-nav__icon--shield {
    opacity: 1;
    transform: rotate(0deg) scale(1);
}
.cc-nav-panel {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: grid;
    gap: 4px;
    padding: 0 var(--rv-space-2);
    background: color-mix(in srgb, var(--rv-bg) 96%, transparent);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid transparent;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.35s ease, opacity 0.3s ease, padding 0.35s ease;
}
.cc-nav-panel.is-open {
    max-height: 260px;
    opacity: 1;
    padding: var(--rv-space-2);
    border-bottom-color: var(--rv-border);
}
.cc-nav-panel__link {
    padding: 12px 14px;
    border-radius: 8px;
    color: var(--rv-text);
    font-weight: 500;
}
.cc-nav-panel__link:hover { background: var(--rv-surface-2); color: var(--rv-text); }
.cc-nav__link { color: var(--rv-text-muted); font-size: 0.9rem; font-weight: 500; }
.cc-nav__link:hover { color: var(--rv-text); }
.cc-hero {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 92vh;
    padding: var(--rv-space-4);
    overflow: hidden;
}
.cc-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(900px 620px at 18% 12%, color-mix(in srgb, var(--rv-cobalt-bright) 48%, transparent) 0%, transparent 62%),
        radial-gradient(900px 620px at 82% 28%, color-mix(in srgb, var(--rv-cobalt) 42%, transparent) 0%, transparent 62%),
        radial-gradient(1200px 700px at 50% 100%, color-mix(in srgb, var(--rv-cobalt-bright) 18%, transparent) 0%, transparent 70%);
    pointer-events: none;
}
.cc-hero__inner {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: var(--rv-space-4);
    max-width: 1120px;
    width: 100%;
}
.cc-hero__art {
    display: flex;
    justify-content: center;
    align-items: center;
}
.cc-hero__crossfade {
    position: relative;
    display: inline-block;
    width: min(440px, 100%);
}
.cc-hero__cabinet {
    display: block;
    width: 100%;
    height: auto;
    filter: drop-shadow(0 24px 64px color-mix(in srgb, var(--rv-cobalt-bright) 45%, transparent));
}
.cc-hero__cabinet--a {
    animation: cc-hero-crossfade-a 15s ease-in-out infinite;
}
.cc-hero__cabinet--b {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    animation: cc-hero-crossfade-b 15s ease-in-out infinite;
}
.cc-hero__cabinet--c {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    animation: cc-hero-crossfade-c 15s ease-in-out infinite;
}
/* Three-way crossfade, 15s cycle, three evenly-tiled boundaries (28/38, 61/71, 95/100-0):
   a holds 0-28%, b holds 38-61%, c holds 71-95%, each with a ~10%-wide fade at the seams. */
@keyframes cc-hero-crossfade-a {
    0%, 28% { opacity: 1; }
    38%, 95% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes cc-hero-crossfade-b {
    0%, 28% { opacity: 0; }
    38%, 61% { opacity: 1; }
    71%, 100% { opacity: 0; }
}
@keyframes cc-hero-crossfade-c {
    0%, 61% { opacity: 0; }
    71%, 95% { opacity: 1; }
    100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .cc-hero__cabinet--a,
    .cc-hero__cabinet--b,
    .cc-hero__cabinet--c {
        animation: none;
    }
    .cc-hero__cabinet--a { opacity: 1; }
    .cc-hero__cabinet--b { opacity: 0; }
    .cc-hero__cabinet--c { opacity: 0; }
}
.cc-hero__content {
    display: grid;
    gap: var(--rv-space-3);
    text-align: left;
}

/* Wordmark shine: diagonal light sweep on hover, masked to the logo's own shape */
.cc-shine {
    position: relative;
    display: inline-block;
    isolation: isolate;
}
.cc-shine::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        100deg,
        transparent 35%,
        rgba(255, 255, 255, 0.9) 48%,
        rgba(255, 255, 255, 0.9) 52%,
        transparent 65%
    );
    background-size: 250% 100%;
    background-position: 160% 0;
    -webkit-mask-image: url('/assets/brand/rigvault-wordmark.png');
    mask-image: url('/assets/brand/rigvault-wordmark.png');
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    pointer-events: none;
    transition: background-position 2.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.cc-shine:hover::after,
.cc-nav__brand:hover .cc-shine::after {
    background-position: -60% 0;
}
@media (prefers-reduced-motion: reduce) {
    .cc-shine::after { display: none; }
}
.cc-hero__eyebrow {
    margin: 0;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--rv-cobalt-bright);
}
.cc-hero__headline {
    margin: 0;
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    line-height: 1.15;
    color: var(--rv-text);
}
.cc-hero__tagline {
    margin: 0;
    font-size: 1.25rem;
    color: var(--rv-text-muted);
    line-height: 1.55;
    max-width: 520px;
}
.cc-hero__actions { display: flex; justify-content: flex-start; gap: var(--rv-space-2); flex-wrap: wrap; margin-top: var(--rv-space-1); }
@media (max-width: 860px) {
    .cc-hero__inner { grid-template-columns: 1fr; text-align: center; }
    .cc-hero__content { text-align: center; }
    .cc-hero__tagline { margin: 0 auto; }
    .cc-hero__actions { justify-content: center; }
}
.cc-section {
    min-height: 78vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: var(--rv-space-4) var(--rv-space-3);
    max-width: 1080px;
    margin: 0 auto;
    scroll-margin-top: 88px;
}
.cc-section__eyebrow {
    margin: 0 0 var(--rv-space-1);
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--rv-cobalt-bright);
    text-align: center;
}
.cc-section__title { margin: 0 0 var(--rv-space-2); font-size: clamp(1.6rem, 3vw, 2.25rem); text-align: center; }
.cc-section__lead {
    margin: 0 auto var(--rv-space-3);
    max-width: 640px;
    text-align: center;
    color: var(--rv-text-muted);
    font-size: 1.05rem;
    line-height: 1.6;
}
.cc-mais {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--rv-space-3);
    margin: var(--rv-space-3) 0 0;
}
.cc-mais__item {
    padding: var(--rv-space-3) var(--rv-space-2);
    text-align: center;
}
.cc-mais__item,
.cc-feature {
    background: var(--rv-surface-1);
    border-radius: var(--rv-radius);
    box-shadow:
        0 0 0 1px var(--rv-border),
        0 0 24px -12px color-mix(in srgb, var(--rv-cobalt-bright) 40%, transparent);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.cc-mais__item:hover,
.cc-feature:hover {
    box-shadow:
        0 0 0 1px var(--rv-cobalt-bright),
        0 0 52px -8px color-mix(in srgb, var(--rv-cobalt-bright) 70%, transparent);
    transform: translateY(-3px);
}
.cc-mais__label { display: block; font-weight: 600; margin-bottom: 6px; }
.cc-mais__desc { margin: 0; font-size: 0.85rem; color: var(--rv-text-muted); line-height: 1.5; }
@media (max-width: 900px) {
    .cc-mais { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
    .cc-mais { grid-template-columns: 1fr; }
}
.cc-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--rv-space-3); }
.cc-feature { padding: var(--rv-space-3); }
.cc-feature__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: var(--rv-cobalt-bright);
    color: #fff;
    margin-bottom: var(--rv-space-2);
    box-shadow: 0 0 24px -4px color-mix(in srgb, var(--rv-cobalt-bright) 80%, transparent);
}
.cc-feature__icon svg { width: 22px; height: 22px; }
.cc-feature__title { margin: 0 0 6px; font-size: 1.1rem; }
.cc-feature__copy { margin: 0; color: var(--rv-text-muted); font-size: 0.95rem; line-height: 1.55; }
.cc-feature__more { display: inline-block; margin-top: var(--rv-space-2); font-size: 0.9rem; font-weight: 600; color: var(--rv-accent); text-decoration: none; }
.cc-feature__more:hover { color: var(--rv-accent-hover); text-decoration: underline; }
/* FAQ */
.cc-faq {
    display: grid;
    gap: var(--rv-space-2);
    max-width: 760px;
    margin: var(--rv-space-3) auto 0;
    text-align: left;
}
.cc-faq__item {
    background: var(--rv-surface-1);
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    padding: 0 var(--rv-space-3);
    transition: border-color 0.2s ease;
}
.cc-faq__item[open] {
    border-color: var(--rv-cobalt-bright);
}
.cc-faq__question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rv-space-2);
    padding: var(--rv-space-2) 0;
    cursor: pointer;
    list-style: none;
}
.cc-faq__question::-webkit-details-marker {
    display: none;
}
.cc-faq__question:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-cobalt-bright) 35%, transparent);
    border-radius: 6px;
}
.cc-faq__question h3 {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    color: var(--rv-text);
}
.cc-support-accordion.cc-faq {
    max-width: none;
    margin: var(--rv-space-2) 0 0;
}
.cc-faq__icon {
    flex-shrink: 0;
    position: relative;
    width: 20px;
    height: 20px;
}
.cc-faq__icon::before,
.cc-faq__icon::after {
    content: "";
    position: absolute;
    background: var(--rv-cobalt-bright);
    border-radius: 2px;
    transition: transform 0.25s ease, opacity 0.25s ease;
}
.cc-faq__icon::before {
    top: 50%;
    left: 0;
    width: 100%;
    height: 2px;
    transform: translateY(-50%);
}
.cc-faq__icon::after {
    top: 0;
    left: 50%;
    width: 2px;
    height: 100%;
    transform: translateX(-50%);
}
.cc-faq__item[open] .cc-faq__icon::after {
    transform: translateX(-50%) rotate(90deg);
    opacity: 0;
}
.cc-faq__answer {
    padding: 0 0 var(--rv-space-3);
    color: var(--rv-text-muted);
    line-height: 1.6;
}
.cc-faq__answer p {
    margin: 0;
}
@media (max-width: 600px) {
    .cc-faq__item {
        padding: 0 var(--rv-space-2);
    }
}

.cc-contact {
    display: grid;
    gap: var(--rv-space-2);
    max-width: 620px;
    margin: 0 auto;
    padding: var(--rv-space-4);
    background: var(--rv-surface-1);
    border-radius: var(--rv-radius);
    box-shadow:
        0 0 0 1px var(--rv-border),
        0 0 32px -12px color-mix(in srgb, var(--rv-cobalt-bright) 35%, transparent);
    text-align: left;
}
.cc-contact__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--rv-space-2);
}
@media (max-width: 600px) {
    .cc-contact__row { grid-template-columns: 1fr; }

    .cc-contact {
        max-width: none;
        width: calc(100% - 32px);
        margin: 0 auto;
        padding: var(--rv-space-4) var(--rv-space-3);
    }

    .cc-field { gap: 10px; }

    .cc-input {
        font-size: 16px;
        height: 48px;
        padding: 12px 14px;
    }

    textarea.cc-input {
        font-size: 16px;
        min-height: 132px;
    }

    .cc-btn--block {
        height: 52px;
    }
}
.cc-input:focus-visible {
    outline: none;
    border-color: var(--rv-cobalt-bright);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-cobalt-bright) 25%, transparent);
}
.cc-input:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    background: var(--rv-surface-1);
}
.cc-beta-reason-input {
    padding: 6px 8px;
    font-size: 16px;
    min-width: 160px;
    transition: border-color 0.3s ease, opacity 0.15s ease;
}
.cc-beta-reason-input.is-saving {
    opacity: 0.65;
}
.cc-beta-reason-input.is-saved {
    border-color: var(--rv-success);
}
.cc-beta-reason-input.is-error {
    border-color: var(--rv-danger);
}
.cc-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 18px;
    border-radius: 999px;
    border: 1px solid var(--rv-cobalt-bright);
    background: color-mix(in srgb, var(--rv-cobalt-bright) 15%, transparent);
    color: var(--rv-text);
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    box-shadow: 0 0 24px -8px color-mix(in srgb, var(--rv-cobalt-bright) 70%, transparent);
}
.cc-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--rv-space-2);
    padding: var(--rv-space-3) var(--rv-space-4);
    border-top: 1px solid var(--rv-border);
    color: var(--rv-text-muted);
    font-size: 0.85rem;
}
.cc-footer__brand { display: flex; align-items: center; gap: 8px; }
.cc-footer__shield { height: 22px; width: auto; }
.cc-footer__version {
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--rv-text);
}
.cc-footer__legal {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
}
.cc-footer__links {
    display: flex;
    align-items: center;
    gap: 6px;
}
.cc-footer__links a { color: var(--rv-text-muted); }
.cc-footer__links a:hover { color: var(--rv-text); }
.cc-footer__dot { opacity: 0.6; }
@media (max-width: 700px) {
    .cc-nav__links { display: none; }
    .cc-nav__toggle { display: inline-flex; }
    .cc-features { grid-template-columns: 1fr; }
    .cc-hero__tagline { font-size: 1.1rem; }
    .cc-section { min-height: auto; padding: var(--rv-space-3) var(--rv-space-2); }
}
@media (min-width: 701px) {
    .cc-nav__toggle { display: none; }
    .cc-nav-panel { display: none; }
}

/* Back to top: floating, appears after scrolling past the hero, desktop/tablet only */
.cc-back-to-top {
    position: fixed;
    right: var(--rv-space-3);
    bottom: var(--rv-space-3);
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid var(--rv-border);
    background: var(--rv-surface-1);
    color: var(--rv-text);
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    pointer-events: none;
    box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.5);
    transition: opacity 0.25s ease, transform 0.25s ease, border-color 0.2s ease, background 0.2s ease, visibility 0s linear 0.25s;
}
.cc-back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
    transition: opacity 0.25s ease, transform 0.25s ease, border-color 0.2s ease, background 0.2s ease;
}
.cc-back-to-top:hover {
    border-color: var(--rv-cobalt-bright);
    background: var(--rv-surface-2);
}
.cc-back-to-top:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-cobalt-bright) 35%, transparent);
}
.cc-back-to-top svg {
    width: 20px;
    height: 20px;
}
@media (max-width: 700px) {
    .cc-back-to-top {
        display: none;
    }
}
@media (prefers-reduced-motion: reduce) {
    .cc-back-to-top {
        transition: opacity 0.15s ease, visibility 0s linear 0.15s;
        transform: none;
    }
    .cc-back-to-top.is-visible {
        transition: opacity 0.15s ease;
    }
}

/* Cookie consent banner: fixed bottom bar, gates ForVera Analytics opt-in */
.cc-consent-banner {
    position: fixed;
    left: var(--rv-space-3);
    right: var(--rv-space-3);
    bottom: var(--rv-space-3);
    z-index: 40;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--rv-space-2);
    max-width: 720px;
    margin: 0 auto;
    padding: var(--rv-space-2) var(--rv-space-3);
    border-radius: var(--rv-radius);
    border: 1px solid var(--rv-border);
    background: var(--rv-surface-1);
    box-shadow: 0 12px 32px -12px rgba(0, 0, 0, 0.5);
    color: var(--rv-text);
}
.cc-consent-banner[hidden] { display: none; }
.cc-consent-banner__text {
    flex: 1 1 320px;
    margin: 0;
    font-size: 0.85rem;
    color: var(--rv-text-muted);
}
.cc-consent-banner__text a { color: var(--rv-text); }
.cc-consent-banner__actions {
    display: flex;
    align-items: center;
    gap: var(--rv-space-1);
    flex-shrink: 0;
}
.cc-btn--sm { padding: 6px 14px; font-size: 0.85rem; }
@media (max-width: 700px) {
    .cc-consent-banner {
        left: var(--rv-space-2);
        right: var(--rv-space-2);
        bottom: var(--rv-space-2);
        flex-direction: column;
        align-items: stretch;
    }
    .cc-consent-banner__actions { justify-content: flex-end; }
}

/* Legal pages (Privacy Policy, Terms of Use): long-form prose, wider than .cc-auth */
.cc-legal-header {
    display: flex;
    justify-content: center;
    padding: var(--rv-space-3) var(--rv-space-2) 0;
}
.cc-legal-header__link { display: inline-flex; }
.cc-legal-header img { height: 28px; width: auto; }

.cc-legal {
    width: min(100%, 760px);
    margin: 0 auto;
    padding: var(--rv-space-4) var(--rv-space-3) var(--rv-space-4);
    line-height: 1.65;
}
.cc-legal h1 {
    font-size: 2rem;
    margin: 0 0 var(--rv-space-1);
}
.cc-legal__updated {
    color: var(--rv-text-muted);
    font-size: 0.85rem;
    margin: 0 0 var(--rv-space-4);
}
.cc-legal h2 {
    font-size: 1.25rem;
    margin: var(--rv-space-4) 0 var(--rv-space-2);
    padding-top: var(--rv-space-3);
    border-top: 1px solid var(--rv-border);
    scroll-margin-top: var(--rv-space-3);
}
.cc-legal h2:first-of-type { border-top: none; padding-top: 0; }
.cc-legal h3 {
    font-size: 1rem;
    margin: var(--rv-space-3) 0 var(--rv-space-1);
    color: var(--rv-text);
}
.cc-legal p, .cc-legal li { color: var(--rv-text-muted); }
.cc-legal strong { color: var(--rv-text); }
.cc-legal ul, .cc-legal ol { margin: 0 0 var(--rv-space-2); padding-left: 1.25em; }
.cc-legal ul li, .cc-legal ol li { margin-bottom: 6px; }
.cc-legal a { color: var(--rv-accent); }
.cc-legal a:hover { color: var(--rv-accent-hover); }
.cc-legal__toc {
    background: var(--rv-surface-1);
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    padding: var(--rv-space-2) var(--rv-space-3);
    margin-bottom: var(--rv-space-4);
}
.cc-legal__toc p { margin: 0 0 var(--rv-space-1); font-weight: 600; color: var(--rv-text); }
.cc-legal__toc ol { columns: 2; column-gap: var(--rv-space-3); margin: 0; }
@media (max-width: 700px) {
    .cc-legal__toc ol { columns: 1; }
}
.cc-legal__back { display: inline-block; margin-top: var(--rv-space-3); }

/* Hero waitlist form: "notify me when we launch" */
.cc-waitlist { margin-top: var(--rv-space-1); max-width: 420px; }
.cc-waitlist__field { display: grid; gap: 6px; }
.cc-waitlist__row { display: flex; gap: 8px; }
.cc-waitlist__row .cc-input { flex: 1 1 auto; min-width: 0; }
.cc-waitlist__row .cc-btn { flex: 0 0 auto; }
@media (max-width: 480px) {
    .cc-waitlist__row { flex-direction: column; }
}

/* Phase B: Assets screens */
.cc-sidebar__brand-text { display: grid; gap: 2px; }
.cc-sidebar__name { font-weight: 700; }
.cc-sidebar__tagline { font-size: 0.72rem; color: var(--rv-text-muted); }
.cc-soon {
    margin-left: auto;
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rv-text-muted);
    border: 1px solid var(--rv-border);
    border-radius: 999px;
    padding: 2px 8px;
}
.cc-sidebar__user {
    margin-top: auto;
    display: flex;
    gap: 10px;
    align-items: center;
    padding: var(--rv-space-2);
    border-top: 1px solid var(--rv-border);
}
.cc-sidebar { display: flex; flex-direction: column; min-height: 100%; }
.cc-avatar {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: var(--rv-surface-2);
    color: var(--rv-accent);
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    overflow: hidden;
    object-fit: cover;
    flex-shrink: 0;
}
.cc-avatar--initials {
    background-color: #64748b;
    color: #fff;
}
.cc-avatar--square {
    border-radius: var(--rv-radius);
}
.cc-avatar--lg {
    width: 96px;
    height: 96px;
    font-size: 1.5rem;
}
img.cc-avatar {
    display: block;
    padding: 0;
}
.cc-avatar-compare {
    display: flex;
    flex-wrap: wrap;
    gap: var(--rv-space-3);
    align-items: flex-start;
    margin-bottom: var(--rv-space-2);
}
.cc-avatar-compare__option {
    display: grid;
    gap: 10px;
    justify-items: center;
    color: inherit;
    font: inherit;
}
.cc-avatar-compare__frame,
.cc-avatar-photo {
    position: relative;
    box-sizing: border-box;
    width: 104px;
    height: 104px;
    border-radius: 999px;
    padding: 4px;
    border: 2px solid transparent;
    background: var(--rv-surface-2);
    transition: border-color 0.15s ease;
}
.cc-avatar-compare__frame .cc-avatar,
.cc-avatar-photo__media .cc-avatar {
    width: 100%;
    height: 100%;
}
.cc-avatar-compare__option.is-inactive .cc-avatar-compare__frame,
.cc-avatar-compare__option.is-inactive .cc-avatar-photo__media {
    opacity: 0.45;
    filter: grayscale(0.85);
}
.cc-avatar-compare__option.is-active .cc-avatar-compare__frame,
.cc-avatar-compare__option.is-active .cc-avatar-photo {
    border-color: var(--rv-accent);
}
.cc-avatar-compare__option.is-active .cc-avatar-photo__media {
    opacity: 1;
    filter: none;
}
.cc-avatar-compare__label {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--rv-text-muted);
}
.cc-avatar-compare__option.is-active .cc-avatar-compare__label {
    color: var(--rv-text);
}
.cc-avatar-photo {
    display: block;
    overflow: hidden;
    margin: 0;
    cursor: pointer;
}
.cc-avatar-photo__media {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 999px;
    overflow: hidden;
    line-height: 0;
    pointer-events: none;
    transition: opacity 0.15s ease, filter 0.15s ease;
}
.cc-avatar-photo__overlay {
    position: absolute;
    inset: 4px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--rv-bg) 55%, transparent);
    opacity: 0;
    transition: opacity 0.15s ease;
    pointer-events: none;
}
.cc-avatar-photo.is-empty .cc-avatar-photo__overlay,
.cc-avatar-photo:hover .cc-avatar-photo__overlay,
.cc-avatar-photo:focus-within .cc-avatar-photo__overlay {
    opacity: 1;
}
.cc-avatar-photo.has-photo .cc-avatar-photo__overlay {
    pointer-events: auto;
}
.cc-avatar-photo__action {
    margin: 0;
    display: inline-flex;
    pointer-events: auto;
}
.cc-avatar-photo__btn {
    appearance: none;
    -webkit-appearance: none;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    margin: 0;
    border: 1px solid color-mix(in srgb, var(--rv-text) 35%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--rv-surface-1) 80%, transparent);
    color: var(--rv-text);
    cursor: pointer;
    overflow: hidden;
}
.cc-avatar-photo__btn:hover {
    background: var(--rv-surface-1);
    border-color: var(--rv-accent);
    color: var(--rv-accent);
}
.cc-avatar-photo__btn--danger:hover {
    border-color: var(--rv-danger);
    color: var(--rv-danger);
}
.cc-avatar-photo__file {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
    font-size: 16px;
    border: 0;
    margin: 0;
    padding: 0;
    z-index: 3;
}
.cc-avatar-photo__file--full {
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 4;
}
.cc-avatar-photo.has-photo .cc-avatar-photo__btn .cc-avatar-photo__file {
    z-index: 5;
}
.cc-avatar-mode-form {
    margin: 0 0 var(--rv-space-2);
}
.cc-avatar--empty {
    color: var(--rv-text-muted);
}
.cc-profile-readonly {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 0 0 var(--rv-space-2);
}
.cc-profile-soon-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: var(--rv-space-1);
}
.cc-segmented {
    display: inline-flex;
    gap: 4px;
    padding: 4px;
    margin: 0;
    border: 1px solid var(--rv-border);
    border-radius: 999px;
    background: var(--rv-surface-2);
}
.cc-segmented__btn {
    appearance: none;
    -webkit-appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 88px;
    padding: 8px 14px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--rv-text-muted);
    font: inherit;
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
}
.cc-segmented__btn.is-active {
    background: var(--rv-surface-1);
    color: var(--rv-text);
    box-shadow: 0 0 0 1px var(--rv-border);
}
.cc-segmented__btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
.cc-segmented__option {
    position: relative;
    cursor: pointer;
}
.cc-segmented__option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.cc-segmented__option span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 88px;
    padding: 8px 14px;
    border-radius: 999px;
    color: var(--rv-text-muted);
    font-weight: 600;
    font-size: 0.9rem;
}
.cc-segmented__option input:checked + span {
    background: var(--rv-surface-1);
    color: var(--rv-text);
    box-shadow: 0 0 0 1px var(--rv-border);
}
.cc-suggestion-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}
.cc-chip-btn {
    appearance: none;
    -webkit-appearance: none;
    font: inherit;
    line-height: 1;
    border: 1px solid var(--rv-border);
    background: var(--rv-surface-2);
    color: var(--rv-text);
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
}
.cc-chip-btn:hover {
    border-color: var(--rv-accent);
    color: var(--rv-accent);
    background: color-mix(in srgb, var(--rv-accent) 10%, var(--rv-surface-2));
}
.cc-chip-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-accent) 35%, transparent);
}
.cc-chip-btn:active {
    background: color-mix(in srgb, var(--rv-accent) 16%, var(--rv-surface-2));
}
.cc-content--settings {
    padding-bottom: 96px;
}
.cc-settings-savebar {
    position: sticky;
    bottom: 12px;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-top: var(--rv-space-3);
    padding: 12px 16px;
    border: 1px solid var(--rv-border);
    border-radius: 12px;
    background: color-mix(in srgb, var(--rv-surface-1) 92%, transparent);
    backdrop-filter: blur(8px);
}
.cc-settings-savebar__status {
    margin-right: auto;
    color: var(--rv-warn);
    font-size: 0.85rem;
    font-weight: 600;
}
.cc-flyout__divider {
    border: 0;
    border-top: 1px solid var(--rv-border);
    margin: 6px 0;
}
.cc-sidebar__user-name { font-size: 0.9rem; }
.cc-sidebar__user-meta { font-size: 0.75rem; color: var(--rv-text-muted); }
.cc-icon-btn {
    background: transparent;
    border: 0;
    color: var(--rv-text-muted);
    padding: 8px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.cc-icon-btn:hover:not(:disabled) {
    background: var(--rv-surface-2);
    color: var(--rv-text);
}
.cc-icon-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
.cc-user-menu {
    position: relative;
}
.cc-user-trigger {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 8px 4px 4px;
    border: 1px solid var(--rv-border);
    border-radius: 999px;
    background: var(--rv-surface-2);
    color: var(--rv-text);
    cursor: pointer;
}
.cc-user-trigger:hover {
    border-color: color-mix(in srgb, var(--rv-accent) 45%, var(--rv-border));
}
.cc-user-trigger__chevron {
    color: var(--rv-text-muted);
}
.cc-avatar--sm {
    width: 28px;
    height: 28px;
    font-size: 0.72rem;
    border-radius: 999px;
}
.cc-flyout {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 220px;
    padding: 8px;
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    background: var(--rv-surface-1);
    box-shadow: 0 16px 40px color-mix(in srgb, var(--rv-bg) 55%, transparent);
    z-index: 40;
}
.cc-flyout[hidden] {
    display: none;
}
.cc-flyout__header {
    display: grid;
    gap: 2px;
    padding: 8px 10px 10px;
    border-bottom: 1px solid var(--rv-border);
    margin-bottom: 6px;
}
.cc-flyout__header strong {
    font-size: 0.9rem;
}
.cc-flyout__header span {
    font-size: 0.78rem;
    color: var(--rv-text-muted);
}
.cc-flyout__form {
    margin: 0;
}
.cc-flyout__action {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 10px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--rv-text);
    cursor: pointer;
    text-align: left;
    text-decoration: none;
    box-sizing: border-box;
}
.cc-flyout__action:hover {
    background: var(--rv-surface-2);
}

.is-tour-active {
    position: relative;
    z-index: 51;
    box-shadow:
        0 0 0 2px var(--rv-accent),
        0 0 0 4px color-mix(in srgb, var(--rv-accent) 35%, transparent);
    border-radius: 8px;
}

.cc-tour {
    position: fixed;
    inset: 0;
    z-index: 50;
    pointer-events: none;
    background: color-mix(in srgb, var(--rv-bg) 60%, transparent);
}

.cc-tour[hidden] {
    display: none;
}

.cc-tour__callout {
    position: fixed;
    width: min(280px, calc(100vw - 16px));
    padding: 16px 16px 14px;
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    background: var(--rv-surface-1);
    box-shadow: 0 16px 40px color-mix(in srgb, var(--rv-bg) 55%, transparent);
    pointer-events: auto;
    --cc-tour-arrow-offset: 24px;
}

.cc-tour__callout::before {
    content: '';
    position: absolute;
    width: 12px;
    height: 12px;
    background: var(--rv-surface-1);
    border: 1px solid var(--rv-border);
    transform: rotate(45deg);
}

.cc-tour__callout--arrow-left::before {
    left: -7px;
    top: var(--cc-tour-arrow-offset);
    border-right: 0;
    border-top: 0;
}

.cc-tour__callout--arrow-top::before {
    top: -7px;
    left: var(--cc-tour-arrow-offset);
    border-right: 0;
    border-bottom: 0;
}

.cc-tour__close {
    position: absolute;
    top: 8px;
    right: 8px;
    color: var(--rv-text-muted);
}

.cc-tour__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 28px 10px 0;
}

.cc-tour__title-icon {
    display: inline-flex;
    color: var(--rv-accent);
    flex-shrink: 0;
}

.cc-tour__title-text {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--rv-accent);
}

.cc-tour__text {
    margin: 0 28px 14px 0;
    color: var(--rv-text);
    font-size: 0.9rem;
    line-height: 1.5;
}

.cc-tour__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.cc-tour__step {
    font-size: 0.78rem;
    color: var(--rv-text-muted);
    white-space: nowrap;
}

.cc-tour__actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.cc-tour__skip {
    padding: 8px 12px;
    font-size: 0.85rem;
}

.cc-tour__next {
    padding: 8px 14px;
    font-size: 0.85rem;
}

.cc-assets-header {
    display: flex;
    justify-content: space-between;
    gap: var(--rv-space-2);
    align-items: flex-start;
    margin-bottom: var(--rv-space-3);
}
.cc-assets-header__actions { display: flex; gap: 8px; align-items: center; }
.cc-empty {
    border: 1px dashed var(--rv-border);
    border-radius: var(--rv-radius);
    padding: var(--rv-space-4);
    text-align: center;
    background: color-mix(in srgb, var(--rv-surface-1) 80%, transparent);
}
.cc-empty__icon { color: var(--rv-accent); margin-bottom: var(--rv-space-2); }
.cc-filters {
    display: grid;
    grid-template-columns: 2fr repeat(4, minmax(120px, 1fr)) auto;
    gap: 8px;
    margin-bottom: var(--rv-space-3);
}
.cc-search { position: relative; display: block; }
.cc-search__icon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--rv-text-muted);
    z-index: 1;
    pointer-events: none;
}
.cc-search-wrap { position: relative; display: block; width: 100%; }
.cc-search-wrap .cc-input {
    width: 100%;
    padding-left: 34px;
    padding-right: 36px;
}
.cc-search .cc-input { padding-left: 34px; }
.cc-search input[type="search"]::-webkit-search-cancel-button,
.cc-search input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
}
.cc-search-clear {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    border: none;
    background: transparent;
    color: var(--rv-text-muted);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.cc-search-clear:hover { color: var(--rv-danger); }
.cc-search-clear:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-danger) 35%, transparent);
    outline: none;
}
.cc-search-clear[hidden] { display: none; }
.cc-sort-link {
    color: inherit;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.cc-sort-link:hover { color: var(--rv-accent); }
.cc-sort-indicator { font-size: 0.7em; }
.cc-sort-chip {
    margin: 0 0 var(--rv-space-2);
    color: var(--rv-text-muted);
    font-size: 0.875rem;
}
.cc-assets-grid-panel[hidden] { display: none; }
.cc-view-toggle {
    display: inline-flex;
    border: 1px solid var(--rv-border);
    border-radius: 8px;
    overflow: hidden;
}
.cc-view-toggle__btn {
    background: transparent;
    border: 0;
    color: var(--rv-text-muted);
    padding: 8px 10px;
}
.cc-view-toggle__btn.is-active {
    background: var(--rv-surface-2);
    color: var(--rv-accent);
}
.cc-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    background: var(--rv-surface-1);
}
.cc-table {
    width: 100%;
    border-collapse: collapse;
}
.cc-table th, .cc-table td {
    padding: 12px 14px;
    text-align: left;
    border-bottom: 1px solid var(--rv-border);
    vertical-align: middle;
}
.cc-table th {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--rv-text-muted);
}
.cc-table tbody tr:nth-child(even) {
    background: color-mix(in srgb, var(--rv-surface-2) 55%, transparent);
}
.cc-table tbody tr:hover {
    background: var(--rv-surface-2);
}
.cc-table th:last-child,
.cc-table td:last-child {
    width: 1%;
    white-space: nowrap;
    text-align: right;
}
.cc-asset-cell {
    display: flex;
    gap: 12px;
    align-items: center;
    color: inherit;
}
.cc-thumb {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: var(--rv-surface-2);
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--rv-text-muted);
}
.cc-thumb img { width: 100%; height: 100%; object-fit: cover; }
.cc-meta-line { display: block; color: var(--rv-text-muted); font-size: 0.85rem; }
.cc-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    background: var(--rv-surface-2);
    border: 1px solid var(--rv-border);
    font-size: 0.8rem;
    color: inherit;
    text-decoration: none;
}
a.cc-pill:hover { color: inherit; }
.cc-pill--cat {
    border-color: color-mix(in srgb, var(--cat-color, var(--rv-cat-default)) 45%, var(--rv-border));
    color: color-mix(in srgb, var(--cat-color, var(--rv-cat-default)) 70%, var(--rv-text));
    background: color-mix(in srgb, var(--cat-color, var(--rv-cat-default)) 16%, var(--rv-surface-2));
}
.cc-pill--cat[aria-current="page"] {
    border-color: color-mix(in srgb, var(--cat-color, var(--rv-cat-default)) 75%, var(--rv-border));
    background: color-mix(in srgb, var(--cat-color, var(--rv-cat-default)) 28%, var(--rv-surface-2));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cat-color, var(--rv-cat-default)) 35%, transparent);
}

/* Needs Attention view (2026-09-05) - per-asset chips naming which Identity & Media fields
   a row is missing. Warn-colored (not danger) since this is a completeness prompt, not an
   error state. */
.cc-missing-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cc-missing-chip {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    border-radius: 999px;
    font-size: 0.75rem;
    border: 1px solid color-mix(in srgb, var(--rv-warn) 45%, var(--rv-border));
    color: color-mix(in srgb, var(--rv-warn) 70%, var(--rv-text));
    background: color-mix(in srgb, var(--rv-warn) 14%, var(--rv-surface-2));
}
a.cc-pill:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-accent) 35%, transparent);
}
.cc-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: inherit;
    text-decoration: none;
}
a.cc-status:hover { color: inherit; }
a.cc-status[aria-current="page"] {
    text-decoration: underline;
    text-underline-offset: 3px;
}
a.cc-status:focus-visible {
    outline: none;
    border-radius: 6px;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-accent) 35%, transparent);
}
.cc-status__dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--rv-text-muted);
}
.cc-status--in_use .cc-status__dot { background: var(--rv-success); }
.cc-status--in_case .cc-status__dot { background: var(--rv-accent); }
.cc-status--in_repair .cc-status__dot { background: var(--rv-warn); }
.cc-status--archived .cc-status__dot { background: var(--rv-text-muted); }
.cc-status--expired .cc-status__dot { background: var(--rv-danger); }
.cc-status--expiring .cc-status__dot { background: var(--rv-warn); }
.cc-status--active .cc-status__dot { background: var(--rv-success); }
.cc-status--paused .cc-status__dot { background: var(--rv-warn); }
.cc-row-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    justify-content: flex-end;
}
.cc-help-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 6px;
    color: var(--rv-text-muted);
    vertical-align: middle;
    opacity: 0.7;
    transition: opacity 0.15s ease, color 0.15s ease;
}
.cc-help-icon:hover,
.cc-help-icon:focus-visible {
    color: var(--rv-accent);
    opacity: 1;
}
.cc-help-icon svg {
    display: block;
}
.cc-row-actions a,
.cc-row-actions__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    color: var(--rv-text-muted);
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
    flex-shrink: 0;
}
.cc-row-actions a svg,
.cc-row-actions__btn svg {
    display: block;
    flex-shrink: 0;
}
.cc-row-actions a:hover,
.cc-row-actions__btn:hover {
    color: var(--rv-accent);
    background: var(--rv-surface-2);
}
.cc-row-actions a[aria-label="Delete"]:hover,
.cc-row-actions__btn[aria-label="Delete"]:hover,
.cc-row-actions form[data-confirm] .cc-row-actions__btn:hover {
    color: var(--rv-danger);
    background: color-mix(in srgb, var(--rv-danger) 14%, transparent);
}
.cc-row-actions a:focus-visible,
.cc-row-actions__btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-accent) 35%, transparent);
}
.cc-row-actions form { margin: 0; display: inline-flex; align-items: center; }
.cc-filter-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--rv-space-2);
    margin: calc(var(--rv-space-2) * -1) 0 var(--rv-space-3);
}
.cc-filter-clears {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.cc-filter-clear {
    font-size: 0.8rem;
    color: var(--rv-text-muted);
    text-decoration: none;
    border: 1px solid var(--rv-border);
    border-radius: 999px;
    padding: 4px 10px;
}
.cc-filter-clear:hover { color: var(--rv-accent); border-color: var(--rv-accent); }
.cc-filter-clear:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-accent) 35%, transparent);
}

/* Halo on any filter control (search box or select) currently holding a non-default value -
   discussed with Christian 2026-09-05: reuse the same accent treatment already used for
   .cc-chip--active elsewhere rather than invent a new visual language. Transition matches
   .cc-chip's so this reads as the same design system, not a one-off. */
.cc-filter-active {
    background: color-mix(in srgb, var(--rv-accent) 16%, var(--rv-surface-2));
    border-color: color-mix(in srgb, var(--rv-accent) 45%, var(--rv-border));
    box-shadow: 0 0 12px -4px color-mix(in srgb, var(--rv-accent) 45%, transparent);
    transition: box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}
/* Count badge on the collapsed "Filters" toggle - covers the case where the panel is closed
   (to see more table rows) but filters are still silently applied underneath; the per-field
   halo above only helps once the panel is open. */
.cc-filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--rv-accent);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
}
.cc-cat-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--rv-text-muted);
    font-size: 0.75rem;
}
.cc-cat-legend li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.cc-cat-legend__swatch {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: var(--cat-color, var(--rv-cat-default));
}
.cc-pagination {
    display: flex;
    justify-content: space-between;
    gap: var(--rv-space-2);
    align-items: center;
    margin-top: var(--rv-space-3);
    color: var(--rv-text-muted);
    font-size: 0.9rem;
}
.cc-pagination__links { display: flex; gap: 6px; }
.cc-pagination__links a {
    padding: 6px 10px;
    border-radius: 8px;
    color: var(--rv-text-muted);
    border: 1px solid transparent;
}
.cc-pagination__links a.is-active {
    background: var(--rv-accent);
    color: #fff;
}
.cc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: var(--rv-space-2);
}
.cc-card-asset {
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    background: var(--rv-surface-1);
    padding: var(--rv-space-2);
    color: inherit;
    display: grid;
    gap: 8px;
}
.cc-card-asset__main {
    display: grid;
    gap: 8px;
    color: inherit;
    text-decoration: none;
}
.cc-card-asset__main:hover { color: inherit; }
.cc-card-asset__main:focus-visible {
    outline: none;
    border-radius: 8px;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-accent) 35%, transparent);
}
.cc-card-asset__media {
    aspect-ratio: 4/3;
    border-radius: 8px;
    background: var(--rv-surface-2);
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--rv-text-muted);
}
.cc-card-asset__media img { width: 100%; height: 100%; object-fit: cover; }
.cc-card-asset .cc-pill,
.cc-card-asset .cc-status {
    justify-self: start;
}
#documents {
    scroll-margin-top: 88px;
}
.cc-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--rv-text-muted);
    margin-bottom: var(--rv-space-2);
}
.cc-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--rv-space-2);
}
.cc-req { color: var(--rv-danger); }
.cc-help { font-size: 0.8rem; color: var(--rv-text-muted); }
.cc-form-footer {
    position: sticky;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: var(--rv-space-2) 0;
    background: linear-gradient(to top, var(--rv-bg), transparent);
}
.cc-form-footer--split {
    justify-content: space-between;
    align-items: center;
}
.cc-form-footer__right {
    display: flex;
    gap: 8px;
}
.cc-btn--danger-ghost {
    background: transparent;
    border: 1px solid var(--rv-danger);
    color: var(--rv-danger);
}
.cc-btn--danger-ghost:hover {
    background: color-mix(in srgb, var(--rv-danger) 14%, transparent);
}
.cc-content--form .cc-panel { margin-bottom: var(--rv-space-3); }
.cc-detail-header {
    display: flex;
    justify-content: space-between;
    gap: var(--rv-space-2);
    margin-bottom: var(--rv-space-3);
}
.cc-detail-header__actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cc-detail-header__actions form { display: inline-flex; margin: 0; }
.cc-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: var(--rv-space-3);
}
.cc-detail-main, .cc-detail-side { display: grid; gap: var(--rv-space-3); align-content: start; }
.cc-photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 16px;
}
.cc-photo, .cc-photo-add {
    border: 1px solid var(--rv-border);
    border-radius: 10px;
    background: var(--rv-surface-2);
    width: 160px;
    height: 160px;
    overflow: hidden;
    position: relative;
}
.cc-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    cursor: zoom-in;
}
.cc-photo-add .cc-dropzone__title {
    font-size: 0.8rem;
}
.cc-dropzone--slim {
    padding: 10px var(--rv-space-2);
}
.cc-dropzone--slim .cc-dropzone__body {
    grid-auto-flow: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: left;
}
.cc-dropzone--slim .cc-dropzone__title {
    font-weight: 500;
    font-size: 0.9rem;
}
.cc-lightbox {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, black 82%, transparent);
    padding: var(--rv-space-3);
}
.cc-lightbox[hidden] {
    display: none;
}
.cc-lightbox__frame {
    position: relative;
    max-width: min(92vw, 1100px);
    max-height: 88vh;
    display: grid;
    place-items: center;
}
.cc-lightbox__img {
    max-width: 100%;
    max-height: 88vh;
    object-fit: contain;
    border-radius: var(--rv-radius);
    background: var(--rv-surface-2);
}
.cc-reason-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 600;
}
.cc-reason-pill::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 999px;
    background: currentColor;
    flex-shrink: 0;
}
.cc-reason-pill--sold {
    color: var(--rv-success);
    background: color-mix(in srgb, var(--rv-success) 16%, var(--rv-surface-2));
}
.cc-reason-pill--lost,
.cc-reason-pill--stolen,
.cc-reason-pill--destroyed {
    color: var(--rv-danger);
    background: color-mix(in srgb, var(--rv-danger) 16%, var(--rv-surface-2));
}
.cc-reason-pill--retired {
    color: var(--rv-text-muted);
    background: var(--rv-surface-2);
}
.cc-reason-pill--other {
    color: var(--rv-warn);
    background: color-mix(in srgb, var(--rv-warn) 16%, var(--rv-surface-2));
}
.cc-lightbox__actions {
    position: absolute;
    top: -44px;
    left: 0;
    display: flex;
    gap: 8px;
}
.cc-lightbox__action {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid var(--rv-border);
    background: color-mix(in srgb, var(--rv-surface-1) 90%, transparent);
    color: var(--rv-text-muted);
    display: grid;
    place-items: center;
    cursor: pointer;
}
.cc-lightbox__action:hover {
    color: var(--rv-accent);
    border-color: color-mix(in srgb, var(--rv-accent) 45%, var(--rv-border));
}
.cc-lightbox__action:disabled {
    cursor: default;
    opacity: 0.7;
}
.cc-lightbox__action--active {
    color: var(--rv-warn);
    border-color: color-mix(in srgb, var(--rv-warn) 45%, var(--rv-border));
}
.cc-lightbox__action--danger:hover {
    color: var(--rv-danger);
    background: color-mix(in srgb, var(--rv-danger) 14%, transparent);
    border-color: color-mix(in srgb, var(--rv-danger) 45%, var(--rv-border));
}
.cc-lightbox__action[hidden] {
    display: none;
}
.cc-lightbox__close,
.cc-lightbox__nav {
    border: 1px solid var(--rv-border);
    background: color-mix(in srgb, var(--rv-surface-1) 90%, transparent);
    color: var(--rv-text);
    display: grid;
    place-items: center;
    cursor: pointer;
    border-radius: 999px;
}
.cc-lightbox__close {
    position: absolute;
    top: -44px;
    right: 0;
    width: 36px;
    height: 36px;
}
.cc-lightbox__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
}
.cc-lightbox__nav--prev {
    left: -56px;
}
.cc-lightbox__nav--next {
    right: -56px;
}
.cc-lightbox__nav[hidden] {
    display: none;
}
.cc-lightbox__count {
    position: absolute;
    bottom: -32px;
    left: 0;
    right: 0;
    text-align: center;
    color: var(--rv-text-muted);
    font-size: 0.85rem;
    margin: 0;
}
@media (max-width: 720px) {
    .cc-lightbox__nav--prev {
        left: 4px;
    }
    .cc-lightbox__nav--next {
        right: 4px;
    }
    .cc-lightbox__actions {
        top: 4px;
        left: 4px;
    }
    .cc-lightbox__close {
        top: 4px;
        right: 4px;
    }
    .cc-lightbox__count {
        bottom: 8px;
        color: var(--rv-text);
    }
}
.cc-filetype-icon {
    flex-shrink: 0;
}
.cc-filetype-icon--pdf {
    color: var(--rv-doc-pdf);
}
.cc-filetype-icon--docx {
    color: var(--rv-doc-docx);
}
.cc-filetype-icon--image {
    color: var(--rv-doc-image);
}
.cc-doc-viewer {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, black 82%, transparent);
    padding: var(--rv-space-3);
}
.cc-doc-viewer[hidden] {
    display: none;
}
.cc-doc-viewer__frame {
    position: relative;
    width: min(92vw, 900px);
    height: min(88vh, 1100px);
    display: flex;
    flex-direction: column;
    background: var(--rv-surface-1);
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    overflow: hidden;
}
.cc-doc-viewer__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rv-space-2);
    padding: 10px 14px;
    border-bottom: 1px solid var(--rv-border);
    flex-shrink: 0;
}
.cc-doc-viewer__title {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--rv-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cc-doc-viewer__header-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.cc-doc-viewer__btn {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    border: 1px solid var(--rv-border);
    background: color-mix(in srgb, var(--rv-surface-2) 90%, transparent);
    color: var(--rv-text-muted);
    display: grid;
    place-items: center;
    cursor: pointer;
}
.cc-doc-viewer__btn:hover {
    color: var(--rv-accent);
    border-color: color-mix(in srgb, var(--rv-accent) 45%, var(--rv-border));
}
.cc-doc-viewer__btn:disabled {
    cursor: default;
    opacity: 0.45;
}
.cc-doc-viewer__body {
    position: relative;
    flex: 1;
    overflow: auto;
    display: grid;
    place-items: center;
    background: var(--rv-bg);
    padding: var(--rv-space-2);
}
.cc-doc-viewer__img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 6px;
}
.cc-doc-viewer__canvas {
    background: #ffffff;
    box-shadow: 0 2px 12px color-mix(in srgb, black 45%, transparent);
    max-width: 100%;
    height: auto;
}
.cc-doc-viewer__status {
    color: var(--rv-text-muted);
    font-size: 0.9rem;
    text-align: center;
    max-width: 320px;
}
.cc-doc-viewer__status a {
    color: var(--rv-accent);
}
.cc-doc-viewer__pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--rv-space-2);
    padding: 8px 14px;
    border-top: 1px solid var(--rv-border);
    flex-shrink: 0;
}
.cc-doc-viewer__pager[hidden] {
    display: none;
}
.cc-doc-viewer__page-count {
    color: var(--rv-text-muted);
    font-size: 0.85rem;
    min-width: 90px;
    text-align: center;
}
@media (max-width: 720px) {
    .cc-doc-viewer__frame {
        width: 100vw;
        height: 100vh;
        border-radius: 0;
    }
}
.cc-photo__badge {
    position: absolute;
    top: 8px;
    left: 8px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 999px;
    border: 1px solid var(--rv-border);
    background: color-mix(in srgb, var(--rv-surface-2) 92%, transparent);
    color: var(--rv-warn);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    z-index: 2;
}
.cc-photo__actions {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    gap: 4px;
    opacity: 0;
    transition: opacity .15s ease;
}
.cc-photo:hover .cc-photo__actions,
.cc-photo__actions:focus-within { opacity: 1; }
.cc-photo:has(.cc-move-form:not([hidden])) {
    overflow: visible;
    z-index: 5;
}
.cc-photo .cc-move-form {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    width: 260px;
    z-index: 20;
}
.cc-photo__actions .cc-row-actions__btn,
.cc-photo__remove {
    position: static;
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 50%;
    background: color-mix(in srgb, var(--rv-bg) 85%, transparent);
    border: 1px solid var(--rv-border);
    color: var(--rv-text);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    cursor: pointer;
}
.cc-photo__remove {
    border-color: var(--rv-danger);
    color: var(--rv-danger);
}
.cc-photo:hover .cc-photo__remove,
.cc-photo__remove:focus-visible { opacity: 1; }
.cc-photo__remove:hover {
    background: var(--rv-danger);
    color: var(--rv-bg);
}
.cc-photo__remove:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--rv-danger) 35%, transparent);
    outline: none;
}
.cc-photo-add label {
    display: grid;
    place-items: center;
    gap: 6px;
    height: 100%;
    color: var(--rv-text-muted);
    cursor: pointer;
}
.cc-photo-add input { display: none; }
.cc-modal-overlay {
    position: fixed;
    inset: 0;
    background: color-mix(in srgb, var(--rv-bg) 60%, transparent);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}
.cc-modal-overlay[hidden] { display: none; }
.cc-grid[hidden] { display: none; }
.cc-table-wrap[hidden] { display: none; }
.cc-modal {
    background: var(--rv-surface-1);
    border: 1px solid var(--rv-border);
    border-radius: 10px;
    padding: 24px;
    max-width: 360px;
    width: 90%;
    box-shadow: 0 20px 60px color-mix(in srgb, var(--rv-bg) 50%, transparent);
}
.cc-modal__text {
    color: var(--rv-text);
    margin: 0 0 12px;
    line-height: 1.5;
}
.cc-modal__icon {
    color: var(--rv-danger);
    display: flex;
    justify-content: center;
    margin-bottom: 8px;
}
.cc-modal__warning {
    color: var(--rv-danger);
    font-weight: 600;
    font-size: 0.9rem;
    margin: 0 0 20px;
}
.cc-modal__note-wrap {
    margin: 0 0 16px;
}
.cc-modal__note-wrap .cc-field {
    margin: 0;
}
.cc-modal__price-wrap {
    margin: 0 0 16px;
}
.cc-modal__price-wrap .cc-field {
    margin: 0;
}
.cc-table tr.is-archived td {
    color: var(--rv-text-muted);
}
.cc-table tr.is-archived strong {
    color: var(--rv-text-muted);
}
.cc-move-form {
    margin-top: 8px;
    padding: 12px;
    border: 1px solid var(--rv-border);
    border-radius: 8px;
    background: var(--rv-surface-2);
}
.cc-move-form[hidden] {
    display: none;
}
.cc-move-form__actions {
    display: flex;
    gap: 8px;
    margin-top: 8px;
}
.cc-modal__actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}
.cc-print-options-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0 0 20px;
    max-height: 40vh;
    overflow-y: auto;
}
.cc-print-options-list--extra {
    margin-top: -12px;
    padding-top: 12px;
    border-top: 1px solid var(--rv-border);
}
.cc-print-options-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 4px;
    border-bottom: 1px solid var(--rv-border);
    color: var(--rv-text);
    cursor: pointer;
}
.cc-print-options-row:last-child {
    border-bottom: none;
}
/* QR block now sits in the header's right column, next to the title -
   sized to read as a document corner mark, not a full-width strip. */
.cc-print-qr {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}
.cc-print-qr svg {
    width: 64px;
    height: 64px;
    flex: 0 0 auto;
}
.cc-print-qr__meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-width: 190px;
}
.cc-print-qr__label {
    margin: 0;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--rv-text-muted);
}
.cc-print-qr__url {
    margin: 0;
    font-size: 0.68rem;
    color: var(--rv-text-muted);
    word-break: break-all;
    line-height: 1.35;
}
.cc-print-masthead {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rv-space-3);
    margin-bottom: var(--rv-space-2);
}
.cc-print-masthead__logo {
    width: 132px;
    height: auto;
    display: block;
}
.cc-print-masthead__meta {
    text-align: right;
    font-size: 0.75rem;
    line-height: 1.5;
    color: #4b5563;
}
html.cc-print .cc-assets-header {
    border-bottom: 3px solid var(--rv-accent);
    padding-bottom: var(--rv-space-3);
    margin-bottom: var(--rv-space-3);
    flex-wrap: wrap;
}
/* Light gray band behind each panel's own heading row - full panel width,
   achieved by negating the panel's own padding rather than restructuring
   markup. Falls back harmlessly if a panel has no heading. */
html.cc-print .cc-panel > .cc-subheading:first-child,
html.cc-print .cc-panel > .cc-panel__header-row:first-child {
    margin: calc(var(--rv-space-3) * -1) calc(var(--rv-space-3) * -1) var(--rv-space-2);
    padding: 10px var(--rv-space-3);
    background: #f7f7f8;
    border-bottom: 1px solid #e5e7eb;
}
/* Short panels (Location + Derived Summary on Cases) share a row instead
   of stacking full-width - only wrapped where both panels are genuinely
   short; tables and longer lists stay full-width. */
html.cc-print .cc-print-pair {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: var(--rv-space-3);
}
@media (max-width: 620px) {
    html.cc-print .cc-print-pair {
        grid-template-columns: minmax(0, 1fr);
    }
}
.cc-file-list, .cc-link-list { list-style: none; padding: 0; margin: 0 0 var(--rv-space-2); }
.cc-file-list li, .cc-link-list li {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--rv-border);
}
.cc-upload-inline { display: flex; gap: 8px; align-items: center; }
.cc-timeline { list-style: none; margin: 0; padding: 0 0 0 18px; border-left: 2px solid var(--rv-border); }
.cc-timeline li { position: relative; padding: 0 0 var(--rv-space-3) var(--rv-space-2); }
.cc-timeline__marker {
    position: absolute;
    left: -23px;
    top: 4px;
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: var(--rv-bg);
    border: 2px solid var(--rv-accent);
}
.cc-log-form { display: grid; gap: 8px; margin-top: var(--rv-space-3); }
.cc-kv--stack div { grid-template-columns: 1fr; gap: 4px; }
.cc-btn--danger {
    background: transparent;
    border-color: color-mix(in srgb, var(--rv-danger) 50%, transparent);
    color: var(--rv-danger);
}
.cc-btn--sm { padding: 6px 10px; font-size: 0.8rem; }
.cc-inline-form { display: flex; gap: 8px; align-items: center; margin-top: var(--rv-space-4); }
.cc-select-sm { min-width: 140px; }
.cc-toggle-list {
    list-style: none;
    margin: var(--rv-space-2) 0 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.cc-toggle {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    padding: 10px 12px;
    border: 1px solid var(--rv-border);
    border-radius: 10px;
    background: var(--rv-surface-2);
}
.cc-toggle input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}
.cc-toggle__track {
    position: relative;
    flex: 0 0 44px;
    width: 44px;
    height: 26px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--rv-border) 80%, transparent);
    border: 1px solid var(--rv-border);
    transition: background 0.15s ease, border-color 0.15s ease;
}
.cc-toggle__thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 999px;
    background: var(--rv-bg);
    box-shadow: 0 1px 2px color-mix(in srgb, var(--rv-text) 25%, transparent);
    transition: transform 0.15s ease;
}
.cc-toggle input:checked + .cc-toggle__track {
    background: color-mix(in srgb, var(--rv-accent) 45%, var(--rv-surface-2));
    border-color: color-mix(in srgb, var(--rv-accent) 55%, var(--rv-border));
}
.cc-toggle input:checked + .cc-toggle__track .cc-toggle__thumb {
    transform: translateX(18px);
}
.cc-toggle input:focus-visible + .cc-toggle__track {
    outline: 2px solid color-mix(in srgb, var(--rv-accent) 55%, transparent);
    outline-offset: 2px;
}
.cc-toggle__text {
    display: grid;
    gap: 2px;
    min-width: 0;
}
.cc-toggle__name {
    color: var(--rv-text);
    font-weight: 600;
}
.cc-toggle__meta {
    color: var(--rv-text-muted);
    font-size: 0.85rem;
}
.cc-toggle--row {
    justify-content: space-between;
}
.cc-settings-section-title {
    margin: var(--rv-space-2) 0 0;
    font-size: 0.95rem;
    font-weight: 600;
}
.cc-wizard-step {
    margin: 0 0 var(--rv-space-2);
    color: var(--rv-text-muted);
    font-size: 0.95rem;
    font-weight: 600;
}
[data-asset-wizard] [data-wizard-step][hidden],
[data-wizard-back][hidden],
[data-wizard-continue][hidden],
[data-wizard-submit][hidden] {
    display: none !important;
}
.cc-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: var(--rv-space-2);
}
.cc-panel__head .cc-subheading {
    margin: 0;
}
.cc-inline-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}
.cc-upload-stack {
    display: grid;
    gap: 12px;
}
.cc-dropzone {
    position: relative;
    border: 1px dashed var(--rv-border);
    border-radius: var(--rv-radius);
    background: var(--rv-surface-2);
    padding: var(--rv-space-3);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.cc-dropzone.is-dragover {
    border-color: color-mix(in srgb, var(--rv-accent) 55%, var(--rv-border));
    background: color-mix(in srgb, var(--rv-accent) 10%, var(--rv-surface-2));
}
.cc-dropzone__input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}
.cc-dropzone__body {
    display: grid;
    justify-items: center;
    gap: 6px;
    text-align: center;
    color: var(--rv-text-muted);
}
.cc-dropzone__title {
    color: var(--rv-text);
    font-weight: 600;
}
.cc-dropzone__hint,
.cc-dropzone__files {
    font-size: 0.85rem;
}
.cc-dropzone--compact {
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
    background: transparent;
    border-radius: 0;
}
.cc-dropzone--compact .cc-dropzone__body {
    height: 100%;
    place-content: center;
}
.cc-photo-add .cc-dropzone--compact {
    min-height: 160px;
}
.cc-stack { display: grid; gap: 8px; margin-top: var(--rv-space-2); }
.cc-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: var(--rv-space-3);
}
.cc-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 10px;
    background: var(--rv-surface-2);
    border: 1px solid var(--rv-border);
    box-shadow: 0 0 16px -6px color-mix(in srgb, var(--rv-accent) 30%, transparent);
    transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
    color: var(--rv-text);
    text-decoration: none;
}
a.cc-chip:hover {
    box-shadow: 0 0 24px -6px color-mix(in srgb, var(--rv-accent) 50%, transparent);
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--rv-accent) 45%, var(--rv-border));
    color: var(--rv-text);
}
.cc-chip--active {
    background: color-mix(in srgb, var(--rv-accent) 16%, var(--rv-surface-2));
    border-color: color-mix(in srgb, var(--rv-accent) 45%, var(--rv-border));
}
.cc-chip__label {
    color: var(--rv-text-muted);
    font-size: 0.85rem;
    font-weight: 500;
}
.cc-chip__value {
    color: var(--rv-text);
    font-weight: 700;
}
.cc-alert--warn {
    background: color-mix(in srgb, var(--rv-warn) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--rv-warn) 35%, transparent);
    color: var(--rv-warn);
    display: flex;
    gap: 8px;
    align-items: flex-start;
}
.cc-alert--info {
    background: color-mix(in srgb, var(--rv-accent) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--rv-accent) 28%, transparent);
    color: var(--rv-text-muted);
    display: flex;
    gap: 10px;
    align-items: flex-start;
}
.cc-alert__icon {
    flex: 0 0 auto;
    margin-top: 1px;
    color: var(--rv-accent);
}
.cc-alert__text {
    margin: 0;
    font-size: 0.85rem;
    line-height: 1.6;
}

/* Dashboard HUD */
.cc-page--dashboard .num {
    font-variant-numeric: tabular-nums;
}
.cc-content--dashboard {
    display: grid;
    gap: var(--rv-space-3);
}
.cc-dashboard-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--rv-space-3);
    flex-wrap: wrap;
}
.cc-dashboard-eyebrow {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--rv-accent);
    margin-bottom: 6px;
}
.cc-dashboard-header__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.cc-chip-row--dashboard {
    margin-bottom: 0;
}
.cc-chip--dashboard {
    flex: 1 1 190px;
    min-width: 190px;
    align-items: center;
    gap: 12px;
    padding: 12px 18px;
}
.cc-chip-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--chip-color, var(--rv-accent)) 18%, var(--rv-surface-2));
    color: var(--chip-color, var(--rv-accent));
    flex-shrink: 0;
}
.cc-chip-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.cc-chip--dashboard .cc-chip-value {
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.1;
}
.cc-chip--dashboard .cc-chip-label {
    font-size: 0.74rem;
    color: var(--rv-text-muted);
    margin-top: 3px;
}
.cc-chip-fraction {
    color: var(--rv-text-muted);
    font-size: 0.82rem;
    font-weight: 600;
}
.cc-chip--warn .cc-chip-icon {
    --chip-color: var(--rv-warn);
}
.cc-chip--warn .cc-chip-value {
    color: var(--rv-warn);
}
.cc-chip--value .cc-chip-value-wrap {
    position: relative;
    display: inline-block;
}
.cc-chip--value:not(.is-revealed) .cc-chip-value {
    filter: blur(7px);
    user-select: none;
}
.cc-reveal-overlay {
    position: absolute;
    inset: -3px -10px;
    display: none;
    align-items: center;
    justify-content: center;
    gap: 5px;
    background: color-mix(in srgb, var(--rv-surface-2) 62%, transparent);
    border-radius: 6px;
    cursor: pointer;
    border: 0;
    padding: 0;
    color: var(--rv-text);
    font-size: 0.68rem;
    font-weight: 700;
    white-space: nowrap;
}
.cc-chip--value:not(.is-revealed) .cc-reveal-overlay {
    display: flex;
}
.cc-hide-btn {
    display: none;
    position: absolute;
    top: -8px;
    right: -10px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    padding: 0;
    align-items: center;
    justify-content: center;
    background: var(--rv-surface-2);
    border: 1px solid var(--rv-border);
    color: var(--rv-text-muted);
    cursor: pointer;
}
.cc-chip--value.is-revealed .cc-hide-btn {
    display: inline-flex;
}
.cc-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rv-space-2);
    margin-bottom: var(--rv-space-2);
}
.cc-panel-title {
    font-size: 0.95rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
}
.cc-panel-desc {
    font-size: 0.78rem;
    color: var(--rv-text-muted);
    margin-top: 3px;
}
.cc-panel-link {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-accent);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
    text-decoration: none;
}
.cc-panel-link:hover {
    color: var(--rv-accent-hover);
    text-decoration: underline;
}
.cc-health {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: var(--rv-space-4);
    align-items: center;
}
.cc-gauge-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.cc-gauge-readout {
    text-align: center;
    margin-top: -14px;
}
.cc-gauge-score {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}
.cc-gauge-status {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-top: 4px;
}
.cc-gauge-caption {
    font-size: 0.74rem;
    color: var(--rv-text-muted);
    margin: 6px 0 0;
    max-width: 200px;
}
.cc-needle-grp {
    transform-origin: 125px 148px;
    transition: transform 0.9s cubic-bezier(.2,.8,.2,1);
}
.cc-meters {
    display: flex;
    flex-direction: column;
    gap: var(--rv-space-3);
}
.cc-meter-row {
    display: grid;
    grid-template-columns: 170px 1fr 52px;
    align-items: center;
    gap: 14px;
}
.cc-meter-label {
    font-size: 0.82rem;
    font-weight: 600;
}
.cc-meter-label small {
    display: block;
    font-size: 0.68rem;
    font-weight: 500;
    color: var(--rv-text-muted);
    margin-top: 1px;
}
.cc-meter-led {
    display: flex;
    gap: 3px;
}
.cc-led {
    flex: 1;
    height: 10px;
    border-radius: 2px;
    background: var(--rv-surface-2);
    border: 1px solid var(--rv-border);
}
.cc-led.is-lit {
    background: var(--led-color, var(--rv-good));
    border-color: color-mix(in srgb, var(--led-color, var(--rv-good)) 70%, var(--rv-border));
    box-shadow: 0 0 6px color-mix(in srgb, var(--led-color, var(--rv-good)) 45%, transparent);
}
.cc-meter-pct {
    text-align: right;
    font-weight: 600;
}
.cc-meter-fix {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-top: 2px;
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--rv-accent);
    text-decoration: none;
    width: fit-content;
}
.cc-meter-fix:hover {
    color: var(--rv-accent-hover);
    text-decoration: underline;
}
.cc-meter-fix svg {
    width: 11px;
    height: 11px;
}
.cc-health-note {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: 8px;
    background: var(--rv-surface-2);
    border: 1px solid var(--rv-border);
    font-size: 0.78rem;
    color: var(--rv-text-muted);
}
.cc-health-note svg {
    flex-shrink: 0;
    color: var(--rv-text-muted);
}
.cc-health-toggle-form {
    margin: 0 0 0 auto;
}
.cc-tone-good {
    color: var(--rv-good);
}
.cc-tone-warn {
    color: var(--rv-warn);
}
.cc-tone-danger {
    color: var(--rv-danger);
}
.cc-status-dot.cc-tone-danger {
    background: var(--rv-danger);
}
.cc-status-dot.cc-tone-warn {
    background: var(--rv-warn);
}
.cc-dashboard-grid {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: var(--rv-space-3);
}
.cc-dashboard-grid.cc-admin-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.cc-dashboard-col {
    display: grid;
    gap: var(--rv-space-3);
    align-content: start;
}
.cc-bars {
    display: grid;
    gap: 10px;
}
.cc-bar-row {
    display: grid;
    grid-template-columns: minmax(120px, 1fr) 1fr 40px;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    transition: background 0.15s ease;
}
.cc-bar-row:hover {
    background: var(--rv-surface-2);
}
.cc-bar-row.is-muted {
    opacity: 0.65;
}
.cc-bar-name {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    font-weight: 600;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cc-bar-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--bar-color, var(--rv-accent));
    flex-shrink: 0;
}
.cc-bar-track {
    height: 8px;
    border-radius: 99px;
    background: var(--rv-surface-2);
    overflow: hidden;
}
.cc-bar-fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--bar-color, var(--rv-accent));
}
.cc-bar-count {
    text-align: right;
    font-weight: 600;
    font-size: 0.82rem;
}
.cc-tile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.cc-tile {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid var(--rv-border);
    background: var(--rv-surface-2);
    text-decoration: none;
    color: inherit;
    transition: border-color 0.15s ease, background 0.15s ease;
}
.cc-tile:hover {
    border-color: color-mix(in srgb, var(--rv-accent) 45%, var(--rv-border));
    background: color-mix(in srgb, var(--rv-accent) 8%, var(--rv-surface-2));
}
.cc-tile.is-disabled {
    opacity: 0.55;
    pointer-events: none;
}
.cc-tile-icon {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--rv-accent) 14%, var(--rv-surface-2));
    color: var(--rv-accent);
}
.cc-tile-name {
    font-size: 0.82rem;
    font-weight: 600;
}
.cc-tile-soon {
    margin-left: auto;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 99px;
    background: var(--rv-surface-2);
    color: var(--rv-text-muted);
}
.cc-watch-list,
.cc-activity {
    display: grid;
    gap: 8px;
}
.cc-watch-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px;
    border-radius: 8px;
    text-decoration: none;
    color: inherit;
    transition: background 0.15s ease;
}
.cc-watch-item:hover {
    background: var(--rv-surface-2);
}
.cc-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-top: 6px;
    flex-shrink: 0;
    background: var(--rv-warn);
}
.cc-watch-name {
    display: block;
    font-size: 0.82rem;
    font-weight: 600;
}
.cc-watch-meta {
    display: block;
    font-size: 0.72rem;
    margin-top: 2px;
}
.cc-watch-meta.cc-tone-danger {
    color: var(--rv-danger);
}
.cc-watch-meta.cc-tone-warn {
    color: var(--rv-warn);
}
.cc-watch-empty {
    font-size: 0.82rem;
    color: var(--rv-text-muted);
    margin: 0;
}
.cc-activity-item {
    display: flex;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid var(--rv-border);
}
.cc-activity-item:last-child {
    border-bottom: 0;
}
.cc-activity-icon {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--rv-accent) 14%, var(--rv-surface-2));
    color: var(--rv-accent);
    flex-shrink: 0;
}
.cc-activity-text {
    font-size: 0.78rem;
    color: var(--rv-text-muted);
}
.cc-activity-time {
    display: block;
    margin-top: 2px;
    font-size: 0.68rem;
    color: var(--rv-text-muted);
}
@media (max-width: 1100px) {
    .cc-health,
    .cc-dashboard-grid,
    .cc-dashboard-grid.cc-admin-cards {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 700px) {
    .cc-meter-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .cc-meter-pct {
        text-align: left;
    }
    .cc-bar-row {
        grid-template-columns: 1fr;
        gap: 6px;
    }
    .cc-bar-count {
        text-align: left;
    }
}
@media (max-width: 1100px) {
    .cc-filters { grid-template-columns: 1fr 1fr; }
    .cc-detail-layout { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
    [data-list-filters-toggle] {
        display: inline-flex;
        margin-bottom: var(--rv-space-2);
    }
    .cc-filters-panel[hidden] {
        display: none;
    }
    .cc-filters-submit--desktop {
        display: none;
    }
    .cc-assets-header + .cc-chip-row {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .cc-assets-header + .cc-chip-row::-webkit-scrollbar {
        display: none;
    }
    .cc-main {
        grid-template-rows: auto;
    }
}
@media (min-width: 901px) {
    [data-list-filters-toggle] {
        display: none;
    }
    .cc-filters-panel {
        display: block !important;
    }
    .cc-filters-panel[hidden] {
        display: block !important;
    }
    .cc-filters-submit--mobile {
        display: none;
    }
}
@media (max-width: 900px) {
    .cc-assets-header, .cc-detail-header { flex-direction: column; }
    .cc-grid-2 { grid-template-columns: 1fr; }
}

.cc-entity-header-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: stretch;
    justify-content: flex-end;
}
.cc-entity-header-actions__cluster {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.cc-entity-header-actions__cluster + .cc-entity-header-actions__cluster {
    padding-left: 12px;
    border-left: 1px solid var(--rv-border);
}
.cc-entity-header-actions .cc-inline-form {
    display: flex;
    margin: 0;
    align-items: center;
}
.cc-entity-header-actions .cc-btn--icon {
    flex-shrink: 0;
}
.cc-production-doc-attach-form {
    margin-top: var(--rv-space-2);
}
.cc-loadout-readiness-hero .cc-health {
    justify-content: center;
}
.cc-form-grid--nested {
    margin-top: 12px;
}
.cc-rig-members {
    list-style: none;
    margin: 16px 0 0;
    padding: 0;
    display: grid;
    gap: 8px;
}
.cc-rig-member-row {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 12px;
    border: 1px solid var(--fv-border);
    border-radius: var(--fv-radius-md);
    background: var(--fv-surface);
}
.cc-rig-member-row.is-dragging {
    opacity: 0.6;
    border-color: var(--fv-accent);
}
.cc-rig-member-row__handle {
    cursor: grab;
    color: var(--fv-text-muted);
    flex-shrink: 0;
    padding-top: 2px;
}
.cc-rig-member-row__position {
    font-weight: 600;
    flex-shrink: 0;
    min-width: 1.5rem;
}
.cc-rig-member-row__body {
    flex: 1;
    min-width: 0;
}
.cc-rig-member-row__note {
    display: block;
    color: var(--fv-text-muted);
    font-size: 0.9rem;
    margin-top: 4px;
}
.cc-rig-member-row__actions {
    display: flex;
    gap: 4px;
    align-items: center;
    flex-shrink: 0;
}
.cc-details--inline {
    display: inline-block;
}
.cc-page--print .cc-entity-header-actions,
.cc-page--print .cc-rig-member-row__handle,
.cc-page--print .cc-rig-member-row__actions,
.cc-page--print .cc-details,
.cc-page--print .cc-rig-doc-form {
    display: none !important;
}
/* Print pages render as a plain white document, not the app's dark theme -
   overriding the shared tokens here flips every component that already
   consumes them (panels, pills, status dots, kv rows, alerts, icons). */
html.cc-print {
    --rv-bg: #ffffff;
    --rv-surface-1: #ffffff;
    --rv-surface-2: #f3f4f6;
    --rv-text: #111111;
    --rv-text-muted: #4b5563;
    --rv-border: #d4d4d8;
    --rv-accent: #1d4ed8;
    --rv-accent-hover: #1e40af;
    --rv-danger: #b91c1c;
    --rv-success: #15803d;
    --rv-warn: #b45309;
    --rv-good: #15803d;
}
html.cc-print body {
    background-color: #ffffff;
    color: #111111;
}
/* "Dual Glow" now lives on body::before (see the html/body rule near the top of this file), not
   on body's own background-image, so the old `background-image: none` above no longer reaches it -
   suppress the pseudo-element directly instead, same print-is-a-plain-white-document intent. */
html.cc-print body::before {
    display: none;
}
html.cc-print .cc-panel,
html.cc-print .cc-auth__panel {
    box-shadow: none;
    border: 1px solid #d4d4d8;
    /* The section-header gray band (below) is flush against the panel's
       edges via negative margins, so its own square corners were visually
       squaring off the panel's rounded top corners. Clip to the panel's
       own border-radius instead of also rounding the band itself. */
    overflow: hidden;
}
html.cc-print .cc-status--archived {
    color: #4b5563;
}
/* Center the printed record as a document column instead of a left-pinned
   app layout - .cc-content--detail has no explicit grid track, so its
   single implicit column shrinks to content; force it to fill the capped,
   centered width instead. */
html.cc-print .cc-shell {
    /* sidebar.php is never required in print mode, but .cc-shell still
       defines two grid tracks (sidebar + content) - without this, the
       sole remaining child (.cc-main) auto-places into the first
       260px-wide track instead of filling the page. */
    display: block;
    /* .cc-shell (and the body below) force a full-viewport min-height for
       the app chrome's fixed bottom nav - on a short print page that
       stretches the box well past its content, so the footer (a sibling
       right after .cc-shell closes) lands a screen-height below the last
       field instead of directly under it. Print has no bottom nav. */
    min-height: 0;
}
html.cc-print .cc-page--app {
    min-height: 0;
    padding-bottom: 0;
}
html.cc-print .cc-content {
    max-width: 820px;
    width: 100%;
    margin: 0 auto;
    padding: var(--rv-space-4) var(--rv-space-3);
}
html.cc-print .cc-content--detail {
    grid-template-columns: minmax(0, 1fr);
}
html.cc-print .cc-help-icon {
    display: none;
}
/* print-init.js hides [data-print-*] toggle elements via the `hidden`
   attribute when ?hide_price=1 / ?hide_address=1, but that only carries
   UA-stylesheet specificity - rules like .cc-kv div's own `display: grid`
   (and .cc-table th/td's table layout) outrank it and the element stayed
   visible despite `hidden` being set. Force it explicitly wherever this
   app's own CSS might otherwise win. */
[data-print-price][hidden],
[data-print-address][hidden] {
    display: none !important;
}
/* Backstop: no interactive control should ever reach print output, on this
   page or any future one, even if a form/button/dropdown is added later
   without being wrapped in a !$printMode check server-side. */
html.cc-print button,
html.cc-print input,
html.cc-print select,
html.cc-print textarea,
html.cc-print .cc-row-actions,
html.cc-print .cc-details,
html.cc-print .cc-toggle {
    display: none !important;
}
.cc-print-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    max-width: 820px;
    /* No top margin - .cc-content's own bottom padding already provides
       the gap after the last section, so the footer sits directly below
       whatever field printed last instead of stacking a second gap on
       top of it. */
    margin: 0 auto 0;
    padding: var(--rv-space-3) var(--rv-space-3) 0;
    border-top: 3px solid var(--rv-accent);
    color: #4b5563;
    font-size: 0.8rem;
    /* Keep the footer attached to the content that precedes it instead of
       risking the print engine stranding it alone at the top of a new
       page when the last section lands near a page break. */
    break-inside: avoid;
    break-before: avoid;
    page-break-inside: avoid;
    page-break-before: avoid;
}
.cc-print-footer__dot {
    color: #9ca3af;
}
.cc-inline-form {
    display: inline;
}
.cc-loadout-location-form {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}
.cc-loadout-location-form .cc-input {
    min-width: 220px;
}
.cc-loadout-pack-list {
    list-style: none;
    margin: 0 0 16px;
    padding: 0;
    display: grid;
    gap: 8px;
}
.cc-checklist-item {
    border: 1px solid var(--fv-border);
    border-radius: var(--fv-radius-md);
    background: var(--fv-surface);
}
.cc-checklist-item.is-packed {
    border-color: var(--fv-success);
    background: color-mix(in srgb, var(--fv-success) 8%, var(--fv-surface));
}
.cc-checklist-item__row {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
    padding: 12px 16px;
    cursor: pointer;
    border-radius: var(--fv-radius-md);
}
.cc-checklist-item__row:hover {
    background: color-mix(in srgb, var(--fv-text) 4%, transparent);
}
.cc-checklist-item__input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}
.cc-checklist-item__box {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    border: 2px solid var(--fv-border);
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: transparent;
    background: var(--fv-surface);
}
.cc-checklist-item.is-packed .cc-checklist-item__box,
.cc-checklist-item:has(.cc-checklist-item__input:checked) .cc-checklist-item__box {
    border-color: var(--fv-success);
    background: var(--fv-success);
    color: var(--fv-surface);
}
.cc-checklist-item__text {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px;
}
.cc-loadout-case-heading {
    margin: 16px 0 8px;
    font-weight: 600;
}
.cc-loadout-packing-pct {
    margin-right: 8px;
}
.cc-task-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.cc-task-list li {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin-bottom: 8px;
}
.cc-task-list li.is-done {
    opacity: 0.65;
    text-decoration: line-through;
}
.cc-page--print .cc-sidebar,
.cc-page--print .cc-mobile-nav,
.cc-page--print .cc-topbar,
.cc-page--print .cc-back,
.cc-page--print .cc-entity-header-actions,
.cc-page--print .cc-details,
.cc-page--print .cc-loadout-location-form button,
.cc-page--print .cc-row-actions {
    display: none !important;
}
@media print {
    .cc-sidebar,
    .cc-mobile-nav,
    .cc-topbar,
    .cc-back,
    .cc-entity-header-actions,
    .cc-details,
    .cc-loadout-location-form button,
    .cc-row-actions {
        display: none !important;
    }
    .cc-shell,
    .cc-main,
    .cc-content {
        display: block;
    }
}

.cc-empty__help {
    margin-top: var(--rv-space-2);
}
.cc-empty__help a {
    color: var(--rv-text-muted);
    text-decoration: underline;
}
.cc-nudge-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 var(--rv-space-3);
}
.cc-nudge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    background: color-mix(in srgb, var(--rv-warn) 12%, var(--rv-surface-1));
    color: var(--rv-text);
    text-decoration: none;
    font-size: 0.9rem;
}
.cc-nudge:hover {
    border-color: var(--rv-warn);
}
.cc-quick-log-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 var(--rv-space-3);
}
.cc-quick-log-row form {
    margin: 0;
}
.cc-attention-list {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--rv-space-3);
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.cc-attention-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    background: var(--rv-surface-1);
}
.cc-attention-item.cc-tone-danger {
    border-color: color-mix(in srgb, var(--rv-danger) 45%, var(--rv-border));
    background: color-mix(in srgb, var(--rv-danger) 8%, var(--rv-surface-1));
}
.cc-attention-item.cc-tone-warn {
    border-color: color-mix(in srgb, var(--rv-warn) 45%, var(--rv-border));
    background: color-mix(in srgb, var(--rv-warn) 8%, var(--rv-surface-1));
}
.cc-attention-item__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.cc-attention-item__actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
    flex-wrap: wrap;
}
.cc-attention-item__actions form {
    margin: 0;
}
.cc-frequency-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 0 var(--rv-space-3);
}
.cc-frequency-table th, .cc-frequency-table td {
    text-align: left;
    padding: 8px 10px;
    border-bottom: 1px solid var(--rv-border);
    font-size: 0.9rem;
}
.cc-frequency-table th {
    color: var(--rv-text-muted);
    font-weight: 600;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.cc-defaults-row {
    display: flex;
    gap: 8px;
    align-items: flex-end;
    margin-bottom: 8px;
}
.cc-defaults-row .cc-field {
    flex: 1;
    margin: 0;
}
.cc-tonight-card {
    margin-bottom: var(--rv-space-3);
}
.cc-tonight-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: var(--rv-space-2) 0;
    color: var(--rv-text-muted);
    font-size: 0.9rem;
}
.cc-tonight-card__actions {
    margin-top: var(--rv-space-2);
}
.cc-share-prompt {
    margin: 0 0 var(--rv-space-3);
    padding: var(--rv-space-3);
    border: 1px solid color-mix(in srgb, var(--rv-warn) 45%, var(--rv-border));
    border-radius: var(--rv-radius);
    background: color-mix(in srgb, var(--rv-warn) 10%, var(--rv-surface-1));
}
.cc-share-prompt--ready {
    border-color: color-mix(in srgb, var(--rv-good) 40%, var(--rv-border));
    background: color-mix(in srgb, var(--rv-good) 8%, var(--rv-surface-1));
}
.cc-share-prompt__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: var(--rv-space-2);
}
.cc-pack-meter {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: var(--rv-space-2) 0;
}
.cc-pack-meter__track {
    flex: 1;
    height: 8px;
    border-radius: 999px;
    background: var(--rv-surface-2);
    overflow: hidden;
}
.cc-pack-meter__fill {
    height: 100%;
    border-radius: 999px;
    background: var(--rv-accent);
}
.cc-pack-meter__label {
    font-size: 0.85rem;
    color: var(--rv-text-muted);
    white-space: nowrap;
}
.cc-gauge-delta {
    margin: 4px 0 0;
    font-size: 0.9rem;
    font-weight: 600;
}
.cc-checklist-strip {
    margin: 0 0 var(--rv-space-3);
    padding: var(--rv-space-3);
    border: 1px solid var(--rv-border);
    border-radius: var(--rv-radius);
    background: var(--rv-surface-1);
}
.cc-checklist-strip__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
}
.cc-checklist-strip__item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--rv-text-muted);
}
.cc-checklist-strip__item.is-done {
    color: var(--rv-good);
}
.cc-checklist-strip__label {
    font-size: 0.95rem;
}
.cc-quiet-nudge {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--rv-space-3);
    margin: 0 0 var(--rv-space-3);
}
.cc-quiet-nudge__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.cc-loadout-maintenance-alert {
    align-items: flex-start;
    margin: 0 0 var(--rv-space-3);
}
.cc-loadout-maintenance-alert__body {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
}
.cc-loadout-maintenance-alert__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.cc-loadout-maintenance-alert__list li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
}
.cc-loadout-maintenance-alert__quicklog {
    margin: 0;
    display: inline-flex;
}
.cc-watch-split {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin: 0 0 var(--rv-space-3);
    font-weight: 600;
}
.cc-watch-split a {
    color: var(--rv-text);
    text-decoration: none;
}
.cc-watch-split a:hover {
    color: var(--rv-accent);
}
.cc-confetti {
    pointer-events: none;
    position: fixed;
    inset: 0;
    z-index: 80;
    overflow: hidden;
}
.cc-confetti.is-done {
    opacity: 0;
    transition: opacity 0.3s ease;
}
.cc-confetti__piece {
    position: absolute;
    top: -12px;
    left: var(--confetti-left, 50%);
    width: 8px;
    height: 12px;
    background: var(--confetti-color, var(--rv-accent));
    transform: rotate(var(--confetti-rotate, 0deg));
    animation: cc-confetti-fall 1.5s ease-out forwards;
    animation-delay: var(--confetti-delay, 0s);
}
@keyframes cc-confetti-fall {
    0% { transform: translateY(0) rotate(var(--confetti-rotate, 0deg)); opacity: 1; }
    100% { transform: translateY(110vh) rotate(calc(var(--confetti-rotate, 0deg) + 180deg)); opacity: 0.2; }
}
@media (prefers-reduced-motion: reduce) {
    .cc-confetti__piece { animation: none; display: none; }
}
.cc-modal--celebration .cc-modal__icon {
    color: var(--rv-accent);
}
#cc-celebration-modal[hidden] {
    display: none;
}


/* --- Resources for Artists (public page + admin) --- */
.cc-resource-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--rv-space-2);
    margin-top: var(--rv-space-2);
}
.cc-resource-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 10px;
    padding: var(--rv-space-2);
    border-radius: 8px;
    border: 1px solid var(--rv-border);
    background: var(--rv-surface-2);
    transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.cc-resource-card:hover {
    border-color: color-mix(in srgb, var(--accent, var(--rv-accent)) 55%, var(--rv-border));
    transform: translateY(-2px);
    box-shadow: 0 8px 20px -12px color-mix(in srgb, var(--accent, var(--rv-accent)) 55%, transparent);
}
.cc-resource-card__body {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}
.cc-resource-card__desc,
.cc-resource-card__disclosure {
    align-self: stretch;
    text-align: left;
}
.cc-resource-card > .cc-avatar {
    width: 80px;
    height: 80px;
    font-size: 1.3rem;
}
.cc-resource-card__name {
    margin: 0;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}
.cc-resource-card__name a { color: var(--rv-text); text-decoration: none; }
.cc-resource-card__name a:hover { color: var(--rv-accent); text-decoration: underline; }
.cc-resource-card__visit {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    color: var(--rv-text-muted);
    opacity: 0;
    transform: translateX(-3px);
    transition: opacity 0.15s ease, transform 0.15s ease, color 0.15s ease;
}
.cc-resource-card:hover .cc-resource-card__visit {
    opacity: 1;
    transform: translateX(0);
    color: var(--accent, var(--rv-accent));
}
.cc-resource-card__tags {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 5px;
}
.cc-pill--tag {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 2px 8px;
    color: color-mix(in srgb, var(--accent, var(--rv-accent)) 78%, var(--rv-text));
    border-color: color-mix(in srgb, var(--accent, var(--rv-accent)) 32%, var(--rv-border));
    background: color-mix(in srgb, var(--accent, var(--rv-accent)) 14%, var(--rv-surface-2));
}
.cc-resource-card__desc {
    margin: 4px 0 0;
    color: var(--rv-text-muted);
    font-size: 0.9rem;
    line-height: 1.45;
}
.cc-resource-card__disclosure {
    margin: 6px 0 0;
    color: var(--rv-text-muted);
    font-size: 0.78rem;
    font-style: italic;
}
.cc-pill--partner {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--rv-accent);
    border-color: color-mix(in srgb, var(--rv-accent) 45%, var(--rv-border));
    background: color-mix(in srgb, var(--rv-accent) 14%, var(--rv-surface-2));
}
.cc-resources-group {
    scroll-margin-top: 76px;
    background: color-mix(in srgb, var(--accent, var(--rv-res-default)) 4%, var(--rv-surface-1) 92%);
    border-color: color-mix(in srgb, var(--accent, var(--rv-res-default)) 16%, var(--rv-border));
}
.cc-resources-group + .cc-resources-group { margin-top: var(--rv-space-2); }
.cc-resources-group__head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 4px;
}
.cc-resources-group__head .cc-subheading { margin: 0; }
.cc-resources-group__dot {
    width: 10px;
    height: 10px;
    border-radius: 3px;
    background: var(--accent, var(--rv-res-default));
    flex: 0 0 auto;
}
.cc-resources-jumpnav {
    position: sticky;
    top: 0;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px 0 var(--rv-space-2);
    margin-bottom: var(--rv-space-1);
    background: color-mix(in srgb, var(--rv-bg) 92%, transparent);
    backdrop-filter: blur(6px);
    border-bottom: 1px solid var(--rv-border);
}
.cc-resources-jumpnav__chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--rv-text-muted);
    background: var(--rv-surface-2);
    border: 1px solid var(--rv-border);
    padding: 6px 12px;
    border-radius: 999px;
    text-decoration: none;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.cc-resources-jumpnav__chip:hover {
    color: var(--rv-text);
    border-color: color-mix(in srgb, var(--accent) 55%, var(--rv-border));
    background: color-mix(in srgb, var(--accent) 12%, var(--rv-surface-2));
}
.cc-resources-jumpnav__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--accent);
}
.cc-resources-group__roundup {
    margin: var(--rv-space-2) 0 0;
    font-size: 0.85rem;
}
.cc-resources-group__roundup a {
    color: var(--rv-text-muted);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    text-decoration: none;
}
.cc-resources-group__roundup a:hover { color: var(--rv-accent); }
.cc-admin-resource-list {
    margin: 0 calc(-1 * var(--rv-space-3));
}
.cc-admin-resource-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 8px var(--rv-space-3);
    border-top: 1px solid var(--rv-border);
}
.cc-admin-resource-row:first-child { border-top: none; }
.cc-admin-resource-list > .cc-admin-resource-row:nth-child(even) {
    background: color-mix(in srgb, var(--rv-surface-2) 55%, transparent);
}
.cc-admin-resource-row:hover {
    background: var(--rv-surface-2);
}
.cc-admin-resource-row .cc-avatar {
    width: 72px;
    height: 72px;
    font-size: 1.1rem;
}
.cc-admin-resource-row__body { flex: 1; min-width: 0; }
.cc-admin-resource-row__name { font-weight: 600; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; line-height: 1.3; margin: 0; }
.cc-admin-resource-row__name a { color: inherit; text-decoration: none; }
.cc-admin-resource-row__name a:hover strong { color: var(--rv-accent); }
.cc-admin-resource-row__desc { margin: 4px 0 0; color: var(--rv-text-muted); font-size: 0.82rem; line-height: 1.4; }
.cc-admin-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
.cc-admin-group-header__title { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cc-admin-group-header__visibility { flex: 0 0 auto; margin: 0; }
.cc-admin-group-header__visibility .cc-toggle { padding: 6px 10px; gap: 8px; }

/* ===== Marketing subpages (added 2026-09-02, RigVault SEO/GEO content system) ===== */
.cc-page-hero {
    max-width: 900px;
    margin: 0 auto;
    padding: var(--rv-space-4) var(--rv-space-3) var(--rv-space-2);
    text-align: center;
}
.cc-page-hero__eyebrow { margin: 0 0 var(--rv-space-1); font-size: 0.8rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--rv-cobalt-bright); }
.cc-page-hero__title { margin: 0 0 var(--rv-space-2); font-size: clamp(1.9rem, 4vw, 2.75rem); line-height: 1.15; }
/* Per-page keyword emphasis in H1 hero titles (added 2026-09-05, Christian: highlight the primary keyword on each marketing/audience/guide page for scannability and SEO). Uses the site's existing accent blue, not a new color. */
.cc-kw { color: var(--rv-accent); }

/* Human sitemap page (/sitemap, added 2026-09-05) - "rack slot" treatment. Each
   pillar card is colored via the --cc-slot-color custom property set inline per
   card in the view, reusing the app's existing category/resource/doc color
   tokens (--rv-cat-*, --rv-doc-*, --rv-res-*) rather than inventing new colors -
   the same palette used to color-code gear categories and resource types
   elsewhere in the product. */
.cc-sitemap-intro { max-width: 640px; margin: 0 auto var(--rv-space-3); text-align: center; color: var(--rv-text-muted); }
.cc-sitemap-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: var(--rv-space-3);
    margin-top: var(--rv-space-3);
}
.cc-sitemap-slot {
    background: var(--rv-surface-1);
    border: 1px solid var(--rv-border);
    border-top: 3px solid var(--cc-slot-color, var(--rv-accent));
    border-radius: var(--rv-radius);
    padding: var(--rv-space-3);
}
.cc-sitemap-slot__label {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 var(--rv-space-1);
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--rv-text-muted);
}
.cc-sitemap-slot__dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--cc-slot-color, var(--rv-accent));
    box-shadow: 0 0 8px var(--cc-slot-color, var(--rv-accent));
}
.cc-sitemap-slot__title { margin: 0 0 var(--rv-space-2); font-size: 1.15rem; }
.cc-sitemap-slot ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.cc-sitemap-slot a { color: var(--rv-text); text-decoration: none; font-size: 0.95rem; }
.cc-sitemap-slot a:hover { color: var(--cc-slot-color, var(--rv-accent)); text-decoration: underline; }
.cc-sitemap-footnote { text-align: center; margin-top: var(--rv-space-4); color: var(--rv-text-muted); font-size: 0.9rem; }
.cc-sitemap-footnote a { color: var(--rv-accent); }

.cc-page-hero__lead { margin: 0 auto var(--rv-space-3); max-width: 680px; color: var(--rv-text-muted); font-size: 1.1rem; line-height: 1.6; }
.cc-page-hero__actions { display: flex; gap: var(--rv-space-2); justify-content: center; flex-wrap: wrap; align-items: center; }

.cc-page-breadcrumb { max-width: 1080px; margin: 0 auto; padding: var(--rv-space-2) var(--rv-space-3) 0; }

.cc-block { max-width: 780px; margin: 0 auto; padding: var(--rv-space-4) var(--rv-space-3); }
.cc-block--wide { max-width: 1080px; }
.cc-block--alt { background: var(--rv-surface-1); border-radius: var(--rv-radius); }
.cc-block h2 { font-size: clamp(1.4rem, 2.6vw, 1.9rem); margin: 0 0 var(--rv-space-2); }
.cc-block h3 { font-size: 1.15rem; margin: var(--rv-space-3) 0 6px; }
.cc-block p { color: var(--rv-text-muted); line-height: 1.65; margin: 0 0 var(--rv-space-2); }
.cc-block p:last-child { margin-bottom: 0; }
.cc-block strong { color: var(--rv-text); }
.cc-block ul, .cc-block ol { color: var(--rv-text-muted); line-height: 1.65; padding-left: 1.3em; margin: 0 0 var(--rv-space-2); }
.cc-block li { margin-bottom: 6px; }

.cc-shot {
    border: 1px dashed var(--rv-border);
    border-radius: var(--rv-radius);
    background: var(--rv-surface-1);
    padding: var(--rv-space-3);
    text-align: center;
    margin: var(--rv-space-3) 0;
}
.cc-shot__label { display: block; font-weight: 600; color: var(--rv-text); margin-bottom: 4px; }
.cc-shot__proves { display: block; color: var(--rv-text-muted); font-size: 0.9rem; }

.cc-related { max-width: 780px; margin: 0 auto; padding: 0 var(--rv-space-3) var(--rv-space-4); }
.cc-related__title { font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--rv-text-muted); margin: 0 0 var(--rv-space-2); }
.cc-related__links { display: flex; flex-wrap: wrap; gap: var(--rv-space-1) var(--rv-space-3); padding: 0; margin: 0; list-style: none; }
.cc-related__links a { color: var(--rv-accent); text-decoration: none; font-size: 0.95rem; }
.cc-related__links a:hover { color: var(--rv-accent-hover); text-decoration: underline; }

.cc-cta-band {
    max-width: 1080px;
    margin: var(--rv-space-4) auto;
    padding: var(--rv-space-4) var(--rv-space-3);
    text-align: center;
    background: var(--rv-surface-1);
    border-radius: var(--rv-radius);
    box-shadow: 0 0 0 1px var(--rv-border);
}
.cc-cta-band h2 { margin: 0 0 var(--rv-space-1); }
.cc-cta-band p { color: var(--rv-text-muted); margin: 0 0 var(--rv-space-3); }

.cc-lifecycle {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px var(--rv-space-2);
    max-width: 900px;
    margin: 0 auto var(--rv-space-2);
    font-size: 0.95rem;
    color: var(--rv-text-muted);
}

/* =========================================================================
   Base component styling: .cc-form-grid / .cc-field--full / .cc-details
   These classes are already used in markup (W-9 Generator, Loadouts) with
   zero corresponding rules anywhere in this stylesheet, which is the root
   cause of the "no spacing" complaint on those pages. Defining them here is
   purely additive (the selectors were previously inert) and fixes missing
   inter-field spacing everywhere they're already used, not just on W-9.
   ========================================================================= */
.cc-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--rv-space-3) var(--rv-space-2);
    align-items: start;
}
.cc-field--full { grid-column: 1 / -1; }
@media (max-width: 720px) {
    .cc-form-grid { grid-template-columns: 1fr; }
}

.cc-details { margin-top: var(--rv-space-2); }
.cc-details > summary:not(.cc-btn) {
    cursor: pointer;
    list-style: none;
    font-weight: 600;
    color: var(--rv-text);
    padding: 8px 10px;
    border-radius: 8px;
}
.cc-details > summary:not(.cc-btn)::-webkit-details-marker { display: none; }
.cc-details > summary:not(.cc-btn)::before {
    content: '\25B8';
    display: inline-block;
    width: 1em;
    margin-right: 6px;
    color: var(--rv-text-muted);
    transition: transform 0.15s ease;
}
.cc-details[open] > summary:not(.cc-btn)::before { transform: rotate(90deg); }
.cc-details > summary:not(.cc-btn):hover { background: var(--rv-surface-2); }
.cc-details > summary:not(.cc-btn):focus-visible {
    outline: 2px solid var(--rv-accent);
    outline-offset: 2px;
}
.cc-details > .cc-form-grid { margin-top: var(--rv-space-2); }

/* =========================================================================
   W-9 Generator page polish: bold Title Case field labels, italic sentence
   case help text, secure TIN entry box. Scoped to .cc-w9-page (set on the
   page's <main>) rather than applied globally - .cc-label and .cc-help are
   shared classes used across the whole app.
   ========================================================================= */
.cc-w9-page .cc-label { font-weight: 600; }
.cc-w9-page .cc-help,
.cc-w9-page .cc-toggle__meta { font-style: italic; }

.cc-secure-box {
    border: 1px solid color-mix(in srgb, var(--rv-success) 35%, var(--rv-border));
    background: color-mix(in srgb, var(--rv-success) 7%, transparent);
    border-radius: var(--rv-radius);
    padding: var(--rv-space-2) var(--rv-space-3) var(--rv-space-3);
}
.cc-secure-box__header {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: var(--rv-space-2);
}
.cc-secure-box__icon {
    flex: none;
    margin-top: 3px;
    color: var(--rv-success);
}
.cc-secure-badge {
    display: inline-flex;
    align-items: center;
    font-size: 0.68rem;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--rv-success);
    background: color-mix(in srgb, var(--rv-success) 16%, transparent);
    border: 1px solid color-mix(in srgb, var(--rv-success) 45%, transparent);
    border-radius: 999px;
    padding: 2px 8px;
    margin-left: 8px;
    vertical-align: middle;
}
.cc-secure-box .cc-form-grid { margin-top: 0; }

.cc-tin-input-wrap { position: relative; display: flex; }
.cc-tin-input-wrap .cc-input {
    padding-right: 44px;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    letter-spacing: 0.06em;
}
.cc-tin-toggle {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: var(--rv-text-muted);
    cursor: pointer;
    border-radius: 6px;
}
.cc-tin-toggle:hover { color: var(--rv-text); background: var(--rv-surface-2); }
.cc-tin-toggle:focus-visible {
    outline: 2px solid var(--rv-accent);
    outline-offset: 2px;
}

/* Generate & Download: visually disabled but never natively `disabled` while
   the page is available, so a click while the form is invalid can still be
   intercepted and used to jump to the first invalid field. */
.cc-btn[aria-disabled="true"] {
    opacity: 0.5;
    cursor: not-allowed;
}
.cc-lifecycle strong { color: var(--rv-text); }

/* =========================================================================
   Mobile & Responsive UI Standards (RigVault brief, 2026-09-15)
   Locked breakpoint tiers, touch-target sizing, and table-to-card
   conversion. See rigvault-mobile-responsive-ui-standards-brief-2026-09-15.md
   ========================================================================= */

/* --- Touch targets: pointer:coarse (any width) + everything below 1280px,
   per the brief's own rule ("applies under pointer:coarse regardless of
   viewport width, and as the default at any width below 1280px"). --- */
@media (pointer: coarse), (max-width: 1279px) {
    .cc-row-actions__btn {
        width: 44px;
        height: 44px;
    }
    .cc-icon-btn {
        min-width: 44px;
        min-height: 44px;
        padding: 10px;
    }
    .cc-btn--icon {
        width: 44px;
        height: 44px;
    }
    .cc-btn {
        min-height: 44px;
    }
    .cc-sidebar__link {
        min-height: 48px;
    }
    .cc-mobile-nav a,
    .cc-mobile-nav button {
        min-height: 48px;
    }
}

/* Visible pressed/active state on every tap target: :hover never fires on
   touch, so a tap target with only a hover rule gives no confirmation a tap
   registered. Every primary control gets its own :active treatment. */
.cc-row-actions__btn:active,
.cc-icon-btn:active,
.cc-btn:active,
.cc-sidebar__link:active,
.cc-mobile-nav a:active,
.cc-mobile-nav button:active {
    background: var(--rv-surface-2);
    transform: scale(0.97);
}
.cc-btn--primary:active { background: var(--rv-accent-hover); }

/* --- Key-value panels (.cc-kv): stack label/value below 600px instead of
   the fixed 140px-label two-column grid, which clips long values (a
   Loadout's Load In / Show Time datetimes, confirmed live) on a phone
   viewport. Fixes every .cc-kv panel app-wide in one place (Asset's Core
   Identity panel, Loadout's Event panel, etc.), not a per-page patch. --- */
@media (max-width: 900px) {
    .cc-kv div {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

/* --- Table-to-card conversion, below 900px: every .cc-table becomes a
   stacked card list instead of a horizontally-scrolling table. Horizontal
   scroll on a data table is treated as never acceptable on this product.
   Degrades gracefully on a .cc-table with no data-label/data-col markup
   (e.g. the Loadout Requirements tables): no label prefixes render, but it
   still stacks instead of scrolling. --- */
@media (max-width: 900px) {
    .cc-table-wrap {
        overflow-x: visible;
        border: none;
        background: transparent;
    }
    .cc-table {
        display: block;
        width: 100%;
    }
    .cc-table thead {
        display: none;
    }
    .cc-table tbody {
        display: block;
    }
    .cc-table tr {
        display: block;
        background: var(--rv-surface-1);
        border: 1px solid var(--rv-border);
        border-radius: var(--rv-radius);
        margin-bottom: 12px;
        padding: 4px 0;
    }
    .cc-table tr:last-child {
        margin-bottom: 0;
    }
    .cc-table td {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        width: auto;
        min-height: 48px;
        padding: 8px 14px;
        border-bottom: 1px solid var(--rv-border);
        text-align: right;
        white-space: normal;
    }
    .cc-table td:last-child {
        border-bottom: none;
    }
    .cc-table td[data-label]::before {
        content: attr(data-label);
        font-size: 0.75rem;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: var(--rv-text-muted);
        flex-shrink: 0;
    }
    /* The identity cell (single combined thumb+name, e.g. Assets) leads
       each card: no label prefix, left-aligned, larger tap target. */
    .cc-table td[data-col="identity"] {
        justify-content: flex-start;
        min-height: 56px;
        padding: 14px 14px 8px;
        text-align: left;
    }
    /* Entities whose ID and Name are separate cells (Cases, Loadouts,
       Rigs): merge them into one visual card-header block, ID small and
       muted above Name, no border between the two. */
    .cc-table td[data-col="identity-id"] {
        justify-content: flex-start;
        padding: 10px 14px 0;
        border-bottom: none;
        min-height: 0;
        text-align: left;
    }
    .cc-table td[data-col="identity-id"] code {
        font-size: 0.75rem;
        color: var(--rv-text-muted);
    }
    .cc-table td[data-col="identity-name"] {
        justify-content: flex-start;
        padding: 2px 14px 10px;
        min-height: 0;
        text-align: left;
    }
    /* Row actions stay visible, right-aligned, icons only, no label. */
    .cc-table td[data-col="actions"] {
        justify-content: flex-end;
    }
    /* Columns explicitly dropped from the mobile card: still a tap away on
       the detail page, per this brief's own rule, not lost data. */
    .cc-table td[data-col-hide-mobile] {
        display: none;
    }
    /* Whole card is the tap target. The identity link stretches over the
       card; row actions stay above it so Edit/Archive still work. */
    .cc-table tbody tr {
        position: relative;
    }
    .cc-table td[data-col="identity"] a::after,
    .cc-table td[data-col="identity-id"] a::after,
    .cc-table td[data-col="identity-name"] a::after,
    .cc-table td[data-col="identity"] .cc-table-title-btn::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 1;
    }
    .cc-table td[data-col="actions"],
    .cc-table td[data-col="actions"] a,
    .cc-table td[data-col="actions"] button,
    .cc-table td[data-col="actions"] summary {
        position: relative;
        z-index: 2;
    }
}

.cc-sparkline {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    margin: var(--rv-space-3) 0;
}
.cc-checklist-item__fields {
    padding: 0 var(--rv-space-3) var(--rv-space-2);
}
