/* Analytica: shared palette for desktop and companions. Paper, ink, olive and signal orange. */
html[data-theme="analytica"] {
  color-scheme:dark;
  --tint:#ff682c; --accent:#ff682c; --accent-2:#c9a85c; --accent-3:#f5f5f5;
  --font:"Inter","Avenir Next",system-ui,sans-serif;
  --bg:#1b1b1b; --panel:#252525; --panel-2:#2e2e2e; --border:#3b3b3b;
  --text:#f5f5f5; --muted:#a8a8a8; --input-bg:#202020; --link:#d6b66a;
  --green:#7fd6a0; --red:#ff9a8a; --amber:#e9c46a; --orange:#ff8a5c;
  --radius:10px; --radius-btn:999px; --radius-input:10px;
  --surface:var(--panel); --surface-border-color:var(--border);
  --grad-brand:linear-gradient(var(--text),var(--text));
  --grad-primary:linear-gradient(#f5f5f5,#f5f5f5);
  --grad-primary-hover:linear-gradient(#ffffff,#ffffff);
  --btn-soft:linear-gradient(var(--panel-2),var(--panel-2));
  --btn-soft-hover:linear-gradient(var(--border),var(--border));
  --app-bg:var(--bg); --shadow:none; --shadow-glow:none;
}
html[data-theme="analytica"][data-mode="light"] {
  color-scheme:light;
  --accent:#ff682c; --accent-2:#816729; --accent-3:#202020;
  --bg:#f5f5f5; --panel:#efefef; --panel-2:#e8e8e8; --border:#d9d9d9;
  --text:#202020; --muted:#5c5c5c; --input-bg:#ffffff; --link:#816729;
  --green:#1f6b3a; --red:#b3261e; --amber:#7a5200; --orange:#b83a12;
  --grad-primary:linear-gradient(#202020,#202020);
  --grad-primary-hover:linear-gradient(#000000,#000000);
}

/* ---------- Tokens + motion ---------- */
html[data-theme="analytica"] {
  --an-signal:#ff682c;
  --an-signal-text:#ff8a5c;
  --an-sand:#34302a;
  --an-pill:#2b2b2b;
  --an-pill-active:#3a3a3a;
  --an-ink:#f5f5f5; --an-on-ink:#202020;
  --an-hair:color-mix(in srgb,var(--text) 12%,transparent);
  --an-ease:cubic-bezier(.22,1,.36,1);
  --cur-hand:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M3 2L3 21L8.2 16.4L11.6 24.2L15 22.7L11.7 15.1L18.6 14.6Z' fill='%23202020' stroke='%23f5f5f5' stroke-width='1.6' stroke-linejoin='round'/%3E%3Crect x='19' y='19' width='6' height='6' fill='%23ff682c'/%3E%3C/svg%3E") 3 2;
}
html[data-theme="analytica"][data-mode="light"] {
  --an-signal-text:#b83a12;
  --an-sand:#ebe6dd;
  --an-pill:#e8e8e8;
  --an-pill-active:#ffffff;
  --an-ink:#202020; --an-on-ink:#f5f5f5;
}
@keyframes an-rise { from { opacity:0; translate:0 10px; } }
@keyframes an-sheet { from { opacity:.2; translate:0 56px; rotate:-1.8deg; } to { opacity:1; translate:0 0; rotate:0deg; } }

/* ---------- Page + type ---------- */
html[data-theme="analytica"][data-mode] body { background:var(--bg); font-weight:500; letter-spacing:0; }
html[data-theme="analytica"][data-mode] :is(h1,h2,h3,h4) { font-family:"Inter Tight","Inter",sans-serif; font-weight:500; letter-spacing:-.02em; color:var(--text); }
html[data-theme="analytica"][data-mode] .section-head h2 { font-size:clamp(34px,3.6vw,56px); font-weight:400; line-height:1; letter-spacing:-.025em; }
/* Signal square before section titles and card titles. */
html[data-theme="analytica"][data-mode] :is(.section-head h2,.card > h3,.station-card h3)::before {
  content:""; display:inline-block; width:.22em; height:.22em; margin:0 .38em .16em 0; vertical-align:middle;
  background:var(--an-signal);
}
html[data-theme="analytica"][data-mode] :is(.muted,.meta,.card .meta) { color:var(--muted); }
html[data-theme="analytica"][data-mode] .station-card .meta { color:var(--link); }
html[data-theme="analytica"][data-mode] a, html[data-theme="analytica"][data-mode] .link { color:var(--link); text-underline-offset:.22em; }
html[data-theme="analytica"] ::selection { background:var(--an-signal); color:#202020; }
html[data-theme="analytica"][data-mode] .brand {
  font-family:"Inter Tight","Inter",sans-serif; font-weight:500; font-size:22px; letter-spacing:-.03em;
  background:none; -webkit-background-clip:border-box; background-clip:border-box; color:var(--text);
}
html[data-theme="analytica"][data-mode] .brand::after { content:""; display:inline-block; width:7px; height:7px; margin-left:6px; background:var(--an-signal); vertical-align:.5em; }

/* ---------- Header: plain bar, centered pill trail, ink pill action ---------- */
html[data-theme="analytica"][data-mode][data-style] .topbar {
  background:color-mix(in srgb,var(--bg) 88%,transparent); border:0; box-shadow:none;
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  padding:14px max(var(--gutter),calc((100% - 1600px) / 2 + var(--gutter)));
}
html[data-theme="analytica"][data-mode] .topbar .spacer { display:none; }
html[data-theme="analytica"][data-mode] #breadcrumb {
  margin-inline:auto; padding:4px; gap:2px; border-radius:200px; background:var(--an-pill); font-size:14px;
}
html[data-theme="analytica"][data-mode] #breadcrumb:empty { display:none; }
html[data-theme="analytica"][data-mode] #breadcrumb :is(.crumb,.crumb-back,.crumb.current) {
  font-size:14px; font-weight:500; padding:6px 14px; border-radius:200px; border:0; box-shadow:none;
  color:var(--text); background:transparent; transition:background .3s var(--an-ease);
}
html[data-theme="analytica"][data-mode] #breadcrumb :is(.crumb,.crumb-back):hover { background:var(--an-pill-active); }
html[data-theme="analytica"][data-mode] #breadcrumb .crumb.current { background:var(--an-pill-active); }
html[data-theme="analytica"][data-mode] #breadcrumb .crumb-sep { color:var(--muted); }
html[data-theme="analytica"][data-mode] .topbar .chip { background:transparent; border:0; color:var(--muted); font-weight:500; }
html[data-theme="analytica"][data-mode][data-style] .topbar .btn.ghost { background:transparent; border:0; box-shadow:none; color:var(--text); border-radius:200px; padding:8px 12px; }
html[data-theme="analytica"][data-mode][data-style] .topbar .btn.ghost:hover { background:var(--an-pill); }
html[data-theme="analytica"][data-mode][data-style] .topbar #logout-btn { background:var(--an-ink); color:var(--an-on-ink); padding:9px 20px; }
html[data-theme="analytica"][data-mode][data-style] .topbar #logout-btn:hover { background:var(--an-ink); opacity:.86; }
html[data-theme="analytica"][data-mode] #content { max-width:1600px; width:auto; margin-inline:auto; padding:32px var(--gutter); }

/* ---------- Station page: centered pill menu across the top, sand stat band, full canvas ---------- */
html[data-theme="analytica"][data-mode] .station-layout,
html[data-theme="analytica"][data-mode] .station-layout:not(.has-right) { grid-template-columns:minmax(0,1fr); gap:18px; }
html[data-theme="analytica"][data-mode] .station-rail-left { order:-2; }
html[data-theme="analytica"][data-mode] .station-rail-right { order:-1; }
html[data-theme="analytica"][data-mode][data-style] .station-rail-left {
  position:sticky; top:76px; z-index:5; justify-self:center; max-width:100%; box-sizing:border-box;
  padding:4px; border:0 !important; border-radius:200px !important; box-shadow:none !important;
  background:var(--an-pill) !important; overflow-x:auto; scrollbar-width:none;
}
html[data-theme="analytica"][data-mode] .station-rail-left::-webkit-scrollbar { display:none; }
html[data-theme="analytica"][data-mode] .tabs.station-tabs-v { flex-direction:row; flex-wrap:nowrap; align-items:center; gap:2px; width:max-content; }
html[data-theme="analytica"][data-mode][data-style] .tabs.station-tabs-v .tab {
  width:auto; white-space:nowrap; padding:7px 15px; border:0; border-radius:200px; box-shadow:none !important;
  font-size:14px; font-weight:500; color:var(--text); background:transparent; transition:background .3s var(--an-ease);
}
html[data-theme="analytica"][data-mode][data-style] .tabs.station-tabs-v .tab:hover { background:color-mix(in srgb,var(--an-pill-active) 70%,transparent); }
html[data-theme="analytica"][data-mode][data-style] .tabs.station-tabs-v .tab.active { background:var(--an-pill-active) !important; color:var(--text) !important; font-weight:600; }
html[data-theme="analytica"][data-mode] .station-tabs-v .station-submenu {
  flex-direction:row; flex-basis:auto; align-items:center; gap:2px; margin:0 4px; padding:2px;
  border-radius:200px; background:color-mix(in srgb,var(--an-signal) 12%,transparent);
}
html[data-theme="analytica"][data-mode][data-style] .station-rail-right {
  padding:6px; border:0 !important; border-radius:var(--radius) !important; box-shadow:none !important; background:var(--an-sand) !important;
}
html[data-theme="analytica"][data-mode] .stats.station-stats-side { flex-direction:row; flex-wrap:wrap; gap:0; }
html[data-theme="analytica"][data-mode][data-style] .stats.station-stats-side .stat {
  flex:1 1 160px; width:auto; padding:14px 18px; border:0 !important; border-radius:0 !important;
  background:transparent !important; box-shadow:none !important;
}
html[data-theme="analytica"][data-mode][data-style] .stats.station-stats-side .stat + .stat { border-left:1px solid color-mix(in srgb,var(--text) 14%,transparent) !important; border-top:0 !important; }
html[data-theme="analytica"][data-mode] .stat .label { text-transform:none; letter-spacing:0; font-size:13px; color:var(--link); font-weight:500; }
html[data-theme="analytica"][data-mode] .stat .value { font-family:"Inter Tight","Inter",sans-serif; font-weight:500; font-size:28px; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
html[data-theme="analytica"][data-mode] .station-main { padding:4px 0 28px; }
html[data-theme="analytica"][data-mode] .month-bar { flex-wrap:wrap; row-gap:10px; }

/* ---------- Surfaces: flat sheets, hairlines, no glow ---------- */
html[data-theme="analytica"][data-mode][data-style] :is(.card,.stat,.modal,.login-card,.status-strip) {
  background:var(--panel) !important; border:1px solid var(--an-hair) !important; border-radius:var(--radius);
  box-shadow:none !important; -webkit-backdrop-filter:none; backdrop-filter:none;
  transition:translate .5s var(--an-ease),box-shadow .5s var(--an-ease),border-color .3s;
}
html[data-theme="analytica"][data-mode] .card::before { display:none; }
html[data-theme="analytica"][data-mode][data-style] .card:hover {
  transform:none; translate:0 -4px; border-color:color-mix(in srgb,var(--text) 22%,transparent) !important;
  box-shadow:0 22px 40px -28px #0005 !important;
}
html[data-theme="analytica"][data-mode][data-style] .station-card { padding:28px; border-radius:12px; }
html[data-theme="analytica"][data-mode] .station-card h3 { font-size:25px; font-weight:500; }
html[data-theme="analytica"][data-mode] .station-card .sc-bal-num { font-family:"Inter Tight","Inter",sans-serif; font-weight:400; letter-spacing:-.035em; }
html[data-theme="analytica"][data-mode] .add-card { background:transparent !important; border-style:dashed !important; }
html[data-theme="analytica"][data-mode] .station-card .sc-balance { background:var(--an-sand) !important; border:0 !important; border-radius:8px; }
html[data-theme="analytica"][data-mode] .toast:not(.err) { background:var(--an-ink); color:var(--an-on-ink); border-radius:200px; font-weight:500; padding:11px 20px; }

/* ---------- Controls: ink pills, outlined pills, signal tags ---------- */
html[data-theme="analytica"][data-mode][data-style] .btn {
  border-radius:200px; font-weight:500; box-shadow:none !important; transition:background .25s,color .25s,border-color .25s,opacity .25s;
}
html[data-theme="analytica"][data-mode][data-style] .btn:not(.primary):not(.info):not(.danger) { background:transparent; border:1px solid color-mix(in srgb,var(--text) 30%,transparent); color:var(--text); }
html[data-theme="analytica"][data-mode][data-style] .btn:not(.primary):not(.info):not(.danger):hover { background:var(--an-pill); border-color:var(--text); }
html[data-theme="analytica"][data-mode][data-style] :is(.btn.primary,.btn.info) { background:var(--an-ink) !important; color:var(--an-on-ink) !important; border:0; }
html[data-theme="analytica"][data-mode][data-style] :is(.btn.primary,.btn.info):hover { opacity:.86; }
html[data-theme="analytica"][data-mode][data-style] :is(.tab:not(.active),.seg button:not(.active)) { box-shadow:none !important; }
html[data-theme="analytica"][data-mode][data-style] .seg button.active { background:var(--an-ink) !important; color:var(--an-on-ink) !important; }
html[data-theme="analytica"][data-mode] :is(.badge,.pill-tag) { border-radius:200px; background:transparent; border:1px solid var(--an-signal); color:var(--an-signal-text); }
html[data-theme="analytica"][data-mode][data-style] :is(input,select,textarea) { border-radius:var(--radius-input); border:1px solid var(--an-hair); background:var(--input-bg); box-shadow:none; }
html[data-theme="analytica"][data-mode][data-style] :is(input,select,textarea):focus { outline:2px solid var(--an-signal); outline-offset:1px; border-color:transparent; }
html[data-theme="analytica"][data-mode] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]),textarea,[contenteditable="true"]) { cursor:text !important; }
html[data-theme="analytica"][data-mode] :disabled { cursor:not-allowed !important; }
html[data-theme="analytica"][data-mode] :is(input[type="checkbox"],input[type="radio"]) { accent-color:var(--an-signal); }
html[data-theme="analytica"][data-mode][data-style] .cal .day:not(.empty) {
  border-radius:10px !important; background:var(--panel) !important; border:1px solid var(--an-hair) !important; box-shadow:none !important;
  transition:translate .4s var(--an-ease),border-color .25s;
}
html[data-theme="analytica"][data-mode][data-style] .cal .day:not(.empty):hover { translate:0 -3px; border-color:color-mix(in srgb,var(--text) 30%,transparent) !important; }
html[data-theme="analytica"][data-mode][data-style] .cal .day.today { background:var(--an-sand) !important; outline:0; border-color:var(--an-signal) !important; }
html[data-theme="analytica"][data-mode] .cal .day.today .num { color:var(--text); }
html[data-theme="analytica"][data-mode] .cal .day.today .num::after { content:""; display:inline-block; width:6px; height:6px; margin-left:6px; vertical-align:middle; background:var(--an-signal); }

/* ---------- Motion: content settles in; panels slide up and un-tilt like stacked sheets ---------- */
html[data-theme="analytica"][data-mode] #content > * { animation:an-rise .6s var(--an-ease) backwards; }
html[data-theme="analytica"][data-mode] #content > :nth-child(2) { animation-delay:.06s; }
html[data-theme="analytica"][data-mode] #content > :nth-child(n+3) { animation-delay:.12s; }
@supports (animation-timeline:view()) {
  html[data-theme="analytica"][data-mode] :is(.station-grid > *,.station-main .card) {
    animation:an-sheet linear both; animation-timeline:view(); animation-range:entry 0% entry 70%;
  }
}

/* ---------- Gallery preview ---------- */
.theme-showcase[data-preset="analytica"] .theme-showcase-art { background:#f5f5f5; }
.theme-showcase[data-preset="analytica"] .theme-showcase-orbit { border:0; border-radius:0; background:#ff682c; width:22%; height:22%; opacity:1; }
.theme-showcase[data-preset="analytica"] .theme-showcase-pane { background:#efefef; border:1px solid #20202014; border-radius:10px; box-shadow:none; }
.theme-showcase[data-preset="analytica"] .theme-showcase-pane.back { background:#ebe6dd; rotate:-4deg; }
.theme-showcase[data-preset="analytica"] .theme-showcase-type { font-family:"Inter Tight","Inter",sans-serif; font-weight:400; color:#202020; letter-spacing:-.03em; }
.theme-showcase[data-preset="analytica"] .theme-showcase-mini-button { background:#202020; border-radius:200px; }
.theme-showcase[data-preset="analytica"] .theme-showcase-caption { color:#816729; }

/* ---------- Small screens + accessibility ---------- */
@media (max-width:700px) {
  html[data-theme="analytica"][data-mode] #breadcrumb { margin-inline:0; }
  html[data-theme="analytica"][data-mode][data-style] .station-rail-left { position:relative; top:auto; justify-self:stretch; }
  html[data-theme="analytica"][data-mode][data-style] .stats.station-stats-side .stat { flex:1 1 calc(50% - 1px); }
  html[data-theme="analytica"][data-mode][data-style] .stats.station-stats-side .stat:nth-child(odd) { border-left:0 !important; }
  html[data-theme="analytica"][data-mode][data-style] .station-card { padding:24px; }
}
@media (prefers-reduced-motion:reduce) {
  html[data-theme="analytica"] *, html[data-theme="analytica"] *::before, html[data-theme="analytica"] *::after { animation:none !important; transition-duration:.01ms !important; }
}

html[data-theme="analytica"] { --gutter:clamp(20px,3vw,56px); }
