/* Sahra, the demo hub's brand layer. Loaded last, so it only re-tints the hub-core house
   style: warm sand paper instead of grey, terracotta instead of red for the one accent.
   DIRECTION  A potter's studio at dusk: sand paper, ink text, terracotta for what matters.
   SIGNATURE  The arched sunset mark in the rail, and the package switch in the top bar. */
:root{ --bg:#efe9df; --line:#e2dacb; --hoverbg:#e9e1d4; --rowline:#ebe4d8;
  --red:#c2603a; --red-hover:#a94f2c; --neg:#c2603a; --red-tint:rgba(194,96,58,.12); --red-tint-line:rgba(194,96,58,.3);
  --at-paper:#fbf8f3; --at-rule:#e6dfd2; --at-rule-2:#d8cfbf; --at-img-bg:#efe6d8; --at-mono-bg:#ede5d8;
  --at-topbar-glass:rgba(239,233,223,.86); --at-rail-on-fg:#e08a62;
  --at-bar:color-mix(in srgb, #c2603a 40%, #fff); }
html[data-theme="dark"]{ --bg:#0d0b09; --paper:#14110e; --card:#14110e; --surface:#14110e;
  --red:#e07a52; --red-hover:#c9673f; --neg:#e07a52; --red-tint:rgba(224,122,82,.14); --red-tint-line:rgba(224,122,82,.3);
  --at-paper:#14110e; --at-raised:#1a1612; --at-hero-bg:#1a1612; --at-rule:#26211b; --at-rule-2:#332c24;
  --at-topbar-glass:rgba(13,11,9,.76); --at-rail-on-fg:#e07a52;
  --at-bar:color-mix(in srgb, #e07a52 48%, #14110e); --at-img-bg:#1d1813; --at-mono-bg:#1d1813; }
#rail .rail-logo{ filter:none; width:140px; max-height:none; }
.sahra-night{ display:none; }
html[data-theme="dark"] .sahra-day{ display:none; }
html[data-theme="dark"] .sahra-night{ display:block; }

/* The package switch: which of the two hubs we sell is on screen. */
.pkg-switch{ position:relative; display:inline-flex; padding:3px; border-radius:999px; background:var(--at-track); margin-inline-end:10px; }
.pkg-switch button{ position:relative; z-index:1; border:0; background:none; font:inherit; font-size:13px; font-weight:500; letter-spacing:-.01em;
  color:var(--muted); padding:7px 14px; border-radius:999px; cursor:pointer; white-space:nowrap; transition:color .2s cubic-bezier(.22,1,.36,1); }
.pkg-switch button[aria-pressed="true"]{ color:#fff; }
.pkg-switch button:focus-visible{ outline:2px solid var(--red); outline-offset:2px; }
.pkg-switch .pkg-ind{ position:absolute; z-index:0; top:3px; bottom:3px; border-radius:999px; background:var(--red);
  box-shadow:0 6px 14px -8px rgba(194,96,58,.9); transition:left .28s cubic-bezier(.22,1,.36,1), width .28s cubic-bezier(.22,1,.36,1); }
.pkg-switch small{ font-size:11px; opacity:.75; margin-inline-start:5px; font-variant-numeric:tabular-nums; }
@media (max-width:700px){ .pkg-switch{ margin-inline-end:4px; } .pkg-switch button{ padding:7px 10px; font-size:12px; } .pkg-switch small{ display:none; } .topbar-me .me-label{ display:none; } }
@media (prefers-reduced-motion:reduce){ .pkg-switch .pkg-ind, .pkg-switch button{ transition:none; } }
/* a demo has no account to switch */
.switch-acct{ display:none !important; }
.demo-toast{ position:fixed; left:50%; bottom:24px; transform:translate(-50%, 12px); z-index:9999; max-width:min(92vw, 440px);
  padding:11px 16px; border-radius:12px; background:#2a1e17; color:#f3e6cf; font-size:13px; line-height:1.4; text-align:center;
  box-shadow:0 14px 34px -14px rgba(0,0,0,.6); opacity:0; pointer-events:none; transition:opacity .2s ease, transform .2s cubic-bezier(.22,1,.36,1); }
.demo-toast.on{ opacity:1; transform:translate(-50%, 0); }

/* The rail's glass, warmed to sand: terracotta and olive light drift behind it instead of blue-green. */
html:not([data-theme="dark"]) #rail{ background:linear-gradient(180deg, rgba(246,238,226,.82), rgba(238,226,210,.76) 42%, rgba(232,218,200,.76) 72%, rgba(240,230,216,.84));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.6), 0 0 0 1px rgba(90,60,40,.1), 0 18px 44px -24px rgba(90,60,40,.4); }
html:not([data-theme="dark"]) #rail::before{ background:radial-gradient(46% 24% at 30% 56%, rgba(110,116,68,.32), transparent 72%), radial-gradient(40% 20% at 72% 22%, rgba(255,250,240,.85), transparent 72%); }
html:not([data-theme="dark"]) #rail::after{ background:radial-gradient(44% 20% at 68% 76%, rgba(194,96,58,.3), transparent 72%), radial-gradient(34% 16% at 26% 26%, rgba(226,180,120,.28), transparent 72%); }
html[data-theme="dark"] #rail::after{ background:radial-gradient(44% 20% at 68% 76%, rgba(224,122,82,.18), transparent 72%), radial-gradient(34% 16% at 26% 26%, rgba(226,180,120,.12), transparent 72%); }
/* Opsync (the 30k package) has no daily reports: their buttons on Stats go too. */
html.pkg-opsync #open-reports, html.pkg-opsync .js-gen-report{ display:none !important; }