/* Qelly Intelligence - Sovereign Design System v2
   Deep burgundy + porcelain white, modular curves, high-motion institutional UX. */

:root {
  --q-font-display: "Avenir Next", "Manrope", "Sora", "Nunito Sans", ui-rounded, system-ui, sans-serif;
  --q-font-sans: "Avenir Next", "Manrope", "Inter", "SF Pro Display", ui-sans-serif, system-ui, sans-serif;
  --q-font-mono: "IBM Plex Mono", "SFMono-Regular", "Cascadia Code", Consolas, monospace;
  --q-radius-xs: 9px;
  --q-radius-sm: 14px;
  --q-radius: 20px;
  --q-radius-lg: 28px;
  --q-radius-xl: 38px;
  --q-gap: 18px;
  --q-motion: 360ms;
  --q-ease: cubic-bezier(.22,1,.36,1);
  --q-ease-spring: cubic-bezier(.16,1.35,.3,1);
  --q-shadow-xs: 0 1px 1px rgba(28,0,9,.04), 0 7px 18px rgba(28,0,9,.05);
  --q-shadow: 0 18px 50px rgba(28,0,9,.09), 0 2px 7px rgba(28,0,9,.05);
  --q-shadow-hover: 0 28px 72px rgba(44,0,15,.16), 0 6px 18px rgba(44,0,15,.08);
  --q-ring: 0 0 0 1px color-mix(in srgb,var(--q-accent) 18%,transparent), 0 0 0 7px color-mix(in srgb,var(--q-accent) 7%,transparent);
  --q-glow: color-mix(in srgb,var(--q-accent) 20%,transparent);
  --q-white: #fffafc;
}

:root[data-theme="burgundy-command"] {
  --q-chrome: #160008;
  --q-chrome-raised: #2b000f;
  --q-canvas: #f8f2f4;
  --q-surface: #fffdfd;
  --q-surface-alt: #f4e9ed;
  --q-surface-raised: #ffffff;
  --q-text: #251218;
  --q-text-secondary: #5b4650;
  --q-muted: #7b6870;
  --q-border: #e2d2d8;
  --q-accent: #720f32;
  --q-accent-strong: #4b001b;
  --q-focus: #d84779;
  --q-positive: #087a4a;
  --q-negative: #c02d41;
  --q-warning: #a85b09;
}
:root[data-theme="burgundy-night"] {
  --q-chrome: #090003;
  --q-chrome-raised: #1b0009;
  --q-canvas: #10070a;
  --q-surface: #1b0f13;
  --q-surface-alt: #27151b;
  --q-surface-raised: #221218;
  --q-text: #fff7fa;
  --q-text-secondary: #e7d3da;
  --q-muted: #bda4ad;
  --q-border: #4b2c36;
  --q-accent: #e05283;
  --q-accent-strong: #ff82aa;
  --q-focus: #ff9cbc;
  --q-positive: #54d49a;
  --q-negative: #ff7286;
  --q-warning: #ffc26d;
}
:root[data-theme="porcelain-burgundy"] {
  --q-chrome: #310012;
  --q-chrome-raised: #5b0a2a;
  --q-canvas: #fffaf9;
  --q-surface: #ffffff;
  --q-surface-alt: #fbf0f3;
  --q-surface-raised: #ffffff;
  --q-text: #2a151c;
  --q-text-secondary: #5e4650;
  --q-muted: #806c74;
  --q-border: #ecdce1;
  --q-accent: #8d1f48;
  --q-accent-strong: #65102f;
  --q-focus: #c72f65;
}
:root[data-theme="graphite-terminal"] {
  --q-chrome: #0d0b0c;
  --q-chrome-raised: #1b1518;
  --q-canvas: #111012;
  --q-surface: #1c191b;
  --q-surface-alt: #282326;
  --q-surface-raised: #221e20;
  --q-text: #f8f4f5;
  --q-text-secondary: #d6cdd0;
  --q-muted: #aaa0a4;
  --q-border: #40383c;
  --q-accent: #c13d6c;
  --q-accent-strong: #ef6695;
  --q-focus: #ff88b0;
}
:root[data-theme="midnight-research"] {
  --q-chrome: #0d0714;
  --q-chrome-raised: #1d0b28;
  --q-canvas: #120d19;
  --q-surface: #201727;
  --q-surface-alt: #2b2033;
  --q-surface-raised: #261b2e;
  --q-text: #fbf5ff;
  --q-text-secondary: #dfd1e6;
  --q-muted: #b6a4c0;
  --q-border: #493752;
  --q-accent: #ce4d82;
  --q-accent-strong: #f17aa7;
  --q-focus: #ffa0c2;
}
:root[data-theme="high-contrast"] {
  --q-chrome: #000000;
  --q-chrome-raised: #1a0009;
  --q-canvas: #ffffff;
  --q-surface: #ffffff;
  --q-surface-alt: #f5f5f5;
  --q-surface-raised: #ffffff;
  --q-text: #000000;
  --q-text-secondary: #171717;
  --q-muted: #3c3c3c;
  --q-border: #000000;
  --q-accent: #74002e;
  --q-accent-strong: #3c0017;
  --q-focus: #ff2f78;
  --q-shadow: 0 0 0 2px #000;
  --q-shadow-hover: 0 0 0 4px #74002e;
}

html {
  background: var(--q-canvas);
  font-feature-settings: "liga" 1, "kern" 1, "ss01" 1;
  text-rendering: geometricPrecision;
}
body {
  background:
    radial-gradient(1200px 760px at 110% -8%, color-mix(in srgb,var(--q-accent) 8%, transparent), transparent 65%),
    radial-gradient(850px 600px at -12% 110%, color-mix(in srgb,var(--q-accent) 5%, transparent), transparent 65%),
    var(--q-canvas);
  letter-spacing: -.005em;
}
::selection { background: color-mix(in srgb,var(--q-accent) 25%,transparent); color: var(--q-text); }

/* global atmosphere */
.q-app::before,
.q-app::after {
  content:"";
  position:fixed;
  pointer-events:none;
  z-index:-1;
  border-radius:50%;
  filter:blur(70px);
  opacity:.22;
}
.q-app::before { width:480px;height:480px;right:-220px;top:150px;background:var(--q-accent); }
.q-app::after { width:380px;height:380px;left:-190px;bottom:-80px;background:color-mix(in srgb,var(--q-accent) 55%,#fff);opacity:.1; }

/* premium top chrome */
.q-global-strip {
  height:42px;
  padding:0 22px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.025),transparent 35%,rgba(255,255,255,.025)),
    linear-gradient(135deg,var(--q-chrome),var(--q-chrome-raised));
  border-bottom:1px solid rgba(255,255,255,.11);
  box-shadow:0 8px 32px rgba(22,0,8,.2);
  overflow:hidden;
}
.q-global-strip::after {
  content:"";position:absolute;inset:0 auto 0 -20%;width:20%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);
  animation:q-strip-glint 9s var(--q-ease) infinite;
}
.q-brand-mark { min-width:260px;font:800 11px/1 var(--q-font-display);letter-spacing:.18em; }
.q-brand-mark>span {
  width:28px;height:28px;border-radius:10px 10px 10px 4px;
  border:1px solid rgba(255,255,255,.36);
  background:linear-gradient(145deg,rgba(255,255,255,.28),rgba(255,255,255,.04));
  box-shadow:inset 0 1px rgba(255,255,255,.3),0 9px 24px rgba(0,0,0,.22);
  transition:transform var(--q-motion) var(--q-ease-spring), border-radius var(--q-motion) var(--q-ease);
}
.q-brand-mark:hover>span { transform:rotate(-8deg) scale(1.08);border-radius:50% 35% 50% 35%; }
.q-macro-item {font-size:10px;color:rgba(255,255,255,.76)}
.q-macro-item strong {font-size:10px;color:#fff}
.q-truth-chip {font-size:9px;letter-spacing:.04em}

.q-command-bar {
  height:82px;top:42px;padding:0 22px;
  background:color-mix(in srgb,var(--q-surface) 91%,transparent);
  backdrop-filter:blur(22px) saturate(1.25);
  -webkit-backdrop-filter:blur(22px) saturate(1.25);
  border-bottom:1px solid color-mix(in srgb,var(--q-border) 72%,transparent);
  box-shadow:0 12px 40px rgba(38,0,14,.07);
}
.q-workspace-switcher {min-width:250px;column-gap:11px}
.q-workspace-switcher span {
  width:42px;height:42px;border-radius:15px 15px 15px 6px;
  background:linear-gradient(145deg,var(--q-accent),var(--q-accent-strong));
  box-shadow:0 12px 30px var(--q-glow),inset 0 1px rgba(255,255,255,.2);
  transition:transform var(--q-motion) var(--q-ease-spring),border-radius var(--q-motion) var(--q-ease);
}
.q-workspace-switcher:hover span {transform:translateY(-3px) rotate(-4deg);border-radius:50% 38% 50% 38%}
.q-workspace-switcher strong {font:800 14px/1.15 var(--q-font-display);letter-spacing:-.02em}
.q-workspace-switcher small {font-size:10px;margin-top:2px}
.q-command-trigger {
  height:46px;border-radius:18px 18px 18px 8px;padding:0 16px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--q-surface-alt) 72%,var(--q-surface)),var(--q-surface-alt));
  border-color:color-mix(in srgb,var(--q-border) 80%,transparent);
  box-shadow:inset 0 1px rgba(255,255,255,.35);
  transition:transform var(--q-motion) var(--q-ease),box-shadow var(--q-motion) var(--q-ease),border-color var(--q-motion) var(--q-ease);
}
.q-command-trigger:hover {transform:translateY(-2px);border-color:var(--q-accent);box-shadow:var(--q-ring)}
.q-command-trigger>span:first-child {font-size:18px;color:var(--q-accent)}
.q-command-trigger kbd {border-radius:9px;padding:4px 8px;background:var(--q-surface);box-shadow:0 2px 5px rgba(0,0,0,.04)}
.q-state-control {
  height:42px;border-radius:15px 15px 15px 7px;padding:0 11px;
  background:var(--q-surface-alt);border-color:color-mix(in srgb,var(--q-border) 78%,transparent);
  transition:transform var(--q-motion) var(--q-ease),border-color var(--q-motion) var(--q-ease);
}
.q-state-control:hover {transform:translateY(-2px);border-color:var(--q-accent)}
.q-icon-button {
  width:42px;height:42px;border-radius:15px 15px 15px 7px;
  transition:transform var(--q-motion) var(--q-ease-spring),background var(--q-motion),box-shadow var(--q-motion),border-radius var(--q-motion);
}
.q-icon-button:hover {transform:translateY(-3px) rotate(-2deg);border-radius:50% 38% 50% 38%;box-shadow:var(--q-ring)}
.q-avatar {
  width:42px;height:42px;border-radius:50% 40% 50% 40%;
  background:linear-gradient(145deg,var(--q-accent),var(--q-accent-strong));
  box-shadow:0 13px 28px var(--q-glow);font:800 11px/1 var(--q-font-display);
  transition:transform var(--q-motion) var(--q-ease-spring),border-radius var(--q-motion);
}
.q-avatar:hover {transform:scale(1.08) rotate(6deg);border-radius:40% 50% 40% 50%}

/* rail */
.q-shell {grid-template-columns:276px minmax(0,1fr);min-height:calc(100vh - 124px)}
.q-shell.is-context-open {grid-template-columns:276px minmax(0,1fr) 390px}
.q-rail {
  top:124px;height:calc(100vh - 124px);
  background:
    radial-gradient(420px 350px at 0 0,rgba(255,255,255,.07),transparent 70%),
    linear-gradient(180deg,var(--q-chrome-raised),var(--q-chrome));
  border-right:1px solid rgba(255,255,255,.1);
  box-shadow:20px 0 60px rgba(25,0,9,.1);
}
.q-rail nav {padding:22px 14px;gap:6px}
.q-nav-section {font:800 9px/1 var(--q-font-display);letter-spacing:.2em;padding:20px 14px 8px;color:rgba(255,255,255,.43)}
.q-nav-link {
  min-height:46px;height:auto;border-radius:16px 16px 16px 7px;padding:10px 13px;
  font:650 12px/1.2 var(--q-font-display);letter-spacing:.005em;
  transition:transform var(--q-motion) var(--q-ease-spring),background var(--q-motion),color var(--q-motion),border-radius var(--q-motion),box-shadow var(--q-motion);
  position:relative;overflow:hidden;
}
.q-nav-link::before {
  content:"";position:absolute;inset:8px auto 8px 0;width:3px;border-radius:99px;background:#fff;
  transform:scaleY(0);transition:transform var(--q-motion) var(--q-ease-spring);
}
.q-nav-link:hover {transform:translateX(4px);background:rgba(255,255,255,.075);color:#fff;border-radius:20px 13px 20px 8px}
.q-nav-link:hover::before {transform:scaleY(.55)}
.q-nav-link.is-active {
  background:linear-gradient(135deg,rgba(255,255,255,.2),rgba(255,255,255,.08));
  border-color:rgba(255,255,255,.2);color:#fff;
  box-shadow:0 16px 35px rgba(0,0,0,.19),inset 0 1px rgba(255,255,255,.13);
  transform:translateX(5px);border-radius:22px 16px 22px 8px;
}
.q-nav-link.is-active::before {transform:scaleY(1)}
.q-nav-icon {font-size:15px;width:23px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2))}
.q-rail-footer {padding:16px;border-top-color:rgba(255,255,255,.12)}
.q-provider-mini {padding:12px;border-radius:18px 18px 18px 7px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.q-provider-pulse {animation:q-pulse 2.3s var(--q-ease) infinite}

/* content and hierarchy */
#main {
  padding:34px clamp(22px,3vw,52px) 80px;
  background:
    linear-gradient(90deg,color-mix(in srgb,var(--q-accent) 2.5%,transparent) 1px,transparent 1px),
    linear-gradient(color-mix(in srgb,var(--q-accent) 2.5%,transparent) 1px,transparent 1px),
    radial-gradient(circle at 93% -4%,color-mix(in srgb,var(--q-accent) 8%,transparent),transparent 31%);
  background-size:32px 32px,32px 32px,auto;
}
.q-page {max-width:1680px;animation:q-page-in 720ms var(--q-ease) both}
.q-page-head {
  align-items:center;min-height:150px;margin-bottom:24px;padding:30px 34px;
  background:
    radial-gradient(320px 230px at 94% 14%,rgba(255,255,255,.12),transparent 75%),
    linear-gradient(125deg,var(--q-chrome),var(--q-chrome-raised));
  color:#fff;border-radius:36px 36px 36px 14px;position:relative;overflow:hidden;
  box-shadow:0 30px 80px rgba(38,0,13,.18),inset 0 1px rgba(255,255,255,.13);
}
.q-page-head::before {
  content:"";position:absolute;width:340px;height:340px;border:1px solid rgba(255,255,255,.12);border-radius:42% 58% 58% 42%;right:-120px;top:-150px;transform:rotate(25deg);animation:q-orbit 18s linear infinite;
}
.q-page-head::after {
  content:"";position:absolute;width:220px;height:220px;border:32px solid rgba(255,255,255,.035);border-radius:50%;right:100px;bottom:-170px;
}
.q-page-head>div,.q-page-actions {position:relative;z-index:1}
.q-page-head h1 {
  font:780 clamp(32px,4vw,58px)/.98 var(--q-font-display);
  letter-spacing:-.055em;margin:8px 0 14px;max-width:940px;
}
.q-page-head p {color:rgba(255,255,255,.72);font-size:14px;line-height:1.7;max-width:840px}
.q-page-head .q-eyebrow {color:#f7b5cc!important;font-size:10px!important;letter-spacing:.21em}
.q-page-head .q-button--primary {background:#fff;color:var(--q-chrome);border-color:#fff;box-shadow:0 16px 36px rgba(0,0,0,.22)}
.q-page-head .q-button--primary:hover {background:#fff;transform:translateY(-3px) scale(1.02)}
.q-page-head .q-button--ghost,.q-page-head .q-button--secondary {color:#fff;border-color:rgba(255,255,255,.26);background:rgba(255,255,255,.07)}
.q-page-head .q-button--ghost:hover,.q-page-head .q-button--secondary:hover {background:rgba(255,255,255,.15);border-color:#fff}
.q-page-actions {gap:10px}
.q-eyebrow {font:800 10px/1 var(--q-font-display);letter-spacing:.2em}

/* buttons */
.q-button {
  min-height:44px;border-radius:16px 16px 16px 7px;padding:0 17px;
  font:760 12px/1 var(--q-font-display);letter-spacing:.01em;position:relative;overflow:hidden;
  transition:transform var(--q-motion) var(--q-ease-spring),box-shadow var(--q-motion),background var(--q-motion),border-radius var(--q-motion),border-color var(--q-motion);
}
.q-button::after {
  content:"";position:absolute;inset:-1px auto -1px -55%;width:44%;transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);transition:left 600ms var(--q-ease);
}
.q-button:hover {transform:translateY(-3px);border-radius:22px 14px 22px 8px;box-shadow:var(--q-shadow-xs)}
.q-button:hover::after {left:125%}
.q-button:active {transform:translateY(-1px) scale(.985)}
.q-button--primary {background:linear-gradient(145deg,var(--q-accent),var(--q-accent-strong));box-shadow:0 14px 30px var(--q-glow)}
.q-button--primary:hover {background:linear-gradient(145deg,color-mix(in srgb,var(--q-accent) 88%,#fff),var(--q-accent-strong));box-shadow:0 20px 40px var(--q-glow)}
.q-button--ghost {background:color-mix(in srgb,var(--q-surface) 60%,transparent);backdrop-filter:blur(8px)}
.q-text-button {border-radius:12px 12px 12px 5px;transition:transform var(--q-motion),background var(--q-motion)}
.q-text-button:hover {transform:translateX(3px)}

/* modular bento cards */
.q-kpi-grid {gap:18px;margin-bottom:18px}
.q-kpi {
  min-height:150px;padding:22px;border-radius:27px 27px 27px 10px;
  background:
    radial-gradient(190px 120px at 100% 0,color-mix(in srgb,var(--q-accent) 8%,transparent),transparent 72%),
    linear-gradient(180deg,var(--q-surface),color-mix(in srgb,var(--q-surface-alt) 28%,var(--q-surface)));
  border-color:color-mix(in srgb,var(--q-border) 84%,transparent);box-shadow:var(--q-shadow-xs);
  transition:transform var(--q-motion) var(--q-ease-spring),box-shadow var(--q-motion),border-radius var(--q-motion),border-color var(--q-motion);
}
.q-kpi::before {content:"";position:absolute;left:22px;top:0;width:54px;height:4px;background:linear-gradient(90deg,var(--q-accent),transparent);border-radius:0 0 99px 99px}
.q-kpi::after {width:130px;height:130px;right:-54px;bottom:-66px;border:22px solid color-mix(in srgb,var(--q-accent) 5%,transparent);background:transparent}
.q-kpi:hover {transform:translateY(-8px) rotateX(1.3deg);box-shadow:var(--q-shadow-hover);border-radius:34px 22px 34px 12px;border-color:color-mix(in srgb,var(--q-accent) 28%,var(--q-border))}
.q-kpi-label {font:800 10px/1.2 var(--q-font-display);letter-spacing:.15em}
.q-kpi-value {font-size:32px;margin:18px 0 10px;letter-spacing:-.055em}
.q-kpi-meta {font-size:10px}
.q-panel {
  border-radius:28px 28px 28px 11px;overflow:hidden;
  border-color:color-mix(in srgb,var(--q-border) 82%,transparent);box-shadow:var(--q-shadow-xs);
  background:linear-gradient(180deg,var(--q-surface),color-mix(in srgb,var(--q-surface-alt) 15%,var(--q-surface)));
  transition:transform var(--q-motion) var(--q-ease-spring),box-shadow var(--q-motion),border-radius var(--q-motion),border-color var(--q-motion);
}
.q-panel:hover {transform:translateY(-3px);box-shadow:var(--q-shadow);border-radius:33px 24px 33px 12px;border-color:color-mix(in srgb,var(--q-accent) 18%,var(--q-border))}
.q-panel-head {padding:20px 22px;border-bottom-color:color-mix(in srgb,var(--q-border) 70%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--q-surface-alt) 55%,var(--q-surface)),var(--q-surface))}
.q-panel-head h2 {font:800 17px/1.15 var(--q-font-display);letter-spacing:-.025em}
.q-panel-head p {font-size:11px;line-height:1.5}
.q-panel-body {padding:22px}
.q-dashboard-grid {grid-template-columns:minmax(0,1.65fr) minmax(330px,.72fr);gap:18px;margin-bottom:18px}
.q-dashboard-stack {gap:18px}
.q-two-column {gap:18px}

/* controls */
.q-setting {padding:17px 0}
.q-setting label {font:750 12px/1.2 var(--q-font-display)}
.q-setting select,.q-inline-select,.q-search-input,.q-inline-form input,.q-inline-form select,textarea,input[type="text"],input[type="number"],input[type="date"],input[type="time"] {
  min-height:44px;border-radius:15px 15px 15px 7px!important;padding:10px 13px!important;
  background:color-mix(in srgb,var(--q-surface) 84%,var(--q-surface-alt));border:1px solid var(--q-border)!important;
  transition:border-color var(--q-motion),box-shadow var(--q-motion),transform var(--q-motion),background var(--q-motion);
}
.q-setting select:hover,.q-inline-select:hover,.q-search-input:hover,.q-inline-form input:hover,.q-inline-form select:hover,textarea:hover,input[type="text"]:hover,input[type="number"]:hover {border-color:color-mix(in srgb,var(--q-accent) 50%,var(--q-border))!important}
.q-setting select:focus,.q-inline-select:focus,.q-search-input:focus,.q-inline-form input:focus,.q-inline-form select:focus,textarea:focus,input[type="text"]:focus,input[type="number"]:focus {outline:none;box-shadow:var(--q-ring);border-color:var(--q-accent)!important;background:var(--q-surface);transform:translateY(-1px)}
.q-filter-chip,.q-tag,.q-indicator-chips span,.q-chart-legend span {
  border-radius:999px;padding:7px 11px;background:color-mix(in srgb,var(--q-surface-alt) 72%,var(--q-surface));
  transition:transform var(--q-motion),background var(--q-motion),border-color var(--q-motion);
}
.q-filter-chip:hover,.q-tag:hover,.q-indicator-chips span:hover,.q-chart-legend span:hover {transform:translateY(-2px);border-color:var(--q-accent);background:color-mix(in srgb,var(--q-accent) 8%,var(--q-surface))}

/* tables */
.q-data-grid {border-radius:0 0 26px 10px;overflow:hidden}
.q-grid-scroll {max-height:620px}
.q-data-grid table {font-size:12px}
.q-data-grid th {height:48px;background:color-mix(in srgb,var(--q-surface-alt) 78%,var(--q-surface));border-right-color:color-mix(in srgb,var(--q-border) 42%,transparent)}
.q-data-grid td {height:max(var(--q-row-height),50px);padding:0 15px;transition:background var(--q-motion),transform var(--q-motion)}
.q-data-grid tbody tr {transition:transform var(--q-motion) var(--q-ease),filter var(--q-motion)}
.q-data-grid tbody tr:hover {filter:drop-shadow(0 8px 14px rgba(40,0,14,.07))}
.q-data-grid tbody tr:hover td {background:color-mix(in srgb,var(--q-accent) 6%,var(--q-surface))}
.q-data-grid tbody tr:hover td:first-child {box-shadow:inset 4px 0 var(--q-accent)}
.q-grid-sort {font:800 9px/1 var(--q-font-display);letter-spacing:.12em}
.q-row-actions button {border-radius:10px 10px 10px 4px;transition:transform var(--q-motion),border-color var(--q-motion),background var(--q-motion)}
.q-row-actions button:hover {transform:translateY(-2px);background:var(--q-surface-alt)}
.q-grid-footer {padding:12px 15px;background:color-mix(in srgb,var(--q-surface-alt) 75%,var(--q-surface))}

/* statuses and banners */
.q-status {padding:5px 9px;border-radius:999px;font:800 9px/1 var(--q-font-display);letter-spacing:.09em;box-shadow:inset 0 0 0 1px color-mix(in srgb,currentColor 10%,transparent)}
.q-status::before {width:6px;height:6px;box-shadow:0 0 0 4px color-mix(in srgb,currentColor 10%,transparent)}
.q-state-banner {border-radius:20px 20px 20px 8px;padding:15px 17px;border-left-width:5px;box-shadow:var(--q-shadow-xs);animation:q-banner-in 480ms var(--q-ease) both}
.q-truth-callout {border-radius:22px 22px 22px 9px!important}

/* charts */
.q-chart-stage {
  min-height:390px;border-radius:26px 26px 26px 10px;
  background:
    linear-gradient(90deg,color-mix(in srgb,var(--q-border) 35%,transparent) 1px,transparent 1px),
    linear-gradient(color-mix(in srgb,var(--q-border) 35%,transparent) 1px,transparent 1px),
    radial-gradient(600px 300px at 92% 0,color-mix(in srgb,var(--q-accent) 7%,transparent),transparent 70%),
    linear-gradient(180deg,var(--q-surface),color-mix(in srgb,var(--q-surface-alt) 35%,var(--q-surface)));
  background-size:42px 42px,42px 42px,auto,auto;box-shadow:inset 0 1px rgba(255,255,255,.5),var(--q-shadow-xs);
}
.q-chart-stage svg {height:430px;animation:q-chart-reveal 1000ms var(--q-ease) both}
.q-chart-line,.q-study-line,.q-compare-line {stroke-dasharray:1400;stroke-dashoffset:1400;animation:q-line-draw 1500ms var(--q-ease) 120ms forwards}
.q-candle {transform-origin:center;animation:q-candle-rise 620ms var(--q-ease) both}
.q-comparison-chart {border-radius:24px!important;overflow:hidden}

/* high-value hero modules */
.q-asset-hero {
  min-height:190px;border-radius:38px 38px 38px 15px;padding:34px;
  background:
    radial-gradient(360px 250px at 93% 18%,rgba(255,255,255,.13),transparent 75%),
    linear-gradient(120deg,var(--q-chrome),var(--q-chrome-raised));
  box-shadow:0 34px 90px rgba(40,0,14,.22),inset 0 1px rgba(255,255,255,.12);
}
.q-asset-hero::before {content:"";position:absolute;width:300px;height:300px;border:1px solid rgba(255,255,255,.12);border-radius:46% 54% 38% 62%;right:-110px;top:-130px;animation:q-orbit 22s linear infinite}
.q-asset-identity .q-asset-icon {width:72px;height:72px;border-radius:24px 24px 24px 9px;font-size:23px;box-shadow:inset 0 1px rgba(255,255,255,.2),0 18px 36px rgba(0,0,0,.2)}
.q-asset-identity h1 {font:780 38px/1 var(--q-font-display);letter-spacing:-.045em}
.q-asset-price strong {font-size:40px;letter-spacing:-.055em}
.q-asset-tabs {gap:8px;border-bottom:0;background:var(--q-surface);padding:6px;border-radius:18px 18px 18px 7px;box-shadow:var(--q-shadow-xs)}
.q-asset-tabs button {border-radius:13px;padding:11px 15px;border:0;transition:transform var(--q-motion),background var(--q-motion),color var(--q-motion)}
.q-asset-tabs button:hover {transform:translateY(-2px);background:var(--q-surface-alt)}
.q-asset-tabs button.is-active {background:linear-gradient(145deg,var(--q-accent),var(--q-accent-strong));color:#fff;box-shadow:0 12px 24px var(--q-glow)}

/* cards on discovery, research, venue, provider */
.q-discovery-card-grid,.q-category-grid-large,.q-venue-grid,.q-dex-grid,.q-provider-grid,.q-research-board {gap:18px}
.q-category-card,.q-venue-card,.q-dex-card,.q-provider-card,.q-research-card,.q-notification-card,.q-method-card,.q-section-link,.q-dependency-card,.q-probability-card {
  border-radius:24px 24px 24px 9px!important;box-shadow:var(--q-shadow-xs);
  background:linear-gradient(180deg,var(--q-surface),color-mix(in srgb,var(--q-surface-alt) 26%,var(--q-surface)))!important;
  transition:transform var(--q-motion) var(--q-ease-spring),box-shadow var(--q-motion),border-color var(--q-motion),border-radius var(--q-motion)!important;
}
.q-category-card:hover,.q-venue-card:hover,.q-dex-card:hover,.q-provider-card:hover,.q-research-card:hover,.q-notification-card:hover,.q-method-card:hover,.q-section-link:hover,.q-dependency-card:hover,.q-probability-card:hover {
  transform:translateY(-7px) rotateX(1deg);box-shadow:var(--q-shadow-hover);border-color:color-mix(in srgb,var(--q-accent) 32%,var(--q-border));border-radius:31px 20px 31px 10px!important;
}
.q-research-card h2 {font:800 17px/1.28 var(--q-font-display);letter-spacing:-.025em}
.q-article-shell {border-radius:38px 38px 38px 14px;box-shadow:var(--q-shadow);padding:clamp(30px,6vw,76px)}
.q-article-shell h1,.q-article-shell h2 {font-family:var(--q-font-display);letter-spacing:-.04em}
.q-article-summary {border-left:0;border-radius:24px 24px 24px 9px;padding:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--q-accent) 9%,var(--q-surface-alt)),var(--q-surface-alt));box-shadow:inset 5px 0 var(--q-accent)}

/* theme lab */
.q-theme-layout {grid-template-columns:390px minmax(0,1fr);gap:18px}
.q-theme-choice {border-radius:20px 20px 20px 8px;padding:11px;transition:transform var(--q-motion) var(--q-ease-spring),box-shadow var(--q-motion),border-color var(--q-motion)}
.q-theme-choice:hover {transform:translateY(-5px);box-shadow:var(--q-shadow);border-color:var(--q-accent)}
.q-theme-choice.is-active {box-shadow:var(--q-ring),var(--q-shadow-xs)}
.q-theme-preview {height:66px;border-radius:15px 15px 15px 6px;overflow:hidden}
.q-theme-stage {border-radius:30px 30px 30px 12px;padding:24px;box-shadow:inset 0 0 0 8px color-mix(in srgb,var(--q-chrome) 7%,transparent),var(--q-shadow)}

/* context drawer */
.q-context-drawer {top:124px;height:calc(100vh - 124px);background:color-mix(in srgb,var(--q-surface) 94%,transparent);backdrop-filter:blur(18px);border-left-color:color-mix(in srgb,var(--q-border) 72%,transparent);box-shadow:-20px 0 60px rgba(25,0,9,.08)}
.q-context-head {padding:24px;border-bottom-color:var(--q-border)}
.q-context-head h2 {font:800 22px/1 var(--q-font-display);letter-spacing:-.035em}
.q-context-block {border-radius:21px 21px 21px 8px!important}

/* dialogs */
.q-dialog {border-radius:34px 34px 34px 13px!important;box-shadow:0 48px 120px rgba(22,0,8,.36)!important;animation:q-dialog-in 520ms var(--q-ease-spring) both}
.q-dialog__header {padding:24px 26px!important}
.q-dialog__header h2 {font:800 24px/1 var(--q-font-display);letter-spacing:-.04em}

/* motion classes injected by JS */
.q-motion-item {opacity:0;transform:translateY(18px) scale(.99);transition:opacity 650ms var(--q-ease),transform 650ms var(--q-ease)}
.q-motion-item.is-inview {opacity:1;transform:none}
.q-magnetic {will-change:transform}
.q-pointer-card::after {content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(300px circle at var(--pointer-x,50%) var(--pointer-y,50%),color-mix(in srgb,var(--q-accent) 8%,transparent),transparent 55%);opacity:0;transition:opacity var(--q-motion)}
.q-pointer-card:hover::after {opacity:1}

/* responsive */
@media(max-width:1280px){
  .q-shell{grid-template-columns:238px minmax(0,1fr)}
  .q-shell.is-context-open{grid-template-columns:238px minmax(0,1fr) 340px}
  .q-page-head h1{font-size:clamp(30px,4vw,48px)}
}
@media(max-width:1040px){
  .q-command-bar{height:74px}.q-rail{top:116px;height:calc(100vh - 116px)}
  .q-shell{min-height:calc(100vh - 116px)}
  .q-dashboard-grid{grid-template-columns:1fr}.q-theme-layout{grid-template-columns:1fr}
}
@media(max-width:820px){
  .q-global-strip{height:36px}.q-command-bar{top:36px;height:68px;padding:0 12px}.q-shell{min-height:calc(100vh - 104px)}
  .q-rail{top:104px;height:calc(100vh - 104px)}
  #main{padding:20px 14px 64px;background-size:24px 24px,24px 24px,auto}
  .q-page-head{min-height:136px;padding:24px 22px;border-radius:28px 28px 28px 11px;align-items:flex-start;flex-direction:column}
  .q-page-head h1{font-size:34px}.q-page-actions{justify-content:flex-start}
  .q-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  :root{--q-radius:18px;--q-radius-lg:24px;--q-gap:14px}
  .q-global-strip{padding:0 12px}.q-brand-mark{min-width:auto}.q-brand-mark strong{display:none}.q-macro-strip{gap:10px}.q-truth-chip{display:none}
  .q-workspace-switcher{min-width:0}.q-workspace-switcher strong,.q-workspace-switcher small{display:none}.q-workspace-switcher span{width:38px;height:38px}
  .q-command-trigger span:nth-child(2),.q-command-trigger kbd{display:none}.q-command-trigger{flex:0 0 46px;padding:0;justify-content:center;border-radius:15px}
  .q-page-head{padding:22px 18px;min-height:0}.q-page-head h1{font-size:30px}.q-page-head p{font-size:12px}.q-page-actions{width:100%}.q-page-actions .q-button{flex:1}
  .q-kpi-grid{grid-template-columns:1fr 1fr;gap:12px}.q-kpi{min-height:132px;padding:17px;border-radius:22px 22px 22px 8px}.q-kpi-value{font-size:25px}
  .q-panel{border-radius:23px 23px 23px 9px}.q-panel-head{padding:17px}.q-panel-body{padding:17px}
  .q-asset-hero{padding:24px 18px;grid-template-columns:1fr;min-height:0}.q-asset-price{text-align:left}.q-asset-identity h1{font-size:29px}
  .q-button{min-height:43px}
}

/* animations */
@keyframes q-page-in {from{opacity:0;transform:translateY(20px) scale(.995)}to{opacity:1;transform:none}}
@keyframes q-banner-in {from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
@keyframes q-dialog-in {from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}
@keyframes q-line-draw {to{stroke-dashoffset:0}}
@keyframes q-chart-reveal {from{opacity:.2;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes q-candle-rise {from{opacity:0;transform:scaleY(.15)}to{opacity:1;transform:scaleY(1)}}
@keyframes q-strip-glint {0%,72%{left:-25%}100%{left:125%}}
@keyframes q-pulse {0%,100%{box-shadow:0 0 0 4px color-mix(in srgb,var(--q-simulated) 22%,transparent)}50%{box-shadow:0 0 0 10px transparent}}
@keyframes q-orbit {to{transform:rotate(385deg)}}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
/* Explicit theme typography polarity: light type on dark surfaces, dark type on light surfaces. */
.q-kpi,.q-panel,.q-category-card,.q-venue-card,.q-dex-card,.q-provider-card,.q-research-card,.q-notification-card,.q-method-card,.q-section-link,.q-dependency-card,.q-probability-card,.q-article-shell,.q-theme-stage,.q-dialog,.q-context-drawer{color:var(--q-text)}
.q-kpi-value,.q-panel-head h2,.q-research-card h2,.q-category-card strong,.q-venue-card h2,.q-dex-card b,.q-provider-card strong,.q-notification-card strong,.q-method-card strong,.q-section-link strong,.q-article-shell h1,.q-article-shell h2,.q-article-shell h3{color:var(--q-text)}
.q-kpi-label,.q-kpi-meta,.q-panel-head p,.q-category-card small,.q-venue-card p,.q-venue-card footer,.q-dex-card footer,.q-research-card p,.q-research-card small,.q-notification-card p,.q-notification-card small{color:var(--q-muted)}
:root[data-theme="burgundy-night"] .q-command-bar,:root[data-theme="graphite-terminal"] .q-command-bar,:root[data-theme="midnight-research"] .q-command-bar{background:color-mix(in srgb,var(--q-surface) 93%,transparent)}
:root[data-theme="burgundy-night"] .q-page-head,:root[data-theme="graphite-terminal"] .q-page-head,:root[data-theme="midnight-research"] .q-page-head{color:#fff}
