/* SpyQiNex redesign skin — additive layer. Loaded after all existing styles.
   Re-maps the app's own CSS variables, so every tab inherits the new palette.
   No existing JS, IDs or handlers are changed. */
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,500;12..96,600;12..96,700&family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500&display=swap');

/* ---------- palettes (override the app's variables) ---------- */
html, html[data-skin="dark"] {
  --bg:#0A0C0B; --surface:#111412; --surface2:#171B18; --surface3:#1E231F;
  --border:#232824; --border-light:#323A33;
  --accent:#D4F24A; --accent-dim:rgba(212,242,74,.12);
  --green:#3DD6A0; --green-dim:rgba(61,214,160,.12);
  --red:#FF6B5E; --red-dim:rgba(255,107,94,.12);
  --blue:#7AA2FF; --text:#E8ECE6; --muted:#8A948C; --muted2:#9AA39B;
  --r:10px; --on-accent:#0A0C0B; --sqx-hero-filter:none;
}
html[data-skin="midnight"]{--bg:#070B14;--surface:#0D1220;--surface2:#151C2E;--surface3:#1C2540;--border:#1F2840;--border-light:#2D3957;--accent:#7AA2FF;--accent-dim:rgba(122,162,255,.14);--text:#E6EBF7;--muted:#7C87A6;--muted2:#A0AAC4;--green:#41D6A8;--red:#FF7A70;--on-accent:#06101F;--sqx-hero-filter:hue-rotate(150deg) saturate(1.1)}
html[data-skin="slate"]{--bg:#13171D;--surface:#1A1F27;--surface2:#222935;--surface3:#2A3342;--border:#2C3541;--border-light:#3B4655;--accent:#7CC8F0;--accent-dim:rgba(124,200,240,.14);--text:#E8ECF1;--muted:#8793A2;--muted2:#A6B0BD;--green:#4ADBA5;--red:#FF7B70;--on-accent:#08141C;--sqx-hero-filter:hue-rotate(135deg) saturate(.9)}
html[data-skin="mist"]{--bg:#EBEEF1;--surface:#F4F6F8;--surface2:#E8ECEF;--surface3:#DEE3E8;--border:#D5DAE0;--border-light:#BBC3CC;--accent:#3E5F00;--accent-dim:rgba(62,95,0,.1);--text:#14181D;--muted:#5F6B77;--muted2:#4F5A66;--green:#0B7F59;--green-dim:rgba(11,127,89,.1);--red:#B8322A;--red-dim:rgba(184,50,42,.1);--blue:#2B6CB0;--on-accent:#fff;--sqx-hero-filter:invert(1) hue-rotate(180deg) brightness(1.05)}
html[data-skin="white"]{--bg:#FFFFFF;--surface:#F6F7F6;--surface2:#EEF0EE;--surface3:#E5E8E5;--border:#E3E6E3;--border-light:#CBD0CB;--accent:#3E5F00;--accent-dim:rgba(62,95,0,.1);--text:#101310;--muted:#66706A;--muted2:#555E57;--green:#0B7F59;--green-dim:rgba(11,127,89,.1);--red:#B8322A;--red-dim:rgba(184,50,42,.1);--blue:#2B6CB0;--on-accent:#fff;--sqx-hero-filter:invert(1) hue-rotate(180deg) brightness(1.1)}
html[data-skin="mist"],html[data-skin="white"]{color-scheme:light}

/* ---------- type ---------- */
body{font-family:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
h1,h2,.tab-content>h2{font-family:'Bricolage Grotesque','Geist',system-ui,sans-serif;letter-spacing:-.02em}
::selection{background:var(--accent);color:var(--on-accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- top navigation (replaces visible sidebar) ---------- */
#sidebar{display:none}
#sidebar.sqx-drawer{display:flex;position:fixed;top:52px;left:0;bottom:0;width:260px;z-index:900;box-shadow:24px 0 60px rgba(0,0,0,.45)}
.app-wrapper{flex-direction:column}
.app-body{flex-direction:column}
.sqx-nav{position:sticky;top:0;z-index:800;flex:none;height:52px;display:flex;align-items:center;gap:6px;padding:0 24px;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--border)}
.sqx-logo{font:600 18px 'Bricolage Grotesque','Geist',sans-serif;letter-spacing:-.01em;margin-right:20px;color:var(--text);white-space:nowrap;cursor:pointer;background:none;border:0;padding:0}
.sqx-logo b{color:var(--accent);font-weight:700}
.sqx-groups{display:flex;flex:1;gap:2px;min-width:0}
.sqx-dd{position:relative}
.sqx-trg{background:none;border:0;color:var(--muted2);font:500 13px 'Geist',sans-serif;padding:16px 12px;cursor:pointer;transition:color .15s}
.sqx-trg:hover,.sqx-dd.open .sqx-trg,.sqx-dd:focus-within .sqx-trg,.sqx-dd.has-active .sqx-trg{color:var(--text)}
.sqx-dd.has-active .sqx-trg{box-shadow:inset 0 -2px 0 var(--accent)}
.sqx-menu{position:absolute;top:52px;left:-12px;min-width:230px;padding:10px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);display:none;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.sqx-menu.wide{min-width:440px;columns:2;column-gap:6px}
.sqx-dd:hover .sqx-menu,.sqx-dd.open .sqx-menu,.sqx-dd:focus-within .sqx-menu{display:block;animation:sqxdd .22s cubic-bezier(.16,1,.3,1)}
@keyframes sqxdd{from{opacity:0;transform:translateY(-4px)}}
.sqx-menu button{display:block;width:100%;text-align:left;break-inside:avoid;background:none;border:0;color:var(--muted2);font:400 13.5px 'Geist',sans-serif;padding:8px 12px;border-radius:6px;cursor:pointer}
.sqx-menu button:hover{background:var(--surface2);color:var(--text)}
.sqx-menu button.active{color:var(--accent);background:var(--accent-dim)}
.sqx-right{display:flex;align-items:center;gap:6px;margin-left:auto}
.sqx-arrange{background:none;border:1px solid var(--border-light);color:var(--muted2);font:500 12px 'Geist',sans-serif;padding:5px 11px;border-radius:99px;cursor:pointer}
.sqx-arrange:hover{color:var(--text);border-color:var(--muted)}
.sqx-themes{display:flex;gap:4px;margin-right:6px}
.sqx-themes button{width:20px;height:20px;border-radius:50%;border:1px solid var(--border-light);cursor:pointer;padding:0;position:relative;overflow:hidden;background:var(--sw-bg)}
.sqx-themes button:after{content:"";position:absolute;right:0;bottom:0;width:10px;height:10px;background:var(--sw-ac);border-top-left-radius:10px}
.sqx-themes button[aria-pressed="true"]{outline:2px solid var(--accent);outline-offset:2px}
.sqx-themes [data-s="dark"]{--sw-bg:#0A0C0B;--sw-ac:#D4F24A}
.sqx-themes [data-s="midnight"]{--sw-bg:#070B14;--sw-ac:#7AA2FF}
.sqx-themes [data-s="slate"]{--sw-bg:#1A1F27;--sw-ac:#7CC8F0}
.sqx-themes [data-s="mist"]{--sw-bg:#EBEEF1;--sw-ac:#3E5F00}
.sqx-themes [data-s="white"]{--sw-bg:#FFFFFF;--sw-ac:#3E5F00}
@media(max-width:900px){.sqx-groups,.sqx-arrange{display:none}.sqx-nav{padding:0 14px}.sqx-logo{margin-right:auto}}

/* ---------- controls ---------- */
.btn-primary,.sqn-auth-btn{background:var(--accent);color:var(--on-accent)}

/* ---------- sign-in: media layer behind existing card ---------- */
#sqnAuthOverlay{position:fixed;overflow:hidden}
.sqx-auth-media{position:absolute;inset:0;z-index:0;background:var(--bg) url(/static/img/redesign/ridge.jpg) center/cover;filter:var(--sqx-hero-filter,none)}
.sqx-auth-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sqx-auth-media:after{content:"";position:absolute;inset:0;background:color-mix(in srgb,var(--bg) 52%,transparent)}
#sqnAuthOverlay>.sqn-auth-card{position:relative;z-index:1}
@media(prefers-reduced-motion:reduce){.sqx-auth-media video{display:none}}

/* sign-in polish: drop gradient wordmark, use palette accent */
.sqn-auth-card{background:var(--surface);border-color:var(--border);border-radius:var(--r)}
.sqn-auth-logo{background:none!important;-webkit-text-fill-color:var(--text)!important;color:var(--text)!important;font-family:'Bricolage Grotesque','Geist',sans-serif;letter-spacing:-.02em}
.sqn-auth-link,.sqn-auth-card a{color:var(--accent)!important}
.sqn-auth-btn{background:var(--accent)!important;color:var(--on-accent)!important;border-radius:99px}
.sqn-auth-card input{background:var(--bg);border-color:var(--border-light);color:var(--text)}
/* light schemes: the top market strip was hard-coded dark */
html[data-skin="mist"] .ticker-section,html[data-skin="white"] .ticker-section{background:var(--surface2)!important}

/* slow drifting background for the sign-in (code-only; replaced by video if login-loop.mp4 exists) */
.sqx-auth-media{animation:sqxdrift 38s ease-in-out infinite alternate;transform-origin:70% 60%}
@keyframes sqxdrift{from{transform:scale(1.04) translate3d(0,0,0)}to{transform:scale(1.14) translate3d(-2.2%,-1.4%,0)}}
@media(prefers-reduced-motion:reduce){.sqx-auth-media{animation:none}}

/* =====================================================================
   v2 editorial layer: matches the redesign mockups across every tab.
   Pure presentation. No selectors target behaviour, no handlers touched.
   ===================================================================== */
html,body{background:var(--bg)!important;color:var(--text)}
body{font-size:15px;line-height:1.5}
body::before,body::after{background-image:none!important;box-shadow:none!important}
.app-wrapper{background:var(--bg)}
.main-content{background:var(--bg)!important}
.container{max-width:none!important;background:transparent!important;box-shadow:none!important}

/* chrome order: brand navigation first, then the quiet status strips */
.app-wrapper>#squeezeAlertBanner{order:-6}
.app-wrapper>.sqx-nav{order:-5}
.app-wrapper>.live-ticker-bar{order:-4}
.app-wrapper>.header{order:-3}

.live-ticker-bar{background:var(--bg)!important;border:0!important;border-bottom:1px solid var(--border)!important;box-shadow:none!important;padding:4px 28px!important;min-height:0!important;font-size:12px!important;color:var(--muted2)!important;white-space:nowrap}
.live-ticker-bar *{font-size:inherit}
.live-ticker-bar .btn,.live-ticker-bar button{padding:3px 10px!important;font-size:11px!important}
.header{background:var(--bg)!important;background-image:none!important;border:0!important;border-bottom:1px solid var(--border)!important;box-shadow:none!important;padding:8px 28px!important;min-height:0!important}
.header .header-text,.header .punchline{display:none!important}
.header-content{gap:12px!important;justify-content:space-between!important}
.header-actions{gap:12px!important;flex-wrap:wrap}
.header-status-panel,.trading-mode-panel{background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0 14px!important;margin:0!important}
.header-status-panel{border-right:1px solid var(--border)!important}
.header-stat-group,.header-bot-controls{gap:10px!important}

/* page head: large display type, open layout */
.tab-content{padding:44px 28px 120px!important;max-width:1220px;margin:0 auto;width:100%;box-sizing:border-box;background:transparent!important}
.dashboard-section-header{display:block!important;font:600 clamp(36px,4.6vw,62px)/1.03 'Bricolage Grotesque','Geist',sans-serif!important;letter-spacing:-.035em!important;border:0!important;padding:0!important;margin:20px 0 44px!important;color:var(--text)!important;background:none!important}
.dashboard-section-header>i,.dashboard-section-header>svg,.dashboard-section-header .lucide{display:none!important}
.dashboard-section-header small,.dashboard-section-header>span:last-child:not(:first-child){display:block!important;margin:16px 0 0!important;font:400 19px/1.45 'Geist',sans-serif!important;letter-spacing:0!important;color:var(--muted2)!important;max-width:52ch}
h2,h3{font-family:'Bricolage Grotesque','Geist',sans-serif;letter-spacing:-.02em}

/* open sections instead of boxed cards */
.perf-card,.stat-card,.settings-section,.perf-section,.monitor-card,.ticker-section,.rs-section,.rs-rsi-card,.matrix-card,.az-card,.sim-card,.card,.panel{background:transparent!important;border:0!important;border-top:1px solid var(--border)!important;border-radius:0!important;box-shadow:none!important;padding:22px 0!important;margin-bottom:0!important}
.trading-grid{gap:56px 64px!important}
.perf-card:hover,.stat-card:hover{transform:none!important}
.perf-card-title,.ticker-title,.rs-section-title,.settings-section>h3{font:600 22px/1.15 'Bricolage Grotesque','Geist',sans-serif!important;letter-spacing:-.02em!important;color:var(--text)!important;text-transform:none!important}
.perf-card-value{font:600 34px/1 'Bricolage Grotesque','Geist',sans-serif!important;letter-spacing:-.03em}
.perf-card-subtitle,.ticker-description{color:var(--muted2)!important}

/* controls: pill buttons, softened fields */
.btn,.btn-sm,.btn-3d,.action-btn,.header-btn,.chart-tf-btn,.az-btn,.sim-template-btn,.call-btn{border-radius:99px!important;box-shadow:none!important;text-shadow:none!important;transform:none!important;letter-spacing:0!important;text-transform:none!important;font-weight:500!important}
.btn:hover,.btn-3d:hover,.action-btn:hover{transform:none!important;filter:brightness(1.08)}
input[type=text],input[type=number],input[type=password],input[type=email],input[type=date],input[type=time],select,textarea{border-radius:8px!important;background:var(--surface)!important;border:1px solid var(--border-light)!important;color:var(--text)!important}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent)!important;outline-offset:1px;border-color:transparent!important}
.rs-badge,.ticker-badge,.sig-badge{border:0!important;background:var(--surface2)!important;border-radius:99px!important;padding:3px 10px!important;font-size:11px!important}

/* tables: hairline rows, quiet headers */
table{border-collapse:collapse;width:100%}
th{background:transparent!important;color:var(--muted)!important;font-weight:500!important;font-size:12.5px!important;text-transform:none!important;letter-spacing:0!important;border:0!important;border-bottom:1px solid var(--border)!important;padding:10px 12px 10px 0!important}
td{border:0!important;border-bottom:1px solid var(--border)!important;padding:14px 12px 14px 0!important;background:transparent!important}
tbody tr,.perf-table tbody tr{background:transparent!important;color:var(--text)!important}
tbody tr:hover,.perf-table tbody tr:hover{background:var(--surface)!important}

/* modals and menus keep one soft surface */
.modal-content,.modal>div,[role=dialog]{background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:var(--r)!important}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:99px;border:2px solid var(--bg)}
@media(max-width:900px){.tab-content{padding:32px 16px 90px!important}.trading-grid{gap:40px!important}.header,.live-ticker-bar{padding-left:14px!important;padding-right:14px!important}}

/* ---- v2 pass 2: one-row chrome, calmer headings, flattened inline-styled blocks ---- */
.header-content{display:none!important}
.header{display:flex!important;align-items:center}
.header-actions{width:100%;flex-wrap:nowrap!important;justify-content:flex-start;overflow-x:auto;scrollbar-width:none}
.header-actions::-webkit-scrollbar{display:none}
.header-actions>*{flex:0 0 auto}
.header-stat-label{font-size:10px!important;letter-spacing:.04em!important;color:var(--muted)!important}
.header-stat-item{background:transparent!important;border:0!important;padding:0 10px!important}
.header-stat-value{font-size:13px!important}
.trading-mode-panel{margin-left:auto!important}
.live-ticker-bar{overflow-x:auto!important;scrollbar-width:none}
.live-ticker-bar::-webkit-scrollbar{display:none}
.dashboard-section-header{font-size:clamp(32px,3.8vw,50px)!important;margin:12px 0 36px!important}
.dashboard-section-header small,.dashboard-section-header>span:last-child:not(:first-child){font-size:17px!important}
.tab-content h2,.tab-content h3,.tab-content h4{color:var(--text)!important}
.tab-content h2>svg,.tab-content h3>svg,.tab-content h4>svg,.tab-content h2>i,.tab-content h3>i,.tab-content h4>i{display:none!important}
.tab-content>div[style*="background"]{background:transparent!important;border:0!important;box-shadow:none!important}
.tab-content div[style*="border-left"]{background:var(--surface)!important;border-radius:10px!important;color:var(--text)!important;box-shadow:none!important}
.tab-content div[style*="border-left"] *{color:inherit}

/* surfaces opened by redesign.js */
.sqx-open{background:transparent!important;box-shadow:none!important;border-radius:0!important;border-left:0!important;border-right:0!important;border-bottom:0!important;border-top:1px solid var(--border)!important}
.header{padding-right:20px!important}
.header-actions{gap:8px!important}
.trading-mode-panel{padding:0 0 0 14px!important}

/* =====================================================================
   v2 pass 3: new bases (Dark Steel, Ocean), appearance popover,
   instrument-style header controls, API history panel, segmented sub-tabs
   ===================================================================== */
html[data-skin="steel"]{--bg:#101214;--surface:#16191C;--surface2:#1D2125;--surface3:#262B30;--border:#2A3036;--border-light:#3A424A;--accent:#D9A66B;--accent-dim:rgba(217,166,107,.14);--text:#E4E8EB;--muted:#8B949C;--muted2:#A5AEB6;--green:#4ED0A0;--green-dim:rgba(78,208,160,.12);--red:#FF7468;--red-dim:rgba(255,116,104,.12);--blue:#8DB4D8;--on-accent:#14100A;--sqx-hero-filter:grayscale(.9) contrast(1.05)}
html[data-skin="ocean"]{--bg:#05110F;--surface:#0A1A17;--surface2:#102521;--surface3:#16312C;--border:#17302B;--border-light:#24463F;--accent:#4FE3B5;--accent-dim:rgba(79,227,181,.14);--text:#E3F1EC;--muted:#7FA196;--muted2:#9DBDB2;--green:#3DDC97;--green-dim:rgba(61,220,151,.12);--red:#FF7A6E;--red-dim:rgba(255,122,110,.12);--blue:#6FB8E8;--on-accent:#03120D;--sqx-hero-filter:hue-rotate(95deg) saturate(.95)}

/* appearance popover (replaces the row of swatches) */
.sqx-appear-wrap{position:relative;margin-right:6px}
.sqx-appear{display:flex;align-items:center;gap:8px;background:none;border:1px solid var(--border-light);color:var(--muted2);font:500 12px 'Geist',sans-serif;padding:5px 12px 5px 8px;border-radius:99px;cursor:pointer;transition:color .15s,border-color .15s}
.sqx-appear:hover,.sqx-appear-wrap.open .sqx-appear{color:var(--text);border-color:var(--muted)}
.sqx-dot{width:14px;height:14px;border-radius:50%;background:conic-gradient(var(--accent) 0 50%,var(--surface3) 50% 100%);box-shadow:0 0 0 1px var(--border-light)}
.sqx-pop{position:absolute;right:0;top:calc(100% + 12px);width:340px;padding:18px;background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:0 30px 80px rgba(0,0,0,.5);display:none;z-index:1000}
.sqx-appear-wrap.open .sqx-pop{display:block;animation:sqxdd .22s cubic-bezier(.16,1,.3,1)}
.sqx-pop h4{font:500 11px 'Geist',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:2px 0 10px}
.sqx-pop h4:not(:first-child){margin-top:18px}
.sqx-bases,.sqx-accents{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.sqx-pop button{display:grid;justify-items:center;gap:6px;background:none;border:1px solid transparent;border-radius:10px;padding:8px 2px;cursor:pointer;color:var(--muted2);font:400 11px 'Geist',sans-serif}
.sqx-pop button:hover{background:var(--surface2);color:var(--text)}
.sqx-pop button[aria-pressed="true"]{border-color:var(--accent);color:var(--text)}
.sqx-pop button i{width:30px;height:30px;border-radius:50%;border:1px solid var(--border-light);background:var(--sw-bg,var(--surface3));position:relative;overflow:hidden}
.sqx-bases button i:after{content:"";position:absolute;right:0;bottom:0;width:15px;height:15px;background:var(--sw-ac);border-top-left-radius:15px}
.sqx-accents button i{background:var(--ac,conic-gradient(var(--accent) 0 50%,var(--surface3) 50% 100%));border:0}
.sqx-bases [data-s="dark"]{--sw-bg:#0A0C0B;--sw-ac:#D4F24A}
.sqx-bases [data-s="midnight"]{--sw-bg:#070B14;--sw-ac:#7AA2FF}
.sqx-bases [data-s="slate"]{--sw-bg:#1A1F27;--sw-ac:#7CC8F0}
.sqx-bases [data-s="steel"]{--sw-bg:#16191C;--sw-ac:#D9A66B}
.sqx-bases [data-s="ocean"]{--sw-bg:#0A1A17;--sw-ac:#4FE3B5}
.sqx-bases [data-s="mist"]{--sw-bg:#EBEEF1;--sw-ac:#3E5F00}
.sqx-bases [data-s="white"]{--sw-bg:#FFFFFF;--sw-ac:#3E5F00}

/* header instrument cluster: outlined, quiet, no filled blocks */
html .header-btn,html .live-ticker-bar button,html .live-ticker-bar .btn{background:transparent!important;background-image:none!important;color:var(--text)!important;border:1px solid var(--border-light)!important;border-radius:99px!important;padding:6px 14px!important;font:500 12px 'Geist',sans-serif!important;letter-spacing:.01em!important;text-transform:none!important;box-shadow:none!important}
html .header-btn:hover,html .live-ticker-bar button:hover{background:var(--surface2)!important;border-color:var(--muted)!important}
html .header-btn-start{color:var(--green)!important;border-color:color-mix(in srgb,var(--green) 55%,transparent)!important}
html .header-btn-start:hover{background:var(--green-dim)!important}
html .header-btn-stop{color:var(--red)!important;border-color:color-mix(in srgb,var(--red) 50%,transparent)!important}
html .header-btn-stop:hover{background:var(--red-dim)!important}
html #panicButton{color:var(--red)!important;border-color:color-mix(in srgb,var(--red) 60%,transparent)!important}
html #panicButton:hover{background:var(--red)!important;color:#fff!important;border-color:var(--red)!important}
html .header-btn svg,html .live-ticker-bar button svg{opacity:.85}
#statusText{color:var(--text)!important;font-weight:500!important}
.header-stat-label,.mode-label{font:500 10px 'Geist Mono',monospace!important;letter-spacing:.12em!important;text-transform:uppercase;color:var(--muted)!important}
.header-stat-value{font:500 13px 'Geist Mono',monospace!important;color:var(--text)!important}
.mode-status{font:600 12px 'Geist Mono',monospace!important;letter-spacing:.14em!important}

/* emergency stop: a single red ring with the label inside */
html .header .emergency-stop,html .emergency-stop{flex:none!important;width:66px!important;height:66px!important;min-width:0!important;padding:0 6px!important;margin:0 6px!important;border-radius:50%!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;background:transparent!important;background-image:none!important;border:1.5px solid var(--red)!important;color:var(--red)!important;font:600 8px/1.3 'Geist Mono',monospace!important;letter-spacing:.14em!important;text-transform:uppercase!important;white-space:normal!important;box-shadow:0 0 0 5px color-mix(in srgb,var(--red) 10%,transparent),inset 0 0 16px color-mix(in srgb,var(--red) 12%,transparent)!important;transition:background .18s,color .18s,box-shadow .18s,transform .12s!important;animation:sqxring 3.2s ease-in-out infinite}
html .emergency-stop svg,html .emergency-stop i{display:none!important}
html .emergency-stop:hover{background:var(--red)!important;color:#fff!important;box-shadow:0 0 0 6px color-mix(in srgb,var(--red) 22%,transparent),0 0 32px color-mix(in srgb,var(--red) 55%,transparent)!important;animation:none}
html .emergency-stop:active{transform:scale(.95)!important}
html .emergency-stop:focus-visible{outline:2px solid var(--red);outline-offset:4px}
@keyframes sqxring{50%{box-shadow:0 0 0 8px color-mix(in srgb,var(--red) 4%,transparent),inset 0 0 16px color-mix(in srgb,var(--red) 12%,transparent)}}
@media(prefers-reduced-motion:reduce){html .emergency-stop{animation:none}}

/* market strip + API pressure gauge */
#apiGaugeDesktop{background:transparent!important;border:0!important;padding:0 4px!important;gap:14px!important}
#apiGaugeDesktop [id^="dkApiScore"]{font:500 14px 'Geist Mono',monospace!important}
#dkApiSignal{background:transparent!important;border:1px solid var(--border-light)!important;border-radius:99px!important;padding:2px 10px!important;font:500 11px 'Geist Mono',monospace!important;letter-spacing:.12em!important}
#apiGaugeDesktop>span:first-child,#dkApiInfoBtn{background:transparent!important;border-color:var(--border-light)!important}

/* API Pressure History panel */
#apiPressureChartPanel{background:var(--surface)!important;border:1px solid var(--border)!important;border-radius:18px!important;padding:30px 34px!important;box-shadow:0 40px 110px rgba(0,0,0,.55)!important;width:min(840px,94vw)!important;font-family:'Geist',sans-serif!important;color:var(--text)!important}
#apiPressureChartPanel>div:first-child{margin-bottom:22px!important;align-items:flex-end!important}
#apiPressureChartPanel>div:first-child>div:first-child{font:600 30px/1.05 'Bricolage Grotesque','Geist',sans-serif!important;letter-spacing:-.03em!important;color:var(--text)!important}
#apiPressureChartPanel>div:first-child>div:first-child i{display:none!important}
#apiPressureChartPanel select,#apiPressureChartPanel button{background:transparent!important;color:var(--text)!important;border:1px solid var(--border-light)!important;border-radius:99px!important;padding:6px 14px!important;font:500 12px 'Geist',sans-serif!important}
#apiPressureChartPanel button:hover{background:var(--surface2)!important}
#apiPressureChartPanel canvas{width:100%!important;height:auto!important;aspect-ratio:710/280;border-radius:12px!important;border:0!important;background:#0A0D0C!important}
#apiChartLegend{color:var(--muted2)!important;font-size:12px!important;margin-top:14px!important}
#apiChartLegend span:last-child{color:var(--muted)!important}
#apiChartTable{margin-top:22px!important}
#apiChartTable table{font:400 12px 'Geist Mono',monospace!important;color:var(--muted2)!important}
#apiChartTable th{color:var(--muted)!important;font-weight:500!important}
#apiChartTable td{padding:9px 10px 9px 0!important}
#apiChartBackdrop{background:rgba(0,0,0,.6)!important;backdrop-filter:blur(6px)}

/* sub-tab bars become a single segmented control */
.positions-actions,.perf-view-mode-bar,.status-bar.positions-actions{display:inline-flex!important;flex-wrap:wrap;gap:2px!important;padding:3px!important;background:transparent!important;border:1px solid var(--border)!important;border-radius:99px!important;margin-bottom:32px!important;max-width:100%}
.positions-actions>button,.perf-view-mode-bar>button{flex:0 0 auto!important;min-width:0!important;min-height:0!important;width:auto!important;padding:8px 18px!important;background:transparent!important;border:0!important;color:var(--muted2)!important;border-radius:99px!important;font:500 13px 'Geist',sans-serif!important;box-shadow:none!important}
.positions-actions>button:hover,.perf-view-mode-bar>button:hover{color:var(--text)!important}
.positions-actions>button[style*="--accent"],.perf-view-mode-bar>button.active{background:var(--surface3)!important;color:var(--text)!important}
.positions-actions>button svg,.perf-view-mode-bar>button svg{display:none!important}

/* light schemes: the app's own light-theme rules are more specific; restate the ghost header controls */
html[data-skin][data-theme] .header-btn,html[data-skin][data-theme] .live-ticker-bar button{background:transparent!important;color:var(--text)!important;border:1px solid var(--border-light)!important}
html[data-skin][data-theme] .header-btn-start{color:var(--green)!important;border-color:color-mix(in srgb,var(--green) 55%,transparent)!important}
html[data-skin][data-theme] .header-btn-stop{color:var(--red)!important;border-color:color-mix(in srgb,var(--red) 50%,transparent)!important}
html[data-skin][data-theme] #panicButton{color:var(--red)!important;border-color:color-mix(in srgb,var(--red) 60%,transparent)!important}
html[data-skin][data-theme] .header-btn .mute-text,html[data-skin][data-theme] .header-btn span{color:inherit!important}
html[data-skin][data-theme] .emergency-stop,html[data-skin][data-theme] .emergency-stop *{color:var(--red)!important;background:transparent!important}
html[data-skin][data-theme] .emergency-stop:hover,html[data-skin][data-theme] .emergency-stop:hover *{color:#fff!important;background:var(--red)!important}