/* Dispatch house tray — Scoopy gold rails (logo #BA9B22) · dark brown icons · Arrt green hover · paper #F5F2EB */

body.dd-shell.theme-slate {
  --scoopy-gold: #ba9b22;
  --scoopy-gold-deep: #9a7f1c;
  --scoopy-ink: #38322e;
  --scoopy-ink-deep: #1c1917;
  --arrt-green: #006631;
  --drydock-hull: var(--scoopy-gold-deep);
  --drydock-hull-light: var(--scoopy-gold);
  --drydock-hull-dark: var(--scoopy-ink-deep);
  --drydock-primer: #ede1c9;
  --drydock-rail-edge: rgba(56, 50, 46, 0.38);
  --drydock-stage-bg: #f5f2eb;
  --drydock-stage-mat: #b3a79f;
  --drydock-icon: var(--scoopy-ink);
  --drydock-icon-dim: color-mix(in srgb, var(--scoopy-ink) 82%, #000);
  --drydock-hub-bg: #1c1917;
  --drydock-hub-border: rgba(237, 225, 201, 0.45);
  --drydock-hub-glow: var(--scoopy-gold);
  --drydock-hub-rim: #f5f2eb;
  --dd-letterbox: #1c1917;
  --ct-gutter-bg: #d5e7d9;
  --ct-slider-bg: rgba(245, 242, 235, 0.96);
  --ct-q400-ring-outer: rgba(186, 155, 34, 0.55);
  --drydock-q400-bg: color-mix(in srgb, var(--drydock-hull-dark) 88%, #38322e 12%);
  --ct-q400-glyph-stroke: rgba(245, 242, 235, 0.42);
  --ct-q400-glyph-stroke-dark: rgba(28, 25, 23, 0.82);
  --chr-rail-hover: var(--arrt-green);
  --chr-rail-hover-glow: rgba(0, 102, 49, 0.88);
  --chr-rail-hover-glow-soft: rgba(0, 102, 49, 0.55);
}

body.dd-shell.theme-slate .dd-hub-panel {
  border-color: rgba(245, 242, 235, 0.92);
}

body.dd-shell.theme-slate .dd-hub-foot__legal:hover,
body.dd-shell.theme-slate .dd-hub-foot__legal:focus-visible {
  color: var(--drydock-hub-glow);
}

body.dd-shell.theme-slate .dd-legal-popup__link--primary {
  border-color: color-mix(in srgb, var(--drydock-primer) 55%, transparent);
}

body.dd-shell.theme-slate #q400,
body.dd-shell.theme-slate .dd-q400-inner,
body.dd-shell.theme-slate .dd-paw-wrap {
  background: var(--drydock-q400-bg);
  color: #f5f2eb;
}

/* q400 keeps cream chrome on the dark bar */
body.dd-shell.theme-slate #q400,
body.dd-shell.theme-slate #q400 .chr-q400-bar,
body.dd-shell.theme-slate #q400 .chr-desk__title,
body.dd-shell.theme-slate #q400 .chr-desk__byline,
body.dd-shell.theme-slate #q400 .chr-desk__item,
body.dd-shell.theme-slate #q400 .chr-tag-cloud__tag {
  --drydock-icon: #f5f2eb;
  --drydock-icon-dim: #ede1c9;
}

/* Side-rail Scoopy S — brown fill + thick cream rim stroke (same ink as paw ring) */
body.dd-shell.theme-slate .dd-viewport:not(.dd-layout--phone-stack) .chr-rail__logo--mark,
body.dd-shell.theme-bones .dd-viewport:not(.dd-layout--phone-stack) .chr-rail__logo--mark {
  --chr-s-rim: color-mix(in srgb, var(--drydock-hub-rim, #f5f2eb) 88%, var(--drydock-primer, #ede1c9));
  filter:
    brightness(0) saturate(100%) invert(16%) sepia(18%) saturate(650%) hue-rotate(350deg) brightness(0.92)
    drop-shadow(2px 0 0 var(--chr-s-rim))
    drop-shadow(-2px 0 0 var(--chr-s-rim))
    drop-shadow(0 2px 0 var(--chr-s-rim))
    drop-shadow(0 -2px 0 var(--chr-s-rim))
    drop-shadow(1px 1px 0 var(--chr-s-rim))
    drop-shadow(-1px -1px 0 var(--chr-s-rim))
    drop-shadow(1px -1px 0 var(--chr-s-rim))
    drop-shadow(-1px 1px 0 var(--chr-s-rim));
}

/* Green glow on rail interactive hover (links Scoopy ↔ MOAS) */
body.dd-shell.theme-slate #q100 .chr-desk__title:hover,
body.dd-shell.theme-slate #q300 .chr-desk__title:hover,
body.dd-shell.theme-slate #q100 .chr-desk__slot-btn:hover,
body.dd-shell.theme-slate #q300 .chr-desk__slot-btn:hover,
body.dd-shell.theme-slate #q100 .chr-desk__slot-btn:focus-visible,
body.dd-shell.theme-slate #q300 .chr-desk__slot-btn:focus-visible,
body.dd-shell.theme-slate #q100 .chr-desk__item:not(.chr-desk__item--empty):hover,
body.dd-shell.theme-slate #q300 .chr-desk__item:not(.chr-desk__item--empty):hover,
body.dd-shell.theme-slate #q100 .chr-desk__item:not(.chr-desk__item--empty):focus-visible,
body.dd-shell.theme-slate #q300 .chr-desk__item:not(.chr-desk__item--empty):focus-visible {
  color: var(--chr-rail-hover);
  text-shadow: 0 0 10px var(--chr-rail-hover-glow-soft);
  filter: drop-shadow(0 0 6px var(--chr-rail-hover-glow-soft));
}

body.dd-shell.theme-slate #q100 .chr-desk__byline:hover,
body.dd-shell.theme-slate #q300 .chr-desk__byline:hover {
  color: var(--chr-rail-hover);
  filter: drop-shadow(0 0 6px var(--chr-rail-hover-glow-soft));
}

body.dd-shell.theme-slate #q100 .chr-desk__browse-select,
body.dd-shell.theme-slate #q300 .chr-desk__browse-select {
  background: color-mix(in srgb, var(--scoopy-ink-deep) 55%, var(--scoopy-gold));
  border-color: rgba(56, 50, 46, 0.45);
  color: #f5f2eb;
}

body.dd-shell.theme-slate #q100 .chr-desk__browse-select:focus-visible,
body.dd-shell.theme-slate #q300 .chr-desk__browse-select:focus-visible {
  outline-color: var(--arrt-green);
}