/* Extracted from dashboard/templates/index.html on 2026-05-28. */
/* Tiny flag-icons override stays inline in ; trifecta-shell */
/* theme bootstrap stays inline (uses Jinja for shell_mode flag). */
/* SDR++ preset card animations */
@keyframes sdrpp-live-pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.4; }
}
.sdrpp-live-pulse {
animation: sdrpp-live-pulse 1.6s ease-in-out infinite;
}
.sdrpp-preset-live {
animation: sdrpp-live-glow 2s ease-in-out infinite;
}
@keyframes sdrpp-live-glow {
0%, 100% { box-shadow: 0 0 0 1px #22c55e44, 0 0 12px #22c55e33; }
50% { box-shadow: 0 0 0 1px #22c55e88, 0 0 18px #22c55e66; }
}
@keyframes sdrpp-preset-flash {
0% { background: #1f2937; border-color: #fbbf24; transform: scale(1); }
25% { background: #422006; border-color: #fbbf24; transform: scale(1.04); }
100% { background: #0d0d0d; border-color: #1f2937; transform: scale(1); }
}
.sdrpp-preset-flash {
animation: sdrpp-preset-flash 0.9s ease-out;
}
/* Preset cards pulse when the most-recent band scan measured them as
listenable. Tier is set by floor-delta-dB (3/8/15 thresholds). */
@keyframes sdrpp-listenable-strong {
0%, 100% { box-shadow: 0 0 0 1px #22c55ecc, 0 0 18px #22c55e88; border-color: #22c55e; }
50% { box-shadow: 0 0 0 1px #22c55eff, 0 0 28px #22c55ebb; border-color: #4ade80; }
}
@keyframes sdrpp-listenable-mid {
0%, 100% { box-shadow: 0 0 0 1px #84cc1699, 0 0 14px #84cc1655; border-color: #84cc16; }
50% { box-shadow: 0 0 0 1px #84cc16cc, 0 0 22px #84cc1688; border-color: #a3e635; }
}
@keyframes sdrpp-listenable-weak {
0%, 100% { box-shadow: 0 0 0 1px #f59e0b66, 0 0 10px #f59e0b33; border-color: #f59e0b88; }
50% { box-shadow: 0 0 0 1px #f59e0b99, 0 0 16px #f59e0b66; border-color: #f59e0b; }
}
.sdrpp-preset-listenable-strong { animation: sdrpp-listenable-strong 2.4s ease-in-out infinite; }
.sdrpp-preset-listenable-mid { animation: sdrpp-listenable-mid 2.8s ease-in-out infinite; }
.sdrpp-preset-listenable-weak { animation: sdrpp-listenable-weak 3.2s ease-in-out infinite; }
/* Scanning banner — animated while a band scan is in flight. */
@keyframes sdrpp-scan-sweep {
0% { transform: translateX(-100%); }
100% { transform: translateX(100%); }
}
@keyframes sdrpp-scan-breathe {
0%, 100% { opacity: 1; transform: scale(1); }
50% { opacity: 0.5; transform: scale(0.78); }
}
@keyframes sdrpp-scan-fill {
0% { background-position: 0% 50%; }
100% { background-position: 200% 50%; }
}
.sdrpp-scanning-banner {
position: relative;
overflow: hidden;
background: linear-gradient(135deg, #0a1f12 0%, #0e0e0e 55%, #0a1f12 100%);
border: 1px solid #22c55e55;
border-radius: 10px;
padding: 14px 16px;
box-shadow: 0 0 0 1px #22c55e22, 0 0 22px #22c55e22;
}
.sdrpp-scanning-banner::before {
content: '';
position: absolute;
top: 0; left: 0; right: 0; bottom: 0;
background: linear-gradient(90deg, transparent 0%, #22c55e33 50%, transparent 100%);
animation: sdrpp-scan-sweep 2.2s linear infinite;
pointer-events: none;
}
.sdrpp-scanning-banner > * { position: relative; z-index: 1; }
.sdrpp-scan-dot {
display: inline-block;
width: 9px; height: 9px;
border-radius: 50%;
background: #22c55e;
box-shadow: 0 0 10px #22c55ecc, 0 0 4px #22c55e;
animation: sdrpp-scan-breathe 0.9s ease-in-out infinite;
vertical-align: middle;
margin-right: 8px;
}
.sdrpp-scan-progress-bar {
height: 5px; margin-top: 10px;
background: #0a0a0a;
border-radius: 3px;
overflow: hidden;
border: 1px solid #1a1a1a;
}
.sdrpp-scan-progress-fill {
height: 100%; width: 0%;
background: linear-gradient(90deg, #22c55e, #84cc16, #22c55e);
background-size: 200% 100%;
animation: sdrpp-scan-fill 2.5s linear infinite;
transition: width 0.45s linear;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', sans-serif;
background: #0f0f0f;
color: #e8e8e8;
min-height: 100vh;
}
body.shell-trifecta-headless {
--shell-bg: #513824;
--shell-surface: #f4f5e8;
--shell-surface-alt: #f0f2e2;
--shell-surface-soft: #e6e8d2;
--shell-surface-strong: #ffffff;
--shell-border: rgba(23,26,19,0.10);
--shell-border-strong: rgba(23,26,19,0.16);
--shell-text: #171a13;
--shell-muted: rgba(23,26,19,0.62);
--shell-subtle: rgba(23,26,19,0.44);
--shell-accent: #e05026;
--shell-accent-alt: #0a7d73;
--shell-input-bg: rgba(255,255,255,0.72);
background: #513824;
color: #171a13;
transition: background 0.22s ease, color 0.22s ease;
}
html.trifecta-theme-dark body.shell-trifecta-headless {
--shell-bg: #283d2e;
--shell-surface: #171a13;
--shell-surface-alt: #1d2118;
--shell-surface-soft: #24291f;
--shell-surface-strong: #2b3126;
--shell-border: rgba(244,245,232,0.08);
--shell-border-strong: rgba(244,245,232,0.14);
--shell-text: #f4f5e8;
--shell-muted: rgba(244,245,232,0.72);
--shell-subtle: rgba(244,245,232,0.48);
--shell-accent: #48e090;
--shell-accent-alt: #dea851;
--shell-input-bg: rgba(255,255,255,0.04);
background: #283d2e;
color: #f4f5e8;
}
/* ── Header ── */
header {
background: #1a1a1a;
border-bottom: 1px solid #f97316;
padding: 16px 28px;
display: flex;
align-items: center;
justify-content: space-between;
position: sticky;
top: 0;
z-index: 100;
}
.header-left { display: flex; align-items: center; gap: 18px; min-width: 0; }
header h1 { font-size: 18px; font-weight: 700; letter-spacing: -0.3px; display: flex; align-items: center; gap: 10px; }
.logo-dog { height: 38px; width: auto; flex-shrink: 0; overflow: visible; display: block; }
.logo-tail-accent { fill: #f97316; }
header h1 span { color: #3b82f6; }
.header-domains {
display: flex; align-items: center; gap: 8px;
padding: 6px; border: 1px solid #2a2a2a; border-radius: 999px; background: #141414;
}
.header-domain {
border: none; background: transparent; color: #777; cursor: pointer;
padding: 8px 14px; border-radius: 999px; font-size: 12px; font-weight: 700;
letter-spacing: 0.2px; transition: all 0.16s ease;
}
.header-domain:hover { color: #e8e8e8; }
.header-domain.active {
background: linear-gradient(135deg, rgba(59,130,246,0.18), rgba(249,115,22,0.16));
color: #f5f5f5;
box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06);
}
.header-domain-dropdown {
position: relative;
}
.header-domain-dropdown-menu {
display: none;
position: absolute;
top: calc(100% + 8px);
left: 0;
min-width: 200px;
padding: 8px;
border-radius: 14px;
border: 1px solid #2a2a2a;
background: #141414;
box-shadow: 0 18px 40px rgba(0,0,0,0.42);
z-index: 240;
}
.header-domain-dropdown.open .header-domain-dropdown-menu {
display: block;
}
.header-other-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
width: 100%;
padding: 10px 12px;
border: none;
background: transparent;
color: #aaa;
font-size: 12px;
font-weight: 600;
border-radius: 10px;
cursor: pointer;
text-align: left;
}
.header-other-item:hover {
background: #1d1d1d;
color: #f0f0f0;
}
.header-other-item.active {
background: rgba(59,130,246,0.14);
color: #93c5fd;
}
.header-other-item-label {
display: inline-flex;
align-items: center;
gap: 8px;
}
.header-other-item-check {
color: #3b82f6;
font-size: 11px;
visibility: hidden;
}
.header-other-item.active .header-other-item-check {
visibility: visible;
}
.header-right { display: flex; align-items: center; gap: 16px; font-size: 12px; color: #666; }
.regime-badge {
padding: 4px 10px; border-radius: 20px; font-weight: 700; font-size: 11px;
}
.regime-BULL { background: #052e16; color: #22c55e; }
.regime-CHOP { background: #2d2000; color: #eab308; }
.regime-BEAR { background: #2d0000; color: #ef4444; }
.regime-UNKNOWN { background: #2d1800; color: #f97316; }
body.shell-trifecta-headless header {
background: transparent;
border-bottom: none;
padding: 24px 24px 18px;
position: relative;
top: auto;
}
body.shell-trifecta-headless .header-left {
gap: 14px;
}
body.shell-trifecta-headless header h1 {
gap: 14px;
}
body.shell-trifecta-headless .header-right {
gap: 12px;
color: rgba(23,26,19,0.72);
}
html.trifecta-theme-dark body.shell-trifecta-headless .header-right {
color: rgba(244,245,232,0.72);
}
body.shell-trifecta-headless .logo-dog {
display: block;
width: 106px;
height: 55px;
object-fit: contain;
}
.trifecta-shell-logo-mark {
width: 106px;
height: 55px;
flex: 0 0 auto;
display: block;
background-color: #E05026;
-webkit-mask: url("/static/trifecta-headless-logo.svg") center / contain no-repeat;
mask: url("/static/trifecta-headless-logo.svg") center / contain no-repeat;
}
html.trifecta-theme-dark .trifecta-shell-logo-mark {
background-color: #49E090;
}
body.shell-trifecta-headless .trifecta-shell-logo-mark {
display: none;
}
.trifecta-shell-logo-home {
cursor: pointer;
border-radius: 18px;
transition: transform 0.16s ease, opacity 0.16s ease;
}
.trifecta-shell-logo-home:hover {
transform: translateY(-1px);
opacity: 0.88;
}
body.shell-trifecta-headless #regime-badge {
display: none;
}
.trifecta-shell-actions {
display: flex;
align-items: center;
gap: 12px;
}
.trifecta-shell-menu-toggle {
display: none !important;
}
.trifecta-shell-icon-btn {
width: 46px;
height: 46px;
border-radius: 999px;
border: 1px solid rgba(23,26,19,0.14);
background: rgba(240,242,226,0.82);
color: #171a13;
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: transform 0.16s ease, background 0.16s ease, border-color 0.16s ease;
backdrop-filter: blur(8px);
}
.trifecta-shell-icon-btn:hover {
transform: translateY(-1px);
background: rgba(240,242,226,0.96);
}
html.trifecta-theme-dark .trifecta-shell-icon-btn {
border-color: rgba(244,245,232,0.14);
background: rgba(23,26,19,0.78);
color: #f4f5e8;
}
html.trifecta-theme-dark .trifecta-shell-icon-btn:hover {
background: rgba(23,26,19,0.92);
}
.trifecta-shell-icon {
width: 21px;
height: 21px;
display: block;
}
.trifecta-theme-icon-light,
.trifecta-theme-icon-dark {
width: 21px;
height: 21px;
display: none;
flex: 0 0 auto;
}
.trifecta-theme-icon-light {
color: #E05026;
}
.trifecta-theme-icon-dark {
color: #49E090;
}
.trifecta-shell-menu-toggle {
display: none !important;
}
html.trifecta-theme-light .trifecta-theme-icon-light,
html:not(.trifecta-theme-dark) .trifecta-theme-icon-light {
display: block;
}
html.trifecta-theme-dark .trifecta-theme-icon-dark {
display: block;
}
.trifecta-shell-menu-overlay {
position: fixed;
inset: 0;
background: rgba(23,26,19,0.32);
backdrop-filter: blur(8px);
z-index: 260;
display: none;
padding: 24px;
}
.trifecta-shell-menu-overlay.open {
display: block;
}
.trifecta-qb-gate-overlay {
position: fixed;
inset: 0;
z-index: 420;
display: none;
align-items: center;
justify-content: center;
padding: 24px;
background: rgba(23,26,19,0.56);
backdrop-filter: blur(10px);
}
.trifecta-qb-gate-overlay.open {
display: flex;
}
.trifecta-qb-gate-card {
width: min(480px, 100%);
border-radius: 28px;
border: 1px solid rgba(23,26,19,0.10);
background: #f0f2e2;
box-shadow: 0 32px 92px rgba(0,0,0,0.26);
padding: 28px;
color: #171a13;
}
html.trifecta-theme-dark .trifecta-qb-gate-card {
border-color: rgba(244,245,232,0.12);
background: #171a13;
color: #f4f5e8;
}
.trifecta-qb-gate-card h2 {
margin: 8px 0 8px;
font-size: clamp(2rem, 5vw, 3rem);
letter-spacing: -0.06em;
line-height: 0.92;
}
.trifecta-qb-gate-card p {
margin: 0 0 20px;
color: rgba(23,26,19,0.68);
font-size: 1rem;
line-height: 1.5;
}
html.trifecta-theme-dark .trifecta-qb-gate-card p {
color: rgba(244,245,232,0.70);
}
.trifecta-qb-gate-input {
width: 100%;
box-sizing: border-box;
border-radius: 16px;
border: 1px solid rgba(23,26,19,0.16);
background: rgba(255,255,255,0.76);
padding: 14px 16px;
font: inherit;
color: inherit;
outline: none;
}
.trifecta-qb-gate-input:focus {
border-color: rgba(224,80,38,0.66);
box-shadow: 0 0 0 4px rgba(224,80,38,0.14);
}
html.trifecta-theme-dark .trifecta-qb-gate-input {
border-color: rgba(244,245,232,0.16);
background: rgba(244,245,232,0.08);
}
.trifecta-qb-gate-error {
min-height: 20px;
margin-top: 10px;
color: #b23119;
font-weight: 800;
font-size: 0.88rem;
}
.trifecta-qb-gate-actions {
display: flex;
justify-content: flex-end;
gap: 10px;
margin-top: 16px;
flex-wrap: wrap;
}
.trifecta-shell-menu {
margin-left: auto;
width: min(420px, 100%);
min-height: 100%;
background: #f0f2e2;
border-radius: 28px;
border: 1px solid rgba(23,26,19,0.08);
box-shadow: 0 24px 64px rgba(0,0,0,0.18);
padding: 26px 24px 24px;
display: flex;
flex-direction: column;
gap: 20px;
}
html.trifecta-theme-dark .trifecta-shell-menu {
background: #171a13;
border-color: rgba(244,245,232,0.08);
box-shadow: 0 24px 72px rgba(0,0,0,0.34);
}
.trifecta-shell-menu-head {
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
}
.trifecta-shell-menu-title {
font-size: 12px;
font-weight: 700;
letter-spacing: 0.16em;
text-transform: uppercase;
color: rgba(23,26,19,0.54);
}
html.trifecta-theme-dark .trifecta-shell-menu-title {
color: rgba(244,245,232,0.54);
}
.trifecta-shell-menu-list {
display: grid;
gap: 12px;
}
.trifecta-shell-menu-item {
width: 100%;
border: 1px solid rgba(23,26,19,0.08);
border-radius: 18px;
background: rgba(255,255,255,0.48);
padding: 16px 18px;
text-align: left;
cursor: pointer;
transition: border-color 0.16s ease, background 0.16s ease, transform 0.16s ease;
color: #171a13;
}
.trifecta-shell-menu-item:hover {
transform: translateY(-1px);
border-color: rgba(224,80,38,0.36);
}
.trifecta-shell-menu-item.active {
background: #171a13;
color: #f4f5e8;
border-color: #171a13;
}
.trifecta-shell-menu-item-label {
display: block;
font-size: 16px;
font-weight: 700;
letter-spacing: -0.02em;
margin-bottom: 4px;
}
.trifecta-shell-menu-item-copy {
display: block;
font-size: 12px;
line-height: 1.5;
color: rgba(23,26,19,0.62);
}
.trifecta-shell-menu-item.active .trifecta-shell-menu-item-copy {
color: rgba(244,245,232,0.7);
}
html.trifecta-theme-dark .trifecta-shell-menu-item {
background: rgba(255,255,255,0.03);
border-color: rgba(244,245,232,0.08);
color: #f4f5e8;
}
html.trifecta-theme-dark .trifecta-shell-menu-item-copy {
color: rgba(244,245,232,0.62);
}
html.trifecta-theme-dark .trifecta-shell-menu-item.active {
background: #f0f2e2;
color: #171a13;
border-color: #f0f2e2;
}
html.trifecta-theme-dark .trifecta-shell-menu-item.active .trifecta-shell-menu-item-copy {
color: rgba(23,26,19,0.72);
}
.trifecta-shell-status {
font-size: 11px;
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(23,26,19,0.52);
}
html.trifecta-theme-dark .trifecta-shell-status {
color: rgba(244,245,232,0.5);
}
/* ── Layout ── */
.container { max-width: 1400px; margin: 0 auto; padding: 24px 28px; }
body.shell-trifecta-headless .container {
max-width: 1520px;
padding: 0 24px 32px;
margin-bottom: 32px;
background: #f4f5e8;
border-radius: 32px 32px 0 0;
box-shadow: 0 -1px 0 rgba(255,255,255,0.32), 0 18px 56px rgba(0,0,0,0.12);
}
html.trifecta-theme-dark body.shell-trifecta-headless .container {
background: #171a13;
box-shadow: 0 -1px 0 rgba(255,255,255,0.06), 0 18px 56px rgba(0,0,0,0.28);
}
body.shell-trifecta-headless #tab-client_intelligence > .section-header:first-child {
margin-top: 0;
padding-top: 15px;
}
body.shell-trifecta-headless #tab-client_intelligence > .section-header:first-child,
body.shell-trifecta-headless #tab-opportunity_bot > .section-header:first-child,
body.shell-trifecta-headless #tab-quickbooks > .section-header:first-child,
body.shell-trifecta-headless #tab-delegation > .section-header:first-child {
margin-top: 0;
padding-top: 15px;
}
body.shell-trifecta-headless #tab-client_intelligence > .section-header:first-child {
position: sticky;
top: 0;
z-index: 35;
padding: 15px 0 12px;
margin-bottom: 6px;
background: linear-gradient(180deg, var(--shell-surface-alt) 0%, var(--shell-surface-alt) 78%, rgba(0,0,0,0) 100%);
backdrop-filter: blur(10px);
border-bottom: 1px solid var(--shell-border);
}
body.shell-trifecta-headless #tab-opportunity_bot > .section-header:first-child {
position: sticky;
top: 0;
z-index: 35;
padding: 15px 0 12px;
margin-bottom: 18px;
background: linear-gradient(180deg, var(--shell-surface-alt) 0%, var(--shell-surface-alt) 78%, rgba(0,0,0,0) 100%);
backdrop-filter: blur(10px);
border-bottom: 1px solid var(--shell-border);
}
body.shell-trifecta-headless .client-intel-search-sticky {
position: sticky;
top: 74px;
z-index: 24;
margin-bottom: 0;
background: var(--shell-surface-alt);
border-color: var(--shell-border);
box-shadow: 0 10px 26px rgba(0,0,0,0.12);
}
body.shell-trifecta-headless .client-intel-top-row {
position: relative;
top: auto;
z-index: auto;
padding-bottom: 8px;
margin-bottom: 0;
background: transparent;
backdrop-filter: none;
}
body.shell-trifecta-headless #client-intel-insights-card {
background: var(--shell-surface-alt);
border-color: var(--shell-border);
box-shadow: 0 10px 26px rgba(0,0,0,0.10);
}
body.shell-trifecta-headless #client-intel-insights-card.client-intel-insights-sticky-active {
position: sticky;
top: 74px;
z-index: 23;
}
body.shell-trifecta-headless #client-intel-insights {
display: grid;
gap: 16px;
}
body.shell-trifecta-headless .client-intel-opportunity-sticky {
position: relative;
top: auto;
z-index: auto;
background: var(--shell-surface-alt);
border-color: var(--shell-border);
box-shadow: 0 10px 26px rgba(0,0,0,0.10);
}
body.shell-trifecta-headless .client-intel-opportunity-toggle {
cursor: pointer;
list-style: none;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
body.shell-trifecta-headless .client-intel-opportunity-toggle::-webkit-details-marker {
display: none;
}
body.shell-trifecta-headless .client-intel-opportunity-caret {
color: var(--shell-muted);
transition: transform 0.18s ease;
font-size: 12px;
}
body.shell-trifecta-headless details[open] > .client-intel-opportunity-toggle .client-intel-opportunity-caret {
transform: rotate(180deg);
}
body.shell-trifecta-headless .opportunity-bot-search-sticky {
position: sticky;
top: 74px;
z-index: 30;
margin-bottom: 18px;
background: var(--shell-surface-alt);
border-color: var(--shell-border);
box-shadow: 0 10px 26px rgba(0,0,0,0.12);
padding: 14px 16px;
}
body.shell-trifecta-headless .opportunity-bot-hero-sticky {
position: sticky;
top: 194px;
z-index: 26;
margin-bottom: 18px;
background: var(--shell-surface-alt);
border-color: var(--shell-border);
box-shadow: 0 10px 26px rgba(0,0,0,0.10);
padding: 12px 16px 14px;
}
body.shell-trifecta-headless .opportunity-bot-hero-toggle {
cursor: pointer;
list-style: none;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
margin: 0;
padding: 0;
}
body.shell-trifecta-headless .opportunity-bot-hero-toggle::-webkit-details-marker {
display: none;
}
body.shell-trifecta-headless .opportunity-bot-hero-caret {
color: var(--shell-muted);
transition: transform 0.18s ease;
font-size: 12px;
}
body.shell-trifecta-headless details[open] > .opportunity-bot-hero-toggle .opportunity-bot-hero-caret {
transform: rotate(180deg);
}
body.shell-trifecta-headless .opportunity-bot-fixed-controls {
position: sticky;
top: 0;
z-index: 36;
padding: 15px 0 12px;
margin-bottom: 16px;
background: var(--shell-bg);
box-shadow: 0 12px 24px rgba(0,0,0,0.08);
}
body.shell-trifecta-headless .opportunity-bot-workspace {
display: grid;
grid-template-columns: minmax(0,1.25fr) minmax(340px,0.75fr);
gap: 16px;
align-items: start;
}
body.shell-trifecta-headless .opportunity-bot-queue-column {
min-width: 0;
}
body.shell-trifecta-headless .opportunity-bot-queue-scroll {
max-height: none;
overflow-y: visible;
overscroll-behavior: contain;
padding-right: 8px;
}
body.shell-trifecta-headless #opportunity-bot-pagination-top-slot {
position: sticky;
top: 76px;
z-index: 32;
margin-bottom: 12px;
}
body.shell-trifecta-headless .opportunity-bot-pagination-top {
position: static;
padding: 12px 14px;
margin: 0;
border: 1px solid var(--shell-border);
border-radius: 14px;
background: linear-gradient(180deg, var(--shell-surface-alt), rgba(16,18,21,0.94));
backdrop-filter: blur(10px);
box-shadow: 0 10px 24px rgba(0,0,0,0.14);
}
body.shell-trifecta-headless .opportunity-bot-pagination-bottom {
position: static !important;
top: auto !important;
bottom: auto !important;
z-index: auto;
display: flex;
justify-content: space-between;
gap: 10px;
align-items: center;
flex-wrap: wrap;
margin-top: 12px;
}
body.shell-trifecta-headless .opportunity-bot-selected-sticky {
position: sticky;
top: 92px;
max-height: calc(100vh - 112px);
overflow-y: auto;
}
body.shell-trifecta-headless #tab-delegation > .section-header:first-child {
position: sticky;
top: 0;
z-index: 35;
padding: 15px 0 12px;
margin-bottom: 18px;
background: linear-gradient(180deg, var(--shell-surface-alt) 0%, var(--shell-surface-alt) 78%, rgba(0,0,0,0) 100%);
backdrop-filter: blur(10px);
border-bottom: 1px solid var(--shell-border);
}
body.shell-trifecta-headless .section-title,
body.shell-trifecta-headless .qb-panel-title,
body.shell-trifecta-headless .qb-block-title,
body.shell-trifecta-headless .delegation-headline,
body.shell-trifecta-headless .delegation-option-name,
body.shell-trifecta-headless .client-intel-task-title,
body.shell-trifecta-headless .client-intel-selection-title,
body.shell-trifecta-headless .client-intel-stat-value,
body.shell-trifecta-headless .client-intel-offer-name,
body.shell-trifecta-headless .client-intel-finding,
body.shell-trifecta-headless .merrill-desc,
body.shell-trifecta-headless .opp-symbol,
body.shell-trifecta-headless .qb-hero-status-text,
body.shell-trifecta-headless .qb-gap-hero,
body.shell-trifecta-headless .qb-mini-value,
body.shell-trifecta-headless .qb-subtotal-card .value,
body.shell-trifecta-headless .qb-panel-stat .value,
body.shell-trifecta-headless .summary-card .value,
body.shell-trifecta-headless .metric .m-value,
body.shell-trifecta-headless .trade-summary-value,
body.shell-trifecta-headless .trade-symbol {
color: var(--shell-text) !important;
}
body.shell-trifecta-headless .section-sub,
body.shell-trifecta-headless .qb-hero-kicker,
body.shell-trifecta-headless .qb-hero-title-main,
body.shell-trifecta-headless .qb-hero-status-label,
body.shell-trifecta-headless .qb-mini-label,
body.shell-trifecta-headless .qb-mini-sub,
body.shell-trifecta-headless .qb-panel-stat .label,
body.shell-trifecta-headless .qb-panel-stat .sub,
body.shell-trifecta-headless .qb-block-sub,
body.shell-trifecta-headless .delegation-copy,
body.shell-trifecta-headless .delegation-kicker,
body.shell-trifecta-headless .delegation-option-meta,
body.shell-trifecta-headless .client-intel-kicker,
body.shell-trifecta-headless .client-intel-stat-label,
body.shell-trifecta-headless .client-intel-stat-sub,
body.shell-trifecta-headless .client-intel-task-detail,
body.shell-trifecta-headless .client-intel-copy,
body.shell-trifecta-headless .client-intel-action,
body.shell-trifecta-headless .client-intel-note,
body.shell-trifecta-headless .merrill-portfolio,
body.shell-trifecta-headless .opp-desc,
body.shell-trifecta-headless .opp-meta,
body.shell-trifecta-headless .qb-gap-chip,
body.shell-trifecta-headless .client-intel-empty,
body.shell-trifecta-headless .trades-empty-sub,
body.shell-trifecta-headless .trade-time,
body.shell-trifecta-headless .summary-card .label,
body.shell-trifecta-headless .summary-card .sub,
body.shell-trifecta-headless .metric .m-label {
color: var(--shell-muted) !important;
}
body.shell-trifecta-headless .summary-card,
body.shell-trifecta-headless .qb-panel-card,
body.shell-trifecta-headless .qb-scenario-card,
body.shell-trifecta-headless .qb-settings-card,
body.shell-trifecta-headless .qb-hourly-card,
body.shell-trifecta-headless .qb-advanced-card,
body.shell-trifecta-headless .delegation-hero-card,
body.shell-trifecta-headless .delegation-list-card,
body.shell-trifecta-headless .delegation-dev-card,
body.shell-trifecta-headless .delegation-settings-card,
body.shell-trifecta-headless .client-intel-card,
body.shell-trifecta-headless .client-intel-source-card,
body.shell-trifecta-headless .client-intel-task-card,
body.shell-trifecta-headless .client-intel-open-task,
body.shell-trifecta-headless .client-intel-offer-item,
body.shell-trifecta-headless .client-intel-mini-stat,
body.shell-trifecta-headless .client-intel-insight,
body.shell-trifecta-headless .merrill-card,
body.shell-trifecta-headless .opp-card,
body.shell-trifecta-headless .trade-card,
body.shell-trifecta-headless .trade-summary-card {
background: var(--shell-surface-alt) !important;
border-color: var(--shell-border) !important;
color: var(--shell-text) !important;
box-shadow: none !important;
}
body.shell-trifecta-headless .qb-hero,
body.shell-trifecta-headless .delegation-settings-panel,
body.shell-trifecta-headless .qb-block,
body.shell-trifecta-headless .client-intel-selection-preview,
body.shell-trifecta-headless #client-intel-email-modal,
body.shell-trifecta-headless #client-intel-asana-modal,
body.shell-trifecta-headless #client-intel-piggyback-modal,
body.shell-trifecta-headless #client-intel-add-task-modal {
background: var(--shell-surface-alt) !important;
border-color: var(--shell-border-strong) !important;
color: var(--shell-text) !important;
box-shadow: 0 18px 44px rgba(0,0,0,0.12) !important;
}
body.shell-trifecta-headless .qb-hero {
background:
radial-gradient(circle at top right, color-mix(in srgb, var(--shell-accent-alt) 26%, transparent), transparent 34%),
radial-gradient(circle at bottom left, color-mix(in srgb, var(--shell-accent) 18%, transparent), transparent 30%),
linear-gradient(145deg, var(--shell-surface-strong) 0%, var(--shell-surface-alt) 62%, var(--shell-surface) 100%) !important;
}
body.shell-trifecta-headless .qb-hero-status,
body.shell-trifecta-headless .sleeve-note,
body.shell-trifecta-headless .client-intel-contact-pill,
body.shell-trifecta-headless .client-intel-pill,
body.shell-trifecta-headless .delegation-option {
background: var(--shell-surface-soft) !important;
border-color: var(--shell-border) !important;
color: var(--shell-text) !important;
}
body.shell-trifecta-headless .client-intel-field input,
body.shell-trifecta-headless .client-intel-field textarea,
body.shell-trifecta-headless .client-intel-field select,
body.shell-trifecta-headless .client-intel-email-field input,
body.shell-trifecta-headless .client-intel-email-field textarea,
body.shell-trifecta-headless .client-intel-email-field select,
body.shell-trifecta-headless .client-intel-hubspot-note textarea,
body.shell-trifecta-headless .client-intel-hubspot-compose input,
body.shell-trifecta-headless .client-intel-hubspot-compose textarea,
body.shell-trifecta-headless .client-intel-hubspot-compose select,
body.shell-trifecta-headless .client-intel-table input,
body.shell-trifecta-headless .client-intel-table select,
body.shell-trifecta-headless .client-intel-table textarea,
body.shell-trifecta-headless .qb-period-select,
body.shell-trifecta-headless .qb-setting-field input,
body.shell-trifecta-headless .delegation-hours-input,
body.shell-trifecta-headless .alloc-input {
background: var(--shell-input-bg) !important;
border-color: var(--shell-border-strong) !important;
color: var(--shell-text) !important;
}
/* Style the native