
:root {
    color-scheme: light dark;
    --canvas: light-dark(#f5f4f1, #080808);
    --surface: light-dark(rgb(255 255 255 / 70%), rgb(18 18 18 / 64%));
    --surface-quiet: light-dark(rgb(255 255 255 / 46%), rgb(10 10 10 / 44%));
    --surface-raised: light-dark(rgb(231 229 224 / 80%), rgb(30 30 30 / 76%));
    --surface-overlay: light-dark(rgb(253 252 250 / 97%), rgb(17 17 17 / 96%));
    --control: light-dark(rgb(238 236 231 / 78%), rgb(24 24 24 / 72%));
    --control-hover: light-dark(rgb(222 219 212 / 88%), rgb(34 34 34 / 86%));
    --control-edge: light-dark(rgb(34 30 23 / 15%), rgb(255 255 255 / 10%));
    --control-edge-hover: light-dark(#888177, #5b5b5b);
    --edge: light-dark(rgb(34 30 23 / 16%), rgb(255 255 255 / 12%));
    --edge-hover: light-dark(rgb(34 30 23 / 32%), rgb(255 255 255 / 25%));
    --ink: light-dark(#242320, #f0efed);
    --copy: light-dark(#53514b, #c5c3c0);
    --quiet: light-dark(#68655e, #a3a19e);
    --brand: light-dark(#34312b, #d8d6d2);
    --brand-hover: light-dark(#151411, #f0efed);
    --focus: light-dark(#5d5140, #d8d6d2);
    --accent-soft: light-dark(rgb(65 56 41 / 7%), rgb(216 214 210 / 8%));
    --button-hover-edge: light-dark(#786c59, #aaa7a1);
    --danger-ink: light-dark(#8d3434, #ecb6b3);
    --danger-surface: light-dark(#f7e6e3, #302020);
    --danger-edge: light-dark(#bd8a82, #694744);
    --danger-hover-ink: light-dark(#772929, #f0c0bd);
    --danger-hover-surface: light-dark(#efd6d1, #3c2727);
    --danger-hover-edge: light-dark(#a56c62, #a16969);
    --site-danger: light-dark(#9b4045, #c87d8a);
    --site-danger-strong: light-dark(#8d3434, #e2a8b1);
    --site-danger-soft: light-dark(rgb(155 64 69 / 9%), rgba(200, 125, 138, .1));
    --site-warning: light-dark(#825b16, #eabf65);
    --danger: light-dark(#9b4045, #c87d8a);
    --plain-danger: var(--danger);
    --glass-shadow: 0 12px 32px light-dark(rgb(63 52 30 / 10%), rgb(0 0 0 / 18%));
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }
html body:is(.view-public, .view-login, .view-register, .dashboard-body) { color: var(--ink); color-scheme: inherit; }
html body:is(.view-public, .view-login, .view-register, .dashboard-body) :is(input, select, textarea) { color-scheme: inherit; }

body .site-backdrop, body.view-home .site-backdrop {
    background: radial-gradient(ellipse at 12% 22%, light-dark(rgb(130 114 85 / 4%), rgb(255 255 255 / 2.5%)), transparent 55%),
        linear-gradient(160deg, light-dark(#f8f7f4, #0b0b0b), var(--canvas) 60%);
}
body .site-backdrop::after {
    background: radial-gradient(ellipse at 50% 35%, light-dark(rgb(245 244 241 / 38%), rgb(8 8 8 / 38%)), transparent 65%),
        linear-gradient(180deg, light-dark(rgb(245 244 241 / 18%), rgb(8 8 8 / 18%)), transparent 25%, transparent 75%, light-dark(rgb(245 244 241 / 35%), rgb(8 8 8 / 35%)));
}
html[data-theme="light"] body .site-backdrop::before,
html[data-theme="light"] body .site-dot-field { filter: invert(1); }
html[data-theme="light"] body :is(.site-brand, .brand, .portal-brand, .portal-mobile-brand, .wyvern-brand) img,
html[data-theme="light"] .wyvern-hero-mark { filter: brightness(0) opacity(.85); }
html[data-theme="light"] body.view-home .wyvern-hero h1 { text-shadow: none; }
html[data-theme="light"] body.view-public .loader-surface { box-shadow: var(--glass-shadow); }
@media (prefers-color-scheme: light) {
    html:not([data-theme]) body .site-backdrop::before { filter: invert(1); }
    html:not([data-theme]) body :is(.site-brand, .brand, .portal-brand, .portal-mobile-brand, .wyvern-brand) img,
    html:not([data-theme]) .wyvern-hero-mark { filter: brightness(0) opacity(.85); }
}


html body .theme-switch {
    position: relative; display: inline-flex; flex: 0 0 56px; align-self: center;
    width: 56px; height: 36px; min-height: 36px; padding: 0; box-sizing: border-box;
    color: var(--quiet); background: var(--control); border: 2px solid transparent; border-radius: 999px;
    cursor: pointer; box-shadow: none; transition: background-color 140ms ease, border-color 140ms ease;
}
html body .theme-switch::before {
    content: ""; position: absolute; left: 5px; top: 50%; width: 22px; height: 22px;
    border-radius: 50%; background: var(--ink); transform: translateY(-50%);
    transition: transform 160ms ease;
}
html body .theme-switch[aria-checked="true"]::before { transform: translate(20px, -50%); }
.theme-switch svg { position: absolute; top: 50%; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; transform: translateY(-50%); pointer-events: none; }
.theme-switch .theme-sun { left: 8px; }
.theme-switch .theme-moon { right: 8px; }
.theme-switch[aria-checked="false"] .theme-sun, .theme-switch[aria-checked="true"] .theme-moon { color: var(--canvas); }
@media (hover: hover) { html body .theme-switch:hover { background: var(--control-hover); border-color: var(--control-edge-hover); } }
html body .theme-switch:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
@media (max-width: 720px) { html body .theme-switch { height: 44px; } }
@media (max-width: 620px) { body.view-public .site-account { gap: 8px; } }
@media (max-width: 420px) { .dashboard-body .portal-mobile-brand span { display: none; } }
@media (max-width: 360px) { body.view-public .site-brand span { display: none; } }
@media (prefers-reduced-motion: reduce) { html body .theme-switch::before { transition: none; } }
@media (forced-colors: active) { html body .theme-switch { border-color: ButtonText; } html body .theme-switch::before { background: ButtonText; } }


body.view-public :is(.docs-guide-body, .docs-sidebar-support a, .docs-code-toolbar button) { color: var(--copy); }
body.view-public :is(.docs-guide-body h2, .docs-guide-body h3, .docs-guide-body a,
    .docs-guide-body pre, .docs-guide-body code, .docs-guide-body summary, .docs-fixes dt,
    .docs-sidebar nav a[aria-current]) { color: var(--ink); }
body.view-public :is(.docs-sidebar-label, .docs-sidebar-support, .docs-code-toolbar, .docs-sidebar nav a) { color: var(--quiet); }
body.view-public .docs-sidebar nav a:is(:hover, [aria-current]) { color: var(--ink); background: var(--control); }
body.view-public .docs-code-toolbar button { background: var(--control); }
body.view-public .docs-code-toolbar { border-color: var(--control-edge); }
body.view-public :is(.docs-sidebar-support, .legal-navigation) { border-color: var(--control-edge); }

body.view-apply :is(.apply-eyebrow, .apply-heading > p:not(.apply-eyebrow), .apply-intro-meta,
    .apply-sidebar-note, .apply-sidebar-note small, .apply-card-progress, .apply-step-intro,
    .apply-field small, .apply-input-prefix > span, .apply-check, .apply-upload span,
    .apply-image-preview figcaption, .apply-footnote, .apply-actions > span, .apply-review dt,
    .apply-contact-notice, .apply-upload-status, .apply-success > p:not(.apply-eyebrow)) { color: var(--quiet); }
body.view-apply :is(.apply-field > span, .apply-sidebar-note strong, .apply-upload strong,
    .apply-review dd, .apply-contact-notice strong, .apply-reference code),
body.view-apply .apply-intro-meta span::before { color: var(--ink); }
body.view-apply .apply-steps li { color: var(--quiet); border-color: var(--control-edge); }
body.view-apply .apply-field :is(input, textarea)::placeholder { color: var(--quiet); }
body.view-apply .apply-steps li:is([aria-current], .is-complete) { color: var(--ink); }
body.view-apply .apply-steps li[aria-current] > span { background: var(--brand); color: var(--canvas); border-color: var(--brand); }
body.view-apply :is(.apply-check, .apply-choices) input { accent-color: var(--brand); }
body.view-apply .apply-choices label:has(input:checked) { border-color: var(--control-edge-hover); }
body.view-apply .apply-error { color: var(--danger-ink); background: var(--danger-surface); border-color: var(--danger-edge); }
body.view-apply .apply-card-progress progress { background: var(--control-hover); accent-color: var(--brand); }
body.view-apply .apply-card-progress progress::-webkit-progress-bar { background: var(--control-hover); }
body.view-apply .apply-card-progress progress::-webkit-progress-value { background: var(--brand); }
body.view-apply .apply-card-progress progress::-moz-progress-bar { background: var(--brand); }

.dashboard-body :is(.application-admin-toolbar, .application-admin-message, .application-admin-pagination,
    .application-detail-header p, .application-detail-fields dt, .application-detail-fields .application-copy,
    .application-image-grid figcaption, .application-notes) { color: var(--quiet); }
.dashboard-body .application-inbox-item { color: var(--ink); background: var(--control); border-color: var(--control-edge); }
.dashboard-body .application-inbox-item:is(:hover, :focus-visible) { background: var(--control-hover); border-color: var(--control-edge-hover); }
.dashboard-body :is(.application-inbox-item small, .application-admin-hint) { color: var(--copy); }
.dashboard-body .application-admin-hint { background: var(--surface-quiet); }
.dashboard-body :is(.application-detail-fields dd, .application-detail-fields a, .application-detail-images h4, .application-image-grid a) { color: var(--ink); }
.dashboard-body .application-admin-message.is-error { color: var(--danger-ink); }

body.view-public {
    --store-accent: light-dark(#906329, #e3c587);
    --store-accent-hover: light-dark(#795221, #f0d59b);
    --store-accent-ink: light-dark(#fffdf8, #211b11);
}
body.view-public :is(.store-stock.is-in-stock, .loader-menu-badge.is-in-stock,
    .store-detail-price strong, .store-status-license strong, .store-license-instructions code,
    .store-checkout-summary .is-total dt, .store-checkout-summary .is-total dd) { color: light-dark(#25653b, #b2f0c6); }
body.view-public :is(.store-stock.is-low-stock, .loader-menu-badge.is-low-stock) { color: light-dark(#825b16, #e3c587); }
body.view-public :is(.store-stock.is-sold-out, .loader-menu-badge.is-sold-out) { color: light-dark(#8c4545, #c4a8a8); }
body.view-public :is(.store-account-license code, .store-gallery-dialog) { background: var(--surface-overlay); }
body.view-public :is(.store-gallery-stage, .store-gallery-fullscreen, .store-gallery-thumb img) { background: var(--surface-quiet); }
body.view-public .store-gallery-expand { color: var(--ink); background: var(--surface-overlay); }
body.view-public :is(.store-checkout-error, .store-status-error, .store-status-canceled) { color: var(--danger-ink); background: var(--danger-surface); border-color: var(--danger-edge); }
html[data-theme="light"] .store-stars { --star-color: #94600d; }
