@font-face {
  font-family: "D-DIN";
  src: url("/site/assets/fonts/D-DIN.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "D-DIN";
  src: url("/site/assets/fonts/D-DIN-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "D-DIN Condensed";
  src: url("/site/assets/fonts/D-DINCondensed.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "D-DIN Condensed";
  src: url("/site/assets/fonts/D-DINCondensed-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

:root,
[data-cms-theme] {
  --font-body: "D-DIN", system-ui, sans-serif;
  --font-display: "D-DIN", system-ui, sans-serif;
  --font-condensed: "D-DIN Condensed", "Arial Narrow", sans-serif;
  --cms-root-font-size: 16.85px;
  --cms-color-canvas: #080807;
  --cms-color-sidebar: #080807;
  --cms-color-surface: #15130f;
  --cms-color-surface-alt: #11100d;
  --cms-color-surface-raised: #1d1a15;
  --cms-color-field: #0d0c0b;
  --cms-color-text: #f0ede7;
  --cms-color-muted: #b8afa5;
  --cms-color-faint: #81786f;
  --cms-color-border: #312d27;
  --cms-color-border-strong: #4b4338;
  --cms-color-accent: #c85c3e;
  --cms-color-accent-hover: #df7656;
  --cms-color-accent-soft: rgba(200, 92, 62, .1);
  --cms-color-success: #64bb7b;
  --cms-color-danger: #d76055;
  --cms-color-danger-soft: rgba(215, 96, 85, .09);
  --cms-shadow-panel: 0 1.5rem 4rem rgba(0, 0, 0, .5);
  --cms-sidebar-width: 14.5rem;
  --cms-topbar-height: 3.25rem;
  --cms-content-width: 84rem;
  --cms-control-height: 2.65rem;
  --cms-radius-sm: .12rem;
  --cms-radius-md: .2rem;
  --cms-bg-page: linear-gradient(180deg, rgba(255, 255, 255, .012), transparent 18rem), var(--cms-color-canvas);
  --cms-bg-sidebar: linear-gradient(180deg, rgba(255, 255, 255, .012), rgba(255, 255, 255, 0) 12rem), var(--cms-color-sidebar);
  --cms-bg-toolbar: rgba(10, 10, 9, .9);
  --cms-bg-panel: color-mix(in srgb, var(--cms-color-surface-alt) 78%, #1b1712);
  --cms-surface-gradient:
    linear-gradient(135deg, rgba(255, 255, 255, .018), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, .01), rgba(255, 255, 255, 0) 8rem),
    color-mix(in srgb, var(--cms-color-surface-alt) 90%, #1a1712);
  --cms-dashboard-card-bg: var(--cms-surface-gradient);
  --cms-bg-field-focus: #12110f;
  --cms-bg-field-hover: rgba(255, 255, 255, .035);
  --cms-bg-hover-subtle: rgba(255, 255, 255, .022);
  --cms-bg-hover: rgba(255, 255, 255, .025);
  --cms-bg-hover-medium: rgba(255, 255, 255, .04);
  --cms-bg-hover-strong: rgba(255, 255, 255, .05);
  --cms-bg-active: rgba(255, 255, 255, .05);
  --cms-bg-control: rgba(255, 255, 255, .015);
  --cms-bg-control-hover: rgba(255, 255, 255, .05);
  --cms-sidebar-text: var(--cms-color-text);
  --cms-sidebar-muted: var(--cms-color-muted);
  --cms-sidebar-faint: var(--cms-color-faint);
  --cms-sidebar-label: var(--cms-color-faint);
  --cms-sidebar-brand-accent: var(--cms-color-accent);
  --cms-sidebar-hover-bg: var(--cms-bg-hover-medium);
  --cms-sidebar-active-bg: var(--cms-color-accent-soft);
  --cms-sidebar-active-text: var(--cms-color-accent-hover);
  --cms-sidebar-active-indicator: var(--cms-color-accent);
  --cms-bg-danger-hover: rgba(215, 96, 85, .08);
  --cms-bg-action-footer: rgba(13, 13, 12, .9);
  --cms-border-sidebar: var(--cms-color-border);
  --cms-border-subtle: var(--cms-color-border);
  --cms-border-control: var(--cms-color-border-strong);
  --cms-border-control-hover: #5a5148;
  --cms-focus-ring: 0 0 0 2px rgba(207, 95, 64, .14);
  --cms-shadow-footer: 0 -1rem 2rem rgba(0, 0, 0, .32);
  --cms-shadow-accent-action: none;
  --cms-attention-border: rgba(207, 95, 64, .44);
  --cms-attention-bg: rgba(207, 95, 64, .08);
  --cms-attention-chip-border: rgba(207, 95, 64, .42);
  --cms-attention-chip-bg: rgba(0, 0, 0, .12);
  --cms-dashboard-eyebrow-color: var(--cms-color-muted);
  --cms-section-title-color: var(--cms-color-text);
  --cms-color-on-accent: #fff8f2;
  --cms-content-padding-top: 1.75rem;
  --cms-page-header-margin-bottom: 1.55rem;
  --cms-dashboard-gap: 1.05rem;
  --cms-dashboard-row-min-height: 3.35rem;
  --cms-dashboard-row-padding: .64rem 1.15rem;
  --cms-dashboard-side-row-min-height: 2.8rem;
  --cms-dashboard-side-row-padding: .48rem .7rem;
  --cms-next-row-min-height: 4.15rem;
  --cms-next-row-columns: 4.35rem minmax(0, 1fr) auto;
  --cms-next-row-padding: .68rem 1.15rem;
  --cms-form-section-title-padding: 1.05rem 1.25rem .45rem;
  --cms-form-section-title-letter-spacing: .22em;
  --cms-form-grid-gap: 1.2rem 1.35rem;
  --cms-form-grid-padding: .7rem 1.25rem 1.25rem;
  --cms-heading-font-weight: 700;
  --cms-heading-letter-spacing: -.025em;
  --cms-page-intro-max-width: 46rem;
  --cms-eyebrow-letter-spacing: .16em;
  --cms-sidebar-nav-padding: clamp(.38rem, .9vh, .7rem) .8rem clamp(.65rem, 1.2vh, 1rem);
  --cms-nav-section-gap: clamp(.5rem, 1.8vh, 1.35rem);
  --cms-nav-link-gap: 0;
  --cms-nav-label-margin: clamp(.03rem, .22vh, .18rem) .78rem clamp(.14rem, .35vh, .34rem);
  --cms-nav-link-min-height: clamp(1.7rem, 3.2vh, 2.4rem);
  --cms-nav-link-font-size: 0.9rem;
  --cms-nav-link-radius: var(--cms-radius-sm);
  --cms-nav-indicator-left: 0;
  --cms-nav-indicator-width: 2px;
  --cms-nav-indicator-height: 1.25rem;
  --cms-nav-indicator-radius: 0;
  --cms-avatar-border-color: var(--cms-color-border-strong);
  --cms-avatar-bg: var(--cms-color-surface);
  --cms-collection-title-font-weight: 700;
  --cms-field-label-color: #e4ded6;
}

[data-cms-theme="light"] {
  color-scheme: light;
  --cms-color-canvas: #f9f9f8;
  --cms-color-sidebar: #1e1a17;
  --cms-color-surface: #ffffff;
  --cms-color-surface-alt: #f2f1ef;
  --cms-color-surface-raised: #ffffff;
  --cms-color-field: #ffffff;
  --cms-color-text: #1d1a17;
  --cms-color-muted: #66625d;
  --cms-color-faint: #8a847d;
  --cms-color-border: #e4e1dd;
  --cms-color-border-strong: #c4beb7;
  --cms-color-accent: #b64f34;
  --cms-color-accent-hover: #9f412b;
  --cms-color-accent-soft: rgba(182, 79, 52, .1);
  --cms-color-success: #2f6a36;
  --cms-color-danger: #b64037;
  --cms-color-danger-soft: rgba(182, 64, 55, .08);
  --cms-shadow-panel: 0 1.2rem 3rem rgba(50, 34, 27, .1);
  --cms-shadow-1: 0 1px 2px rgba(50, 34, 27, .04), 0 4px 14px rgba(50, 34, 27, .05);
  --cms-bg-page: linear-gradient(180deg, rgba(182, 79, 52, .018), transparent 18rem), var(--cms-color-canvas);
  --cms-bg-sidebar: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(20, 18, 16, .08) 56%, rgba(20, 18, 16, .14)), var(--cms-color-sidebar);
  --cms-bg-toolbar: rgba(251, 250, 248, .94);
  --cms-bg-panel: var(--cms-color-surface-alt);
  --cms-surface-gradient:
    linear-gradient(135deg, rgba(182, 79, 52, .025), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, .45), rgba(255, 255, 255, 0) 8rem),
    var(--cms-color-surface-alt);
  --cms-dashboard-card-bg: var(--cms-surface-gradient);
  --cms-form-section-bg: var(--cms-surface-gradient);
  --cms-aside-panel-bg: var(--cms-form-section-bg);
  --cms-bg-field-focus: #ffffff;
  --cms-bg-field-hover: rgba(182, 79, 52, .035);
  --cms-bg-hover-subtle: rgba(182, 79, 52, .025);
  --cms-bg-hover: rgba(182, 79, 52, .04);
  --cms-bg-hover-medium: rgba(182, 79, 52, .06);
  --cms-bg-hover-strong: rgba(182, 79, 52, .085);
  --cms-bg-active: rgba(182, 79, 52, .08);
  --cms-bg-control: rgba(182, 79, 52, .018);
  --cms-bg-control-hover: rgba(182, 79, 52, .065);
  --cms-sidebar-text: #f6f5f3;
  --cms-sidebar-muted: #cbc8c4;
  --cms-sidebar-faint: #948f8a;
  --cms-sidebar-label: #a29d98;
  --cms-sidebar-brand-accent: #df7656;
  --cms-sidebar-hover-bg: rgba(255, 255, 255, .075);
  --cms-sidebar-active-bg: rgba(200, 92, 62, .18);
  --cms-sidebar-active-text: #fff8f2;
  --cms-sidebar-active-indicator: #df7656;
  --cms-bg-danger-hover: var(--cms-color-danger-soft);
  --cms-bg-action-footer: rgba(251, 250, 248, .94);
  --cms-border-sidebar: rgba(255, 255, 255, .1);
  --cms-border-subtle: rgba(33, 23, 19, .1);
  --cms-border-control: rgba(33, 23, 19, .16);
  --cms-border-control-hover: rgba(33, 23, 19, .28);
  --cms-focus-ring: 0 0 0 2px rgba(182, 79, 52, .14);
  --cms-shadow-footer: 0 -1rem 2rem rgba(50, 34, 27, .06);
  --cms-shadow-accent-action: 0 .45rem 1.1rem rgba(182, 79, 52, .12);
  --cms-attention-border: rgba(182, 64, 55, .32);
  --cms-attention-bg: rgba(182, 64, 55, .07);
  --cms-attention-chip-border: rgba(182, 64, 55, .28);
  --cms-attention-chip-bg: rgba(255, 255, 255, .6);
  --cms-color-on-accent: #fff8f2;
  --cms-avatar-border-color: var(--cms-color-border-strong);
  --cms-avatar-bg: var(--cms-color-surface);
  --cms-field-label-color: #3a2b24;
}

@media (prefers-color-scheme: light) {
  [data-cms-theme="system"] {
    color-scheme: light;
    --cms-color-canvas: #f9f9f8;
    --cms-color-sidebar: #1e1a17;
    --cms-color-surface: #ffffff;
    --cms-color-surface-alt: #f2f1ef;
    --cms-color-surface-raised: #ffffff;
    --cms-color-field: #ffffff;
    --cms-color-text: #1d1a17;
    --cms-color-muted: #66625d;
    --cms-color-faint: #8a847d;
    --cms-color-border: #e4e1dd;
    --cms-color-border-strong: #c4beb7;
    --cms-color-accent: #b64f34;
    --cms-color-accent-hover: #9f412b;
    --cms-color-accent-soft: rgba(182, 79, 52, .1);
    --cms-color-success: #2f6a36;
    --cms-color-danger: #b64037;
    --cms-color-danger-soft: rgba(182, 64, 55, .08);
    --cms-shadow-panel: 0 1.2rem 3rem rgba(50, 34, 27, .1);
    --cms-shadow-1: 0 1px 2px rgba(50, 34, 27, .04), 0 4px 14px rgba(50, 34, 27, .05);
    --cms-bg-page: linear-gradient(180deg, rgba(182, 79, 52, .018), transparent 18rem), var(--cms-color-canvas);
    --cms-bg-sidebar: linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(20, 18, 16, .08) 56%, rgba(20, 18, 16, .14)), var(--cms-color-sidebar);
    --cms-bg-toolbar: rgba(251, 250, 248, .94);
    --cms-bg-panel: var(--cms-color-surface-alt);
    --cms-surface-gradient:
      linear-gradient(135deg, rgba(182, 79, 52, .025), transparent 34%),
      linear-gradient(180deg, rgba(255, 255, 255, .45), rgba(255, 255, 255, 0) 8rem),
      var(--cms-color-surface-alt);
    --cms-dashboard-card-bg: var(--cms-surface-gradient);
    --cms-form-section-bg: var(--cms-surface-gradient);
    --cms-aside-panel-bg: var(--cms-form-section-bg);
    --cms-bg-field-focus: #ffffff;
    --cms-bg-field-hover: rgba(182, 79, 52, .035);
    --cms-bg-hover-subtle: rgba(182, 79, 52, .025);
    --cms-bg-hover: rgba(182, 79, 52, .04);
    --cms-bg-hover-medium: rgba(182, 79, 52, .06);
    --cms-bg-hover-strong: rgba(182, 79, 52, .085);
    --cms-bg-active: rgba(182, 79, 52, .08);
    --cms-bg-control: rgba(182, 79, 52, .018);
    --cms-bg-control-hover: rgba(182, 79, 52, .065);
    --cms-sidebar-text: #f6f5f3;
    --cms-sidebar-muted: #cbc8c4;
    --cms-sidebar-faint: #948f8a;
    --cms-sidebar-label: #a29d98;
    --cms-sidebar-brand-accent: #df7656;
    --cms-sidebar-hover-bg: rgba(255, 255, 255, .075);
    --cms-sidebar-active-bg: rgba(200, 92, 62, .18);
    --cms-sidebar-active-text: #fff8f2;
    --cms-sidebar-active-indicator: #df7656;
    --cms-bg-danger-hover: var(--cms-color-danger-soft);
    --cms-bg-action-footer: rgba(251, 250, 248, .94);
    --cms-border-sidebar: rgba(255, 255, 255, .1);
    --cms-border-subtle: rgba(33, 23, 19, .1);
    --cms-border-control: rgba(33, 23, 19, .16);
    --cms-border-control-hover: rgba(33, 23, 19, .28);
    --cms-focus-ring: 0 0 0 2px rgba(182, 79, 52, .14);
    --cms-shadow-footer: 0 -1rem 2rem rgba(50, 34, 27, .06);
    --cms-shadow-accent-action: 0 .45rem 1.1rem rgba(182, 79, 52, .12);
    --cms-attention-border: rgba(182, 64, 55, .32);
    --cms-attention-bg: rgba(182, 64, 55, .07);
    --cms-attention-chip-border: rgba(182, 64, 55, .28);
    --cms-attention-chip-bg: rgba(255, 255, 255, .6);
    --cms-color-on-accent: #fff8f2;
    --cms-avatar-border-color: var(--cms-color-border-strong);
    --cms-avatar-bg: var(--cms-color-surface);
    --cms-field-label-color: #3a2b24;
  }
}

.auth-shell {
  position: relative; isolation: isolate; overflow: hidden;
  background:
    radial-gradient(circle at 18% 18%, rgba(207, 95, 64, .07), transparent 23rem),
    radial-gradient(circle at 88% 82%, rgba(240, 237, 231, .032), transparent 19rem),
    var(--cms-color-canvas);
}
.auth-shell::before, .auth-shell::after {
  content: ""; position: absolute; z-index: 0; pointer-events: none;
}
.auth-shell::before {
  inset: 5vh 7vw; border: 1px solid rgba(240, 237, 231, .04);
  transform: rotate(-2deg);
}
.auth-shell::after {
  width: 34rem; height: 34rem; right: -17rem; bottom: -20rem;
  border: 1px solid rgba(207, 95, 64, .1); border-radius: 50%;
  box-shadow: 0 0 0 5rem rgba(207, 95, 64, .012), 0 0 0 10rem rgba(207, 95, 64, .008);
}
.login-panel {
  position: relative; z-index: 1; isolation: isolate; overflow: hidden;
  padding: clamp(2rem, 6vw, 3.4rem);
  border-color: rgba(240, 237, 231, .14);
  border-top: 2px solid var(--cms-color-accent);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .025), transparent 42%),
    rgba(18, 17, 15, .94);
  box-shadow: 0 2rem 6rem rgba(0, 0, 0, .48);
  animation: login-arrive 520ms ease-out both;
}
.login-panel__watermark {
  position: absolute; z-index: 0; right: -1.8rem; top: -5.8rem;
  color: rgba(207, 95, 64, .038); font-family: var(--font-display);
  font-size: var(--cms-font-size-watermark); font-weight: 700; line-height: 1; pointer-events: none;
}
.login-panel > :not(.login-panel__watermark) { position: relative; z-index: 1; }
.login-panel__top {
  padding-bottom: 1rem; border-bottom: 1px solid rgba(240, 237, 231, .08);
}
.login-status { display: inline-flex; align-items: center; gap: .45rem; color: var(--cms-color-faint); }
.login-status::before {
  content: ""; width: .35rem; height: .35rem; border-radius: 50%; background: var(--cms-color-accent);
  box-shadow: 0 0 0 .22rem rgba(207, 95, 64, .1);
}
.login-panel__intro { max-width: 23rem; margin-bottom: 1.8rem; }
.login-panel__intro .eyebrow { margin-bottom: .75rem; }
.login-panel h1 { margin-bottom: .65rem; line-height: .98; }
.login-intro { margin-bottom: 0; color: var(--cms-color-muted); line-height: 1.55; }
.login-form { gap: 1.15rem; }
.login-panel .field > label {
  margin-bottom: .4rem; color: var(--cms-color-muted); font-family: var(--font-condensed);
  font-size: var(--cms-font-size-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
}
.login-panel input[type="text"], .login-panel input[type="password"] {
  min-height: 3.45rem; padding: .8rem .95rem; border-color: rgba(240, 237, 231, .18);
  background: rgba(12, 9, 7, .48);
}
.login-panel input[type="text"]:hover, .login-panel input[type="password"]:hover {
  border-color: rgba(240, 237, 231, .3);
}
.login-panel input[type="text"]:focus, .login-panel input[type="password"]:focus {
  border-color: var(--cms-color-accent); background: rgba(12, 9, 7, .75);
  box-shadow: 0 0 0 3px rgba(207, 95, 64, .13);
}
.login-panel .button--primary {
  min-height: 3.45rem; margin-top: .35rem; letter-spacing: .02em;
  box-shadow: 0 .75rem 1.8rem rgba(207, 95, 64, .12);
}
.login-panel .button--primary:hover { transform: translateY(-1px); }
.login-back { font-family: var(--font-condensed); letter-spacing: .04em; }
.login-back a:hover { color: var(--cms-color-accent); }

@keyframes login-arrive {
  from { opacity: 0; transform: translateY(.65rem); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 34rem) {
  .auth-shell { padding: 1rem; }
  .auth-shell::before { inset: .5rem; }
}

@media (prefers-reduced-motion: reduce) {
  .login-panel { animation: none; }
}
