/* 0DTE workspace: North Star atmosphere, a quiet working desk. */
:root{--bg:#030712;--bg2:#071022;--card:#101a2b;--card-2:#162136;--card-hover:#1a2840;--line:#2d394c;--line-strong:#596881;--gold:#e2c98f;--gold-light:#f4e1b2;--sky:#8bc4f4;--text:#f0f0f5;--muted:#b0b9cb;--blue:#e2c98f;--blue-soft:rgba(226,201,143,.10);--font-head:var(--aku-font-head);--mono:var(--aku-font-mono);--r-card:12px;--r-tile:8px}
body{font-size:16px;background:radial-gradient(ellipse 72rem 42rem at 40% -12%,rgba(24,55,112,.55),transparent 68%),var(--bg);text-rendering:optimizeLegibility}
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;background-image:radial-gradient(circle,rgba(255,255,255,.45) 0 1px,transparent 1.4px);background-size:173px 173px;background-position:24px 42px;opacity:.22;mask-image:linear-gradient(#000,transparent 60%)}
main{position:relative;z-index:1}
.wrap{max-width:1280px;padding-inline:40px}
.dte-head{padding:110px 0 0}
.dte-opening{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.66fr);gap:80px;align-items:center;padding-bottom:30px}
.dte-kicker{background:none;border:0;border-radius:0;padding:0;letter-spacing:.04em;color:var(--gold);font-size:.84rem;font-weight:500;text-transform:none}
.dte-kicker::before{content:'✦';margin-right:4px;font-size:1rem}
.dte-head h1{font-family:var(--aku-font-body);font-weight:500;font-size:clamp(2.4rem,4.1vw,3.6rem);letter-spacing:-.035em;line-height:1.2;margin:15px 0 12px;text-wrap:balance}
.dte-head h1 em{font-family:var(--aku-font-head);font-weight:400;font-style:italic;font-size:1.1em;color:var(--gold-light)}
.dte-lede{max-width:48ch;color:var(--muted);font-size:1.04rem;margin:0 0 17px;line-height:1.75}
.dte-meta{gap:8px 12px;font-size:.8rem;align-items:center}
.owner-pill{border:0;background:none;padding:0;font-weight:400;font-size:.8rem}
.session-heading{display:flex;gap:12px;align-items:baseline;justify-content:space-between;margin:0 0 9px;padding-bottom:9px;border-bottom:1px solid var(--line)}
.session-heading{cursor:pointer;list-style:none;min-height:44px}.session-heading::-webkit-details-marker{display:none}.session-heading b{font-size:.98rem;font-weight:600;margin:0}.session-heading i{font-style:normal;display:inline-block;margin-left:10px;transition:transform .16s}.dte-session[open] .session-heading i{transform:rotate(180deg)}
.session-heading span{font-family:var(--aku-font-head);font-size:1rem;font-style:italic;color:var(--gold)}
.today-strip{display:grid;grid-template-columns:1fr;gap:0;margin:0}
.ov-tile{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 16px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;padding:10px 0;overflow:visible;box-shadow:none;min-height:66px}
.ov-tile:last-child{border-bottom:0}
.ov-tile::before{display:none}
.ov-tile::after{content:'↗';position:absolute;right:0;top:12px;color:var(--muted);font-size:.9rem;opacity:0;transition:opacity .16s}
.ov-tile:hover,.ov-tile:focus-visible{background:none;transform:none;outline-offset:5px}
.ov-tile:hover::after,.ov-tile:focus-visible::after{opacity:1}
.ov-tile .ov-label{font-size:.83rem;font-weight:400;color:var(--text)}
.ov-tile .ov-num{grid-column:2;grid-row:1 / 3;align-self:center;font-size:1.15rem;font-weight:600;text-align:right;padding-right:16px;font-variant-numeric:tabular-nums}
.ov-tile .ov-note{font-size:.78rem;margin:0;color:var(--muted)}
.dte-context{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:28px;border-top:1px solid var(--line);padding:13px 0 16px}
.risk-note{border:1px solid #713847;border-radius:8px;box-shadow:none;background:#291722;padding:12px 14px;font-size:.9rem;line-height:1.65}
.dte-context>.risk-note{background:none;border:0;padding:0;margin:0;font-size:.84rem;color:#c1b5bc;max-width:80ch}
.risk-note strong{color:#ffb0bd;font-weight:600}
details.explain{border:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;background:none;box-shadow:none}
details.explain summary{padding:12px 0;min-height:44px;font-weight:500;font-size:.92rem}
details.explain .explain-body{padding:0 0 18px;color:var(--muted);max-width:75ch}
.dte-context>details.explain{position:relative;border:0;margin:0;max-width:260px}
.dte-context>details.explain[open]{grid-column:1 / -1;max-width:none}
.dte-context>details.explain summary{gap:16px}
.tabs{top:64px;margin-top:0;background:#080e1b;border-top:1px solid var(--line);border-bottom:1px solid var(--line);backdrop-filter:none}
.tabs .wrap{flex-wrap:nowrap;overflow-x:auto;gap:0;padding-block:0;scrollbar-width:none}
.tab{position:relative;border:0;border-radius:0;background:none;padding:15px 12px;color:var(--muted);font-weight:500;font-size:.89rem;min-height:52px;transition:color .16s,background-color .16s}
.tab:hover{background:#162136;color:var(--text)}
.tab[aria-selected='true']{background:none;color:var(--gold-light)}
.tab[aria-selected='true']::after{content:'';position:absolute;bottom:0;left:12px;right:12px;height:2px;background:var(--gold)}
.tab-group{padding:0 10px 0 0;font-size:.72rem;font-weight:400;color:var(--muted)}
.tab-sep{margin:15px 10px}
.panel{padding:32px 0 72px;scroll-margin-top:130px}
.panel-head{margin-bottom:24px;gap:16px}
.panel-head h2{border:0;padding:0;font-size:1.75rem;font-weight:600;line-height:1.35;letter-spacing:-.02em;text-wrap:balance}
.panel-head p{margin:8px 0 0;font-size:.95rem;max-width:72ch}
.gx-title,.mk-box h3,.phase-head h3,.ls-head b{border:0;padding:0;font-weight:600;letter-spacing:0;font-size:1.12rem;line-height:1.5}
.gx-sub,.mk-box .sub{margin-left:0;line-height:1.65;font-size:.86rem}
.btn{min-height:44px;border-radius:7px;font-weight:600;box-shadow:none;font-size:.88rem}
.btn-primary{background:var(--gold);color:#07101d}
.btn-ghost{border-color:var(--line-strong)}
.btn-ghost:hover{background:var(--card-2)}
.gx-seg{background:#0a1220;border-color:var(--line-strong);border-radius:7px;padding:3px}
.gx-seg button{min-height:38px;border-radius:4px;font-weight:500;font-size:.86rem;padding:6px 12px}
.gx-seg button[aria-pressed='true']{background:var(--gold);color:#07101d}
.gx-top{background:none;border:0;border-radius:0;padding:0 0 18px;margin:0;box-shadow:none;align-items:flex-start}
.gx-controls{gap:7px}
.gx-meta{width:100%;order:-1;flex-direction:row;flex-wrap:wrap;gap:4px 20px;justify-content:space-between;font-size:.82rem}
.gx-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);padding:18px 0;margin-bottom:24px;background:none}
.gx-stat{text-align:left;padding:0 20px;border-right:1px solid var(--line);border-bottom:0;min-width:0}
.gx-stat:first-child{padding-left:0}
.gx-stat:last-child{border-right:0}
.gx-stat small{font-size:.82rem;font-weight:400}
.gx-stat b{font-size:1.7rem;font-weight:600;line-height:1.55;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.gx-stat span{font-size:.8rem;line-height:1.6;color:var(--muted)}
.gx-summary .gx-stat:first-child b{color:var(--gold-light)}
.gx-stats{background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;gap:18px 0;grid-template-columns:repeat(3,minmax(0,1fr));padding:12px 0}
.gx-stats .gx-stat{padding:0 18px}
.gx-stats .gx-stat:nth-child(3n+1){padding-left:0}
.gx-stats .gx-stat:nth-child(3n){border-right:0}
.gx-stats b{font-size:1.25rem}
.gx-reference{margin:0 0 24px!important}
.gx-spread{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:32px;margin:12px 0 32px;align-items:start}
.gx-card{padding:26px 0;margin:0;border:0;border-top:1px solid var(--line);border-radius:0;background:none;box-shadow:none;min-width:0}
.gx-spread .gx-card{padding:0;border:0}
.gx-spread>.gx-card:first-child{background:#17253d;padding:22px 24px 20px;border-radius:12px}
.gx-chart-summary{margin:4px 0 16px}.gx-chart-summary .gx-stat{padding:0;border:0}.gx-chart-summary b{font-size:1.85rem;line-height:1.3}.gx-chart-summary small{display:inline-block;margin-right:12px}.gx-chart-summary span{margin-top:4px}
.gx-head{gap:8px;margin-bottom:16px}
.gx-svg{min-height:160px}
.gx-svg .gx-ylab,.gx-svg .gx-xlab{fill:var(--muted);font:13px var(--aku-font-body)}
.gx-svg .gx-spotlab{fill:var(--sky);font:600 13px var(--aku-font-body)}
.gx-svg .gx-atmlab{font:600 13px var(--aku-font-body)}
.gx-svg .gx-grid{stroke:#354256;stroke-dasharray:none;opacity:.7}
.gx-svg .gx-zero{stroke:var(--line-strong)}
.gx-svg .gx-call{fill:#34d399}.gx-svg .gx-put{fill:#fb7185}
.gx-svg .gx-line-call{stroke:#34d399}.gx-svg .gx-line-put{stroke:#fb7185}
.gx-legend{gap:8px 16px;padding-left:0;font-size:.8rem}
.gx-heat{background:#0a1220;border-color:var(--line);border-radius:8px;font-size:.82rem}
.gx-heat-h span,.gx-heat-r span{padding:9px 8px}
.gx-heat-h span{font-size:.76rem;background:var(--card)}
.gx-heat-r .k{font-size:.8rem;text-align:left;overflow-wrap:anywhere}
.gx-heat-r .v{color:#fff}
.gx-heat-r span{padding-block:7px}
.gx-heat-r.is-spot{outline-color:var(--sky)}
.gx-scale{font-size:.75rem}
.gx-signals{display:grid;grid-template-columns:1fr;gap:0}
.gx-sig{display:grid;grid-template-columns:minmax(180px,.65fr) minmax(0,1.5fr) auto;gap:24px;align-items:start;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;padding:15px 0;box-shadow:none}
.gx-sig:last-child{border-bottom:0}
.gx-sig-top{display:block}
.gx-sig-top b{display:block;font-size:.92rem;margin-bottom:5px}
.gx-sig p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.7}
.gx-at{border:0;background:none;padding:0;text-align:left;white-space:normal;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.gx-at em{display:inline;margin:0 0 0 6px}
.mk-box,.desk,.phase,.card,.tool-card,.ls-c,.mk-status,.today-bar,.jstat{box-shadow:none;backdrop-filter:none;border-radius:12px}
.mk-grid{gap:24px}
.mk-box{padding:22px 24px}
.mk-box.span-12:not(#mkLevels){background:none;border:0;border-top:1px solid var(--line);border-radius:0;padding:24px 0}
.tile{background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:12px}
.tile.lean-up,.tile.lean-down{background:none;border-color:var(--line)}
.stat,.lv,.wk-d{background:#0a1220;border-color:var(--line);border-radius:7px}
.phase-head{background:none}
.tool-card{background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:20px 0}
.card:hover,.tool-card:hover{transform:translateY(-2px);border-color:var(--line-strong)}
.filter{min-height:40px;font-size:.87rem}
.filter[aria-pressed='true']{background:var(--gold);color:#07101d;border-color:var(--gold)}
.thesis{border:1px solid var(--line-strong);border-radius:8px}
.modal{background:#101a2b;border-radius:12px;box-shadow:none}
.modal-back{background:rgba(3,7,18,.88);backdrop-filter:none}
.toast{background:#162136;box-shadow:none}
.x-btn{min-width:44px;min-height:44px}
.spy-price,.pnl,.ov-num,.jstat b,.ls-c>b{font-variant-numeric:tabular-nums}
button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--gold-light);outline-offset:4px}
.card:focus-visible,.ov-tile:focus-visible,.tool-card:focus-visible{outline:2px solid var(--gold-light);outline-offset:4px}
.gx-empty{border-block:1px solid var(--line);padding:32px 0;color:var(--muted)}
.gx-empty h3{color:var(--text);font-size:1.1rem;margin:0 0 6px}
.gx-empty p{margin:0 0 16px}
@media(min-width:1100px){.tab-group{display:none}.tab-sep{margin-inline:12px}}
@media(max-width:1000px){.wrap{padding-inline:28px}.dte-opening{gap:40px;grid-template-columns:minmax(0,1fr) minmax(300px,.8fr)}.gx-spread{grid-template-columns:1fr;gap:28px}.gx-summary{grid-template-columns:repeat(4,minmax(0,1fr))}.gx-summary .gx-stat{border-bottom:0}.gx-stat b{font-size:1.5rem}.gx-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.gx-sig{gap:16px}}
@media(max-width:760px){.wrap{padding-inline:20px}.dte-head{padding-top:92px}.dte-opening{grid-template-columns:1fr;gap:25px;padding-bottom:20px}.dte-head h1{font-size:2rem;margin-top:10px;letter-spacing:-.025em}.dte-lede{font-size:.97rem;max-width:55ch;margin-bottom:12px}.dte-context{display:block;padding-block:15px}.dte-context>details.explain{max-width:none;margin-top:5px}.session-heading{margin-bottom:2px}.today-strip{grid-template-columns:1fr 1fr;gap:0 20px}.ov-tile{display:block;padding:10px 0;min-height:90px}.ov-tile:nth-last-child(-n+2){border-bottom:0}.ov-tile .ov-num{text-align:left;font-size:1.2rem;padding:0;line-height:1.6}.ov-tile .ov-note{font-size:.77rem}.ov-tile::after{display:none}.panel-head h2{font-size:1.5rem}.panel-head p{font-size:.91rem}.panel{padding-top:24px}.tab{padding-inline:12px}.tabs{top:64px}.gx-top{gap:12px}.gx-controls{width:100%;gap:8px}.gx-seg button{min-height:40px;padding:6px 10px}.gx-summary{grid-template-columns:1fr 1fr;gap:16px 0;padding:16px 0}.gx-summary .gx-stat{padding:0 16px;border:0}.gx-summary .gx-stat:nth-child(odd){padding-left:0;border-right:1px solid var(--line)}.gx-stat b{font-size:1.55rem}.gx-spread>.gx-card:first-child{padding:18px 12px}.gx-sig{grid-template-columns:1fr auto;gap:8px 12px}.gx-sig p{grid-column:1 / -1;grid-row:2}.gx-sig-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.gx-sig-top b{margin:0}.gx-at{font-size:.8rem}.gx-stats{grid-template-columns:1fr 1fr;gap:20px 0}.gx-stats .gx-stat{padding:0 14px!important;border:0}.gx-stats .gx-stat:nth-child(odd){padding-left:0!important;border-right:1px solid var(--line)}.gx-stats .gx-stat b{font-size:1.2rem}.gx-heat-h,.gx-heat-r{grid-template-columns:1.2fr 1fr 1fr 1fr}.gx-heat-h span:nth-child(n+3),.gx-heat-r span:nth-child(n+3){display:block}.gx-heat-r span{font-size:.76rem}.gx-svg{min-height:0}.gx-meta{display:block}.gx-meta span{display:block;margin-top:3px}.gx-top .btn{width:100%;justify-content:center}.mk-box{padding:20px 16px}.gx-sub{font-size:.86rem}.gx-title{font-size:1.1rem}}
@media(max-width:380px){.wrap{padding-inline:16px}.dte-head h1{font-size:1.8rem}.today-strip{gap:0 14px}.ov-tile .ov-num{font-size:1.05rem}.gx-seg button{font-size:.8rem;padding-inline:8px}.gx-heat-h,.gx-heat-r{grid-template-columns:1.2fr 1fr}.gx-heat-h span:nth-child(n+3),.gx-heat-r span:nth-child(n+3){display:none}.gx-summary .gx-stat{padding-right:8px}.gx-summary .gx-stat span{font-size:.76rem}.gx-summary .gx-stat b{font-size:1.35rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
@media(max-width:380px){.gx-heat-r span:nth-child(n+3){display:block;font-size:.78rem;padding-top:3px;border-top:0}.gx-heat-r span:nth-child(3)::before{content:'Call '}.gx-heat-r span:nth-child(4)::before{content:'Put '}}

/* Trade Desk: status first, then paired market levels and quieter context. */
#deskLive{--desk-up:#91edbf;--desk-down:#ff9fb0;--desk-wait:#f4d878;--desk-warning:#ffc18b;margin:24px 0}
.ls-primary{display:grid;grid-template-columns:minmax(250px,.8fr) minmax(0,1.4fr);gap:16px}
#deskLive .ls-c{min-width:0;padding:20px 24px;gap:8px;border-color:#34445c}
#deskLive .ls-label{font-size:.86rem;font-weight:500;color:#c4cfdf;line-height:1.5}
#deskLive .ls-value{font-size:1.7rem;line-height:1.3;font-weight:700;letter-spacing:-.015em}
#deskLive .ls-detail{font-size:.86rem;line-height:1.6;color:#c4cfdf;display:flex;flex-direction:column;gap:3px}
#deskLive .ls-detail span{font-size:inherit;color:inherit}
#deskLive .ls-price{background:radial-gradient(ellipse at 0 0,rgba(226,201,143,.16),transparent 66%),linear-gradient(135deg,#192333,#0e1726);border-color:#82704c;box-shadow:inset 0 1px rgba(245,224,176,.17)}
#deskLive .ls-price>.ls-value{font-size:2.65rem;color:var(--gold-light);line-height:1.12}
#deskLive .ls-change{font-size:1.06rem;align-self:flex-start;padding:3px 8px;border-radius:4px;line-height:1.5}
#deskLive .ls-scale-note{font-size:.8rem;line-height:1.6;color:var(--muted);margin-top:3px}
#deskLive .ls-magnitude-label{font-weight:600;margin-top:4px}
.ls-tone-up,#deskLive .ls-tone-up{color:#91edbf}.ls-tone-down,#deskLive .ls-tone-down{color:#ff9fb0}
.ls-tone-wait,#deskLive .ls-tone-wait{color:#f4d878}.ls-tone-warning,#deskLive .ls-tone-warning{color:#ffc18b}
.ls-tone-neutral,#deskLive .ls-tone-neutral{color:#c4cfdf}
#deskLive .ls-c.ls-unavailable{background:#101a2b;border-color:#34445c}#deskLive .ls-c.ls-unavailable>.ls-value{color:#c4cfdf}
.ls-change.ls-magnitude-mid{background:#203246}.ls-change.ls-magnitude-high{outline:1px solid currentColor;background:#243a50}
.ls-change.ls-tone-up.ls-magnitude-mid{background:#163b30}.ls-change.ls-tone-up.ls-magnitude-high{background:#205441}
.ls-change.ls-tone-down.ls-magnitude-mid{background:#412432}.ls-change.ls-tone-down.ls-magnitude-high{background:#592738}
#deskLive .ls-signal{justify-content:center;background:#171f30}
#deskLive .ls-state-wait{background:radial-gradient(ellipse at 100% 0,rgba(244,216,120,.13),transparent 65%),linear-gradient(135deg,#24251d,#141b23);border-color:#857240}
#deskLive .ls-state-warning{background:radial-gradient(ellipse at 100% 0,rgba(255,193,139,.14),transparent 65%),linear-gradient(135deg,#2b211e,#161b27);border-color:#a26e46}
#deskLive .ls-state-up{background:radial-gradient(ellipse at 100% 0,rgba(145,237,191,.12),transparent 65%),linear-gradient(135deg,#132a25,#101c29);border-color:#377a60}
#deskLive .ls-state-down{background:radial-gradient(ellipse at 100% 0,rgba(255,159,176,.13),transparent 65%),linear-gradient(135deg,#2c1e2b,#151b2a);border-color:#965067}
#deskLive .ls-signal>.ls-value{font-size:2rem;line-height:1.4}
.ls-reason{margin:0;color:#e1e5ee;font-size:1rem;line-height:1.6}
.ls-frames{display:flex;gap:24px;flex-wrap:wrap;margin-top:8px;padding-top:12px;border-top:1px solid #625f4c}
.ls-frame{display:flex;flex-direction:column;gap:3px;font-size:.9rem;min-width:70px}
#deskLive .ls-frame b{font-size:.88rem;color:#d4dbe8;font-weight:500}
#deskLive .ls-frame span{font-size:.95rem;font-weight:600}
.ls-warning{margin:6px 0 0;color:#ffc18b;font-size:.9rem;line-height:1.65}
.ls-level-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px 24px;flex-wrap:wrap;margin:24px 0 10px}
.ls-level-head h4{font-size:1rem;font-weight:600;margin:0}.ls-level-head>span{font-size:.8rem;color:var(--muted)}
.ls-levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
#deskLive .ls-call{background:radial-gradient(ellipse at 0 0,rgba(86,216,160,.17),transparent 70%),linear-gradient(135deg,#132a27,#0e1b28);border-color:#387961}#deskLive .ls-call>.ls-value{color:var(--desk-up)}
#deskLive .ls-put{background:radial-gradient(ellipse at 0 0,rgba(247,125,161,.17),transparent 70%),linear-gradient(135deg,#2a202c,#141b2b);border-color:#965067}#deskLive .ls-put>.ls-value{color:var(--desk-down)}
#deskLive .ls-zero{background:radial-gradient(ellipse at 0 0,rgba(112,179,239,.13),transparent 70%),linear-gradient(135deg,#17283a,#111b2b);border-color:#476784}#deskLive .ls-zero>.ls-value{color:#a8d7ff}
.ls-context{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:22px;padding-top:4px}
#deskLive .ls-context>.ls-c{border:0;border-top:1px solid #34445c;background:none;border-radius:0;padding:16px 0;gap:7px}
#deskLive .ls-context .ls-value{font-size:1.25rem;line-height:1.5}
#deskLive .ls-separate-fact{display:block;border-top:1px solid #34445c;margin-top:7px;padding-top:7px}
#deskLive .ls-value small{font-size:.82rem;font-weight:400;color:var(--muted);letter-spacing:0}
#deskLive .ls-attention>.ls-value{color:var(--desk-warning)}#deskLive .ls-pending>.ls-value{color:var(--desk-wait)}#deskLive .ls-complete>.ls-value{color:var(--desk-up)}
.ls-color-key{margin:4px 0 0;font-size:.78rem;line-height:1.65;color:var(--muted)}
.mk-macd-decision{margin:16px 0 10px;padding:14px 16px;background:#172437;border-radius:8px;border:1px solid #45576d}
.mk-macd-decision>strong{display:block;font-size:1.3rem;line-height:1.5}.mk-macd-decision>p{margin:4px 0 0;color:#c4cfdf;font-size:.9rem;line-height:1.6}
.mk-macd-decision>.ls-warning{color:#ffc18b}
@media(max-width:1000px){.ls-context{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.ls-primary{grid-template-columns:1fr;gap:12px}#deskLive .ls-c{padding:18px}.ls-levels{grid-template-columns:repeat(2,minmax(0,1fr))}.ls-levels .ls-zero{grid-column:1 / -1}#deskLive .ls-levels .ls-c{padding:15px}#deskLive .ls-levels .ls-value{font-size:1.45rem}.ls-level-head{margin-top:22px}.ls-frames{gap:20px}#deskLive .ls-signal>.ls-value{font-size:1.75rem}.ls-context{gap:0 20px}}
@media(max-width:380px){.ls-levels,.ls-context{grid-template-columns:1fr}.ls-frames{gap:14px}.ls-frame{min-width:62px}#deskLive .ls-price>.ls-value{font-size:2.35rem}}

/* AUDIKUNG brand header gathers after the opening. The task rail stays steady. */
.dte-nav-sentinel{height:1px;pointer-events:none}
.tabs{background:var(--bg);border:0;padding:0 0 10px}
.dte-tab-shell{width:100%;max-width:1280px;margin:auto;padding-inline:40px;background:#0b1422;border:1px solid var(--line);border-inline-color:transparent;border-radius:0}
html.dte-brand-managed .tabs{top:80px}
.dte-brand-backing{position:fixed;inset:0 0 auto;height:80px;background:var(--bg);z-index:35;pointer-events:none}
html.dte-brand-managed .aknav{background:#0b1422;transition:top .36s cubic-bezier(.22,1,.36,1),left .36s cubic-bezier(.22,1,.36,1),right .36s cubic-bezier(.22,1,.36,1),height .36s cubic-bezier(.22,1,.36,1),padding .36s cubic-bezier(.22,1,.36,1),border-radius .36s cubic-bezier(.22,1,.36,1),border-color .24s}
html.dte-brand-managed .aknav.dte-brand-compact{top:12px;left:max(24px,calc(50% - 560px));right:max(24px,calc(50% - 560px));height:56px;padding:0 24px;border:1px solid var(--line-strong);border-radius:28px}
html.dte-brand-managed .aknav-mobile{top:80px}
html.dte-brand-managed .pd-wrap{top:80px;right:max(24px,calc(50% - 560px))}
.ak-shell .aknav,.ak-shell .aknav.dte-brand-compact{top:auto!important;left:auto!important;right:auto!important;border-radius:0!important;border:0!important;background:none!important;box-shadow:none!important}
.tabs .wrap{position:relative;max-width:none;padding-inline:0}
.tab{white-space:nowrap;outline-offset:-4px!important}
.dte-tab-indicator{display:none;position:absolute;left:0;bottom:0;width:1px;height:2px;background:var(--gold-light);transform-origin:left;transform:translate3d(var(--tab-x,0px),0,0) scaleX(var(--tab-width,1));pointer-events:none;transition:transform .22s cubic-bezier(.22,1,.36,1)}
.has-tab-motion .dte-tab-indicator{display:block}
.has-tab-motion .tab[aria-selected='true']::after{display:none}
.dte-reduce-motion .dte-tab-indicator,html.dte-brand-managed .aknav.dte-reduce-motion{transition:none}
.panel{scroll-margin-top:145px}
.panel-head h2{font-family:var(--aku-font-body);font-size:1.8rem;font-weight:500;line-height:1.45;letter-spacing:-.025em}
.panel-head p{max-width:64ch;font-weight:400;line-height:1.8}
.gx-spread>.gx-card:first-child .gx-title{font-size:1.25rem;font-weight:600;line-height:1.5}
.gx-spread .gx-sub{font-size:.88rem;line-height:1.75}
.gx-research{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;margin-top:28px}
.gx-research>.gx-card:last-child{grid-column:1 / -1}
.gx-research .gx-title{font-size:1.02rem;font-weight:600;color:var(--text)}
.gx-research .gx-sub{font-size:.88rem;line-height:1.75}
.gx-distance{font-style:normal;font-weight:600}
.gx-distance.up{color:var(--green)}.gx-distance.down{color:var(--red)}
.gx-color-key{display:flex;flex-wrap:wrap;gap:5px 24px;margin:0 0 20px;padding:0;font-size:.83rem;line-height:1.75;color:var(--muted)}
.gx-color-key b{font-weight:500}.gx-heat-note{font-size:.82rem;color:var(--muted);margin:10px 0 0;line-height:1.7}
@media(max-width:1100px){.dte-tab-shell{padding-inline:28px}}
@media(max-width:760px){.dte-tab-shell{padding-inline:20px}.panel-head h2{font-size:1.45rem;line-height:1.55}.gx-research{grid-template-columns:1fr;gap:0}.gx-spread>.gx-card:first-child .gx-title{font-size:1.14rem}.gx-color-key{display:block}.gx-color-key>span{display:block}}
@media(max-width:1080px){html.dte-brand-managed .tabs,html.dte-brand-managed .aknav-mobile{top:72px}.dte-brand-backing{height:72px}html.dte-brand-managed .aknav.dte-brand-compact{top:8px;left:8px;right:8px;height:54px;padding-inline:16px;border-radius:18px}html.dte-brand-managed .pd-wrap{top:72px;right:16px}}
@media(max-width:380px){html.dte-brand-managed .aknav.dte-brand-compact{padding-inline:10px}}
@media(prefers-reduced-motion:reduce){html.dte-brand-managed .aknav,.dte-tab-indicator{transition:none}}
/* Chart controls: distinct overlay roles with explicit on/off state. */
.ch-overlays{display:flex;flex-wrap:wrap;gap:10px;width:100%;padding-top:6px}
.ch-overlays button{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:46px;padding:10px 14px;border:1px solid #69788e;border-radius:9px;background:#101a2a;color:#c4cfdf;font:inherit;cursor:pointer}
.ch-overlays button[data-cht="ema"]{--ch-accent:#b5ceff;--ch-tint:#253650}
.ch-overlays button[data-cht="gex"]{--ch-accent:#e9d298;--ch-tint:#383323}
.ch-overlays button[data-cht="pre"]{--ch-accent:#f2bddd;--ch-tint:#39283d}
.ch-overlays button[aria-pressed="true"]{color:var(--ch-accent);border-color:var(--ch-accent);background:linear-gradient(120deg,var(--ch-tint),#111d2c)}
.ch-toggle-state{font-size:.72rem;border:1px solid currentColor;border-radius:4px;padding:2px 6px;font-weight:600;white-space:nowrap}
.ch-overlays button:disabled{cursor:not-allowed;border-style:dashed;color:#abb6c9}
.ch-overlays button:focus-visible,.ch-host:focus-visible{outline:2px solid #f4d878;outline-offset:4px}
#panel-chart .ch-plot{padding:16px;background:radial-gradient(ellipse at 0 0,rgba(226,201,143,.055),transparent 50%),#0e1726;border:1px solid #47566d;border-radius:12px}
.ch-plot-hint{display:flex;justify-content:space-between;gap:16px;align-items:start;margin-bottom:12px;font-size:.8rem;color:#bac6da;line-height:1.6}
#chZoomStatus{white-space:nowrap;font-variant-numeric:tabular-nums;color:#e9d298}
#deskLive .ls-regular-session{border-top:1px solid #526076;padding-top:10px;margin-top:7px;line-height:1.7}
#deskLive .ls-quote-time{font-size:.74rem;color:#b8c4d6;margin-top:5px}
@media(max-width:680px){.ch-overlays{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ch-overlays button{width:100%;gap:8px;padding:8px 10px;min-height:44px;font-size:.86rem}.ch-plot-hint{flex-direction:column;gap:4px}#panel-chart .ch-plot{padding:10px}}

/* ---- Trade Desk card (Claude-filled), 2026-10-09: decision → plan → levels → evidence ---- */
.dk{gap:18px}
.dk-decision{border:1px solid #34445c;border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:6px}
.dk-decision .score{margin-top:6px}
.dk-dec-title{font-family:var(--font-head);font-weight:700;font-size:1.65rem;line-height:1.3;letter-spacing:-.015em}
.dk-dec-why{margin:0;font-size:1rem;line-height:1.6;color:#e1e5ee}
.dk-wait{background:radial-gradient(ellipse at 100% 0,rgba(244,216,120,.14),transparent 65%),linear-gradient(135deg,#24251d,#141b23);border-color:#857240}.dk-wait .dk-dec-title{color:#f4d878}
.dk-go{background:radial-gradient(ellipse at 100% 0,rgba(145,237,191,.13),transparent 65%),linear-gradient(135deg,#132a25,#101c29);border-color:#377a60}.dk-go .dk-dec-title{color:#91edbf}
.dk-skip{background:radial-gradient(ellipse at 100% 0,rgba(255,159,176,.13),transparent 65%),linear-gradient(135deg,#2c1e2b,#151b2a);border-color:#965067}.dk-skip .dk-dec-title{color:#ff9fb0}
.dk-sec h4{margin:0 0 10px;font-family:var(--font-head);font-weight:600;font-size:1.02rem;color:#e8ecf4}
.dk-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.dk-plan{border:1px solid #34445c;border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.dk-plan-side{font-family:var(--font-head);font-weight:700;font-size:.92rem;letter-spacing:.02em}
.dk-plan-strike{font-family:var(--font-head);font-weight:700;font-size:1.45rem;line-height:1.25}
.dk-plan-row{display:grid;grid-template-columns:4.6em 1fr;gap:8px;font-size:.92rem;line-height:1.55;border-top:1px solid rgba(255,255,255,.07);padding-top:7px}
.dk-plan-row small{color:#aab4c6;font-size:.82rem}
.dk-plan-call{background:radial-gradient(ellipse at 0 0,rgba(86,216,160,.17),transparent 70%),linear-gradient(135deg,#132a27,#0e1b28);border-color:#387961}.dk-plan-call .dk-plan-side,.dk-plan-call .dk-plan-strike{color:#91edbf}
.dk-plan-put{background:radial-gradient(ellipse at 0 0,rgba(247,125,161,.17),transparent 70%),linear-gradient(135deg,#2a202c,#141b2b);border-color:#965067}.dk-plan-put .dk-plan-side,.dk-plan-put .dk-plan-strike{color:#ff9fb0}
.dk-plan-skip{background:#121a29}.dk-plan-skip .dk-plan-side,.dk-plan-skip .dk-plan-strike{color:#c4cfdf}
.dk-key{margin:8px 0 0;font-size:.8rem;line-height:1.6;color:var(--muted)}
.dk-more{margin-top:10px}.dk-more summary{cursor:pointer;color:var(--gold-light);font-size:.9rem}
.dk-levels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.dk-lv{border:1px solid #34445c;border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;background:#111a2a}
.dk-lv small{font-size:.84rem;color:#c4cfdf}.dk-lv b{font-family:var(--font-head);font-size:1.45rem;font-weight:700}.dk-lv span{font-size:.78rem;line-height:1.5;color:var(--muted)}
.dk-call{background:radial-gradient(ellipse at 0 0,rgba(86,216,160,.14),transparent 70%),#111d24;border-color:#387961}.dk-call b{color:#91edbf}
.dk-put{background:radial-gradient(ellipse at 0 0,rgba(247,125,161,.14),transparent 70%),#1b1824;border-color:#965067}.dk-put b{color:#ff9fb0}
.dk-zero b{color:#a8d7ff}
.dk-range{background:radial-gradient(ellipse at 0 0,rgba(226,201,143,.16),transparent 70%),#181d26;border-color:#82704c}.dk-range b{color:var(--gold-light)}
.dk-two{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:18px}
.dk-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.dk-list li{padding:8px 12px;font-size:.94rem;line-height:1.65;border-bottom:1px solid rgba(255,255,255,.06)}
.dk-list li:last-child{border-bottom:0}
.dk-list.dk-tight li{padding:6px 12px}
.dk-list li.dk-ok{background:rgba(52,211,153,.06)}.dk-list li.dk-bad{background:rgba(251,113,133,.09);color:#ffd6de}.dk-list li.dk-warn{background:rgba(255,193,139,.08);color:#ffe2c6}
.dk-src{margin-left:6px;font-size:.82rem;color:var(--gold-light);white-space:nowrap}
.dk-tfs{display:flex;flex-wrap:wrap;gap:8px}
.dk-tf{display:flex;flex-direction:column;gap:2px;padding:8px 12px;border:1px solid #34445c;border-radius:10px;background:#111a2a;min-width:92px}
.dk-tf small{font-size:.8rem;color:#c4cfdf}.dk-tf b{font-size:.95rem}
.dk-note{margin:8px 0 0;font-size:.82rem;line-height:1.6;color:var(--muted)}
#deskLive .ls-key{background:radial-gradient(ellipse at 0 0,rgba(226,201,143,.14),transparent 70%);border-radius:10px;padding:16px 14px !important}
#deskLive .ls-key>.ls-value{color:var(--gold-light)}
#deskLive .ls-use{font-size:.92rem;font-weight:600}
.ls-use-bar{display:block;height:6px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;margin:2px 0}
.ls-use-bar i{display:block;height:100%;background:linear-gradient(90deg,#c9a84c,#f4e1b2)}
@media(max-width:900px){.dk-levels{grid-template-columns:repeat(2,minmax(0,1fr))}.dk-two{grid-template-columns:1fr}}
@media(max-width:420px){.dk-dec-title{font-size:1.35rem}.dk-lv b{font-size:1.25rem}.dk-plan-strike{font-size:1.25rem}}

/* ---- day snapshots + session picker ---- */
.dk-head-r{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.dk-pick{display:inline-flex;align-items:center;gap:6px;font-size:.88rem;color:#c4cfdf}
.dk-pick select{background:#111a2a;color:#e8ecf4;border:1px solid #475a74;border-radius:8px;padding:6px 10px;font:inherit;color-scheme:dark}
.dk-snap-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.dk-snap-head h4{margin:0}
.dk-snap-seg{margin-bottom:12px;flex-wrap:wrap}
.dk-snap-seg button small{font-size:.72rem;opacity:.75}
.dk-snap-spy{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;padding:12px 14px;border:1px solid #82704c;border-radius:12px;background:radial-gradient(ellipse at 0 0,rgba(226,201,143,.14),transparent 70%),#151c28;margin-bottom:12px}
.dk-snap-spy small{width:100%;color:#c4cfdf;font-size:.84rem}
.dk-snap-spy>b{font-family:var(--font-head);font-size:1.6rem;color:var(--gold-light)}
.dk-snap-spy span{font-size:.84rem;color:var(--muted)}
.dk-snap-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:18px}
.dk-snap-grid h5{margin:0 0 6px;font-size:.92rem;font-weight:600;color:#e8ecf4}
.dk-row{display:grid;grid-template-columns:1fr auto 6.6em;gap:10px;align-items:center}
.dk-num{font-variant-numeric:tabular-nums;color:#e1e5ee}
.dk-row b{text-align:right;font-variant-numeric:tabular-nums}
.dk-gex{margin:0;font-size:.9rem;line-height:1.7}
.btn-sm{padding:6px 12px;font-size:.86rem}
@media(max-width:760px){.dk-snap-grid{grid-template-columns:1fr}}

/* ---- expected-move track + SPY lean tags (2026-10-09 round 4) ---- */
.ls-rtrack{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;font-size:.78rem;color:#c4cfdf;font-variant-numeric:tabular-nums;margin:2px 0 4px}
.ls-rbar{position:relative;height:8px;border-radius:999px;background:linear-gradient(90deg,rgba(251,113,133,.25),rgba(226,201,143,.18) 50%,rgba(52,211,153,.25))}
.ls-rmid{position:absolute;left:50%;top:-3px;width:1px;height:14px;background:#c4cfdf;opacity:.6}
.ls-rnow{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#f4e1b2;border:2px solid #0b1220;box-shadow:0 0 0 2px #f4e1b2}
.ls-rnow.is-out{background:#ffc18b;box-shadow:0 0 0 2px #ffc18b}
.ls-rline{font-size:.86rem;line-height:1.6;color:#e1e5ee}
.ls-tone-gold{color:var(--gold-light)}
#deskLive .ls-rnote{font-size:.76rem;line-height:1.55;color:var(--muted)}
#deskLive .ls-expiry .chip{align-self:flex-start;margin-bottom:2px}
.dk-lean{margin-left:8px;font-size:.74rem;vertical-align:middle;white-space:nowrap}
.dk-row{grid-template-columns:1fr auto 6.6em auto}
.dk-row .dk-lean{margin-left:0;justify-self:end}
@media(max-width:420px){.dk-row{grid-template-columns:1fr auto auto;row-gap:2px}.dk-row .dk-lean{grid-column:1 / -1;justify-self:start}}

/* ---- 📘 MACD guide (Lessons tab) ---- */
.dk-plan-row span{white-space:pre-line}
.dk-link{background:none;border:0;padding:0;color:var(--gold-light);font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.dk-link:focus-visible{outline:2px solid var(--gold-light);outline-offset:2px;border-radius:4px}
.mg{border:1px solid #34445c;border-radius:14px;padding:20px 22px;margin:0 0 22px;background:radial-gradient(ellipse at 0 0,rgba(139,196,244,.10),transparent 60%),#0f1828;display:flex;flex-direction:column;gap:16px}
.mg-head h3{margin:0 0 6px;font-family:var(--font-head);font-weight:600;font-size:1.35rem}
.mg-head p{margin:0;color:#c4cfdf;line-height:1.65;max-width:75ch}
.mg-cards{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:12px}
.mg-card{border:1px solid #34445c;border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:6px;background:#111a2a}
.mg-card>b{font-family:var(--font-head);font-size:1.1rem}
.mg-card p{margin:0;font-size:.9rem;line-height:1.6;color:#e1e5ee}.mg-card span{font-size:.8rem;color:var(--muted)}
.mg-up{border-color:#387961;background:radial-gradient(ellipse at 0 0,rgba(86,216,160,.14),transparent 70%),#111d24}.mg-up>b{color:#91edbf}
.mg-down{border-color:#965067;background:radial-gradient(ellipse at 0 0,rgba(247,125,161,.14),transparent 70%),#1b1824}.mg-down>b{color:#ff9fb0}
.mg-mixed>b{color:#e8ecf4}
.mg-two{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mg-mini{width:100%;height:auto;display:block;border-radius:8px;background:#0b1220}
.mg-key{margin:0;font-size:.8rem;line-height:1.6;color:var(--muted)}
.mg-rule{border:1px solid #857240;border-radius:12px;padding:12px 14px;background:radial-gradient(ellipse at 100% 0,rgba(244,216,120,.10),transparent 65%),#141a22;font-size:.92rem;line-height:1.65}
.mg-rule small{display:block;color:var(--muted);font-size:.78rem;margin-top:6px}
.mg-frs{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.mg-fr{display:flex;flex-direction:column;gap:2px;padding:8px 12px;border:1px solid #34445c;border-radius:10px;background:#111a2a;min-width:96px}
.mg-fr small{font-size:.8rem;color:#c4cfdf}.mg-fr b{font-size:.95rem}
.mg-chart{display:flex;flex-direction:column;gap:6px}
.mg-chart-top{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.mg-chart-top h4{margin:0;font-family:var(--font-head);font-weight:600;font-size:1.02rem}
.mg-svg{width:100%;height:auto;display:block;border-radius:10px;background:#0b1220;touch-action:pan-y;cursor:crosshair}
.mg-info{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:12px;align-items:start;border:1px solid #34445c;border-radius:12px;padding:12px 14px;background:#111a2a}
.mg-info small{display:block;color:#c4cfdf;font-size:.8rem}.mg-info b{display:block;font-family:var(--font-head);font-size:1.25rem;margin:2px 0}.mg-info span{font-size:.88rem;color:#e1e5ee;line-height:1.55}
.mg-info dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 12px}.mg-info dt{font-size:.76rem;color:var(--muted)}.mg-info dd{margin:0;font-variant-numeric:tabular-nums;font-weight:600}
.mg-more{margin:0}
@media(max-width:860px){.mg-cards{grid-template-columns:1fr}.mg-info{grid-template-columns:1fr}.mg{padding:16px}}

/* ---- realtime MACD pane under the candles ---- */
.ch-macd-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:10px 4px 4px;font-size:.92rem;color:#e1e5ee;border-top:1px solid rgba(226,201,143,.14);padding-top:10px}
.ch-macd-head span{font-size:.84rem;color:#c4cfdf}
.ch-macd-head .ch-macd-key{flex-basis:100%;font-size:.76rem;color:var(--muted)}
.ch-macd-host{width:100%;height:170px}

.ch-wall-note{display:block;flex-basis:100%;font-size:.8rem;color:#f4d878;margin-top:2px}

/* ---- MACD cross statistics + revised rule row ---- */
.mg-verdict{border-color:#857240}
.mg-stats h4{margin:0 0 4px;font-family:var(--font-head);font-weight:600;font-size:1.02rem}
.mg-tablewrap{overflow-x:auto}
.mg-table{width:100%;border-collapse:collapse;font-size:.88rem;font-variant-numeric:tabular-nums;min-width:640px}
.mg-table th,.mg-table td{padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.07);text-align:right;white-space:nowrap}
.mg-table th[scope=row],.mg-table thead th:first-child{text-align:left}
.mg-table thead th{font-size:.78rem;font-weight:500;color:#c4cfdf}
.mg-table .mg-more{color:#91edbf}.mg-table .mg-against{color:#ff9fb0}
.mg-table .mg-right span{font-size:.78rem;margin-left:4px}
.mg-good{background:rgba(52,211,153,.08)}.mg-good .mg-right b{color:#91edbf}
.mg-bad{background:rgba(251,113,133,.09)}.mg-bad .mg-right b{color:#ff9fb0}
.mg-flat .mg-right b{color:#e1e5ee}
.mg-weak{opacity:.6}

.mg-chart .mg-stats{order:-1;margin-bottom:14px}

.dk-shape{width:100%;height:auto;display:block;background:#0b1220;border-radius:8px;margin-top:6px}

/* ---- trade journal chart + playbook flow (2026-10-10) ---- */
.tc{border:1px solid #34445c;border-radius:14px;padding:16px 18px;margin:0 0 18px;background:radial-gradient(ellipse at 0 0,rgba(226,201,143,.08),transparent 60%),#0f1828}
.tc-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.tc-head h3{margin:0;font-family:var(--font-head);font-weight:600;font-size:1.1rem}
.tc-head b{font-family:var(--font-head);font-size:1.4rem}
.tc-svg{width:100%;height:auto;display:block;margin-top:6px}
.tc-bar{transform-box:fill-box;transform-origin:bottom;animation:tcGrow .6s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--d,0ms)}
.tc-line{stroke-dasharray:2000;stroke-dashoffset:2000;animation:tcDraw 1.2s .2s cubic-bezier(.22,1,.36,1) forwards}
@keyframes tcGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes tcDraw{to{stroke-dashoffset:0}}
.tc-groups{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.tc-groups h4{margin:0 0 2px;font-size:.92rem;font-weight:600}
.tc-grp{display:grid;grid-template-columns:minmax(150px,auto) 1fr auto;gap:10px;align-items:center;font-size:.9rem}
.tc-grp small{color:var(--muted)}
.tc-track{height:10px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden}
.tc-track i{display:block;height:100%;border-radius:999px;animation:tcFill .8s cubic-bezier(.22,1,.36,1) both}
.tc-track i.pos{background:linear-gradient(90deg,#2f8f6a,#91edbf)}.tc-track i.neg{background:linear-gradient(90deg,#9b3b55,#ff9fb0)}
@keyframes tcFill{from{width:0}}
.pb-flow{display:flex;gap:18px;align-items:center;border:1px solid #34445c;border-radius:14px;padding:14px 16px;margin:0 0 14px;background:#0f1828}
.pb-ring{width:84px;height:84px;flex:none}
.pb-ring-fg{transition:stroke-dasharray .5s cubic-bezier(.22,1,.36,1)}
.pb-steps{display:flex;align-items:stretch;gap:8px;flex:1;flex-wrap:wrap}
.pb-step{flex:1;min-width:140px;display:flex;flex-direction:column;gap:3px;padding:10px 12px;border:1px solid #34445c;border-radius:12px;background:#111a2a;color:inherit;text-decoration:none;transition:border-color .2s,transform .2s}
.pb-step:hover,.pb-step:focus-visible{border-color:#82704c;transform:translateY(-2px)}
.pb-ico{font-size:1.3rem}.pb-step b{font-family:var(--font-head);font-weight:600}.pb-step small{color:var(--muted);font-size:.78rem}
.pb-mini{height:5px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden;margin-top:4px}.pb-mini i{display:block;height:100%;background:#f4d878}
.pb-arrow{align-self:center;color:#82704c;font-size:1.1rem}
@media(max-width:760px){.pb-flow{flex-direction:column;align-items:stretch}.pb-ring{align-self:center}.pb-arrow{display:none}.tc-grp{grid-template-columns:1fr auto}.tc-grp .tc-track{grid-column:1 / -1;grid-row:2}}
@media (prefers-reduced-motion:reduce){.tc-bar,.tc-line,.tc-track i{animation:none;stroke-dashoffset:0}}

/* ---- detail + edit views in zones (2026-10-10): heading ≠ value, one zone per job ---- */
.modal{width:min(820px,100%)}
.dv-hero{border:1px solid #34445c;border-radius:14px;padding:14px 16px;margin:0 0 14px;display:flex;flex-direction:column;gap:6px;background:#111a2a}
.dv-hero.dv-up{border-color:#387961;background:radial-gradient(ellipse at 0 0,rgba(86,216,160,.16),transparent 70%),#111d24}
.dv-hero.dv-down{border-color:#965067;background:radial-gradient(ellipse at 0 0,rgba(247,125,161,.16),transparent 70%),#1b1824}
.dv-chips{display:flex;gap:6px;flex-wrap:wrap}
.dv-big{font-family:var(--font-head);font-size:2rem;font-weight:700;line-height:1.2}
.dv-big.up{color:#91edbf}.dv-big.down{color:#ff9fb0}.dv-big.flat{color:#e1e5ee}
.dv-sub{color:#c4cfdf;font-size:.9rem}
.dv-zone,.ed-zone{border:1px solid #2b3a52;border-radius:12px;padding:12px 14px 4px;margin:0 0 12px;background:rgba(255,255,255,.02);min-width:0}
.dv-h{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:0 0 8px;border-bottom:1px solid rgba(226,201,143,.22);font-family:var(--font-head);font-weight:600;font-size:1.02rem;color:#f4e1b2;width:100%}
.ed-zone legend.dv-h{float:left;padding:0 0 8px}
.ed-zone legend.dv-h + *{clear:both}
.dv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:4px 16px;margin:0}
.dv-grid .d-row{margin:0 0 10px}
.dv-grid .d-row.wide{grid-column:1 / -1}
.dv-grid .d-row dt{font-family:inherit;font-weight:500;font-size:.78rem;color:#9aa6bb;letter-spacing:.01em;margin-bottom:3px}
.dv-grid .d-row dd{font-size:.95rem;color:#eef1f7;line-height:1.6}
.dv-grid .d-row dd.blank{color:#6f7a8f;font-size:.85rem}
@media(max-width:560px){.dv-grid{grid-template-columns:1fr 1fr}.dv-big{font-size:1.6rem}}
.ed-zone{position:relative}
.modal-back{overflow-x:hidden}

/* ---- RSI pane, VWAP readout, VIX chips (2026-10-10) ---- */
.ch-rsi-host{width:100%;height:120px}
.ch-vixes{display:inline-flex;gap:10px;flex-wrap:wrap;margin-right:10px}
.ch-vix{font-size:.84rem;color:#c4cfdf;padding:3px 8px;border:1px solid #34445c;border-radius:999px;background:#111a2a}
.ch-vix b{color:#e8ecf4}.ch-vix em{font-style:normal;font-size:.78rem}
.ch-vix em.up{color:#91edbf}.ch-vix em.down{color:#ff9fb0}
.ch-vw-now{flex-basis:100%;font-size:.84rem}
.ch-vw-now b.up{color:#91edbf}.ch-vw-now b.down{color:#ff9fb0}
.mg-table th[scope=row] small{display:block;font-weight:400;font-size:.74rem;color:var(--muted);white-space:normal}

/* ---- timing boxes (desk + chart), GEX secondary walls (2026-10-10) ---- */
.tm-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.tm-box{border:1px solid #34445c;border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:4px;background:#111a2a}
.tm-box small{font-size:.82rem;color:#c4cfdf}.tm-box b{font-family:var(--font-head);font-size:1.45rem;font-weight:700}.tm-box span{font-size:.84rem;line-height:1.5;color:#e1e5ee}
.tm-good{border-color:#387961;background:radial-gradient(ellipse at 0 0,rgba(86,216,160,.16),transparent 70%),#111d24}.tm-good b{color:#91edbf}
.tm-bad{border-color:#965067;background:radial-gradient(ellipse at 0 0,rgba(247,125,161,.16),transparent 70%),#1b1824}.tm-bad b{color:#ff9fb0}
.tm-warn{border-color:#a26e46;background:radial-gradient(ellipse at 0 0,rgba(255,193,139,.14),transparent 70%),#1d1a1c}.tm-warn b{color:#ffc18b}
.tm-flat b{color:#e8ecf4}
.ch-tbox{display:inline-flex;flex-direction:column;gap:1px;padding:6px 12px;border:1px solid #34445c;border-radius:10px;background:#111a2a;min-width:110px}
.ch-tbox small{font-size:.74rem;color:#c4cfdf}.ch-tbox b{font-family:var(--font-head);font-size:1.15rem}.ch-tbox em{font-style:normal;font-size:.74rem;color:#c4cfdf}
.ch-tbox.good{border-color:#387961;background:#122520}.ch-tbox.good b{color:#91edbf}
.ch-tbox.bad{border-color:#965067;background:#251a24}.ch-tbox.bad b{color:#ff9fb0}
.gx-wall2{fill:none;stroke:rgba(196,207,223,.55);stroke-width:1.2;stroke-dasharray:3 2}
.gx-wall2-line{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0 0;font-size:.86rem;color:#c4cfdf}
.gx-w2chip{padding:3px 10px;border:1px dashed rgba(196,207,223,.5);border-radius:999px;background:rgba(196,207,223,.06);color:#e1e5ee}
.gx-wall2-line small{flex-basis:100%;color:var(--muted);font-size:.76rem}
@media(max-width:760px){.tm-row{grid-template-columns:1fr}}
.ch-vixes{align-items:center}

.tm-row{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1000px){.tm-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.tm-row{grid-template-columns:1fr}}
.ch-tbox.warn{border-color:#a26e46;background:#251d18}.ch-tbox.warn b{color:#ffc18b}
.ch-ext-note{flex-basis:100%;font-size:.74rem;color:var(--muted)}
.ch-vixes{flex-wrap:wrap}

/* draft vs final post-close result (2026-10-10) */
.dk-sec.dk-draft{border:1px solid #8a6a3a;border-radius:12px;padding:12px 14px;background:linear-gradient(180deg,rgba(244,216,120,.07),transparent 60%)}
.dk-sec.dk-final{border:1px solid #387961;border-radius:12px;padding:12px 14px}
.dk-tags{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 8px}
.dk-draft-note{margin:0 0 10px;padding:8px 10px;border-radius:8px;background:#251f14;color:#f4d878;font-size:.88rem;line-height:1.5}

.pt .pt-near{color:#f4d878;font-weight:600}

/* layout fixes 2026-10-10: values wrap under the price instead of spilling out of narrow tiles; pills never break */
.tile .t-row{flex-wrap:wrap;row-gap:4px}
.ex-r .chip{white-space:nowrap;justify-self:start}

/* 🧪 lab panels (2026-10-10): expectancy · back-test · reach calculator · trade excursion */
.lb-card{margin:14px 0}
.lb-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:8px 0}
.lb-box{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid #34445c;border-radius:12px;background:#111a2a;min-width:0}
.lb-box small{font-size:.78rem;color:#9aa6bb}
.lb-box b{font-family:var(--font-head);font-size:1.3rem;color:#eef1f7;line-height:1.25}
.lb-box span{font-size:.82rem;color:#c4cfdf;line-height:1.5}
.lb-box.lb-good{border-color:#387961}.lb-box.lb-good b{color:#91edbf}
.lb-box.lb-bad{border-color:#965067}.lb-box.lb-bad b{color:#ff9fb0}
.lb-box.lb-warn{border-color:#8a6a3a}.lb-box.lb-warn b{color:#f4d878}
.lb-h{margin:14px 0 4px;font-family:var(--font-head);font-weight:600;font-size:1rem;color:#f4e1b2}
.lb-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0;font-size:.85rem;color:#c4cfdf}
.lb-pill{padding:3px 10px;border-radius:20px;border:1px solid #34445c;font-size:.8rem}
.lb-pill.lb-good{color:#91edbf;border-color:#387961}.lb-pill.lb-bad{color:#ff9fb0;border-color:#965067}
.lb-list{margin:6px 0;padding-left:18px;font-size:.86rem;line-height:1.7;color:#c4cfdf}
.lb-list li.lb-good b{color:#91edbf}.lb-list li.lb-bad b{color:#ff9fb0}.lb-list li.lb-warn b{color:#f4d878}
.lb-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:6px 0 10px}
.lb-form label{display:flex;flex-direction:column;gap:4px;font-size:.8rem;color:#9aa6bb}
.lb-form input,.lb-form select{font:inherit;font-size:.95rem;color:#eef1f7;background:#0a1220;border:1px solid #4a5a72;border-radius:8px;padding:8px 10px;min-height:42px;color-scheme:dark}
.lb-form input:focus-visible,.lb-form select:focus-visible{outline:2px solid #f4d878;outline-offset:2px}
@media(max-width:680px){.lb-form{grid-template-columns:1fr 1fr}.lb-box b{font-size:1.15rem}}

/* 🤖 paper trade tab */
.pp-books{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.pp-book{margin:0}
.pp-now{margin:4px 0 8px;padding:8px 12px;border-radius:8px;background:#0f1828;border:1px solid #2b3a52;font-size:.88rem;color:#c4cfdf;line-height:1.55}
.pp-now.pp-open{border-color:#8a6a3a;background:#251f14;color:#f4d878}
.pp-now small{color:#9aa6bb}
.pp-list li{margin-bottom:6px}.pp-list small{color:#9aa6bb}
@media(max-width:760px){.pp-books{grid-template-columns:1fr}}
.sg-card{margin-top:14px}.sg-table{min-width:0}.sg-table td,.sg-table th{white-space:normal;vertical-align:top}.sg-table td b{display:block;font-size:1.05rem;color:#eef1f7}.sg-table td.mg-more b{color:#91edbf}.sg-table td.mg-against b{color:#ff9fb0}.sg-table td small{display:block;font-size:.74rem;color:#9aa6bb;line-height:1.45}.sg-table td.sg-na{color:#9aa6bb}
.sg-h{margin:16px 0 6px;font-size:.92rem;font-weight:600;color:#c4cfdf}.sg-day{border-top:1px solid #2b3a52;padding:6px 0}.sg-day summary{cursor:pointer;min-height:40px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.88rem;color:#c4cfdf}.sg-day summary b{color:#eef1f7}

/* 🚦 พร้อมกดไหม (Trade Desk decision panel) */
.go-card{margin:0 0 16px;padding:16px 18px;border:1px solid #34445c;border-radius:14px;background:#0f1828}
.go-card.go-ok{border-color:#387961;background:radial-gradient(ellipse at 0 0,rgba(86,216,160,.12),transparent 60%),#0f1c22}
.go-card.go-wait{border-color:#8a6a3a}
.go-card.go-bad{border-color:#965067}
.go-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap}
.go-verdict{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
.go-verdict b{font-family:var(--font-head);font-size:1.7rem;line-height:1.1;color:#eef1f7}
.go-ok .go-verdict b{color:#91edbf}.go-wait .go-verdict b{color:#f4d878}.go-bad .go-verdict b{color:#ff9fb0}
.go-verdict span{font-size:.85rem;color:#c4cfdf;max-width:340px}
.go-list{list-style:none;margin:8px 0;padding:0;display:grid;gap:6px}
.go-li{display:grid;grid-template-columns:22px minmax(150px,auto) 1fr;gap:8px;align-items:baseline;font-size:.88rem;color:#c4cfdf}
.go-li b{color:#eef1f7;font-weight:600}
.go-li.go-bad span{color:#ffb3c1}.go-li.go-wait span{color:#f4d878}
.go-details summary{cursor:pointer;color:#f4e1b2;font-weight:600;margin-top:8px}
.go-tickets{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px;margin-top:10px}
.go-ticket{border:1px solid #34445c;border-radius:12px;padding:12px 14px;background:#111a2a}
.go-ticket.go-pass{border-color:#387961}.go-ticket.go-fail{border-color:#5a4a5a}
.go-ticket h4{margin:0 0 6px;font-family:var(--font-head);font-size:1rem;color:#eef1f7}
.go-order{margin:8px 0;padding:10px 12px;border-radius:10px;background:#12261f;color:#d8f5e8;font-size:.9rem;line-height:1.6}
.go-held{margin:12px 0 4px;padding:12px 14px;border:1px solid #8a6a3a;border-radius:12px;background:#1d1912}
.go-held h4{margin:0 0 6px;color:#f4d878;font-family:var(--font-head)}
.go-bot{margin:10px 0 0;font-size:.85rem;color:#c4cfdf}
@media(max-width:680px){.go-verdict{align-items:flex-start;text-align:left}.go-li{grid-template-columns:22px 1fr}.go-li span{grid-column:2}}

/* 🔬 analyses that unlock at 20 trades */
.ins-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px;margin:8px 0}
.ins-card{border:1px dashed #4a5a72;border-radius:12px;padding:12px 14px;background:#0f1828}
.ins-card.ins-open{border-style:solid;border-color:#387961}
.ins-card h4{margin:0 0 8px;font-family:var(--font-head);font-size:.98rem;color:#eef1f7}
.ins-bar{height:6px;border-radius:6px;background:#1f2b3d;overflow:hidden}.ins-bar i{display:block;height:100%;background:#f4d878}
.ins-open .ins-bar i{background:#91edbf}
.ins-sub{margin:6px 0;font-size:.82rem;color:#9aa6bb}
.ins-t{width:100%;border-collapse:collapse;font-size:.82rem;color:#c4cfdf}
.ins-t th,.ins-t td{padding:4px 6px;border-top:1px solid #243246;text-align:right}.ins-t th:first-child,.ins-t td:first-child{text-align:left}
.ins-t thead th{color:#9aa6bb;font-weight:500}
.ins-t td.up{color:#91edbf}.ins-t td.down{color:#ff9fb0}

.go-alarm{margin:10px 0 4px;padding:8px 12px;border-radius:10px;border:1px solid #8a6a3a;background:#251f14;color:#f4d878;font-size:.88rem;line-height:1.55}

/* 🧭 Trade Desk live alert and live news desk */
.ls-alert-bar{background:radial-gradient(ellipse at 0 0,rgba(251,113,133,.18),transparent 70%),linear-gradient(135deg,#2b1720,#141b2b);border:1px solid #964057;border-radius:10px;padding:14px 18px;margin:18px 0 10px;display:flex;flex-direction:column;gap:6px}
.ls-alert-bar b{color:#ffb0bd;font-size:1.02rem}
.ls-alert-bar p{margin:0;color:#e1e5ee;font-size:.88rem;line-height:1.6}
.ls-news-box{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:16px 20px;margin-top:18px}
.ls-news-items{list-style:none;padding:0;margin:10px 0 0;display:flex;flex-direction:column;gap:12px}
.ls-news-items li{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.06)}
.ls-news-items li:last-child{border-bottom:0;padding-bottom:0}
.ls-news-items a{color:var(--text);text-decoration:none;font-size:.92rem;line-height:1.5}
.ls-news-items a:hover{color:var(--gold-light);text-decoration:underline}
.ls-news-items span{display:flex;align-items:center;gap:10px;white-space:nowrap}
.ls-news-items small{color:var(--muted);font-size:.78rem}
.ls-news-link{color:var(--gold) !important;font-size:.8rem;font-weight:500}
@media(max-width:680px){.ls-news-items li{flex-direction:column;gap:4px}.ls-news-items span{align-self:flex-start}}

/* 🎯 Trade Setups Catalog & No-Trade Days in #panel-trades */
.trade-setups-box{margin-bottom:24px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:20px 24px}
.setups-guide-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:10px}
.setups-guide-head h3{font-size:1.15rem;font-weight:600;margin:0;color:var(--gold-light)}
.setups-guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.setup-guide-card{background:var(--card-2);border:1px solid var(--line);border-radius:var(--r-tile);padding:16px;display:flex;flex-direction:column;gap:10px;transition:border-color .16s,transform .16s}
.setup-guide-card:hover{border-color:var(--gold);transform:translateY(-2px)}
.setup-card-a{}
.setup-card-b{}
.setup-card-c{}
.setup-card-wait{}
.setup-guide-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.setup-guide-top b{font-size:.95rem;color:var(--text)}
.setup-when{font-size:.85rem;color:var(--gold-light);margin:0;line-height:1.5}
.setup-desc{font-size:.85rem;color:var(--muted);line-height:1.6}
.setup-target{font-size:.83rem;background:rgba(255,255,255,.03);padding:8px 10px;border-radius:6px;border:1px dashed var(--line);margin-top:auto}

.no-trades-box{margin-bottom:28px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:20px 24px}
.no-trades-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;flex-wrap:wrap;gap:10px}
.no-trades-head h3{font-size:1.15rem;font-weight:600;margin:0;color:var(--text)}
.no-trades-sub{font-size:.88rem;color:var(--muted);margin:0 0 16px;line-height:1.6}
.no-trades-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.no-trade-card{background:var(--card-2);border:1px solid var(--line);border-radius:var(--r-tile);padding:16px;text-align:left;display:flex;flex-direction:column;gap:10px;cursor:pointer;transition:border-color .16s,background .16s}
.no-trade-card:hover{border-color:var(--sky);background:var(--card-hover)}
.no-trade-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.no-trade-top h4{margin:0;font-size:1rem;color:var(--text)}
.no-trade-row{font-size:.85rem;line-height:1.5;color:var(--muted)}
.no-trade-row b{color:var(--text)}
.no-trade-lesson{font-size:.84rem;color:#cbd5e1;background:rgba(0,0,0,.25);padding:10px;border-radius:6px;margin-top:4px;line-height:1.55}
.no-trade-foot{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--muted);border-top:1px solid var(--line);padding-top:8px;margin-top:auto}

/* 💡 Lesson Cards & Modern Interactive Buttons */
.card .card-foot{margin-top:auto;padding-top:10px;font-size:.82rem;color:var(--muted);display:flex;gap:8px;justify-content:space-between;align-items:center}
.card .card-foot > span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card .open-hint, .card .btn-read-more{display:inline-flex;align-items:center;gap:4px;white-space:nowrap !important;flex-shrink:0;padding:4px 10px;background:rgba(99,102,241,.12);border:1px solid rgba(99,102,241,.32);border-radius:var(--r-pill,9999px);color:#c7d2fe;font-family:var(--font-head);font-weight:700;font-size:.82rem;line-height:1;transition:background .15s,border-color .15s,color .15s,transform .15s}
.card:hover .open-hint, .card:hover .btn-read-more{background:rgba(99,102,241,.28);border-color:rgba(129,140,248,.7);color:#fff;transform:translateX(2px)}
.card-pills{display:flex;flex-wrap:wrap;gap:5px;margin:2px 0 4px}
.pill-metric{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:6px;font-size:.78rem;font-weight:600;font-family:var(--mono);line-height:1.3}
.pill-gold{background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.3);color:#fbbf24}
.pill-green{background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.3);color:#4ade80}
.pill-sky{background:rgba(56,189,248,.12);border:1px solid rgba(56,189,248,.3);color:#38bdf8}
.pill-red{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.3);color:#f87171}
.pill-purple{background:rgba(168,85,247,.12);border:1px solid rgba(168,85,247,.3);color:#c084fc}
.lesson-takeaway-box{background:rgba(15,23,42,.7);border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:8px 10px;margin:4px 0 6px;font-size:.85rem;line-height:1.45;color:#e2e8f0}
.lesson-takeaway-box b{color:#f8fafc;font-weight:700}
.lesson-takeaway-box .num-gold{color:#fbbf24;font-weight:700;font-family:var(--mono)}
.lesson-takeaway-box .num-up{color:#4ade80;font-weight:700;font-family:var(--mono)}
.lesson-takeaway-box .num-down{color:#f87171;font-weight:700;font-family:var(--mono)}
.setup-sub-box{background:rgba(15,23,42,.7);border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:8px 10px;margin:4px 0 6px;font-size:.85rem;line-height:1.45;color:#e2e8f0}
.setup-when-preview{margin:0;font-size:.86rem;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5}




/* Decision-first reading layers, 2026-10-15. Data panels keep their North Star palette. */
:root{--font-head:var(--aku-font-head);--mono:var(--aku-font-mono)}
.panel-head h2{font-family:var(--font-head);font-size:1.8rem;font-weight:600;line-height:1.45}
.panel-head p{font-family:var(--font-body);font-size:1rem;font-weight:400;line-height:1.65;max-width:64ch}
.panel h3,.modal h3{font-family:var(--font-head);font-weight:500;line-height:1.5}
.panel h4{font-family:var(--font-head);font-weight:500}
.mk-grid{align-items:start;gap:28px}
#mkSpy{grid-column:span 6;background:none;border:0;border-radius:0;padding:12px 24px 16px 0}
#mkMacd{grid-column:span 6;background:#142032;border:1px solid #43536a;padding:24px;border-radius:12px}
.mk-box h3{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:1.18rem;font-weight:500;margin:0 0 12px;letter-spacing:0}
.mk-box h3 .chip{font-family:var(--font-body);font-size:.8rem;font-weight:500}
.mk-box .sub{font-size:.94rem;line-height:1.7;max-width:68ch}
#mkSpy .spy-price{font-family:var(--font-body);font-size:3.2rem;font-weight:700;line-height:1.3;color:#f5f6fa}
#mkSpy .spy-chg{font-size:1.15rem;font-weight:600}
#mkSpy .stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 22px;margin:24px 0 12px}
#mkSpy .stat{padding:0;border:0;background:none;border-radius:0;min-width:0}
#mkSpy .stat small{font-size:.87rem;color:var(--muted)}
#mkSpy .stat b{font-family:var(--font-body);font-size:1.25rem;font-weight:600;color:var(--text)}
#mkSpy .stat:nth-child(n+4){grid-column:span 1}
#mkSpy .stat:nth-child(4){grid-column:span 2}
#mkSpy .stat em{font-size:.86rem;line-height:1.6;max-width:29ch}
#mkMacd .mk-macd-decision{background:none;border:0;padding:0;margin:8px 0 20px}
#mkMacd .mk-macd-decision>strong{display:block;font-family:var(--font-head);font-size:2rem;font-weight:500;line-height:1.5}
#mkMacd .mk-macd-decision>p{font-size:1rem;line-height:1.7;margin:8px 0 0;max-width:50ch}
.mk-frame-chain{display:flex;gap:0;margin:20px 0 12px;padding-block:16px;border-block:1px solid #43536a}
.mk-frame{flex:1;min-width:0;position:relative;padding-inline:16px}
.mk-frame:first-child{padding-left:0}.mk-frame:last-child{padding-right:0}
.mk-frame+.mk-frame{border-left:1px solid #43536a}
.mk-frame span{display:block;color:var(--muted);font-size:.9rem}
.mk-frame b{display:block;font-size:.95rem;font-weight:600;margin-top:6px}
.mk-disclosure{margin-top:16px;border-top:1px solid var(--line);font-family:var(--font-body)}
.mk-disclosure>summary{cursor:pointer;color:var(--gold-light);padding:10px 0;min-height:44px;font-size:.94rem;font-weight:500}
.mk-evidence-body{padding:4px 0 12px;color:var(--muted);font-size:.96rem;line-height:1.75;max-width:72ch}
.mk-evidence-body p{margin:8px 0}
.mk-evidence-body .macd-table{width:100%;table-layout:fixed}
.mk-evidence-body .macd-table th,.mk-evidence-body .macd-table td{font-size:.82rem;overflow-wrap:anywhere;padding:10px 6px}
.mk-evidence-body .macd-table th:nth-child(1){width:11%}.mk-evidence-body .macd-table th:nth-child(2){width:45%}
.mk-evidence-body .chip{white-space:normal}
#mkLevels{background:none;border:0;border-block:1px solid #43536a;border-radius:0;padding:28px 0}
#mkLevels .lvl-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:24px}
#mkLevels .stat{min-width:0;border:0;border-radius:0;background:none;padding:16px 24px}
#mkLevels .stat:nth-child(-n+3){border-bottom:1px solid var(--line)}
#mkLevels .stat:nth-child(3n+1){padding-left:0}
#mkLevels .stat small{font-family:var(--font-body);font-size:.94rem;line-height:1.5;font-weight:500}
#mkLevels .stat b{font-family:var(--font-body);font-size:1.8rem;line-height:1.7}
#mkLevels .stat em{font-size:.88rem;line-height:1.7;max-width:44ch}
#mkLevels .stat:nth-child(4){grid-column:span 1}
#mkLevels .stat:nth-child(5){grid-column:span 2}
#mkLevels .stat:nth-child(1) small{color:#91edbf}#mkLevels .stat:nth-child(2) small{color:#ff9fb0}
#mkLevels .gex-bars{margin-top:24px}
#mkCross .tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 26px}
#mkCross .tile,#mkBreadth .tile{padding:14px 0;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;min-width:0}
#mkCross .t-name,#mkBreadth .t-name{font-size:.94rem;font-weight:500;gap:8px}
#mkCross .t-name b,#mkBreadth .t-name b{font-weight:500}
#mkCross .t-px,#mkBreadth .t-px{font-size:1.2rem}
#mkCross .t-row{margin-top:6px}
#mkCross .t-chg,#mkBreadth .t-chg{font-family:var(--font-body);font-size:.94rem;font-weight:600;border:0;border-radius:0;background:none;padding:0}
#mkCross .t-lean,#mkBreadth .t-lean{font-size:.85rem}
#mkCross .t-age,#mkBreadth .t-age{font-size:.8rem;line-height:1.6}
#mkBreadth,#mkEvents{padding:24px 0;border:0;border-top:1px solid var(--line);border-radius:0;background:none}
#mkBreadth{grid-column:span 7;padding-right:24px}
#mkEvents{grid-column:span 5}
#mkBreadth .tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 20px}
#mkBreadth .sector-list{grid-template-columns:1fr;margin-top:16px}
#mkBreadth .sector-list .tile{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;padding-block:10px}
#mkBreadth .sector-list .t-age{grid-column:1 / -1}
#mkBreadth .sector-list .t-name span:last-child{margin-left:12px}
.mk-note{font-size:.88rem;line-height:1.75}
.opening-routine{margin-bottom:20px!important}.opening-routine .explain-body{max-width:72ch}
.paper-policy{margin-bottom:24px!important}
/* Repeated content previews: one outer object, calm inner rows. */
.lesson-takeaway-box,.setup-sub-box,.setup-target,.no-trade-lesson{background:none;border:0;border-top:1px solid var(--line);border-radius:0;padding:10px 0;margin:6px 0;box-shadow:none;font-family:var(--font-body);font-size:.94rem;line-height:1.7}
.setup-guide-card,.no-trade-card{border:0;border-top:1px solid var(--line);border-radius:0;background:none;padding:18px 0}
.setup-guide-card:hover,.no-trade-card:hover{background:none;transform:none}
.trade-setups-box,.no-trades-box{padding:22px 0;border:0;border-block:1px solid var(--line);border-radius:0;background:none}
.setups-guide-grid,.no-trades-grid{gap:0 28px}
.card h3{font-size:1.18rem;font-weight:500}.card p{font-family:var(--font-body);font-size:1rem;font-weight:400;line-height:1.7}
.modal h2{font-family:var(--font-head);font-size:1.65rem;font-weight:500;line-height:1.5;text-wrap:balance}
.modal .zone-title{font-size:1.15rem}.modal label{font-family:var(--font-body)}
@media(max-width:900px){#mkCross .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}#mkSpy,#mkMacd,#mkBreadth,#mkEvents{grid-column:1 / -1}#mkSpy,#mkBreadth{padding-right:0}}
@media(max-width:600px){.panel-head h2{font-size:1.5rem}.panel-head p{font-size:1rem}.mk-grid{gap:24px}#mkMacd{padding:20px 16px}#mkMacd .mk-macd-decision>strong{font-size:1.75rem}#mkSpy .spy-price{font-size:2.8rem}#mkSpy .stat-row{gap:18px 12px}#mkSpy .stat:nth-child(4){grid-column:span 2}#mkLevels .lvl-list{grid-template-columns:1fr}#mkLevels .stat{padding:14px 0!important;border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 12px;align-items:baseline}#mkLevels .stat:nth-child(4),#mkLevels .stat:nth-child(5){grid-column:auto}#mkLevels .stat em{grid-column:1 / -1;max-width:none}#mkLevels .stat b{font-size:1.55rem}#mkCross .tiles{grid-template-columns:1fr}#mkCross .tile{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px}#mkCross .t-row{margin:0;display:flex;align-items:baseline;gap:12px}#mkCross .t-name{display:block}#mkCross .t-name>span{display:block;font-size:.78rem}#mkCross .t-lean,#mkCross .t-age{grid-column:1 / -1}#mkBreadth .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.mk-frame{padding-inline:10px}.mk-frame span{font-size:.85rem}.mk-frame b{font-size:.9rem}.mk-evidence-body .macd-table th,.mk-evidence-body .macd-table td{padding:10px 3px;font-size:.78rem}.no-trades-grid{grid-template-columns:1fr}}
#mkBreadth .sector-list .tile{grid-template-columns:minmax(0,1fr) 90px minmax(80px,.8fr);gap:4px 16px;padding-block:10px}
#mkBreadth .sector-list .t-name{grid-column:1;grid-row:1}
#mkBreadth .sector-list .t-chg{grid-column:2;grid-row:1;text-align:right}
#mkBreadth .sector-list .sector-track{grid-column:3;grid-row:1;position:relative;align-self:center;height:18px;background:#101a2b}
.sector-track::before{content:'';position:absolute;left:50%;height:100%;width:1px;background:#71819a}
.sector-track i{position:absolute;top:3px;bottom:3px;min-width:0;background:currentColor}
#mkBreadth .sector-list .t-age{grid-column:1 / -1;grid-row:2}
@media(max-width:600px){#mkBreadth .sector-list .tile{grid-template-columns:minmax(0,1fr) 76px minmax(50px,.6fr);column-gap:10px}#mkBreadth .sector-list .t-name{font-size:.88rem}#mkBreadth .sector-list .t-name span:last-child{font-size:.75rem;margin-left:6px}}

@media(max-width:900px){#mkMacd{order:-1}}
@media(max-width:600px){#mkBreadth .tiles.sector-list{grid-template-columns:1fr}}

/* 🌙 Quiet cards: Lessons + Setups (Audi 2026-10-16 "หน้าบทเรียน ลายตา"). One card, no boxes inside, one gold emphasis. */
#lessonsList,#setupsList{gap:18px}
#lessonsList .qcard,#setupsList .qcard{background:linear-gradient(180deg,#131c30 0%,#0e1627 100%);border:1px solid #2a3650;border-radius:14px;transition:border-color .2s,transform .2s}
#lessonsList .qcard:hover,#setupsList .qcard:hover{border-color:#4a5b80;transform:translateY(-2px)}
.qcard.qcard-key{border-color:rgba(226,201,143,.42);box-shadow:inset 0 1px 0 rgba(242,207,122,.45)}
.qcard .card-body{padding:20px 20px 16px;gap:12px}
.q-meta{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;font-size:.88rem;line-height:1.4;min-height:1.25em}
.q-key{color:#f2cf7a;font-weight:600}
.q-imp{color:#b4bdd2}
.q-cat{color:var(--q,#e2c98f)}
.q-gold{--q:#e9d39d}.q-sky{--q:#7dd3fc}.q-violet{--q:#c4b5fd}.q-amber{--q:#fcd27b}.q-teal{--q:#5eead4}.q-pink{--q:#f9a8d4}.q-red{--q:#fca5a5}.q-green{--q:#86efac}
.qcard h3{margin:0;font-family:var(--font-head);font-size:1.15rem;font-weight:600;line-height:1.45;color:#f4f6fb;text-wrap:balance}
.qcard .q-take{margin:0;color:#cfd5e3;font-family:var(--font-body);font-size:1rem;line-height:1.65;display:block;overflow:visible;-webkit-line-clamp:unset}
.qcard .q-take .num-gold,.dv-insight .num-gold{color:#f2cf7a;font-weight:600}
.qcard .q-take .num-up,.dv-insight .num-up{color:#56d8a0;font-weight:600}
.qcard .q-take .num-down,.dv-insight .num-down{color:#f77da1;font-weight:600}
.qcard .card-foot{border-top:1px solid #222d44;padding-top:12px;font-size:.86rem;color:#9aa4bb}
.qcard .q-more{flex:none;color:#c7d2fe;font-weight:600;font-size:.9rem;transition:transform .2s,color .2s}
.qcard:hover .q-more{color:#fff;transform:translateX(3px)}
.dv-insight{border:1px solid rgba(226,201,143,.35);border-radius:14px;padding:14px 16px;margin:0 0 14px;background:radial-gradient(ellipse at 0 0,rgba(226,201,143,.12),transparent 70%),#121a2b;display:flex;flex-direction:column;gap:10px}
.dv-insight p{margin:0;font-size:1rem;line-height:1.7;color:#e6e9f2}
.dv-insight p b{display:block;font-family:var(--font-head);font-weight:600;color:#f2cf7a;margin-bottom:4px}
@media(max-width:600px){.qcard .card-body{padding:16px 16px 14px}.qcard h3{font-size:1.08rem}}
@media(prefers-reduced-motion:reduce){#lessonsList .qcard,#setupsList .qcard,.qcard .q-more{transition:none}#lessonsList .qcard:hover,#setupsList .qcard:hover,.qcard:hover .q-more{transform:none}}
/* highlighted values keep together: they move to the next line whole, and only wrap inside when longer than a line */
.qcard .q-take [class^="num-"],.dv-insight [class^="num-"]{display:inline-block;max-width:100%}
/* Wide monitors (Audi uses ~1864-2517px). The desk widens structurally: grids gain columns, charts grow,
   prose keeps its ch caps. Every rule sits at >=1800px so the accepted 1440 / 390 / 320 layouts do not change. */
@media(min-width:1800px){
  .wrap,.dte-tab-shell{max-width:1680px}
  .dte-opening{gap:120px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}
  #mkCross .tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
  .ch-host{height:600px}
  .ch-grid{gap:20px}
  #playbookList{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;align-items:start}
  #panel-tools .grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(min-width:2300px){
  .wrap,.dte-tab-shell{max-width:1880px;padding-inline:56px}
  .grid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}
  .ch-host{height:680px}
}
/* Short values and labels stay on one line on phones (render_sweep crampAudit, 2026-10-16). */
.gx-heat-r .k .k-tag{display:inline-block;white-space:nowrap;font-size:.72rem;color:inherit}
.mk-evidence-body .macd-table th:nth-child(1){width:max(11%,4.4em)}
.mk-evidence-body .macd-table th:first-child,.mk-evidence-body .macd-table td:first-child{white-space:nowrap;overflow-wrap:normal}
.gx-seg button,.ch-overlays button>span,.pt-r span:first-child{white-space:nowrap}
.tile .t-name{line-height:1.5}
@media(max-width:760px){.gx-sig{grid-template-columns:1fr}}
@media(max-width:420px){
  .ch-overlays{grid-template-columns:1fr}
  .gx-seg{display:flex;flex-wrap:wrap}
  .pt-h,.pt-r{grid-template-columns:1.45fr 1fr 1fr 1fr}.pt-r span:first-child{font-size:.82rem}
}
@media(max-width:380px){
  .mk-frame-chain{flex-direction:column;gap:10px}
  .mk-frame{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-inline:0}
  .mk-frame+.mk-frame{border-left:0;border-top:1px solid #43536a;padding-top:10px}
  .mk-frame b{margin-top:0;text-align:right}
  #mkCross .tile{grid-template-columns:minmax(0,1fr)}
  .gx-stats{grid-template-columns:1fr}.gx-stats .gx-stat,.gx-stats .gx-stat:nth-child(odd){padding-inline:0!important;border-right:0}
}
/* Money, counts and short labels move whole, never split mid-value. */
b[class^="ls-tone-"],.jstat b,.js-sub b,.tc-head b,.lb-box b,.ins-t td,.ins-t th,td.up,td.down,td.flat,.pp-now small{white-space:nowrap}
.explain-body b,.thesis b{display:inline-block;max-width:100%}
.ins-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr))}
.ins-card{overflow-x:auto}
@media(max-width:680px){.go-li>.go-ic{grid-column:1;grid-row:1 / span 2}.go-li>b{grid-column:2}}
@media(max-width:600px){
  .sg-table td b,.sg-table td small,.sg-table th[scope=row],.sg-table thead th:not(:first-child){white-space:nowrap}
  #panel-levels .pt{overflow-x:auto}
  #panel-levels .pt>.pt-h,#panel-levels .pt>.pt-r{min-width:540px}
}
/* Wide monitors keep reading lines short: notes and subtitles that used to run the full desk width stop at ~76ch,
   and the long Paper / Lab logs flow into columns instead of 1700px lines. */
@media(min-width:1800px){
  .panel p,.thesis,.mg-rule{max-width:76ch}
  .lb-list{columns:2 560px;column-gap:48px}
  .lb-list li{break-inside:avoid}
  .sg-card .mg-tablewrap{max-width:1180px}
  .tc-svg{max-height:460px}
}
.setup-target b{display:inline-block;max-width:100%}
@media(max-width:600px){#deskLive .ls-value{line-height:1.45}}
@media(max-width:600px){.ev-list li>span>b,.desk-empty b{display:block;margin-bottom:4px}}
@media(max-width:680px){.lb-form{grid-template-columns:repeat(2,minmax(0,1fr))}.lb-form input,.lb-form select{width:100%;min-width:0}}
.ch-tbox>small::after,.ch-tbox>b::after{content:" "}
@media(min-width:1800px){.ex-list,.tc-groups{max-width:1180px}}
/* Signal stats table: on phones each signal becomes a stacked block with labelled values instead of a 640px sideways-scrolling table. */
@media(max-width:600px){
  .mg-stack{min-width:0}
  .mg-stack thead{display:none}
  .mg-stack,.mg-stack tbody,.mg-stack tr{display:block}
  .mg-stack tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 14px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.07)}
  .mg-stack th[scope=row]{grid-column:1 / -1;order:-2;padding:0;border:0;white-space:normal}
  .mg-stack td{display:block;padding:0;border:0;text-align:left;white-space:normal}
  .mg-stack td::before{content:attr(data-label);display:block;font-size:.74rem;color:var(--muted);font-weight:400}
  .mg-stack td.mg-right{grid-column:1 / -1;order:-1}
  .mg-stack .mg-right span{margin-left:6px;white-space:nowrap}
}
.gx-nodata{margin:4px 0 0;padding:12px 14px;border:1px dashed #4a5a72;border-radius:10px;color:#c4cfdf;font-size:.92rem;line-height:1.6}
@media(min-width:1800px){
  .gx-spread{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
  #mkBreadth,#mkEvents{grid-column:1 / -1}
  #mkBreadth .tiles:not(.sector-list){grid-template-columns:repeat(6,minmax(0,1fr))}
  #mkBreadth .tiles.sector-list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px}
  #mkEvents .ev-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));column-gap:40px}
}
@media(min-width:1800px){#mkEvents .ev-list li:last-child{border-bottom:1px solid var(--line)}}
/* 🧮 sell-price calculator (Trade Desk) */
.sc-card{margin:0 0 16px;padding:16px 18px;border:1px solid #34445c;border-radius:14px;background:#0f1828}
.sc-card h3{margin:0;font-family:var(--font-head);font-size:1.1rem;color:#eef1f7}
.sc-sub{margin:4px 0 12px;font-size:.88rem;color:#c4cfdf}
.sc-inputs{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.sc-inputs label{display:flex;flex-direction:column;gap:5px;font-size:.85rem;color:#c4cfdf}
.sc-inputs input{font:inherit;font-size:1.1rem;padding:9px 11px;border-radius:10px;border:1px solid #46597a;background:#0a1220;color:#eef1f7;color-scheme:dark;min-width:0}
.sc-inputs input:focus-visible{outline:2px solid #f4e1b2;outline-offset:1px}
.sc-pcts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:12px 0}
.sc-pct{font:inherit;font-family:var(--font-head);font-weight:700;font-size:1rem;padding:10px 0;border-radius:10px;border:1px solid #46597a;background:#131f33;color:#dfe6f2;cursor:pointer;transition:background .15s,border-color .15s}
.sc-pct:hover{border-color:#f4e1b2}
.sc-pct.on{background:#12261f;border-color:#56d8a0;color:#91edbf}
.sc-main{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;padding:12px 14px;border-radius:12px;background:#12261f;border:1px solid #387961}
.sc-main small{font-size:.85rem;color:#c4e8d7}
.sc-main b{font-family:var(--font-head);font-size:2rem;line-height:1.1;color:#91edbf}
.sc-gain{font-size:.92rem;color:#d8f5e8}
.sc-cost{margin:8px 0 2px;font-size:.9rem;color:#dfe6f2}
.sc-loss{color:#ffb3c1}
.sc-note{margin:0 0 8px;font-size:.82rem;color:#c4cfdf}
.sc-all{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.88rem;color:#c4cfdf}
.sc-all span.on b{color:#91edbf}
.sc-empty{margin:0;padding:12px 14px;border-radius:12px;border:1px dashed #46597a;color:#c4cfdf;font-size:.9rem}
@media(max-width:480px){.sc-pcts{grid-template-columns:repeat(2,1fr)}.sc-main b{font-size:1.7rem}}
/* ⚖️ GEX weight per strike */
.gw-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:8px}
.gw-row{display:grid;grid-template-columns:24px minmax(120px,170px) 1fr minmax(118px,auto);gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line)}
.gw-row:last-child{border-bottom:0}
.gw-rank{font-family:var(--font-head);font-weight:700;color:#f4e1b2;text-align:center}
.gw-k{display:flex;flex-direction:column;gap:2px;font-weight:600;color:#eef1f7}
.gw-k em{font-style:normal;font-size:.78rem;color:#c4cfdf}
.gw-bar{height:14px;border-radius:7px;background:#0a1220;border:1px solid #2d394c;overflow:hidden}
.gw-bar i{display:block;height:100%;border-radius:7px}
.gw-call{background:linear-gradient(90deg,#1f7a52,#56d8a0)}
.gw-put{background:linear-gradient(90deg,#8f2440,#ff7f97)}
.gw-pct{display:flex;flex-direction:column;align-items:flex-end;gap:1px}
.gw-pct b{font-family:var(--font-head);font-size:1.15rem}
.gw-pct small{font-size:.76rem;color:#c4cfdf;white-space:nowrap}
.gw-foot{margin:10px 0 0;font-size:.84rem;color:#c4cfdf;line-height:1.6}
.gw-foot span{white-space:nowrap}
@media(max-width:600px){.gw-foot span{white-space:normal}}
.gw-pct{padding-right:4px}
.gw-cell{display:block;font-size:.72rem;font-weight:500;color:#eef1f7}
@media(max-width:600px){.gw-row{grid-template-columns:22px 1fr auto;gap:4px 10px}.gw-bar{grid-column:2 / -1;grid-row:2}}
/* 🧭 Task rail = rounded glass pill like the compact brand header, no square band (Audi 2026-10-16: "มันยังเห็นขอบเหลี่ยมๆอยู่เลย") */
.tabs{background:transparent;padding:6px 0 10px}
.dte-tab-shell{max-width:1280px;padding-inline:18px;background:rgba(11,20,34,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid var(--line-strong);border-radius:28px;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.dte-tab-shell .tab{border-radius:18px}
.dte-tab-shell .tab:hover{background:rgba(255,255,255,.06)}
.dte-tab-shell .tab-sep{border-radius:1px}
@media(max-width:1100px){.dte-tab-shell{margin-inline:16px;width:auto;padding-inline:14px}}
@media(max-width:1080px){.dte-tab-shell{border-radius:18px}}
@media(max-width:760px){.dte-tab-shell{margin-inline:8px;padding-inline:8px}.dte-tab-shell .wrap{border-radius:16px}}
/* body[data-ak-shell] (site-shell.css) is overflow:clip auto, which makes <body> the sticky scrollport while the window scrolls → the task rail never stuck. This page only. */
html body[data-ak-shell]{overflow:clip visible}
/* 🧊 GEX calm badge (GEX tab) */
.gx-calm{display:grid;gap:3px;margin:0 0 14px;padding:12px 16px;border-radius:14px;border:1px solid #34445c;background:#0f1828}
.gx-calm b{font-family:var(--font-head);font-size:1.05rem}
.gx-calm span{font-size:.88rem;color:#dfe6f2}
.gx-calm small{font-size:.78rem;color:#c4cfdf}
.gx-calm-ok{border-color:#387961;background:#10231d}.gx-calm-ok b{color:#91edbf}
.gx-calm-wait{border-color:#8a6a3a;background:#1d1912}.gx-calm-wait b{color:#f4d878}
.gx-calm-na b{color:#c4cfdf}
/* 🚦 blockers first, quiet alarm, folded detail (Audi 2026-10-17 "ไม่ลายตา") */
.go-block{margin:10px 0 6px;padding:10px 12px;border-radius:12px;background:rgba(255,159,176,.06);border:1px solid rgba(255,159,176,.28)}
.go-quiet{margin:6px 0 4px;font-size:.84rem;color:#c4cfdf}
.go-quiet b.up{color:#91edbf}.go-quiet b.down{color:#ff9fb0}
.go-details>summary{list-style:none;display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;border:1px solid #46597a;background:#131f33;font-size:.86rem}
.go-details>summary::-webkit-details-marker{display:none}
.go-details[open]>summary{border-color:#f4e1b2}
.dk-ref{margin:16px 0 0}
.pp-rule>summary{cursor:pointer;display:inline-block;margin-top:4px;font-size:.84rem;color:#f4e1b2}
.pp-rule>summary::-webkit-details-marker{display:none}
.pp-rule[open]>summary{margin-bottom:4px}
/* ⚡ Trade Desk one-line SPY + MACD (full block is in 📡 ตลาด) */
#deskLive .ls-mini{display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;margin:8px 0 16px;padding:12px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.13);background:linear-gradient(145deg,rgba(28,39,64,.96),rgba(10,15,30,.99))}
#deskLive .ls-mini-px,#deskLive .ls-mini-macd{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:6px;font-size:.95rem;color:#dfe6f2}
#deskLive .ls-mini-px b.ls-tone-gold{font-family:var(--font-head);font-size:1.25rem}
#deskLive .ls-mini small{font-size:.8rem;color:#c4cfdf}
#deskLive .ls-mini-macd small{font-size:.9rem;color:#dfe6f2}
#deskLive .ls-mini-go{margin-left:auto;font:inherit;font-size:.84rem;padding:6px 12px;border-radius:999px;border:1px solid #46597a;background:#131f33;color:#f4e1b2;cursor:pointer}
#deskLive .ls-mini-go:hover{border-color:#f4e1b2}
@media(max-width:600px){#deskLive .ls-mini-go{margin-left:0}}
/* 🚦 real traffic light (approved mockup 2026-10-17) */
.go-verdict{flex-direction:row!important;align-items:center!important;gap:16px;text-align:left!important}
.go-vtext{display:flex;flex-direction:column;gap:2px}
.go-light{flex:0 0 auto;display:grid;gap:7px;justify-items:center;padding:9px 0;width:52px;border-radius:20px;background:linear-gradient(180deg,#3b3020,#1b150c);border:2px solid #b08a44;box-shadow:inset 0 2px 0 rgba(255,231,170,.25)}
.go-light i{width:28px;height:28px;border-radius:50%;background:#1a1f2b;border:2px solid #0c0f16;box-shadow:inset 0 3px 6px rgba(0,0,0,.6)}
.go-light-bad .r{background:radial-gradient(circle at 35% 35%,#ffd0d8,#ff5c7a 45%,#9b1734);box-shadow:0 0 18px rgba(255,92,122,.7)}
.go-light-wait .y{background:radial-gradient(circle at 35% 35%,#fff3c4,#f4c84a 45%,#8a6412);box-shadow:0 0 18px rgba(244,200,74,.65)}
.go-light-ok .g{background:radial-gradient(circle at 35% 35%,#d3ffe9,#3fd393 45%,#11643f);box-shadow:0 0 18px rgba(63,211,147,.65)}
@media(prefers-reduced-motion:no-preference){.go-light i{transition:background .3s,box-shadow .3s}}
/* ✨ star-chart ladder */
.sl-card{margin:0 0 18px;padding:20px 24px;border-radius:20px;border:1px solid rgba(255,255,255,.13);background:linear-gradient(145deg,rgba(28,39,64,.96),rgba(10,15,30,.99));position:relative;overflow:hidden}
.sl-card::before{content:'';position:absolute;top:-90px;right:-90px;width:240px;height:240px;background:radial-gradient(circle,rgba(226,201,143,.16),transparent 70%);pointer-events:none}
.sl-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:10px}
.sl-title{margin:0;font-family:var(--aku-font-body);font-weight:500;font-size:1.25rem;color:#eef1f7}
.sl-sub{margin:2px 0 0;font-size:.86rem;color:#c4cfdf}
.sl-chips{display:flex;flex-wrap:wrap;gap:6px}
.sl-chip{display:inline-flex;padding:4px 10px;border-radius:999px;font-size:.82rem;border:1px solid}
.sl-call{color:#c9f5e0;border-color:rgba(86,216,160,.45);background:rgba(86,216,160,.08)}
.sl-put{color:#ffd0d8;border-color:rgba(255,143,165,.5);background:rgba(255,143,165,.08)}
.sl-wait{color:#fff1b8;border-color:rgba(244,216,120,.5);background:rgba(244,216,120,.08)}
.sl-ladder{list-style:none;margin:0;padding:0}
.sl-row{display:grid;grid-template-columns:104px 1fr 190px 110px;gap:14px;align-items:center;min-height:42px;border-bottom:1px solid rgba(255,255,255,.06)}
.sl-row:last-child{border-bottom:0}
.sl-k{font-family:var(--aku-font-body);font-weight:600;font-size:1.05rem;text-align:right;white-space:nowrap}
.sl-bar{height:12px;border-radius:6px;background:rgba(255,255,255,.05);position:relative;overflow:hidden}
.sl-bar i{position:absolute;inset:0 auto 0 0;border-radius:6px}
.sl-lab{font-size:.9rem;color:#dfe6f2}
.sl-lab b{font-family:var(--aku-font-body)}
.sl-gap{font-size:.84rem;text-align:right;white-space:nowrap;color:#c4cfdf}
.sl-row.sl-call .sl-k,.sl-row.sl-call .sl-lab b{color:#91edbf}.sl-row.sl-call .sl-bar i{background:linear-gradient(90deg,#1f7a52,#56d8a0)}
.sl-row.sl-put .sl-k,.sl-row.sl-put .sl-lab b{color:#ff9fb0}.sl-row.sl-put .sl-bar i{background:linear-gradient(90deg,#8f2440,#ff7f97)}
.sl-row.sl-zg .sl-k{color:#9fc8ff}.sl-row.sl-vwap .sl-k{color:#dfe6f2}
.sl-row.sl-now{min-height:50px}
.sl-row.sl-now .sl-k{color:#f4e1b2}
.sl-line{border-top:2px dashed #e2c98f;height:0}
.sl-now .sl-lab{color:#f4e1b2;font-weight:600}
.sl-star{display:inline-block;width:11px;height:11px;border-radius:50%;background:#e2c98f;box-shadow:0 0 12px #e2c98f;margin-right:6px;vertical-align:middle}
.sl-key{margin:10px 0 0;font-size:.8rem;color:#c4cfdf}
.sl-empty{color:#c4cfdf}
@media(max-width:600px){.sl-row{grid-template-columns:78px 1fr 84px;gap:4px 10px;padding:6px 0}.sl-row .sl-lab{grid-column:2 / -1;grid-row:2}.sl-k{font-size:.95rem}.sl-card{padding:16px}}
/* 🎫 boarding-pass past rounds */
#levelsList .lv-pass{display:grid;grid-template-columns:minmax(0,1fr) 104px;padding:0;overflow:hidden;background:linear-gradient(145deg,#2a4a80,#1a315a);border:1px solid rgba(226,201,143,.35);border-radius:16px}
#levelsList .lv-pass .card-body{padding:14px 16px}
#levelsList .lv-pass .pass-stub{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:10px;border-left:2px dashed rgba(226,201,143,.5);background:rgba(0,0,0,.2);text-align:center}
#levelsList .lv-pass .pass-stub b{font-family:var(--aku-font-body);font-size:1.2rem;color:#eef1f7}
#levelsList .lv-pass .pass-stub b.up{color:#91edbf}#levelsList .lv-pass .pass-stub b.down{color:#ffb3c1}
#levelsList .lv-pass .pass-stub small{font-size:.78rem;color:#d7e2f5}
#levelsList .lv-pass .levels-mini .lv{background:rgba(6,12,26,.35)}
#levelsList .lv-pass .card-body{min-width:0}
#levelsList .lv-pass .pass-stub b{white-space:nowrap;font-size:1.05rem}
#levelsList .lv-pass .card-img{grid-column:1 / -1}
#levelsList .lv-pass .levels-mini .lv small{white-space:nowrap;font-size:.74rem}
/* 📱 ≤360px: names get their own line, short labels never break (render_sweep cramp 2026-10-17) */
@media(max-width:360px){.dk-row>span:first-child{grid-column:1 / -1;font-size:.88rem}.desk-date{white-space:nowrap;font-size:1rem}.lv small{white-space:nowrap;font-size:.72rem}.ls-c .ls-label{white-space:nowrap;font-size:.74rem}}
@media(max-width:420px){.dk-list.dk-tight .dk-row>span:first-child{grid-column:1 / -1}}
@media(max-width:360px){.dk-levels .dk-lv small{white-space:nowrap;font-size:.74rem}}

/* ==========================================================================
   2026-10-20 3-ZONE VISUAL HIERARCHY & TAB BAR ARCHITECTURE (impeccable/SKILL.md):
   - Zone 1 (Primary Signal): Spotlight Smoked Glass + Gold/Emerald/Crimson Bezel
     + Traffic-Light Wall Plates so the trader knows where to look in <1 second
   - Zone 2 (Supporting Context): "One box per section, rows + hairlines inside"
     (no boxes inside boxes; clean hairline rows with left semantic bars + real SVG logos)
   - Zone 3 (Folded Reference): Quiet collapsible drawers
   - Tab Rail (#tabList): Wraps cleanly inside .dte-tab-shell — zero clipped tabs (ไม่หลุดขอบ)
   ========================================================================== */
:root {
  --font-head:var(--aku-font-head);
  --font-display: var(--aku-font-head);
  --font-body:var(--aku-font-body);
  --mono:var(--aku-font-mono);
  --hairline: rgba(148, 163, 184, 0.18);
  --hairline-strong: rgba(226, 201, 143, 0.42);
  --canvas-veil: linear-gradient(180deg, rgba(5, 10, 20, 0.88) 0%, rgba(6, 11, 22, 0.96) 240px, #060b16 100%);
  --zone1-bg: radial-gradient(ellipse at 100% 0, rgba(226, 201, 143, 0.14), transparent 65%), linear-gradient(155deg, rgba(20, 34, 60, 0.96) 0%, rgba(10, 17, 32, 0.98) 100%);
  --zone2-bg: rgba(11, 19, 35, 0.88);
  --zone3-bg: rgba(9, 15, 28, 0.68);
}

/* 1. Unified Page Canvas Veil */
main#main {
  background: var(--canvas-veil);
  min-height: 100vh;
}

/* 2. Context Bar & Single-Row Segmented Command Dock (#tabList: Zero Orphan Row, Zero Clipping) */
.dte-context {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px 18px !important;
  border-top: 1px solid var(--hairline) !important;
  padding: 12px 0 14px !important;
}
.dte-context > .risk-note {
  flex: 1 1 480px !important;
  margin: 0 !important;
  padding: 8px 14px !important;
  border-radius: 10px !important;
  background: rgba(251, 113, 133, 0.08) !important;
  border: 1px solid rgba(251, 113, 133, 0.25) !important;
  border-left: 3px solid #fb7185 !important;
  font-size: 0.83rem !important;
  line-height: 1.55 !important;
}
.dte-context > details.explain {
  flex: 0 0 auto !important;
  max-width: none !important;
  margin: 0 !important;
  border-radius: 999px !important;
  padding: 0 14px !important;
  background: rgba(96, 165, 250, 0.1) !important;
  border: 1px solid rgba(96, 165, 250, 0.35) !important;
}
.dte-context > details.explain[open] {
  flex: 1 1 100% !important;
  border-radius: 14px !important;
  padding: 4px 16px 12px !important;
}
.dte-context > details.explain summary {
  padding: 7px 2px !important;
  min-height: 36px !important;
  font-size: 0.84rem !important;
  color: #bae6fd !important;
  white-space: nowrap !important;
}
@media (max-width: 760px) {
  .dte-context > details.explain summary { white-space: normal !important; }
}

.dte-tab-shell {
  max-width: 1360px !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(15, 25, 45, 0.96), rgba(9, 16, 30, 0.96)) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}
.tabs .wrap#tabList {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  padding: 2px !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}
.tabs .wrap#tabList::-webkit-scrollbar {
  display: none !important;
}
.dte-tab-shell .tab-group {
  display: none !important;
}
.dte-tab-shell .tab {
  padding: 5px 7px !important;
  min-height: 34px !important;
  font-size: 0.78rem !important;
  letter-spacing: -0.015em !important;
  border-radius: 999px !important;
  border: 1px solid transparent !important;
  color: #cbd5e1;
  white-space: nowrap !important;
  transition: background 0.16s, color 0.16s, border-color 0.16s, transform 0.16s;
}
.dte-tab-shell .tab.tab-guide-btn {
  color: #93c5fd;
  border-color: rgba(96, 165, 250, 0.38) !important;
  background: rgba(96, 165, 250, 0.12) !important;
  font-weight: 700 !important;
}
.dte-tab-shell .tab.tab-guide-btn[aria-selected="true"] {
  background: rgba(96, 165, 250, 0.28) !important;
  border-color: rgba(147, 197, 253, 0.8) !important;
  color: #eff6ff !important;
}
.dte-tab-shell .tab:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
}
.dte-tab-shell .tab[aria-selected="true"] {
  background: linear-gradient(135deg, rgba(226, 201, 143, 0.22), rgba(226, 201, 143, 0.1)) !important;
  border-color: rgba(226, 201, 143, 0.65) !important;
  color: #fef08a !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 12px rgba(226, 201, 143, 0.2);
}
.dte-tab-shell .tab.tab-highlight {
  color: #86efac;
  border-color: rgba(86, 216, 160, 0.32) !important;
  background: rgba(86, 216, 160, 0.09) !important;
}
.dte-tab-shell .tab.tab-highlight[aria-selected="true"] {
  background: rgba(86, 216, 160, 0.22) !important;
  border-color: rgba(86, 216, 160, 0.68) !important;
  color: #d1fae5 !important;
}
body.is-owner-view .dte-tab-shell .tab.owner-tab {
  color: #f5d485;
  background: rgba(226, 201, 143, 0.07) !important;
  border-color: rgba(226, 201, 143, 0.26) !important;
}
body.is-owner-view .dte-tab-shell .tab.owner-tab[aria-selected="true"] {
  background: rgba(226, 201, 143, 0.24) !important;
  border-color: rgba(226, 201, 143, 0.72) !important;
  color: #fef9c3 !important;
}
.dte-tab-shell .tab-sep {
  height: 18px !important;
  margin: 4px 2px !important;
  background: rgba(148, 163, 184, 0.25) !important;
  flex: 0 0 1px !important;
}
.dte-tab-shell .tab-sep.owner-tab {
  background: rgba(226, 201, 143, 0.45) !important;
  width: 2px !important;
  flex: 0 0 2px !important;
}
.has-tab-motion .dte-tab-indicator {
  display: none !important;
}

/* 3. Brand & Crypto Logos (.t-brand / .asset-logo) */
.t-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.asset-logo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
}
.asset-logo svg {
  width: 22px;
  height: 22px;
  display: block;
  border-radius: 6px;
}

/* 4. Priority Zone Ribbons (.zone-banner) */
.zone-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin: 8px 0 14px;
  padding: 10px 16px;
  border-radius: 12px;
  border-left: 4px solid var(--gold);
  background: linear-gradient(90deg, rgba(226, 201, 143, 0.14), rgba(15, 23, 42, 0.4) 75%);
}
.zone-banner.zone-secondary {
  margin-top: 12px;
  border-left-color: #60a5fa;
  background: linear-gradient(90deg, rgba(96, 165, 250, 0.12), rgba(15, 23, 42, 0.35) 75%);
}
.zone-pill {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 0.84rem;
  letter-spacing: 0.03em;
  color: #fef08a;
  background: rgba(226, 201, 143, 0.18);
  border: 1px solid rgba(226, 201, 143, 0.42);
  padding: 3px 10px;
  border-radius: 999px;
}
.zone-banner.zone-secondary .zone-pill {
  color: #bae6fd;
  background: rgba(96, 165, 250, 0.16);
  border-color: rgba(96, 165, 250, 0.4);
}
.zone-desc {
  font-size: 0.88rem;
  color: #cbd5e1;
}

/* 5. Opening Header & Top Command Deck (#sessionSummary / .today-strip) */
.dte-opening {
  padding-bottom: 22px !important;
}
.dte-session {
  background: var(--zone1-bg) !important;
  border: 1px solid rgba(226, 201, 143, 0.36) !important;
  border-top: 3px solid var(--gold) !important;
  border-radius: 18px !important;
  padding: 16px 18px !important;
  box-shadow: 0 14px 34px rgba(2, 6, 18, 0.48) !important;
}
.today-strip {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
@media (max-width: 560px) {
  .today-strip { grid-template-columns: 1fr !important; }
}
.ov-tile {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 4px !important;
  background: rgba(8, 14, 26, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-left: 4px solid var(--accent, var(--gold)) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  min-height: 78px !important;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease !important;
}
.ov-tile:hover {
  transform: translateY(-2px) !important;
  background: rgba(18, 30, 52, 0.9) !important;
  border-color: var(--accent, var(--gold)) !important;
}
.ov-tile .ov-num {
  text-align: left !important;
  padding-right: 0 !important;
  font-size: 1.28rem !important;
  font-weight: 700 !important;
}

/* 6. ZONE 1: Primary Decision Panels (#mkSpy, #mkMacd, #mkLevels) */
.mk-status {
  background: rgba(13, 23, 42, 0.85) !important;
  border: 1px solid var(--hairline) !important;
  border-left: 4px solid #34d399 !important;
  border-radius: 12px !important;
  padding: 12px 16px !important;
  margin-bottom: 14px !important;
}
#mkSpy,
#mkMacd {
  background: var(--zone1-bg) !important;
  border: 1px solid rgba(226, 201, 143, 0.36) !important;
  border-top: 3px solid var(--gold) !important;
  border-radius: 18px !important;
  padding: 22px 24px !important;
  box-shadow: 0 14px 36px rgba(2, 6, 18, 0.48) !important;
}
#mkMacd {
  border-top-color: #34d399 !important;
}
/* Inside #mkMacd: Traffic-Light Decision Banner + 3 Frame Pills */
#mkMacd .mk-macd-decision {
  background: rgba(16, 38, 34, 0.65) !important;
  border: 1px solid rgba(52, 211, 153, 0.38) !important;
  border-left: 4px solid #34d399 !important;
  border-radius: 12px !important;
  padding: 14px 16px !important;
  margin: 10px 0 16px !important;
}
#mkMacd .mk-macd-decision.ls-tone-down {
  background: rgba(44, 20, 32, 0.65) !important;
  border-color: rgba(251, 113, 133, 0.38) !important;
  border-left-color: #fb7185 !important;
}
#mkMacd .mk-macd-decision.ls-tone-wait,
#mkMacd .mk-macd-decision.ls-tone-warning,
#mkMacd .mk-macd-decision.ls-tone-neutral {
  background: rgba(38, 32, 20, 0.65) !important;
  border-color: rgba(244, 216, 120, 0.38) !important;
  border-left-color: #f4d878 !important;
}
.mk-frame-chain {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  border: 0 !important;
  padding: 4px 0 !important;
  margin: 14px 0 !important;
}
.mk-frame {
  background: rgba(8, 14, 26, 0.75) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
}
.mk-frame + .mk-frame {
  border-left: 1px solid var(--hairline) !important;
}

/* Inside #mkSpy: Clean hairline stats (no nested boxes) */
#mkSpy .stat {
  background: none !important;
  border: 0 !important;
  border-left: 2px solid var(--hairline-strong) !important;
  border-radius: 0 !important;
  padding: 2px 0 2px 12px !important;
}

/* #mkLevels (GEX Structure): Spotlight Panel + 3 Traffic-Light Wall Plates */
#mkLevels {
  background: radial-gradient(ellipse at 0% 0%, rgba(96, 165, 250, 0.12), transparent 65%), linear-gradient(155deg, rgba(16, 28, 50, 0.95) 0%, rgba(9, 16, 30, 0.98) 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.34) !important;
  border-top: 3px solid #60a5fa !important;
  border-radius: 18px !important;
  padding: 22px 24px !important;
  box-shadow: 0 14px 36px rgba(2, 6, 18, 0.45) !important;
}
#mkLevels .lvl-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin-top: 16px !important;
}
/* First 3 items in #mkLevels are Call Wall, Put Wall, Zero Gamma -> Traffic-Light Wall Plates! */
#mkLevels .stat:nth-child(1) {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.9), rgba(11, 25, 24, 0.92)) !important;
  border: 1px solid rgba(52, 211, 153, 0.42) !important;
  border-left: 4px solid #34d399 !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
}
#mkLevels .stat:nth-child(2) {
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.9), rgba(26, 14, 22, 0.92)) !important;
  border: 1px solid rgba(251, 113, 133, 0.42) !important;
  border-left: 4px solid #fb7185 !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
}
#mkLevels .stat:nth-child(3) {
  background: linear-gradient(145deg, rgba(20, 36, 58, 0.9), rgba(12, 22, 38, 0.92)) !important;
  border: 1px solid rgba(96, 165, 250, 0.42) !important;
  border-left: 4px solid #60a5fa !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
}
/* 4th and 5th items (Net GEX & Expected Move) sit quietly below with left accent bars */
#mkLevels .stat:nth-child(n+4) {
  background: rgba(8, 14, 26, 0.55) !important;
  border: 0 !important;
  border-left: 3px solid var(--gold) !important;
  border-radius: 0 10px 10px 0 !important;
  padding: 10px 14px !important;
}

/* 7. ZONE 2: Supporting Panels ("One box per section, rows + hairlines inside") */
#mkCross,
#mkBreadth,
#mkEvents,
#mkNews {
  background: var(--zone2-bg) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 16px !important;
  padding: 20px 22px !important;
  box-shadow: 0 8px 24px rgba(2, 6, 18, 0.3) !important;
}
/* Inside Zone 2: .tile is a clean hairline row with a 3px semantic left bar — NEVER a 4-sided box! */
.tile {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--hairline) !important;
  border-left: 3px solid transparent !important;
  border-radius: 0 !important;
  padding: 12px 10px !important;
  box-shadow: none !important;
  transition: background 0.15s ease !important;
}
.tile.lean-up {
  border-left-color: #34d399 !important;
  background: linear-gradient(90deg, rgba(52, 211, 153, 0.06), transparent 60%) !important;
}
.tile.lean-down {
  border-left-color: #fb7185 !important;
  background: linear-gradient(90deg, rgba(251, 113, 133, 0.06), transparent 60%) !important;
}
.tile:hover {
  transform: none !important;
  background: rgba(255, 255, 255, 0.04) !important;
}

/* 8. Trade Desk (#panel-levels): Clear Hierarchy between Action Zone & Evidence Rows */
.go-card,
.sl-card {
  background: var(--zone1-bg) !important;
  border: 1px solid rgba(226, 201, 143, 0.36) !important;
  border-top: 3px solid var(--gold) !important;
  border-radius: 18px !important;
  padding: 20px 22px !important;
  box-shadow: 0 14px 34px rgba(2, 6, 18, 0.45) !important;
}
.go-card.go-ok {
  border-top-color: #34d399 !important;
}
.go-card.go-bad {
  border-top-color: #fb7185 !important;
}
.sc-card,
.desk,
.tc,
.pb-flow,
.phase,
.uj-card {
  background: var(--zone2-bg) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 16px !important;
  padding: 20px 22px !important;
  box-shadow: 0 8px 24px rgba(2, 6, 18, 0.3) !important;
}
.dk-sec {
  border-top: 1px solid var(--hairline);
  padding-top: 16px;
}
/* Traffic-Light Wall Plates inside Trade Desk (.dk-lv) */
.dk-lv {
  border: 1px solid var(--hairline) !important;
  border-left: 4px solid var(--hairline-strong) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  background: rgba(8, 14, 26, 0.65) !important;
}
.dk-lv.dk-call {
  border-left-color: #34d399 !important;
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.75), rgba(9, 18, 22, 0.8)) !important;
}
.dk-lv.dk-put {
  border-left-color: #fb7185 !important;
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.75), rgba(18, 11, 20, 0.8)) !important;
}
.dk-lv.dk-zero {
  border-left-color: #60a5fa !important;
}
.dk-lv.dk-range {
  border-left-color: var(--gold) !important;
}

/* KPI Row in Journal / Review (.jstat) */
.jstat {
  background: var(--zone2-bg) !important;
  border: 1px solid var(--hairline) !important;
  border-left: 4px solid var(--gold) !important;
  border-radius: 12px !important;
  padding: 14px 16px !important;
}

/* Playbook rules inside .phase: clean hairline rows */
.phase-head {
  padding: 0 0 12px !important;
  border-bottom: 1px solid var(--hairline) !important;
  background: none !important;
}
.rule {
  padding: 12px 6px !important;
  border-bottom: 1px solid var(--hairline) !important;
  background: none !important;
  border-radius: 0 !important;
}
.rule:hover {
  background: rgba(255, 255, 255, 0.03) !important;
}

/* 9. ZONE 3: Folded Reference Drawers (details.explain) */
details.explain,
.opening-routine,
.paper-policy,
.dk-ref {
  background: var(--zone3-bg) !important;
  border: 1px solid var(--hairline) !important;
  border-radius: 12px !important;
  padding: 2px 16px !important;
}

/* 10. Role Separation: Hide Owner-only tabs in Public/Friend view */
body:not(.is-owner-view) .owner-tab {
  display: none !important;
}
.view-mode-btn {
  border-color: rgba(226, 201, 143, 0.45) !important;
  background: rgba(226, 201, 143, 0.1) !important;
  color: #f5d485 !important;
  font-size: 0.84rem !important;
  padding: 5px 12px !important;
  min-height: 32px !important;
}
.view-mode-btn[aria-pressed="true"] {
  border-color: rgba(86, 216, 160, 0.5) !important;
  background: rgba(86, 216, 160, 0.12) !important;
  color: #91edbf !important;
}

/* 11. User Trade Journal (#panel-mytrades) */
.uj-card {
  margin-bottom: 24px;
  border-top: 3px solid #34d399 !important;
}
.uj-card-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.uj-card-head h3 {
  margin: 0 0 4px;
  font-family: var(--font-head);
  font-size: 1.18rem;
}
.uj-card-head p {
  margin: 0;
  font-size: 0.88rem;
  color: var(--muted);
}
.uj-fx-wrap {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-head);
  font-size: 0.84rem;
  color: var(--muted);
  padding: 4px 0;
}
.uj-fx-wrap input {
  background: #0a1220;
  color: var(--text);
  border: 1px solid var(--hairline);
  border-radius: 6px;
  padding: 4px 6px;
  font-family: var(--mono);
  font-size: 0.9rem;
}
.uj-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 14px;
}
@media (max-width: 920px) {
  .uj-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 540px) {
  .uj-grid { grid-template-columns: 1fr; }
}
.uj-quick-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 6px;
}
.uj-quick-row small {
  font-size: 0.75rem;
  color: var(--muted);
  margin-right: 2px;
}
.uj-qbtn {
  background: rgba(255, 255, 255, 0.05);
  color: var(--text);
  border: 1px solid var(--hairline);
  border-radius: 6px;
  padding: 3px 8px;
  font-family: var(--font-head);
  font-size: 0.76rem;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.uj-qbtn:hover {
  border-color: var(--gold);
  background: rgba(226, 201, 143, 0.14);
}
.uj-live-bar {
  margin: 14px 0;
  padding: 10px 14px;
  border-left: 4px solid var(--gold);
  border-radius: 8px;
  background: rgba(226, 201, 143, 0.08);
  font-size: 0.94rem;
}
.uj-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

/* 12. Review Tab (#panel-review) */
.rv-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
@media (max-width: 900px) {
  .rv-grid { grid-template-columns: 1fr; }
  .mk-frame-chain,
  #mkLevels .lvl-list { grid-template-columns: 1fr !important; }
}
.rv-table th,
.rv-table td {
  padding: 10px 8px;
}

/* 13. Full Light Mode Support (html[data-theme="light"]) */
html[data-theme="light"] {
  --canvas-veil: linear-gradient(180deg, rgba(242, 246, 252, 0.94) 0%, rgba(248, 250, 255, 0.98) 240px, #f8faff 100%);
  --zone1-bg: linear-gradient(155deg, #ffffff 0%, #f5f8ff 100%);
  --zone2-bg: #ffffff;
  --zone3-bg: #f8fafc;
  --hairline: rgba(15, 23, 42, 0.12);
  --hairline-strong: rgba(180, 130, 35, 0.45);
  --bg: #f5f8fd;
  --card: #ffffff;
  --card-2: #f8fafc;
  --text: #0f172a;
  --muted: #475569;
  --line: rgba(15, 23, 42, 0.12);
  --line-strong: rgba(15, 23, 42, 0.22);
  --green: #15803d;
  --red: #be123c;
  --amber: #b45309;
  --sky: #0369a1;
  --gold: #9a6b13;
  --gold-light: #85580a;
}
html[data-theme="light"] body {
  color: #0f172a !important;
}
html[data-theme="light"] .dte-tab-shell {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important;
}
html[data-theme="light"] .dte-tab-shell .tab {
  color: #334155;
}
html[data-theme="light"] .dte-tab-shell .tab[aria-selected="true"] {
  background: rgba(180, 130, 35, 0.14) !important;
  border-color: rgba(180, 130, 35, 0.5) !important;
  color: #78350f !important;
}
html[data-theme="light"] .zone-banner {
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.12), rgba(241, 245, 249, 0.7) 80%);
}
html[data-theme="light"] .zone-pill {
  color: #78350f;
  background: rgba(245, 158, 11, 0.18);
}
html[data-theme="light"] .zone-banner.zone-secondary .zone-pill {
  color: #0c4a6e;
  background: rgba(14, 165, 233, 0.15);
}
html[data-theme="light"] .zone-desc {
  color: #334155;
}
html[data-theme="light"] .ov-tile,
html[data-theme="light"] .mk-frame,
html[data-theme="light"] .dk-lv {
  background: #f8fafc !important;
}
html[data-theme="light"] #mkLevels .stat:nth-child(1),
html[data-theme="light"] .dk-lv.dk-call {
  background: #f0fdf4 !important;
}
html[data-theme="light"] #mkLevels .stat:nth-child(2),
html[data-theme="light"] .dk-lv.dk-put {
  background: #fff1f2 !important;
}
html[data-theme="light"] #mkLevels .stat:nth-child(3) {
  background: #f0f9ff !important;
}
html[data-theme="light"] #mkMacd .mk-macd-decision {
  background: #f0fdf4 !important;
}
html[data-theme="light"] .dte-head h1,
html[data-theme="light"] .panel-head h2,
html[data-theme="light"] .mk-box h3,
html[data-theme="light"] .card h3,
html[data-theme="light"] .gx-title,
html[data-theme="light"] .desk-date,
html[data-theme="light"] .dk-dec-title,
html[data-theme="light"] .ov-num,
html[data-theme="light"] .jstat b,
html[data-theme="light"] .spy-price {
  color: #0f172a !important;
}
html[data-theme="light"] .dte-lede,
html[data-theme="light"] .panel-head p,
html[data-theme="light"] .card p,
html[data-theme="light"] .explain-body,
html[data-theme="light"] .dk-list li,
html[data-theme="light"] .rule-text,
html[data-theme="light"] .qcard .q-take {
  color: #1e293b !important;
}
html[data-theme="light"] .f-row input,
html[data-theme="light"] .f-row textarea,
html[data-theme="light"] .f-row select,
html[data-theme="light"] .dk-pick select,
html[data-theme="light"] .uj-fx-wrap input {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.24) !important;
  color-scheme: light;
}
html[data-theme="light"] #levelsList .lv-pass {
  background: linear-gradient(145deg, #f8fafc, #eef4ff) !important;
  border-color: rgba(15, 23, 42, 0.18) !important;
}
html[data-theme="light"] #levelsList .lv-pass .pass-stub {
  background: rgba(15, 23, 42, 0.04) !important;
  border-left-color: rgba(15, 23, 42, 0.2) !important;
}
html[data-theme="light"] #levelsList .lv-pass .pass-stub b {
  color: #0f172a;
}
html[data-theme="light"] #levelsList .lv-pass .pass-stub small {
  color: #475569;
}
html[data-theme="light"] #levelsList .lv-pass .levels-mini .lv {
  background: #ffffff !important;
  border: 1px solid rgba(15, 23, 42, 0.12);
}
html[data-theme="light"] .up,
html[data-theme="light"] .ls-tone-up { color: #15803d !important; }
html[data-theme="light"] .down,
html[data-theme="light"] .ls-tone-down { color: #be123c !important; }
html[data-theme="light"] .view-mode-btn {
  color: #85580a !important;
  background: rgba(180, 130, 35, 0.12) !important;
}

/* ==========================================================================
   14. INFOGRAPHIC & VISUALIZATION COMPONENTS (2026-10-20)
   - Fear & Greed Semicircle Dial Gauge + 3-Period Delta Cards + 5-Zone Spectrum
   - Economic Calendar Tear-Off Date Leaves + 3-Bar Volatility Meter
   - SPY Intraday Range End-Caps + Run-vs-Normal Progress Meters
   - Cross-Asset & Big-Tech Tug-of-War Balance Bars
   ========================================================================== */

/* A. SPY Intraday Range Header & Run Meters */
.range-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 14px 4px 0;
  font-size: 0.78rem;
  color: var(--muted);
}
.range-head b {
  font-family: var(--mono);
  color: var(--text);
}
.range-head .rh-lo b { color: var(--red); }
.range-head .rh-hi b { color: var(--green); }
.range-head .rh-span b { color: var(--gold-light); }
.range-bar {
  height: 12px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.16) !important;
  margin: 26px 6px 38px !important;
  border: 1px solid rgba(148, 163, 184, 0.25);
}
.range-bar .range-active {
  position: absolute;
  top: 0;
  bottom: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(251, 113, 133, 0.45), rgba(226, 201, 143, 0.45) 50%, rgba(52, 211, 153, 0.55));
}
.range-bar .mk.now span {
  top: -26px !important;
  background: rgba(226, 201, 143, 0.18) !important;
  border: 1px solid rgba(226, 201, 143, 0.55);
  padding: 1px 7px !important;
  border-radius: 999px !important;
}
.run-meter {
  position: relative;
  height: 6px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  margin: 5px 0 4px;
  overflow: visible;
}
.run-meter i {
  display: block;
  height: 100%;
  border-radius: 999px;
}
.run-meter .run-norm {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 2px;
  background: var(--gold-light);
  opacity: 0.85;
}

/* B. Support vs Pressure Tug-of-War Meter (.tug-wrap) */
.tug-wrap {
  margin: 8px 0 14px;
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(8, 14, 26, 0.55);
  border: 1px solid var(--hairline);
}
.tug-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 0.82rem;
  margin-bottom: 6px;
}
.tug-mid {
  font-family: var(--font-head);
  font-weight: 600;
  color: var(--text);
  font-size: 0.8rem;
}
.tug-bar {
  display: flex;
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(148, 163, 184, 0.18);
  gap: 2px;
}
.tug-bar .tug-up {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #10b981, #34d399);
  border-radius: 999px 0 0 999px;
  transition: width 0.35s ease;
}
.tug-bar .tug-dn {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #fb7185, #e11d48);
  border-radius: 0 999px 999px 0;
  transition: width 0.35s ease;
}

/* C. Fear & Greed (CNN) Hero Infographic Widget (.fg-widget) */
.fg-widget {
  margin: 0 0 20px;
  padding: 16px 18px;
  border-radius: 14px;
  background: radial-gradient(ellipse at 0% 0%, rgba(226, 201, 143, 0.1), transparent 70%), rgba(7, 13, 25, 0.72);
  border: 1px solid rgba(226, 201, 143, 0.28);
}
.fg-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 6px 12px;
  margin-bottom: 12px;
}
.fg-head h3 {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 1.06rem !important;
}
.fg-takeaway {
  font-family: var(--font-head);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--gold-light);
}
.fg-body {
  display: grid;
  grid-template-columns: 185px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
}
@media (max-width: 640px) {
  .fg-body { grid-template-columns: 1fr; }
}
.fg-dial-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(4, 9, 18, 0.55);
  border: 1px solid var(--hairline);
  border-radius: 12px;
  padding: 10px 8px 8px;
}
.fg-gauge-svg {
  width: 100%;
  max-width: 175px;
  height: auto;
  display: block;
}
.fg-scale-txt {
  font-family: var(--font-body);
  font-size: 9.5px;
  fill: #94a3b8;
}
.fg-score-num {
  font-family: var(--font-head);
  font-size: 32px;
  font-weight: 800;
}
.fg-dial-label {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 0.92rem;
  margin-top: -2px;
}
.fg-info-col {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.fg-hist-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.fg-hist-card {
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid var(--hairline);
  border-radius: 10px;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.fg-hist-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4px;
  font-size: 0.72rem;
  color: var(--muted);
}
.fg-hist-top span {
  font-family: var(--mono);
  font-weight: 700;
}
.fg-hist-val {
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.fg-hist-val b {
  font-family: var(--mono);
  font-size: 1.08rem;
  color: var(--text);
}
.fg-hist-val span {
  font-size: 0.72rem;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fg-hist-bar {
  height: 5px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  overflow: hidden;
  margin-top: 2px;
}
.fg-hist-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
}
.fg-zones {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.fg-zone-pill {
  font-size: 0.71rem;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(148, 163, 184, 0.2);
  color: var(--muted);
}
.fg-zone-pill b {
  font-family: var(--mono);
  color: var(--zcol, var(--text));
}
.fg-zone-pill.is-active {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--zcol, var(--gold));
  color: var(--text);
  font-weight: 600;
}
.fg-hint {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.5;
  color: var(--muted);
}

/* D. Economic Calendar Visual Timeline (.ev-timeline) */
.ev-sec-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid var(--hairline);
}
.ev-timeline {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px !important;
}
.ev-timeline .ev-card {
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) auto;
  gap: 12px !important;
  align-items: center !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: rgba(8, 14, 26, 0.55) !important;
  border: 1px solid var(--hairline) !important;
  transition: border-color 0.16s, background 0.16s;
}
.ev-timeline .ev-card:hover {
  border-color: rgba(148, 163, 184, 0.38) !important;
  background: rgba(15, 25, 45, 0.75) !important;
}
.ev-timeline .ev-card.is-today {
  border-color: rgba(251, 113, 133, 0.5) !important;
  background: linear-gradient(90deg, rgba(251, 113, 133, 0.12), rgba(8, 14, 26, 0.65) 70%) !important;
}
.ev-leaf {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: #0b1324;
  text-align: center;
  padding-bottom: 3px;
}
.ev-leaf small {
  display: block;
  width: 100%;
  font-family: var(--font-head);
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  padding: 2px 0;
  background: rgba(96, 165, 250, 0.22);
  color: #bae6fd;
}
.ev-leaf.leaf-red small {
  background: rgba(251, 113, 133, 0.32);
  color: #fecdd3;
}
.ev-leaf.leaf-amber small {
  background: rgba(245, 158, 11, 0.28);
  color: #fde68a;
}
.ev-leaf b {
  font-family: var(--font-head);
  font-size: 1.18rem;
  font-weight: 800;
  line-height: 1.15;
  color: var(--text);
  margin-top: 2px;
}
.ev-leaf span {
  font-size: 0.68rem;
  color: var(--muted);
  line-height: 1.1;
}
.ev-info {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.ev-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
.ev-name {
  font-family: var(--font-head);
  font-size: 0.94rem;
  font-weight: 700;
  color: var(--text);
}
.ev-meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px 8px;
}
.ev-meta-pill {
  font-size: 0.75rem;
  padding: 1px 8px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(148, 163, 184, 0.18);
  color: var(--muted);
}
.ev-meta-pill.ev-prev b {
  font-family: var(--mono);
  color: var(--gold-light);
}
.ev-src-link {
  font-size: 0.75rem;
  color: var(--sky);
  text-decoration: none;
}
.ev-src-link:hover {
  text-decoration: underline;
}
.ev-impact {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 3px;
  min-width: 78px;
  text-align: right;
}
.ev-impact small {
  font-family: var(--font-head);
  font-size: 0.72rem;
  font-weight: 600;
  white-space: nowrap;
}
.vol-bars {
  display: inline-flex;
  align-items: flex-end;
  gap: 3px;
  height: 16px;
}
.vol-bars i {
  display: inline-block;
  width: 5px;
  border-radius: 2px;
  background: rgba(148, 163, 184, 0.22);
}
.vol-bars i:nth-child(1) { height: 7px; }
.vol-bars i:nth-child(2) { height: 11px; }
.vol-bars i:nth-child(3) { height: 16px; }
.ev-impact.imp-high .vol-bars i.on { background: #fb7185; box-shadow: 0 0 6px rgba(251, 113, 133, 0.45); }
.ev-impact.imp-high small { color: #fda4af; }
.ev-impact.imp-mid .vol-bars i.on { background: #f59e0b; }
.ev-impact.imp-mid small { color: #fcd34d; }
.ev-impact.imp-low .vol-bars i.on { background: #94a3b8; }
.ev-impact.imp-low small { color: var(--muted); }
@media (max-width: 520px) {
  .ev-timeline .ev-card {
    grid-template-columns: 48px minmax(0, 1fr);
  }
  .ev-impact {
    grid-column: 2;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
  }
}

/* Light Mode overrides for Infographic components */
html[data-theme="light"] .fg-widget,
html[data-theme="light"] .fg-dial-col,
html[data-theme="light"] .fg-hist-card,
html[data-theme="light"] .tug-wrap,
html[data-theme="light"] .ev-timeline .ev-card,
html[data-theme="light"] .ev-leaf {
  background: #f8fafc !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] .ev-meta-pill,
html[data-theme="light"] .fg-zone-pill {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.15) !important;
  color: #334155 !important;
}
html[data-theme="light"] .dte-context > details.explain summary {
  color: #0369a1 !important;
}

/* ==========================================================================
   15. 📘 GUIDE TAB (#panel-guide) & REDESIGNED 🧭 TRADE DESK (#panel-levels)
   ========================================================================== */

/* A. Top Guide CTA Bar (.guide-cta-bar) */
.guide-cta-bar {
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  padding: 11px 16px;
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(59, 91, 253, 0.18), rgba(16, 26, 46, 0.88) 70%);
  border: 1px solid rgba(96, 165, 250, 0.38);
}
.guide-cta-copy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  font-size: 0.92rem;
}
.guide-cta-badge {
  font-family: var(--font-head);
  font-size: 0.76rem;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 999px;
  background: rgba(96, 165, 250, 0.22);
  border: 1px solid rgba(147, 197, 253, 0.5);
  color: #dbeafe;
}
.guide-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.guide-cta-btn {
  padding: 6px 13px !important;
  min-height: 34px !important;
  font-size: 0.82rem !important;
}

/* B. 📘 Guide Tab (#panel-guide) */
.guide-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
  background: var(--zone1-bg);
  border: 1px solid rgba(226, 201, 143, 0.38);
  border-top: 3px solid var(--gold);
  border-radius: 20px;
  padding: 24px 26px;
  margin-bottom: 18px;
  box-shadow: 0 16px 38px rgba(2, 6, 18, 0.45);
}
.guide-hero-copy h2 {
  font-family: var(--font-head);
  font-size: clamp(1.38rem, 2.4vw, 1.85rem);
  font-weight: 800;
  line-height: 1.25;
  margin: 10px 0 10px;
}
.guide-hero-copy h2 em {
  font-style: normal;
  color: var(--sky);
}
.guide-hero-copy p {
  margin: 0 0 16px;
  color: #cbd5e1;
  font-size: 0.96rem;
  line-height: 1.65;
}
.guide-hero-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.guide-hero-statbox {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
}
.gh-stat {
  background: rgba(7, 13, 25, 0.78);
  border: 1px solid var(--hairline);
  border-left: 3px solid var(--gold);
  border-radius: 12px;
  padding: 11px 14px;
}
.gh-stat small {
  display: block;
  font-family: var(--font-head);
  font-size: 0.76rem;
  font-weight: 600;
  color: var(--muted);
}
.gh-stat b {
  display: block;
  font-family: var(--font-head);
  font-size: 1.22rem;
  font-weight: 800;
  line-height: 1.25;
  margin: 2px 0;
}
.gh-stat span {
  display: block;
  font-size: 0.78rem;
  color: var(--muted);
}

.guide-why-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}
.guide-why-card {
  background: var(--zone2-bg);
  border: 1px solid var(--hairline);
  border-radius: 16px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  box-shadow: 0 10px 24px rgba(2, 6, 18, 0.32);
}
.guide-why-card.gw-blue { border-top: 3px solid var(--sky); }
.guide-why-card.gw-green { border-top: 3px solid var(--green); }
.guide-why-card.gw-gold { border-top: 3px solid var(--gold); }
.guide-why-card.gw-violet { border-top: 3px solid var(--violet); }
.gw-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.gw-ico {
  font-size: 1.55rem;
  line-height: 1;
}
.guide-why-card h3 {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1.08rem;
  font-weight: 700;
}
.guide-why-card p {
  margin: 0;
  font-size: 0.9rem;
  color: #cbd5e1;
  line-height: 1.6;
}
.gw-metric {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 10px;
  border-top: 1px solid var(--hairline);
  font-size: 0.82rem;
}
.gw-metric span { color: var(--muted); }
.gw-metric b {
  font-family: var(--mono);
  color: var(--gold-light);
}

.guide-steps-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 20px;
}
.guide-step-card {
  background: var(--zone2-bg);
  border: 1px solid var(--hairline);
  border-radius: 16px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
}
.guide-step-card.gs-highlight {
  background: linear-gradient(150deg, rgba(16, 40, 36, 0.92), rgba(10, 22, 34, 0.95));
  border-color: rgba(52, 211, 153, 0.42);
}
.gs-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.gs-num {
  font-family: var(--mono);
  font-size: 0.76rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(226, 201, 143, 0.18);
  border: 1px solid rgba(226, 201, 143, 0.45);
  color: #fef08a;
}
.gs-time {
  font-family: var(--font-head);
  font-size: 0.78rem;
  color: var(--muted);
}
.guide-step-card h3 {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1.08rem;
  font-weight: 700;
}
.guide-step-card p {
  margin: 0;
  font-size: 0.9rem;
  color: #cbd5e1;
  line-height: 1.6;
}
.gs-list {
  margin: 0;
  padding-left: 18px;
  font-size: 0.85rem;
  color: #dbeafe;
  line-height: 1.55;
}
.gs-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--hairline);
}

.guide-regime-card {
  background: var(--zone1-bg);
  border: 1px solid rgba(96, 165, 250, 0.34);
  border-radius: 18px;
  padding: 20px 22px;
  margin-bottom: 20px;
}
.gr-head h3 {
  margin: 0 0 4px;
  font-family: var(--font-head);
  font-size: 1.15rem;
  font-weight: 700;
}
.gr-head p {
  margin: 0 0 14px;
  font-size: 0.88rem;
  color: var(--muted);
}
.gr-compare {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.gr-side {
  border-radius: 14px;
  padding: 16px 18px;
  border: 1px solid var(--hairline);
  background: rgba(7, 13, 25, 0.75);
}
.gr-side.gr-pos { border-top: 3px solid var(--green); }
.gr-side.gr-neg { border-top: 3px solid var(--red); }
.gr-badge-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.gr-freq {
  font-size: 0.76rem;
  color: var(--muted);
}
.gr-side h4 {
  margin: 0 0 10px;
  font-family: var(--font-head);
  font-size: 1.02rem;
}
.gr-svg {
  width: 100%;
  height: auto;
  display: block;
  background: rgba(4, 8, 16, 0.75);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 10px;
  margin-bottom: 10px;
}
.gr-rules {
  margin: 0;
  padding-left: 18px;
  font-size: 0.85rem;
  line-height: 1.6;
  color: #cbd5e1;
}

.guide-glossary {
  background: var(--zone2-bg);
  border: 1px solid var(--hairline);
  border-radius: 18px;
  padding: 20px 22px;
}
.guide-glossary h3 {
  margin: 0 0 14px;
  font-family: var(--font-head);
  font-size: 1.12rem;
}
.gg-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.gg-item {
  background: rgba(7, 13, 25, 0.68);
  border: 1px solid var(--hairline);
  border-radius: 12px;
  padding: 12px 14px;
}
.gg-tag {
  display: inline-block;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  margin-bottom: 4px;
}
.gg-tag.sky { color: var(--sky); }
.gg-tag.gold { color: var(--gold-light); }
.gg-item b {
  display: block;
  font-family: var(--font-head);
  font-size: 0.92rem;
  margin-bottom: 4px;
}
.gg-item p {
  margin: 0;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.55;
}

/* C. 🧭 Redesigned Trade Desk (#panel-levels) & 4-Mode Sub-Tab Bar */
.desk-subtabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 18px;
  padding: 6px;
  border-radius: 16px;
  background: rgba(8, 14, 26, 0.85);
  border: 1px solid rgba(148, 163, 184, 0.24);
  box-shadow: 0 10px 26px rgba(2, 6, 18, 0.38);
}
@media (max-width: 860px) {
  .desk-subtabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 480px) {
  .desk-subtabs {
    grid-template-columns: 1fr;
  }
}
.desk-subtab {
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  padding: 11px 14px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: rgba(255, 255, 255, 0.02);
  color: var(--muted);
  cursor: pointer;
  transition: background 0.16s, border-color 0.16s, color 0.16s, transform 0.16s;
}
.desk-subtab:hover {
  background: rgba(255, 255, 255, 0.06);
  color: var(--text);
}
.desk-subtab[aria-selected="true"] {
  background: linear-gradient(135deg, rgba(226, 201, 143, 0.2), rgba(59, 91, 253, 0.16));
  border-color: rgba(226, 201, 143, 0.65);
  color: var(--text);
  box-shadow: 0 4px 16px rgba(2, 6, 18, 0.35);
}
.dst-ico {
  font-size: 1.35rem;
  line-height: 1;
  flex: 0 0 auto;
}
.dst-txt {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.dst-txt b {
  font-family: var(--font-head);
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.desk-subtab[aria-selected="true"] .dst-txt b {
  color: #fef08a;
}
.dst-txt small {
  font-size: 0.74rem;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.desk-mini-plan {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  padding: 11px 16px;
  margin-bottom: 14px;
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(226, 201, 143, 0.13), rgba(13, 23, 42, 0.85) 75%);
  border: 1px solid rgba(226, 201, 143, 0.36);
  border-left: 4px solid var(--gold);
}
.dmp-left {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  font-size: 0.88rem;
}
.dmp-walls {
  font-family: var(--mono);
  font-size: 0.8rem;
  color: #cbd5e1;
  padding: 2px 9px;
  border-radius: 8px;
  background: rgba(6, 11, 22, 0.65);
  border: 1px solid var(--hairline);
}
.dmp-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

html[data-theme="light"] .desk-subtabs,
html[data-theme="light"] .desk-mini-plan {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
}
html[data-theme="light"] .desk-subtab[aria-selected="true"] .dst-txt b {
  color: #85580a !important;
}

.desk-quick-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: center;
  padding: 10px 14px;
  margin: 0 0 14px;
  border-radius: 12px;
  background: rgba(13, 22, 38, 0.78);
  border: 1px solid var(--hairline);
  font-size: 0.82rem;
  color: #cbd5e1;
}
.dql-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.desk-cockpit-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.32fr) minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
  margin-bottom: 16px;
}
.desk-cockpit-grid > #deskGo .go,
.desk-cockpit-grid > #deskLadder .lad {
  height: 100%;
  margin-bottom: 0 !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* #deskGo Readiness Meter & 2-Phase Strip */
.go-prog-wrap {
  margin: 10px 0 8px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(6, 11, 22, 0.62);
  border: 1px solid var(--hairline);
}
.go-prog-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 0.8rem;
  color: var(--muted);
  margin-bottom: 6px;
}
.go-prog-meta b {
  font-family: var(--mono);
  color: var(--text);
}
.go-prog-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.18);
  overflow: hidden;
}
.go-prog-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #f59e0b, #eab308);
  transition: width 0.35s ease;
}
.go-prog-fill.is-ready {
  background: linear-gradient(90deg, #10b981, #34d399);
}
.go-phases-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 6px 0 8px;
}
.go-phase-pill {
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(7, 13, 25, 0.55);
  border: 1px solid var(--hairline);
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.go-phase-pill.is-now {
  border-color: rgba(52, 211, 153, 0.55);
  background: rgba(16, 42, 36, 0.55);
}
.go-phase-pill small {
  font-family: var(--font-head);
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--gold-light);
}
.go-phase-pill b {
  font-size: 0.8rem;
  color: var(--text);
}
.go-phase-pill span {
  font-size: 0.73rem;
  color: var(--muted);
}

/* #deskLive 5-Column Context Row & Visual Timing Bars */
@media (min-width: 980px) {
  #deskLive .ls-context {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}
.tm-viz-bar {
  position: relative;
  height: 7px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.2);
  margin: 6px 0 4px;
}
.tm-viz-zone {
  position: absolute;
  top: 0;
  bottom: 0;
  background: rgba(52, 211, 153, 0.24);
  border-left: 1px dashed rgba(52, 211, 153, 0.6);
  border-right: 1px dashed rgba(251, 113, 133, 0.6);
}
.tm-viz-dot {
  position: absolute;
  top: 50%;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--sky);
  border: 2px solid #070d19;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 6px rgba(96, 165, 250, 0.6);
}
.tm-vwap-chip {
  margin: 4px 0;
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 6px;
  font-family: var(--mono);
  font-size: 0.75rem;
  font-weight: 700;
  width: fit-content;
}
.tm-vwap-chip.is-above {
  background: rgba(52, 211, 153, 0.14);
  color: #6ee7b7;
  border: 1px solid rgba(52, 211, 153, 0.35);
}
.tm-vwap-chip.is-below {
  background: rgba(251, 113, 133, 0.14);
  color: #fda4af;
  border: 1px solid rgba(251, 113, 133, 0.35);
}
.tm-ema-row {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 4px 0;
}
.tm-ema-row span {
  font-family: var(--mono);
  font-size: 0.71rem !important;
  padding: 1px 6px;
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--hairline);
  color: #cbd5e1 !important;
}

/* #deskToday Fallback Status Banner, Horizontal Battle Corridor, and 3-Col Bento Grid */
.dk-fallback-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  padding: 12px 16px;
  border-radius: 12px;
  background: linear-gradient(90deg, rgba(56, 189, 248, 0.14), rgba(15, 23, 42, 0.65));
  border: 1px solid rgba(56, 189, 248, 0.38);
  margin-bottom: 6px;
}
.dk-fb-copy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  font-size: 0.88rem;
}

.dk-corridor {
  margin: 6px 0 14px;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(6, 11, 22, 0.72);
  border: 1px solid var(--hairline);
}
.dk-cor-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
  font-family: var(--font-head);
  font-size: 0.82rem;
  font-weight: 700;
}
.dk-cor-mid {
  color: var(--gold-light);
  font-size: 0.8rem;
}
.dk-cor-track {
  position: relative;
  display: flex;
  height: 10px;
  border-radius: 999px;
  overflow: visible;
  background: rgba(148, 163, 184, 0.16);
}
.dk-cor-zone-put {
  height: 100%;
  border-radius: 999px 0 0 999px;
  background: linear-gradient(90deg, rgba(251, 113, 133, 0.65), rgba(245, 183, 59, 0.35));
}
.dk-cor-zone-call {
  height: 100%;
  border-radius: 0 999px 999px 0;
  background: linear-gradient(90deg, rgba(245, 183, 59, 0.35), rgba(52, 211, 153, 0.65));
}
.dk-cor-pin {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #0b1324;
  border: 1.5px solid var(--gold-light);
  color: var(--gold-light);
  font-family: var(--mono);
  font-size: 0.66rem;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 999px;
  white-space: nowrap;
}

.dk-bento-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}
.dk-bento-col {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.dk-bento-col .dk-sec {
  background: rgba(7, 13, 25, 0.55);
  border: 1px solid var(--hairline) !important;
  border-radius: 12px;
  padding: 14px 16px !important;
}

/* .desk-calc-grid (#deskSell + #deskReach side by side) */
.desk-calc-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
  margin-top: 16px;
}
.desk-calc-grid > #deskSell .sc,
.desk-calc-grid > #deskReach .rc {
  height: 100%;
  margin-top: 0 !important;
}
.sc-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}
.sc-preset {
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid var(--hairline);
  color: var(--text);
  border-radius: 6px;
  padding: 2px 7px;
  font-family: var(--mono);
  font-size: 0.73rem;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.sc-preset:hover {
  border-color: var(--gold);
  background: rgba(226, 201, 143, 0.16);
}
.sc-tier-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}
.sc-tier-card {
  background: rgba(7, 13, 25, 0.65);
  border: 1px solid var(--hairline);
  border-radius: 10px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sc-tier-card.is-target {
  border-color: rgba(52, 211, 153, 0.5);
  background: linear-gradient(145deg, rgba(16, 44, 38, 0.65), rgba(8, 18, 28, 0.75));
}
.sc-tier-card.is-runner {
  border-color: rgba(226, 201, 143, 0.5);
  background: linear-gradient(145deg, rgba(44, 34, 16, 0.58), rgba(8, 18, 28, 0.75));
}
.sc-tier-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
}
.sc-tier-pct {
  font-family: var(--mono);
  font-weight: 800;
  color: var(--green);
}
.sc-tier-tag {
  color: var(--muted);
  font-size: 0.71rem;
}
.sc-tier-price {
  font-family: var(--font-head);
  font-size: 0.85rem;
  color: var(--muted);
}
.sc-tier-price b {
  font-family: var(--mono);
  font-size: 1.15rem;
  color: var(--text);
}
.sc-tier-bar {
  height: 5px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  overflow: hidden;
}
.sc-tier-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #10b981, #34d399);
}
.sc-tier-pnl {
  font-family: var(--mono);
  font-size: 0.75rem;
}

.desk-archive-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 10px 16px;
  margin-bottom: 12px;
}

@media (max-width: 980px) {
  .guide-hero,
  .guide-why-grid,
  .guide-steps-grid,
  .gr-compare,
  .gg-grid,
  .desk-cockpit-grid,
  .desk-calc-grid,
  .dk-bento-grid {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 560px) {
  .go-phases-strip,
  .sc-tier-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Light Mode overrides for Guide & Trade Desk v2 */
html[data-theme="light"] .guide-cta-bar,
html[data-theme="light"] .guide-hero,
html[data-theme="light"] .guide-why-card,
html[data-theme="light"] .guide-step-card,
html[data-theme="light"] .guide-regime-card,
html[data-theme="light"] .gr-side,
html[data-theme="light"] .guide-glossary,
html[data-theme="light"] .gg-item,
html[data-theme="light"] .gh-stat,
html[data-theme="light"] .desk-quick-legend,
html[data-theme="light"] .go-prog-wrap,
html[data-theme="light"] .go-phase-pill,
html[data-theme="light"] .dk-corridor,
html[data-theme="light"] .dk-bento-col .dk-sec,
html[data-theme="light"] .sc-tier-card {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.15) !important;
  color: #0f172a !important;
}
html[data-theme="light"] .guide-hero-copy p,
html[data-theme="light"] .guide-why-card p,
html[data-theme="light"] .guide-step-card p,
html[data-theme="light"] .gs-list,
html[data-theme="light"] .gr-rules,
html[data-theme="light"] .desk-quick-legend {
  color: #334155 !important;
}

/* ==========================================================================
   18. IMPECCABLE V48 — KEYWORD-FIRST + PROGRESSIVE TOGGLES + TRAFFIC-LIGHT KPIS
       + SINGLE-FOCUS BARS + TACTILE OPTION TICKETS + MULTI-PART HOVER PLAYFULNESS
   ========================================================================== */

/* A. Card Eyebrow & Cockpit Header Rhythm */
.card-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-head);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--gold-light);
  background: rgba(245, 183, 59, 0.12);
  border: 1px solid rgba(245, 183, 59, 0.35);
  padding: 3px 10px;
  border-radius: 999px;
  margin-bottom: 6px;
}

/* B. 3-Tile Traffic-Light KPI Row inside #deskGo */
.go-kpi-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.go-kpi-box {
  position: relative;
  overflow: hidden;
  background: rgba(8, 15, 29, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-top: 3px solid rgba(148, 163, 184, 0.45);
  border-radius: 12px;
  padding: 11px 12px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 6px;
  min-height: 98px;
  transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.22s ease, box-shadow 0.22s ease;
}
.go-kpi-box small {
  font-family: var(--font-head);
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--muted);
}
.go-kpi-box b {
  font-family: var(--mono);
  font-size: 1.24rem;
  font-weight: 800;
  line-height: 1.15;
  color: var(--text);
}
.go-kpi-box.kpi-good {
  border-top-color: #10b981;
  background: linear-gradient(165deg, rgba(16, 185, 129, 0.12), rgba(8, 15, 29, 0.85));
}
.go-kpi-box.kpi-good b { color: #34d399; }
.go-kpi-box.kpi-warn {
  border-top-color: #f59e0b;
  background: linear-gradient(165deg, rgba(245, 158, 11, 0.12), rgba(8, 15, 29, 0.85));
}
.go-kpi-box.kpi-warn b { color: #fbbf24; }
.go-kpi-box.kpi-bad {
  border-top-color: #f43f5e;
  background: linear-gradient(165deg, rgba(244, 63, 94, 0.14), rgba(8, 15, 29, 0.85));
}
.go-kpi-box.kpi-bad b { color: #fb7185; }

/* Single-Focus Neutral Bar Track */
.kpi-track {
  height: 6px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.18);
  overflow: hidden;
  margin-top: 2px;
}
.kpi-track i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #34d399;
  transition: width 0.35s ease;
}
.go-kpi-box.kpi-warn .kpi-track i { background: #fbbf24; }
.go-kpi-box.kpi-bad .kpi-track i { background: #fb7185; }

/* Unified Toggle Drawers in #deskGo & #deskLadder */
.go-master-toggle,
.sl-help-toggle {
  margin-top: 12px !important;
  background: rgba(9, 17, 32, 0.72) !important;
  border: 1px solid rgba(96, 165, 250, 0.26) !important;
  border-radius: 10px !important;
  padding: 8px 12px !important;
}
.go-master-toggle > summary,
.sl-help-toggle > summary {
  cursor: pointer;
  font-family: var(--font-head);
  font-size: 0.83rem;
  font-weight: 700;
  color: #bae6fd;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.go-drawer-sec + .go-drawer-sec {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed rgba(148, 163, 184, 0.2);
}
.go-drawer-sec h5,
.sl-help-body p b {
  font-family: var(--font-head);
  font-size: 0.82rem;
  color: var(--gold-light);
  margin: 0 0 6px;
}
.sl-help-body p {
  margin: 6px 0 0;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.55;
}

/* C. Aligned 3-Part Card Rhythm for .tm-row (4 cards) & .ls-context (5 cards) */
#panel-levels .tm-box {
  position: relative;
  overflow: hidden;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 118px !important;
  padding: 13px 14px !important;
  border-radius: 12px !important;
  background: rgba(10, 18, 34, 0.85) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-top: 3px solid rgba(96, 165, 250, 0.45) !important;
}
#panel-levels .tm-box.tm-good {
  border-top-color: #10b981 !important;
  background: linear-gradient(165deg, rgba(16, 185, 129, 0.12), rgba(10, 18, 34, 0.88)) !important;
}
#panel-levels .tm-box.tm-good b { color: #34d399 !important; }
#panel-levels .tm-box.tm-bad {
  border-top-color: #f43f5e !important;
  background: linear-gradient(165deg, rgba(244, 63, 94, 0.13), rgba(10, 18, 34, 0.88)) !important;
}
#panel-levels .tm-box.tm-bad b { color: #fb7185 !important; }
#panel-levels .tm-box.tm-warn {
  border-top-color: #f59e0b !important;
  background: linear-gradient(165deg, rgba(245, 158, 11, 0.13), rgba(10, 18, 34, 0.88)) !important;
}
#panel-levels .tm-box.tm-warn b { color: #fbbf24 !important; }
#panel-levels .tm-box b {
  font-family: var(--mono) !important;
  font-size: 1.32rem !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
}
/* Single-Focus Neutral Bar inside .tm-box & .ls-c */
#panel-levels .tm-viz-bar,
#panel-levels .ls-rbar {
  background: rgba(148, 163, 184, 0.18) !important;
  height: 6px !important;
  border-radius: 999px !important;
}
.tm-chip-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: auto;
}

#panel-levels .ls-context {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
}
#panel-levels .ls-context .ls-c {
  position: relative;
  overflow: hidden;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 118px !important;
  padding: 13px 14px !important;
  border-radius: 12px !important;
  background: rgba(10, 18, 34, 0.85) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-top: 3px solid rgba(148, 163, 184, 0.45) !important;
}
#panel-levels .ls-context .ls-c.ls-call,
#panel-levels .ls-context .ls-c.ls-complete {
  border-top-color: #10b981 !important;
  background: linear-gradient(165deg, rgba(16, 185, 129, 0.11), rgba(10, 18, 34, 0.88)) !important;
}
#panel-levels .ls-context .ls-c.ls-put {
  border-top-color: #f43f5e !important;
  background: linear-gradient(165deg, rgba(244, 63, 94, 0.12), rgba(10, 18, 34, 0.88)) !important;
}
#panel-levels .ls-context .ls-c.ls-key {
  border-top-color: #f5b73b !important;
}
#panel-levels .ls-context .ls-c.ls-attention,
#panel-levels .ls-context .ls-c.ls-pending {
  border-top-color: #f59e0b !important;
}
#panel-levels .ls-context .ls-value {
  font-family: var(--mono) !important;
  font-size: 1.24rem !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
}
#panel-levels .ls-context .ls-detail {
  margin-top: auto !important;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ls-toggles-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.ls-toggles-row > details.explain {
  margin-top: 0 !important;
}

/* D. Tactile Option Order Tickets (.dk-plan) & Progressive Toggles (.dk-toggle) */
#deskToday .dk-plan {
  position: relative;
  overflow: hidden;
  border-radius: 14px !important;
  padding: 16px 18px !important;
  background: linear-gradient(155deg, rgba(13, 24, 44, 0.94), rgba(8, 15, 29, 0.96)) !important;
  border: 1px solid rgba(148, 163, 184, 0.25) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
}
#deskToday .dk-plan.dk-plan-call {
  border-top: 4px solid #10b981 !important;
  background: linear-gradient(155deg, rgba(14, 42, 36, 0.82), rgba(8, 16, 29, 0.95)) !important;
}
#deskToday .dk-plan.dk-plan-put {
  border-top: 4px solid #f43f5e !important;
  background: linear-gradient(155deg, rgba(46, 18, 29, 0.82), rgba(8, 16, 29, 0.95)) !important;
}
.dk-ticket-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 6px;
}
.dk-ticket-perf {
  position: relative;
  height: 1px;
  margin: 10px -18px;
  border-top: 2px dashed rgba(148, 163, 184, 0.26);
}
.dk-ticket-perf::before,
.dk-ticket-perf::after {
  content: "";
  position: absolute;
  top: -8px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #070d19;
  border: 1px solid rgba(148, 163, 184, 0.28);
}
.dk-ticket-perf::before { left: -8px; }
.dk-ticket-perf::after { right: -8px; }

.dk-ticket-more {
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}
.dk-ticket-more > summary {
  cursor: pointer;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--gold-light);
  list-style: none;
}
.dk-ticket-more > summary::-webkit-details-marker { display: none; }
.dk-ticket-more-body {
  margin-top: 8px;
  font-size: 0.82rem;
  color: var(--muted);
  display: grid;
  gap: 4px;
}
.dk-ticket-more-body p { margin: 0; }

.dk-review-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.dk-review-head h4 { margin: 0 !important; }
.dk-review-lead {
  margin: 0 0 10px;
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(16, 185, 129, 0.1);
  border-left: 3px solid #34d399;
  font-size: 0.92rem;
  color: var(--text);
}
.dk-drawers-stack {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}
.dk-toggle {
  margin-top: 10px !important;
  border-color: rgba(96, 165, 250, 0.28) !important;
  background: rgba(9, 17, 32, 0.82) !important;
}
.dk-toggle > summary {
  font-family: var(--font-head);
  font-weight: 700;
  color: #e0f2fe;
}

/* E. Guide Keyword-First Chips & Toggle Drawers (.guide-toggle) */
.gw-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 4px;
}
.guide-toggle {
  margin-top: auto;
  padding-top: 8px;
  border-top: 1px dashed rgba(148, 163, 184, 0.2);
}
.guide-toggle > summary {
  cursor: pointer;
  font-family: var(--font-head);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--gold-light);
  list-style: none;
  user-select: none;
}
.guide-toggle > summary::-webkit-details-marker { display: none; }
.guide-toggle p {
  margin: 8px 0 0 !important;
  font-size: 0.85rem !important;
  color: var(--muted) !important;
  line-height: 1.6 !important;
}

/* F. Fix Sell Calculator Classes (.sc-pre & .sc-tier in dte-sellcalc.js) */
.sc-pre {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(148, 163, 184, 0.24);
  color: var(--text);
  border-radius: 8px;
  padding: 4px 10px;
  font-family: var(--mono);
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.sc-pre:hover,
.sc-pre.is-on {
  border-color: var(--gold);
  background: rgba(245, 183, 59, 0.2);
  color: #fef3c7;
  transform: translateY(-1px);
}
.sc-tiers {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 12px 0;
}
.sc-tier {
  position: relative;
  overflow: hidden;
  background: rgba(9, 17, 32, 0.82);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-top: 3px solid #38bdf8;
  border-radius: 12px;
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sc-tier.sc-primary {
  border-top-color: #10b981;
  background: linear-gradient(155deg, rgba(16, 48, 40, 0.72), rgba(9, 17, 32, 0.9));
}
.sc-tier.sc-wall {
  border-top-color: #f5b73b;
  background: linear-gradient(155deg, rgba(48, 36, 14, 0.68), rgba(9, 17, 32, 0.9));
}
.sc-tier-px {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.sc-tier-px small {
  font-size: 0.76rem;
  color: var(--muted);
}
.sc-tier-px b {
  font-family: var(--mono);
  font-size: 1.28rem;
  font-weight: 800;
  color: var(--text);
}
.sc-tier-bot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  font-family: var(--mono);
  font-size: 0.78rem;
  color: var(--muted);
}
.sc-tier-bot b {
  color: #34d399;
}

/* G. Signature Multi-Part Hover Playfulness (3D Lift + Glass Sheen Sweep + Icon/Badge Pop) */
.guide-why-card,
.guide-step-card,
.gg-item,
.go-kpi-box,
#panel-levels .tm-box,
#panel-levels .ls-context .ls-c,
#deskToday .dk-plan,
#deskToday .dk-lv,
.sc-tier {
  position: relative;
  overflow: hidden;
  transition: transform 0.24s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.24s ease, box-shadow 0.24s ease !important;
}
.guide-why-card::after,
.guide-step-card::after,
.go-kpi-box::after,
#panel-levels .tm-box::after,
#panel-levels .ls-context .ls-c::after,
#deskToday .dk-plan::after,
.sc-tier::after {
  content: "";
  position: absolute;
  top: 0;
  left: -120%;
  width: 65%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.07), transparent);
  transform: skewX(-20deg);
  transition: left 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}
.guide-why-card:hover,
.guide-step-card:hover,
.gg-item:hover,
.go-kpi-box:hover,
#panel-levels .tm-box:hover,
#panel-levels .ls-context .ls-c:hover,
#deskToday .dk-plan:hover,
#deskToday .dk-lv:hover,
.sc-tier:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(245, 183, 59, 0.28);
}
.guide-why-card:hover::after,
.guide-step-card:hover::after,
.go-kpi-box:hover::after,
#panel-levels .tm-box:hover::after,
#panel-levels .ls-context .ls-c:hover::after,
#deskToday .dk-plan:hover::after,
.sc-tier:hover::after {
  left: 145%;
}
.guide-why-card:hover .gw-ico,
.guide-step-card:hover .gs-num {
  transform: scale(1.08) translateY(-1px);
  transition: transform 0.22s ease;
}

@media (max-width: 980px) {
  #panel-levels .ls-context {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px) {
  .go-kpi-row,
  #panel-levels .ls-context,
  .sc-tiers {
    grid-template-columns: 1fr !important;
  }
}

html[data-theme="light"] .go-kpi-box,
html[data-theme="light"] #panel-levels .tm-box,
html[data-theme="light"] #panel-levels .ls-context .ls-c,
html[data-theme="light"] #deskToday .dk-plan,
html[data-theme="light"] .sc-tier,
html[data-theme="light"] .go-master-toggle,
html[data-theme="light"] .sl-help-toggle,
html[data-theme="light"] .dk-toggle {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
}
html[data-theme="light"] .dk-ticket-perf::before,
html[data-theme="light"] .dk-ticket-perf::after {
  background: #f8fafc;
}

/* ==========================================================================
   19. INFOGRAPHIC COMMAND DECK V49 — ANTI-RECTANGLE-WALL + 3-COLUMN SVG DECK
       + SLEEK TOP RIBBON + OVERVIEW MINI-HUD SVGs + SEGMENTED PILL SUBTABS
   ========================================================================== */

/* A. Sleek Top Ribbon (Replaces the 2 stacked full-width Risk & Guide rectangles) */
.dte-top-ribbon {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px 16px !important;
  margin-top: 14px !important;
  padding: 8px 14px !important;
  border-radius: 999px !important;
  background: rgba(10, 18, 34, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
}
.dte-top-ribbon .risk-compact {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 0.8rem !important;
  color: var(--muted) !important;
  max-width: none !important;
}
.dte-top-ribbon .guide-cta-compact {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* B. Overview Mini-HUD SVGs inside Trading Command Deck (#overview) */
.ov-tile.ov-tile-viz {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
}
.ov-tile-main {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.ov-viz-svg {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.35));
}
.ov-viz-svg.ov-viz-wide {
  width: 50px;
  height: 36px;
}

/* C. Segmented Pill Switcher for #deskSubTabs (No 4 heavy dark boxes!) */
#deskSubTabs.desk-subtabs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  padding: 6px !important;
  border-radius: 16px !important;
  background: rgba(7, 13, 25, 0.82) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}
#deskSubTabs .desk-subtab {
  border: 1px solid transparent !important;
  background: transparent !important;
  border-radius: 11px !important;
  padding: 9px 12px !important;
}
#deskSubTabs .desk-subtab[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(30, 58, 138, 0.65), rgba(15, 29, 58, 0.92)) !important;
  border-color: rgba(245, 183, 59, 0.55) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

/* D. 3-Column Visual Infographic Command Deck inside #deskToday */
.dk-infographic-shell {
  padding: 18px 20px !important;
}
.dk-head-l {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.dk-infographic-deck {
  display: grid;
  grid-template-columns: 1.08fr 1.05fr 1.07fr;
  gap: 14px;
  align-items: stretch;
  margin-top: 12px;
}
.dk-info-col {
  border-radius: 14px;
  padding: 16px;
  background: rgba(8, 15, 29, 0.82);
  border: 1px solid rgba(148, 163, 184, 0.22);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  position: relative;
  overflow: hidden;
}

/* Column 1: Radial Score Gauge + Signal Factor Nodes */
.dk-info-verdict.dk-go {
  border-top: 3px solid #10b981;
  background: radial-gradient(circle at 18% 22%, rgba(16, 185, 129, 0.16), transparent 62%), rgba(8, 15, 29, 0.88);
}
.dk-info-verdict.dk-wait {
  border-top: 3px solid #f59e0b;
  background: radial-gradient(circle at 18% 22%, rgba(245, 158, 11, 0.15), transparent 62%), rgba(8, 15, 29, 0.88);
}
.dk-info-verdict.dk-skip {
  border-top: 3px solid #f43f5e;
  background: radial-gradient(circle at 18% 22%, rgba(244, 63, 94, 0.15), transparent 62%), rgba(8, 15, 29, 0.88);
}
.dk-verdict-top {
  display: flex;
  align-items: center;
  gap: 14px;
}
.dk-ring-wrap {
  width: 92px;
  height: 92px;
  flex-shrink: 0;
}
.dk-score-ring-svg {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 4px 12px rgba(16, 185, 129, 0.25));
}
.dk-verdict-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  min-width: 0;
}
.dk-verdict-copy .dk-dec-title {
  font-family: var(--font-head);
  font-size: 1.18rem;
  font-weight: 800;
  line-height: 1.25;
  color: #f8fafc;
}
.dk-signal-nodes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: auto;
}
.dk-sig-node {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 9px;
  border-radius: 9px;
  background: rgba(15, 26, 46, 0.85);
  border: 1px solid rgba(52, 211, 153, 0.24);
  font-size: 0.78rem;
  line-height: 1.3;
  color: #e2e8f0;
}
.dk-sig-node.is-warn {
  border-color: rgba(245, 183, 59, 0.35);
  background: rgba(42, 31, 14, 0.55);
}
.dk-sig-ico {
  font-size: 0.95rem;
  flex-shrink: 0;
}

/* Column 2: Option Boarding Pass + Payoff Curve SVG */
.dk-info-tickets {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  gap: 10px;
}
.dk-info-tickets .dk-plan {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin: 0 !important;
}
.dk-ticket-main {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
}
.dk-strike-eyebrow {
  display: block;
  font-family: var(--font-head);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--muted);
}
.dk-payoff-viz {
  margin: 6px 0 2px;
  padding: 6px 8px 2px;
  border-radius: 10px;
  background: rgba(6, 11, 22, 0.62);
  border: 1px solid rgba(148, 163, 184, 0.14);
}
.dk-payoff-svg {
  width: 100%;
  height: auto;
  display: block;
}
.dk-trigger-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.dk-trig-pill {
  font-size: 0.75rem;
  padding: 4px 8px;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(148, 163, 184, 0.18);
  color: #e2e8f0;
}

/* Column 3: GEX Battlefield Arena Map SVG */
.dk-info-arena {
  border-top: 3px solid #f5b73b !important;
  background: radial-gradient(circle at 82% 20%, rgba(52, 211, 153, 0.12), transparent 58%), rgba(8, 15, 29, 0.88) !important;
  margin: 0 !important;
}
.dk-arena-svg {
  width: 100%;
  height: auto;
  display: block;
  background: rgba(5, 10, 20, 0.68);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 10px;
  padding: 4px;
}
.dk-arena-pills {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}
.dk-apill {
  padding: 6px 9px;
  border-radius: 9px;
  background: rgba(15, 25, 44, 0.82);
  border: 1px solid rgba(148, 163, 184, 0.18);
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.dk-apill small {
  font-size: 0.7rem;
  color: var(--muted);
}
.dk-apill b {
  font-family: var(--mono);
  font-size: 0.98rem;
  font-weight: 800;
  color: #f8fafc;
}
.dk-apill.dk-call { border-left: 3px solid #34d399; }
.dk-apill.dk-call b { color: #34d399; }
.dk-apill.dk-put { border-left: 3px solid #fb7185; }
.dk-apill.dk-put b { color: #fb7185; }
.dk-apill.dk-zero { border-left: 3px solid #f5b73b; }
.dk-apill.dk-zero b { color: #fde68a; }
.dk-apill.dk-range { border-left: 3px solid #38bdf8; }
.dk-apill.dk-range b { color: #7dd3fc; }

.dk-drawers-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.dk-drawers-row > details.explain {
  margin-top: 0 !important;
}

@media (max-width: 1040px) {
  .dk-infographic-deck {
    grid-template-columns: 1fr !important;
  }
  .dte-top-ribbon {
    border-radius: 14px !important;
  }
  #deskSubTabs.desk-subtabs {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 580px) {
  .dk-signal-nodes,
  #deskSubTabs.desk-subtabs {
    grid-template-columns: 1fr !important;
  }
}

html[data-theme="light"] .dte-top-ribbon,
html[data-theme="light"] .dk-info-col,
html[data-theme="light"] .dk-sig-node,
html[data-theme="light"] .dk-apill,
html[data-theme="light"] .dk-payoff-viz,
html[data-theme="light"] .dk-arena-svg {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.15) !important;
}
html[data-theme="light"] .dk-verdict-copy .dk-dec-title {
  color: #0f172a !important;
}

/* ==========================================================================
   20. INFOGRAPHIC MOTION & EXIT DECISION CENTER V50 (2026-10-20)
   - Smooth SVG Animations (Flowing Payoff/Trajectory Lines, Pulsing Target Beacons,
     Score Ring Sweep)
   - Non-Overlapping Payoff & Ticket Hero Typography
   - Sub-Tab 3 (#deskView-calc): Interactive Exit & Hold Decision Center + Spacious
     2-Column Calculators & Wall/Expiry Grids
   ========================================================================== */

/* A. Smooth SVG Infographic Animations */
@keyframes svgFlowDash {
  from { stroke-dashoffset: 36; }
  to { stroke-dashoffset: 0; }
}
@keyframes svgPulseBeacon {
  0%, 100% {
    transform: scale(0.92);
    opacity: 0.85;
  }
  50% {
    transform: scale(1.22);
    opacity: 0.25;
  }
}
@keyframes svgRingSweep {
  from { stroke-dashoffset: 240; }
}
.svg-flow-line {
  stroke-dasharray: 8 6;
  animation: svgFlowDash 1.65s linear infinite;
}
.svg-pulse-ring {
  transform-box: fill-box;
  transform-origin: center;
  animation: svgPulseBeacon 2.2s ease-in-out infinite;
}
.svg-pulse-dot {
  transform-box: fill-box;
  transform-origin: center;
  animation: svgPulseBeacon 1.8s ease-in-out infinite;
}
.svg-ring-progress {
  animation: svgRingSweep 0.9s cubic-bezier(0.22, 1, 0.36, 1);
}
@media (prefers-reduced-motion: reduce) {
  .svg-flow-line,
  .svg-pulse-ring,
  .svg-pulse-dot,
  .svg-ring-progress {
    animation: none !important;
  }
}

/* B. Non-Overlapping Ticket Hero & Concise Signal Nodes in #deskToday */
.dk-ticket-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 4px 0 8px;
}
.dk-ticket-hero .dk-plan-strike {
  font-family: var(--font-head);
  font-size: 1.38rem;
  font-weight: 800;
  color: #f8fafc;
  letter-spacing: -0.01em;
}
.dk-ticket-sub {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(52, 211, 153, 0.14);
  border: 1px solid rgba(52, 211, 153, 0.35);
  color: #a7f3d0;
}
.dk-plan-put .dk-ticket-sub {
  background: rgba(251, 113, 133, 0.14);
  border-color: rgba(251, 113, 133, 0.35);
  color: #fecdd3;
}
.dk-signal-nodes {
  gap: 8px !important;
}
.dk-sig-node {
  padding: 7px 10px !important;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* C. Sub-Tab 3 (#deskView-calc): Interactive Exit & Hold Decision Helper */
.calc-decision-helper {
  padding: 20px 22px;
  border-radius: 16px;
  background: radial-gradient(circle at 12% 0%, rgba(245, 183, 59, 0.12), transparent 58%), rgba(9, 17, 32, 0.88);
  border: 1px solid rgba(245, 183, 59, 0.32);
  margin-bottom: 22px;
}
.cdh-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px 16px;
  margin-bottom: 16px;
}
.cdh-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.cdh-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}
.cdh-card {
  border-radius: 14px;
  padding: 16px 18px;
  background: rgba(7, 13, 25, 0.86);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-top: 3px solid #34d399;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}
.cdh-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.32);
}
.cdh-card.cdh-neg { border-top-color: #f5b73b; }
.cdh-card.cdh-time { border-top-color: #38bdf8; }
.cdh-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.cdh-tag {
  font-family: var(--mono);
  font-size: 0.74rem;
  color: var(--muted);
}
.cdh-title {
  font-family: var(--font-head);
  font-size: 1.04rem;
  font-weight: 800;
  color: #f8fafc;
  line-height: 1.3;
}
.cdh-svg {
  width: 100%;
  height: auto;
  display: block;
  background: rgba(4, 9, 18, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-radius: 10px;
  padding: 4px 6px;
}

/* D. Spacious 2-Column Calculator & Stats Grids inside #deskView-calc */
#deskView-calc .desk-calc-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
  gap: 22px !important;
  align-items: stretch;
  margin-top: 0 !important;
}
.desk-stats-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr);
  gap: 22px;
  align-items: stretch;
  margin-top: 22px;
}
#deskView-calc .sc-card,
#deskView-calc .lb-reach-card {
  height: 100%;
  margin: 0 !important;
  padding: 22px 24px !important;
  border-radius: 16px !important;
  background: rgba(10, 18, 34, 0.88) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-top: 3px solid #34d399 !important;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
#deskReach .lb-reach-card {
  border-top-color: #38bdf8 !important;
}
#deskWallStats .lb-reach-card {
  border-top-color: #f5b73b !important;
}
#deskExpiry .lb-reach-card {
  border-top-color: #a78bfa !important;
}

.sc-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.sc-head h3 {
  margin: 2px 0 4px !important;
  font-size: 1.2rem !important;
}
.sc-head .sc-sub {
  margin: 0 !important;
  font-size: 0.85rem !important;
  line-height: 1.5;
  color: var(--muted);
}

/* Plan Preset Bar */
.sc-plan-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border-radius: 11px;
  background: rgba(15, 28, 52, 0.72);
  border: 1px solid rgba(96, 165, 250, 0.25);
}
.sc-plan-label {
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  color: #bae6fd;
}
.sc-plan-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 11px;
  border-radius: 999px;
  background: rgba(16, 185, 129, 0.14);
  border: 1px solid rgba(52, 211, 153, 0.42);
  color: #ecfdf5;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}
.sc-plan-pill:hover {
  transform: translateY(-1px);
  background: rgba(16, 185, 129, 0.26);
  border-color: #34d399;
}
.sc-plan-pill b {
  font-family: var(--mono);
  color: #fde68a;
}

/* Inputs & 2x2 Grid */
.sc-inputs,
.lb-form.lb-form-2x2 {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 0 !important;
}
.sc-inputs label,
.lb-form.lb-form-2x2 label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(6, 12, 24, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.18);
}
.sc-lbl {
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  color: #cbd5e1;
}
.sc-inputs input,
.lb-form.lb-form-2x2 input,
.lb-form.lb-form-2x2 select {
  font-family: var(--mono);
  font-size: 1.05rem;
  font-weight: 700;
  padding: 8px 11px;
  border-radius: 9px;
  border: 1px solid rgba(148, 163, 184, 0.32);
  background: #070e1c;
  color: #f8fafc;
}
.sc-pcts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px !important;
  margin: 2px 0 !important;
}
.sc-pct {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 9px 6px !important;
  border-radius: 11px !important;
}
.sc-pct small {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--muted);
}
.sc-pct.on small {
  color: #a7f3d0;
}

/* Hero Banner inside #deskSell */
.sc-main {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  padding: 14px 16px !important;
  border-radius: 13px !important;
  background: linear-gradient(145deg, rgba(16, 48, 40, 0.72), rgba(9, 22, 34, 0.9)) !important;
  border: 1px solid rgba(52, 211, 153, 0.42) !important;
  margin-bottom: 12px;
}
.sc-hero-left,
.sc-hero-right {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.sc-hero-right {
  border-left: 1px solid rgba(148, 163, 184, 0.22);
  padding-left: 14px;
}
.sc-main b {
  font-family: var(--mono) !important;
  font-size: 1.75rem !important;
  font-weight: 800 !important;
}
.sc-hero-note {
  font-size: 0.76rem;
  color: var(--muted);
}

/* Split-Exit Recommendation Box */
.sc-split-box {
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(15, 25, 44, 0.78);
  border: 1px solid rgba(245, 183, 59, 0.32);
  margin-bottom: 12px;
}
.sc-split-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}
.sc-split-head small {
  font-size: 0.75rem;
  color: var(--muted);
}
.sc-split-cols {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.sc-split-item {
  padding: 9px 11px;
  border-radius: 10px;
  background: rgba(7, 13, 25, 0.75);
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-left: 3px solid #34d399;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.sc-split-item.is-second {
  border-left-color: #f5b73b;
}
.sc-split-item small {
  font-size: 0.72rem;
  color: var(--muted);
}
.sc-split-item b {
  font-family: var(--mono);
  font-size: 0.96rem;
  color: #f8fafc;
}
.sc-split-item span {
  font-size: 0.76rem;
  color: #cbd5e1;
}
.sc-split-single {
  margin: 0;
  font-size: 0.84rem;
  color: #e2e8f0;
}

.sc-tier-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px !important;
  margin: 12px 0 !important;
}
.sc-risk-strip {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 14px;
  border-radius: 11px;
  background: rgba(7, 13, 25, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.18);
  font-size: 0.82rem;
}

/* Reach Feasibility Banner & Gauge inside #deskReach */
.lb-verdict-banner {
  padding: 14px 16px;
  border-radius: 13px;
  background: rgba(13, 25, 45, 0.85);
  border: 1px solid rgba(96, 165, 250, 0.32);
  border-left: 4px solid #38bdf8;
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.lb-verdict-banner.is-good {
  border-color: rgba(52, 211, 153, 0.4);
  border-left-color: #10b981;
  background: linear-gradient(145deg, rgba(16, 48, 40, 0.65), rgba(9, 20, 34, 0.9));
}
.lb-verdict-banner.is-warn {
  border-color: rgba(245, 183, 59, 0.4);
  border-left-color: #f5b73b;
  background: linear-gradient(145deg, rgba(48, 36, 14, 0.62), rgba(9, 20, 34, 0.9));
}
.lb-verdict-banner.is-bad {
  border-color: rgba(251, 113, 133, 0.4);
  border-left-color: #f43f5e;
  background: linear-gradient(145deg, rgba(48, 18, 28, 0.62), rgba(9, 20, 34, 0.9));
}
.lb-vb-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
}
.lb-vb-top small {
  display: block;
  font-size: 0.75rem;
  color: var(--muted);
}
.lb-vb-top b {
  font-family: var(--font-head);
  font-size: 1.08rem;
  font-weight: 800;
  color: #f8fafc;
}
.lb-reach-svg {
  width: 100%;
  height: auto;
  display: block;
}
.lb-reach-kpis {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

/* Wall Stats & Expiry Table Spacing */
.ws-kpi-row {
  margin: 4px 0 12px !important;
  gap: 12px !important;
}
.ws-table .pt-h,
.ws-table .pt-r {
  padding: 9px 10px !important;
  align-items: center;
}
.ws-mini-bar {
  display: inline-block;
  width: 44px;
  height: 6px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.2);
  overflow: hidden;
  vertical-align: middle;
  margin-left: 6px;
}
.ws-mini-bar u {
  display: block;
  height: 100%;
  background: #34d399;
  border-radius: 999px;
}
#deskExpiry .ex-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
#deskExpiry .ex-r {
  padding: 9px 12px;
  border-radius: 10px;
  background: rgba(6, 12, 24, 0.6);
  border: 1px solid rgba(148, 163, 184, 0.15);
}

@media (max-width: 1040px) {
  .cdh-grid,
  #deskView-calc .desk-calc-grid,
  .desk-stats-grid,
  .lb-reach-kpis {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  .sc-inputs,
  .lb-form.lb-form-2x2,
  .sc-main,
  .sc-split-cols {
    grid-template-columns: 1fr !important;
  }
  .sc-hero-right {
    border-left: 0;
    border-top: 1px solid rgba(148, 163, 184, 0.2);
    padding-left: 0;
    padding-top: 10px;
  }
}

html[data-theme="light"] .calc-decision-helper,
html[data-theme="light"] .cdh-card,
html[data-theme="light"] #deskView-calc .sc-card,
html[data-theme="light"] #deskView-calc .lb-reach-card,
html[data-theme="light"] .sc-plan-bar,
html[data-theme="light"] .sc-inputs label,
html[data-theme="light"] .lb-form.lb-form-2x2 label,
html[data-theme="light"] .sc-split-box,
html[data-theme="light"] .sc-split-item,
html[data-theme="light"] .lb-verdict-banner,
html[data-theme="light"] #deskExpiry .ex-r {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.15) !important;
}
html[data-theme="light"] .cdh-title,
html[data-theme="light"] .lb-vb-top b,
html[data-theme="light"] .dk-ticket-hero .dk-plan-strike {
  color: #0f172a !important;
}









/* ==========================================================================
   21. GEX KINETIC COMMAND DECK & BENTO CONCENTRATION (V53 — UNIFIED BOX FAMILY WITH MARKET & TRADE DESK)
   ========================================================================== */
#panel-gex .gx-zone {
  margin-bottom: 22px;
}

/* 1. Top Control Bar (.gx-top) -> Same Command Box as .mk-status & .desk-mini-plan */
#panel-gex .gx-top {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px 18px !important;
  padding: 14px 20px !important;
  margin: 0 0 16px !important;
  border-radius: 16px !important;
  background: linear-gradient(90deg, rgba(226, 201, 143, 0.13), rgba(13, 23, 42, 0.88) 75%) !important;
  border: 1px solid rgba(226, 201, 143, 0.36) !important;
  border-left: 4px solid var(--gold) !important;
  box-shadow: 0 10px 26px rgba(2, 6, 18, 0.38) !important;
}
#panel-gex .gx-meta {
  order: 0 !important;
  width: auto !important;
  flex: 1 1 280px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

/* 2. Sub-Tab Bar (.gx-sec-tabs.desk-subtabs) -> Exact 4-Column Segmented Pill Dock as #deskSubTabs */
#panel-gex .gx-sec-tabs.desk-subtabs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px !important;
  padding: 6px !important;
  margin: 0 0 20px !important;
  border-radius: 16px !important;
  background: rgba(7, 13, 25, 0.82) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab {
  border: 1px solid transparent !important;
  background: transparent !important;
  border-radius: 11px !important;
  padding: 10px 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-align: left !important;
  cursor: pointer !important;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important;
}
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  transform: translateY(-1px);
}
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(30, 58, 138, 0.65), rgba(15, 29, 58, 0.92)) !important;
  border-color: rgba(245, 183, 59, 0.55) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

/* 3. Outer Hero Shell (.gx-hero-shell) & Section Cards (.gx-card) -> Exact Zone-1 Spotlight Smoked Glass + 3px Colored Top Bezel */
#panel-gex .gx-hero-shell,
#panel-gex .gx-card {
  background: var(--zone1-bg) !important;
  border: 1px solid rgba(226, 201, 143, 0.36) !important;
  border-top: 3px solid var(--gold) !important;
  border-radius: 18px !important;
  padding: 22px 24px !important;
  margin-bottom: 22px !important;
  box-shadow: 0 14px 36px rgba(2, 6, 18, 0.48) !important;
}
#panel-gex .gx-card.gx-card-call {
  border-color: rgba(52, 211, 153, 0.36) !important;
  border-top: 3px solid #34d399 !important;
}
#panel-gex .gx-card.gx-card-sky {
  border-color: rgba(96, 165, 250, 0.36) !important;
  border-top: 3px solid #60a5fa !important;
  background: radial-gradient(ellipse at 0% 0%, rgba(96, 165, 250, 0.12), transparent 65%), linear-gradient(155deg, rgba(16, 28, 50, 0.96) 0%, rgba(9, 16, 30, 0.98) 100%) !important;
}
#panel-gex .gx-card.gx-card-gold {
  border-color: rgba(226, 201, 143, 0.38) !important;
  border-top: 3px solid var(--gold) !important;
}
#panel-gex .gx-head {
  margin-bottom: 14px;
}
#panel-gex .gx-head-main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  width: 100%;
}
#panel-gex .gx-title {
  margin: 0;
  font-size: 1.12rem;
  font-weight: 800;
  line-height: 1.35;
}
#panel-gex .gx-card-guide,
#panel-gex .gx-wall2-toggle,
#panel-gex .gx-ratio-toggle,
#panel-gex .gx-sig-toggle {
  margin: 4px 0 0;
}

/* 4. 3-Column Hero Deck (.gx-hero-deck) -> Exact .dk-infographic-deck + .dk-info-col Style */
#panel-gex .gx-hero-deck {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin: 14px 0 18px;
}
#panel-gex .gx-hcard {
  border-radius: 14px !important;
  padding: 18px 20px !important;
  background: rgba(8, 15, 29, 0.86) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-top: 3px solid #60a5fa !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 12px !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 10px 26px rgba(2, 6, 23, 0.36) !important;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease !important;
}
#panel-gex .gx-hcard.is-pos {
  border-top: 3px solid #10b981 !important;
  border-color: rgba(52, 211, 153, 0.38) !important;
  background: radial-gradient(circle at 18% 22%, rgba(16, 185, 129, 0.16), transparent 62%), rgba(8, 15, 29, 0.9) !important;
}
#panel-gex .gx-hcard.is-neg {
  border-top: 3px solid #f43f5e !important;
  border-color: rgba(251, 113, 133, 0.42) !important;
  background: radial-gradient(circle at 18% 22%, rgba(244, 63, 94, 0.16), transparent 62%), rgba(8, 15, 29, 0.9) !important;
}
#panel-gex .gx-hcard.is-tug {
  border-top: 3px solid #60a5fa !important;
  border-color: rgba(96, 165, 250, 0.36) !important;
  background: radial-gradient(circle at 50% 18%, rgba(96, 165, 250, 0.14), transparent 62%), rgba(8, 15, 29, 0.9) !important;
}
#panel-gex .gx-hcard.dk-info-arena {
  border-top: 3px solid #f5b73b !important;
  border-color: rgba(245, 183, 59, 0.38) !important;
  background: radial-gradient(circle at 82% 20%, rgba(52, 211, 153, 0.14), transparent 58%), rgba(8, 15, 29, 0.9) !important;
}
#panel-gex .gx-hcard:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.38), 0 0 0 1px rgba(245, 183, 59, 0.28) !important;
}
.gx-hcard-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.gx-hcard-title {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1.06rem;
  font-weight: 800;
  color: #f8fafc;
  line-height: 1.35;
}
.gx-hero-svg {
  width: 100%;
  height: auto;
  max-height: 96px;
  display: block;
  background: rgba(5, 10, 20, 0.68);
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 12px;
  padding: 6px 8px;
  overflow: visible;
}

/* 5. Traffic-Light Wall Plates (.gx-summary .gx-stat, .gx-stats .gx-stat, .gx-cs-head .gx-stat) -> Exact Match with #mkLevels & Trade Desk .dk-lv */
#panel-gex .gx-summary {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(205px, 1fr)) !important;
  gap: 14px !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
  border: 0 !important;
  background: none !important;
}
#panel-gex .gx-stats {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  padding: 8px 0 !important;
  border: 0 !important;
  background: none !important;
}
#panel-gex .gx-stats.gx-stats-3 {
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)) !important;
  gap: 10px !important;
  margin: 0 0 14px !important;
}
#panel-gex .gx-card,
#panel-gex .gx-hcard,
#panel-gex .gx-summary .gx-stat,
#panel-gex .gx-stats .gx-stat,
#panel-gex .gx-cs-head .gx-stat,
#panel-gex .gw-list.gw-bento-list .gw-row,
#panel-gex .gx-sig {
  min-width: 0 !important;
  box-sizing: border-box !important;
}
#panel-gex .gx-summary .gx-stat,
#panel-gex .gx-stats .gx-stat,
#panel-gex .gx-cs-head .gx-stat {
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-left: 4px solid var(--gold) !important;
  border-radius: 14px !important;
  padding: 14px 16px !important;
  background: linear-gradient(145deg, rgba(28, 36, 54, 0.86), rgba(11, 18, 32, 0.92)) !important;
  text-align: left !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  position: relative !important;
  overflow: hidden !important;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease !important;
}
#panel-gex .gx-summary .gx-stat span,
#panel-gex .gx-stats .gx-stat span {
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  line-height: 1.4 !important;
}
#panel-gex .gx-stat.dk-call {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.9), rgba(11, 25, 24, 0.92)) !important;
  border-color: rgba(52, 211, 153, 0.42) !important;
  border-left: 4px solid #34d399 !important;
}
#panel-gex .gx-stat.dk-put {
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.9), rgba(26, 14, 22, 0.92)) !important;
  border-color: rgba(251, 113, 133, 0.42) !important;
  border-left: 4px solid #fb7185 !important;
}
#panel-gex .gx-stat.dk-zero {
  background: linear-gradient(145deg, rgba(20, 36, 58, 0.9), rgba(12, 22, 38, 0.92)) !important;
  border-color: rgba(96, 165, 250, 0.42) !important;
  border-left: 4px solid #60a5fa !important;
}
#panel-gex .gx-stat.dk-range {
  background: linear-gradient(145deg, rgba(42, 34, 18, 0.86), rgba(14, 20, 34, 0.92)) !important;
  border-color: rgba(226, 201, 143, 0.42) !important;
  border-left: 4px solid var(--gold) !important;
}
#panel-gex .gx-summary .gx-stat:hover,
#panel-gex .gx-stats .gx-stat:hover,
#panel-gex .gw-list.gw-bento-list .gw-row:hover,
#panel-gex .gx-sig:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(245, 183, 59, 0.28) !important;
}

#panel-gex .gx-cs-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
#panel-gex .gx-spread {
  display: grid;
  grid-template-columns: 1.35fr 1fr;
  gap: 22px;
  margin: 0 0 22px;
  align-items: start;
}
#panel-gex .gx-spread > .gx-card {
  margin-bottom: 0 !important;
}
#panel-gex .gx-spread .gx-svg {
  max-height: 280px !important;
  width: 100% !important;
  display: block;
}
#panel-gex .gx-research {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px !important;
  align-items: start !important;
}
#panel-gex .gx-research > .gx-card {
  margin-bottom: 0 !important;
}
#panel-gex .gx-research > .gx-card:nth-child(3) {
  grid-column: 1 / -1;
}
#panel-gex .gx-research .gx-svg {
  max-height: 220px !important;
  width: 100% !important;
  display: block;
}

/* 6. Concentration Banner & Bento Strike Cards (.gw-conc-banner & .gw-row) */
.gw-conc-banner {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 16px 18px;
  margin-bottom: 18px;
  background: rgba(8, 14, 26, 0.78);
  border: 1px solid rgba(226, 201, 143, 0.28);
  border-radius: 14px;
}
.gw-conc-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.gw-conc-stat {
  padding: 12px 15px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-left: 4px solid var(--gold) !important;
  background: linear-gradient(145deg, rgba(28, 36, 54, 0.86), rgba(11, 18, 32, 0.92)) !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.gw-conc-stat.dk-call {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.9), rgba(11, 25, 24, 0.92)) !important;
  border-color: rgba(52, 211, 153, 0.42) !important;
  border-left: 4px solid #34d399 !important;
}
.gw-conc-stat.dk-put {
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.9), rgba(26, 14, 22, 0.92)) !important;
  border-color: rgba(251, 113, 133, 0.42) !important;
  border-left: 4px solid #fb7185 !important;
}
.gw-conc-stat.dk-zero {
  background: linear-gradient(145deg, rgba(20, 36, 58, 0.9), rgba(12, 22, 38, 0.92)) !important;
  border-color: rgba(96, 165, 250, 0.42) !important;
  border-left: 4px solid #60a5fa !important;
}
.gw-conc-stat.dk-range {
  background: linear-gradient(145deg, rgba(42, 34, 18, 0.86), rgba(14, 20, 34, 0.92)) !important;
  border-color: rgba(226, 201, 143, 0.42) !important;
  border-left: 4px solid var(--gold) !important;
}
.gw-conc-stat small {
  display: block;
  font-size: 0.75rem;
  color: #cbd5e1;
  font-weight: 700;
}
.gw-conc-stat b {
  font-family: var(--font-head);
  font-size: 1.12rem;
  font-weight: 800;
  color: #f8fafc;
  line-height: 1.3;
}
.gw-conc-inline {
  font-size: 0.86rem;
  font-weight: 600;
  color: #cbd5e1;
}
.gw-conc-sub {
  display: block;
  font-size: 0.78rem;
  color: #94a3b8;
  line-height: 1.45;
  white-space: normal;
  overflow-wrap: anywhere;
}
.gw-conc-bars-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.gw-conc-bar-row {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
}
.gw-cbar-lbl {
  font-family: var(--font-body);
  font-size: 0.75rem;
  font-weight: 700;
  color: #cbd5e1;
}
.gw-conc-bar {
  display: flex;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(148, 163, 184, 0.16);
  gap: 3px;
}
.gw-conc-bar i {
  display: block;
  height: 100%;
}
.gw-conc-bar i.gw-call { background: #34d399; }
.gw-conc-bar i.gw-put { background: #fb7185; }
.gw-conc-bar i.gw-oi-seg { background: linear-gradient(90deg, #38bdf8, #818cf8); }

#panel-gex .gw-list.gw-bento-list {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px 14px !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  list-style: none !important;
}
#panel-gex .gw-list.gw-bento-list .gw-row {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 7px !important;
  border-radius: 13px !important;
  padding: 12px 13px !important;
  position: relative !important;
  overflow: hidden !important;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease !important;
}
#panel-gex .gw-list.gw-bento-list .gw-row.dk-call {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.82), rgba(10, 20, 24, 0.9)) !important;
  border: 1px solid rgba(52, 211, 153, 0.36) !important;
  border-left: 4px solid #34d399 !important;
}
#panel-gex .gw-list.gw-bento-list .gw-row.dk-put {
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.82), rgba(20, 12, 22, 0.9)) !important;
  border: 1px solid rgba(251, 113, 133, 0.36) !important;
  border-left: 4px solid #fb7185 !important;
}
#panel-gex .gw-row-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 6px 8px;
}
#panel-gex .gw-rank {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 34px !important;
  height: 28px !important;
  padding: 0 8px !important;
  border-radius: 8px !important;
  font-family: var(--font-head) !important;
  font-size: 0.94rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em !important;
  line-height: 1 !important;
  color: #f8fafc !important;
  background: rgba(15, 23, 42, 0.88) !important;
  border: 1.5px solid rgba(148, 163, 184, 0.5) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35) !important;
  flex-shrink: 0 !important;
}
#panel-gex .gw-rank.gw-rank-top {
  color: #fef08a !important;
  background: linear-gradient(135deg, rgba(245, 183, 59, 0.34), rgba(180, 120, 28, 0.24)) !important;
  border-color: rgba(250, 204, 21, 0.75) !important;
  box-shadow: 0 0 12px rgba(245, 183, 59, 0.25) !important;
}
#panel-gex .gw-rank.gw-rank-1 {
  color: #090d16 !important;
  background: linear-gradient(135deg, #fef08a 0%, #f5b73b 55%, #d97706 100%) !important;
  border-color: #fef9c3 !important;
  box-shadow: 0 0 14px rgba(245, 183, 59, 0.48) !important;
}
#panel-gex .gw-row-top .gw-k {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  font-family: var(--font-head);
  font-size: 0.96rem;
  font-weight: 800;
  color: #f8fafc;
}
#panel-gex .gw-row-top .gw-pct {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
  text-align: right;
  font-family: var(--font-head);
  font-size: 0.9rem;
  font-weight: 800;
}
.gw-oi-pill {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.7rem;
  font-weight: 700;
  color: #bae6fd;
  background: rgba(56, 189, 248, 0.14);
  border: 1px solid rgba(56, 189, 248, 0.32);
}
.gw-dual-bars {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}
#panel-gex .gw-list.gw-bento-list .gw-bar {
  width: 100%;
  height: 7px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.14);
  overflow: hidden;
  display: block;
}
#panel-gex .gw-list.gw-bento-list .gw-bar.gw-bar-oi {
  height: 5px;
}
#panel-gex .gw-list.gw-bento-list .gw-bar i.gw-oi-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #38bdf8, #818cf8);
}
#panel-gex .gw-row-sub {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 4px 8px;
  font-size: 0.74rem;
  color: #94a3b8;
}
#panel-gex .gw-row-sub em {
  font-style: normal;
  color: #cbd5e1;
}

/* 7. Signals Bento Cards (.gx-signals & .gx-sig) -> Exact .dk-lv Wall Plate Box Family */
#panel-gex .gx-signals {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 16px !important;
}
#panel-gex .gx-sig {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 10px !important;
  border-radius: 14px !important;
  padding: 16px 18px !important;
  position: relative !important;
  overflow: hidden !important;
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease !important;
}
#panel-gex .gx-sig.dk-call {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.88), rgba(11, 25, 24, 0.92)) !important;
  border: 1px solid rgba(52, 211, 153, 0.4) !important;
  border-left: 4px solid #34d399 !important;
}
#panel-gex .gx-sig.dk-put {
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.88), rgba(26, 14, 22, 0.92)) !important;
  border: 1px solid rgba(251, 113, 133, 0.4) !important;
  border-left: 4px solid #fb7185 !important;
}
#panel-gex .gx-sig.dk-zero {
  background: linear-gradient(145deg, rgba(20, 36, 58, 0.88), rgba(12, 22, 38, 0.92)) !important;
  border: 1px solid rgba(96, 165, 250, 0.4) !important;
  border-left: 4px solid #60a5fa !important;
}
#panel-gex .gx-sig.dk-range {
  background: linear-gradient(145deg, rgba(42, 34, 18, 0.86), rgba(14, 20, 34, 0.92)) !important;
  border: 1px solid rgba(226, 201, 143, 0.4) !important;
  border-left: 4px solid var(--gold) !important;
}
#panel-gex .gx-sig-top b {
  font-family: var(--font-head);
  font-size: 0.96rem;
  font-weight: 800;
  color: #f8fafc;
}
#panel-gex .gx-sig .gx-at {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  text-align: left !important;
  line-height: 1.45 !important;
  font-family: var(--font-head);
  font-size: 0.82rem;
  font-weight: 700;
  color: #e2e8f0;
  background: rgba(6, 11, 22, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-radius: 8px;
  padding: 6px 10px !important;
}
.gx-sig-svg {
  width: 100%;
  height: 38px;
  display: block;
  background: rgba(5, 10, 20, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-radius: 9px;
  padding: 3px 6px;
}

@media (max-width: 1080px) {
  #panel-gex .gx-sec-tabs.desk-subtabs,
  #panel-gex .gx-summary,
  #panel-gex .gx-stats,
  #panel-gex .gw-list.gw-bento-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #panel-gex .gx-hero-deck,
  #panel-gex .gx-spread,
  #panel-gex .gx-research,
  .gw-conc-grid {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  #panel-gex .gx-sec-tabs.desk-subtabs,
  #panel-gex .gx-summary,
  #panel-gex .gx-stats,
  #panel-gex .gx-stats.gx-stats-3,
  #panel-gex .gw-list.gw-bento-list,
  .gw-conc-banner {
    grid-template-columns: 1fr !important;
  }
  .gw-conc-bar-row {
    grid-template-columns: 1fr !important;
    gap: 4px;
  }
}

html[data-theme="light"] #panel-gex .gx-top,
html[data-theme="light"] #panel-gex .gx-hero-shell,
html[data-theme="light"] #panel-gex .gx-card,
html[data-theme="light"] #panel-gex .gx-sec-tabs.desk-subtabs,
html[data-theme="light"] #panel-gex .gx-hcard,
html[data-theme="light"] #panel-gex .gx-summary .gx-stat,
html[data-theme="light"] #panel-gex .gx-stats .gx-stat,
html[data-theme="light"] #panel-gex .gx-cs-head .gx-stat,
html[data-theme="light"] .gw-conc-banner,
html[data-theme="light"] .gw-conc-stat,
html[data-theme="light"] #panel-gex .gw-list.gw-bento-list .gw-row,
html[data-theme="light"] #panel-gex .gx-sig {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
}
html[data-theme="light"] #panel-gex .gx-sig .gx-at {
  background: #f8fafc !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] .gx-hcard-title,
html[data-theme="light"] .gw-conc-stat b,
html[data-theme="light"] #panel-gex .gw-row-top .gw-k,
html[data-theme="light"] #panel-gex .gx-sig-top b {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-gex .gw-rank:not(.gw-rank-1) {
  background: #0f172a !important;
  color: #ffffff !important;
  border-color: #334155 !important;
}

/* ==========================================================================
   22. CHART PANEL (#panel-chart) — Bezel & Accent-Bar Bento + Confluence Deck
   ========================================================================== */
#panel-chart .ch-sec-tabs.desk-subtabs {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 8px !important;
  background: rgba(8, 15, 29, 0.85) !important;
  border: 1px solid rgba(226, 201, 143, 0.24) !important;
  border-radius: 16px !important;
  margin-bottom: 18px !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28) !important;
}

#panel-chart .gx-top {
  background: radial-gradient(circle at 100% 0%, rgba(226, 201, 143, 0.1), transparent 48%), var(--zone1-bg) !important;
  border: 1px solid rgba(226, 201, 143, 0.26) !important;
  border-left: 4px solid var(--gold) !important;
  border-radius: 16px !important;
  padding: 16px 20px !important;
  margin-bottom: 18px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 14px !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.24) !important;
}

/* 1-Click Trading View Presets Bar */
.ch-preset-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding-bottom: 12px;
  border-bottom: 1px dashed rgba(226, 201, 143, 0.2);
}
.ch-preset-lbl {
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 800;
  color: var(--gold);
  letter-spacing: 0.03em;
  margin-right: 4px;
}
.ch-preset-btn,
.ch-refresh-btn {
  appearance: none;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: rgba(15, 25, 44, 0.86);
  color: #e2e8f0;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  padding: 6px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}
.ch-preset-btn:hover,
.ch-refresh-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(226, 201, 143, 0.55);
  color: #ffffff;
}
.ch-preset-btn.is-active {
  background: linear-gradient(135deg, rgba(245, 183, 59, 0.24), rgba(226, 201, 143, 0.12));
  border-color: var(--gold);
  color: #fde68a;
  box-shadow: 0 4px 14px rgba(245, 183, 59, 0.18);
}
.ch-refresh-btn {
  margin-left: auto;
  border-color: rgba(96, 165, 250, 0.42);
  color: #93c5fd;
}

#panel-chart .gx-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
#panel-chart .gx-meta {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 10px !important;
  padding-top: 10px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}
#panel-chart #chTiming {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(195px, 1fr)) !important;
  gap: 10px !important;
  width: 100%;
}
#panel-chart #chTiming .ch-ext-note {
  grid-column: 1 / -1;
}
#panel-chart .ch-tbox.dk-lv {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 10px 13px !important;
  border-radius: 12px !important;
  min-width: 0 !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
#panel-chart .ch-tbox.dk-lv:hover {
  transform: translateY(-2px);
}
#panel-chart .ch-tbox.dk-call {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.88), rgba(11, 25, 24, 0.92)) !important;
  border: 1px solid rgba(52, 211, 153, 0.4) !important;
  border-left: 4px solid #34d399 !important;
}
#panel-chart .ch-tbox.dk-put {
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.88), rgba(26, 14, 22, 0.92)) !important;
  border: 1px solid rgba(251, 113, 133, 0.4) !important;
  border-left: 4px solid #fb7185 !important;
}
#panel-chart .ch-tbox.dk-range {
  background: linear-gradient(145deg, rgba(42, 34, 18, 0.86), rgba(14, 20, 34, 0.92)) !important;
  border: 1px solid rgba(226, 201, 143, 0.42) !important;
  border-left: 4px solid var(--gold) !important;
}
#panel-chart .ch-tbox.dk-zero {
  background: linear-gradient(145deg, rgba(20, 36, 58, 0.88), rgba(12, 22, 38, 0.92)) !important;
  border: 1px solid rgba(96, 165, 250, 0.36) !important;
  border-left: 4px solid #60a5fa !important;
}
.ch-live-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

/* Confluence & Wall Corridor 2-Column Deck above Chart */
.ch-confluence-deck {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}
.ch-conf-card {
  border-radius: 16px;
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ch-conf-card:hover {
  transform: translateY(-2px);
}
.ch-conf-card.dk-call {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.9), rgba(10, 22, 24, 0.94));
  border: 1px solid rgba(52, 211, 153, 0.42);
  border-left: 4px solid #34d399;
}
.ch-conf-card.dk-put {
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.9), rgba(22, 12, 20, 0.94));
  border: 1px solid rgba(251, 113, 133, 0.42);
  border-left: 4px solid #fb7185;
}
.ch-conf-card.dk-range {
  background: linear-gradient(145deg, rgba(42, 34, 18, 0.88), rgba(14, 20, 34, 0.94));
  border: 1px solid rgba(226, 201, 143, 0.42);
  border-left: 4px solid var(--gold);
}
.ch-conf-card.dk-zero {
  background: linear-gradient(145deg, rgba(20, 36, 58, 0.9), rgba(11, 20, 36, 0.94));
  border: 1px solid rgba(96, 165, 250, 0.4);
  border-left: 4px solid #60a5fa;
}
.ch-conf-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.ch-conf-eyebrow {
  display: block;
  font-family: var(--font-head);
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--muted);
  letter-spacing: 0.03em;
  margin-bottom: 2px;
}
.ch-conf-title {
  font-family: var(--font-head);
  font-size: 1.02rem;
  font-weight: 800;
  color: #f8fafc;
  line-height: 1.3;
}
.ch-conf-score {
  font-family: var(--mono);
  font-size: 0.78rem;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(6, 11, 22, 0.75);
  border: 1px solid rgba(226, 201, 143, 0.35);
  color: #fde68a;
  white-space: nowrap;
}
.ch-conf-pills {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.ch-cpill {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 7px 9px;
  border-radius: 10px;
  background: rgba(6, 11, 22, 0.68);
  border: 1px solid rgba(148, 163, 184, 0.2);
}
.ch-cpill.is-up {
  border-color: rgba(52, 211, 153, 0.38);
  background: rgba(16, 40, 34, 0.55);
}
.ch-cpill.is-dn {
  border-color: rgba(251, 113, 133, 0.38);
  background: rgba(44, 18, 28, 0.55);
}
.ch-cpill.is-warn {
  border-color: rgba(245, 183, 59, 0.42);
  background: rgba(44, 33, 14, 0.55);
}
.ch-cpill small {
  font-size: 0.68rem;
  color: var(--muted);
}
.ch-cpill b {
  font-family: var(--font-head);
  font-size: 0.8rem;
  font-weight: 800;
  color: #f8fafc;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ch-conf-sub {
  margin: 0;
  font-size: 0.8rem;
  color: #cbd5e1;
  line-height: 1.4;
}

/* Corridor Meter inside Card 2 */
.ch-corridor-meter {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(6, 11, 22, 0.68);
  border: 1px solid rgba(148, 163, 184, 0.18);
}
.ch-cm-labels {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  font-family: var(--mono);
  font-size: 0.74rem;
  font-weight: 700;
  flex-wrap: wrap;
}
.ch-cm-track {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.22);
  border: 1px solid rgba(148, 163, 184, 0.28);
  margin: 6px 0 4px;
}
.ch-cm-zg {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 3px;
  border-radius: 2px;
  background: #f5b73b;
  box-shadow: 0 0 8px rgba(245, 183, 59, 0.9);
}
.ch-cm-dot {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #ffffff;
  border: 3px solid #38bdf8;
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.9);
}
.ch-conf-card.dk-call .ch-cm-dot {
  border-color: #34d399;
  box-shadow: 0 0 10px rgba(52, 211, 153, 0.9);
}
.ch-conf-card.dk-put .ch-cm-dot {
  border-color: #fb7185;
  box-shadow: 0 0 10px rgba(251, 113, 133, 0.9);
}
.ch-cm-dot span {
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--mono);
  font-size: 0.68rem;
  font-weight: 800;
  font-style: normal;
  color: #f8fafc;
  background: rgba(15, 23, 42, 0.92);
  padding: 1px 5px;
  border-radius: 4px;
  border: 1px solid rgba(56, 189, 248, 0.45);
  white-space: nowrap;
}
.ch-fuel-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.78rem;
  color: #cbd5e1;
}
.ch-fuel-badge {
  font-family: var(--font-head);
  font-size: 0.75rem;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(16, 40, 34, 0.7);
  border: 1px solid rgba(52, 211, 153, 0.38);
  color: #6ee7b7;
}
.ch-fuel-badge.is-warn {
  background: rgba(44, 33, 14, 0.75);
  border-color: rgba(245, 183, 59, 0.45);
  color: #fde68a;
}

/* Outer Section Cards in #panel-chart — Top-Bezel Smoked Glass */
#panel-chart .gx-card, #panel-data .gx-card {
  background: radial-gradient(circle at 12% 0%, rgba(226, 201, 143, 0.08), transparent 55%), var(--zone1-bg) !important;
  border: 1px solid rgba(226, 201, 143, 0.22) !important;
  border-top: 3px solid var(--gold) !important;
  border-radius: 18px !important;
  padding: 20px 22px !important;
  margin-bottom: 18px !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.26) !important;
}
#panel-chart .gx-card.ch-bezel-emerald, #panel-data .gx-card.ch-bezel-emerald {
  border-top-color: #34d399 !important;
}
#panel-chart .gx-card.ch-bezel-sky, #panel-data .gx-card.ch-bezel-sky {
  border-top-color: #38bdf8 !important;
}

/* 8 Historical Stat Tiles — 4-Column Semantic Left-Bar Wall Plates */
#panel-chart .gx-stats {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  background: transparent !important;
  border: 0 !important;
  margin-bottom: 18px !important;
}
#panel-chart .gx-stats .gx-stat {
  border-radius: 14px !important;
  padding: 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 6px !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
#panel-chart .gx-stats .gx-stat:hover {
  transform: translateY(-2px);
}
#panel-chart .gx-stats .gx-stat.dk-call {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.88), rgba(11, 25, 24, 0.92)) !important;
  border: 1px solid rgba(52, 211, 153, 0.4) !important;
  border-left: 4px solid #34d399 !important;
}
#panel-chart .gx-stats .gx-stat.dk-put {
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.88), rgba(26, 14, 22, 0.92)) !important;
  border: 1px solid rgba(251, 113, 133, 0.4) !important;
  border-left: 4px solid #fb7185 !important;
}
#panel-chart .gx-stats .gx-stat.dk-range {
  background: linear-gradient(145deg, rgba(42, 34, 18, 0.86), rgba(14, 20, 34, 0.92)) !important;
  border: 1px solid rgba(226, 201, 143, 0.4) !important;
  border-left: 4px solid var(--gold) !important;
}
#panel-chart .gx-stats .gx-stat.dk-zero {
  background: linear-gradient(145deg, rgba(20, 36, 58, 0.88), rgba(12, 22, 38, 0.92)) !important;
  border: 1px solid rgba(96, 165, 250, 0.38) !important;
  border-left: 4px solid #60a5fa !important;
}
#panel-chart .gx-stats .gx-stat b {
  font-family: var(--mono);
  font-size: 1.32rem;
  font-weight: 800;
}

/* 5 Weekday Wall Plates */
#panel-chart .wk, #panel-data .wk {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
#panel-chart .wk-d, #panel-data .wk-d {
  border-radius: 14px !important;
  padding: 14px 15px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 8px !important;
  transition: transform 0.2s ease !important;
}
#panel-chart .wk-d:hover, #panel-data .wk-d:hover {
  transform: translateY(-2px);
}
#panel-chart .wk-d.dk-range, #panel-data .wk-d.dk-range {
  background: linear-gradient(145deg, rgba(42, 34, 18, 0.86), rgba(14, 20, 34, 0.92)) !important;
  border: 1px solid rgba(226, 201, 143, 0.4) !important;
  border-left: 4px solid var(--gold) !important;
}
#panel-chart .wk-d.dk-call, #panel-data .wk-d.dk-call {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.88), rgba(11, 25, 24, 0.92)) !important;
  border: 1px solid rgba(52, 211, 153, 0.4) !important;
  border-left: 4px solid #34d399 !important;
}
#panel-chart .wk-d.dk-zero, #panel-data .wk-d.dk-zero {
  background: linear-gradient(145deg, rgba(20, 36, 58, 0.88), rgba(12, 22, 38, 0.92)) !important;
  border: 1px solid rgba(96, 165, 250, 0.38) !important;
  border-left: 4px solid #60a5fa !important;
}
#panel-chart .wk-top, #panel-data .wk-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  flex-wrap: wrap;
}
#panel-chart .wk-v, #panel-data .wk-v {
  font-family: var(--mono);
  font-size: 1.3rem;
  font-weight: 800;
  color: #f8fafc;
}
#panel-chart .wk-bar, #panel-data .wk-bar {
  height: 6px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.2);
  overflow: hidden;
}
#panel-chart .wk-bar i, #panel-data .wk-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #38bdf8;
}
#panel-chart .wk-d.dk-range .wk-bar i, #panel-data .wk-d.dk-range .wk-bar i {
  background: #f5b73b;
}
#panel-chart .wk-d.dk-call .wk-bar i, #panel-data .wk-d.dk-call .wk-bar i {
  background: #34d399;
}

@media (max-width: 1080px) {
  .ch-confluence-deck,
  #panel-chart .gx-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #panel-chart .wk, #panel-data .wk {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 640px) {
  #panel-chart .ch-sec-tabs.desk-subtabs,
  .ch-confluence-deck,
  .ch-conf-pills,
  #panel-chart .gx-stats,
  #panel-chart .wk, #panel-data .wk {
    grid-template-columns: 1fr !important;
  }
}

html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs,
html[data-theme="light"] #panel-chart .gx-top,
html[data-theme="light"] #panel-chart .gx-card,
html[data-theme="light"] #panel-chart .ch-tbox.dk-lv,
html[data-theme="light"] .ch-conf-card,
html[data-theme="light"] .ch-cpill,
html[data-theme="light"] .ch-corridor-meter,
html[data-theme="light"] #panel-chart .gx-stats .gx-stat,
html[data-theme="light"] #panel-chart .wk-d, html[data-theme="light"] #panel-data .gx-card, html[data-theme="light"] #panel-data .wk-d {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
}
html[data-theme="light"] .ch-conf-title,
html[data-theme="light"] .ch-cpill b,
html[data-theme="light"] #panel-chart .wk-v, html[data-theme="light"] #panel-data .wk-v {
  color: #0f172a !important;
}

/* ==========================================================================
   23. ALL REMAINING TABS (#panel-setups, #panel-playbook, #panel-mytrades,
       #panel-lessons, #panel-library, #panel-tools) — Bezel & Accent-Bar Bento
   ========================================================================== */

/* Shared Semantic Left-Bar Wall Plate (.dk-lv) across all panels */
#panel-setups .dk-lv,
#panel-playbook .dk-lv,
#panel-mytrades .dk-lv,
#panel-lessons .dk-lv,
#panel-library .dk-lv,
#panel-tools .dk-lv,
#panel-trades .dk-lv,
#panel-review .dk-lv {
  border-radius: 14px !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-left: 4px solid var(--gold) !important;
  background: linear-gradient(145deg, rgba(28, 36, 54, 0.88), rgba(11, 18, 32, 0.94)) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.24) !important;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
}
#panel-setups .dk-lv.dk-call,
#panel-playbook .dk-lv.dk-call,
#panel-mytrades .dk-lv.dk-call,
#panel-lessons .dk-lv.dk-call,
#panel-library .dk-lv.dk-call,
#panel-tools .dk-lv.dk-call,
#panel-trades .dk-lv.dk-call,
#panel-review .dk-lv.dk-call {
  background: linear-gradient(145deg, rgba(19, 44, 38, 0.9), rgba(11, 25, 24, 0.94)) !important;
  border-color: rgba(52, 211, 153, 0.42) !important;
  border-left: 4px solid #34d399 !important;
}
#panel-setups .dk-lv.dk-put,
#panel-playbook .dk-lv.dk-put,
#panel-mytrades .dk-lv.dk-put,
#panel-lessons .dk-lv.dk-put,
#panel-library .dk-lv.dk-put,
#panel-tools .dk-lv.dk-put,
#panel-trades .dk-lv.dk-put,
#panel-review .dk-lv.dk-put {
  background: linear-gradient(145deg, rgba(46, 22, 34, 0.9), rgba(26, 14, 22, 0.94)) !important;
  border-color: rgba(251, 113, 133, 0.42) !important;
  border-left: 4px solid #fb7185 !important;
}
#panel-setups .dk-lv.dk-range,
#panel-playbook .dk-lv.dk-range,
#panel-mytrades .dk-lv.dk-range,
#panel-lessons .dk-lv.dk-range,
#panel-library .dk-lv.dk-range,
#panel-tools .dk-lv.dk-range,
#panel-trades .dk-lv.dk-range,
#panel-review .dk-lv.dk-range {
  background: linear-gradient(145deg, rgba(42, 34, 18, 0.88), rgba(14, 20, 34, 0.94)) !important;
  border-color: rgba(226, 201, 143, 0.42) !important;
  border-left: 4px solid var(--gold) !important;
}
#panel-setups .dk-lv.dk-zero,
#panel-playbook .dk-lv.dk-zero,
#panel-mytrades .dk-lv.dk-zero,
#panel-lessons .dk-lv.dk-zero,
#panel-library .dk-lv.dk-zero,
#panel-tools .dk-lv.dk-zero,
#panel-trades .dk-lv.dk-zero,
#panel-review .dk-lv.dk-zero {
  background: linear-gradient(145deg, rgba(20, 36, 58, 0.9), rgba(12, 22, 38, 0.94)) !important;
  border-color: rgba(96, 165, 250, 0.4) !important;
  border-left: 4px solid #60a5fa !important;
}

/* Shared Top-Bezel Smoked Glass Outer Shell (.gx-card) */
#panel-playbook .gx-card,
#panel-mytrades .gx-card,
#panel-lessons .gx-card,
#panel-trades .gx-card {
  background: radial-gradient(circle at 12% 0%, rgba(226, 201, 143, 0.08), transparent 55%), var(--zone1-bg) !important;
  border: 1px solid rgba(226, 201, 143, 0.24) !important;
  border-top: 3px solid var(--gold) !important;
  border-radius: 18px !important;
  padding: 20px 22px !important;
  margin-bottom: 18px !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28) !important;
}

/* 1. 🎯 SETUPS PANEL (#panel-setups) */
.setup-bento-card {
  text-align: left;
  padding: 18px 20px !important;
  display: flex;
  flex-direction: column;
}
.setup-bento-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(245, 183, 59, 0.32) !important;
}
.sbc-pills,
.lbc-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0;
}
.sbc-quick-box {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 9px 12px;
  margin: 6px 0 8px;
  border-radius: 10px;
  background: rgba(6, 11, 22, 0.68);
  border: 1px solid rgba(148, 163, 184, 0.18);
  font-size: 0.84rem;
  color: #e2e8f0;
  line-height: 1.45;
}
.sbc-qline {
  display: block;
}

/* 2. ☑️ PLAYBOOK CHECKLIST PANEL (#panel-playbook) */
#panel-playbook .pb-flow {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  flex-wrap: wrap !important;
}
#panel-playbook .pb-steps {
  flex: 1 1 540px;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
}
#panel-playbook .pb-arrow {
  display: none !important;
}
#panel-playbook .pb-step {
  padding: 12px 14px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 6px !important;
  text-align: left !important;
  cursor: pointer;
}
#panel-playbook .pb-step:hover {
  transform: translateY(-2px);
}
.pb-step-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  width: 100%;
}
.pb-step-pct {
  font-family: var(--mono);
  font-size: 0.78rem;
  font-weight: 800;
  color: #fde68a;
}
.pb-step-pct.up {
  color: #34d399;
}
/* Single neutral track + single semantic focus bar (impeccable SKILL.md rule) */
#panel-playbook .pb-mini {
  width: 100%;
  height: 6px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.2) !important;
  overflow: hidden;
  display: block;
}
#panel-playbook .pb-mini i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #f5b73b !important;
  transition: width 0.25s ease;
}
#panel-playbook .pb-mini i.is-full {
  background: #34d399 !important;
}
#panel-playbook .today-bar {
  padding: 14px 18px !important;
  margin-bottom: 18px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
}
#panel-playbook .phase.pb-phase-sky {
  border-top-color: #38bdf8 !important;
}
#panel-playbook .phase.pb-phase-emerald {
  border-top-color: #34d399 !important;
}
#panel-playbook .phase.pb-phase-gold {
  border-top-color: #f5b73b !important;
}
#panel-playbook .phase.pb-phase-crimson {
  border-top-color: #fb7185 !important;
}
#panel-playbook .rule {
  padding: 12px 15px !important;
  margin-bottom: 10px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
}
#panel-playbook .rule:last-child {
  margin-bottom: 0 !important;
}
#panel-playbook .rule:hover {
  transform: translateY(-2px);
}
#panel-playbook .rule.is-done .rule-text {
  color: #a7f3d0;
}

/* 3. 📝 MY TRADES PANEL (#panel-mytrades) */
#panel-mytrades .uj-kpis {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 18px !important;
}
#panel-mytrades .jstat {
  padding: 14px 16px !important;
}
#panel-mytrades .uj-live-bar {
  padding: 12px 16px !important;
  margin: 12px 0 !important;
}
#panel-mytrades .uj-item-card {
  padding: 16px 18px !important;
}
#panel-mytrades .uj-item-card:hover {
  transform: translateY(-2px);
}

/* 4. 💡 LESSONS PANEL (#panel-lessons & #macdGuide) */
#panel-lessons .mg-cards {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 12px 0 !important;
}
#panel-lessons .mg-card {
  padding: 16px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 8px !important;
}
#panel-lessons .mg-rule {
  padding: 14px 18px !important;
  margin: 14px 0 !important;
}
#panel-lessons .mg-frs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 10px 0 6px !important;
}
#panel-lessons .mg-fr {
  padding: 10px 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
#panel-lessons .mg-info {
  padding: 14px 16px !important;
  margin-top: 10px !important;
}
.lessons-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin: 22px 0 12px;
}
.lesson-bento-card {
  text-align: left;
  padding: 18px 20px !important;
}
.lesson-bento-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(245, 183, 59, 0.32) !important;
}

/* 5. 📚 LIBRARY PANEL (#panel-library) */
.panel-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.uj-add-drawer {
  padding: 0 !important;
  overflow: hidden;
  margin-bottom: 16px;
}
.uj-drawer-sum {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 20px;
  cursor: pointer;
  user-select: none;
}
.uj-drawer-sum::-webkit-details-marker {
  display: none;
}
.uj-sum-title {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.uj-sum-title b {
  font-family: var(--font-head);
  font-size: 1rem;
  color: #f8fafc;
}
.uj-drawer-body {
  padding: 0 20px 20px;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
}
.lib-kpi-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.lib-quick-bar[hidden] {
  display: none !important;
}
.lib-quick-bar {
  margin-bottom: 18px;
  padding: 18px 20px !important;
  border-radius: 18px !important;
  background: linear-gradient(165deg, rgba(16, 25, 44, 0.94) 0%, rgba(10, 16, 30, 0.98) 100%) !important;
  border: 1px solid rgba(245, 183, 59, 0.28) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 14px 32px rgba(0, 0, 0, 0.35) !important;
}
.lqb-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}
.lqb-kicker {
  display: inline-block;
  font-family: var(--font-head);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fde68a;
  margin-bottom: 3px;
}
.lqb-head h3 {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1.08rem;
  font-weight: 800;
  color: #f8fafc;
}
.lqb-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.95fr);
  gap: 18px;
  align-items: stretch;
}
.lqb-inputs {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.lqb-inputs .f-row {
  margin: 0;
}
.lqb-row-meta,
.lqb-row-playlist {
  display: grid;
  grid-template-columns: 1.3fr 0.9fr;
  gap: 10px;
}
.lqb-row-bottom {
  display: grid;
  grid-template-columns: 1.3fr 0.9fr;
  gap: 10px;
}
.lqb-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
}
.lqb-preview {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.lib-preview-empty {
  height: 100%;
  min-height: 195px;
  border: 1px dashed rgba(148, 163, 184, 0.32);
  border-radius: 14px;
  background: rgba(7, 12, 24, 0.55);
  padding: 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 8px;
}
.lib-preview-empty .lpe-icon {
  font-size: 2rem;
  line-height: 1;
}
.lib-preview-empty b {
  font-family: var(--font-head);
  font-size: 0.92rem;
  color: #f8fafc;
}
.lib-preview-empty p {
  margin: 4px 0 0;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.45;
}
.lib-preview-card {
  padding: 0 !important;
  overflow: hidden;
  border-radius: 14px !important;
  display: flex;
  flex-direction: column;
}
.lib-preview-body {
  padding: 12px 14px 14px;
}
.lib-preview-body .lpb-kicker {
  font-family: var(--font-head);
  font-size: 0.7rem;
  font-weight: 800;
  color: #fde68a;
  margin-bottom: 4px;
}
.lib-preview-body h4 {
  margin: 0 0 4px;
  font-family: var(--font-head);
  font-size: 0.96rem;
  font-weight: 800;
  color: #f8fafc;
  line-height: 1.35;
}
.lib-preview-body p {
  margin: 0;
  font-size: 0.82rem;
  color: #cbd5e1;
  line-height: 1.45;
}

.lib-bento-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 16px;
}
.lib-bento-card.lib-video-card {
  text-align: left;
  padding: 0 !important;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.lib-bento-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(245, 183, 59, 0.32) !important;
}
.lib-thumb-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #060b16;
  overflow: hidden;
  cursor: pointer;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}
.lib-thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.28s ease;
}
.lib-video-card:hover .lib-thumb-img {
  transform: scale(1.035);
}
.lib-thumb-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(4, 8, 16, 0.55) 0%, rgba(4, 8, 16, 0.12) 45%, rgba(4, 8, 16, 0.82) 100%);
  pointer-events: none;
}
.lib-thumb-top {
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  z-index: 2;
  pointer-events: none;
}
.lib-play-badge {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 15px;
  border-radius: 999px;
  background: rgba(10, 16, 30, 0.82);
  border: 1px solid rgba(245, 183, 59, 0.55);
  color: #fef3c7;
  font-family: var(--font-head);
  font-size: 0.82rem;
  font-weight: 800;
  cursor: pointer;
  backdrop-filter: blur(8px);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.48);
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}
.lib-thumb-wrap:hover .lib-play-badge {
  transform: translate(-50%, -50%) scale(1.06);
  background: rgba(245, 183, 59, 0.95);
  color: #090d16;
  border-color: #fde68a;
}
.lib-play-badge .lpb-tri {
  font-size: 0.78rem;
}
.lib-domain-pill {
  position: absolute;
  bottom: 9px;
  left: 10px;
  z-index: 2;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(8, 13, 24, 0.84);
  border: 1px solid rgba(148, 163, 184, 0.26);
  color: #e2e8f0;
  font-size: 0.74rem;
  font-weight: 700;
  max-width: calc(100% - 20px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.lib-thumb-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 50% 35%, rgba(56, 189, 248, 0.18), rgba(8, 13, 25, 0.95));
}
.ltf-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  color: #e2e8f0;
}
.ltf-center span {
  font-size: 1.8rem;
}
.ltf-center b {
  font-family: var(--font-head);
  font-size: 0.88rem;
}
.lib-inline-player {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
  border-bottom: 1px solid rgba(245, 183, 59, 0.35);
}
.lib-inline-player iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.lib-card-content {
  padding: 15px 18px 16px !important;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.lib-card-content h3 {
  margin: 0 0 6px;
  font-family: var(--font-head);
  font-size: 1.02rem;
  font-weight: 800;
  line-height: 1.38;
  color: #f8fafc;
}
.lib-take {
  margin: 4px 0 12px;
  font-size: 0.88rem;
  color: #cbd5e1;
  line-height: 1.5;
  flex: 1;
}
.lib-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  padding-top: 10px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}
.lib-foot-actions {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.lib-act-chip {
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid rgba(245, 183, 59, 0.42);
  background: rgba(245, 183, 59, 0.12);
  color: #fde68a;
  font-family: var(--font-head);
  font-size: 0.74rem;
  font-weight: 800;
  cursor: pointer;
}
.lib-act-chip:hover {
  background: rgba(245, 183, 59, 0.25);
}
.lib-act-link {
  font-size: 0.76rem;
  font-weight: 700;
  color: #38bdf8;
  text-decoration: none;
}
.lib-act-link:hover {
  text-decoration: underline;
}
.lib-modal-player {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 14px;
  overflow: hidden;
  background: #000;
  border: 1px solid rgba(245, 183, 59, 0.35);
  margin-bottom: 10px;
}
.lib-modal-player iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.lib-modal-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.lib-edit-preview {
  margin-top: 8px;
}
.lep-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(245, 183, 59, 0.3);
}
.lep-card img {
  width: 96px;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 6px;
  flex-shrink: 0;
}
.lep-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.lep-meta b {
  font-size: 0.85rem;
  color: #f8fafc;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lep-meta span {
  font-size: 0.76rem;
  color: var(--muted);
}

/* Playlist Series Decks (#libPlaylistsRoot) */
.lib-playlists-root {
  margin-bottom: 18px;
}
.lib-sec-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0 12px;
}
.lib-sec-head h3 {
  margin: 0 0 2px;
  font-family: var(--font-head);
  font-size: 1.08rem;
  font-weight: 800;
  color: #f8fafc;
}
.lib-sec-head p {
  margin: 0;
  font-size: 0.85rem;
  color: var(--muted);
}
.lib-playlists-stack {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.lib-playlist-deck {
  padding: 20px 22px !important;
  border-radius: 18px !important;
  border-top: 3px solid var(--gold) !important;
}
.lpd-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}
.lpd-title-wrap h3 {
  margin: 2px 0 8px;
  font-family: var(--font-head);
  font-size: 1.18rem;
  font-weight: 800;
  color: #f8fafc;
}
.lpd-badges {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.lpd-body {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.95fr);
  gap: 18px;
  align-items: start;
}
.lpd-stage {
  padding: 0 !important;
  overflow: hidden;
  border-radius: 14px !important;
  display: flex;
  flex-direction: column;
}
.lpd-stage-info {
  padding: 14px 16px 16px;
}
.lpd-stage-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 6px;
}
.lpd-stage-info h4 {
  margin: 0 0 6px;
  font-family: var(--font-head);
  font-size: 1.04rem;
  font-weight: 800;
  color: #f8fafc;
  line-height: 1.38;
}
.lpd-stage-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}
.lpd-stage-nav .btn {
  padding: 6px 12px;
  min-height: 34px;
  font-size: 0.82rem;
}
.lpd-ep-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: rgba(8, 13, 25, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 14px;
  padding: 12px;
}
.lpd-ep-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2px 4px 6px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
  font-family: var(--font-head);
  font-size: 0.84rem;
  font-weight: 800;
  color: #e2e8f0;
}
.lpd-ep-head small {
  font-family: var(--font-body);
  font-weight: 600;
  color: var(--muted);
}
.lpd-ep-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
  max-height: 360px;
  overflow-y: auto;
  padding-right: 2px;
}
.lpd-ep-item {
  display: grid;
  grid-template-columns: 46px 68px minmax(0, 1fr) 26px;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border-radius: 11px;
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-left: 3px solid rgba(148, 163, 184, 0.35);
  color: var(--text);
  cursor: pointer;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}
.lpd-ep-item:hover {
  transform: translateX(2px);
  border-color: rgba(245, 183, 59, 0.45);
  background: rgba(24, 35, 58, 0.88);
}
.lpd-ep-item.is-active {
  background: linear-gradient(145deg, rgba(46, 36, 16, 0.88), rgba(18, 25, 42, 0.94));
  border-color: rgba(245, 183, 59, 0.65);
  border-left: 4px solid var(--gold);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
}
.lpd-ep-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 6px;
  border-radius: 7px;
  background: rgba(245, 183, 59, 0.16);
  border: 1px solid rgba(245, 183, 59, 0.38);
  color: #fde68a;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 800;
}
.lpd-ep-item.is-active .lpd-ep-num {
  background: var(--gold);
  color: #090d16;
}
.lpd-ep-thumb {
  width: 68px;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 6px;
  background: #050912;
}
.lpd-ep-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.lpd-ep-text b {
  font-family: var(--font-head);
  font-size: 0.86rem;
  font-weight: 700;
  color: #f8fafc;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lpd-ep-text small {
  font-size: 0.75rem;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lpd-ep-play {
  font-size: 0.8rem;
  color: #fde68a;
  text-align: center;
}
.lib-modal-ep-strip {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 8px;
}
.lib-modal-ep-btn {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 8px 11px;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.75);
  border: 1px solid rgba(148, 163, 184, 0.22);
  color: var(--text);
  text-align: left;
  cursor: pointer;
}
.lib-modal-ep-btn.is-active {
  border-color: var(--gold);
  background: rgba(245, 183, 59, 0.16);
}
.lib-modal-ep-btn b {
  font-family: var(--font-mono);
  font-size: 0.74rem;
  color: #fde68a;
}
.lib-modal-ep-btn span {
  font-size: 0.82rem;
  color: #f8fafc;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 6. 🧰 TOOLS PANEL (#panel-tools) */
.tools-bento-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.tool-bento-card {
  padding: 20px 22px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 12px !important;
  text-decoration: none !important;
  color: var(--text) !important;
}
.tool-bento-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.36), 0 0 0 1px rgba(245, 183, 59, 0.35) !important;
}
.tbc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.tbc-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.tbc-body h3 {
  margin: 0 0 4px;
  font-family: var(--font-head);
  font-size: 1.12rem;
  font-weight: 800;
  color: #f8fafc;
}
.tbc-body p {
  margin: 0;
  font-size: 0.9rem;
  color: #cbd5e1;
  line-height: 1.5;
}
.tbc-svg {
  width: 100%;
  height: auto;
  max-height: 64px;
  display: block;
  background: rgba(5, 10, 20, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 10px;
  padding: 4px 8px;
}
.tbc-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
  font-size: 0.8rem;
  color: var(--muted);
}
.tbc-cta {
  font-family: var(--font-head);
  font-weight: 800;
  color: #fde68a;
  white-space: nowrap;
}

@media (max-width: 1040px) {
  #panel-playbook .pb-steps,
  #panel-mytrades .uj-kpis,
  #panel-lessons .mg-cards,
  #panel-lessons .mg-frs,
  .lib-kpi-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .lqb-grid,
  .lpd-body {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  #panel-playbook .pb-steps,
  #panel-mytrades .uj-kpis,
  #panel-lessons .mg-cards,
  #panel-lessons .mg-frs,
  .lib-kpi-strip,
  .tools-bento-grid,
  .lqb-row-meta,
  .lqb-row-playlist,
  .lqb-row-bottom {
    grid-template-columns: 1fr !important;
  }
  .lpd-ep-item {
    grid-template-columns: 44px minmax(0, 1fr) 22px;
  }
  .lpd-ep-thumb {
    display: none;
  }
}

html[data-theme="light"] #panel-setups .dk-lv,
html[data-theme="light"] #panel-playbook .dk-lv,
html[data-theme="light"] #panel-mytrades .dk-lv,
html[data-theme="light"] #panel-lessons .dk-lv,
html[data-theme="light"] #panel-library .dk-lv,
html[data-theme="light"] #panel-tools .dk-lv,
html[data-theme="light"] #panel-playbook .gx-card,
html[data-theme="light"] #panel-mytrades .gx-card,
html[data-theme="light"] #panel-lessons .gx-card,
html[data-theme="light"] #panel-library .gx-card,
html[data-theme="light"] .sbc-quick-box,
html[data-theme="light"] .lib-preview-empty,
html[data-theme="light"] .lpd-ep-col,
html[data-theme="light"] .lpd-ep-item {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
}
html[data-theme="light"] .tbc-body h3,
html[data-theme="light"] .lqb-head h3,
html[data-theme="light"] .lib-card-content h3,
html[data-theme="light"] .lib-preview-body h4,
html[data-theme="light"] .lib-preview-empty b,
html[data-theme="light"] .lib-sec-head h3,
html[data-theme="light"] .lpd-title-wrap h3,
html[data-theme="light"] .lpd-stage-info h4,
html[data-theme="light"] .lpd-ep-text b,
html[data-theme="light"] .uj-sum-title b {
  color: #0f172a !important;
}
html[data-theme="light"] .lib-take,
html[data-theme="light"] .lib-preview-body p {
  color: #334155 !important;
}

/* ==========================================================================
   21. MARKET TAB UPGRADE: PER-BAR GEX STRIKE & VALUE LABELS, LIVE TUG-OF-WAR
       CLASH ANIMATION, 5m TIMING STRIP & BEZEL BENTO PLATES (2026-10-21)
   ========================================================================== */

/* A. #mkLevels GEX Bar Chart with Strike Numbers & Per-Bar GEX Value Labels */
.gex-bars-card {
  margin-top: 20px;
  padding: 16px 18px 14px;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(8, 14, 26, 0.78) 0%, rgba(5, 10, 20, 0.9) 100%);
  border: 1px solid rgba(96, 165, 250, 0.25);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.gex-bars-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  font-size: 0.82rem;
  color: #cbd5e1;
}
.gex-bars-head b {
  font-family: var(--font-head);
  color: #f8fafc;
}
.gex-bars-head small {
  font-family: var(--mono);
  font-size: 0.75rem;
  color: #93c5fd;
  background: rgba(96, 165, 250, 0.12);
  border: 1px solid rgba(96, 165, 250, 0.3);
  border-radius: 999px;
  padding: 2px 10px;
}
#mkLevels .gex-bars {
  display: grid !important;
  grid-auto-flow: column;
  grid-auto-columns: minmax(42px, 1fr);
  gap: 6px !important;
  height: auto !important;
  margin: 6px 0 10px !important;
  padding: 6px 4px 2px;
  overflow-x: auto;
  scrollbar-width: thin;
}
#mkLevels .gex-bars .gb {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  height: auto !important;
  padding: 4px 2px 6px;
  border-radius: 10px;
  border: 1px solid transparent;
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease;
}
#mkLevels .gex-bars .gb:hover {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(226, 201, 143, 0.35);
  transform: translateY(-2px);
}
#mkLevels .gex-bars .gb.is-cw {
  background: linear-gradient(180deg, rgba(52, 211, 153, 0.13) 0%, rgba(16, 38, 34, 0.28) 100%);
  border-color: rgba(52, 211, 153, 0.38);
}
#mkLevels .gex-bars .gb.is-pw {
  background: linear-gradient(180deg, rgba(251, 113, 133, 0.13) 0%, rgba(44, 20, 32, 0.28) 100%);
  border-color: rgba(251, 113, 133, 0.38);
}
#mkLevels .gex-bars .gb.spot {
  background: linear-gradient(180deg, rgba(226, 201, 143, 0.14) 0%, rgba(30, 26, 16, 0.28) 100%);
  border-color: rgba(226, 201, 143, 0.48);
}
#mkLevels .gex-bars .gb.spot::after {
  display: none !important;
}
/* 3-Zone Column Architecture inside .gb:
   1) .gb-top (dedicated top slot for CW/PW/SPOT badge — never touched by bar or value)
   2) .gb-track (174px track with max bar height 31%, leaving 19% (~33px) safe zone for .gb-v pill)
   3) .gb-foot (bottom slot for Strike price .gb-k + historical S/R or GEX memory badge .gb-hist-tag) */
.gb-top {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 24px;
  padding-bottom: 4px;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.14);
  margin-bottom: 2px;
  z-index: 5;
}
.gb-role-spacer {
  display: block;
  height: 18px;
}
.gb-role {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-head);
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  padding: 2px 7px;
  border-radius: 999px;
  white-space: nowrap;
  line-height: 1.2;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}
.gb-role-cw {
  color: #ecfdf5;
  background: linear-gradient(135deg, #059669, #047857);
  border: 1px solid #6ee7b7;
}
.gb-role-pw {
  color: #fff1f2;
  background: linear-gradient(135deg, #e11d48, #be123c);
  border: 1px solid #fda4af;
}
.gb-role-spot {
  color: #081120;
  background: linear-gradient(135deg, #fef08a, #f59e0b);
  border: 1px solid #fef9c3;
}
.gb-track {
  position: relative;
  width: 100%;
  height: 174px;
  margin-top: auto;
}
/* Zero Horizontal Axis Line */
.gb-track::before {
  content: '';
  position: absolute;
  left: -4px;
  right: -4px;
  top: 50%;
  height: 1px;
  background: rgba(148, 163, 184, 0.35);
  pointer-events: none;
  z-index: 1;
}
/* Dashed Gold Vertical Line on Spot Column — z-index: 0 so it stays BEHIND bars and value pills! */
#mkLevels .gex-bars .gb.spot .gb-track::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 4px;
  bottom: 4px;
  border-left: 1.5px dashed rgba(244, 225, 178, 0.45);
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 0;
}
#mkLevels .gex-bars .gb .gb-track i {
  position: absolute;
  left: 18%;
  right: 18%;
  border-radius: 5px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.38);
  z-index: 2;
}
#mkLevels .gex-bars .gb.is-cw .gb-track i {
  box-shadow: 0 0 14px rgba(52, 211, 153, 0.48);
  border: 1px solid #6ee7b7;
}
#mkLevels .gex-bars .gb.is-pw .gb-track i {
  box-shadow: 0 0 14px rgba(251, 113, 133, 0.48);
  border: 1px solid #fda4af;
}
/* Value Pill (.gb-v): Solid dark surface + crisp border + z-index: 4 so it NEVER blends with lines or bars */
.gb-v {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--mono);
  font-style: normal;
  font-size: 0.67rem;
  font-weight: 800;
  white-space: nowrap;
  line-height: 1.15;
  z-index: 4;
  padding: 2px 5px;
  border-radius: 5px;
  background: #060d1b;
  border: 1px solid rgba(148, 163, 184, 0.32);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.65);
}
.gb.is-cw .gb-v {
  background: #052e22;
  border-color: #34d399;
  color: #a7f3d0 !important;
}
.gb.is-pw .gb-v {
  background: #3b0a1e;
  border-color: #fb7185;
  color: #fecdd3 !important;
}
.gb.spot:not(.is-cw):not(.is-pw) .gb-v {
  background: #231b09;
  border-color: #f5b73b;
}
.gb.is-minor .gb-v {
  opacity: 0.62;
  font-size: 0.61rem;
  padding: 1px 4px;
}
.gb:hover .gb-v {
  opacity: 1 !important;
  transform: translateX(-50%) scale(1.08);
  z-index: 6;
}
.gb-foot {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  margin-top: 6px;
  padding-top: 5px;
  width: 100%;
  border-top: 1px solid rgba(148, 163, 184, 0.2);
}
.gb-k {
  width: 100%;
  text-align: center;
  font-family: var(--mono);
  font-size: 0.82rem;
  font-weight: 700;
  color: #cbd5e1;
  line-height: 1.15;
}
.gb.is-cw .gb-k {
  color: #6ee7b7;
  font-weight: 800;
}
.gb.is-pw .gb-k {
  color: #fda4af;
  font-weight: 800;
}
.gb.spot .gb-k {
  color: #fde68a;
  font-weight: 800;
}
.gb-hist-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-head);
  font-size: 0.58rem;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 4px;
  white-space: nowrap;
  line-height: 1.2;
}
.gb-hist-tag.is-conf {
  color: #fef08a;
  background: rgba(245, 158, 11, 0.22);
  border: 1px solid rgba(251, 191, 36, 0.55);
}
.gb-hist-tag.is-res {
  color: #bae6fd;
  background: rgba(56, 189, 248, 0.16);
  border: 1px solid rgba(56, 189, 248, 0.42);
}
.gb-hist-tag.is-sup {
  color: #a7f3d0;
  background: rgba(16, 185, 129, 0.16);
  border: 1px solid rgba(52, 211, 153, 0.42);
}
.gb-hist-tag.is-mem {
  color: #ddd6fe;
  background: rgba(139, 92, 246, 0.18);
  border: 1px solid rgba(167, 139, 250, 0.45);
}
.gb-hist-spacer {
  display: block;
  height: 14px;
}

/* Mini Visuals inside Net GEX & Expected Move Boxes (#mkLevels .stat:nth-child(4/5)) */
.gex-mini-split {
  display: flex;
  height: 7px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(148, 163, 184, 0.18);
  gap: 2px;
  margin: 6px 0 6px;
}
.gex-mini-split .gms-c {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #10b981, #34d399);
}
.gex-mini-split .gms-p {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #fb7185, #e11d48);
}
.em-corridor {
  margin: 6px 0 6px;
}
.emc-labels {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--mono);
  font-size: 0.74rem;
  font-weight: 700;
  margin-bottom: 4px;
}
.emc-track {
  position: relative;
  height: 7px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(251, 113, 133, 0.35), rgba(226, 201, 143, 0.3) 50%, rgba(52, 211, 153, 0.35));
  border: 1px solid rgba(226, 201, 143, 0.28);
}
.emc-track i {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  border-radius: 50%;
  background: #fde68a;
  border: 2px solid #081120;
  box-shadow: 0 0 8px rgba(253, 230, 138, 0.8);
}

/* B. Live Tug-of-War Battle Animation (.tug-battle) */
.tug-wrap.tug-battle {
  position: relative;
  margin: 10px 0 16px;
  padding: 12px 16px 14px;
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(16, 48, 38, 0.45) 0%, rgba(10, 17, 32, 0.85) 50%, rgba(52, 18, 30, 0.45) 100%);
  border: 1px solid rgba(226, 201, 143, 0.28);
  box-shadow: 0 8px 22px rgba(2, 6, 18, 0.35);
  overflow: hidden;
}
.tug-battle .tug-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
  margin-bottom: 9px;
}
.tug-battle .tug-side {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-head);
  font-weight: 700;
}
.tug-battle .tug-mid {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 0.82rem;
  padding: 2px 10px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(226, 201, 143, 0.35);
  color: #f8fafc;
}
.tug-chevrons {
  display: inline-block;
  font-style: normal;
  font-weight: 900;
  letter-spacing: -1px;
}
.tug-chev-up {
  color: #34d399;
  animation: tugChevRight 0.95s ease-in-out infinite;
}
.tug-chev-dn {
  color: #fb7185;
  animation: tugChevLeft 0.95s ease-in-out infinite;
}
.tug-arena {
  position: relative;
  height: 16px;
  display: flex;
  align-items: center;
}
.tug-battle .tug-bar {
  position: relative;
  display: flex;
  width: 100%;
  height: 12px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(15, 23, 42, 0.85);
  border: 1px solid rgba(148, 163, 184, 0.28);
  gap: 0;
  animation: tugStruggleBar 1.5s ease-in-out infinite;
}
.tug-battle .tug-up {
  position: relative;
  height: 100%;
  background: linear-gradient(90deg, #059669 0%, #10b981 60%, #6ee7b7 100%);
  box-shadow: 0 0 14px rgba(52, 211, 153, 0.55);
  overflow: hidden;
}
.tug-battle .tug-dn {
  position: relative;
  height: 100%;
  background: linear-gradient(90deg, #fda4af 0%, #f43f5e 40%, #be123c 100%);
  box-shadow: 0 0 14px rgba(251, 113, 133, 0.55);
  overflow: hidden;
}
/* Streaming Energy Chevrons Inside Both Bars Pushing Toward Collision */
.tug-wave {
  position: absolute;
  inset: 0;
  background-size: 24px 12px;
  opacity: 0.48;
}
.tug-wave-up {
  background-image: repeating-linear-gradient(
    -55deg,
    rgba(255, 255, 255, 0.45) 0px,
    rgba(255, 255, 255, 0.45) 5px,
    transparent 5px,
    transparent 12px
  );
  animation: tugWaveRight 0.75s linear infinite;
}
.tug-wave-dn {
  background-image: repeating-linear-gradient(
    55deg,
    rgba(255, 255, 255, 0.45) 0px,
    rgba(255, 255, 255, 0.45) 5px,
    transparent 5px,
    transparent 12px
  );
  animation: tugWaveLeft 0.75s linear infinite;
}
/* Clash Spark Emblem at the Collision Point */
.tug-clash {
  position: absolute;
  top: 50%;
  width: 24px;
  height: 24px;
  margin-top: -12px;
  margin-left: -12px;
  display: grid;
  place-items: center;
  pointer-events: none;
  z-index: 4;
  animation: tugClashOscillate 1.5s ease-in-out infinite;
}
.tug-clash-ring {
  position: absolute;
  inset: -3px;
  border-radius: 50%;
  border: 2px solid #fde68a;
  background: radial-gradient(circle, rgba(253, 230, 138, 0.55) 0%, rgba(251, 113, 133, 0.25) 60%, transparent 100%);
  animation: tugClashRingPulse 0.9s ease-out infinite;
}
.tug-clash-core {
  position: relative;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: linear-gradient(135deg, #fef08a, #f59e0b);
  border: 2px solid #081120;
  box-shadow: 0 0 12px rgba(251, 191, 36, 0.95);
  display: grid;
  place-items: center;
  font-size: 0.72rem;
  line-height: 1;
  color: #081120;
}
@keyframes tugWaveRight {
  from { background-position: 0 0; }
  to { background-position: 24px 0; }
}
@keyframes tugWaveLeft {
  from { background-position: 24px 0; }
  to { background-position: 0 0; }
}
@keyframes tugStruggleBar {
  0%, 100% { transform: translateX(-3px); }
  35% { transform: translateX(4px); }
  68% { transform: translateX(-2px); }
  85% { transform: translateX(3px); }
}
@keyframes tugClashOscillate {
  0%, 100% { transform: translateX(-4px) scale(0.96); }
  35% { transform: translateX(5px) scale(1.08); }
  68% { transform: translateX(-3px) scale(0.98); }
  85% { transform: translateX(4px) scale(1.05); }
}
@keyframes tugClashRingPulse {
  0% { transform: scale(0.8); opacity: 0.95; }
  100% { transform: scale(1.55); opacity: 0; }
}
@keyframes tugChevRight {
  0%, 100% { transform: translateX(0); opacity: 0.75; }
  50% { transform: translateX(4px); opacity: 1; }
}
@keyframes tugChevLeft {
  0%, 100% { transform: translateX(0); opacity: 0.75; }
  50% { transform: translateX(-4px); opacity: 1; }
}
html[data-motion="paused"] .tug-wave,
html[data-motion="paused"] .tug-battle .tug-bar,
html[data-motion="paused"] .tug-clash,
html[data-motion="paused"] .tug-clash-ring,
html[data-motion="paused"] .tug-chevrons {
  animation: none !important;
}

/* C. 5m Live Timing Strip inside #mkMacd (.mk-timing-strip) */
.mk-timing-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
  margin: 10px 0 8px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(8, 14, 26, 0.68);
  border: 1px solid rgba(226, 201, 143, 0.24);
  border-left: 3px solid var(--gold);
}
.mts-item {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.mts-item small {
  font-size: 0.75rem;
  color: var(--muted);
}
.mts-val {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-family: var(--mono);
  font-size: 0.88rem;
}
@media (max-width: 640px) {
  .mk-timing-strip {
    grid-template-columns: 1fr;
  }
}

/* D. Bezel & Accent-Bar Bento Mini-Plates for #mkCross & #mkBreadth Asset Tiles & #mkNews */
#mkCross .tiles,
#mkBreadth .tiles:not(.sector-list) {
  gap: 10px 14px !important;
}
#mkCross .tiles .tile,
#mkBreadth .tiles:not(.sector-list) .tile {
  background: rgba(10, 17, 30, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-left: 4px solid #64748b !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease !important;
}
#mkCross .tiles .tile.lean-up,
#mkBreadth .tiles:not(.sector-list) .tile.lean-up {
  border-left-color: #34d399 !important;
  border-color: rgba(52, 211, 153, 0.3) !important;
  background: linear-gradient(145deg, rgba(16, 42, 36, 0.72), rgba(9, 18, 26, 0.82)) !important;
}
#mkCross .tiles .tile.lean-down,
#mkBreadth .tiles:not(.sector-list) .tile.lean-down {
  border-left-color: #fb7185 !important;
  border-color: rgba(251, 113, 133, 0.3) !important;
  background: linear-gradient(145deg, rgba(46, 20, 32, 0.72), rgba(16, 12, 24, 0.82)) !important;
}
#mkCross .tiles .tile:hover,
#mkBreadth .tiles:not(.sector-list) .tile:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(226, 201, 143, 0.5) !important;
}
#mkNews .news-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 10px;
}
#mkNews .news-list li {
  padding: 10px 14px;
  border-radius: 11px;
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-left: 4px solid #64748b;
  background: rgba(9, 15, 28, 0.65);
  transition: transform 0.15s ease, border-color 0.15s ease;
}
#mkNews .news-list li.news-lv-2 {
  border-left-color: #fb7185;
  background: linear-gradient(90deg, rgba(251, 113, 133, 0.09), rgba(9, 15, 28, 0.7) 55%);
}
#mkNews .news-list li.news-lv-1 {
  border-left-color: #f5b73b;
  background: linear-gradient(90deg, rgba(245, 183, 59, 0.08), rgba(9, 15, 28, 0.7) 55%);
}
#mkNews .news-list li:hover {
  transform: translateX(3px);
  border-color: rgba(226, 201, 143, 0.45);
}

html[data-theme="light"] .gex-bars-card,
html[data-theme="light"] .tug-wrap.tug-battle,
html[data-theme="light"] .mk-timing-strip,
html[data-theme="light"] #mkCross .tiles .tile,
html[data-theme="light"] #mkBreadth .tiles:not(.sector-list) .tile,
html[data-theme="light"] #mkNews .news-list li {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
}
html[data-theme="light"] .gex-bars-head b,
html[data-theme="light"] .gb-k {
  color: #0f172a !important;
}
html[data-theme="light"] .gb-v {
  background: rgba(255, 255, 255, 0.96);
  color: #0f172a;
}

/* ==========================================================================
   2026-10-21 HISTORICAL S/R + MULTI-DAY GEX CONFLUENCE DECK & LUXURY HEADER
   COMMAND BAR (.hist-confluence-deck, .dte-meta, .dte-top-ribbon)
   ========================================================================== */

/* 1. Historical Key S/R & Multi-Day GEX Memory Confluence Deck (.hist-confluence-deck) */
.hist-confluence-deck {
  margin-top: 16px;
  padding: 18px 20px;
  border-radius: 16px;
  background: radial-gradient(ellipse at 100% 0%, rgba(226, 201, 143, 0.11), transparent 65%), linear-gradient(155deg, rgba(11, 20, 38, 0.94) 0%, rgba(7, 13, 25, 0.97) 100%);
  border: 1px solid rgba(226, 201, 143, 0.34);
  border-top: 3px solid var(--gold);
  box-shadow: 0 12px 30px rgba(2, 6, 18, 0.42);
}
.hcd-head h4 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin: 0 0 6px;
  font-family: var(--font-head);
  font-size: 1.05rem;
  font-weight: 700;
  color: #f8fafc;
}
.hcd-sub {
  margin: 0 0 14px;
  font-size: 0.85rem;
  line-height: 1.6;
  color: #cbd5e1;
  max-width: 86ch;
}
.hcd-sub b {
  color: var(--gold-light);
}
.hcd-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
@media (max-width: 860px) {
  .hcd-grid {
    grid-template-columns: 1fr;
  }
}
.hcd-box {
  padding: 14px 16px;
  border-radius: 14px;
  background: rgba(6, 11, 22, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.2);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.hcd-box.hcd-sr {
  border-top: 2px solid #38bdf8;
}
.hcd-box.hcd-mem {
  border-top: 2px solid #34d399;
}
.hcd-box-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 6px 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
  font-size: 0.85rem;
  color: #e2e8f0;
}
.hcd-box-head b {
  font-family: var(--font-head);
  color: #f8fafc;
}
.hcd-box-head small {
  font-size: 0.75rem;
  color: var(--muted);
}
.hcd-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 11px;
  border-radius: 10px;
  background: rgba(13, 22, 40, 0.68);
  border: 1px solid rgba(148, 163, 184, 0.14);
  border-left: 3px solid #64748b;
  transition: transform 0.15s ease, border-color 0.15s ease;
}
.hcd-row:hover {
  transform: translateX(2px);
  border-color: rgba(226, 201, 143, 0.42);
}
.hcd-row.is-confluence {
  border-left-color: #f5b73b;
  border-color: rgba(245, 183, 59, 0.36);
  background: linear-gradient(90deg, rgba(245, 183, 59, 0.12), rgba(13, 22, 40, 0.75) 65%);
}
.hcd-row.is-mem-row {
  border-left-color: #34d399;
}
.hcd-main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
}
.hcd-code,
.hcd-strike {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 52px;
  padding: 4px 8px;
  border-radius: 8px;
  font-family: var(--mono);
  font-size: 0.8rem;
  font-weight: 800;
  background: rgba(7, 12, 24, 0.85);
  border: 1px solid rgba(148, 163, 184, 0.28);
}
.hcd-txt {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  flex: 1;
}
.hcd-txt b {
  font-family: var(--font-head);
  font-size: 0.84rem;
  font-weight: 600;
  color: #f1f5f9;
  line-height: 1.3;
}
.hcd-txt small {
  font-size: 0.75rem;
  color: var(--muted);
  line-height: 1.35;
}
.hcd-bar {
  height: 5px;
  width: 100%;
  max-width: 180px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  overflow: hidden;
  margin: 2px 0;
}
.hcd-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
}
.hcd-bar i.is-pos {
  background: linear-gradient(90deg, #10b981, #6ee7b7);
}
.hcd-bar i.is-neg {
  background: linear-gradient(90deg, #f43f5e, #fda4af);
}
.hcd-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
  flex: 0 0 auto;
  text-align: right;
}
.hcd-px,
.hcd-gval {
  font-family: var(--mono);
  font-size: 0.92rem;
  font-weight: 800;
  color: #f8fafc;
}
.hcd-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 7px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: 0.68rem;
  font-weight: 700;
  white-space: nowrap;
}
.hcd-badge.is-conf {
  color: #fef08a;
  background: rgba(245, 158, 11, 0.2);
  border: 1px solid rgba(251, 191, 36, 0.52);
}
.hcd-badge.is-mem {
  color: #a7f3d0;
  background: rgba(16, 185, 129, 0.16);
  border: 1px solid rgba(52, 211, 153, 0.45);
}
.hcd-badge.is-plain {
  color: #cbd5e1;
  background: rgba(148, 163, 184, 0.14);
  border: 1px solid rgba(148, 163, 184, 0.28);
}

/* 2. Frameless Header Toolbar (.dte-meta: #ownerPill, #viewModeBtn, #savedAt, #historyBtn — ZERO Capsule-in-Box) */
.dte-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px 18px !important;
  margin-top: 10px !important;
  padding: 6px 0 !important;
  border-radius: 0 !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
.dte-meta .owner-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 2px 16px 2px 0 !important;
  border-radius: 0 !important;
  font-family: var(--font-head) !important;
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  color: #bae6fd !important;
  background: none !important;
  border: 0 !important;
  border-right: 1px solid rgba(148, 163, 184, 0.28) !important;
  box-shadow: none !important;
}
.dte-meta .owner-pill.is-owner {
  color: #fde68a !important;
  background: none !important;
  border: 0 !important;
  border-right: 1px solid rgba(226, 201, 143, 0.35) !important;
  box-shadow: none !important;
}
.dte-meta .owner-pill small {
  font-weight: 500;
  color: #cbd5e1;
}
.op-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: 0 0 8px;
  background: #38bdf8;
  box-shadow: 0 0 8px #38bdf8;
}
.op-dot.is-audi,
.op-dot.is-live {
  background: #34d399;
  box-shadow: 0 0 10px #34d399;
}
.dte-meta .view-mode-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 36px !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
  background: rgba(30, 41, 59, 0.72) !important;
  border: 1px solid rgba(226, 201, 143, 0.42) !important;
  box-shadow: none !important;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease !important;
}
.dte-meta .view-mode-btn:hover {
  transform: translateY(-1px) !important;
  background: rgba(30, 58, 95, 0.88) !important;
  border-color: rgba(226, 201, 143, 0.75) !important;
}
.dte-meta .view-mode-btn small {
  font-weight: 500;
  color: #cbd5e1;
}
.vmb-switch {
  display: inline-flex;
  align-items: center;
  padding: 0 !important;
  border-radius: 0 !important;
  font-size: 0.9rem;
  font-weight: 800;
  color: var(--gold-light) !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
.dte-meta .saved-at-pill,
.dte-meta #savedAt {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 0 2px 4px;
  border-radius: 0;
  background: none !important;
  border: 0 !important;
  font-family: var(--mono);
  font-size: 0.78rem;
  color: #94a3b8;
}
.dte-meta .history-pill-btn,
.dte-meta #historyBtn {
  min-height: 34px !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  font-size: 0.8rem !important;
  background: rgba(15, 23, 42, 0.65) !important;
  border: 1px solid rgba(226, 201, 143, 0.35) !important;
  color: var(--gold-light) !important;
}

/* 3. Frameless Top Context Ribbon & Clean Single-Layer Action Buttons (.dte-top-ribbon / .guide-cta-bar) */
.dte-context.dte-top-ribbon {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px 20px !important;
  margin-top: 10px !important;
  padding: 14px 0 6px !important;
  border-radius: 0 !important;
  background: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.2) !important;
  box-shadow: none !important;
}
.dte-top-ribbon > .risk-note.risk-compact {
  flex: 1 1 420px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 6px 10px !important;
  margin: 0 !important;
  padding: 4px 0 4px 12px !important;
  border-radius: 0 !important;
  background: none !important;
  border: 0 !important;
  border-left: 3px solid #fb7185 !important;
  color: #cbd5e1 !important;
  font-size: 0.86rem !important;
  line-height: 1.6 !important;
}
.risk-kicker {
  font-family: var(--font-head);
  font-weight: 800;
  color: #fda4af;
  white-space: nowrap;
}
.guide-cta-bar.guide-cta-compact {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 12px !important;
  flex: 0 1 auto !important;
}
.guide-cta-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 46px !important;
  padding: 8px 16px !important;
  border-radius: 12px !important;
  text-align: left !important;
  position: relative;
  overflow: hidden;
  transition: transform 0.18s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.18s ease, filter 0.18s ease !important;
}
.guide-cta-btn.is-guide {
  background: linear-gradient(135deg, #172e54 0%, #0d1b36 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.55) !important;
  border-left: 3px solid #60a5fa !important;
  color: #f8fafc !important;
  box-shadow: none !important;
}
.guide-cta-btn.is-journal {
  background: linear-gradient(135deg, #11362e 0%, #0a1f20 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.52) !important;
  border-left: 3px solid #34d399 !important;
  color: #ecfdf5 !important;
  box-shadow: none !important;
}
.guide-cta-btn:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.08) !important;
}
.guide-cta-btn.is-guide:hover {
  border-color: #93c5fd !important;
}
.guide-cta-btn.is-journal:hover {
  border-color: #6ee7b7 !important;
}
.gca-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  font-size: 1.2rem;
  background: none !important;
  border: 0 !important;
  flex: 0 0 auto;
}
.guide-cta-btn.is-guide .gca-ico,
.guide-cta-btn.is-journal .gca-ico {
  background: none !important;
  border: 0 !important;
}
.gca-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.3;
}
.gca-kicker {
  font-family: var(--mono);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #93c5fd;
}
.guide-cta-btn.is-journal .gca-kicker {
  color: #6ee7b7;
}
.gca-label {
  font-family: var(--font-head);
  font-size: 0.88rem;
  font-weight: 700;
  color: #f8fafc;
}
.gca-arr {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  background: none !important;
  border: 0 !important;
  font-family: var(--mono);
  font-size: 0.95rem;
  font-weight: 800;
  color: var(--gold-light);
  transition: transform 0.18s ease;
}
.guide-cta-btn:hover .gca-arr {
  transform: translateX(3px);
  background: none !important;
}
@media (max-width: 640px) {
  .guide-cta-bar.guide-cta-compact {
    width: 100% !important;
  }
  .guide-cta-btn {
    flex: 1 1 100% !important;
    justify-content: flex-start !important;
  }
  .gca-arr {
    margin-left: auto;
  }
}

html[data-theme="light"] .hist-confluence-deck,
html[data-theme="light"] .hcd-box,
html[data-theme="light"] .hcd-row,
html[data-theme="light"] .dte-meta,
html[data-theme="light"] .dte-context.dte-top-ribbon {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.18) !important;
}
html[data-theme="light"] .hcd-head h4,
html[data-theme="light"] .hcd-box-head b,
html[data-theme="light"] .hcd-txt b,
html[data-theme="light"] .hcd-px {
  color: #0f172a !important;
}

/* ==========================================================================
   v65 — 1. GRAND ARCHITECTURAL ZONE HEADERS (.zone-banner, .zone-pill, .zone-desc)
         2. ZERO BOX-IN-BOX & ZERO CIRCLE-IN-BOX DE-CLUTTERING
            - Frameless .gap-journey-card & .gap-journey-svg inside #mkSpy
            - Frameless .mk-frame & .mk-timing-strip inside #mkMacd
            - Frameless .gex-bars-card, .hist-confluence-deck, .hcd-box & Left-Bar .hcd-row
            - Frameless .card-eyebrow across all cards
         3. FEATURED VS ROUTINE LOG ELEVATION (.is-featured-log, .log-more-fold)
         4. CROSS-TAB CONFLUENCE DECISION STRIP (.ls-confluence, .ch-sr-journey-row)
   ========================================================================== */

/* 0. Architectural Section Headers (.zone-banner) — Open Night-Sky Divider, Crisp Badge + Big Headline vs Quiet Step Items */
.zone-banner {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  justify-content: center !important;
  gap: 10px 24px !important;
  margin: 28px 0 18px !important;
  padding: 18px 0 14px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(226, 201, 143, 0.28) !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.zone-banner.zone-secondary {
  margin-top: 34px !important;
  border-bottom-color: rgba(56, 189, 248, 0.28) !important;
  background: none !important;
}
.zone-head-left {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.zone-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 10px;
  border-radius: 6px;
  font-family: var(--font-body);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #081120;
  background: linear-gradient(135deg, #fde68a, #e2c98f);
  white-space: nowrap;
}
.zone-banner.zone-secondary .zone-tag {
  color: #081120;
  background: linear-gradient(135deg, #bae6fd, #38bdf8);
}
.zone-pill {
  font-family: var(--font-head) !important;
  font-weight: 600 !important;
  font-size: 1.56rem !important;
  line-height: 1.3 !important;
  letter-spacing: -0.015em !important;
  color: #f8fafc !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
}
.zone-banner.zone-secondary .zone-pill {
  color: #f8fafc !important;
  background: none !important;
  border: 0 !important;
}
.zone-desc {
  font-family: var(--font-body) !important;
  font-size: 0.88rem !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  color: #94a3b8 !important;
}
.zone-steps {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px 16px !important;
}
.zone-step {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-body);
  font-size: 0.86rem;
  font-weight: 500;
  color: #cbd5e1;
  white-space: nowrap;
}
.zone-step i {
  font-style: normal;
  font-weight: 600;
  color: var(--gold-light);
}
.zone-banner.zone-secondary .zone-step i {
  color: #7dd3fc;
}
@media (max-width: 640px) {
  .zone-pill {
    font-size: 1.26rem !important;
  }
  .zone-desc,
  .zone-step {
    font-size: 0.82rem !important;
  }
}

/* De-pill .card-eyebrow & .sub-inline so no card has a pill-in-a-box */
.card-eyebrow {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.05em !important;
  color: var(--gold-light) !important;
  margin-bottom: 4px !important;
}
.sub-inline {
  font-family: var(--font-body);
  font-size: 0.85rem;
  font-weight: 400;
  color: var(--muted);
}

/* 1. Frameless Opening Gap & Intraday Journey inside #mkSpy (Zero Box-in-Box + Generous Breathing Room) */
.gap-journey-card {
  margin: 22px 0 18px !important;
  padding: 20px 0 12px !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.gj-head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 18px;
}
.gj-kicker {
  font-family: var(--font-body);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--gold-light);
}
.gj-title {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1.06rem;
  font-weight: 600;
  color: #f8fafc;
  line-height: 1.55;
}
.gj-arr {
  color: var(--muted);
  margin: 0 6px;
}
.gj-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  font-size: 0.88rem;
  color: #cbd5e1;
  line-height: 1.65;
}
.gj-meta-item b {
  font-family: var(--mono);
  color: #f8fafc;
}
.gj-meta-sep {
  color: rgba(148, 163, 184, 0.5);
}
.gap-journey-svg {
  width: 100%;
  height: auto;
  max-height: 132px;
  display: block;
  border-radius: 0 !important;
  background: none !important;
  border: 0 !important;
  padding: 6px 0 !important;
  overflow: visible;
}
#mkSpy .stat-row.stat-row-runs {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px !important;
  margin-top: 14px !important;
  padding-top: 18px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
}
@media (max-width: 580px) {
  #mkSpy .stat-row.stat-row-runs {
    grid-template-columns: 1fr !important;
  }
}

/* Frameless .mk-frame & .mk-timing-strip inside #mkMacd (Zero Box-in-Box) */
#mkMacd .mk-frame {
  background: none !important;
  border: 0 !important;
  border-left: 3px solid rgba(148, 163, 184, 0.35) !important;
  border-radius: 0 !important;
  padding: 4px 0 4px 12px !important;
  box-shadow: none !important;
}
#mkMacd .mk-frame.is-up {
  border-left-color: #34d399 !important;
}
#mkMacd .mk-frame.is-down {
  border-left-color: #fb7185 !important;
}
#mkMacd .mk-timing-strip {
  background: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 0 !important;
  padding: 12px 0 !important;
  margin: 14px 0 10px !important;
  box-shadow: none !important;
}
.mts-inline {
  font-style: normal;
  font-family: var(--font-body);
  font-size: 0.8rem;
  font-weight: 600;
}
.mts-inline.flat {
  color: var(--muted);
}

/* 2. Frameless GEX Bars & Weighted Confluence Deck inside #mkLevels (Zero Box-in-Box, Zero Circle-in-Square) */
#mkLevels .gex-bars-card,
#mkLevels .hist-confluence-deck {
  margin-top: 18px !important;
  padding: 18px 0 4px !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.hcd-corridor-banner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 14px;
  align-items: center;
  margin-bottom: 16px;
  padding: 12px 16px;
  border-radius: 0 10px 10px 0;
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.08) 0%, rgba(245, 183, 59, 0.09) 50%, rgba(16, 185, 129, 0.08) 100%);
  border: 0;
  border-left: 4px solid var(--gold);
  border-top: 1px solid rgba(226, 201, 143, 0.22);
  border-bottom: 1px solid rgba(226, 201, 143, 0.22);
}
.hcb-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.hcb-item.is-spot {
  text-align: center;
  padding: 0 16px;
  background: none;
  border: 0;
  border-left: 1px solid rgba(148, 163, 184, 0.22);
  border-right: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 0;
}
.hcb-item.is-res {
  text-align: right;
}
.hcb-item small {
  font-family: var(--font-head);
  font-size: 0.75rem;
  font-weight: 700;
  color: #cbd5e1;
}
.hcb-item b {
  font-family: var(--mono);
  font-size: 1.08rem;
  font-weight: 800;
  color: #f8fafc;
}
.hcb-item.is-sup b { color: #fda4af; }
.hcb-item.is-spot b { color: #fde68a; font-size: 1.18rem; }
.hcb-item.is-res b { color: #6ee7b7; }
.hcb-item b em {
  font-style: normal;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  color: #cbd5e1;
}
@media (max-width: 720px) {
  .hcd-corridor-banner {
    grid-template-columns: 1fr;
    text-align: left;
  }
  .hcb-item.is-res, .hcb-item.is-spot {
    text-align: left;
    border: 0;
    padding: 0;
  }
}

.hcd-grid {
  gap: 24px !important;
}
.hcd-box {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.hcd-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 6px !important;
  padding: 11px 6px 11px 14px !important;
  border: 0 !important;
  border-left: 3px solid #64748b !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.15) !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.hcd-row.is-res-row {
  border-left-color: #34d399 !important;
}
.hcd-row.is-sup-row {
  border-left-color: #fb7185 !important;
}
.hcd-row.is-hero-level {
  padding: 12px 10px 12px 15px !important;
  border-left-width: 4px !important;
  border-left-color: #f5b73b !important;
  background: linear-gradient(90deg, rgba(245, 183, 59, 0.1) 0%, transparent 85%) !important;
}
.hcd-row.is-hero-level.is-res-row {
  border-left-color: #34d399 !important;
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.1) 0%, transparent 85%) !important;
}
.hcd-row.is-hero-level.is-sup-row {
  border-left-color: #fb7185 !important;
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.1) 0%, transparent 85%) !important;
}
.hcd-hero-kicker {
  font-family: var(--font-head);
  font-size: 0.76rem;
  font-weight: 800;
  color: #fde68a;
  letter-spacing: 0.01em;
}
.hcd-hero-kicker.is-res { color: #6ee7b7; }
.hcd-hero-kicker.is-sup { color: #fda4af; }
.hcd-row-body {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  flex-wrap: wrap;
}
.hcd-main {
  display: flex;
  align-items: baseline;
  gap: 12px;
  min-width: 0;
  flex: 1;
}
.hcd-row .hcd-px {
  font-family: var(--mono);
  font-size: 1.08rem !important;
  font-weight: 800 !important;
  min-width: 68px;
}
.hcd-row.is-hero-level .hcd-px {
  font-size: 1.24rem !important;
}
.hcd-meta-tag {
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  color: #cbd5e1;
}
.hcd-meta-tag.is-conf {
  color: #fde68a;
}
.hcd-more-fold,
.log-more-fold {
  margin-top: 8px;
  border: 0;
  border-top: 1px dashed rgba(148, 163, 184, 0.25);
  border-radius: 0;
  background: none;
  padding: 8px 0 2px;
}
.hcd-more-fold > summary,
.log-more-fold > summary {
  cursor: pointer;
  font-family: var(--font-head);
  font-size: 0.82rem;
  font-weight: 700;
  color: #93c5fd;
  list-style: none;
}
.hcd-more-fold > summary::-webkit-details-marker,
.log-more-fold > summary::-webkit-details-marker {
  display: none;
}
.hcd-more-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
}

/* 3. Featured vs Routine Log Spotlight System (Events, News, Trade Logs) */
@keyframes logSpotlightPulse {
  0%, 100% { transform: scale(1); opacity: 1; box-shadow: 0 0 0 0 rgba(251, 113, 133, 0.65); }
  50% { transform: scale(1.18); opacity: 0.85; box-shadow: 0 0 0 6px rgba(251, 113, 133, 0); }
}
.log-pulse-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fb7185;
  margin-right: 6px;
  vertical-align: middle;
  animation: logSpotlightPulse 1.8s infinite ease-in-out;
}
.log-spotlight-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.01em;
}
.log-spotlight-pill.is-urgent {
  background: rgba(244, 63, 94, 0.22);
  border: 1px solid rgba(251, 113, 133, 0.55);
  color: #fecdd3;
}
.log-spotlight-pill.is-gold {
  background: rgba(245, 183, 59, 0.2);
  border: 1px solid rgba(245, 183, 59, 0.52);
  color: #fde68a;
}
.log-spotlight-pill.is-gold .log-pulse-dot {
  background: #f5b73b;
}

.ev-card.is-featured-log,
.news-list > li.is-featured-log {
  background: radial-gradient(ellipse at 0% 0%, rgba(245, 183, 59, 0.15), transparent 70%), rgba(15, 25, 46, 0.94) !important;
  border: 1.5px solid rgba(245, 183, 59, 0.52) !important;
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  padding: 11px 13px !important;
}
.news-list > li.news-lv-2.is-featured-log {
  background: radial-gradient(ellipse at 0% 0%, rgba(244, 63, 94, 0.16), transparent 70%), rgba(18, 22, 40, 0.95) !important;
  border-color: rgba(251, 113, 133, 0.58) !important;
}
.news-badge-col {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}

/* Trade Cards Featured Spotlight (Live Open Position & Hero Trophy Win) */
.card.is-featured-log,
.dk-plan.is-featured-log {
  position: relative;
  overflow: hidden;
}
.card.is-open-log,
.dk-plan.is-open-log {
  border: 1.5px solid rgba(245, 183, 59, 0.68) !important;
  box-shadow: 0 12px 28px rgba(245, 158, 11, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}
.card.is-trophy-log,
.dk-plan.is-trophy-log {
  border: 1.5px solid rgba(52, 211, 153, 0.62) !important;
  box-shadow: 0 12px 28px rgba(16, 185, 129, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}
.log-spotlight-banner {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 5px 11px;
  border-radius: 9px;
  margin-bottom: 8px;
  font-family: var(--font-head);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.log-spotlight-banner.is-live {
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.26), rgba(244, 63, 94, 0.18));
  border: 1px solid rgba(251, 191, 36, 0.55);
  color: #fde68a;
}
.log-spotlight-banner.is-trophy {
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.24), rgba(245, 183, 59, 0.2));
  border: 1px solid rgba(52, 211, 153, 0.52);
  color: #a7f3d0;
}

/* 4. Trade Desk 6-Cell Context & Mini Gap Pill */
.ls-mini-gap {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(56, 189, 248, 0.12);
  border: 1px solid rgba(56, 189, 248, 0.3);
  font-size: 0.8rem;
}
.ch-sr-journey-row {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed rgba(148, 163, 184, 0.22);
}

/* 5. Page-Wide Line-Spacing, Element Breathing Room & Abbreviation Glossary (.hcd-abbr-guide) */
.hcd-abbr-guide {
  margin: 10px 0 6px !important;
  padding: 9px 14px !important;
  border-left: 3px solid #38bdf8 !important;
  background: rgba(56, 189, 248, 0.08) !important;
  color: #e2e8f0 !important;
  font-size: 0.85rem !important;
  line-height: 1.65 !important;
}
.hcd-abbr-guide b {
  color: #7dd3fc;
}
.mk-box p.sub,
.hcd-sub,
.stat em,
.hcd-txt small {
  line-height: 1.68 !important;
}
.stat {
  display: flex;
  flex-direction: column;
  gap: 6px !important;
  padding: 12px 0 12px 14px !important;
}
.em-corridor {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin: 12px 0 10px !important;
  padding: 8px 0 !important;
  background: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
}
.emc-labels {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 12px !important;
  line-height: 1.5 !important;
}
.ch-corridor-meter {
  margin: 14px 0 !important;
  padding: 12px 0 8px !important;
  background: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 0 !important;
}
.ch-cm-labels {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px 14px !important;
  margin-bottom: 12px !important;
  line-height: 1.55 !important;
}
.ch-cm-track {
  margin: 10px 0 6px !important;
}
.ch-conf-pills .ch-cpill {
  background: none !important;
  border: 0 !important;
  border-left: 3px solid rgba(148, 163, 184, 0.35) !important;
  border-radius: 0 !important;
  padding: 4px 0 4px 12px !important;
  box-shadow: none !important;
}
.ch-conf-pills .ch-cpill.is-up { border-left-color: #34d399 !important; }
.ch-conf-pills .ch-cpill.is-dn { border-left-color: #fb7185 !important; }
.ch-conf-pills .ch-cpill.is-warn { border-left-color: #f5b73b !important; }
.dk-cor-track {
  margin: 22px 0 14px !important;
}
.range-bar {
  margin: 34px 0 30px !important;
}

/* ==========================================================================
   v67 — THAI TYPOGRAPHY ANTI-BLOAT LOCK (Audi 2026-10-21:
   "แล้วfontนี่ใช่ที่เรากำหนดรึยัง มันboldไปหมดแต่fontเล็กทำให้ดูอ้วนๆไม่น่าอ่าน")
   - Disable browser synthetic faux-bold (`font-synthesis: none`) globally
   - Keep `var(--font-head)` (`'Outfit', 'Sarabun', sans-serif`) strictly for large
     display headings (>= 1.25rem) at `font-weight: 600` (open Thai loop counters)
   - Route all sub-1.2rem kickers, chips, tabs, badges, row titles, and labels
     to `var(--font-body)` (`'Plus Jakarta Sans', 'Sarabun', sans-serif`) at
     `font-weight: 500`–`600` so small Thai text is crisp, airy, and effortless to read
   ========================================================================== */
html,
body,
h1, h2, h3, h4, h5, h6,
b, strong,
button, input, select, textarea,
.zone-pill, .zone-tag, .zone-step {
  font-synthesis: none !important;
  -webkit-font-smoothing: antialiased;
}

/* 1. Large Display Headings (>= 1.25rem): Sarabun / Outfit at 600 (NEVER 800 faux-bold) */
.dte-head h1,
.panel-head h2,
.guide-hero-copy h2,
.modal-head h2,
.zone-pill {
  font-family: var(--font-head) !important;
  font-weight: 600 !important;
}

/* 2. Card & Section Sub-Headings (1.02rem - 1.22rem): Crisp Sarabun + Plus Jakarta Sans at 600 */
.mk-box h3,
.gx-title,
.phase-head h3,
.ls-head b,
.card h3,
.qcard h3,
.tool-card h3,
.guide-why-card h3,
.guide-step-card h3,
.gr-head h3,
.gr-side h4,
.guide-glossary h3,
.uj-card-head h3,
.sc-card h3,
.sl-title,
.hcd-head h4,
.cdh-title,
.dk-verdict-copy .dk-dec-title,
.tbc-body h3,
.lqb-head h3,
.uj-sum-title b,
.mk-status .st-main b,
.ev-name {
  font-family: var(--font-body) !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em !important;
}

/* 3. Small Kickers, Chips, Pills, Tabs, Buttons & Meta Labels (< 1.0rem):
      Use var(--font-body) ('Plus Jakarta Sans', 'Sarabun') at 500-600 — NEVER fat Sarabun 700/800! */
.dte-kicker,
.owner-pill,
.dte-meta .owner-pill,
.dte-meta .view-mode-btn,
.gca-label,
.risk-kicker,
.tab,
.tab-group,
.btn,
.chip,
.filter,
.gx-seg button,
.card-eyebrow,
.gj-kicker,
.gj-title,
.hcb-item small,
.hcb-item b em,
.hcd-box-head b,
.hcd-txt b,
.hcd-hero-kicker,
.hcd-meta-tag,
.hcd-badge,
.hcd-more-fold > summary,
.log-more-fold > summary,
.log-spotlight-pill,
.log-spotlight-banner,
.gb-role,
.gb-hist-tag,
.gex-bars-head b,
.tug-battle .tug-side,
.tug-battle .tug-mid,
.fg-takeaway,
.fg-dial-label,
.ev-when,
.ev-leaf small,
.ev-impact small,
.guide-cta-badge,
.gh-stat small,
.gs-time,
.gg-tag,
.gg-item b,
.dst-txt b,
.go-phase-pill small,
.dk-cor-head,
.sc-tier-price,
.go-kpi-box small,
.go-master-toggle > summary,
.sl-help-toggle > summary,
.go-drawer-sec h5,
.sl-help-body p b,
.dk-ticket-more > summary,
.dk-toggle > summary,
.guide-toggle > summary,
.dk-strike-eyebrow,
.dk-ticket-sub,
.sc-plan-label,
.sc-plan-pill,
.sc-lbl,
.ch-fuel-badge,
.lqb-kicker,
.tbc-cta,
.ov-tile .ov-label,
.jstat small,
.gx-stat small,
.ls-c small,
.d-row dt,
.f-row label {
  font-family: var(--font-body) !important;
  font-weight: 600 !important;
}

/* 4. Numeric Values & Prices: Crisp Monospace / Display at 600-700 (NEVER 800 faux-bold) */
.spy-price,
.ov-tile .ov-num,
.jstat b,
.pnl,
.gx-stat b,
.gh-stat b,
.ev-leaf b,
.fg-score-num,
.dk-ticket-hero .dk-plan-strike,
.sc-main b {
  font-family: var(--font-head) !important;
  font-weight: 700 !important;
}

.gj-meta-item b,
.hcb-item b,
.hcd-row .hcd-px,
.hcd-px,
.hcd-gval,
.hcd-code,
.hcd-strike,
.gb-v,
.gb-k,
.pb-step-pct,
.go-kpi-box b,
#panel-levels .tm-box b,
#panel-levels .ls-context .ls-value,
.sc-tier-px b,
.dk-apill b,
.ch-cm-dot span,
#panel-chart .gx-stats .gx-stat b,
#panel-chart .wk-v, #panel-data .wk-v {
  font-family: var(--mono) !important;
  font-weight: 600 !important;
}

/* Light mode support for open architectural .zone-banner */
html[data-theme="light"] .zone-banner {
  background: none !important;
  border-bottom-color: rgba(180, 130, 35, 0.35) !important;
}
html[data-theme="light"] .zone-pill {
  color: #0f172a !important;
  background: none !important;
}
html[data-theme="light"] .zone-desc,
html[data-theme="light"] .zone-step {
  color: #334155 !important;
}

/* ==========================================================================
   v69 — FULL-WIDTH DUAL-BEAM FORCE CLASH ARENA (.spy-clash-arena)
         + 5-TIMEFRAME SIGNAL CONDUIT (.macd-flow-strip)
         + FULL-WIDTH S/R RANGE METER (.hcd-range-meter)
         + DUAL-SESSION QUOTE CLARITY (.t-reg-note)
   ========================================================================== */

/* 1. SPY Force-Field Clash Arena (100% Full-Width Energy Beam Collision) */
.spy-clash-arena {
  position: relative;
  margin: 12px 0 16px;
  padding: 16px 18px 14px;
  border-radius: 16px;
  background:
    radial-gradient(ellipse 55% 95% at 10% 50%, rgba(16, 185, 129, 0.16), transparent 72%),
    radial-gradient(ellipse 55% 95% at 90% 50%, rgba(244, 63, 94, 0.16), transparent 72%),
    linear-gradient(180deg, rgba(11, 18, 32, 0.92), rgba(7, 12, 22, 0.96));
  border: 1px solid rgba(148, 163, 184, 0.24);
  box-shadow: 0 12px 30px -12px rgba(0, 0, 0, 0.65);
  overflow: hidden;
}
.spy-clash-arena.is-bull-win {
  border-color: rgba(52, 211, 153, 0.42);
  box-shadow: 0 12px 30px -12px rgba(16, 185, 129, 0.28);
}
.spy-clash-arena.is-bear-win {
  border-color: rgba(251, 113, 133, 0.42);
  box-shadow: 0 12px 30px -12px rgba(244, 63, 94, 0.28);
}

.sca-fighters {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  margin-bottom: 12px;
}
.sca-fighter {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}
.sca-fighter.sca-bear {
  justify-content: flex-end;
  text-align: right;
}
.sca-crest {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
  flex-shrink: 0;
}
.sca-bull .sca-crest {
  background: linear-gradient(145deg, rgba(16, 185, 129, 0.22), rgba(6, 78, 59, 0.45));
  border: 1px solid rgba(52, 211, 153, 0.48);
  box-shadow: 0 0 16px rgba(16, 185, 129, 0.28);
}
.sca-bear .sca-crest {
  background: linear-gradient(145deg, rgba(244, 63, 94, 0.22), rgba(136, 19, 55, 0.45));
  border: 1px solid rgba(251, 113, 133, 0.48);
  box-shadow: 0 0 16px rgba(244, 63, 94, 0.28);
}
.sca-f-meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.sca-f-kicker {
  font-family: var(--mono) !important;
  font-size: 0.7rem;
  font-weight: 700 !important;
  letter-spacing: 0.05em;
  color: #94a3b8;
}
.sca-bull .sca-f-kicker { color: #6ee7b7; }
.sca-bear .sca-f-kicker { color: #fda4af; }
.sca-f-line {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.sca-f-line.is-right {
  justify-content: flex-end;
}
.sca-f-score {
  font-family: var(--font-body) !important;
  font-size: 0.96rem;
  font-weight: 600 !important;
  color: #f8fafc;
}
.sca-f-score b {
  font-family: var(--mono) !important;
  font-size: 1.08rem;
  font-weight: 700 !important;
}
.sca-f-pct {
  font-family: var(--font-body) !important;
  font-size: 0.8rem;
  color: #cbd5e1;
  padding: 1px 8px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.2);
}
.sca-f-pct b {
  font-family: var(--mono) !important;
  font-weight: 700 !important;
  color: #f8fafc;
}

.sca-center-badge {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 6px 16px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(24, 34, 56, 0.9), rgba(11, 18, 32, 0.95));
  border: 1px solid rgba(226, 201, 143, 0.45);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
  text-align: center;
}
.sca-vs-tag {
  font-family: var(--mono) !important;
  font-size: 0.66rem;
  font-weight: 700 !important;
  letter-spacing: 0.06em;
  color: #fbbf24;
}
.sca-verdict {
  font-family: var(--font-body) !important;
  font-size: 0.88rem;
  font-weight: 700 !important;
  color: #f8fafc;
  white-space: nowrap;
}

/* 100% Full-Width Dual-Beam Energy Bar */
.sca-energy-bar {
  position: relative;
  width: 100%;
  height: 38px;
  border-radius: 12px;
  background: rgba(5, 10, 20, 0.92);
  border: 1px solid rgba(148, 163, 184, 0.28);
  display: flex;
  align-items: stretch;
  overflow: visible;
  margin: 6px 0 12px;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.65);
}
.sca-beam {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
  overflow: hidden;
  transition: width 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}
.sca-beam.is-bull {
  border-radius: 11px 0 0 11px;
  background: linear-gradient(90deg, rgba(6, 95, 70, 0.88) 0%, rgba(16, 185, 129, 0.92) 72%, #34d399 100%);
  justify-content: space-between;
  padding: 0 22px 0 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 0 18px rgba(16, 185, 129, 0.32);
}
.sca-beam.is-bear {
  border-radius: 0 11px 11px 0;
  background: linear-gradient(270deg, rgba(136, 19, 55, 0.88) 0%, rgba(225, 29, 72, 0.92) 72%, #fb7185 100%);
  justify-content: space-between;
  padding: 0 14px 0 22px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), 0 0 18px rgba(244, 63, 94, 0.32);
}
.sca-beam-plasma {
  position: absolute;
  inset: 0 -28px;
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0.14) 0px,
    rgba(255, 255, 255, 0.14) 10px,
    transparent 10px,
    transparent 20px
  );
  background-size: 28px 28px;
  pointer-events: none;
  will-change: transform;
  backface-visibility: hidden;
}
.sca-beam.is-bull .sca-beam-plasma {
  animation: scaPlasmaRight 1s linear infinite;
}
.sca-beam.is-bear .sca-beam-plasma {
  animation: scaPlasmaLeft 1s linear infinite;
}
.sca-beam-pct {
  position: relative;
  z-index: 2;
  font-family: var(--mono) !important;
  font-size: 0.82rem;
  font-weight: 700 !important;
  color: #ffffff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.65);
  white-space: nowrap;
}
.sca-beam-arrows {
  position: relative;
  z-index: 2;
  font-family: var(--mono) !important;
  font-size: 1rem;
  font-weight: 700 !important;
  color: rgba(255, 255, 255, 0.88);
  letter-spacing: 2px;
}
.sca-beam.is-bull .sca-beam-arrows {
  animation: scaArrowPushRight 1.1s ease-in-out infinite;
}
.sca-beam.is-bear .sca-beam-arrows {
  animation: scaArrowPushLeft 1.1s ease-in-out infinite;
}

.sca-midline {
  position: absolute;
  left: 50%;
  top: -5px;
  bottom: -5px;
  width: 0;
  border-left: 1.5px dashed rgba(226, 201, 143, 0.55);
  z-index: 3;
  pointer-events: none;
}
.sca-midline i {
  position: absolute;
  bottom: -16px;
  left: 50%;
  transform: translateX(-50%);
  font-style: normal;
  font-family: var(--mono) !important;
  font-size: 0.62rem;
  color: #cbd5e1;
  white-space: nowrap;
  opacity: 0.78;
}

.sca-clash-core {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 36px;
  height: 36px;
  z-index: 5;
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  animation: scaCoreJitter 1.8s ease-in-out infinite alternate;
}
.sca-clash-flare {
  position: absolute;
  width: 6px;
  height: 52px;
  border-radius: 999px;
  background: linear-gradient(180deg, transparent, #ffffff, #fbbf24, #ffffff, transparent);
  box-shadow: 0 0 16px #fbbf24, 0 0 28px #ffffff;
}
.sca-clash-ring {
  position: absolute;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 2px solid rgba(251, 191, 36, 0.85);
}
.sca-clash-ring.r1 {
  animation: scaShockPulse 1.6s ease-out infinite;
}
.sca-clash-ring.r2 {
  animation: scaShockPulse 1.6s ease-out 0.8s infinite;
}
.sca-clash-hex {
  position: relative;
  z-index: 2;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: radial-gradient(circle, #ffffff 0%, #fde68a 55%, #f59e0b 100%);
  border: 2px solid #ffffff;
  box-shadow: 0 0 18px rgba(251, 191, 36, 0.95), 0 0 32px rgba(255, 255, 255, 0.65);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  line-height: 1;
}

@keyframes scaPlasmaRight {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(28px, 0, 0); }
}
@keyframes scaPlasmaLeft {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-28px, 0, 0); }
}
@keyframes scaArrowPushRight {
  0%, 100% { transform: translateX(-3px); opacity: 0.7; }
  50%      { transform: translateX(4px); opacity: 1; }
}
@keyframes scaArrowPushLeft {
  0%, 100% { transform: translateX(3px); opacity: 0.7; }
  50%      { transform: translateX(-4px); opacity: 1; }
}
@keyframes scaCoreJitter {
  0%   { transform: translate(calc(-50% - 4px), -50%) scale(0.98); }
  50%  { transform: translate(calc(-50% + 4px), -50%) scale(1.05); }
  100% { transform: translate(calc(-50% - 2px), -50%) scale(1); }
}
@keyframes scaShockPulse {
  0%   { transform: scale(0.75); opacity: 0.9; }
  100% { transform: scale(1.55); opacity: 0; }
}

/* Live Contributor Roster below the energy bar */
.sca-roster {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 14px;
  padding-top: 10px;
  margin-top: 4px;
  border-top: 1px dashed rgba(148, 163, 184, 0.18);
}
.sca-roster-side {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.sca-roster-side.is-pre {
  justify-content: flex-end;
}
.sca-r-lbl {
  font-family: var(--font-body) !important;
  font-size: 0.76rem;
  font-weight: 600 !important;
  color: #94a3b8;
  margin-right: 2px;
}
.sca-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  border-radius: 6px;
  font-family: var(--mono) !important;
  font-size: 0.74rem;
  font-weight: 600 !important;
}
.sca-tag.up {
  color: #6ee7b7;
  background: rgba(16, 185, 129, 0.14);
  border: 1px solid rgba(52, 211, 153, 0.32);
}
.sca-tag.dn {
  color: #fda4af;
  background: rgba(244, 63, 94, 0.14);
  border: 1px solid rgba(251, 113, 133, 0.32);
}
.sca-tag.muted {
  color: #94a3b8;
  background: rgba(148, 163, 184, 0.08);
}

/* 2. Dual-Session Quote Clarity (.t-reg-note) & Clean Sector Progress Bar */
.tile .t-reg-note {
  font-family: var(--mono) !important;
  font-size: 0.72rem;
  font-weight: 600 !important;
  color: #cbd5e1;
  background: rgba(15, 23, 42, 0.62);
  border-left: 2.5px solid rgba(148, 163, 184, 0.5);
  padding: 3px 8px;
  border-radius: 5px;
  margin: 4px 0 2px;
  white-space: nowrap;
}
.sector-track::before {
  display: none !important;
}

/* 3. Unified 5-Timeframe Signal Conduit (.macd-flow-strip) & Mini RSI Gauge (#mkMacd) */
.macd-flow-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 10px 0 14px;
  align-items: stretch;
}
.mfs-node {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 6px;
  padding: 12px 12px 10px;
  border-radius: 12px;
  background: rgba(11, 19, 35, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-top: 3px solid #64748b;
  min-width: 0;
}
.mfs-node:not(:last-child)::after {
  content: "➔";
  position: absolute;
  right: -9px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.72rem;
  color: rgba(226, 201, 143, 0.65);
  z-index: 2;
  pointer-events: none;
}
.mfs-node.is-up {
  border-top-color: #34d399;
  border-color: rgba(52, 211, 153, 0.32);
  background: radial-gradient(circle at 50% 0%, rgba(16, 185, 129, 0.14), transparent 70%), rgba(11, 19, 35, 0.84);
}
.mfs-node.is-dn,
.mfs-node.is-down {
  border-top-color: #fb7185;
  border-color: rgba(251, 113, 133, 0.32);
  background: radial-gradient(circle at 50% 0%, rgba(244, 63, 94, 0.14), transparent 70%), rgba(11, 19, 35, 0.84);
}
.mfs-node.is-core {
  box-shadow: 0 0 0 1px rgba(245, 183, 59, 0.42), 0 8px 20px -8px rgba(245, 183, 59, 0.28);
}
.mfs-role {
  font-size: 0.72rem;
  font-weight: 600 !important;
  color: #94a3b8;
  white-space: nowrap;
}
.mfs-node.is-core .mfs-role {
  color: #fbbf24;
}
.mfs-tf-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
}
.mfs-tf {
  font-family: var(--mono) !important;
  font-size: 1.08rem;
  font-weight: 700 !important;
  color: #f8fafc;
}
.mfs-bars {
  font-family: var(--mono) !important;
  font-size: 0.72rem;
  color: #94a3b8;
  white-space: nowrap;
}
.mfs-state {
  font-size: 0.82rem;
  font-weight: 600 !important;
  line-height: 1.3;
  white-space: nowrap;
}
.mfs-sub {
  font-family: var(--font-body) !important;
  font-size: 0.72rem;
  color: #94a3b8;
}

.mts-mini-gauge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.mts-mg-track {
  position: relative;
  width: 92px;
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(90deg, #34d399 0%, #38bdf8 50%, #fb7185 100%);
  opacity: 0.9;
}
.mts-mg-zone {
  position: absolute;
  top: 0;
  bottom: 0;
  border-left: 1px dashed rgba(255, 255, 255, 0.55);
  border-right: 1px dashed rgba(255, 255, 255, 0.55);
}
.mts-mg-dot {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #f8fafc;
  border: 2px solid #0f172a;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 6px rgba(255, 255, 255, 0.85);
}
.mts-mg-lbl {
  font-family: var(--mono) !important;
  font-size: 0.7rem;
  color: #94a3b8;
}
.macd-prose-toggle {
  margin-top: 8px;
}
.macd-prose-toggle > summary {
  cursor: pointer;
  font-size: 0.8rem;
  color: #94a3b8;
  user-select: none;
}

/* 4. Historical S/R Abbr Chip Strip & Full-Width Range Meter (#mkLevels) */
.gb-foot .gb-hist-tag {
  font-size: 0.62rem !important;
  padding: 1px 4px !important;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hcd-abbr-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 12px;
}
.hcd-abbr-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 6px;
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.18);
  font-size: 0.78rem;
  color: #cbd5e1;
}
.hcd-abbr-chip b {
  font-family: var(--mono) !important;
  font-weight: 700 !important;
  color: #e2c98f;
}
.hcd-abbr-chip.is-sync {
  color: #93c5fd;
  border-color: rgba(96, 165, 250, 0.28);
}
.hcd-range-meter {
  grid-column: 1 / -1;
  width: 100%;
  margin-top: 8px;
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(7, 13, 25, 0.75);
  border: 1px solid rgba(148, 163, 184, 0.18);
}
.hrm-labels {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-family: var(--mono) !important;
  font-size: 0.76rem;
  margin-bottom: 7px;
}
.hrm-spot-lbl {
  color: #fbbf24;
  font-weight: 700 !important;
}
.hrm-track {
  position: relative;
  height: 10px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.25);
  display: flex;
  overflow: visible;
}
.hrm-fill-sup {
  height: 100%;
  border-radius: 999px 0 0 999px;
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.35), rgba(52, 211, 153, 0.85));
}
.hrm-fill-res {
  height: 100%;
  border-radius: 0 999px 999px 0;
  background: linear-gradient(90deg, rgba(251, 113, 133, 0.85), rgba(244, 63, 94, 0.35));
}
.hrm-spot-pin {
  position: absolute;
  top: 50%;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fbbf24;
  border: 2.5px solid #ffffff;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 12px rgba(251, 191, 36, 0.95);
}

/* 5. Wall-Hit Accuracy Gauge Infographic (.thesis-infographic) & No-Trade Pill Strip (.ntc-pill-strip) */
.thesis-infographic {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px 16px !important;
}
.thi-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.thi-title {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.thi-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.thi-score {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  line-height: 1.1;
}
.thi-score b {
  font-family: var(--mono) !important;
  font-size: 1.45rem;
  font-weight: 700 !important;
  color: #34d399;
}
.thi-score small {
  font-size: 0.74rem;
  color: #94a3b8;
}
.thi-bar-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  overflow: hidden;
}
.thi-bar-track i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #10b981, #34d399, #fbbf24);
}
.thi-dots {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.thi-dot {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 6px;
  font-family: var(--mono) !important;
  font-size: 0.74rem;
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.2);
}
.thi-dot.is-hit {
  border-color: rgba(52, 211, 153, 0.35);
  color: #6ee7b7;
}
.ntc-pill-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 6px 0;
}
.ntc-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(15, 23, 42, 0.55);
  border: 1px solid rgba(148, 163, 184, 0.18);
  font-size: 0.76rem;
}
.ntc-pill small {
  color: #94a3b8;
}
.ntc-pill b {
  font-family: var(--mono) !important;
  color: #e2e8f0;
}
.ntc-pill.ntc-pill-gold b {
  color: #fbbf24;
}

@media (max-width: 860px) {
  .macd-flow-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .mfs-node::after {
    display: none !important;
  }
}
@media (max-width: 720px) {
  .sca-fighters {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .sca-fighter.sca-bear,
  .sca-f-line.is-right {
    justify-content: flex-start;
    text-align: left;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sca-beam-plasma,
  .sca-beam-arrows,
  .sca-clash-core,
  .sca-clash-ring.r1,
  .sca-clash-ring.r2 {
    animation: none !important;
  }
}

/* ==========================================================================
   v70 — 3-COLUMN OPENING GAP JOURNEY KPI DECK (.gj-kpi-strip) & PLAIN THAI
   ========================================================================== */
.gj-head-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 14px;
  margin-bottom: 10px;
}
.gj-kicker {
  font-family: var(--font-head) !important;
  font-size: 0.94rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
}
.gj-kicker-sub {
  font-family: var(--font-body) !important;
  font-size: 0.78rem;
  color: #94a3b8;
}
.gj-kpi-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 12px;
}
.gj-kpi-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 4px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(11, 19, 35, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-left: 3.5px solid #60a5fa;
  min-width: 0;
}
.gj-kpi-card.is-up {
  border-left-color: #34d399;
  border-color: rgba(52, 211, 153, 0.28);
  background: linear-gradient(145deg, rgba(16, 185, 129, 0.1), rgba(11, 19, 35, 0.85));
}
.gj-kpi-card.is-dn {
  border-left-color: #fb7185;
  border-color: rgba(251, 113, 133, 0.28);
  background: linear-gradient(145deg, rgba(244, 63, 94, 0.1), rgba(11, 19, 35, 0.85));
}
.gj-kpi-card.is-gold {
  border-left-color: #fbbf24;
  border-color: rgba(245, 183, 59, 0.3);
  background: linear-gradient(145deg, rgba(245, 183, 59, 0.1), rgba(11, 19, 35, 0.85));
}
.gj-kpi-lbl {
  font-family: var(--font-body) !important;
  font-size: 0.75rem;
  font-weight: 600 !important;
  color: #94a3b8;
}
.gj-kpi-val {
  font-family: var(--mono) !important;
  font-size: 1.05rem;
  font-weight: 700 !important;
  color: #f8fafc;
  line-height: 1.25;
}
.gj-kpi-val small {
  font-size: 0.78rem;
  font-weight: 600 !important;
  opacity: 0.9;
}
.gj-kpi-sub {
  font-family: var(--font-body) !important;
  font-size: 0.76rem;
  color: #cbd5e1;
}
.gj-kpi-sub b {
  font-family: var(--mono) !important;
  font-weight: 700 !important;
  color: #f8fafc;
}
.gj-kpi-badge {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  font-family: var(--font-body) !important;
  font-size: 0.73rem;
  font-weight: 600 !important;
  margin-top: 2px;
}
.gj-kpi-badge.c-up   { color: #6ee7b7; }
.gj-kpi-badge.c-down { color: #fda4af; }
.gj-kpi-badge.c-warn { color: #fcd34d; }
.gj-kpi-badge.c-flat { color: #cbd5e1; }

.gj-rng-bar {
  position: relative;
  height: 7px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.9);
  border: 1px solid rgba(148, 163, 184, 0.22);
  margin: 3px 0 2px;
  overflow: visible;
}
.gj-rng-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #34d399, #fbbf24);
}
.gj-rng-norm {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 2px;
  background: #ffffff;
  border-radius: 2px;
  box-shadow: 0 0 4px rgba(255, 255, 255, 0.9);
}

@media (max-width: 780px) {
  .gj-kpi-strip {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   v70 GPU Hover & Offscreen Lifecycle Optimization
   - Pauses continuous Clash Arena animations when offscreen (.is-offscreen),
     paused (html[data-motion="paused"] / body.paused), or reduced-motion.
   - Promotes interactive 0DTE cards, tiles, and tabs onto GPU layers so hover
     and tab transitions stay 60-120 FPS smooth.
   ========================================================================== */
.spy-clash-arena.is-offscreen :is(.sca-beam-plasma, .sca-beam-arrows, .sca-clash-core, .sca-clash-ring),
html[data-motion="paused"] .spy-clash-arena :is(.sca-beam-plasma, .sca-beam-arrows, .sca-clash-core, .sca-clash-ring),
body.paused .spy-clash-arena :is(.sca-beam-plasma, .sca-beam-arrows, .sca-clash-core, .sca-clash-ring) {
  animation-play-state: paused !important;
}
@media (prefers-reduced-motion: reduce) {
  .spy-clash-arena :is(.sca-beam-plasma, .sca-beam-arrows, .sca-clash-core, .sca-clash-ring) {
    animation: none !important;
  }
}
:is(.ov-tile, .card, .tool-card, .tab, .btn, .mfs-node, .tile) {
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* ==========================================================================
   v72 — ARCHITECTURAL ANTI-BOX & GIANT ZONE TYPOGRAPHY OVERHAUL
   (Audi 2026-10-21: "คือ ช่วยออกแบบให้มันดีขึ้นหน่อยได้ไหม? ทำไมฉันเข้ามารู้สึกว่ามันยัง
   เหมือนเปิดเจอแต่กล่องและปุ่มสีทอง? และทำไมตรง ⚡ โซนที่ 1 · สัญญาณตัดสินใจหลัก
   ทำไมไม่ทำเป็นตัวหนังสือใหญ่ๆ เพื่อจะได้แบ่งโซนไปเลยอ่ะ?")
   1. Frameless Top Hero & #sessionSummary (Zero outer gold box around 4 KPI cards)
   2. De-Gold Buttons & Tabs (Clean single-layer tab bar, zero capsule-in-box, sky/cyan active state)
   3. Frameless .mk-status live status bar
   4. Giant Architectural Zone Headings (.zone-banner / .zone-tag / .zone-pill)
      with frameless overline + 2.25rem display typography instead of gold pill boxes
   ========================================================================== */

/* 1. De-Gold Hero & Frameless #sessionSummary (Zero Box-in-Box) */
.dte-head .dte-kicker {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  color: #38bdf8 !important;
  font-size: 0.84rem !important;
  letter-spacing: 0.04em !important;
}
.dte-head h1 em {
  color: var(--aku-cyan, #38bdf8) !important;
  font-style: normal;
}
.dte-meta .view-mode-btn,
.dte-meta .history-pill-btn {
  background: rgba(15, 23, 42, 0.5) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  color: #cbd5e1 !important;
  box-shadow: none !important;
}
.dte-meta .view-mode-btn:hover,
.dte-meta .history-pill-btn:hover {
  border-color: rgba(56, 189, 248, 0.45) !important;
  color: #f8fafc !important;
}

.dte-session {
  background: none !important;
  border: 0 !important;
  border-top: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
.dte-session > .session-heading {
  padding: 0 0 10px !important;
  margin-bottom: 12px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
  color: #cbd5e1 !important;
}
.dte-session > .session-heading span {
  color: var(--dte-dim) !important;
  font-size: 0.8rem !important;
}
.ov-tile {
  background: rgba(11, 18, 32, 0.65) !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-left: 3.5px solid var(--accent, #38bdf8) !important;
}

/* 2. Frameless Compact Top Context Ribbon (No Giant CTA Boxes Above Tab Bar) */
.dte-top-ribbon {
  background: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.14) !important;
  border-radius: 0 !important;
  padding: 10px 0 2px !important;
  margin-top: 4px !important;
}
.dte-top-ribbon .guide-cta-bar {
  gap: 14px !important;
}
.dte-top-ribbon .guide-cta-btn {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px dashed rgba(56, 189, 248, 0.4) !important;
  border-radius: 0 !important;
  padding: 2px 0 !important;
  min-height: 0 !important;
  box-shadow: none !important;
  color: #93c5fd !important;
}
.dte-top-ribbon .guide-cta-btn.is-journal {
  border-bottom-color: rgba(52, 211, 153, 0.4) !important;
  color: #6ee7b7 !important;
}
.dte-top-ribbon .guide-cta-btn .gca-kicker {
  display: none !important;
}
.dte-top-ribbon .guide-cta-btn .gca-label {
  font-size: 0.84rem !important;
  color: inherit !important;
}

/* 3. Single-Layer Tab Bar (.dte-tab-shell) — Zero Capsule-in-Box, Zero Gold Borders */
.dte-tab-shell {
  background: rgba(10, 17, 30, 0.88) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 14px !important;
  padding: 5px 8px !important;
}
.dte-tab-shell .tab,
.dte-tab-shell .tab.tab-guide-btn,
.dte-tab-shell .tab.tab-highlight,
body.is-owner-view .dte-tab-shell .tab.owner-tab {
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  color: #94a3b8 !important;
  box-shadow: none !important;
}
.dte-tab-shell .tab:hover {
  background: rgba(148, 163, 184, 0.1) !important;
  color: #f1f5f9 !important;
}
.dte-tab-shell .tab[aria-selected="true"],
.dte-tab-shell .tab.tab-guide-btn[aria-selected="true"],
.dte-tab-shell .tab.tab-highlight[aria-selected="true"],
body.is-owner-view .dte-tab-shell .tab.owner-tab[aria-selected="true"] {
  background: rgba(56, 189, 248, 0.15) !important;
  border-color: rgba(56, 189, 248, 0.45) !important;
  color: #f8fafc !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 10px rgba(14, 165, 233, 0.18) !important;
}
.dte-tab-shell .tab-sep,
.dte-tab-shell .tab-sep.owner-tab {
  background: rgba(148, 163, 184, 0.18) !important;
  width: 1px !important;
  flex: 0 0 1px !important;
}

/* 4. De-Gold Primary Action Buttons (.btn-primary) -> Modern Sky/Cyan Glass */
.btn-primary {
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.22), rgba(56, 189, 248, 0.12)) !important;
  border: 1px solid rgba(56, 189, 248, 0.48) !important;
  color: #e0f2fe !important;
  box-shadow: 0 4px 14px rgba(14, 165, 233, 0.15) !important;
}
.btn-primary:hover {
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.32), rgba(56, 189, 248, 0.2)) !important;
  border-color: rgba(125, 211, 252, 0.75) !important;
  color: #ffffff !important;
}

/* 5. Frameless Live Market Status Bar (.mk-status) */
.mk-status {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 0 !important;
  padding: 6px 0 12px !important;
  margin-bottom: 8px !important;
  box-shadow: none !important;
}

/* 6. GIANT ARCHITECTURAL ZONE HEADINGS (.zone-banner, .zone-tag, .zone-pill)
      Frameless overline + Huge Bold Display Typography to divide zones cleanly */
.zone-banner {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  justify-content: center !important;
  gap: 12px 24px !important;
  margin: 36px 0 22px !important;
  padding: 6px 0 16px 18px !important;
  border: 0 !important;
  border-left: 5px solid #38bdf8 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
}
.zone-banner.zone-secondary {
  margin-top: 44px !important;
  border-left-color: #34d399 !important;
  border-bottom-color: rgba(148, 163, 184, 0.18) !important;
}
.zone-head-left {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 4px !important;
  min-width: 0;
}
.zone-tag {
  display: inline-block !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  font-family: var(--font-head) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #38bdf8 !important;
}
.zone-banner.zone-secondary .zone-tag {
  background: none !important;
  color: #34d399 !important;
}
.zone-pill {
  font-family: var(--font-body) !important;
  font-size: clamp(1.75rem, 2.5vw, 2.15rem) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
  color: #ffffff !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
}
.zone-steps {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px 16px !important;
  padding-bottom: 2px !important;
}
.zone-step {
  font-size: 0.86rem !important;
  color: #94a3b8 !important;
}
.zone-step i {
  color: #38bdf8 !important;
}
.zone-banner.zone-secondary .zone-step i {
  color: #34d399 !important;
}
@media (max-width: 640px) {
  .zone-pill {
    font-size: 1.5rem !important;
  }
}

/* 7. Frameless Sub-Tab Strips (#deskSubTabs, .gx-sec-tabs, .ch-sec-tabs) & Sky-Blue #mkSpy Top Border */
#deskSubTabs.desk-subtabs,
#panel-gex .gx-sec-tabs.desk-subtabs,
#panel-chart .ch-sec-tabs.desk-subtabs {
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}
#deskSubTabs .desk-subtab,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 3px solid transparent !important;
  border-radius: 0 !important;
  padding: 10px 8px 12px !important;
  box-shadow: none !important;
}
#deskSubTabs .desk-subtab[aria-selected="true"],
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab[aria-selected="true"],
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab[aria-selected="true"] {
  background: linear-gradient(180deg, transparent, rgba(56, 189, 248, 0.08)) !important;
  border: 0 !important;
  border-bottom: 3px solid #38bdf8 !important;
  color: #f8fafc !important;
  box-shadow: none !important;
}
#deskSubTabs .desk-subtab[aria-selected="true"] .dst-txt b,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab[aria-selected="true"] .dst-txt b,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab[aria-selected="true"] .dst-txt b {
  color: #7dd3fc !important;
}
#mkSpy {
  border-top-color: #38bdf8 !important;
}

/* ==========================================================================
   V73 — WEIGHTED SPY FORCE CLASH (ZERO CAPSULE-IN-CAPSULE) + 16-BIT PIXEL
   COMPANIONS + 12 SPY HEAVYWEIGHTS + THAI-TRANSLATED 24H NEWS DESK
   ========================================================================== */

/* 8. Eliminate Capsule-in-Capsule Inside .spy-clash-arena (Audi 2026-10-21) */
.spy-clash-arena .sca-center-badge {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 2px 10px !important;
  box-shadow: none !important;
  gap: 4px !important;
}
.spy-clash-arena .sca-vs-tag {
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em !important;
  color: #94a3b8 !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
}
.spy-clash-arena .sca-verdict {
  font-family: var(--font-body) !important;
  font-size: 1.18rem !important;
  font-weight: 800 !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
}
.spy-clash-arena .sca-f-pct {
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  font-size: 0.84rem !important;
  color: #cbd5e1 !important;
}
.spy-clash-arena .sca-f-pct b {
  font-family: var(--mono);
  font-size: 0.96rem;
  color: #ffffff;
}

/* 9. 16-Bit Pixel Art Companions (.pixel16-companion, .sca-pixel-avatar) */
.dte-intro-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.dte-pixel-duo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.zone-tag-row {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
.pixel16-companion,
.sca-pixel-avatar {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  object-fit: contain;
  flex-shrink: 0;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.45));
  transition: transform 0.2s ease;
}
.pixel16-companion:hover,
.sca-pixel-avatar:hover {
  transform: translateY(-2px) scale(1.06);
}
.sca-avatar-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sca-avatar-wrap .sca-pixel-avatar {
  width: 48px;
  height: 48px;
}
.sca-avatar-wrap .sca-crest {
  position: absolute;
  right: -6px;
  bottom: -4px;
  width: 24px !important;
  height: 24px !important;
  font-size: 0.85rem !important;
  border-radius: 50% !important;
  background: #0b1324 !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
}

/* 10. Frameless Weighted SPY Force Breakdown (.sca-weight-deck) */
.sca-weight-deck {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 24px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
}
.sca-weight-col {
  min-width: 0;
}
.sca-weight-col.is-pre {
  border-left: 1px solid rgba(148, 163, 184, 0.16);
  padding-left: 20px;
}
.sca-w-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.sca-w-head .sca-r-lbl {
  font-family: var(--font-body);
  font-size: 0.84rem;
  font-weight: 700;
  color: #e2e8f0;
}
.sca-w-sum {
  font-family: var(--mono);
  font-size: 0.8rem;
  font-weight: 700;
}
.sca-w-sum.up { color: #6ee7b7; }
.sca-w-sum.dn { color: #fda4af; }
.sca-w-list {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.sca-w-row {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.sca-w-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  font-size: 0.82rem;
}
.sca-w-sym b {
  font-family: var(--mono);
  font-weight: 700;
  color: #f8fafc;
}
.sca-w-sym small {
  font-size: 0.75rem;
  color: #94a3b8;
  margin-left: 4px;
}
.sca-w-chg {
  font-family: var(--mono);
  font-size: 0.8rem;
  font-weight: 700;
}
.sca-w-chg.up { color: #6ee7b7; }
.sca-w-chg.dn { color: #fda4af; }
.sca-w-track {
  display: block;
  height: 4px;
  width: 100%;
  background: rgba(148, 163, 184, 0.12);
  border-radius: 999px;
  overflow: hidden;
}
.sca-w-row.is-up .sca-w-track i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #10b981, #34d399);
  border-radius: 999px;
}
.sca-w-row.is-dn .sca-w-track i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #f43f5e, #fb7185);
  border-radius: 999px;
}
.sca-w-empty {
  font-size: 0.8rem;
  color: var(--dte-dim);
  padding: 4px 0;
}
.sca-weight-footnote {
  margin-top: 12px;
  padding-top: 9px;
  border-top: 1px dashed rgba(148, 163, 184, 0.16);
  font-size: 0.79rem;
  line-height: 1.55;
  color: #94a3b8;
}
.sca-weight-footnote b {
  color: #cbd5e1;
}
@media (max-width: 760px) {
  .sca-weight-deck {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .sca-weight-col.is-pre {
    border-left: 0;
    padding-left: 0;
    border-top: 1px solid rgba(148, 163, 184, 0.16);
    padding-top: 12px;
  }
}

/* 11. 12-Stock Heavyweight Mega-Cap Impact Bar & Asset Role Meta */
.t-role-meta {
  font-size: 0.73rem;
  color: #94a3b8;
  margin-top: 2px;
  line-height: 1.35;
}
.mega-weight-strip {
  margin: 0 0 12px;
  padding: 10px 0 12px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
}
.mws-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 14px;
  flex-wrap: wrap;
  font-size: 0.82rem;
  color: #cbd5e1;
  margin-bottom: 6px;
}
.mws-pct {
  font-family: var(--mono);
  font-size: 0.82rem;
}
.mws-track {
  display: flex;
  height: 7px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(148, 163, 184, 0.16);
}
.mws-track i.is-up {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #059669, #34d399);
}
.mws-track i.is-dn {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #fb7185, #e11d48);
}

/* 12. Thai-Translated 24h News Rows (#mkNews) */
.news-topic-tag {
  font-family: var(--font-body);
  font-size: 0.76rem;
  font-weight: 600;
  color: #7dd3fc;
}
.news-th-link {
  display: flex;
  flex-direction: column;
  gap: 3px;
  text-decoration: none !important;
}
.news-th-title {
  display: block;
  font-family: var(--font-body);
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.48;
  color: #f8fafc;
}
.news-th-link:hover .news-th-title {
  color: #7dd3fc;
  text-decoration: underline;
}
.news-en-sub {
  display: block;
  font-family: var(--font-body);
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1.4;
  color: #94a3b8;
}

/* ==========================================================================
   V74: RESTORED GEX S/R ON #panel-market + MIRROR SYNC FOR #panel-levels
   + ANIMATED 16-BIT KUNGKI (LEFT->RIGHT) VS POOJANG (RIGHT->LEFT) HAND-PUSH DUEL
   ========================================================================== */

/* 1. Mirror Sync Rules so #deskSpyMirror, #deskMacdMirror, #deskLevelsMirror match #mkSpy, #mkMacd, #mkLevels */
#deskSpyMirror,
#deskMacdMirror {
  background: var(--zone1-bg);
  border: 1px solid rgba(56, 189, 248, 0.32);
  border-top: 3px solid #38bdf8;
  border-radius: 18px;
  padding: 20px 22px;
  box-shadow: var(--zone1-shadow);
}
#deskMacdMirror {
  border-color: rgba(52, 211, 153, 0.34);
  border-top-color: #34d399;
}
#deskSpyMirror .spy-price {
  font-family: var(--font-head);
  font-size: 3rem;
  font-weight: 800;
  line-height: 1.2;
  color: #f8fafc;
}
#deskSpyMirror .spy-chg {
  font-size: 1.12rem;
  font-weight: 700;
}
#deskSpyMirror .stat-row.stat-row-runs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 20px;
  margin-top: 14px;
}
#deskLevelsMirror {
  background: var(--zone1-bg);
  border: 1px solid rgba(56, 189, 248, 0.3);
  border-top: 3px solid #38bdf8;
  border-radius: 18px;
  padding: 22px 24px;
  box-shadow: var(--zone1-shadow);
}
#deskLevelsMirror .lvl-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}
#deskLevelsMirror .stat:nth-child(1),
#deskLevelsMirror .stat:nth-child(2),
#deskLevelsMirror .stat:nth-child(3) {
  border-radius: 14px;
  padding: 14px 16px;
  border: 1px solid rgba(148, 163, 184, 0.22);
}
#deskLevelsMirror .stat:nth-child(1) {
  border-left: 4px solid #34d399;
  background: linear-gradient(145deg, rgba(16, 185, 129, 0.14), rgba(15, 23, 42, 0.72));
}
#deskLevelsMirror .stat:nth-child(2) {
  border-left: 4px solid #fb7185;
  background: linear-gradient(145deg, rgba(244, 63, 94, 0.14), rgba(15, 23, 42, 0.72));
}
#deskLevelsMirror .stat:nth-child(3) {
  border-left: 4px solid #38bdf8;
  background: linear-gradient(145deg, rgba(56, 189, 248, 0.14), rgba(15, 23, 42, 0.72));
}
#deskLevelsMirror .stat:nth-child(5) {
  grid-column: span 2;
}
#deskLevelsMirror .gex-bars {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(38px, 1fr));
  gap: 6px;
  height: 220px;
  align-items: stretch;
  margin-top: 14px;
  padding: 10px 6px;
}
#deskLevelsMirror .gex-bars .gb {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  min-width: 0;
}
#deskLevelsMirror .gex-bars .gb .gb-track {
  position: relative;
  flex: 1;
  width: 100%;
}
#deskLevelsMirror .gex-bars .gb .gb-track i {
  position: absolute;
  left: 22%;
  right: 22%;
  border-radius: 4px;
}
#deskLevelsMirror .gex-bars .gb .gb-v {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--mono);
  font-size: 0.68rem;
  font-weight: 700;
  font-style: normal;
  white-space: nowrap;
}
@media (max-width: 900px) {
  #deskSpyMirror,
  #deskMacdMirror {
    grid-column: 1 / -1;
  }
  #deskLevelsMirror .lvl-list {
    grid-template-columns: 1fr !important;
  }
  #deskLevelsMirror .stat:nth-child(5) {
    grid-column: auto;
  }
}

/* 2. Animated 16-Bit Kungki vs Poojang Beam-Push Duel Stage (.sca-battle-stage) */
.sca-battle-stage {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 12px 0 6px;
  padding: 12px 10px 8px;
  border-radius: 16px;
  background: radial-gradient(circle at var(--clash, 50%) 50%, rgba(250, 204, 21, 0.1), rgba(15, 23, 42, 0.55) 68%);
  border: 1px solid rgba(148, 163, 184, 0.16);
  position: relative;
  overflow: hidden;
}
.sca-battle-stage .sca-energy-bar {
  flex: 1 1 auto;
  min-width: 160px;
  margin: 0 !important;
  z-index: 2;
}
.sca-duelist {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  position: relative;
  z-index: 4;
}
.sca-char-rig {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
}
.sca-sprite-stack {
  position: relative;
  width: 60px;
  height: 60px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.sca-char-sprite {
  width: 60px;
  height: 60px;
  object-fit: contain;
  image-rendering: pixelated;
  image-rendering: crisp-edges;
  filter: drop-shadow(0 5px 10px rgba(0, 0, 0, 0.55));
  pointer-events: none;
  user-select: none;
}
.sca-char-sprite.is-flip-x {
  transform: scaleX(-1);
}
.sca-sprite-stack .frame-b {
  position: absolute;
  inset: 0;
  opacity: 0;
}

/* Two-frame 16-bit sprite pose alternation + body lunge */
.sca-char-rig.is-kungki .sca-sprite-stack {
  animation: kungkiBodyLunge 0.68s ease-in-out infinite;
  transform-origin: 50% 85%;
}
.sca-char-rig.is-poojang .sca-sprite-stack {
  animation: poojangBodyLunge 0.68s ease-in-out infinite;
  transform-origin: 50% 85%;
}
.sca-sprite-stack .frame-a {
  animation: scaPoseFrameA 1.36s steps(1, end) infinite;
}
.sca-sprite-stack .frame-b {
  animation: scaPoseFrameB 1.36s steps(1, end) infinite;
}

/* Articulated 16-bit Pushing Hands / Claws SVG Rig */
.sca-push-rig {
  width: 64px;
  height: 52px;
  flex-shrink: 0;
  overflow: visible;
  filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.5));
  z-index: 5;
}
.sca-push-rig.is-bull {
  margin-left: -10px;
  margin-right: -6px;
}
.sca-push-rig.is-bear {
  margin-left: -6px;
  margin-right: -10px;
}
.sca-push-rig.is-bull .rig-hand.hand-top {
  animation: kungkiHandPushR1 0.52s cubic-bezier(0.28, 0.92, 0.38, 1) infinite;
}
.sca-push-rig.is-bull .rig-hand.hand-bot {
  animation: kungkiHandPushR2 0.52s cubic-bezier(0.28, 0.92, 0.38, 1) infinite;
}
.sca-push-rig.is-bear .rig-hand.hand-top {
  animation: poojangHandPushL1 0.52s cubic-bezier(0.28, 0.92, 0.38, 1) infinite;
}
.sca-push-rig.is-bear .rig-hand.hand-bot {
  animation: poojangHandPushL2 0.52s cubic-bezier(0.28, 0.92, 0.38, 1) infinite;
}

/* Pixel Force Shockwaves shooting out of Kungki's & Poojang's palms */
.sca-push-rig.is-bull .rig-wave.w1 {
  animation: scaPalmWaveR 0.62s ease-out infinite;
}
.sca-push-rig.is-bull .rig-wave.w2 {
  animation: scaPalmWaveR 0.62s ease-out 0.18s infinite;
}
.sca-push-rig.is-bull .rig-wave.w3 {
  animation: scaPalmWaveR 0.62s ease-out 0.36s infinite;
}
.sca-push-rig.is-bear .rig-wave.w1 {
  animation: scaPalmWaveL 0.62s ease-out infinite;
}
.sca-push-rig.is-bear .rig-wave.w2 {
  animation: scaPalmWaveL 0.62s ease-out 0.18s infinite;
}
.sca-push-rig.is-bear .rig-wave.w3 {
  animation: scaPalmWaveL 0.62s ease-out 0.36s infinite;
}

/* Pixel Ground Dust Puffs under Boots */
.sca-dust {
  position: absolute;
  bottom: 1px;
  display: inline-flex;
  gap: 3px;
  pointer-events: none;
}
.sca-dust.is-bull {
  left: -4px;
}
.sca-dust.is-bear {
  right: -4px;
}
.sca-dust i {
  display: block;
  width: 5px;
  height: 5px;
  background: #cbd5e1;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.65);
  opacity: 0;
}
.sca-dust.is-bull i.d1 { animation: scaDustKickL 0.68s ease-out infinite; }
.sca-dust.is-bull i.d2 { animation: scaDustKickL 0.68s ease-out 0.2s infinite; width: 4px; height: 4px; }
.sca-dust.is-bull i.d3 { animation: scaDustKickL 0.68s ease-out 0.38s infinite; width: 3px; height: 3px; }
.sca-dust.is-bear i.d1 { animation: scaDustKickR 0.68s ease-out infinite; }
.sca-dust.is-bear i.d2 { animation: scaDustKickR 0.68s ease-out 0.2s infinite; width: 4px; height: 4px; }
.sca-dust.is-bear i.d3 { animation: scaDustKickR 0.68s ease-out 0.38s infinite; width: 3px; height: 3px; }

/* Status Badges & Sweat Drops on Winning vs Straining Duelist */
.sca-fx-badge {
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  display: inline-block;
  margin-bottom: 2px;
  font-family: var(--font-body);
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1;
  padding: 3px 7px;
  border-radius: 999px;
  white-space: nowrap;
  z-index: 6;
  pointer-events: none;
}
.sca-fx-badge.is-fire {
  background: rgba(16, 185, 129, 0.22);
  color: #6ee7b7;
  border: 1px solid rgba(52, 211, 153, 0.55);
  animation: scaBadgePulse 0.9s ease-in-out infinite alternate;
}
.sca-fx-badge.is-fire-bear {
  background: rgba(244, 63, 94, 0.24);
  color: #fda4af;
  border: 1px solid rgba(251, 113, 133, 0.55);
  animation: scaBadgePulse 0.9s ease-in-out infinite alternate;
}
.sca-fx-badge.is-sweat {
  background: rgba(56, 189, 248, 0.18);
  color: #bae6fd;
  border: 1px solid rgba(56, 189, 248, 0.45);
}
.sca-sweat-drops {
  position: absolute;
  top: 2px;
  left: -4px;
  width: 14px;
  height: 18px;
  pointer-events: none;
  z-index: 6;
}
.sca-sweat-drops.is-right {
  left: auto;
  right: -4px;
}
.sca-sweat-drops i {
  position: absolute;
  width: 4px;
  height: 6px;
  background: #38bdf8;
  border-radius: 1px;
  box-shadow: 0 0 0 1px #0f172a;
  animation: scaSweatFly 0.75s ease-out infinite;
}
.sca-sweat-drops i:nth-child(2) {
  top: 7px;
  left: 5px;
  animation-delay: 0.32s;
}
.sca-duelist-tag {
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1.2;
  white-space: nowrap;
}
.sca-duelist-tag.is-bull {
  color: #6ee7b7;
}
.sca-duelist-tag.is-bear {
  color: #fda4af;
}

/* Header Avatars also bob in rhythm with the duel */
.spy-clash-arena .sca-bull .sca-pixel-avatar {
  animation: kungkiHeaderBob 0.68s ease-in-out infinite;
}
.spy-clash-arena .sca-bear .sca-pixel-avatar {
  animation: poojangHeaderBob 0.68s ease-in-out infinite;
}

/* Keyframes for Kungki (Left -> Right) & Poojang (Right -> Left) Hand-Push Duel */
@keyframes kungkiBodyLunge {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-3deg); }
  45% { transform: translate3d(5px, -2px, 0) rotate(5deg) scale(1.03); }
}
@keyframes poojangBodyLunge {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(3deg); }
  45% { transform: translate3d(-5px, -2px, 0) rotate(-5deg) scale(1.03); }
}
@keyframes scaPoseFrameA {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}
@keyframes scaPoseFrameB {
  0%, 49% { opacity: 0; }
  50%, 100% { opacity: 1; }
}
@keyframes kungkiHandPushR1 {
  0%, 100% { transform: translate3d(-3px, 1px, 0) scale(0.95); }
  50% { transform: translate3d(10px, -1px, 0) scale(1.08); }
}
@keyframes kungkiHandPushR2 {
  0%, 100% { transform: translate3d(9px, -1px, 0) scale(1.08); }
  50% { transform: translate3d(-3px, 1px, 0) scale(0.95); }
}
@keyframes poojangHandPushL1 {
  0%, 100% { transform: translate3d(3px, 1px, 0) scale(0.95); }
  50% { transform: translate3d(-10px, -1px, 0) scale(1.08); }
}
@keyframes poojangHandPushL2 {
  0%, 100% { transform: translate3d(-9px, -1px, 0) scale(1.08); }
  50% { transform: translate3d(3px, 1px, 0) scale(0.95); }
}
@keyframes scaPalmWaveR {
  0% { transform: translate3d(-6px, 0, 0) scaleY(0.75); opacity: 0.95; }
  75% { transform: translate3d(8px, 0, 0) scaleY(1.08); opacity: 0.85; }
  100% { transform: translate3d(13px, 0, 0) scaleY(1.16); opacity: 0; }
}
@keyframes scaPalmWaveL {
  0% { transform: translate3d(6px, 0, 0) scaleY(0.75); opacity: 0.95; }
  75% { transform: translate3d(-8px, 0, 0) scaleY(1.08); opacity: 0.85; }
  100% { transform: translate3d(-13px, 0, 0) scaleY(1.16); opacity: 0; }
}
@keyframes scaDustKickL {
  0% { transform: translate3d(4px, 0, 0) scale(0.6); opacity: 0.85; }
  100% { transform: translate3d(-10px, -6px, 0) scale(1.25); opacity: 0; }
}
@keyframes scaDustKickR {
  0% { transform: translate3d(-4px, 0, 0) scale(0.6); opacity: 0.85; }
  100% { transform: translate3d(10px, -6px, 0) scale(1.25); opacity: 0; }
}
@keyframes scaSweatFly {
  0% { transform: translate3d(0, 0, 0) scale(0.7); opacity: 0.95; }
  100% { transform: translate3d(-6px, -8px, 0) scale(1.1); opacity: 0; }
}
@keyframes scaBadgePulse {
  0% { transform: translateY(0) scale(1); }
  100% { transform: translateY(-2px) scale(1.05); }
}
@keyframes kungkiHeaderBob {
  0%, 100% { transform: translateX(0) rotate(-2deg); }
  50% { transform: translateX(3px) rotate(4deg); }
}
@keyframes poojangHeaderBob {
  0%, 100% { transform: translateX(0) rotate(2deg); }
  50% { transform: translateX(-3px) rotate(-4deg); }
}

/* Pause animations when motion is paused or reduced */
html[data-motion="paused"] .sca-battle-stage *,
.spy-clash-arena.is-offscreen .sca-battle-stage * {
  animation-play-state: paused !important;
}
@media (prefers-reduced-motion: reduce) {
  .sca-battle-stage *,
  .spy-clash-arena .sca-pixel-avatar {
    animation: none !important;
  }
}

/* Light theme support for .sca-battle-stage & #desk*Mirror */
html[data-theme="light"] .sca-battle-stage {
  background: radial-gradient(circle at var(--clash, 50%) 50%, rgba(245, 158, 11, 0.1), rgba(241, 245, 249, 0.85) 70%);
  border-color: rgba(100, 116, 139, 0.24);
}
html[data-theme="light"] .sca-fx-badge.is-fire { background: rgba(16, 185, 129, 0.16); color: #065f46; }
html[data-theme="light"] .sca-fx-badge.is-fire-bear { background: rgba(244, 63, 94, 0.16); color: #9f1239; }
html[data-theme="light"] .sca-fx-badge.is-sweat { background: rgba(14, 165, 233, 0.15); color: #0369a1; }
html[data-theme="light"] #deskSpyMirror .spy-price { color: #0f172a; }

/* Mobile layout for .sca-battle-stage (390px zero-overflow) */
@media (max-width: 720px) {
  .sca-battle-stage {
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 8px 10px;
  }
  .sca-battle-stage .sca-energy-bar {
    order: 3;
    flex: 1 1 100%;
    width: 100%;
  }
  .sca-battle-stage .sca-duelist.is-bull {
    order: 1;
  }
  .sca-battle-stage .sca-duelist.is-bear {
    order: 2;
  }
  .sca-sprite-stack,
  .sca-char-sprite {
    width: 48px;
    height: 48px;
  }
  .sca-push-rig {
    width: 52px;
    height: 42px;
  }
}

/* ==========================================================================
   v75 — 1. SUPER CONFLUENCE OVERLAP SPOTLIGHT (.hcd-overlap-spotlight)
         2. VWAP BUYER VS SELLER VERDICT BADGE (.mts-verdict, .mts-sub-val)
         3. CLEAN THAI-FIRST NEWS CARDS (.news-list-clean, .news-row-clean)
         4. CONVERGING MACD NEAR-CROSS HIGHLIGHT (.mfs-node.is-near-cross)
         5. 6-COLUMN LIVE CONTEXT STRIP (.live-strip .ls-context)
   ========================================================================== */

/* 1. Super Confluence Overlap Spotlight (Chart S/R × GEX Wall) */
.hcd-overlap-spotlight {
  margin: 0 0 18px;
  padding: 18px 20px;
  border-radius: 16px;
  background:
    radial-gradient(circle at 12% 0%, rgba(245, 183, 59, 0.18), transparent 55%),
    radial-gradient(circle at 88% 100%, rgba(52, 211, 153, 0.14), transparent 55%),
    linear-gradient(145deg, rgba(15, 25, 48, 0.96), rgba(9, 15, 30, 0.98));
  border: 1.5px solid rgba(245, 183, 59, 0.62);
  box-shadow: 0 12px 32px rgba(2, 6, 23, 0.45), inset 0 1px 0 rgba(254, 240, 138, 0.22);
}
.hos-head {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(245, 183, 59, 0.24);
}
.hos-title-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
}
.hos-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 11px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #091122;
  background: linear-gradient(135deg, #fef08a, #f59e0b);
  box-shadow: 0 0 16px rgba(245, 158, 11, 0.45);
}
.hos-title-wrap h5 {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1.12rem;
  font-weight: 700;
  color: #fef9c3;
  line-height: 1.35;
}
.hos-title-wrap h5 u {
  text-decoration-color: #f59e0b;
  text-underline-offset: 4px;
}
.hos-sub {
  font-size: 0.84rem;
  color: #cbd5e1;
  line-height: 1.5;
}
.hos-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.hcd-overlap-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 15px 16px;
  border-radius: 14px;
  background: rgba(8, 14, 28, 0.88);
  border: 1px solid rgba(245, 183, 59, 0.4);
  position: relative;
  overflow: hidden;
}
.hcd-overlap-card.is-res {
  border-left: 4px solid #34d399;
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.13), rgba(8, 14, 28, 0.92) 65%);
}
.hcd-overlap-card.is-sup {
  border-left: 4px solid #fb7185;
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.13), rgba(8, 14, 28, 0.92) 65%);
}
.hoc-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 10px;
}
.hoc-kicker {
  font-family: var(--font-head);
  font-size: 0.82rem;
  font-weight: 700;
  color: #fde68a;
}
.hoc-weight {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 9px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: 0.74rem;
  font-weight: 700;
  color: #fef08a;
  background: rgba(245, 158, 11, 0.2);
  border: 1px solid rgba(245, 158, 11, 0.5);
}
.hoc-main-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 12px;
}
.hoc-strike {
  font-family: var(--mono);
  font-size: 1.72rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.hoc-dist {
  font-family: var(--font-head);
  font-size: 0.84rem;
  font-weight: 600;
  color: #e2e8f0;
}
.hoc-equation {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.22);
}
.hoc-eq-pill {
  font-size: 0.8rem;
  line-height: 1.4;
  color: #f1f5f9;
}
.hoc-eq-pill b {
  color: #fde68a;
}
.hoc-eq-plus {
  font-family: var(--mono);
  font-size: 0.9rem;
  font-weight: 800;
  color: #f59e0b;
  padding: 0 2px;
}
.hoc-action {
  font-size: 0.8rem;
  line-height: 1.45;
  color: #cbd5e1;
}
.hoc-bar {
  height: 6px;
  width: 100%;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.16);
  overflow: hidden;
}
.hoc-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
}
.hoc-bar i.is-pos {
  background: linear-gradient(90deg, #f59e0b, #34d399);
}
.hoc-bar i.is-neg {
  background: linear-gradient(90deg, #f59e0b, #fb7185);
}

/* 2. VWAP & 5m Timing Strip Verdict Badge (.mts-verdict) */
.mts-verdict {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  align-self: flex-start;
  margin: 2px 0;
  padding: 3px 9px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.3;
}
.mts-verdict.is-bull {
  color: #6ee7b7;
  background: rgba(16, 185, 129, 0.16);
  border: 1px solid rgba(52, 211, 153, 0.45);
}
.mts-verdict.is-bear {
  color: #fda4af;
  background: rgba(244, 63, 94, 0.16);
  border: 1px solid rgba(251, 113, 133, 0.45);
}
.mts-verdict.is-flat {
  color: #cbd5e1;
  background: rgba(148, 163, 184, 0.16);
  border: 1px solid rgba(148, 163, 184, 0.35);
}
.mts-sub-val {
  display: block;
  font-size: 0.82rem;
  line-height: 1.35;
  color: #e2e8f0;
}
.mfs-node.is-near-cross {
  border-color: rgba(245, 183, 59, 0.55) !important;
  box-shadow: inset 0 0 0 1px rgba(245, 183, 59, 0.22);
}

/* 3. Clean Scannable News Cards (.news-list-clean / .news-row-clean) */
.news-list.news-list-clean {
  display: flex;
  flex-direction: column;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 12px 0 0;
}
.news-list.news-list-clean > li.news-row-clean {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 7px !important;
  padding: 13px 16px !important;
  border-radius: 12px !important;
  background: rgba(13, 22, 40, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-left: 4px solid rgba(148, 163, 184, 0.45) !important;
  transition: background 0.16s ease, border-color 0.16s ease !important;
}
.news-list.news-list-clean > li.news-row-clean.news-lv-2 {
  border-top: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-right: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-left: 4px solid #f43f5e !important;
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.1), rgba(13, 22, 40, 0.82) 45%) !important;
}
.news-list.news-list-clean > li.news-row-clean.news-lv-1 {
  border-top: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-right: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-left: 4px solid #f59e0b !important;
}
.news-list.news-list-clean > li.news-row-clean:hover {
  background: rgba(20, 33, 58, 0.9) !important;
  border-color: rgba(226, 201, 143, 0.4) !important;
}
.nrc-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 12px;
}
.nrc-badges {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.nrc-meta {
  font-family: var(--font-body);
  font-size: 0.78rem;
  color: #94a3b8;
}
.nrc-link {
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-decoration: none;
  color: inherit;
}
.nrc-th-headline {
  display: block;
  font-family: var(--font-head);
  font-size: 1.02rem;
  font-weight: 600;
  line-height: 1.48;
  color: #f8fafc;
}
.nrc-link:hover .nrc-th-headline {
  color: #fde68a;
}
.nrc-ext {
  font-style: normal;
  font-size: 0.86rem;
  color: #e2c98f;
  margin-left: 4px;
}
.nrc-en-sub {
  display: block;
  font-family: var(--font-body);
  font-size: 0.82rem;
  line-height: 1.42;
  color: #94a3b8;
}

/* 5. 6-Column Live Context Strip on Desktop so all 6 dimensions sit on 1 clean row */
@media (min-width: 1120px) {
  .live-strip .ls-context {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }
}

html[data-theme="light"] .hcd-overlap-spotlight {
  background: linear-gradient(145deg, #fffbeb, #fef3c7);
  border-color: rgba(217, 119, 6, 0.55);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
}
html[data-theme="light"] .hos-title-wrap h5 { color: #78350f; }
html[data-theme="light"] .hos-sub { color: #475569; }
html[data-theme="light"] .hcd-overlap-card {
  background: #ffffff;
  border-color: rgba(217, 119, 6, 0.35);
}
html[data-theme="light"] .hoc-kicker { color: #92400e; }
html[data-theme="light"] .hoc-dist,
html[data-theme="light"] .hoc-action { color: #334155; }
html[data-theme="light"] .hoc-equation {
  background: #f8fafc;
  border-color: rgba(148, 163, 184, 0.35);
}
html[data-theme="light"] .hoc-eq-pill { color: #0f172a; }
html[data-theme="light"] .hoc-eq-pill b { color: #b45309; }
html[data-theme="light"] .news-list.news-list-clean > li.news-row-clean {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] .nrc-th-headline { color: #0f172a; }
html[data-theme="light"] .nrc-en-sub,
html[data-theme="light"] .nrc-meta { color: #475569; }

@media (max-width: 720px) {
  .hos-grid {
    grid-template-columns: 1fr;
  }
  .hcd-overlap-spotlight {
    padding: 14px;
  }
  .hoc-strike {
    font-size: 1.45rem;
  }
}

/* ==========================================================================
   v76: DIVERSE VISUAL MECHANICS (Price Radar Tower, Radial Rings, RSI Dial,
        Donut Strip, Heatmap Tiles, Weight Chips) & CLEAN TOGGLE SURFACE
   ========================================================================== */

/* 1. Radial Score & Quota Rings */
.dte-radial-ring {
  flex-shrink: 0;
  display: block;
  overflow: visible;
}
.gj-kpi-ring-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 2px 0;
}
.gj-kpi-ring-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.run-pill {
  display: inline-flex !important;
  align-items: center;
  align-self: flex-start;
  padding: 4px 11px !important;
  border-radius: 999px !important;
  font-family: var(--font-body);
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  margin-top: 6px !important;
}
.run-pill.is-up {
  background: rgba(52, 211, 153, 0.14) !important;
  border: 1px solid rgba(52, 211, 153, 0.38) !important;
  color: #6ee7b7 !important;
}
.run-pill.is-down {
  background: rgba(251, 113, 133, 0.14) !important;
  border: 1px solid rgba(251, 113, 133, 0.38) !important;
  color: #fda4af !important;
}

/* 2. RSI 5m Semi-Circle Speedometer Dial */
.mts-rsi-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 4px;
}
.mts-rsi-dial-wrap {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mts-rsi-dial {
  width: 96px;
  height: 54px;
  display: block;
  overflow: visible;
}

/* 3. 3-Column Super Confluence Spotlight + Vertical Price Radar Tower */
.hos-grid.is-three-col {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 248px minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
}
.hoc-hero-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.hoc-ring-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}
.hoc-ring-box small {
  font-size: 0.68rem;
  font-weight: 700;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.hcd-price-tower {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 12px 14px;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.92), rgba(9, 14, 26, 0.96));
  border: 1px solid rgba(226, 201, 143, 0.34);
  box-shadow: inset 0 0 22px rgba(245, 158, 11, 0.06);
}
.hpt-head {
  text-align: center;
  margin-bottom: 6px;
}
.hpt-badge {
  display: inline-block;
  font-family: var(--font-head);
  font-size: 0.76rem;
  font-weight: 700;
  color: #fde68a;
  letter-spacing: 0.02em;
}
.hpt-rung {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 8px 10px;
  border-radius: 10px;
  gap: 2px;
}
.hpt-rung.is-res {
  background: rgba(16, 185, 129, 0.14);
  border: 1px solid rgba(52, 211, 153, 0.42);
}
.hpt-rung.is-spot {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.22), rgba(217, 119, 6, 0.12));
  border: 1.5px solid rgba(251, 191, 36, 0.65);
  box-shadow: 0 0 14px rgba(245, 158, 11, 0.18);
}
.hpt-rung.is-sup {
  background: rgba(244, 63, 94, 0.14);
  border: 1px solid rgba(251, 113, 133, 0.42);
}
.hpt-tag {
  display: block;
  font-size: 0.72rem;
  font-weight: 700;
  color: #cbd5e1;
}
.hpt-price {
  display: block;
  font-family: var(--font-mono);
  font-size: 1.12rem;
  font-weight: 800;
  color: #f8fafc;
  line-height: 1.2;
}
.hpt-rung.is-res .hpt-price { color: #6ee7b7; }
.hpt-rung.is-spot .hpt-price { color: #fde68a; font-size: 1.16rem; }
.hpt-rung.is-sup .hpt-price { color: #fda4af; }
.hpt-delta,
.hpt-pos-pill {
  display: inline-block;
  font-size: 0.71rem;
  font-weight: 700;
  color: #cbd5e1;
}
.hpt-delta.is-up { color: #6ee7b7; }
.hpt-delta.is-dn { color: #fda4af; }
.hpt-pos-pill {
  background: rgba(245, 158, 11, 0.18);
  border: 1px solid rgba(251, 191, 36, 0.42);
  color: #fde68a;
  padding: 1px 8px;
  border-radius: 999px;
  margin-top: 2px;
}
.hpt-shaft {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 4px 0;
  position: relative;
}
.hpt-shaft-line {
  width: 2px;
  height: 16px;
  border-radius: 2px;
  background: rgba(148, 163, 184, 0.45);
}
.hpt-gap-pill {
  font-family: var(--font-mono);
  font-size: 0.71rem;
  font-weight: 700;
  color: #e2e8f0;
  background: rgba(15, 23, 42, 0.85);
  border: 1px solid rgba(148, 163, 184, 0.28);
  padding: 2px 8px;
  border-radius: 999px;
}
.hcd-right.is-ring-col {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 44px;
}

/* 4. Cross-Asset Weight Chips (Replaces 8 repetitive horizontal bars) */
.sca-chip-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.sca-w-chip {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  border-radius: 10px !important;
  background: rgba(15, 23, 42, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
}
.sca-w-chip.is-bull {
  border-left: 3px solid #34d399 !important;
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.12), rgba(15, 23, 42, 0.78)) !important;
}
.sca-w-chip.is-bear {
  border-left: 3px solid #fb7185 !important;
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.12), rgba(15, 23, 42, 0.78)) !important;
}
.swc-left {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  min-width: 0;
}
.swc-sym {
  font-family: var(--font-head);
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
}
.swc-role {
  font-size: 0.72rem !important;
  color: #94a3b8 !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.swc-pts {
  font-family: var(--font-mono);
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.88) !important;
  color: #cbd5e1 !important;
  flex-shrink: 0;
}
.sca-w-chip.is-bull .swc-pts {
  color: #6ee7b7 !important;
  border: 1px solid rgba(52, 211, 153, 0.35) !important;
}
.sca-w-chip.is-bear .swc-pts {
  color: #fda4af !important;
  border: 1px solid rgba(251, 113, 133, 0.35) !important;
}

/* 5. Mega-Cap Donut Strip & Heatmap Tiles */
.mega-weight-strip.is-donut-strip {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 16px;
}
.mws-donut-col {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mws-donut {
  display: block;
}
.mws-info-col {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.mws-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.mws-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
}
.mws-pill.is-up {
  background: rgba(16, 185, 129, 0.14);
  border: 1px solid rgba(52, 211, 153, 0.38);
  color: #6ee7b7;
}
.mws-pill.is-dn {
  background: rgba(244, 63, 94, 0.14);
  border: 1px solid rgba(251, 113, 133, 0.38);
  color: #fda4af;
}
.mws-pill.is-flat {
  background: rgba(148, 163, 184, 0.14);
  border: 1px solid rgba(148, 163, 184, 0.3);
  color: #cbd5e1;
}
.tiles.is-heatmap-grid .tile.lean-up {
  background: linear-gradient(145deg, rgba(6, 78, 59, 0.52), rgba(13, 28, 36, 0.88)) !important;
  border-color: rgba(52, 211, 153, 0.42) !important;
}
.tiles.is-heatmap-grid .tile.lean-down {
  background: linear-gradient(145deg, rgba(136, 19, 55, 0.48), rgba(28, 14, 26, 0.88)) !important;
  border-color: rgba(251, 113, 133, 0.42) !important;
}

/* Light theme overrides for v76 components */
html[data-theme="light"] .hcd-price-tower {
  background: #ffffff;
  border-color: rgba(217, 119, 6, 0.42);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}
html[data-theme="light"] .hpt-title { color: #92400e; }
html[data-theme="light"] .hpt-tag { color: #334155; }
html[data-theme="light"] .hpt-sub { color: var(--dte-dim); }
html[data-theme="light"] .hpt-rung.is-res .hpt-price { color: #be123c; }
html[data-theme="light"] .hpt-rung.is-spot .hpt-price { color: #b45309; }
html[data-theme="light"] .hpt-rung.is-sup .hpt-price { color: #047857; }
html[data-theme="light"] .hpt-gap-pill {
  background: #f8fafc;
  color: #0f172a;
  border-color: rgba(15, 23, 42, 0.18);
}
html[data-theme="light"] .sca-w-chip {
  background: #ffffff;
  border-color: rgba(15, 23, 42, 0.14);
}
html[data-theme="light"] .swc-sym { color: #0f172a; }
html[data-theme="light"] .swc-role { color: #475569; }
html[data-theme="light"] .swc-pts {
  background: #f1f5f9;
  color: #0f172a;
}
html[data-theme="light"] .tiles.is-heatmap-grid .tile.lean-up {
  background: linear-gradient(145deg, rgba(209, 250, 229, 0.85), #ffffff) !important;
  border-color: rgba(16, 185, 129, 0.45) !important;
}
html[data-theme="light"] .tiles.is-heatmap-grid .tile.lean-down {
  background: linear-gradient(145deg, rgba(255, 228, 230, 0.85), #ffffff) !important;
  border-color: rgba(244, 63, 94, 0.45) !important;
}

@media (max-width: 980px) {
  .hos-grid.is-three-col {
    grid-template-columns: 1fr;
  }
  .sca-chip-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 520px) {
  .mega-weight-strip.is-donut-strip {
    flex-direction: column;
    align-items: flex-start;
  }
  .sca-chip-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   v77 — AUDI'S 14-CONCEPT REDESIGN:
   1. Heated & Animated RSI 5m Speedometer (Overbought 🔥 & Oversold ⚡)
   2. Zero Box-in-Box-in-Box in #mkLevels (Open Frameless Hairline Columns + Vertical SVG Laser Radar)
   3. Member Boarding Bar (#dteMemberBar)
   4. Daily Market Data Telemetry (Open 20:30 · Midday · Close 03:00 #dteDailyDataHub)
   5. Audi's Option Masterclass & Interactive Video Course Theatre (#audiOptionCourseHub)
   ========================================================================== */

/* ---------- 1. Heated & Animated RSI 5m Speedometer ---------- */
.mk-timing-strip {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
.mts-item.is-rsi-dial-card {
  grid-column: 1 / -1 !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  position: relative;
  overflow: hidden;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}
.mts-item.is-rsi-dial-card .mts-rsi-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.mts-rsi-copy {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.rsi-big-num {
  font-family: var(--mono);
  font-size: 1.55rem !important;
  font-weight: 800;
  line-height: 1.1;
}
.rsi-sim-tag {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  background: rgba(245, 183, 59, 0.2);
  color: #fde68a;
  border: 1px solid rgba(245, 183, 59, 0.45);
  margin-left: 4px;
}
.rsi-sim-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.rsi-sim-btn {
  appearance: none;
  border: 1px solid rgba(148, 163, 184, 0.26);
  background: rgba(15, 23, 42, 0.55);
  color: #cbd5e1;
  font-family: var(--font-head);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 999px;
  cursor: pointer;
  transition: all 0.18s ease;
}
.rsi-sim-btn:hover {
  border-color: rgba(56, 189, 248, 0.55);
  color: #f8fafc;
}
.rsi-sim-btn.is-active {
  background: rgba(56, 189, 248, 0.22);
  border-color: #38bdf8;
  color: #f8fafc;
}
.rsi-sim-btn.is-active.is-ob {
  background: linear-gradient(135deg, rgba(249, 115, 22, 0.35), rgba(225, 29, 72, 0.35));
  border-color: #fb923c;
  color: #fef08a;
  box-shadow: 0 0 12px rgba(249, 115, 22, 0.4);
}
.rsi-sim-btn.is-active.is-os {
  background: linear-gradient(135deg, rgba(6, 182, 212, 0.32), rgba(16, 185, 129, 0.35));
  border-color: #34d399;
  color: #a7f3d0;
  box-shadow: 0 0 12px rgba(16, 185, 129, 0.38);
}
svg.mts-rsi-dial {
  width: 140px !important;
  height: 76px !important;
  flex-shrink: 0;
  overflow: visible;
}
@keyframes rsiNeedleFlutter {
  0%, 100% { transform: rotate(0deg); }
  50% { transform: rotate(1.6deg); }
}
@keyframes rsiHeatAuraPulse {
  0%, 100% { transform: scale(0.92); opacity: 0.45; }
  50% { transform: scale(1.32); opacity: 0.88; }
}
@keyframes rsiFlameRise {
  0% { transform: translateY(2px) scale(0.85); opacity: 0.95; }
  100% { transform: translateY(-9px) scale(1.25); opacity: 0; }
}
@keyframes rsiSurgeExpand {
  0% { transform: scale(0.75); opacity: 0.9; }
  100% { transform: scale(1.65); opacity: 0; }
}
.mts-rsi-dial .rsi-needle-group {
  transform-origin: 70px 58px;
  animation: rsiNeedleFlutter 2.2s ease-in-out infinite;
}
.mts-rsi-dial .rsi-heat-aura,
.mts-rsi-dial .rsi-surge-aura {
  transform-box: fill-box;
  transform-origin: center;
  animation: rsiHeatAuraPulse 1.2s ease-in-out infinite;
}
.mts-rsi-dial .rsi-flame-p {
  transform-box: fill-box;
  transform-origin: center;
  animation: rsiFlameRise 1.05s ease-out infinite;
}
.mts-rsi-dial .rsi-flame-p.p2 { animation-delay: 0.32s; }
.mts-rsi-dial .rsi-flame-p.p3 { animation-delay: 0.64s; }
.mts-rsi-dial .rsi-surge-ring {
  transform-box: fill-box;
  transform-origin: center;
  animation: rsiSurgeExpand 1.35s ease-out infinite;
}
/* Heated Overbought Card State (>=70) */
.mts-item.is-rsi-dial-card.is-rsi-overbought {
  background: radial-gradient(circle at 88% 35%, rgba(249, 115, 22, 0.28), rgba(159, 18, 57, 0.22) 55%, rgba(15, 23, 42, 0.92)) !important;
  border-color: rgba(249, 115, 22, 0.72) !important;
  box-shadow: 0 0 22px rgba(249, 115, 22, 0.25), inset 0 0 18px rgba(251, 113, 133, 0.14) !important;
}
/* Charged Oversold Card State (<=30) */
.mts-item.is-rsi-dial-card.is-rsi-oversold {
  background: radial-gradient(circle at 18% 35%, rgba(16, 185, 129, 0.28), rgba(6, 182, 212, 0.2) 55%, rgba(15, 23, 42, 0.92)) !important;
  border-color: rgba(52, 211, 153, 0.72) !important;
  box-shadow: 0 0 22px rgba(16, 185, 129, 0.24), inset 0 0 18px rgba(52, 211, 153, 0.14) !important;
}

/* ---------- 2. Eliminate Box-in-Box-in-Box in #mkLevels ---------- */
#mkLevels .hist-confluence-deck,
#deskLevelsMirror .hist-confluence-deck {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 16px 0 4px !important;
}
#mkLevels .hcd-overlap-spotlight,
#deskLevelsMirror .hcd-overlap-spotlight {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 6px 0 18px !important;
  margin-bottom: 16px !important;
}
#mkLevels .hos-grid.is-three-col,
#deskLevelsMirror .hos-grid.is-three-col {
  display: grid;
  grid-template-columns: 1fr 1.05fr 1fr;
  gap: 0 !important;
  align-items: stretch;
}
#mkLevels .hcd-overlap-card,
#deskLevelsMirror .hcd-overlap-card {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 8px 18px !important;
}
#mkLevels .hcd-overlap-card.is-res,
#deskLevelsMirror .hcd-overlap-card.is-res {
  padding-left: 4px !important;
  border-right: 1px solid rgba(148, 163, 184, 0.16) !important;
}
#mkLevels .hcd-overlap-card.is-sup,
#deskLevelsMirror .hcd-overlap-card.is-sup {
  padding-right: 4px !important;
  border-left: 1px solid rgba(148, 163, 184, 0.16) !important;
}
#mkLevels .hoc-equation,
#deskLevelsMirror .hoc-equation,
#mkLevels .hoc-eq-pill,
#deskLevelsMirror .hoc-eq-pill,
#mkLevels .hoc-action,
#deskLevelsMirror .hoc-action {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
#mkLevels .hoc-action,
#deskLevelsMirror .hoc-action {
  border-top: 1px dashed rgba(148, 163, 184, 0.18) !important;
  padding-top: 8px !important;
  margin-top: 6px !important;
}

/* Open Frameless Vertical SVG Price Radar (.hcd-price-tower.is-frameless-radar) */
#mkLevels .hcd-price-tower.is-frameless-radar,
#deskLevelsMirror .hcd-price-tower.is-frameless-radar {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 6px 18px !important;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.hpt-radar-layout {
  display: flex;
  align-items: center;
  gap: 14px;
}
.hpt-svg-radar {
  flex-shrink: 0;
  overflow: visible;
}
@keyframes hptSpotPulse {
  0%, 100% { transform: scale(0.88); opacity: 0.45; }
  50% { transform: scale(1.38); opacity: 0.92; }
}
.hpt-svg-radar .hpt-spot-aura {
  transform-box: fill-box;
  transform-origin: center;
  animation: hptSpotPulse 1.8s ease-in-out infinite;
}
.hpt-rungs-open {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
#mkLevels .hpt-rungs-open .hpt-rung,
#deskLevelsMirror .hpt-rungs-open .hpt-rung {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.14) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 8px 0 !important;
  text-align: left !important;
  align-items: flex-start !important;
}
#mkLevels .hpt-rungs-open .hpt-rung:last-child,
#deskLevelsMirror .hpt-rungs-open .hpt-rung:last-child {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}
/* Also remove nested boxes on .hcd-box & .hcd-row below */
#mkLevels .hcd-box,
#deskLevelsMirror .hcd-box {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 4px 0 !important;
}
#mkLevels .hcd-box.hcd-sr,
#deskLevelsMirror .hcd-box.hcd-sr {
  padding-right: 16px !important;
  border-right: 1px solid rgba(148, 163, 184, 0.15) !important;
}
#mkLevels .hcd-box.hcd-mem,
#deskLevelsMirror .hcd-box.hcd-mem {
  padding-left: 16px !important;
}
#mkLevels .hcd-row,
#deskLevelsMirror .hcd-row {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 10px 2px !important;
}

/* ---------- 3. Member Boarding & Command Strip (#dteMemberBar) ---------- */
.dte-member-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 16px;
  margin-top: 12px;
  padding: 10px 14px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.78), rgba(10, 17, 32, 0.9));
  border: 1px solid rgba(148, 163, 184, 0.2);
}
.dmb-user {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.dmb-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(56, 189, 248, 0.16);
  border: 1px solid rgba(56, 189, 248, 0.4);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
}
.dmb-user-copy {
  display: flex;
  flex-direction: column;
  line-height: 1.25;
}
.dmb-user-copy b {
  font-family: var(--font-head);
  font-size: 0.88rem;
  color: #f8fafc;
}
.dmb-user-copy small {
  font-size: 0.76rem;
  color: #94a3b8;
}
.dmb-quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}
.dmb-pill {
  appearance: none;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(15, 23, 42, 0.65);
  color: #e2e8f0;
  font-family: var(--font-head);
  font-size: 0.78rem;
  font-weight: 700;
  padding: 6px 11px;
  border-radius: 999px;
  cursor: pointer;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}
.dmb-pill:hover {
  transform: translateY(-1px);
  border-color: #38bdf8;
  color: #ffffff;
}
.dmb-pill.is-gold { border-color: rgba(245, 183, 59, 0.45); color: #fde68a; }
.dmb-pill.is-violet { border-color: rgba(167, 139, 250, 0.45); color: #ddd6fe; }
.dmb-pill.is-emerald { border-color: rgba(52, 211, 153, 0.45); color: #a7f3d0; }
.dmb-pill.is-amber { border-color: rgba(251, 191, 36, 0.45); color: #fef08a; }

/* ---------- 4. Daily Market Data Telemetry (#dteDailyDataHub) ---------- */
.dte-daily-data-hub {
  margin-bottom: 22px;
}
.ddt-shell {
  padding: 18px 20px;
  border-radius: 16px;
  background: rgba(10, 17, 30, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.2);
}
.ddt-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.ddt-head h3 {
  margin: 4px 0 0;
  font-family: var(--font-head);
  font-size: 1.18rem;
}
.ddt-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ddt-kpis {
  margin-bottom: 14px !important;
}
.ddt-table-wrap {
  overflow-x: auto;
}
.ddt-phase {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ddt-tag {
  font-size: 0.7rem;
  font-weight: 800;
  color: #94a3b8;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

/* ---------- 5. Audi's Option Video Course Theatre (#audiOptionCourseHub) ---------- */
.audi-course-hub {
  margin-bottom: 22px;
}
.ach-shell {
  padding: 20px 22px;
  border-radius: 18px;
  background: linear-gradient(155deg, rgba(15, 23, 42, 0.88), rgba(9, 14, 26, 0.94));
  border: 1px solid rgba(245, 183, 59, 0.35);
}
.ach-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
  margin-bottom: 16px;
}
.ach-head h3 {
  margin: 4px 0 0;
  font-family: var(--font-head);
  font-size: 1.24rem;
}
.ach-head-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.ach-prog-pill {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 190px;
  font-size: 0.8rem;
  color: #cbd5e1;
}
.ach-prog-bar {
  height: 6px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.2);
  overflow: hidden;
}
.ach-prog-bar i {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #34d399, #f5b73b);
  border-radius: 999px;
}
.ach-body {
  display: grid;
  grid-template-columns: 1.25fr 1fr;
  gap: 20px;
  align-items: start;
}
.ach-stage {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ach-player-poster,
.ach-player-frame {
  position: relative;
  aspect-ratio: 16 / 9;
  width: 100%;
  border-radius: 14px;
  overflow: hidden;
  background: #060a12;
  border: 1px solid rgba(148, 163, 184, 0.24);
  cursor: pointer;
}
.ach-player-poster img,
.ach-player-frame iframe {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
  display: block;
}
.ach-poster-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(6, 10, 18, 0.55) 0%, rgba(6, 10, 18, 0.25) 45%, rgba(6, 10, 18, 0.85) 100%);
}
.ach-poster-top {
  position: absolute;
  top: 12px;
  left: 12px;
  right: 12px;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.ach-big-play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 999px;
  background: rgba(245, 183, 59, 0.95);
  color: #090d16;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 0.92rem;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.45);
}
.ach-stage-meta h4 {
  margin: 6px 0 4px;
  font-family: var(--font-head);
  font-size: 1.12rem;
}
.ach-stage-meta p {
  margin: 0 0 10px;
  color: #cbd5e1;
  font-size: 0.9rem;
  line-height: 1.55;
}
.ach-stage-badges,
.ach-stage-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ach-curriculum {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ach-cur-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 0.88rem;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
}
.ach-ep-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ach-ep-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 9px 10px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.16);
  background: rgba(15, 23, 42, 0.45);
}
.ach-ep-item.is-active {
  border-color: rgba(245, 183, 59, 0.65);
  background: rgba(245, 183, 59, 0.12);
}
.ach-ep-select {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  flex: 1;
  min-width: 0;
  cursor: pointer;
  padding: 0;
}
.ach-ep-num {
  font-family: var(--mono);
  font-size: 0.76rem;
  font-weight: 800;
  padding: 3px 7px;
  border-radius: 6px;
  background: rgba(56, 189, 248, 0.16);
  color: #7dd3fc;
  flex-shrink: 0;
}
.ach-ep-copy {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ach-ep-copy b {
  font-family: var(--font-head);
  font-size: 0.86rem;
  color: #f8fafc;
}
.ach-ep-copy small {
  font-size: 0.74rem;
  color: #94a3b8;
}
.ach-ep-check {
  appearance: none;
  border: 1px solid rgba(148, 163, 184, 0.25);
  background: rgba(15, 23, 42, 0.6);
  color: #cbd5e1;
  font-family: var(--font-head);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 999px;
  cursor: pointer;
  flex-shrink: 0;
}
.ach-ep-item.is-done .ach-ep-check {
  border-color: rgba(52, 211, 153, 0.55);
  background: rgba(16, 185, 129, 0.18);
  color: #6ee7b7;
}

/* Light Mode & Responsive Mobile (390x844) Zero-Overlap for v77 */
html[data-theme="light"] .dte-member-bar,
html[data-theme="light"] .ddt-shell,
html[data-theme="light"] .ach-shell,
html[data-theme="light"] .ach-ep-item {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
  color: #0f172a !important;
}
html[data-theme="light"] .dmb-user-copy b,
html[data-theme="light"] .ach-ep-copy b,
html[data-theme="light"] .ach-stage-meta h4 {
  color: #0f172a !important;
}
html[data-theme="light"] .dmb-pill,
html[data-theme="light"] .rsi-sim-btn,
html[data-theme="light"] .ach-ep-check {
  background: #f8fafc !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.2) !important;
}
html[data-theme="light"] .mts-item.is-rsi-dial-card.is-rsi-overbought {
  background: linear-gradient(135deg, #fff7ed, #ffe4e6) !important;
  border-color: #f97316 !important;
}
html[data-theme="light"] .mts-item.is-rsi-dial-card.is-rsi-oversold {
  background: linear-gradient(135deg, #ecfdf5, #ecfeff) !important;
  border-color: #10b981 !important;
}

@media (max-width: 980px) {
  .ach-body,
  #mkLevels .hos-grid.is-three-col,
  #deskLevelsMirror .hos-grid.is-three-col {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  #mkLevels .hcd-overlap-card.is-res,
  #deskLevelsMirror .hcd-overlap-card.is-res,
  #mkLevels .hcd-overlap-card.is-sup,
  #deskLevelsMirror .hcd-overlap-card.is-sup,
  #mkLevels .hcd-box.hcd-sr,
  #deskLevelsMirror .hcd-box.hcd-sr {
    border-right: 0 !important;
    border-left: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
    padding-bottom: 14px !important;
  }
  #mkLevels .hcd-box.hcd-mem,
  #deskLevelsMirror .hcd-box.hcd-mem {
    padding-left: 0 !important;
  }
}
@media (max-width: 560px) {
  .mk-timing-strip {
    grid-template-columns: 1fr !important;
  }
  .mts-item.is-rsi-dial-card .mts-rsi-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .ach-ep-item {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ==========================================================================
   v78 FRAMELESS INFOGRAPHIC ARCHITECTURE & ZERO BOX-IN-BOX OVERHAUL
   - Replaces giant .zone-banner boxes with clean typographic .dte-zone-divider
   - Replaces circle-next-to-rectangle patterns with unified SVG canvases & bullet meters
   - Eliminates nested boxes in #tradeLab, #tradeStats, #mkSpy, #mkMacd, #mkLevels, #mkBreadth
   ========================================================================== */

/* 1. Clean Typographic Zone Dividers (replaces giant .zone-banner boxes) */
.dte-zone-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 22px 0 14px;
  padding: 0 0 8px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}
.dte-zone-divider .dzd-tag {
  font-family: var(--mono);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(56, 189, 248, 0.14);
  color: #7dd3fc;
  border: 1px solid rgba(56, 189, 248, 0.32);
  flex-shrink: 0;
}
.dte-zone-divider .dzd-title {
  font-family: var(--font-head);
  font-size: 1.02rem;
  font-weight: 800;
  color: #f8fafc;
  letter-spacing: -0.01em;
}

/* 2. v79 Open Zone Architecture (Divide by Large Headings — Zero Outer Box-in-Box) */
.mk-grid.mk-open-zones {
  gap: 24px 28px !important;
}
.mk-box.mk-open-sec,
#deskSpyMirror.mk-box,
#deskMacdMirror.mk-box,
#deskLevelsMirror.mk-box {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
#mkSpy.mk-open-sec {
  padding-right: 22px !important;
  border-right: 1px solid rgba(148, 163, 184, 0.18) !important;
}
#mkLevels.mk-open-sec,
#mkCross.mk-open-sec,
#mkBreadth.mk-open-sec,
#mkNews.mk-open-sec {
  margin-top: 12px !important;
  padding-top: 22px !important;
  border-top: 2px solid rgba(148, 163, 184, 0.2) !important;
}
.mk-box.mk-open-sec > h3,
#deskSpyMirror > h3,
#deskMacdMirror > h3,
#deskLevelsMirror > h3 {
  font-family: var(--font-head) !important;
  font-size: 1.38rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  color: #f8fafc !important;
  padding: 0 0 10px 0 !important;
  margin: 0 0 14px 0 !important;
  border-left: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22) !important;
}
html[data-theme="light"] .mk-box.mk-open-sec > h3,
html[data-theme="light"] #deskSpyMirror > h3,
html[data-theme="light"] #deskMacdMirror > h3,
html[data-theme="light"] #deskLevelsMirror > h3 {
  color: #0f172a !important;
}

/* Remove outer wrapper boxes in Trade Desk (#deskToday, #deskLive, .desk-timing-strip) so there is zero Box-in-Box */
#deskToday .desk-infographic-deck,
#deskLive.desk-live-strip,
#deskLive .desk-timing-strip,
#tradeChartWrap.gx-card {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
#deskLive.desk-live-strip {
  margin-top: 20px !important;
  padding-top: 20px !important;
  border-top: 2px solid rgba(148, 163, 184, 0.2) !important;
}
#deskLive .desk-timing-strip {
  margin-top: 14px !important;
  padding-top: 14px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.2) !important;
}

/* #mkSpy Frameless Journey Canvas & Traffic-Light 3-Column Strip */
#mkSpy .gap-journey-card,
#deskSpyMirror .gap-journey-card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 4px 0 0 !important;
  margin: 8px 0 0 !important;
}
#mkSpy .gj-kpi-strip.is-frameless-strip,
#deskSpyMirror .gj-kpi-strip.is-frameless-strip {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 12px 0 6px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
#mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card,
#deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-card {
  background: rgba(15, 23, 42, 0.45) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-left: 3.5px solid rgba(148, 163, 184, 0.45) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  padding: 8px 12px !important;
}
#mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green,
#deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green {
  border-left-color: #10b981 !important;
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.12) 0%, rgba(15, 23, 42, 0.4) 100%) !important;
}
#mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red,
#deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  border-left-color: #f43f5e !important;
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.12) 0%, rgba(15, 23, 42, 0.4) 100%) !important;
}
#mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-amber,
#deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-amber {
  border-left-color: #f59e0b !important;
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.12) 0%, rgba(15, 23, 42, 0.4) 100%) !important;
}

/* 3. #mkMacd Vivid Traffic-Light 5-Node Signal Circuit (Green / Red / Yellow) — No Outer Wrapper Box! */
#mkMacd .macd-flow-strip.is-circuit-track,
#deskMacdMirror .macd-flow-strip.is-circuit-track {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 4px 0 !important;
  gap: 8px !important;
}
#mkMacd .macd-flow-strip.is-circuit-track .mfs-node,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-node {
  border-radius: 12px !important;
  padding: 8px 6px !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
/* 🟢 GREEN: Solid Bullish Timeframe */
#mkMacd .macd-flow-strip.is-circuit-track .mfs-node.is-up,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-node.is-up {
  background: linear-gradient(180deg, rgba(16, 185, 129, 0.24) 0%, rgba(6, 78, 59, 0.38) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.68) !important;
  border-top: 4px solid #10b981 !important;
  box-shadow: 0 8px 18px -8px rgba(16, 185, 129, 0.4) !important;
}
/* 🔴 RED: Solid Bearish Timeframe */
#mkMacd .macd-flow-strip.is-circuit-track .mfs-node.is-down,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-node.is-down {
  background: linear-gradient(180deg, rgba(244, 63, 94, 0.24) 0%, rgba(136, 19, 55, 0.38) 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.68) !important;
  border-top: 4px solid #f43f5e !important;
  box-shadow: 0 8px 18px -8px rgba(244, 63, 94, 0.4) !important;
}
/* 🟡 YELLOW / AMBER: Near-Cross Warning (⚡ ใกล้ตัดลง / ใกล้ตัดขึ้น) or Neutral */
#mkMacd .macd-flow-strip.is-circuit-track .mfs-node.is-near-cross,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-node.is-near-cross,
#mkMacd .macd-flow-strip.is-circuit-track .mfs-node.is-neutral,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-node.is-neutral {
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.26) 0%, rgba(120, 53, 15, 0.4) 100%) !important;
  border: 1.5px solid rgba(251, 191, 36, 0.78) !important;
  border-top: 4px solid #fbbf24 !important;
  box-shadow: 0 8px 18px -8px rgba(245, 158, 11, 0.42) !important;
}
#mkMacd .macd-flow-strip.is-circuit-track .mfs-node.is-core .mfs-role,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-node.is-core .mfs-role {
  color: #fde047 !important;
  font-weight: 800 !important;
}
#mkMacd .macd-flow-strip.is-circuit-track .mfs-node .mfs-sub,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-node .mfs-sub {
  display: inline-block !important;
  margin-top: 4px !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  background: rgba(245, 158, 11, 0.32) !important;
  border: 1px solid rgba(251, 191, 36, 0.85) !important;
  color: #fef08a !important;
  font-weight: 800 !important;
  font-size: 0.72rem !important;
}
#mkMacd .mk-timing-strip.is-instrument-deck,
#deskMacdMirror .mk-timing-strip.is-instrument-deck {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 14px 0 0 !important;
  margin-top: 14px !important;
  display: grid !important;
  grid-template-columns: 1.15fr 1fr !important;
  gap: 14px !important;
  align-items: start !important;
}
#mkMacd .mk-timing-strip.is-instrument-deck .mts-head,
#deskMacdMirror .mk-timing-strip.is-instrument-deck .mts-head {
  grid-column: 1 / -1 !important;
  margin-bottom: 2px !important;
}
#mkMacd .mts-right-stack,
#deskMacdMirror .mts-right-stack {
  grid-column: 1 / -1 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  border-left: 0 !important;
  padding-left: 0 !important;
  border-top: 0 !important;
  padding-top: 2px !important;
}
#mkMacd .mts-right-stack .mts-item.is-frameless-row,
#deskMacdMirror .mts-right-stack .mts-item.is-frameless-row {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 6px 10px !important;
  background: rgba(15, 23, 42, 0.45) !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-left: 4px solid rgba(148, 163, 184, 0.45) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  padding: 7px 12px !important;
}
#mkMacd .mts-right-stack .mts-item.is-frameless-row.is-tone-green,
#deskMacdMirror .mts-right-stack .mts-item.is-frameless-row.is-tone-green {
  border-left-color: #10b981 !important;
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.14) 0%, rgba(15, 23, 42, 0.42) 100%) !important;
}
#mkMacd .mts-right-stack .mts-item.is-frameless-row.is-tone-red,
#deskMacdMirror .mts-right-stack .mts-item.is-frameless-row.is-tone-red {
  border-left-color: #f43f5e !important;
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.14) 0%, rgba(15, 23, 42, 0.42) 100%) !important;
}
#mkMacd .mts-right-stack .mts-item.is-frameless-row.is-tone-amber,
#deskMacdMirror .mts-right-stack .mts-item.is-frameless-row.is-tone-amber {
  border-left-color: #f59e0b !important;
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.14) 0%, rgba(15, 23, 42, 0.42) 100%) !important;
}
#mkMacd .mts-right-stack .mts-item.is-frameless-row small,
#deskMacdMirror .mts-right-stack .mts-item.is-frameless-row small {
  margin: 0 !important;
  min-width: 115px;
}
#mkMacd .mts-right-stack .mts-item.is-frameless-row .mts-sub-val,
#deskMacdMirror .mts-right-stack .mts-item.is-frameless-row .mts-sub-val {
  margin-left: auto;
}

/* 4. #mkLevels Color-Coded Strip, Horizontal Power Bar & Open GEX Bars */
#mkLevels .lvl-list.is-frameless-strip,
#deskLevelsMirror .lvl-list.is-frameless-strip {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 6px 0 14px !important;
  margin: 8px 0 14px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
}
#mkLevels .lvl-list.is-frameless-strip .stat,
#deskLevelsMirror .lvl-list.is-frameless-strip .stat {
  grid-column: auto !important;
  background: rgba(15, 23, 42, 0.48) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-top: 3.5px solid rgba(148, 163, 184, 0.5) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  padding: 10px 14px !important;
}
#mkLevels .lvl-list.is-frameless-strip .stat.is-tone-green,
#deskLevelsMirror .lvl-list.is-frameless-strip .stat.is-tone-green {
  border-top-color: #10b981 !important;
  background: linear-gradient(180deg, rgba(16, 185, 129, 0.14) 0%, rgba(15, 23, 42, 0.45) 100%) !important;
}
#mkLevels .lvl-list.is-frameless-strip .stat.is-tone-red,
#deskLevelsMirror .lvl-list.is-frameless-strip .stat.is-tone-red {
  border-top-color: #f43f5e !important;
  background: linear-gradient(180deg, rgba(244, 63, 94, 0.14) 0%, rgba(15, 23, 42, 0.45) 100%) !important;
}
#mkLevels .lvl-list.is-frameless-strip .stat.is-tone-amber,
#deskLevelsMirror .lvl-list.is-frameless-strip .stat.is-tone-amber {
  border-top-color: #f59e0b !important;
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.14) 0%, rgba(15, 23, 42, 0.45) 100%) !important;
}
#mkLevels .lvl-list.is-frameless-strip .stat:first-child,
#deskLevelsMirror .lvl-list.is-frameless-strip .stat:first-child {
  padding-left: 0 !important;
}
#mkLevels .lvl-list.is-frameless-strip .stat:last-child,
#deskLevelsMirror .lvl-list.is-frameless-strip .stat:last-child {
  border-right: 0 !important;
  padding-right: 0 !important;
}
#mkLevels .gex-bars-card.is-frameless-gex,
#deskLevelsMirror .gex-bars-card.is-frameless-gex {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 16px 0 4px !important;
  margin-top: 16px !important;
}
.hoc-power-lbl {
  font-family: var(--font-head);
  font-size: 0.78rem;
  color: #94a3b8;
}
.hoc-power-lbl b {
  font-family: var(--mono);
  color: #f8fafc;
}
.hoc-power-bar {
  width: 100%;
  height: 7px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.2);
  overflow: hidden;
  margin: 4px 0 8px;
}
.hoc-power-bar i {
  display: block;
  height: 100%;
  border-radius: 999px;
}

/* 5. #mkBreadth Frameless Split-Weight Bar (replaces circular mws-donut) */
.mega-weight-strip.is-frameless-bar {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 4px 0 12px !important;
  margin-bottom: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.mws-head-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.mws-split-bar {
  display: flex;
  width: 100%;
  height: 9px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(15, 23, 42, 0.8);
  gap: 2px;
}
.mws-split-bar i.is-up {
  background: linear-gradient(90deg, #059669, #34d399);
  height: 100%;
}
.mws-split-bar i.is-dn {
  background: linear-gradient(90deg, #fb7185, #e11d48);
  height: 100%;
}

/* 6. #panel-trades Frameless Ribbon & 2-Column Expectancy + +100% Rule Infographic Deck */
.ts-frameless-ribbon {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  padding: 14px 0;
  margin: 0 0 14px;
  border-top: 1px solid rgba(148, 163, 184, 0.2);
  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}
.ts-frameless-ribbon .tfr-col {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 2px 18px;
  border-right: 1px solid rgba(148, 163, 184, 0.16);
}
.ts-frameless-ribbon .tfr-col:first-child {
  padding-left: 0;
}
.ts-frameless-ribbon .tfr-col:last-child {
  border-right: 0;
  padding-right: 0;
}
.ts-frameless-ribbon .tfr-lbl {
  font-family: var(--font-head);
  font-size: 0.82rem;
  font-weight: 600;
  color: #94a3b8;
}
.ts-frameless-ribbon .tfr-val {
  font-family: var(--mono);
  font-size: 1.55rem;
  font-weight: 800;
  line-height: 1.2;
}
.ts-frameless-ribbon .tfr-sub {
  font-size: 0.8rem;
  color: #94a3b8;
}

.lb-frameless-deck {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 28px;
  padding: 18px 0;
  margin: 16px 0;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
}
.lb-frameless-deck .lb-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.lb-frameless-deck .lb-panel.is-rule100 {
  border-left: 1px solid rgba(148, 163, 184, 0.18);
  padding-left: 28px;
}
.lb-panel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.lb-panel-head h3 {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1.05rem;
  font-weight: 800;
  color: #f8fafc;
}
.lb-panel-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.lb-expectancy-svg {
  width: 100%;
  height: auto;
  display: block;
  overflow: visible;
}
.lb-setup-bars {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px dashed rgba(148, 163, 184, 0.18);
}
.lb-setup-row {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  align-items: center;
  gap: 10px;
  font-size: 0.84rem;
}
.lb-sr-name {
  font-family: var(--font-head);
  font-weight: 700;
  color: #cbd5e1;
  white-space: nowrap;
}
.lb-sr-track {
  height: 8px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.72);
  overflow: hidden;
}
.lb-sr-track i {
  display: block;
  height: 100%;
  border-radius: 999px;
}
.lb-sr-track i.is-up {
  background: linear-gradient(90deg, #059669, #34d399);
}
.lb-sr-track i.is-dn {
  background: linear-gradient(90deg, #e11d48, #fb7185);
}
.lb-sr-val {
  font-family: var(--mono);
  font-weight: 700;
  font-size: 0.84rem;
  text-align: right;
}
.lb-sr-val small {
  font-family: var(--font-body);
  font-weight: 500;
  color: #94a3b8;
}
.lb-rule-compare {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 6px 0;
}
.lb-rc-col {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.lb-rc-lbl {
  font-family: var(--font-head);
  font-size: 0.82rem;
  font-weight: 600;
  color: #94a3b8;
}
.lb-rc-val {
  font-family: var(--mono);
  font-size: 1.35rem;
  font-weight: 800;
}
.lb-rc-track {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.75);
  overflow: hidden;
}
.lb-rc-track i {
  display: block;
  height: 100%;
  border-radius: 999px;
}
.lb-rc-track i.is-up {
  background: linear-gradient(90deg, #059669, #34d399);
}
.lb-rc-track i.is-dn {
  background: linear-gradient(90deg, #e11d48, #fb7185);
}

/* Light mode & Mobile 390x844 overrides for v78 frameless elements */
html[data-theme="light"] .dte-zone-divider .dzd-title,
html[data-theme="light"] .lb-panel-head h3,
html[data-theme="light"] .hoc-power-lbl b {
  color: #0f172a !important;
}
html[data-theme="light"] .lb-expectancy-svg text[fill="#f8fafc"],
html[data-theme="light"] .lb-expectancy-svg text[fill="#cbd5e1"] {
  fill: #0f172a !important;
}

@media (max-width: 900px) {
  #mkSpy.mk-open-sec {
    border-right: 0 !important;
    padding-right: 0 !important;
    border-bottom: 2px solid rgba(148, 163, 184, 0.2) !important;
    padding-bottom: 20px !important;
  }
  .lb-frameless-deck,
  #mkMacd .mk-timing-strip.is-instrument-deck,
  #deskMacdMirror .mk-timing-strip.is-instrument-deck {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  .lb-frameless-deck .lb-panel.is-rule100,
  #mkMacd .mts-right-stack,
  #deskMacdMirror .mts-right-stack {
    border-left: 0 !important;
    padding-left: 0 !important;
    border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
    padding-top: 16px !important;
  }
  #mkLevels .lvl-list.is-frameless-strip,
  #deskLevelsMirror .lvl-list.is-frameless-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}
@media (max-width: 600px) {
  #mkSpy .gj-kpi-strip.is-frameless-strip,
  #deskSpyMirror .gj-kpi-strip.is-frameless-strip,
  .ts-frameless-ribbon {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .ts-frameless-ribbon .tfr-col {
    border-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
    padding-bottom: 8px !important;
  }
  .lb-setup-row {
    grid-template-columns: 96px 1fr auto;
  }
}

/* ============================================================================
   7. v79 High-Specificity Open-Zone Enforcer (Zero Outer Box-in-Box Across
      #panel-market, #panel-news, #panel-levels, #panel-trades)
   ============================================================================ */
#panel-market .mk-box.mk-open-sec,
#panel-news .mk-box.mk-open-sec,
#panel-market #mkSpy,
#panel-market #mkMacd,
#panel-market #mkLevels,
#panel-market #mkCross,
#panel-market #mkBreadth,
#panel-news #mkEvents,
#panel-news #mkNews,
#panel-market #mkCross .spy-clash-arena,
#panel-news #mkEvents .fg-widget,
#deskSpyMirror.mk-box,
#deskMacdMirror.mk-box,
#deskLevelsMirror.mk-box {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  outline: 0 !important;
}
#panel-market #mkSpy.mk-open-sec {
  padding-right: 24px !important;
  border-right: 1px solid rgba(148, 163, 184, 0.2) !important;
}
#panel-market #mkLevels.mk-open-sec,
#panel-market #mkCross.mk-open-sec,
#panel-market #mkBreadth.mk-open-sec,
#panel-news #mkNews.mk-open-sec {
  grid-column: span 12 !important;
  width: 100% !important;
  margin-top: 16px !important;
  padding-top: 24px !important;
  border-top: 2px solid rgba(148, 163, 184, 0.22) !important;
}
#panel-news #mkEvents.mk-open-sec {
  grid-column: span 12 !important;
  width: 100% !important;
}
#panel-market .mk-box.mk-open-sec > h3,
#panel-news .mk-box.mk-open-sec > h3,
#panel-news #mkEvents .fg-head h3,
#panel-news #mkEvents .ev-sec-head h3,
#deskSpyMirror > h3,
#deskMacdMirror > h3,
#deskLevelsMirror > h3 {
  font-family: var(--font-head) !important;
  font-size: 1.38rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  color: #f8fafc !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22) !important;
  padding: 0 0 10px 0 !important;
  margin: 0 0 14px 0 !important;
}
html[data-theme="light"] #panel-market .mk-box.mk-open-sec > h3,
html[data-theme="light"] #panel-news .mk-box.mk-open-sec > h3,
html[data-theme="light"] #panel-news #mkEvents .fg-head h3,
html[data-theme="light"] #panel-news #mkEvents .ev-sec-head h3 {
  color: #0f172a !important;
}

/* Clean Frameless Fear & Greed + Economic Calendar Layout in #panel-news */
#panel-news #mkEvents .fg-widget {
  margin-bottom: 24px !important;
  padding-bottom: 20px !important;
  border-bottom: 2px solid rgba(148, 163, 184, 0.2) !important;
}
#panel-news #mkEvents .fg-body {
  display: grid !important;
  grid-template-columns: 240px 1fr !important;
  gap: 24px !important;
  align-items: center !important;
}
#panel-news #mkEvents .fg-hist-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  background: transparent !important;
  border: 0 !important;
}
#panel-news #mkEvents .fg-hist-card {
  background: rgba(15, 23, 42, 0.42) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 10px !important;
  padding: 10px 14px !important;
  box-shadow: none !important;
}
#panel-news #mkEvents .ev-timeline {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
@media (max-width: 900px) {
  #panel-market #mkSpy.mk-open-sec {
    border-right: 0 !important;
    padding-right: 0 !important;
    border-bottom: 2px solid rgba(148, 163, 184, 0.2) !important;
    padding-bottom: 20px !important;
  }
  #panel-news #mkEvents .fg-body,
  #panel-news #mkEvents .fg-hist-grid,
  #panel-news #mkEvents .ev-timeline {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================================
   8. v80 Market Page Polish:
      - Full-Width Sleek Member Command Dock (#dteMemberBar.is-full-dock)
      - Bold Architectural Zone Headings (clamp(1.7rem, 2.5vw, 2.1rem))
      - Connected Full-Height Price Radar Spine (.hpt-connected-radar)
      - Single-Baseline Color-Highlighted GEX Skyline Chart (.gex-bars.is-skyline-chart)
      - True 100% Full-Tube Clash Beam (.is-zero-beam / .is-full-bull / .is-full-bear)
   ============================================================================ */

/* 8.1 Full-Width Member Command Dock (#dteMemberBar.is-full-dock) — Spans 100% of 1180px .wrap */
#dteMemberBar.dte-member-bar.is-full-dock {
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(360px, 435px) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 18px 22px !important;
  padding: 14px 20px !important;
  margin: 12px 0 8px !important;
  background:
    radial-gradient(560px 140px at 0% 0%, rgba(226, 201, 143, 0.12), transparent 72%),
    radial-gradient(560px 140px at 100% 100%, rgba(56, 189, 248, 0.1), transparent 72%),
    linear-gradient(135deg, rgba(12, 20, 38, 0.94) 0%, rgba(18, 29, 52, 0.86) 100%) !important;
  border: 1px solid rgba(226, 201, 143, 0.34) !important;
  border-left: 4px solid #e2c98f !important;
  border-radius: 16px !important;
  box-shadow: 0 14px 32px -16px rgba(2, 6, 23, 0.82) !important;
}
#dteMemberBar.is-full-dock .dmb-user {
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  padding-right: 18px !important;
  border-right: 1px solid rgba(148, 163, 184, 0.24) !important;
}
#dteMemberBar.is-full-dock .dmb-avatar {
  width: 42px !important;
  height: 42px !important;
  border-radius: 12px !important;
  background: radial-gradient(circle at 30% 30%, rgba(226, 201, 143, 0.32), rgba(15, 23, 42, 0.92)) !important;
  border: 1.5px solid rgba(226, 201, 143, 0.6) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 1.15rem !important;
  flex-shrink: 0 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
}
#dteMemberBar.is-full-dock .dmb-user-copy {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  min-width: 0 !important;
}
#dteMemberBar.is-full-dock .dmb-user-copy b {
  font-family: var(--font-head) !important;
  font-size: 0.94rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
  line-height: 1.25 !important;
}
#dteMemberBar.is-full-dock .dmb-user-copy small {
  font-size: 0.76rem !important;
  color: #cbd5e1 !important;
  line-height: 1.38 !important;
  white-space: normal !important;
}
#dteMemberBar.is-full-dock .dmb-login-btn {
  padding: 8px 13px !important;
  font-family: var(--font-head) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
  border: 1px solid rgba(226, 201, 143, 0.55) !important;
  color: #fde68a !important;
  background: linear-gradient(180deg, rgba(226, 201, 143, 0.18), rgba(226, 201, 143, 0.08)) !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}
#dteMemberBar.is-full-dock .dmb-quick-links {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  width: 100% !important;
}
#dteMemberBar.is-full-dock .dmb-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  padding: 8px 12px !important;
  font-family: var(--font-head) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  border-radius: 10px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  background: rgba(15, 23, 42, 0.75) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}
#dteMemberBar.is-full-dock .dmb-pill:hover {
  transform: translateY(-2px) !important;
}

/* 8.2 Larger, Unmistakable Architectural Zone Headings (> h3) */
#panel-market #mkLevels.mk-open-sec,
#panel-market #mkCross.mk-open-sec,
#panel-market #mkBreadth.mk-open-sec,
#panel-news #mkNews.mk-open-sec {
  margin-top: 32px !important;
  padding-top: 30px !important;
  border-top: 2px solid rgba(226, 201, 143, 0.28) !important;
}
#panel-market .mk-box.mk-open-sec > h3,
#panel-news .mk-box.mk-open-sec > h3,
#panel-news #mkEvents .fg-head h3,
#panel-news #mkEvents .ev-sec-head h3,
#deskSpyMirror > h3,
#deskMacdMirror > h3,
#deskLevelsMirror > h3 {
  font-family: var(--font-head) !important;
  font-size: clamp(1.62rem, 2.3vw, 1.98rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.015em !important;
  color: #f8fafc !important;
  border-left: 5px solid #e2c98f !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.24) !important;
  padding: 2px 0 12px 14px !important;
  margin: 0 0 18px 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
}
#panel-market #mkSpy.mk-open-sec > h3 {
  border-left-color: #34d399 !important;
}
#panel-market #mkMacd.mk-open-sec > h3 {
  border-left-color: #38bdf8 !important;
}
#panel-market #mkLevels.mk-open-sec > h3 {
  border-left-color: #fbbf24 !important;
}
#panel-market #mkCross.mk-open-sec > h3 {
  border-left-color: #fb7185 !important;
}
#panel-market #mkBreadth.mk-open-sec > h3 {
  border-left-color: #a78bfa !important;
}

/* 8.3 Connected Full-Height Price Radar Spine (Horizontal laser arms reach right to the numbers!) */
.hcd-price-tower.is-connected-spine {
  padding: 8px 18px !important;
}
.hpt-connected-radar {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  padding: 4px 0 !important;
}
.hpt-connected-radar .hpt-spine-rail {
  position: absolute !important;
  left: 11px !important;
  top: 28px !important;
  bottom: 28px !important;
  width: 3px !important;
  background: linear-gradient(180deg, #10b981 0%, #38bdf8 50%, #f43f5e 100%) !important;
  border-radius: 999px !important;
  box-shadow: 0 0 10px rgba(56, 189, 248, 0.35) !important;
  z-index: 1 !important;
}
.hpt-connected-radar .hpt-rung {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 6px 0 !important;
  border: 0 !important;
  background: transparent !important;
  position: relative !important;
  z-index: 2 !important;
}
.hpt-connected-radar .hpt-node-arm {
  display: flex !important;
  align-items: center !important;
  width: 58px !important;
  flex: 0 0 58px !important;
}
.hpt-connected-radar .hpt-dot {
  width: 15px !important;
  height: 15px !important;
  border-radius: 50% !important;
  margin-left: 5px !important;
  flex-shrink: 0 !important;
  border: 2.5px solid #f8fafc !important;
}
.hpt-connected-radar .hpt-arm-line {
  flex: 1 !important;
  height: 2.5px !important;
  position: relative !important;
}
.hpt-connected-radar .hpt-arm-line::after {
  content: "" !important;
  position: absolute !important;
  right: -2px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  border-top: 5px solid transparent !important;
  border-bottom: 5px solid transparent !important;
}
.hpt-connected-radar .hpt-node-arm.is-res .hpt-dot {
  background: #10b981 !important;
  box-shadow: 0 0 12px rgba(16, 185, 129, 0.7) !important;
}
.hpt-connected-radar .hpt-node-arm.is-res .hpt-arm-line {
  background: linear-gradient(90deg, #10b981, #34d399) !important;
}
.hpt-connected-radar .hpt-node-arm.is-res .hpt-arm-line::after {
  border-left: 7px solid #34d399 !important;
}
.hpt-connected-radar .hpt-node-arm.is-spot .hpt-dot {
  background: #38bdf8 !important;
  box-shadow: 0 0 0 5px rgba(56, 189, 248, 0.25), 0 0 14px rgba(56, 189, 248, 0.85) !important;
}
.hpt-connected-radar .hpt-node-arm.is-spot .hpt-arm-line {
  background: linear-gradient(90deg, #38bdf8, #fbbf24) !important;
  height: 3px !important;
}
.hpt-connected-radar .hpt-node-arm.is-spot .hpt-arm-line::after {
  border-left: 8px solid #fbbf24 !important;
}
.hpt-connected-radar .hpt-node-arm.is-sup .hpt-dot {
  background: #f43f5e !important;
  box-shadow: 0 0 12px rgba(244, 63, 94, 0.7) !important;
}
.hpt-connected-radar .hpt-node-arm.is-sup .hpt-arm-line {
  background: linear-gradient(90deg, #f43f5e, #fb7185) !important;
}
.hpt-connected-radar .hpt-node-arm.is-sup .hpt-arm-line::after {
  border-left: 7px solid #fb7185 !important;
}
.hpt-connected-radar .hpt-rung-content {
  flex: 1 !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  padding-bottom: 6px !important;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.16) !important;
}
.hpt-connected-radar .hpt-rung.is-sup .hpt-rung-content {
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
}
.hpt-connected-radar .hpt-price-row {
  display: flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 6px 10px !important;
}
.hpt-connected-radar .hpt-mini-bar {
  width: 100% !important;
  height: 5px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.78) !important;
  overflow: hidden !important;
  margin-top: 2px !important;
}
.hpt-connected-radar .hpt-mini-bar i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
}
.hpt-connected-radar .hpt-mini-bar i.is-up {
  background: linear-gradient(90deg, #059669, #34d399) !important;
}
.hpt-connected-radar .hpt-mini-bar i.is-dn {
  background: linear-gradient(90deg, #e11d48, #fb7185) !important;
}

/* 8.4 Single-Baseline Color-Highlighted GEX Skyline Chart (.gex-bars.is-skyline-chart) */
#mkLevels .gex-bars-head,
#deskLevelsMirror .gex-bars-head {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin-bottom: 12px !important;
}
.gex-bars-legend {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}
.gex-bars-legend .gbl-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-size: 0.76rem !important;
  color: #e2e8f0 !important;
}
.gex-bars-legend .gbl-item.is-cw {
  background: rgba(16, 185, 129, 0.16) !important;
  border: 1px solid rgba(52, 211, 153, 0.5) !important;
}
.gex-bars-legend .gbl-item.is-spot {
  background: rgba(245, 158, 11, 0.18) !important;
  border: 1px solid rgba(251, 191, 36, 0.55) !important;
}
.gex-bars-legend .gbl-item.is-pw {
  background: rgba(244, 63, 94, 0.16) !important;
  border: 1px solid rgba(251, 113, 133, 0.5) !important;
}
#mkLevels .gex-bars.is-skyline-chart,
#deskLevelsMirror .gex-bars.is-skyline-chart {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(64px, 1fr) !important;
  grid-template-columns: none !important;
  gap: 8px !important;
  height: auto !important;
  padding: 12px 10px 10px !important;
  background: rgba(8, 15, 30, 0.55) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 14px !important;
  align-items: stretch !important;
  overflow-x: auto !important;
}
#mkLevels .gex-bars.is-skyline-chart::before,
#deskLevelsMirror .gex-bars.is-skyline-chart::before {
  display: none !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb.is-skyline-col,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb.is-skyline-col {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  height: 224px !important;
  min-height: 224px !important;
  padding: 8px 4px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.42) !important;
  border: 1px solid rgba(148, 163, 184, 0.14) !important;
  position: relative !important;
  min-width: 0 !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb.is-skyline-col.is-cw,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb.is-skyline-col.is-cw {
  background: linear-gradient(180deg, rgba(16, 185, 129, 0.28) 0%, rgba(6, 78, 59, 0.42) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.88) !important;
  border-top: 4px solid #10b981 !important;
  box-shadow: 0 10px 22px -10px rgba(16, 185, 129, 0.55) !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb.is-skyline-col.is-pw,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb.is-skyline-col.is-pw {
  background: linear-gradient(180deg, rgba(244, 63, 94, 0.28) 0%, rgba(136, 19, 55, 0.42) 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.88) !important;
  border-top: 4px solid #f43f5e !important;
  box-shadow: 0 10px 22px -10px rgba(244, 63, 94, 0.55) !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb.is-skyline-col.spot,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb.is-skyline-col.spot {
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.28) 0%, rgba(120, 53, 15, 0.42) 100%) !important;
  border: 1.5px solid rgba(251, 191, 36, 0.9) !important;
  border-top: 4px solid #fbbf24 !important;
  box-shadow: 0 10px 22px -10px rgba(245, 158, 11, 0.55) !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb-top,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb-top {
  height: 24px !important;
  min-height: 24px !important;
  flex: 0 0 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  border-bottom: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 4px !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb-role,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb-role {
  font-family: var(--font-head) !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  padding: 2px 6px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb-track.is-single-base,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb-track.is-single-base {
  position: relative !important;
  width: 100% !important;
  height: 150px !important;
  min-height: 150px !important;
  flex: 0 0 150px !important;
  display: block !important;
  border-bottom: 2px solid rgba(148, 163, 184, 0.36) !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb-track.is-single-base::before,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb-track.is-single-base::before,
#mkLevels .gex-bars.is-skyline-chart .gb.spot .gb-track.is-single-base::after,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb.spot .gb-track.is-single-base::after {
  display: none !important;
  content: none !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb .gb-track.is-single-base i.gb-bar-fill,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb .gb-track.is-single-base i.gb-bar-fill {
  position: absolute !important;
  top: auto !important;
  bottom: 0 !important;
  left: 20% !important;
  right: 20% !important;
  width: auto !important;
  max-width: none !important;
  border-radius: 7px 7px 2px 2px !important;
  display: block !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb .gb-track.is-single-base i.gb-bar-fill.is-call-bar,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb .gb-track.is-single-base i.gb-bar-fill.is-call-bar {
  background: linear-gradient(180deg, #34d399 0%, rgba(16, 185, 129, 0.35) 100%) !important;
  border: 1px solid rgba(110, 231, 183, 0.55) !important;
  border-top: 3px solid #a7f3d0 !important;
  box-shadow: 0 0 14px rgba(16, 185, 129, 0.4) !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb .gb-track.is-single-base i.gb-bar-fill.is-put-bar,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb .gb-track.is-single-base i.gb-bar-fill.is-put-bar {
  background: linear-gradient(180deg, #fb7185 0%, rgba(244, 63, 94, 0.35) 100%) !important;
  border: 1px solid rgba(253, 164, 175, 0.55) !important;
  border-top: 3px solid #fecdd3 !important;
  box-shadow: 0 0 14px rgba(244, 63, 94, 0.4) !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb .gb-track.is-single-base .gb-v,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb .gb-track.is-single-base .gb-v {
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  top: auto !important;
  font-family: var(--mono) !important;
  font-size: 0.73rem !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  z-index: 4 !important;
  padding: 2px 6px !important;
  border-radius: 6px !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb-foot,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb-foot {
  height: 22px !important;
  min-height: 22px !important;
  flex: 0 0 22px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb-k,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb-k {
  font-family: var(--mono) !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
}

/* 8.5 True 100% Full-Tube Beam in .sca-energy-bar (Zero Opposing Color When 100%) */
.sca-energy-bar .sca-beam.is-zero-beam {
  display: none !important;
  width: 0 !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  opacity: 0 !important;
}
.spy-clash-arena.is-full-bull .sca-energy-bar .sca-beam.is-bull,
.spy-clash-arena.is-full-bear .sca-energy-bar .sca-beam.is-bear {
  width: 100% !important;
  flex: 1 1 100% !important;
  border-radius: 999px !important;
}

@media (max-width: 960px) {
  #dteMemberBar.dte-member-bar.is-full-dock {
    grid-template-columns: 1fr !important;
  }
  #dteMemberBar.is-full-dock .dmb-user {
    border-right: 0 !important;
    padding-right: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.2) !important;
    padding-bottom: 10px !important;
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
  }
  #dteMemberBar.is-full-dock .dmb-quick-links {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ============================================================================
   9. v82 Support–Resistance Force Chamber Radar + 2-Column Spacious Confluence
      Deck + Under-Strike Multi-Factor Symbol Stack (.gb-conf-stack)
   ============================================================================ */

/* 9.1 2-Column Master Layout for 🏛️ โซนยุทธศาสตร์ทับซ้อน (.hos-grid.is-two-col-master) */
#mkLevels .hcd-head-row h4,
#deskLevelsMirror .hcd-head-row h4 {
  font-family: var(--font-head) !important;
  font-size: 1.24rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 14px 0 !important;
}
#mkLevels .hos-grid.is-two-col-master,
#deskLevelsMirror .hos-grid.is-two-col-master {
  display: grid !important;
  grid-template-columns: minmax(340px, 1.05fr) minmax(380px, 1.22fr) !important;
  gap: 22px !important;
  align-items: stretch !important;
}
#mkLevels .hos-cards-stack,
#deskLevelsMirror .hos-cards-stack {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  justify-content: center !important;
  min-width: 0 !important;
}

/* 9.2 Support–Resistance Force Chamber (.hcd-price-tower.is-force-chamber) */
#mkLevels .hcd-price-tower.is-force-chamber,
#deskLevelsMirror .hcd-price-tower.is-force-chamber {
  background:
    radial-gradient(420px 140px at 50% 0%, rgba(16, 185, 129, 0.16), transparent 72%),
    radial-gradient(420px 140px at 50% 100%, rgba(244, 63, 94, 0.16), transparent 72%),
    linear-gradient(180deg, rgba(10, 20, 38, 0.92) 0%, rgba(15, 23, 42, 0.88) 50%, rgba(18, 16, 34, 0.92) 100%) !important;
  border: 1.5px solid rgba(148, 163, 184, 0.28) !important;
  border-radius: 18px !important;
  padding: 20px 22px !important;
  box-shadow: 0 14px 32px -16px rgba(2, 6, 23, 0.75) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 10px !important;
}
.hcd-price-tower.is-force-chamber .hpt-head {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin-bottom: 4px !important;
}
.hcd-price-tower.is-force-chamber .hpt-badge {
  font-family: var(--font-head) !important;
  font-size: 0.98rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
.hcd-price-tower.is-force-chamber .hpt-sub-badge {
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  color: #fde68a !important;
  background: rgba(245, 158, 11, 0.16) !important;
  border: 1px solid rgba(251, 191, 36, 0.45) !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
}
.hcd-price-tower.is-force-chamber .hpt-rung-content {
  align-items: stretch !important;
  text-align: left !important;
}
.hcd-price-tower.is-force-chamber .hpt-tag {
  align-self: flex-start !important;
  text-align: left !important;
  margin: 0 0 2px 0 !important;
  font-family: var(--font-body) !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
}

/* Ceiling & Floor Barrier Bars */
.sr-barrier-roof {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 8px 14px !important;
  font-family: var(--font-body) !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em !important;
}
.sr-barrier-roof.is-ceiling {
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.25), rgba(6, 78, 59, 0.4)) !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
  border-top: 4px solid #10b981 !important;
  border-radius: 12px 12px 4px 4px !important;
  color: #d1fae5 !important;
}
.sr-barrier-roof.is-floor {
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.25), rgba(136, 19, 55, 0.4)) !important;
  border: 1px solid rgba(251, 113, 133, 0.55) !important;
  border-bottom: 4px solid #f43f5e !important;
  border-radius: 4px 4px 12px 12px !important;
  color: #ffe4e6 !important;
}
@keyframes srPushDown {
  0%, 100% { transform: translateY(-2px); opacity: 0.65; }
  50% { transform: translateY(3px); opacity: 1; }
}
@keyframes srPushUp {
  0%, 100% { transform: translateY(2px); opacity: 0.65; }
  50% { transform: translateY(-3px); opacity: 1; }
}
.sr-barrier-roof .sbr-arrows {
  font-family: var(--mono) !important;
  font-size: 0.82rem !important;
  font-weight: 900 !important;
  letter-spacing: 2px !important;
}
.sr-barrier-roof .sbr-arrows.is-down {
  color: #34d399 !important;
  animation: srPushDown 1.35s ease-in-out infinite !important;
}
.sr-barrier-roof .sbr-arrows.is-up {
  color: #fb7185 !important;
  animation: srPushUp 1.35s ease-in-out infinite !important;
}

/* Opposing Force Wave Streams pushing toward the Center Core */
.sr-force-stream {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin-left: 58px !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
}
.sr-force-stream.is-down-stream {
  background: rgba(16, 185, 129, 0.12) !important;
  border: 1px dashed rgba(52, 211, 153, 0.45) !important;
  color: #6ee7b7 !important;
}
.sr-force-stream.is-down-stream .sfs-chevrons {
  display: inline-block !important;
  color: #34d399 !important;
  font-weight: 900 !important;
  animation: srPushDown 1.15s ease-in-out infinite !important;
}
.sr-force-stream.is-up-stream {
  background: rgba(244, 63, 94, 0.12) !important;
  border: 1px dashed rgba(251, 113, 133, 0.45) !important;
  color: #fda4af !important;
}
.sr-force-stream.is-up-stream .sfs-chevrons {
  display: inline-block !important;
  color: #fb7185 !important;
  font-weight: 900 !important;
  animation: srPushUp 1.15s ease-in-out infinite !important;
}

/* Live Oscillating Center Tug-of-War Core (.sr-tug-core) */
@keyframes srSpotTugBounce {
  0%, 100% { transform: translateY(-3px); box-shadow: 0 8px 22px -6px rgba(56, 189, 248, 0.45), 0 -4px 14px -4px rgba(16, 185, 129, 0.35); }
  50% { transform: translateY(3px); box-shadow: 0 8px 22px -6px rgba(251, 191, 36, 0.5), 0 4px 14px -4px rgba(244, 63, 94, 0.4); }
}
@keyframes stmSparkPulse {
  0%, 100% { transform: translate(-50%, -50%) scale(0.92); }
  50% { transform: translate(-50%, -50%) scale(1.22); }
}
.hpt-connected-radar .hpt-rung.is-spot.is-tug-chamber .sr-tug-core {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.96), rgba(30, 41, 59, 0.92)) !important;
  border: 1.5px solid rgba(251, 191, 36, 0.72) !important;
  border-radius: 14px !important;
  padding: 12px 16px !important;
  animation: srSpotTugBounce 2.2s ease-in-out infinite !important;
}
.sr-tug-core .stc-top-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
.sr-tug-core .stc-status-pill {
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  background: rgba(245, 158, 11, 0.2) !important;
  border: 1px solid rgba(251, 191, 36, 0.55) !important;
  color: #fde68a !important;
}
.sr-tug-meter {
  margin-top: 6px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
.sr-tug-meter .stm-labels {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  font-family: var(--font-body) !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
}
.sr-tug-meter .stm-sup-lbl { color: #fda4af !important; }
.sr-tug-meter .stm-res-lbl { color: #6ee7b7 !important; }
.sr-tug-meter .stm-track {
  position: relative !important;
  display: flex !important;
  width: 100% !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.9) !important;
  border: 1px solid rgba(148, 163, 184, 0.3) !important;
  overflow: visible !important;
}
.sr-tug-meter .stm-fill {
  display: block !important;
  height: 100% !important;
}
.sr-tug-meter .stm-fill.is-sup-push {
  background: linear-gradient(90deg, #e11d48, #fb7185) !important;
  border-radius: 999px 0 0 999px !important;
}
.sr-tug-meter .stm-fill.is-res-push {
  background: linear-gradient(90deg, #34d399, #059669) !important;
  border-radius: 0 999px 999px 0 !important;
}
.sr-tug-meter .stm-clash-spark {
  position: absolute !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  background: #0f172a !important;
  border: 1.5px solid #fbbf24 !important;
  box-shadow: 0 0 10px rgba(251, 191, 36, 0.85) !important;
  display: grid !important;
  place-items: center !important;
  font-size: 0.68rem !important;
  z-index: 3 !important;
  animation: stmSparkPulse 1.2s ease-in-out infinite !important;
}

/* 9.3 Spacious, High-Contrast Confluence Cards (.hcd-overlap-card.is-spacious-card) */
#mkLevels .hcd-overlap-card.is-spacious-card,
#deskLevelsMirror .hcd-overlap-card.is-spacious-card {
  padding: 20px 24px !important;
  border-radius: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 12px !important;
  box-shadow: 0 12px 28px -16px rgba(2, 6, 23, 0.7) !important;
}
#mkLevels .hcd-overlap-card.is-spacious-card.is-res,
#deskLevelsMirror .hcd-overlap-card.is-spacious-card.is-res {
  background: linear-gradient(145deg, rgba(6, 78, 59, 0.32) 0%, rgba(15, 23, 42, 0.86) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.48) !important;
  border-left: 5px solid #10b981 !important;
}
#mkLevels .hcd-overlap-card.is-spacious-card.is-sup,
#deskLevelsMirror .hcd-overlap-card.is-spacious-card.is-sup {
  background: linear-gradient(145deg, rgba(136, 19, 55, 0.32) 0%, rgba(15, 23, 42, 0.86) 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.48) !important;
  border-left: 5px solid #f43f5e !important;
}
.hcd-overlap-card.is-spacious-card .hoc-top {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}
.hcd-overlap-card.is-spacious-card .hoc-kicker {
  font-family: var(--font-head) !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
.hcd-overlap-card.is-spacious-card .hoc-power-lbl {
  font-family: var(--font-body) !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
  background: rgba(15, 23, 42, 0.72) !important;
  border: 1px solid rgba(226, 201, 143, 0.45) !important;
  padding: 4px 12px !important;
  border-radius: 999px !important;
}
.hcd-overlap-card.is-spacious-card .hoc-power-lbl b {
  font-family: var(--mono) !important;
  font-size: 0.96rem !important;
  font-weight: 800 !important;
  color: #fde68a !important;
}
.hcd-overlap-card.is-spacious-card .hoc-main-col {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  width: 100% !important;
}
.hcd-overlap-card.is-spacious-card .hoc-strike {
  font-family: var(--mono) !important;
  font-size: 2.35rem !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  padding: 8px 16px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.75) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  flex-shrink: 0 !important;
}
.hcd-overlap-card.is-spacious-card .hoc-dist-wrap {
  flex: 1 !important;
  min-width: 180px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
.hcd-overlap-card.is-spacious-card .hoc-dist {
  font-family: var(--font-body) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: #f1f5f9 !important;
}
.hcd-overlap-card.is-spacious-card .hoc-power-bar {
  margin: 0 !important;
  height: 9px !important;
}
#mkLevels .hcd-overlap-card.is-spacious-card .hoc-equation,
#deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-equation {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 10px !important;
  padding: 0 !important;
  margin: 2px 0 !important;
}
#mkLevels .hcd-overlap-card.is-spacious-card .hoc-eq-pill,
#deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-eq-pill {
  background: rgba(15, 23, 42, 0.68) !important;
  border: 1px solid rgba(148, 163, 184, 0.26) !important;
  border-radius: 10px !important;
  padding: 10px 14px !important;
  font-family: var(--font-body) !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
  line-height: 1.42 !important;
  display: flex !important;
  align-items: center !important;
}
.hcd-overlap-card.is-spacious-card .hoc-eq-plus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.9rem !important;
  color: #fbbf24 !important;
  padding: 0 2px !important;
}
#mkLevels .hcd-overlap-card.is-spacious-card .hoc-action,
#deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-action {
  background: rgba(15, 23, 42, 0.55) !important;
  border: 1px solid rgba(226, 201, 143, 0.28) !important;
  border-radius: 10px !important;
  padding: 10px 14px !important;
  margin-top: 2px !important;
  font-family: var(--font-body) !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  color: #fde68a !important;
}

/* 9.4 Under-Strike Multi-Factor Symbol Stack (.gb-conf-stack) in GEX Skyline Chart */
.gex-under-legend {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 12px 0 !important;
  padding: 8px 12px !important;
  border-radius: 10px !important;
  background: rgba(15, 23, 42, 0.52) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  font-family: var(--font-body) !important;
  font-size: 0.82rem !important;
  color: #cbd5e1 !important;
}
.gex-under-legend .gul-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  background: rgba(30, 41, 59, 0.8) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  color: #f1f5f9 !important;
}
.gex-under-legend .gul-chip.is-fire {
  background: rgba(245, 158, 11, 0.2) !important;
  border-color: rgba(251, 191, 36, 0.6) !important;
  color: #fde68a !important;
}
#mkLevels .gex-bars.is-skyline-chart,
#deskLevelsMirror .gex-bars.is-skyline-chart {
  grid-auto-columns: minmax(82px, 1fr) !important;
  padding: 14px 12px 16px !important;
  height: auto !important;
  max-height: none !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb.is-skyline-col,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb.is-skyline-col {
  height: auto !important;
  min-height: 318px !important;
  max-height: none !important;
  overflow: visible !important;
  justify-content: flex-start !important;
  padding: 8px 5px 12px !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb.is-skyline-col.is-multi-conf,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb.is-skyline-col.is-multi-conf {
  box-shadow: inset 0 -3px 0 rgba(251, 191, 36, 0.75), 0 8px 20px -12px rgba(251, 191, 36, 0.45) !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb-foot,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb-foot {
  height: auto !important;
  min-height: 112px !important;
  max-height: none !important;
  overflow: visible !important;
  flex: 1 0 auto !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  padding-top: 4px !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb-k,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb-k {
  font-family: var(--mono) !important;
  font-size: 0.94rem !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
}
.gb-conf-stack {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 3px !important;
  width: 100% !important;
}
.gb-conf-count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: var(--font-body) !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  padding: 2px 6px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.32), rgba(234, 88, 12, 0.32)) !important;
  border: 1px solid rgba(251, 191, 36, 0.85) !important;
  color: #fef08a !important;
  white-space: nowrap !important;
  width: 100% !important;
}
.gb-conf-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  font-family: var(--font-body) !important;
  font-size: 0.67rem !important;
  font-weight: 600 !important;
  padding: 2px 5px !important;
  border-radius: 6px !important;
  width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  background: rgba(30, 41, 59, 0.82) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  color: #e2e8f0 !important;
}
.gb-conf-chip.is-cw-fac,
.gb-conf-chip.is-res-fac {
  background: rgba(16, 185, 129, 0.2) !important;
  border-color: rgba(52, 211, 153, 0.55) !important;
  color: #a7f3d0 !important;
}
.gb-conf-chip.is-pw-fac,
.gb-conf-chip.is-sup-fac {
  background: rgba(244, 63, 94, 0.2) !important;
  border-color: rgba(251, 113, 133, 0.55) !important;
  color: #fecdd3 !important;
}
.gb-conf-chip.is-spot-fac,
.gb-conf-chip.is-zg-fac {
  background: rgba(245, 158, 11, 0.22) !important;
  border-color: rgba(251, 191, 36, 0.65) !important;
  color: #fde68a !important;
}
.gb-conf-chip.is-gap-fac {
  background: rgba(56, 189, 248, 0.2) !important;
  border-color: rgba(56, 189, 248, 0.55) !important;
  color: #bae6fd !important;
}
.gb-conf-chip.is-mem-fac {
  background: rgba(168, 85, 247, 0.2) !important;
  border-color: rgba(192, 132, 252, 0.55) !important;
  color: #e9d5ff !important;
}
.gb-conf-empty {
  font-size: 0.75rem !important;
  color: rgba(148, 163, 184, 0.35) !important;
}

@media (max-width: 980px) {
  #mkLevels .hos-grid.is-two-col-master,
  #deskLevelsMirror .hos-grid.is-two-col-master,
  #mkLevels .hcd-overlap-card.is-spacious-card .hoc-equation,
  #deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-equation {
    grid-template-columns: 1fr !important;
  }
  .hcd-overlap-card.is-spacious-card .hoc-eq-plus {
    display: none !important;
  }
}

html[data-theme="light"] #mkLevels .hcd-price-tower.is-force-chamber,
html[data-theme="light"] #deskLevelsMirror .hcd-price-tower.is-force-chamber,
html[data-theme="light"] #mkLevels .hcd-overlap-card.is-spacious-card.is-res,
html[data-theme="light"] #deskLevelsMirror .hcd-overlap-card.is-spacious-card.is-res,
html[data-theme="light"] #mkLevels .hcd-overlap-card.is-spacious-card.is-sup,
html[data-theme="light"] #deskLevelsMirror .hcd-overlap-card.is-spacious-card.is-sup {
  background: #ffffff !important;
  color: #0f172a !important;
}
html[data-theme="light"] .hcd-price-tower.is-force-chamber .hpt-badge,
html[data-theme="light"] .hcd-overlap-card.is-spacious-card .hoc-kicker,
html[data-theme="light"] .hcd-overlap-card.is-spacious-card .hoc-dist {
  color: #0f172a !important;
}
html[data-theme="light"] .hpt-connected-radar .hpt-rung.is-spot.is-tug-chamber .sr-tug-core {
  background: #fffbeb !important;
  color: #0f172a !important;
}

/* ============================================================================
   10. v83 Market Page Typography, Zero-Clip Clash HUD & Proportional Radar:
       - Top HUD Pill Strip (.sca-energy-hud) above Plasma Clash Tube (.sca-energy-bar)
         so "🟢 หนุนขึ้น X%" & "กดดันลง Y% 🔴" are NEVER clipped or covered by ⚡
       - Real-HTML Range Quota Strip (.gj-quota-strip) below 2-line SVG Waypoint Curve
       - Proportional Distance Force Streams (.sr-force-stream) within constant height
       - Enlarged Secondary Typography across #mkSpy, #mkMacd, #mkLevels, #mkCross
   ============================================================================ */

/* 10.1 Zero-Clip Clash HUD (.sca-energy-center + .sca-energy-hud + .sca-energy-bar) */
.sca-battle-stage .sca-energy-center {
  flex: 1 1 auto !important;
  min-width: 220px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  z-index: 3 !important;
}
.sca-energy-hud {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  padding: 0 2px !important;
}
.sca-energy-hud .sca-beam-pct {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-family: var(--font-body) !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  padding: 4px 12px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  text-shadow: none !important;
  line-height: 1.25 !important;
}
.sca-energy-hud .sca-beam-pct.is-bull-pct {
  background: rgba(16, 185, 129, 0.22) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.68) !important;
  color: #a7f3d0 !important;
}
.sca-energy-hud .sca-beam-pct.is-bear-pct {
  background: rgba(244, 63, 94, 0.22) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.68) !important;
  color: #fecdd3 !important;
}
.sca-energy-hud .sca-hud-mid {
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  color: #cbd5e1 !important;
  background: rgba(15, 23, 42, 0.72) !important;
  border: 1px dashed rgba(226, 201, 143, 0.48) !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
.sca-energy-center .sca-energy-bar {
  height: 36px !important;
  margin: 0 !important;
}
.sca-energy-center .sca-beam.is-bull {
  justify-content: flex-start !important;
  padding: 0 !important;
  min-width: 0 !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}
.sca-energy-center .sca-beam.is-bear {
  justify-content: flex-end !important;
  padding: 0 !important;
  min-width: 0 !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}
.sca-energy-center .sca-beam-arrows {
  margin: 0 14px !important;
}
.sca-energy-center .sca-clash-core {
  transform: translate(-50%, -50%) !important;
  animation: scaCoreExactPulse 1.6s ease-in-out infinite alternate !important;
}
.spy-clash-arena.is-full-bull .sca-clash-core,
.spy-clash-arena.is-full-bear .sca-clash-core {
  display: none !important;
}
@keyframes scaCoreExactPulse {
  0%   { transform: translate(-50%, -50%) scale(0.95); }
  100% { transform: translate(-50%, -50%) scale(1.08); }
}

/* 10.2 Real-HTML Range Quota Strip (.gj-quota-strip) below SVG Waypoint Curve */
.gj-quota-strip {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 12px 15px !important;
  margin: 8px 0 12px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.55) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-left: 4px solid #10b981 !important;
}
.gj-quota-strip.is-tone-amber {
  border-left-color: #f59e0b !important;
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.14) 0%, rgba(15, 23, 42, 0.52) 100%) !important;
}
.gj-qs-head {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px 12px !important;
}
.gj-qs-range {
  font-family: var(--font-body) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
  line-height: 1.35 !important;
}
.gj-qs-range b {
  font-family: var(--mono) !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
.gj-qs-range small {
  font-size: 0.9rem !important;
  color: #cbd5e1 !important;
}
.gj-qs-verdict {
  font-family: var(--font-body) !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  padding: 4px 11px !important;
  border-radius: 999px !important;
  background: rgba(16, 185, 129, 0.18) !important;
  border: 1px solid rgba(52, 211, 153, 0.52) !important;
  color: #a7f3d0 !important;
  line-height: 1.3 !important;
}
.gj-qs-verdict.is-tone-amber {
  background: rgba(245, 158, 11, 0.2) !important;
  border-color: rgba(251, 191, 36, 0.62) !important;
  color: #fde68a !important;
}
.gj-qs-track {
  width: 100% !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.85) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  overflow: hidden !important;
}
.gj-qs-track i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
}

/* 10.3 Enlarged Secondary Typography Across #mkSpy, #mkMacd, #mkLevels, #mkCross */
#mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-lbl,
#deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-lbl {
  font-size: 0.86rem !important;
  color: #cbd5e1 !important;
}
#mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-val,
#deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-val {
  font-size: 1.16rem !important;
}
#mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-sub,
#deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-sub {
  font-size: 0.84rem !important;
  color: #e2e8f0 !important;
}
#mkMacd .macd-flow-strip.is-circuit-track .mfs-role,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-role {
  font-size: 0.8rem !important;
  color: #cbd5e1 !important;
}
#mkMacd .macd-flow-strip.is-circuit-track .mfs-tf,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-tf {
  font-size: 1.18rem !important;
}
#mkMacd .macd-flow-strip.is-circuit-track .mfs-bars,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-bars {
  font-size: 0.78rem !important;
  color: #cbd5e1 !important;
}
#mkMacd .macd-flow-strip.is-circuit-track .mfs-state,
#deskMacdMirror .macd-flow-strip.is-circuit-track .mfs-state {
  font-size: 0.9rem !important;
}
#mkMacd .mts-right-stack .mts-item.is-frameless-row small,
#deskMacdMirror .mts-right-stack .mts-item.is-frameless-row small {
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
}
#mkMacd .mts-right-stack .mts-item.is-frameless-row .mts-verdict,
#deskMacdMirror .mts-right-stack .mts-item.is-frameless-row .mts-verdict {
  font-size: 0.85rem !important;
  padding: 4px 11px !important;
}
#mkMacd .mts-right-stack .mts-item.is-frameless-row .mts-sub-val,
#deskMacdMirror .mts-right-stack .mts-item.is-frameless-row .mts-sub-val {
  font-size: 0.88rem !important;
}
#mkLevels .lvl-list.is-frameless-strip .stat .k,
#deskLevelsMirror .lvl-list.is-frameless-strip .stat .k {
  font-size: 0.86rem !important;
  font-weight: 600 !important;
  color: #cbd5e1 !important;
}
#mkLevels .lvl-list.is-frameless-strip .stat b,
#deskLevelsMirror .lvl-list.is-frameless-strip .stat b {
  font-size: 1.34rem !important;
}
#mkLevels .lvl-list.is-frameless-strip .stat .s,
#deskLevelsMirror .lvl-list.is-frameless-strip .stat .s {
  font-size: 0.83rem !important;
  color: #cbd5e1 !important;
}
.hcd-price-tower.is-force-chamber .hpt-delta,
.hcd-price-tower.is-force-chamber .hpt-pos-pill {
  font-size: 0.84rem !important;
  font-weight: 600 !important;
}
.sr-force-stream {
  font-size: 0.84rem !important;
  transition: min-height 0.35s ease !important;
}
.sr-tug-meter .stm-labels {
  font-size: 0.82rem !important;
}
.gb-conf-count,
.gb-conf-chip {
  font-size: 0.73rem !important;
  padding: 3px 6px !important;
}
.sca-w-chip .swc-sym {
  font-size: 0.92rem !important;
}
.sca-w-chip .swc-role {
  font-size: 0.8rem !important;
  color: #cbd5e1 !important;
}
.sca-w-chip .swc-pts {
  font-size: 0.86rem !important;
}
.t-role-meta {
  font-size: 0.8rem !important;
  color: #cbd5e1 !important;
}

@media (max-width: 720px) {
  .sca-battle-stage .sca-energy-center {
    order: 3 !important;
    flex: 1 1 100% !important;
    width: 100% !important;
  }
  .sca-energy-hud .sca-hud-mid {
    display: none !important;
  }
}

html[data-theme="light"] .gj-quota-strip {
  background: #ffffff !important;
  color: #0f172a !important;
}
html[data-theme="light"] .gj-qs-range,
html[data-theme="light"] .gj-qs-range b,
html[data-theme="light"] .gj-qs-range small {
  color: #0f172a !important;
}
html[data-theme="light"] .sca-energy-hud .sca-beam-pct.is-bull-pct {
  background: #d1fae5 !important;
  color: #065f46 !important;
}
html[data-theme="light"] .sca-energy-hud .sca-beam-pct.is-bear-pct {
  background: #ffe4e6 !important;
  color: #9f1239 !important;
}
html[data-theme="light"] .sca-energy-hud .sca-hud-mid {
  background: #f1f5f9 !important;
  color: #334155 !important;
}

/* ============================================================================
   11. v84 Dribbble-Grade Spatial Price Chamber (.hcd-price-tower.is-spatial-chamber)
   ============================================================================ */
.hcd-price-tower.is-spatial-chamber {
  justify-content: flex-start !important;
  gap: 14px !important;
}
.hcd-price-tower.is-spatial-chamber .spc-radar-stage {
  flex: 1 1 auto !important;
  padding-left: 0 !important;
  gap: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: stretch !important;
}
.hcd-price-tower.is-spatial-chamber .spc-radar-stage::before {
  display: none !important;
}
.hcd-price-tower.is-spatial-chamber .spc-slab {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 13px 16px !important;
  border-radius: 12px !important;
  margin: 0 !important;
}
.hcd-price-tower.is-spatial-chamber .spc-slab.is-ceiling {
  background: linear-gradient(180deg, rgba(6, 78, 59, 0.55) 0%, rgba(15, 23, 42, 0.85) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.55) !important;
  border-top: 4px solid #10b981 !important;
  box-shadow: 0 8px 20px -8px rgba(16, 185, 129, 0.35) !important;
}
.hcd-price-tower.is-spatial-chamber .spc-slab.is-floor {
  background: linear-gradient(0deg, rgba(136, 19, 55, 0.55) 0%, rgba(15, 23, 42, 0.85) 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.55) !important;
  border-bottom: 4px solid #f43f5e !important;
  box-shadow: 0 -8px 20px -8px rgba(244, 63, 94, 0.35) !important;
}
.spc-slab-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.spc-slab-id {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.spc-zone {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 188px 1fr !important;
  align-items: stretch !important;
  gap: 10px !important;
  padding: 0 8px !important;
  overflow: hidden !important;
  transition: height 0.35s ease !important;
}
.spc-force-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
.spc-force-chip.is-down-force {
  background: rgba(16, 185, 129, 0.18) !important;
  border: 1px solid rgba(52, 211, 153, 0.45) !important;
  color: #a7f3d0 !important;
}
.spc-force-chip.is-up-force {
  background: rgba(244, 63, 94, 0.18) !important;
  border: 1px solid rgba(251, 113, 133, 0.45) !important;
  color: #fecdd3 !important;
}
.spc-slab-main {
  display: flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.spc-dist-pill {
  font-family: var(--font-body) !important;
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
.spc-dist-pill.is-up {
  color: #6ee7b7 !important;
}
.spc-dist-pill.is-dn {
  color: #fda4af !important;
}

/* Proportional Spatial Force Zone (Centered Full-Width SVG Cone + Full-Width Dashed Horizon + Balanced Twin Pills) */
.spc-zone {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  overflow: hidden !important;
  transition: height 0.35s ease !important;
}
.spc-v-ruler {
  position: absolute !important;
  top: 4px !important;
  bottom: 4px !important;
  width: 6px !important;
  z-index: 2 !important;
  pointer-events: none !important;
}
.spc-v-ruler.is-left {
  left: 12px !important;
  border-left: 2px dashed rgba(148, 163, 184, 0.55) !important;
  border-top: 2px solid rgba(148, 163, 184, 0.72) !important;
  border-bottom: 2px solid rgba(148, 163, 184, 0.72) !important;
}
.spc-v-ruler.is-right {
  right: 12px !important;
  border-right: 2px dashed rgba(148, 163, 184, 0.55) !important;
  border-top: 2px solid rgba(148, 163, 184, 0.72) !important;
  border-bottom: 2px solid rgba(148, 163, 184, 0.72) !important;
}
.spc-zone.is-upper-zone .spc-v-ruler {
  border-color: rgba(52, 211, 153, 0.65) !important;
}
.spc-zone.is-lower-zone .spc-v-ruler {
  border-color: rgba(251, 113, 133, 0.65) !important;
}
.spc-cone-svg {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  z-index: 1 !important;
  pointer-events: none !important;
}
.spc-slab-badges {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
.spc-slab-dist {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 4px !important;
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
.spc-slab-dist.is-up {
  background: rgba(6, 78, 59, 0.72) !important;
  border: 1px solid rgba(52, 211, 153, 0.45) !important;
  color: #d1fae5 !important;
}
.spc-slab-dist.is-dn {
  background: rgba(136, 19, 55, 0.72) !important;
  border: 1px solid rgba(251, 113, 133, 0.45) !important;
  color: #ffe4e6 !important;
}
.spc-slab-dist b {
  font-family: var(--mono) !important;
  font-weight: 800 !important;
}
.spc-slab-dist em {
  font-style: normal !important;
  opacity: 0.88 !important;
}
/* Full-Width Horizontal Dashed Horizon Bar (Single Proportional Checkpoint Level) */
.spc-horizon-bar {
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  z-index: 3 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 18px !important;
  box-sizing: border-box !important;
}
.spc-horizon-bar.is-res-horizon {
  transform: translateY(50%) !important;
}
.spc-horizon-bar.is-sup-horizon {
  transform: translateY(-50%) !important;
}
.spc-horizon-bar::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 50% !important;
  height: 0 !important;
  border-top: 1.5px dashed rgba(148, 163, 184, 0.68) !important;
  transform: translateY(-50%) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}
.spc-horizon-bar.is-res-horizon::before {
  border-top-color: rgba(52, 211, 153, 0.78) !important;
}
.spc-horizon-bar.is-sup-horizon::before {
  border-top-color: rgba(251, 113, 133, 0.78) !important;
}
.spc-horizon-bar .shb-edge-dot {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  z-index: 2 !important;
}
.spc-horizon-bar .shb-edge-dot.is-left {
  left: -3px !important;
}
.spc-horizon-bar .shb-edge-dot.is-right {
  right: -3px !important;
}
.spc-horizon-bar.is-res-horizon .shb-edge-dot,
.spc-horizon-bar.is-res-horizon .shb-mid-dot {
  background: #34d399 !important;
  box-shadow: 0 0 8px rgba(52, 211, 153, 0.95) !important;
}
.spc-horizon-bar.is-sup-horizon .shb-edge-dot,
.spc-horizon-bar.is-sup-horizon .shb-mid-dot {
  background: #fb7185 !important;
  box-shadow: 0 0 8px rgba(251, 113, 133, 0.95) !important;
}
.spc-horizon-bar .shb-dash-seg {
  display: none !important;
}
.spc-horizon-bar .shb-dash-seg.is-mid {
  display: flex !important;
  flex: 1 1 8px !important;
  min-width: 8px !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 2 !important;
}
.spc-horizon-bar .shb-mid-dot {
  display: block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
}
.spc-horizon-pill {
  position: relative !important;
  z-index: 3 !important;
  display: inline-flex !important;
  align-items: baseline !important;
  justify-content: center !important;
  gap: 4px !important;
  font-family: var(--font-body) !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  backdrop-filter: blur(8px) !important;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.45) !important;
}
.spc-horizon-pill.is-up,
.spc-horizon-pill.is-res-pill {
  background: rgba(6, 78, 59, 0.88) !important;
  border: 1px solid rgba(52, 211, 153, 0.62) !important;
  color: #d1fae5 !important;
}
.spc-horizon-pill.is-dn,
.spc-horizon-pill.is-sup-pill {
  background: rgba(136, 19, 55, 0.88) !important;
  border: 1px solid rgba(251, 113, 133, 0.62) !important;
  color: #ffe4e6 !important;
}
.spc-horizon-pill b {
  font-family: var(--mono) !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
}
.spc-horizon-pill em {
  font-style: normal !important;
  opacity: 0.92 !important;
}
.mts-ema20-note {
  color: #94a3b8 !important;
  font-size: 0.78rem !important;
  font-weight: 500 !important;
  margin-left: 4px !important;
}
.spc-cone-svg.is-down-cone .spc-wave {
  animation: spcWavePushDown 1.7s ease-in-out infinite;
}
.spc-cone-svg.is-down-cone .spc-wave.w2 {
  animation-delay: 0.35s;
}
.spc-cone-svg.is-up-cone .spc-wave {
  animation: spcWavePushUp 1.7s ease-in-out infinite;
}
.spc-cone-svg.is-up-cone .spc-wave.w2 {
  animation-delay: 0.35s;
}
@keyframes spcWavePushDown {
  0%, 100% { transform: translateY(-3px); opacity: 0.55; }
  50%      { transform: translateY(4px); opacity: 1; }
}
@keyframes spcWavePushUp {
  0%, 100% { transform: translateY(3px); opacity: 0.55; }
  50%      { transform: translateY(-4px); opacity: 1; }
}

/* Floating Live Spot Node inside the Spatial Price Chamber */
.hcd-price-tower.is-spatial-chamber .spc-spot-node {
  margin: 0 !important;
  padding: 0 !important;
}
.hcd-price-tower.is-spatial-chamber .spc-spot-node .sr-tug-core {
  padding: 13px 16px !important;
  border-radius: 13px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.stc-spot-left {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.hcd-price-tower.is-spatial-chamber .sr-tug-meter {
  margin-top: 2px !important;
  padding-top: 8px !important;
}

@media (max-width: 580px) {
  .spc-horizon-bar {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 4px !important;
  }
  .spc-horizon-bar .shb-dash-seg.is-edge {
    display: none !important;
  }
}

html[data-theme="light"] .hcd-price-tower.is-spatial-chamber .spc-slab.is-ceiling {
  background: linear-gradient(180deg, #ecfdf5 0%, #ffffff 100%) !important;
}
html[data-theme="light"] .hcd-price-tower.is-spatial-chamber .spc-slab.is-floor {
  background: linear-gradient(0deg, #fff1f2 0%, #ffffff 100%) !important;
}
html[data-theme="light"] .spc-force-chip.is-down-force,
html[data-theme="light"] .spc-dist-pill.is-up,
html[data-theme="light"] .spc-slab-dist.is-up,
html[data-theme="light"] .spc-horizon-pill.is-up,
html[data-theme="light"] .spc-horizon-pill.is-res-pill {
  background: #ecfdf5 !important;
  color: #065f46 !important;
  border-color: rgba(16, 185, 129, 0.55) !important;
}
html[data-theme="light"] .spc-force-chip.is-up-force,
html[data-theme="light"] .spc-dist-pill.is-dn,
html[data-theme="light"] .spc-slab-dist.is-dn,
html[data-theme="light"] .spc-horizon-pill.is-dn,
html[data-theme="light"] .spc-horizon-pill.is-sup-pill {
  background: #fff1f2 !important;
  color: #9f1239 !important;
  border-color: rgba(244, 63, 94, 0.55) !important;
}
html[data-theme="light"] .mts-ema20-note {
  color: #475569 !important;
}

/* ============================================================================
   12. v88-v89 Frameless Gap Status Readout (.gj-gap-status-pill), Unfilled Gap Radar Strip (.gj-unfilled-strip) & Near-Touch Hardening
   ============================================================================ */
.spc-zone {
  min-height: 54px !important;
}
.spc-horizon-pill.is-testing-pill {
  background: linear-gradient(135deg, rgba(120, 53, 15, 0.92), rgba(30, 41, 59, 0.96)) !important;
  border: 1.5px solid #fbbf24 !important;
  color: #fef3c7 !important;
  box-shadow: 0 0 14px rgba(251, 191, 36, 0.45) !important;
}
/* Zero Box-in-Box inside .gj-kpi-card: .gj-gap-status-pill is 100% frameless typographic readout */
.gj-gap-status-pill,
.gj-gap-status-pill.is-cleared,
.gj-gap-status-pill.is-open,
.gj-gap-status-pill.is-flat {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 2px 0 0 !important;
  margin-top: 2px !important;
}
.gj-gap-status-pill .gsp-main {
  font-family: var(--font-body) !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}
.gj-gap-status-pill.is-cleared .gsp-main {
  color: #6ee7b7 !important;
}
.gj-gap-status-pill.is-open .gsp-main {
  color: #fde68a !important;
}
.gj-gap-status-pill.is-flat .gsp-main {
  color: #e2e8f0 !important;
}
.gj-gap-status-pill .gsp-sub {
  font-family: var(--font-body) !important;
  font-size: 0.76rem !important;
  color: #cbd5e1 !important;
  line-height: 1.3 !important;
}
.gj-gap-hist-note {
  display: block !important;
  margin-top: 4px !important;
  padding-top: 5px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.18) !important;
  font-family: var(--font-body) !important;
  font-size: 0.73rem !important;
  color: #94a3b8 !important;
  line-height: 1.3 !important;
}
.gj-gap-hist-note b {
  font-family: var(--mono) !important;
  color: #e2e8f0 !important;
  font-weight: 700 !important;
}

/* Asymmetric Proximity-Weighted Unfilled Historical Gap Strip (.gj-unfilled-strip) right below .gj-kpi-strip */
.gj-unfilled-strip.is-frameless-strip {
  margin-top: 12px !important;
  padding: 12px 2px 2px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.22) !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.gj-unfilled-strip .gj-ug-head {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px 14px !important;
  flex-wrap: wrap !important;
}
.gj-unfilled-strip .gj-ug-title {
  font-family: var(--font-body) !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
}
.gj-unfilled-strip .gj-ug-summary.is-all-clear {
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  color: #6ee7b7 !important;
  font-weight: 600 !important;
}
/* Asymmetric 2-Zone Hierarchy: Left = #1 Nearest Gap (Featured Warm Amber/Gold), Right = Next Gaps in a Low-Profile Box with Normal Readable Text */
.gj-unfilled-strip .gj-ug-hierarchy {
  display: grid !important;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 1.02fr) !important;
  gap: 12px 14px !important;
  align-items: stretch !important;
}
.gj-unfilled-strip .gj-ug-hero {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 10px 14px !important;
  border: 1px solid rgba(245, 183, 59, 0.48) !important;
  border-left: 4px solid #f5b73b !important;
  background: linear-gradient(135deg, rgba(245, 183, 59, 0.14) 0%, rgba(15, 23, 42, 0.55) 100%) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
}
.gj-unfilled-strip .gj-ug-hero-top {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
.gj-unfilled-strip .gj-ug-priority-pill {
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  color: #fde68a !important;
}
.gj-unfilled-strip .gj-ug-reach-tag {
  font-family: var(--font-body) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  color: #fbbf24 !important;
}
.gj-unfilled-strip .gj-ug-hero-main {
  display: flex !important;
  align-items: baseline !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
.gj-unfilled-strip .gj-ug-hero-px {
  font-family: var(--mono) !important;
  font-size: 1.52rem !important;
  font-weight: 800 !important;
  color: #fef08a !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
}
.gj-unfilled-strip .gj-ug-hero-dist {
  font-family: var(--font-body) !important;
  font-size: 0.92rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
}
.gj-unfilled-strip .gj-ug-reach-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-top: 2px !important;
}
.gj-unfilled-strip .gj-ug-reach-track {
  flex: 1 1 90px !important;
  height: 6px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.2) !important;
  overflow: hidden !important;
}
.gj-unfilled-strip .gj-ug-reach-track i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #f59e0b, #fde047) !important;
}
.gj-unfilled-strip .gj-ug-reach-txt {
  font-family: var(--font-body) !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
  color: #cbd5e1 !important;
  white-space: nowrap !important;
}
/* Right Secondary Box: Normal Readable Text Color, Subtle Low-Profile Neutral Box */
.gj-unfilled-strip .gj-ug-far-col {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 10px 14px !important;
  background: rgba(15, 23, 42, 0.42) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-radius: 11px !important;
  opacity: 1 !important;
}
.gj-unfilled-strip .gj-ug-far-head {
  font-family: var(--font-body) !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
  line-height: 1.25 !important;
}
.gj-unfilled-strip .gj-ug-far-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}
.gj-unfilled-strip .gj-ug-far-item {
  display: grid !important;
  grid-template-columns: 22px 66px 1fr auto !important;
  align-items: baseline !important;
  gap: 6px !important;
  font-family: var(--font-body) !important;
  font-size: 0.81rem !important;
  color: #e2e8f0 !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
}
.gj-unfilled-strip .gj-ug-far-rank {
  font-family: var(--mono) !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
}
.gj-unfilled-strip .gj-ug-far-px {
  font-family: var(--mono) !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
.gj-unfilled-strip .gj-ug-far-meta {
  font-weight: 600 !important;
  color: #e2e8f0 !important;
  white-space: nowrap !important;
}
.gj-unfilled-strip .gj-ug-far-date {
  font-size: 0.73rem !important;
  color: #94a3b8 !important;
  text-align: right !important;
  white-space: nowrap !important;
}
@media (max-width: 780px) {
  .gj-unfilled-strip .gj-ug-hierarchy {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
}

html[data-theme="light"] .gj-gap-status-pill,
html[data-theme="light"] .gj-gap-status-pill.is-cleared,
html[data-theme="light"] .gj-gap-status-pill.is-open,
html[data-theme="light"] .gj-gap-status-pill.is-flat {
  background: transparent !important;
  border: 0 !important;
}
html[data-theme="light"] .gj-gap-status-pill.is-cleared .gsp-main {
  color: #047857 !important;
}
html[data-theme="light"] .gj-gap-status-pill.is-open .gsp-main {
  color: #b45309 !important;
}
html[data-theme="light"] .gj-gap-status-pill .gsp-sub,
html[data-theme="light"] .gj-gap-hist-note {
  color: #334155 !important;
}
html[data-theme="light"] .gj-gap-hist-note b {
  color: #0f172a !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-hero {
  background: linear-gradient(135deg, #fffbeb 0%, #ffffff 100%) !important;
  border-color: rgba(245, 158, 11, 0.5) !important;
  border-left-color: #d97706 !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-far-col {
  background: #f8fafc !important;
  border-color: rgba(148, 163, 184, 0.35) !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-title,
html[data-theme="light"] .gj-unfilled-strip .gj-ug-hero-dist,
html[data-theme="light"] .gj-unfilled-strip .gj-ug-far-px,
html[data-theme="light"] .gj-unfilled-strip .gj-ug-far-meta {
  color: #0f172a !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-hero-px,
html[data-theme="light"] .gj-unfilled-strip .gj-ug-priority-pill,
html[data-theme="light"] .gj-unfilled-strip .gj-ug-reach-tag {
  color: #b45309 !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-summary.is-all-clear {
  color: #047857 !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-reach-txt,
html[data-theme="light"] .gj-unfilled-strip .gj-ug-far-head,
html[data-theme="light"] .gj-unfilled-strip .gj-ug-far-rank,
html[data-theme="light"] .gj-unfilled-strip .gj-ug-far-date {
  color: #334155 !important;
}

/* ============================================================================
   v93: Green/Red Gap Distance Direction + Redesigned #panel-news (Sleek Fear &
   Greed, Enriched 3-Week US Macro Calendar, Real-Time Auto-Polling News,
   Session-Phase Tagging 🌅/🔔/🌙, & Intraday Shock / GEX-Flip Radar)
   ============================================================================ */

/* 1. Green/Red Directional Distance on Unfilled Historical Gaps (▲ ด้านบน +$4.92 = Green, ▼ ล่าง −$9.84 = Red) */
.gj-unfilled-strip .gj-ug-hero-dist.is-up {
  color: #6ee7b7 !important;
  background: rgba(16, 185, 129, 0.16) !important;
  border-color: rgba(52, 211, 153, 0.42) !important;
}
.gj-unfilled-strip .gj-ug-hero-dist.is-down {
  color: #fda4af !important;
  background: rgba(244, 63, 94, 0.16) !important;
  border-color: rgba(251, 113, 133, 0.42) !important;
}
.gj-unfilled-strip .gj-ug-far-meta.is-up {
  color: #34d399 !important;
  font-weight: 700 !important;
}
.gj-unfilled-strip .gj-ug-far-meta.is-down {
  color: #fb7185 !important;
  font-weight: 700 !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-hero-dist.is-up {
  color: #047857 !important;
  background: rgba(16, 185, 129, 0.12) !important;
  border-color: rgba(16, 185, 129, 0.38) !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-hero-dist.is-down {
  color: #be123c !important;
  background: rgba(244, 63, 94, 0.12) !important;
  border-color: rgba(244, 63, 94, 0.38) !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-far-meta.is-up {
  color: #047857 !important;
}
html[data-theme="light"] .gj-unfilled-strip .gj-ug-far-meta.is-down {
  color: #be123c !important;
}

/* 2. Sleek Frameless Fear & Greed Widget (.fg-widget.is-sleek-strip) */
.fg-dial-svg-zone {
  font-family: var(--font-head);
  font-size: 11.5px;
  font-weight: 800;
}
#panel-news #mkEvents .fg-dial-col.is-frameless {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}
.fg-0dte-implication {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  padding: 0 0 10px 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16);
  font-size: 0.86rem;
  line-height: 1.45;
}
.fg-0dte-implication .fgi-kicker {
  font-family: var(--font-head);
  font-weight: 800;
  color: #fde68a;
  white-space: nowrap;
}
.fg-0dte-implication .fgi-txt {
  color: #e2e8f0;
  font-weight: 500;
}
#panel-news #mkEvents .fg-hist-grid.is-frameless-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 4px 0 !important;
}
#panel-news #mkEvents .fg-hist-card.is-frameless {
  background: transparent !important;
  border: 0 !important;
  border-right: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
  padding: 2px 16px !important;
  box-shadow: none !important;
}
#panel-news #mkEvents .fg-hist-card.is-frameless:first-child {
  padding-left: 0 !important;
}
#panel-news #mkEvents .fg-hist-card.is-frameless:last-child {
  border-right: 0 !important;
  padding-right: 0 !important;
}
.fg-hist-zdot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  margin-left: 2px;
}
.fg-hist-ztxt {
  font-size: 0.72rem;
  color: #94a3b8;
}
.fg-zones.is-spectrum-bar {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 4px !important;
  margin-top: 4px !important;
}
.fg-zones.is-spectrum-bar .fg-zone-pill {
  text-align: center;
  padding: 4px 6px;
  border-radius: 6px;
  font-size: 0.72rem;
  background: rgba(15, 23, 42, 0.45);
  border: 1px solid rgba(148, 163, 184, 0.16);
  border-top: 3px solid var(--zcol, #94a3b8);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.fg-zones.is-spectrum-bar .fg-zone-pill.is-active {
  background: rgba(245, 158, 11, 0.14);
  border-color: var(--zcol, #f59e0b);
  border-top-width: 3px;
  color: #f8fafc;
  font-weight: 700;
}

/* 3. Enriched 3-Week US Macro Calendar & Diffused Tonight Aura (.ev-card.is-today.is-tonight-aura) */
.ev-sec-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px 14px;
  margin-bottom: 12px;
}
.ev-sec-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
/* Diffused Ambient Aura for Tonight's Release Card (Audi 2026-10-22: "ที่กล่อง ออกคืนนี้เช่น OCT22พฤ. ... ทำให้มันมีออร่าฟุ่งๆออกมาหน่อยไหม จะได้รู้ว่าวันนี้บางทีไปดู🚨 ออกคืนนี้ (อีก 2 ชม.) ไม่ได้สังเกตุ") */
#panel-news #mkEvents .ev-timeline {
  padding: 12px 10px !important;
  overflow: visible !important;
}
#panel-news #mkEvents .ev-timeline .ev-card.is-today,
.ev-timeline .ev-card.is-today.is-featured-log {
  position: relative !important;
  overflow: visible !important;
  z-index: 2;
  margin-bottom: 6px !important;
  background:
    radial-gradient(ellipse 72% 130% at 18% 50%, rgba(244, 63, 94, 0.28) 0%, rgba(245, 158, 11, 0.14) 52%, transparent 86%),
    linear-gradient(135deg, rgba(52, 13, 30, 0.94) 0%, rgba(15, 23, 42, 0.96) 72%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.92) !important;
  box-shadow:
    0 0 0 1px rgba(251, 113, 133, 0.55),
    0 0 26px rgba(244, 63, 94, 0.52),
    0 0 58px rgba(245, 158, 11, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.24) !important;
  animation: evTonightCardAura 4.2s ease-in-out infinite;
}
#panel-news #mkEvents .ev-timeline .ev-card.is-today::before {
  content: "";
  position: absolute;
  inset: -10px;
  border-radius: 20px;
  background: radial-gradient(ellipse 90% 100% at 45% 50%, rgba(244, 63, 94, 0.42), rgba(245, 158, 11, 0.22) 58%, transparent 82%);
  filter: blur(14px);
  z-index: -1;
  pointer-events: none;
  animation: evTonightHaloBreathe 4.2s ease-in-out infinite;
}
@keyframes evTonightCardAura {
  0%, 100% {
    box-shadow:
      0 0 0 1px rgba(251, 113, 133, 0.5),
      0 0 24px rgba(244, 63, 94, 0.46),
      0 0 52px rgba(245, 158, 11, 0.26),
      inset 0 1px 0 rgba(255, 255, 255, 0.22);
  }
  50% {
    box-shadow:
      0 0 0 1.5px rgba(253, 164, 175, 0.85),
      0 0 34px rgba(244, 63, 94, 0.65),
      0 0 72px rgba(245, 158, 11, 0.38),
      inset 0 1px 0 rgba(255, 255, 255, 0.32);
  }
}
@keyframes evTonightHaloBreathe {
  0%, 100% { opacity: 0.65; transform: scale(0.995); }
  50% { opacity: 1; transform: scale(1.012); }
}
.ev-card.is-today .ev-leaf.leaf-red {
  border-color: rgba(251, 113, 133, 0.85) !important;
  box-shadow: 0 0 16px rgba(244, 63, 94, 0.48) !important;
}
.chip.ev-tonight-beacon {
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  padding: 4px 11px !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, rgba(225, 29, 72, 0.92), rgba(217, 119, 6, 0.88)) !important;
  border: 1px solid rgba(254, 205, 211, 0.8) !important;
  box-shadow: 0 0 16px rgba(244, 63, 94, 0.62), 0 0 28px rgba(245, 158, 11, 0.32) !important;
}
.ev-meta-pill.is-time {
  color: #f8fafc !important;
  font-weight: 700 !important;
  background: rgba(30, 41, 59, 0.7) !important;
}
.ev-meta-pill.is-intraday-warn {
  color: #fecdd3 !important;
  background: rgba(244, 63, 94, 0.18) !important;
  border-color: rgba(251, 113, 133, 0.45) !important;
  font-weight: 700 !important;
}
.ev-meta-pill.is-preopen-tag {
  color: #fde68a !important;
  background: rgba(245, 158, 11, 0.14) !important;
  border-color: rgba(245, 158, 11, 0.35) !important;
  font-weight: 600 !important;
}
.ev-note-line {
  display: block;
  font-size: 0.78rem;
  color: #94a3b8;
  line-height: 1.4;
  margin-top: 2px;
}

/* 4. Real-Time News Header, Intraday Shock & GEX-Flip Radar (.news-shock-radar.is-command-deck), & SPY Directional Sentiment Pills */
.news-sec-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px 16px;
  padding-bottom: 12px;
  margin-bottom: 16px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.24);
}
#panel-news #mkNews .news-sec-head h3,
.news-sec-head h3 {
  margin: 0 !important;
  padding: 2px 0 2px 14px !important;
  border: 0 !important;
  border-left: 5px solid #e2c98f !important;
  font-family: var(--font-head) !important;
  font-size: clamp(1.62rem, 2.3vw, 1.98rem) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: -0.015em !important;
  color: #f8fafc !important;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.news-live-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.news-live-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-body);
  font-size: 0.82rem;
  font-weight: 600;
  color: #a7f3d0;
  padding: 5px 12px;
  border-radius: 999px;
  background: rgba(16, 185, 129, 0.12);
  border: 1px solid rgba(52, 211, 153, 0.34);
}

.news-shock-radar {
  margin: 0 0 18px 0;
  padding: 18px 20px;
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.88) 0%, rgba(7, 12, 24, 0.96) 100%);
  border: 1px solid rgba(148, 163, 184, 0.28);
  border-left: 5px solid #34d399;
  box-shadow: 0 12px 28px rgba(2, 6, 23, 0.45);
}
.news-shock-radar.is-warn {
  background: linear-gradient(145deg, rgba(69, 26, 3, 0.38) 0%, rgba(15, 23, 42, 0.95) 68%);
  border-color: rgba(245, 158, 11, 0.48);
  border-left-color: #f59e0b;
}
.news-shock-radar.is-alert {
  background: linear-gradient(145deg, rgba(76, 5, 25, 0.46) 0%, rgba(15, 23, 42, 0.96) 68%);
  border-color: rgba(251, 113, 133, 0.56);
  border-left-color: #fb7185;
}
.nsr-head {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2);
}
.nsr-title-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px 14px;
}
.nsr-title-wrap strong,
.nsr-title-wrap strong.nsr-hero-title {
  font-family: var(--font-head);
  font-size: clamp(1.24rem, 1.68vw, 1.44rem) !important;
  font-weight: 800 !important;
  line-height: 1.28;
  color: #ffffff;
  letter-spacing: -0.01em;
}
.nsr-sub {
  margin: 0;
  font-family: var(--font-body);
  font-size: 0.9rem;
  font-weight: 500;
  color: #dbeafe;
  line-height: 1.45;
}
.nsr-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
}
.nsr-col,
.nsr-col.is-telemetry-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  padding: 13px 15px;
  border-radius: 12px;
  background: rgba(9, 15, 29, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-top: 3px solid #34d399;
  min-width: 0;
}
.nsr-col.is-warn {
  border-top-color: #f59e0b;
  background: linear-gradient(180deg, rgba(245, 158, 11, 0.08) 0%, rgba(9, 15, 29, 0.78) 100%);
}
.nsr-col.is-alert {
  border-top-color: #fb7185;
  background: linear-gradient(180deg, rgba(244, 63, 94, 0.1) 0%, rgba(9, 15, 29, 0.8) 100%);
}
.nsr-kicker {
  font-family: var(--font-body);
  font-size: 0.76rem;
  font-weight: 700;
  color: #94a3b8;
  letter-spacing: 0.01em;
}
.nsr-main {
  font-family: var(--font-body);
  font-size: 0.95rem;
  font-weight: 700;
  color: #f8fafc;
  line-height: 1.35;
}
.nsr-col.is-alert .nsr-main {
  color: #fda4af;
}
.nsr-col.is-warn .nsr-main {
  color: #fde68a;
}
.nsr-col.is-calm .nsr-main {
  color: #6ee7b7;
}
.nsr-news-meter {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 6px 9px;
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.18);
}
.nsr-nm-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  font-family: var(--font-body);
  font-size: 0.73rem;
  font-weight: 700;
}
.nsr-nm-side.is-up { color: #6ee7b7; white-space: nowrap; }
.nsr-nm-side.is-dn { color: #fda4af; white-space: nowrap; }
.nsr-nm-verdict {
  font-size: 0.72rem;
  font-weight: 700;
  color: #e2e8f0;
  text-align: center;
}
.nsr-nm-verdict.is-bear-bias { color: #fda4af; }
.nsr-nm-verdict.is-bull-bias { color: #6ee7b7; }
.nsr-nm-track {
  display: flex;
  width: 100%;
  height: 7px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(30, 41, 59, 0.9);
}
.nsr-nm-fill.is-bull {
  background: linear-gradient(90deg, #10b981, #34d399);
}
.nsr-nm-fill.is-bear {
  background: linear-gradient(90deg, #fb7185, #e11d48);
}
.nsr-mini-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.nsr-mp {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 6px;
  font-family: var(--mono);
  font-size: 0.72rem;
  font-weight: 700;
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.2);
  color: #cbd5e1;
}
.nsr-mp.is-up { color: #6ee7b7; border-color: rgba(52, 211, 153, 0.32); }
.nsr-mp.is-dn { color: #fda4af; border-color: rgba(251, 113, 133, 0.34); }
.nsr-mp.is-mid { color: #bae6fd; border-color: rgba(56, 189, 248, 0.3); }
.nsr-desc {
  font-family: var(--font-body);
  font-size: 0.82rem;
  color: #cbd5e1;
  line-height: 1.45;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* SPY Directional Sentiment Pill on News Cards (.news-spy-dir-pill) */
.news-spy-dir-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.74rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
}
.news-spy-dir-pill.is-compact,
.news-spy-dir-pill.is-inline {
  padding: 2px 8px;
  font-size: 0.71rem;
}
.news-spy-dir-pill.is-spy-bull {
  color: #6ee7b7;
  background: rgba(16, 185, 129, 0.18);
  border: 1px solid rgba(52, 211, 153, 0.5);
  box-shadow: 0 0 10px rgba(16, 185, 129, 0.16);
}
.news-spy-dir-pill.is-spy-bear {
  color: #fda4af;
  background: rgba(244, 63, 94, 0.18);
  border: 1px solid rgba(251, 113, 133, 0.52);
  box-shadow: 0 0 10px rgba(244, 63, 94, 0.16);
}
.news-spy-dir-pill.is-spy-mixed {
  color: #fde68a;
  background: rgba(245, 158, 11, 0.16);
  border: 1px solid rgba(251, 191, 36, 0.45);
}

.news-filter-deck {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px 14px;
  margin-bottom: 12px;
}
.news-filter-deck .news-tabs {
  margin-bottom: 0 !important;
}
.news-sess-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
}
.news-sess-btn {
  font-size: 0.77rem !important;
  padding: 4px 10px !important;
}
.news-sess-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-head);
  font-size: 0.73rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 6px;
  white-space: nowrap;
}
.news-sess-badge.sess-open {
  color: #fde68a;
  background: rgba(245, 158, 11, 0.16);
  border: 1px solid rgba(245, 158, 11, 0.38);
}
.news-sess-badge.sess-pre {
  color: #bae6fd;
  background: rgba(56, 189, 248, 0.15);
  border: 1px solid rgba(56, 189, 248, 0.35);
}
.news-sess-badge.sess-after {
  color: #ddd6fe;
  background: rgba(139, 92, 246, 0.15);
  border: 1px solid rgba(139, 92, 246, 0.35);
}
.news-gex-impact {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-head);
  font-size: 0.72rem;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 6px;
}
.news-gex-impact.is-open-shock {
  color: #fecdd3;
  background: rgba(244, 63, 94, 0.16);
  border: 1px solid rgba(251, 113, 133, 0.38);
}
.news-gex-impact.is-pre-shock {
  color: #fde68a;
  background: rgba(245, 158, 11, 0.14);
  border: 1px solid rgba(245, 158, 11, 0.32);
}
.news-gex-impact.is-after-shock {
  color: #cbd5e1;
  background: rgba(148, 163, 184, 0.12);
  border: 1px solid rgba(148, 163, 184, 0.25);
}

@media (max-width: 820px) {
  .nsr-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .nsr-col,
  .nsr-col.is-telemetry-card {
    padding: 12px 14px;
    border-right: 1px solid rgba(148, 163, 184, 0.2);
  }
  .fg-zones.is-spectrum-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

html[data-theme="light"] #panel-news #mkEvents .ev-timeline .ev-card.is-today {
  background: linear-gradient(135deg, #fff1f2 0%, #fffbeb 100%) !important;
  border-color: #f43f5e !important;
  box-shadow: 0 0 22px rgba(244, 63, 94, 0.28), 0 0 42px rgba(245, 158, 11, 0.18) !important;
}
html[data-theme="light"] .fg-0dte-implication .fgi-kicker {
  color: #b45309;
}
html[data-theme="light"] .fg-0dte-implication .fgi-txt {
  color: #1e293b;
}
html[data-theme="light"] .fg-zones.is-spectrum-bar .fg-zone-pill {
  background: #f8fafc;
  color: #475569;
  border-color: rgba(148, 163, 184, 0.3);
}
html[data-theme="light"] .fg-zones.is-spectrum-bar .fg-zone-pill.is-active {
  background: #fffbeb;
  color: #0f172a;
}
html[data-theme="light"] .news-sec-head h3,
html[data-theme="light"] .nsr-title-wrap strong,
html[data-theme="light"] .nsr-main {
  color: #0f172a !important;
}
html[data-theme="light"] .nsr-sub {
  color: #334155 !important;
}
html[data-theme="light"] .nsr-col,
html[data-theme="light"] .nsr-col.is-telemetry-card {
  background: #ffffff;
  border-color: rgba(148, 163, 184, 0.32);
}
html[data-theme="light"] .nsr-news-meter,
html[data-theme="light"] .nsr-mp {
  background: #f8fafc;
  border-color: rgba(148, 163, 184, 0.3);
  color: #1e293b;
}
html[data-theme="light"] .nsr-nm-verdict { color: #0f172a; }
html[data-theme="light"] .nsr-nm-verdict.is-bear-bias,
html[data-theme="light"] .nsr-nm-side.is-dn,
html[data-theme="light"] .nsr-mp.is-dn { color: #be123c; }
html[data-theme="light"] .nsr-nm-verdict.is-bull-bias,
html[data-theme="light"] .nsr-nm-side.is-up,
html[data-theme="light"] .nsr-mp.is-up { color: #047857; }
html[data-theme="light"] .nsr-mp.is-mid { color: #0369a1; }
html[data-theme="light"] .news-spy-dir-pill.is-spy-bull {
  color: #047857;
  background: #ecfdf5;
  border-color: rgba(16, 185, 129, 0.45);
}
html[data-theme="light"] .news-spy-dir-pill.is-spy-bear {
  color: #be123c;
  background: #fff1f2;
  border-color: rgba(244, 63, 94, 0.45);
}
html[data-theme="light"] .news-spy-dir-pill.is-spy-mixed {
  color: #b45309;
  background: #fffbeb;
  border-color: rgba(245, 158, 11, 0.45);
}
html[data-theme="light"] .news-live-status {
  color: #047857;
  background: rgba(16, 185, 129, 0.1);
}
html[data-theme="light"] .news-shock-radar {
  background: #f8fafc;
  border-color: rgba(148, 163, 184, 0.35);
}
html[data-theme="light"] .nsr-desc,
html[data-theme="light"] .ev-note-line {
  color: #334155;
}
html[data-theme="light"] .ev-meta-pill.is-time {
  color: #0f172a !important;
  background: #e2e8f0 !important;
}
html[data-theme="light"] .ev-meta-pill.is-intraday-warn {
  color: #be123c !important;
  background: rgba(244, 63, 94, 0.12) !important;
}
html[data-theme="light"] .ev-meta-pill.is-preopen-tag {
  color: #b45309 !important;
  background: rgba(245, 158, 11, 0.12) !important;
}
html[data-theme="light"] .news-sess-badge.sess-open {
  color: #b45309;
}
html[data-theme="light"] .news-sess-badge.sess-pre {
  color: #0369a1;
}
html[data-theme="light"] .news-sess-badge.sess-after {
  color: #6d28d9;
}
html[data-theme="light"] .news-gex-impact.is-open-shock {
  color: #be123c;
}
html[data-theme="light"] .news-gex-impact.is-pre-shock {
  color: #b45309;
}
html[data-theme="light"] .news-gex-impact.is-after-shock {
  color: #334155;
}

/* ==========================================================================
   v94 — ANIMATED FEAR & GREED ZONES + LIVE VIX COMPANION + 2-GROUP FILTER
   DECK + VISUAL SPOTLIGHT NEWS CARDS WITH REAL PHOTOS
   ========================================================================== */

/* 1. Animated Fear & Greed Gauge Arcs, Scale Nodes & Spectrum Pills */
.fg-arc-seg.is-active-arc {
  filter: drop-shadow(0 0 8px currentColor);
  animation: fgArcGlow 4.5s ease-in-out infinite;
}
.fg-arc-flow {
  stroke-dasharray: 8 18;
  opacity: 0.58;
  animation: fgArcFlowDash 5.2s linear infinite;
}
@keyframes fgArcGlow {
  0%, 100% { opacity: 0.92; }
  50% { opacity: 1; }
}
@keyframes fgArcFlowDash {
  from { stroke-dashoffset: 26; }
  to { stroke-dashoffset: 0; }
}
.fg-scale-node .fg-scale-bg {
  fill: rgba(15, 23, 42, 0.72);
  stroke: rgba(148, 163, 184, 0.25);
  stroke-width: 1;
}
.fg-scale-node .fg-scale-txt {
  font-family: var(--font-head);
  font-size: 9.2px;
  font-weight: 700;
  fill: #94a3b8;
}
.fg-scale-node.is-left.is-hot .fg-scale-bg {
  fill: rgba(245, 158, 11, 0.22);
  stroke: rgba(251, 191, 36, 0.65);
  animation: fgScaleNodePulse 4.2s ease-in-out infinite;
}
.fg-scale-node.is-left.is-hot .fg-scale-txt {
  fill: #fde68a;
  font-weight: 800;
}
.fg-scale-node.is-mid.is-hot .fg-scale-bg {
  fill: rgba(148, 163, 184, 0.25);
  stroke: rgba(226, 232, 240, 0.65);
  animation: fgScaleNodePulse 4.2s ease-in-out infinite;
}
.fg-scale-node.is-mid.is-hot .fg-scale-txt {
  fill: #f8fafc;
  font-weight: 800;
}
.fg-scale-node.is-right.is-hot .fg-scale-bg {
  fill: rgba(16, 185, 129, 0.22);
  stroke: rgba(52, 211, 153, 0.65);
  animation: fgScaleNodePulse 4.2s ease-in-out infinite;
}
.fg-scale-node.is-right.is-hot .fg-scale-txt {
  fill: #a7f3d0;
  font-weight: 800;
}
@keyframes fgScaleNodePulse {
  0%, 100% { opacity: 0.85; }
  50% { opacity: 1; }
}
.fg-pointer-pulse {
  transform-box: fill-box;
  transform-origin: center;
  animation: fgPointerRipple 3.6s ease-out infinite;
}
@keyframes fgPointerRipple {
  0% { transform: scale(0.65); opacity: 0.9; }
  100% { transform: scale(1.45); opacity: 0; }
}

/* Glossy-Active-Only Zone Pills with Calm, Luxurious Sheen Cadence (Audi 2026-10-22: "ตรง กล่องกลัวสุดขีด กลัวอะไรพวกนี้ ทำให้มันมันวาวแค่กล่องที่อยู่ในโซนดีกว่าไหม" + "ไอมันวาวมันขยับเร็วไปไหม") */
.fg-zones.is-spectrum-bar {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 6px !important;
  margin-top: 2px !important;
}
.fg-zones.is-spectrum-bar .fg-zone-pill,
.vix-tier-bar .vix-tier-pill {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 6px 6px !important;
  border-radius: 8px !important;
  font-size: 0.72rem !important;
  overflow: hidden;
  transition: transform 0.2s ease, border-color 0.2s ease;
  white-space: nowrap;
}
/* Quiet Matte Inactive Zones — zero gloss, zero colored top bar */
.fg-zones.is-spectrum-bar .fg-zone-pill.is-matte-zone,
.fg-zones.is-spectrum-bar .fg-zone-pill:not(.is-active),
.vix-tier-bar .vix-tier-pill.is-matte-zone,
.vix-tier-bar .vix-tier-pill:not(.is-on) {
  background: rgba(15, 23, 42, 0.36) !important;
  border: 1px solid rgba(148, 163, 184, 0.14) !important;
  border-top: 1px solid rgba(148, 163, 184, 0.14) !important;
  color: var(--dte-dim) !important;
  box-shadow: none !important;
  opacity: 0.62 !important;
  font-weight: 500 !important;
}
.fg-zones.is-spectrum-bar .fg-zone-pill:not(.is-active) b,
.vix-tier-bar .vix-tier-pill:not(.is-on) b {
  color: #94a3b8 !important;
  font-weight: 600 !important;
}
/* Glossy Metallic Active Zone ONLY (.is-active / .is-on) */
.fg-zones.is-spectrum-bar .fg-zone-pill.is-active,
.vix-tier-bar .vix-tier-pill.is-on {
  background: linear-gradient(
    165deg,
    rgba(255, 255, 255, 0.28) 0%,
    color-mix(in srgb, var(--zcol, var(--vcol, #f59e0b)) 38%, rgba(15, 23, 42, 0.94)) 46%,
    color-mix(in srgb, var(--zcol, var(--vcol, #f59e0b)) 18%, rgba(7, 12, 24, 0.98)) 100%
  ) !important;
  border: 1.5px solid var(--zcol, var(--vcol, #f59e0b)) !important;
  color: #ffffff !important;
  font-weight: 800 !important;
  opacity: 1 !important;
  box-shadow:
    0 6px 18px color-mix(in srgb, var(--zcol, var(--vcol, #f59e0b)) 38%, transparent),
    inset 0 1.5px 0 rgba(255, 255, 255, 0.65),
    inset 0 -1px 0 rgba(0, 0, 0, 0.35) !important;
  animation: fgActiveZoneBreathe 4.8s ease-in-out infinite;
}
.fg-zones.is-spectrum-bar .fg-zone-pill.is-active b,
.vix-tier-bar .vix-tier-pill.is-on b {
  color: #ffffff !important;
  font-weight: 900 !important;
}
.fg-zone-shimmer {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    115deg,
    transparent 24%,
    rgba(255, 255, 255, 0.34) 48%,
    rgba(255, 255, 255, 0.1) 54%,
    transparent 76%
  );
  background-size: 240% 100%;
  animation: fgZoneShimmer 7.2s ease-in-out infinite;
  pointer-events: none;
}
.fg-zone-live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--zcol, var(--vcol, #f59e0b));
  box-shadow: 0 0 8px var(--zcol, var(--vcol, #f59e0b));
  animation: fgDotBlink 3.2s ease-in-out infinite;
  flex: 0 0 7px;
}
@keyframes fgZoneShimmer {
  0% { background-position: 210% 0; opacity: 0.85; }
  42% { background-position: -190% 0; opacity: 0.9; }
  43%, 100% { background-position: -190% 0; opacity: 0; }
}
@keyframes fgActiveZoneBreathe {
  0%, 100% { transform: translateY(-1px); }
  50% { transform: translateY(-2px); }
}
@keyframes fgDotBlink {
  0%, 100% { transform: scale(0.92); opacity: 0.78; }
  50% { transform: scale(1.18); opacity: 1; }
}

/* 2. Symmetric 2-Card Twin-Cockpit Dual Sentiment Layout (.is-dual-sentiment-body.is-twin-cockpit) */
#panel-news #mkEvents .fg-body.is-dual-sentiment-body {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
  align-items: stretch !important;
}
.fg-cockpit-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  border-radius: 14px;
  background: linear-gradient(155deg, rgba(15, 23, 42, 0.72), rgba(7, 12, 24, 0.9));
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-top: 3px solid #f59e0b;
}
.fg-cockpit-card.is-vix-side {
  border-top: 3px solid #38bdf8;
  border-left: 1px solid rgba(56, 189, 248, 0.26);
}
.fgc-top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14);
}
.fgc-title {
  font-family: var(--font-head);
  font-size: 0.92rem;
  font-weight: 800;
  color: #fde68a;
}
.fgc-title.is-vix {
  color: #7dd3fc;
}
.fgc-badge {
  font-family: var(--font-head);
  font-size: 0.69rem;
  font-weight: 700;
  color: #cbd5e1;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(30, 41, 59, 0.75);
  border: 1px solid rgba(148, 163, 184, 0.24);
}
.fgc-badge.is-gold {
  color: #fde68a;
  background: rgba(245, 158, 11, 0.14);
  border-color: rgba(245, 158, 11, 0.34);
}
.fg-visual-split {
  display: grid;
  grid-template-columns: 205px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
}
.fg-right-stack {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}
.fg-delta-banner {
  font-family: var(--font-head);
  font-size: 0.82rem;
  font-weight: 700;
  color: #fde68a;
  padding: 6px 10px;
  border-radius: 8px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.25);
}
.fvc-main-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.fvc-px-wrap {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.fvc-px {
  font-family: var(--mono);
  font-size: 1.65rem;
  font-weight: 800;
  color: #f8fafc;
  line-height: 1;
}
.fvc-chg {
  font-family: var(--mono);
  font-size: 0.86rem;
  font-weight: 700;
}
.fvc-move-box {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
}
.fvc-move-box small {
  font-size: 0.7rem;
  color: #94a3b8;
}
.fvc-move-box b {
  font-family: var(--mono);
  font-size: 0.94rem;
  font-weight: 800;
  color: #e2c98f;
}
.vix-chart-wrap {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.vix-stat-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.vss-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 5px 6px;
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.52);
  border: 1px solid rgba(148, 163, 184, 0.18);
  text-align: center;
}
.vss-item small {
  font-family: var(--font-body);
  font-size: 0.69rem;
  font-weight: 600;
  color: #94a3b8;
  line-height: 1.15;
  white-space: nowrap;
}
.vss-item b {
  font-family: var(--mono);
  font-size: 0.9rem;
  font-weight: 800;
  color: #e2e8f0;
  line-height: 1.15;
}
.vss-item.is-lo b { color: #6ee7b7; }
.vss-item.is-hi b { color: #fcd34d; }
.vss-item.is-now {
  background: color-mix(in srgb, var(--vnow, #38bdf8) 14%, rgba(15, 23, 42, 0.78));
  border-color: color-mix(in srgb, var(--vnow, #38bdf8) 45%, rgba(148, 163, 184, 0.25));
}
.vss-item.is-now small { color: #cbd5e1; }
.vss-item.is-now b { color: var(--vnow, #38bdf8); }
.vix-visual-chart {
  width: 100%;
  height: auto;
  max-height: 112px;
  display: block;
}
.vix-axis-lbl {
  font-family: var(--font-head);
  font-size: 10.2px;
  font-weight: 800;
  fill: #cbd5e1;
}
.vix-axis-lbl.is-calm { fill: #6ee7b7; }
.vix-axis-lbl.is-warn { fill: #fcd34d; }
.vix-now-tag {
  font-family: var(--mono);
  font-size: 11.8px;
  font-weight: 800;
}
.vix-spy-corridor {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  border-radius: 8px;
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid rgba(56, 189, 248, 0.22);
  font-family: var(--mono);
  font-size: 0.73rem;
}
.vsc-side.is-dn { color: #fda4af; }
.vsc-side.is-up { color: #6ee7b7; }
.vsc-mid { color: #e2e8f0; font-weight: 700; }
.vix-tier-bar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.fg-0dte-implication.is-vix-imp {
  border-left-color: #38bdf8 !important;
  background: rgba(56, 189, 248, 0.08) !important;
}
.fg-0dte-implication.is-vix-imp .fgi-kicker {
  color: #7dd3fc !important;
}

/* 3. Two-Group Filter Deck (.news-filter-deck.is-two-group-deck) */
.news-filter-deck.is-two-group-deck {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding: 12px 14px;
  margin-bottom: 16px;
  border-radius: 12px;
  background: rgba(10, 16, 30, 0.65);
  border: 1px solid rgba(148, 163, 184, 0.2);
}
.nfd-group-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
}
.nfd-group-row.is-sess-group {
  padding-top: 8px;
  border-top: 1px solid rgba(148, 163, 184, 0.16);
}
.nfd-group-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-head);
  font-size: 0.76rem;
  font-weight: 800;
  color: #e2c98f;
  min-width: 148px;
  white-space: nowrap;
}
.nfd-step {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  font-family: var(--mono);
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 800;
  color: #07101f;
  background: #e2c98f;
}
.nfd-group-row.is-sess-group .nfd-group-label {
  color: #7dd3fc;
}
.nfd-group-row.is-sess-group .nfd-step {
  background: #38bdf8;
}

/* 4. Two-Tier Visual Spotlight Cards + 2-Column Scannable Thumbnail Feed */
.news-tier-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 4px 0 10px;
}
.news-tier-head.is-sub {
  margin-top: 18px;
}
.nth-badge {
  font-family: var(--font-head);
  font-size: 0.84rem;
  font-weight: 800;
  color: #fde68a;
  letter-spacing: 0.01em;
}
.nth-badge.is-muted {
  color: #94a3b8;
}

.news-spotlight-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.news-spot-card {
  display: flex;
  flex-direction: column;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.88) 0%, rgba(8, 13, 25, 0.95) 100%);
  border: 1px solid rgba(148, 163, 184, 0.24);
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.news-spot-card.is-lead-spot {
  border-color: rgba(251, 113, 133, 0.48);
  box-shadow: 0 8px 24px rgba(244, 63, 94, 0.12);
}
.news-spot-card:hover {
  transform: translateY(-2px);
  border-color: rgba(226, 201, 143, 0.55);
}
.nsc-media-link {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #07101f;
  text-decoration: none;
}
.nsc-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
  transition: transform 0.35s ease;
}
.news-spot-card:hover .nsc-photo {
  transform: scale(1.03);
}
.nsc-media-overlay {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 10px 12px;
  background: linear-gradient(180deg, rgba(4, 9, 20, 0.72) 0%, transparent 45%, rgba(4, 9, 20, 0.85) 100%);
  pointer-events: none;
}
.nsc-rank-pill {
  font-family: var(--font-head);
  font-size: 0.73rem;
  font-weight: 800;
  color: #07101f;
  background: linear-gradient(90deg, #fde68a, #f59e0b);
  padding: 3px 9px;
  border-radius: 999px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}
.nsc-body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
  gap: 8px;
  padding: 12px 14px 14px;
}
.nsc-kicker-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.nsc-cov-pill {
  font-family: var(--font-head);
  font-size: 0.71rem;
  font-weight: 700;
  color: #fda4af;
}
.nsc-headline-link {
  display: flex;
  flex-direction: column;
  gap: 5px;
  text-decoration: none;
}
.nsc-th-headline {
  font-family: var(--font-head);
  font-size: 1.02rem;
  font-weight: 700;
  color: #f8fafc;
  line-height: 1.42;
}
.nsc-headline-link:hover .nsc-th-headline {
  color: #fde68a;
}
.nsc-en-sub {
  font-size: 0.77rem;
  color: #94a3b8;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nsc-foot {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 8px;
  border-top: 1px solid rgba(148, 163, 184, 0.14);
}
.nsc-gex-hint {
  font-family: var(--font-head);
  font-size: 0.73rem;
  font-weight: 700;
  color: #fde68a;
}
.nsc-gex-hint.sess-open {
  color: #fda4af;
}
.nsc-gex-hint.sess-pre {
  color: #7dd3fc;
}
.nsc-gex-hint.sess-after {
  color: #c4b5fd;
}
.nsc-meta {
  font-size: 0.74rem;
  color: #94a3b8;
}

/* Branded Topic & Publisher Visual Art Backdrop (shows when photo is loading or unavailable) */
.news-visual-art {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 12px;
  overflow: hidden;
  background: radial-gradient(circle at 80% 20%, rgba(56, 189, 248, 0.24), transparent 60%), linear-gradient(145deg, #0f172a 0%, #070d19 100%);
  color: #7dd3fc;
}
.news-visual-art.is-fed {
  background: radial-gradient(circle at 80% 20%, rgba(245, 158, 11, 0.25), transparent 60%), linear-gradient(145deg, #1c1917 0%, #090d16 100%);
  color: #fcd34d;
}
.news-visual-art.is-ai {
  background: radial-gradient(circle at 80% 20%, rgba(52, 211, 153, 0.24), transparent 60%), linear-gradient(145deg, #06281e 0%, #070d19 100%);
  color: #6ee7b7;
}
.news-visual-art.is-geo {
  background: radial-gradient(circle at 80% 20%, rgba(251, 113, 133, 0.26), transparent 60%), linear-gradient(145deg, #2a0a18 0%, #070d19 100%);
  color: #fda4af;
}
.nva-grid {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
  background-size: 20px 20px;
  pointer-events: none;
}
.nva-icon svg {
  width: 38px;
  height: 38px;
  opacity: 0.85;
}
.nva-ticker {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(7, 12, 24, 0.82);
  border: 1px solid rgba(255, 255, 255, 0.16);
  font-family: var(--mono);
  font-size: 0.76rem;
  color: #f8fafc;
}
.nva-tlogo svg,
.nva-timg {
  width: 16px;
  height: 16px;
  border-radius: 4px;
  display: block;
}
.nva-src {
  position: absolute;
  bottom: 8px;
  right: 10px;
  font-family: var(--font-head);
  font-size: 0.68rem;
  font-weight: 700;
  color: rgba(226, 232, 240, 0.72);
  background: rgba(7, 12, 24, 0.68);
  padding: 2px 7px;
  border-radius: 5px;
}

/* Tier 2: 2-Column Compact Thumbnail Feed (.is-two-col-feed) */
#mkNews .news-list.is-two-col-feed {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px 14px !important;
}
#mkNews .news-list.is-two-col-feed > li.news-row-clean.is-compact-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 96px !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 12px 14px !important;
}
.ncc-main {
  display: flex;
  flex-direction: column;
  gap: 5px;
  min-width: 0;
}
.ncc-idx {
  font-family: var(--mono);
  font-size: 0.74rem;
  font-weight: 800;
  color: #94a3b8;
}
.ncc-thumb-wrap {
  position: relative;
  display: block;
  width: 96px;
  height: 68px;
  border-radius: 9px;
  overflow: hidden;
  background: #07101f;
  border: 1px solid rgba(148, 163, 184, 0.22);
  flex: 0 0 96px;
}
.ncc-thumb-wrap .nva-icon svg {
  width: 24px;
  height: 24px;
}
.ncc-thumb-wrap .nva-src {
  display: none;
}
.ncc-thumb-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
}
#mkNews .news-list.is-two-col-feed .nrc-en-sub {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (max-width: 1024px) {
  #panel-news #mkEvents .fg-body.is-dual-sentiment-body {
    grid-template-columns: 1fr !important;
  }
  .news-spotlight-grid {
    grid-template-columns: 1fr;
  }
  #mkNews .news-list.is-two-col-feed {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  .fg-visual-split {
    grid-template-columns: 1fr;
    justify-items: center;
  }
  .fg-zones.is-spectrum-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .vix-stat-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .vix-tier-bar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .vix-spy-corridor {
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
  }
}

html[data-theme="light"] .fg-cockpit-card,
html[data-theme="light"] .fg-vix-companion {
  background: #f8fafc;
  border-color: rgba(148, 163, 184, 0.35);
}
html[data-theme="light"] .vss-item {
  background: #ffffff;
  border-color: rgba(148, 163, 184, 0.32);
}
html[data-theme="light"] .vss-item small { color: #475569; }
html[data-theme="light"] .vss-item b { color: #0f172a; }
html[data-theme="light"] .vss-item.is-lo b { color: #047857; }
html[data-theme="light"] .vss-item.is-hi b { color: #b45309; }
html[data-theme="light"] .vss-item.is-now {
  background: #f0f9ff;
  border-color: rgba(2, 132, 199, 0.35);
}
html[data-theme="light"] .vss-item.is-now b { color: #0284c7; }
html[data-theme="light"] .fgc-title {
  color: #b45309;
}
html[data-theme="light"] .fgc-title.is-vix {
  color: #0369a1;
}
html[data-theme="light"] .fgc-badge {
  background: #ffffff;
  color: #334155;
  border-color: rgba(148, 163, 184, 0.35);
}
html[data-theme="light"] .fg-delta-banner {
  background: #fffbeb;
  color: #b45309;
  border-color: rgba(245, 158, 11, 0.35);
}
html[data-theme="light"] .fvc-px {
  color: #0f172a;
}
html[data-theme="light"] .fvc-move-box b {
  color: #b45309;
}
html[data-theme="light"] .vix-spy-corridor {
  background: #ffffff;
  border-color: rgba(2, 132, 199, 0.3);
}
html[data-theme="light"] .vsc-mid {
  color: #0f172a;
}
html[data-theme="light"] .vsc-side.is-dn { color: #be123c; }
html[data-theme="light"] .vsc-side.is-up { color: #047857; }
html[data-theme="light"] .news-filter-deck.is-two-group-deck {
  background: #f8fafc;
  border-color: rgba(148, 163, 184, 0.32);
}
html[data-theme="light"] .nfd-group-label {
  color: #b45309;
}
html[data-theme="light"] .nfd-group-row.is-sess-group .nfd-group-label {
  color: #0369a1;
}
html[data-theme="light"] .nth-badge {
  color: #b45309;
}
html[data-theme="light"] .news-spot-card {
  background: #ffffff;
  border-color: rgba(15, 23, 42, 0.16);
}
html[data-theme="light"] .nsc-th-headline {
  color: #0f172a;
}
html[data-theme="light"] .nsc-en-sub,
html[data-theme="light"] .nsc-meta {
  color: #475569;
}
html[data-theme="light"] .nsc-gex-hint {
  color: #b45309;
}
html[data-theme="light"] .nsc-gex-hint.sess-open {
  color: #be123c;
}
html[data-theme="light"] .nsc-gex-hint.sess-pre {
  color: #0369a1;
}
html[data-theme="light"] .nsc-gex-hint.sess-after {
  color: #6d28d9;
}

/* ==========================================================================
   v98 — REFINED FRAMELESS FEAR & GREED × VIX TWIN COCKPIT (ZERO BOX-IN-BOX
   CLUTTER) + SARABUN BODY TYPOGRAPHY + SPY-IMPACT COLORED PILL TELEMETRY
   ========================================================================== */

#panel-news #mkEvents .fg-widget.is-refined-v98 .fg-head h3 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
}
#panel-news #mkEvents .fg-body.is-refined-v98 .fg-cockpit-card {
  gap: 12px !important;
  padding: 16px 20px !important;
  border-radius: 16px !important;
  background: linear-gradient(160deg, rgba(15, 23, 42, 0.78) 0%, rgba(7, 12, 24, 0.94) 100%) !important;
  box-shadow: 0 10px 26px rgba(2, 6, 23, 0.36) !important;
}
#panel-news #mkEvents .fg-body.is-refined-v98 .fg-visual-split {
  display: grid !important;
  grid-template-columns: 222px minmax(0, 1fr) !important;
  gap: 16px !important;
  align-items: center !important;
}
#panel-news #mkEvents .fg-body.is-refined-v98 .fg-gauge-svg {
  width: 100% !important;
  max-width: 222px !important;
  height: auto !important;
  display: block !important;
}
#panel-news #mkEvents .fg-body.is-refined-v98 .fg-score-num {
  font-family: var(--mono) !important;
  font-size: 32px !important;
  font-weight: 800 !important;
}
#panel-news #mkEvents .fg-body.is-refined-v98 .fg-dial-svg-zone {
  font-family: var(--font-body) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
/* Frameless Delta Headline — No Brown Box Border */
#panel-news #mkEvents .fg-delta-banner.is-frameless-delta {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 0 !important;
  padding: 0 0 8px 0 !important;
  font-family: var(--font-body) !important;
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  color: #fde68a !important;
  box-shadow: none !important;
}
/* Unified VIX Hero Telemetry Header — Eliminates 4 Separate Stat Boxes & Duplicate Corridor Box */
.fvc-main-row.is-unified-vix-hero {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: flex-start !important;
  gap: 10px 14px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
}
.fvc-hero-left {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.fvc-inline-stats {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  font-family: var(--font-body);
  font-size: 0.77rem;
  font-weight: 500;
  color: #94a3b8;
}
.fvc-inline-stats b {
  font-family: var(--mono);
  font-weight: 700;
  color: #e2e8f0;
}
.fvc-inline-stats b.is-lo { color: #6ee7b7; }
.fvc-inline-stats b.is-hi { color: #fcd34d; }
.fvc-inline-stats .fis-sep { color: #475569; }
.fvc-hero-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  text-align: right;
}
.fvc-hero-right .fvc-move-box {
  gap: 4px;
}
.fvc-hero-right .fvc-move-box small {
  font-family: var(--font-body);
  font-size: 0.74rem;
  font-weight: 600;
  color: #cbd5e1;
}
.fvc-inline-corridor {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 7px;
  background: rgba(15, 23, 42, 0.52);
  border: 1px solid rgba(56, 189, 248, 0.22);
  font-family: var(--mono);
  font-size: 0.76rem;
  font-weight: 700;
  white-space: nowrap;
}
.fvc-inline-corridor .vsc-sep {
  color: #475569;
  font-weight: 400;
}
/* Frameless Implication Footer — Eliminates Nested Bottom Box on Both Cards */
#panel-news #mkEvents .fg-0dte-implication.is-frameless-footer,
#panel-news #mkEvents .fg-0dte-implication.is-vix-imp.is-frameless-footer {
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 0 !important;
  padding: 10px 0 0 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  font-family: var(--font-body) !important;
  font-size: 0.84rem !important;
  line-height: 1.48 !important;
}
#panel-news #mkEvents .fg-0dte-implication.is-frameless-footer .fgi-kicker {
  font-family: var(--font-body) !important;
  font-weight: 800 !important;
}

@media (max-width: 640px) {
  #panel-news #mkEvents .fg-body.is-refined-v98 .fg-visual-split {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
  }
  .fvc-hero-right {
    align-items: flex-start;
    text-align: left;
  }
}

html[data-theme="light"] #panel-news #mkEvents .fg-body.is-refined-v98 .fg-cockpit-card {
  background: #ffffff !important;
  border-color: rgba(148, 163, 184, 0.32) !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] #panel-news #mkEvents .fg-delta-banner.is-frameless-delta {
  color: #b45309 !important;
  border-bottom-color: rgba(148, 163, 184, 0.25) !important;
}
html[data-theme="light"] .fvc-inline-stats { color: #475569; }
html[data-theme="light"] .fvc-inline-stats b { color: #0f172a; }
html[data-theme="light"] .fvc-inline-stats b.is-lo { color: #047857; }
html[data-theme="light"] .fvc-inline-stats b.is-hi { color: #b45309; }
html[data-theme="light"] .fvc-hero-right .fvc-move-box small { color: #334155; }
html[data-theme="light"] .fvc-inline-corridor {
  background: #f8fafc;
  border-color: rgba(2, 132, 199, 0.28);
}

/* ==========================================================================
   v99 — ALIGNED TONIGHT CALENDAR CARD (FLUSH ROW + BALANCED AURA),
   2-LINE COLOR-CODED INSTRUMENT SPECTRUM TRACKS, & ANIMATED GAUGE DIAL
   WITH EXTREME FEAR / EXTREME GREED SHOCKWAVE ANIMATIONS
   ========================================================================== */

/* 1. Fix Tonight's Release Card Alignment ("เอาลงนิดนึง แต่ยังให้เด่นกว่าอันอื่น"):
      Remove margin-bottom: 6px so OCT 22 sits 100% flush with OCT 23, and dial back the outer aura so it doesn't bleed out */
#panel-news #mkEvents .ev-timeline .ev-card.is-today,
.ev-timeline .ev-card.is-today.is-featured-log {
  margin: 0 !important;
  transform: none !important;
  background:
    radial-gradient(ellipse 68% 120% at 15% 50%, rgba(244, 63, 94, 0.22) 0%, rgba(245, 158, 11, 0.1) 50%, transparent 82%),
    linear-gradient(135deg, rgba(44, 12, 27, 0.92) 0%, rgba(12, 19, 35, 0.96) 72%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.78) !important;
  box-shadow:
    0 0 0 1px rgba(251, 113, 133, 0.35),
    0 0 16px rgba(244, 63, 94, 0.32),
    0 0 32px rgba(245, 158, 11, 0.16),
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
  animation: evTonightCardAuraBalanced 4.8s ease-in-out infinite !important;
}
#panel-news #mkEvents .ev-timeline .ev-card.is-today::before {
  inset: -4px !important;
  border-radius: 16px !important;
  background: radial-gradient(ellipse 85% 95% at 40% 50%, rgba(244, 63, 94, 0.28), rgba(245, 158, 11, 0.14) 58%, transparent 82%) !important;
  filter: blur(9px) !important;
  animation: evTonightHaloBalanced 4.8s ease-in-out infinite !important;
}
@keyframes evTonightCardAuraBalanced {
  0%, 100% {
    box-shadow:
      0 0 0 1px rgba(251, 113, 133, 0.32),
      0 0 14px rgba(244, 63, 94, 0.28),
      0 0 28px rgba(245, 158, 11, 0.14),
      inset 0 1px 0 rgba(255, 255, 255, 0.16);
  }
  50% {
    box-shadow:
      0 0 0 1.5px rgba(253, 164, 175, 0.68),
      0 0 22px rgba(244, 63, 94, 0.44),
      0 0 42px rgba(245, 158, 11, 0.24),
      inset 0 1px 0 rgba(255, 255, 255, 0.24);
  }
}
@keyframes evTonightHaloBalanced {
  0%, 100% { opacity: 0.45; transform: scale(0.998); }
  50% { opacity: 0.78; transform: scale(1.005); }
}

/* 2. 2-Line Color-Coded Instrument Spectrum Track (.fg-zones.is-instrument-spectrum & .vix-tier-bar.is-instrument-spectrum) */
#panel-news #mkEvents .fg-zones.is-instrument-spectrum,
#panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum {
  gap: 7px !important;
  padding: 5px 6px !important;
  border-radius: 12px !important;
  background: rgba(6, 11, 22, 0.62) !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
}
#panel-news #mkEvents .fg-zones.is-instrument-spectrum .fg-zone-pill.is-two-line-seg,
#panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum .vix-tier-pill.is-two-line-seg {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  padding: 7px 6px 8px !important;
  border-radius: 9px !important;
  min-height: 46px !important;
  text-align: center !important;
}
.is-two-line-seg .sz-top {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  line-height: 1.15;
}
.is-two-line-seg .sz-top b {
  font-family: var(--mono) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em;
}
.is-two-line-seg .sz-lbl {
  font-family: var(--font-body) !important;
  font-size: 0.73rem !important;
  font-weight: 700 !important;
  line-height: 1.2;
}
.is-two-line-seg .sz-color-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--zcol, var(--vcol, #94a3b8));
  opacity: 0.75;
  flex: 0 0 6px;
}
/* Inactive segments keep a subtle top color bar and tinted range number so the whole 5-color spectrum reads as an instrument scale */
#panel-news #mkEvents .fg-zones.is-instrument-spectrum .fg-zone-pill.is-two-line-seg:not(.is-active),
#panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum .vix-tier-pill.is-two-line-seg:not(.is-on) {
  background: linear-gradient(180deg, color-mix(in srgb, var(--zcol, var(--vcol, #94a3b8)) 10%, rgba(15, 23, 42, 0.55)) 0%, rgba(10, 16, 30, 0.65) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.15) !important;
  border-top: 2.5px solid color-mix(in srgb, var(--zcol, var(--vcol, #94a3b8)) 58%, transparent) !important;
  opacity: 0.84 !important;
}
#panel-news #mkEvents .fg-zones.is-instrument-spectrum .fg-zone-pill.is-two-line-seg:not(.is-active) .sz-top b,
#panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum .vix-tier-pill.is-two-line-seg:not(.is-on) .sz-top b {
  color: color-mix(in srgb, var(--zcol, var(--vcol, #cbd5e1)) 75%, #e2e8f0) !important;
}
#panel-news #mkEvents .fg-zones.is-instrument-spectrum .fg-zone-pill.is-two-line-seg:not(.is-active) .sz-lbl,
#panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum .vix-tier-pill.is-two-line-seg:not(.is-on) .sz-lbl {
  color: #cbd5e1 !important;
  font-weight: 600 !important;
}
/* Active segment: Elevated glossy metallic highlight */
#panel-news #mkEvents .fg-zones.is-instrument-spectrum .fg-zone-pill.is-two-line-seg.is-active,
#panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum .vix-tier-pill.is-two-line-seg.is-on {
  border-top-width: 2.5px !important;
  transform: translateY(-1px);
}
#panel-news #mkEvents .fg-zones.is-instrument-spectrum .fg-zone-pill.is-two-line-seg.is-active .sz-lbl,
#panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum .vix-tier-pill.is-two-line-seg.is-on .sz-lbl {
  color: #ffffff !important;
  font-weight: 800 !important;
}
/* Extreme Regime Active Segment Pulse (0–24 กลัวสุดขีด, 76–100 โลภสุดขีด, >25 ตื่นตระหนก) */
.is-two-line-seg.is-extreme-active {
  animation: fgExtremeSegmentPulse 2.8s ease-in-out infinite !important;
}
@keyframes fgExtremeSegmentPulse {
  0%, 100% {
    transform: translateY(-1px) scale(1);
    box-shadow:
      0 6px 18px color-mix(in srgb, var(--zcol, var(--vcol, #f43f5e)) 42%, transparent),
      inset 0 1.5px 0 rgba(255, 255, 255, 0.7);
  }
  50% {
    transform: translateY(-2px) scale(1.025);
    box-shadow:
      0 0 0 2px color-mix(in srgb, var(--zcol, var(--vcol, #f43f5e)) 55%, transparent),
      0 10px 26px color-mix(in srgb, var(--zcol, var(--vcol, #f43f5e)) 65%, transparent),
      inset 0 1.5px 0 rgba(255, 255, 255, 0.85);
  }
}

/* 3. Animated Gauge Infographic (0 กลัวสุด · 50 กลาง · 100 โลภสุด) + Extreme Fear / Extreme Greed Animations */
#panel-news #mkEvents .fg-body.is-refined-v98 .fg-visual-split {
  grid-template-columns: 224px minmax(0, 1fr) !important;
  gap: 14px !important;
}
#panel-news #mkEvents .fg-body.is-refined-v98 .fg-gauge-svg {
  max-width: 224px !important;
  overflow: visible !important;
}
#panel-news #mkEvents .fg-hist-card.is-frameless {
  padding: 2px 10px !important;
}
#panel-news #mkEvents .fg-hist-card.is-frameless .fg-hist-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 4px;
  white-space: nowrap !important;
}
#panel-news #mkEvents .fg-hist-card.is-frameless .fg-hist-top small,
#panel-news #mkEvents .fg-hist-card.is-frameless .fg-hist-top span {
  white-space: nowrap !important;
}
.fg-gauge-svg .fg-scale-node .fg-scale-bg {
  fill: rgba(15, 23, 42, 0.86);
  stroke: rgba(148, 163, 184, 0.32);
  stroke-width: 1.1;
}
.fg-gauge-svg .fg-scale-node.is-left .fg-scale-bg {
  stroke: rgba(251, 113, 133, 0.42);
  fill: rgba(44, 12, 27, 0.65);
}
.fg-gauge-svg .fg-scale-node.is-right .fg-scale-bg {
  stroke: rgba(52, 211, 153, 0.42);
  fill: rgba(6, 40, 30, 0.65);
}
.fg-gauge-svg .fg-scale-node .fg-scale-txt {
  font-family: var(--font-body) !important;
  font-size: 9.8px !important;
  font-weight: 700 !important;
  fill: #e2e8f0;
}
.fg-gauge-svg .fg-scale-node.is-left .fg-scale-txt { fill: #fecdd3; }
.fg-gauge-svg .fg-scale-node.is-right .fg-scale-txt { fill: #a7f3d0; }
.fg-gauge-svg .fg-node-dot {
  transform-box: fill-box;
  transform-origin: center;
  animation: fgNodeDotBreathe 3.4s ease-in-out infinite;
}
.fg-gauge-svg .fg-scale-node.is-hot .fg-node-dot {
  animation: fgNodeDotHot 2s ease-in-out infinite;
}
@keyframes fgNodeDotBreathe {
  0%, 100% { opacity: 0.65; transform: scale(0.92); }
  50% { opacity: 1; transform: scale(1.18); }
}
@keyframes fgNodeDotHot {
  0%, 100% { opacity: 0.85; transform: scale(1); filter: drop-shadow(0 0 3px currentColor); }
  50% { opacity: 1; transform: scale(1.38); filter: drop-shadow(0 0 6px currentColor); }
}
.fg-inner-progress-arc {
  stroke-dasharray: 6 6;
  animation: fgInnerProgressFlow 4.2s linear infinite;
}
@keyframes fgInnerProgressFlow {
  from { stroke-dashoffset: 24; }
  to { stroke-dashoffset: 0; }
}
.fg-pointer-pulse-outer {
  transform-box: fill-box;
  transform-origin: center;
  animation: fgPointerRippleOuter 3.6s ease-out infinite 0.9s;
}
@keyframes fgPointerRippleOuter {
  0% { transform: scale(0.7); opacity: 0.75; }
  100% { transform: scale(1.55); opacity: 0; }
}
.fg-needle-group {
  animation: fgNeedleMicroSway 4.6s ease-in-out infinite;
}
.fg-needle-group.is-extreme-needle {
  animation: fgExtremeNeedleTremor 1.8s ease-in-out infinite;
}
@keyframes fgNeedleMicroSway {
  0%, 100% { transform: rotate(-0.8deg); }
  50% { transform: rotate(0.8deg); }
}
@keyframes fgExtremeNeedleTremor {
  0%, 100% { transform: rotate(-1.8deg); }
  50% { transform: rotate(1.8deg); }
}
/* Extreme Fear (0–24) & Extreme Greed (76–100) Radar Waves & Node Beacon */
.fg-extreme-wave {
  transform-box: fill-box;
  transform-origin: center;
  pointer-events: none;
}
.fg-extreme-wave.wave-1 {
  animation: fgExtremeShockwave 2.4s ease-out infinite;
}
.fg-extreme-wave.wave-2 {
  animation: fgExtremeShockwave 2.4s ease-out infinite 0.8s;
}
.fg-extreme-wave.wave-center {
  animation: fgExtremeCenterPulse 2.8s ease-in-out infinite;
}
.fg-scale-node.is-extreme-trigger {
  transform-box: fill-box;
  transform-origin: center;
  animation: fgExtremeNodeBeacon 2.2s ease-in-out infinite;
}
.fg-scale-node.is-left.is-extreme-trigger .fg-scale-bg {
  fill: rgba(225, 29, 72, 0.38) !important;
  stroke: #fb7185 !important;
  stroke-width: 1.6 !important;
  filter: drop-shadow(0 0 8px rgba(244, 63, 94, 0.65));
}
.fg-scale-node.is-right.is-extreme-trigger .fg-scale-bg {
  fill: rgba(16, 185, 129, 0.35) !important;
  stroke: #e2c98f !important;
  stroke-width: 1.6 !important;
  filter: drop-shadow(0 0 8px rgba(226, 201, 143, 0.65));
}
@keyframes fgExtremeShockwave {
  0% { transform: scale(0.55); opacity: 0.92; }
  100% { transform: scale(1.85); opacity: 0; }
}
@keyframes fgExtremeCenterPulse {
  0%, 100% { transform: scale(0.94); opacity: 0.25; }
  50% { transform: scale(1.12); opacity: 0.65; }
}
@keyframes fgExtremeNodeBeacon {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}

html[data-theme="light"] #panel-news #mkEvents .fg-zones.is-instrument-spectrum,
html[data-theme="light"] #panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum {
  background: #f1f5f9 !important;
  border-color: rgba(148, 163, 184, 0.32) !important;
}
html[data-theme="light"] #panel-news #mkEvents .fg-zones.is-instrument-spectrum .fg-zone-pill.is-two-line-seg:not(.is-active),
html[data-theme="light"] #panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum .vix-tier-pill.is-two-line-seg:not(.is-on) {
  background: #ffffff !important;
  border-color: rgba(148, 163, 184, 0.28) !important;
  border-top: 2.5px solid var(--zcol, var(--vcol, #94a3b8)) !important;
}
html[data-theme="light"] #panel-news #mkEvents .fg-zones.is-instrument-spectrum .fg-zone-pill.is-two-line-seg:not(.is-active) .sz-top b,
html[data-theme="light"] #panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum .vix-tier-pill.is-two-line-seg:not(.is-on) .sz-top b {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-news #mkEvents .fg-zones.is-instrument-spectrum .fg-zone-pill.is-two-line-seg:not(.is-active) .sz-lbl,
html[data-theme="light"] #panel-news #mkEvents .vix-tier-bar.is-instrument-spectrum .vix-tier-pill.is-two-line-seg:not(.is-on) .sz-lbl {
  color: #475569 !important;
}

/* ==========================================================================
   v100 — GRADUATED AURORA GLASS PROXIMITY HIERARCHY ON ECONOMIC CALENDAR:
   1. Tonight (.ev-card.is-today): Soft Rose-Gold Edge Aura (65% less red fill)
   2. Tomorrow / 1-2 Days (.ev-card.is-near-day): Delicate Thin Amber Edge Aura
   3. Next Major Catalyst (.ev-card.is-featured-log:not(.is-today)): Subtle Gold Hairline
   ========================================================================== */

/* Tier 1: Tonight's Release (.ev-card.is-today) — Dark Starlight Navy base + Soft 9% Corner Wash + Refined Rose-Gold Edge Glow (No heavy red fog) */
#panel-news #mkEvents .ev-timeline .ev-card.is-today,
.ev-timeline .ev-card.is-today.is-featured-log {
  margin: 0 !important;
  transform: none !important;
  background:
    radial-gradient(ellipse 52% 90% at 0% 0%, rgba(244, 63, 94, 0.11) 0%, rgba(245, 158, 11, 0.05) 46%, transparent 74%),
    linear-gradient(160deg, rgba(15, 23, 42, 0.94) 0%, rgba(9, 15, 28, 0.97) 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.54) !important;
  border-left: 3.5px solid #fb7185 !important;
  box-shadow:
    0 0 0 1px rgba(251, 113, 133, 0.18),
    0 0 14px rgba(244, 63, 94, 0.2),
    0 8px 20px rgba(2, 6, 23, 0.38),
    inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  animation: evTonightEdgeBreathe 5.2s ease-in-out infinite !important;
}
#panel-news #mkEvents .ev-timeline .ev-card.is-today::before {
  display: none !important;
}
@keyframes evTonightEdgeBreathe {
  0%, 100% {
    border-color: rgba(251, 113, 133, 0.48);
    box-shadow:
      0 0 0 1px rgba(251, 113, 133, 0.14),
      0 0 12px rgba(244, 63, 94, 0.16),
      0 8px 20px rgba(2, 6, 23, 0.38),
      inset 0 1px 0 rgba(255, 255, 255, 0.1);
  }
  50% {
    border-color: rgba(253, 164, 175, 0.72);
    box-shadow:
      0 0 0 1px rgba(251, 113, 133, 0.26),
      0 0 18px rgba(244, 63, 94, 0.28),
      0 8px 22px rgba(2, 6, 23, 0.42),
      inset 0 1px 0 rgba(255, 255, 255, 0.16);
  }
}
.ev-card.is-today .ev-leaf.leaf-red {
  border-color: rgba(251, 113, 133, 0.62) !important;
  box-shadow: 0 0 10px rgba(244, 63, 94, 0.24) !important;
}
.chip.ev-tonight-beacon {
  background: linear-gradient(135deg, rgba(225, 29, 72, 0.78), rgba(217, 119, 6, 0.75)) !important;
  border: 1px solid rgba(253, 164, 175, 0.62) !important;
  box-shadow: 0 0 10px rgba(244, 63, 94, 0.28) !important;
}

/* Tier 2: Tomorrow / 1-2 Days Out (.ev-card.is-near-day) — Thin Warm-Amber / Gold Edge Aura (Subtler than Today, Distinct from Routine) */
#panel-news #mkEvents .ev-timeline .ev-card.is-near-day {
  margin: 0 !important;
  background:
    radial-gradient(ellipse 46% 80% at 0% 0%, rgba(245, 183, 59, 0.08) 0%, transparent 70%),
    linear-gradient(160deg, rgba(13, 21, 38, 0.9) 0%, rgba(8, 14, 26, 0.94) 100%) !important;
  border: 1px solid rgba(245, 183, 59, 0.38) !important;
  border-left: 3px solid rgba(251, 191, 36, 0.76) !important;
  box-shadow:
    0 0 10px rgba(245, 158, 11, 0.11),
    0 6px 16px rgba(2, 6, 23, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}
.log-spotlight-pill.is-nearday {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 9px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.71rem;
  font-weight: 700;
  color: #fde68a;
  background: rgba(245, 158, 11, 0.11);
  border: 1px solid rgba(245, 158, 11, 0.3);
}
.log-spotlight-pill.is-nearday .log-pulse-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #fbbf24;
  box-shadow: 0 0 6px rgba(251, 191, 36, 0.65);
}
.chip.ev-nearday-pill {
  border-color: rgba(251, 191, 36, 0.48) !important;
  box-shadow: 0 0 8px rgba(245, 158, 11, 0.16) !important;
}

/* Tier 3: Next Major Storm (.ev-card.is-featured-log:not(.is-today):not(.is-near-day)) — Quiet Champagne Hairline */
#panel-news #mkEvents .ev-timeline .ev-card.is-featured-log:not(.is-today):not(.is-near-day) {
  background:
    radial-gradient(ellipse 42% 75% at 0% 0%, rgba(226, 201, 143, 0.06) 0%, transparent 68%),
    rgba(11, 18, 34, 0.86) !important;
  border: 1px solid rgba(226, 201, 143, 0.3) !important;
  box-shadow: 0 6px 16px rgba(2, 6, 23, 0.3) !important;
}

html[data-theme="light"] #panel-news #mkEvents .ev-timeline .ev-card.is-today {
  background: linear-gradient(135deg, #fff5f6 0%, #ffffff 75%) !important;
  border-color: rgba(244, 63, 94, 0.55) !important;
  border-left: 3.5px solid #e11d48 !important;
  box-shadow: 0 0 12px rgba(244, 63, 94, 0.14) !important;
}
html[data-theme="light"] #panel-news #mkEvents .ev-timeline .ev-card.is-near-day {
  background: linear-gradient(135deg, #fffdf5 0%, #ffffff 75%) !important;
  border-color: rgba(245, 158, 11, 0.45) !important;
  border-left: 3px solid #d97706 !important;
  box-shadow: 0 0 10px rgba(245, 158, 11, 0.1) !important;
}
html[data-theme="light"] .log-spotlight-pill.is-nearday {
  color: #b45309;
  background: rgba(245, 158, 11, 0.1);
  border-color: rgba(245, 158, 11, 0.32);
}


/* ==========================================================================
   V101 — GEX OPEN-STAGE COMMAND & TELEMETRY ARCHITECTURE (#panel-gex)
   Zero Box-in-Box, Frameless 5-Column Instrument Readout Strip, Un-boxed SVGs,
   Open Concentration & Signal Zones, & 2-Column Precision Expiry Matrix
   ========================================================================== */

/* 1. SVG Chart Typography Upgrade (Outfit Tabular Numbers instead of Sarabun) */
.gx-svg .gx-ylab,
.gx-svg .gx-xlab {
  fill: #94a3b8 !important;
  font: 600 12px var(--font-head) !important;
  font-variant-numeric: tabular-nums !important;
}
.gx-svg .gx-spotlab {
  fill: #7dd3fc !important;
  font: 700 12.5px var(--font-head) !important;
}
.gx-svg .gx-atmlab {
  fill: #fde68a !important;
  font: 700 12px var(--font-head) !important;
}

/* 2. Compact Single-Line GEX Calm Telemetry Ribbon (.gx-calm) */
#panel-gex .gx-calm {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px 16px !important;
  padding: 9px 16px !important;
  margin: 0 0 18px !important;
  border-radius: 12px !important;
  background: rgba(10, 17, 32, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  box-shadow: none !important;
}
#panel-gex .gx-calm.gx-calm-ok {
  border-color: rgba(52, 211, 153, 0.36) !important;
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.1), rgba(10, 17, 32, 0.78) 60%) !important;
}
#panel-gex .gx-calm.gx-calm-wait {
  border-color: rgba(245, 183, 59, 0.36) !important;
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.1), rgba(10, 17, 32, 0.78) 60%) !important;
}
#panel-gex .gx-calm b {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 2px 10px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  background: rgba(148, 163, 184, 0.14) !important;
  color: #f8fafc !important;
  margin: 0 !important;
}
#panel-gex .gx-calm span {
  flex: 1 1 260px !important;
  font-size: 0.82rem !important;
  color: #cbd5e1 !important;
  margin: 0 !important;
}
#panel-gex .gx-calm small {
  font-size: 0.73rem !important;
  color: var(--dte-dim) !important;
  margin: 0 !important;
}

/* 3. Zone 1: GEX Command Deck (.gx-hero-shell.is-open-stage) — Frameless Open Stage */
#panel-gex .gx-hero-shell.is-open-stage {
  background: transparent !important;
  border: 0 !important;
  border-top: 0 !important;
  border-radius: 0 !important;
  padding: 2px 0 8px !important;
  margin-bottom: 24px !important;
  box-shadow: none !important;
}
#panel-gex .gx-hero-shell.is-open-stage .desk-head {
  padding: 0 0 14px !important;
  margin-bottom: 16px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  background: transparent !important;
}
#panel-gex .gx-hero-shell.is-open-stage .desk-date {
  font-family: var(--font-head) !important;
  font-size: clamp(1.38rem, 1.9vw, 1.66rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: #f8fafc !important;
}

/* 4. Frameless 5-Column Instrument Readout Strip (.gx-summary.is-frameless-strip) */
#panel-gex .gx-summary.is-frameless-strip {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 0 0 18px !important;
  border-radius: 16px !important;
  background: linear-gradient(160deg, rgba(13, 22, 40, 0.9) 0%, rgba(8, 14, 26, 0.94) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  box-shadow: 0 12px 30px rgba(2, 6, 23, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  overflow: hidden !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat {
  border: 0 !important;
  border-right: 1px solid rgba(148, 163, 184, 0.14) !important;
  border-top: 3px solid var(--gold) !important;
  border-radius: 0 !important;
  padding: 15px 18px !important;
  background: transparent !important;
  box-shadow: none !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 5px !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat:last-child {
  border-right: 0 !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat.dk-range {
  border-top-color: #f5b73b !important;
  background: radial-gradient(ellipse 85% 60% at 50% 0%, rgba(245, 183, 59, 0.09), transparent 72%) !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat.dk-call {
  border-top-color: #34d399 !important;
  background: radial-gradient(ellipse 85% 60% at 50% 0%, rgba(52, 211, 153, 0.1), transparent 72%) !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat.dk-put {
  border-top-color: #fb7185 !important;
  background: radial-gradient(ellipse 85% 60% at 50% 0%, rgba(251, 113, 133, 0.1), transparent 72%) !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat.dk-zero {
  border-top-color: #60a5fa !important;
  background: radial-gradient(ellipse 85% 60% at 50% 0%, rgba(96, 165, 250, 0.1), transparent 72%) !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat:hover {
  transform: none !important;
  background-color: rgba(255, 255, 255, 0.03) !important;
  box-shadow: none !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat small {
  font-family: var(--font-body) !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
  letter-spacing: 0.01em !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat b {
  font-family: var(--font-head) !important;
  font-size: clamp(1.32rem, 1.7vw, 1.58rem) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: -0.02em !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat.gx-conc-hero-stat b {
  font-size: clamp(1.06rem, 1.35vw, 1.24rem) !important;
}
#panel-gex .gx-summary.is-frameless-strip .gx-stat span {
  font-size: 0.77rem !important;
  line-height: 1.42 !important;
  color: #94a3b8 !important;
}

/* 5. Un-Boxed Hero SVGs inside .gx-hcard (Zero Box-in-Box) */
#panel-gex .gx-hcard .gx-hero-svg {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.12) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12) !important;
  border-radius: 0 !important;
  padding: 8px 0 !important;
  max-height: 98px !important;
}
#panel-gex .gx-hero-svg text {
  font-family: var(--font-head) !important;
}

/* 6. Zone 2: Frameless Net GEX Readout Header (.gx-cs-head) & 4x2 Reference Telemetry Grid */
#panel-gex .gx-chart-summary {
  margin: 0 0 14px !important;
}
#panel-gex .gx-cs-head {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px 16px !important;
  padding: 0 0 12px !important;
  margin-bottom: 4px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
}
#panel-gex .gx-cs-head .gx-stat {
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: baseline !important;
  gap: 10px !important;
}
#panel-gex .gx-cs-head .gx-stat small {
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  margin: 0 !important;
}
#panel-gex .gx-cs-head .gx-stat b {
  font-family: var(--font-head) !important;
  font-size: 1.56rem !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.02em !important;
}
#panel-gex details.gx-reference[data-detail="metrics"] .gx-stats {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding: 0 !important;
  margin: 8px 0 0 !important;
  border-radius: 14px !important;
  background: rgba(8, 14, 26, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  overflow: hidden !important;
}
#panel-gex details.gx-reference[data-detail="metrics"] .gx-stats .gx-stat {
  background: transparent !important;
  border: 0 !important;
  border-right: 1px solid rgba(148, 163, 184, 0.12) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12) !important;
  border-radius: 0 !important;
  padding: 12px 16px !important;
  box-shadow: none !important;
}
#panel-gex details.gx-reference[data-detail="metrics"] .gx-stats .gx-stat:nth-child(4n) {
  border-right: 0 !important;
}
#panel-gex details.gx-reference[data-detail="metrics"] .gx-stats .gx-stat:nth-child(n+5) {
  border-bottom: 0 !important;
}

/* 7. Open Architectural Sections (.gx-card.gx-open-sec) — Eliminate Triple Box-in-Box */
#panel-gex .gx-card.gx-open-sec {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
  padding: 26px 0 6px !important;
  margin-bottom: 24px !important;
  box-shadow: none !important;
}
#panel-gex .gx-card.gx-open-sec > .gx-head {
  margin-bottom: 16px !important;
}
#panel-gex .gx-card.gx-open-sec > .gx-head .gx-title {
  font-family: var(--font-head) !important;
  font-size: clamp(1.34rem, 1.85vw, 1.62rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: #f8fafc !important;
}
#panel-gex .gw-conc-banner {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin-bottom: 18px !important;
  gap: 14px !important;
}
#panel-gex .gw-conc-bars-wrap {
  padding: 12px 16px !important;
  border-radius: 13px !important;
  background: rgba(10, 17, 32, 0.82) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
}

/* 8. Zone 4: 5-Column Waveform Signals (.gx-signals & .gx-sig) — Zero Inner Boxes */
@media (min-width: 1180px) {
  #panel-gex .gx-signals {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
}
#panel-gex .gx-sig {
  padding: 15px 16px !important;
  gap: 8px !important;
}
#panel-gex .gx-sig .gx-at {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  font-family: var(--font-head) !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
}
#panel-gex .gx-sig .gx-sig-svg {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.12) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.12) !important;
  border-radius: 0 !important;
  padding: 4px 0 !important;
  height: 40px !important;
}

/* 9. Zone 5: Volatility Skew Frameless 3-Column Strip (.gx-stats.gx-stats-3) */
#panel-gex .gx-stats.gx-stats-3 {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding: 0 0 14px !important;
  margin: 0 0 14px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  background: transparent !important;
}
#panel-gex .gx-stats.gx-stats-3 .gx-stat {
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  border-right: 1px solid rgba(148, 163, 184, 0.14) !important;
  border-radius: 0 !important;
  padding: 2px 14px !important;
  box-shadow: none !important;
}
#panel-gex .gx-stats.gx-stats-3 .gx-stat:first-child {
  padding-left: 0 !important;
}
#panel-gex .gx-stats.gx-stats-3 .gx-stat:last-child {
  border-right: 0 !important;
  padding-right: 0 !important;
}
#panel-gex .gx-stats.gx-stats-3 .gx-stat:hover {
  transform: none !important;
  box-shadow: none !important;
}

/* 10. 2-Column Precision Expiry Horizon Matrix (#gexExpiry & #deskExpiry) */
#gexExpiry .ex-list,
#deskExpiry .ex-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px 14px !important;
  margin-top: 12px !important;
}
#gexExpiry .ex-r,
#deskExpiry .ex-r {
  display: grid !important;
  grid-template-columns: minmax(120px, 1.05fr) minmax(90px, 1.35fr) auto auto !important;
  align-items: center !important;
  gap: 10px 12px !important;
  padding: 11px 14px !important;
  border-radius: 12px !important;
  background: rgba(9, 16, 30, 0.78) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
  transition: transform 0.16s ease, border-color 0.16s ease !important;
}
#gexExpiry .ex-r:hover,
#deskExpiry .ex-r:hover {
  transform: translateY(-1px);
  border-color: rgba(148, 163, 184, 0.34) !important;
}
#gexExpiry .ex-r.is-next,
#deskExpiry .ex-r.is-next {
  background: linear-gradient(135deg, rgba(14, 36, 62, 0.88), rgba(9, 16, 30, 0.94)) !important;
  border-color: rgba(56, 189, 248, 0.45) !important;
  border-left: 3px solid #38bdf8 !important;
}
#gexExpiry .ex-r.is-friday,
#gexExpiry .ex-r.is-monthly,
#deskExpiry .ex-r.is-friday,
#deskExpiry .ex-r.is-monthly {
  background: linear-gradient(135deg, rgba(40, 30, 14, 0.78), rgba(9, 16, 30, 0.94)) !important;
  border-color: rgba(245, 183, 59, 0.42) !important;
  border-left: 3px solid #f5b73b !important;
}
#gexExpiry .ex-d,
#deskExpiry .ex-d {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
}
#gexExpiry .ex-d b,
#deskExpiry .ex-d b {
  font-family: var(--font-head) !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
  white-space: nowrap !important;
}
#gexExpiry .ex-d small,
#deskExpiry .ex-d small {
  font-size: 0.72rem !important;
  color: #94a3b8 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#gexExpiry .ex-bar,
#deskExpiry .ex-bar {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 9px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.14) !important;
  overflow: hidden !important;
  gap: 2px !important;
}
#gexExpiry .ex-bar i,
#deskExpiry .ex-bar i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
}
#gexExpiry .ex-bar i.ex-c,
#deskExpiry .ex-bar i.ex-c {
  background: linear-gradient(90deg, #10b981, #34d399) !important;
}
#gexExpiry .ex-bar i.ex-p,
#deskExpiry .ex-bar i.ex-p {
  background: linear-gradient(90deg, #f43f5e, #fb7185) !important;
}
#gexExpiry .ex-n,
#deskExpiry .ex-n {
  font-family: var(--font-head) !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
  color: #f8fafc !important;
  white-space: nowrap !important;
  text-align: right !important;
}
#gexExpiry .ex-n small,
#deskExpiry .ex-n small {
  font-family: var(--font-body) !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  color: #94a3b8 !important;
}

@media (max-width: 1080px) {
  #panel-gex .gx-summary.is-frameless-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #panel-gex .gx-summary.is-frameless-strip .gx-stat {
    border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
  }
  #panel-gex .gx-summary.is-frameless-strip .gx-stat.gx-conc-hero-stat {
    grid-column: 1 / -1 !important;
  }
  #gexExpiry .ex-list,
  #deskExpiry .ex-list {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  #panel-gex .gx-summary.is-frameless-strip,
  #panel-gex details.gx-reference[data-detail="metrics"] .gx-stats,
  #panel-gex .gx-stats.gx-stats-3 {
    grid-template-columns: 1fr !important;
  }
  #panel-gex .gx-stats.gx-stats-3 .gx-stat {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.12) !important;
    padding: 8px 0 !important;
  }
  #gexExpiry .ex-r,
  #deskExpiry .ex-r {
    grid-template-columns: 1fr auto !important;
  }
  #gexExpiry .ex-bar,
  #deskExpiry .ex-bar {
    grid-column: 1 / -1 !important;
  }
}

html[data-theme="light"] #panel-gex .gx-calm,
html[data-theme="light"] #panel-gex .gx-summary.is-frameless-strip,
html[data-theme="light"] #panel-gex .gw-conc-bars-wrap,
html[data-theme="light"] #gexExpiry .ex-r,
html[data-theme="light"] #deskExpiry .ex-r {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.15) !important;
}
html[data-theme="light"] #panel-gex .gx-hero-shell.is-open-stage .desk-date,
html[data-theme="light"] #panel-gex .gx-card.gx-open-sec > .gx-head .gx-title,
html[data-theme="light"] #gexExpiry .ex-d b,
html[data-theme="light"] #gexExpiry .ex-n {
  color: #0f172a !important;
}

/* === AUDIFLIX Semantic Jewel-Tone Multi-Tab & Filter Pill System (Audi 2026-10-22) === */
/* Topic-Grouped Jewel-Tone Navigation on #tabList (1 Group = 1 Jewel Color Family + Clear | Dividers & Group Labels, Zero Mid-Group Row Split) */
.tabs .wrap#tabList {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px 5px !important;
  padding: 10px 12px !important;
  overflow: visible !important;
}
.dte-tab-shell .tab-sep {
  display: inline-block !important;
  width: 2px !important;
  height: 24px !important;
  margin: 0 6px !important;
  background: linear-gradient(180deg, transparent, rgba(226, 201, 143, 0.88), transparent) !important;
  border-radius: 999px !important;
  flex: 0 0 2px !important;
}
@media (min-width: 960px) {
  /* Force a clean 2-row split right after Group ② (☑️ เช็คลิสต์):
     Row 1 = [📘 Guide] | ① ตลาด & กราฟ (4 Cyan) | ② โต๊ะเทรด & Data (3 Emerald)
     Row 2 = ③ พอร์ต & จดเทรด (2 Rose) | ④ คอร์ส & ความรู้ (3 Violet) | ⑤ 🔒 หลังบ้าน Audi (2 Crimson) */
  #tabList .tab[data-tab="playbook"] + .tab-sep {
    flex: 0 0 100% !important;
    width: 100% !important;
    height: 1px !important;
    margin: 2px 0 !important;
    background: linear-gradient(90deg, transparent 8%, rgba(226, 201, 143, 0.28) 50%, transparent 92%) !important;
  }
}
.dte-tab-shell .tab-group {
  display: inline-flex !important;
  align-items: center !important;
  font-family: var(--aku-font-body) !important;
  font-size: 0.73rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.01em !important;
  color: var(--grp, #cbd5e1) !important;
  padding: 2px 5px 2px 2px !important;
  white-space: nowrap !important;
  opacity: 0.96 !important;
}
#tabList .tab {
  padding: 5px 10px !important;
  min-height: 33px !important;
  font-family: var(--aku-font-body) !important;
  font-size: 0.79rem !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease !important;
}
/* Start Guide: Amber-Gold Jewel */
#tabList .tab[data-tab="guide"] {
  background: linear-gradient(135deg, #433010 0%, #241907 100%) !important;
  border: 1.5px solid rgba(245, 158, 11, 0.72) !important;
  color: #fef3c7 !important;
}
#tabList .tab[data-tab="guide"]:is(:hover, :focus-visible, [aria-selected="true"]) {
  background: linear-gradient(135deg, #684812 0%, #3b2708 100%) !important;
  border-color: #fde68a !important;
  color: #fffbeb !important;
  box-shadow: 0 0 18px rgba(245, 158, 11, 0.45), 0 6px 16px rgba(0, 0, 0, 0.44), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
  transform: translateY(-1.5px);
}
/* Group ① ตลาด & กราฟ (market, news, gex, chart): Electric-Cyan Jewel */
#tabList .tab:is([data-tab="market"], [data-tab="news"], [data-tab="gex"], [data-tab="chart"]) {
  background: linear-gradient(135deg, #142c52 0%, #0b1930 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.62) !important;
  color: #e0f2fe !important;
}
#tabList .tab:is([data-tab="market"], [data-tab="news"], [data-tab="gex"], [data-tab="chart"]):is(:hover, :focus-visible, [aria-selected="true"]) {
  background: linear-gradient(135deg, #214985 0%, #132b52 100%) !important;
  border-color: #bae6fd !important;
  color: #ffffff !important;
  box-shadow: 0 0 18px rgba(56, 189, 248, 0.48), 0 6px 16px rgba(0, 0, 0, 0.44), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  transform: translateY(-1.5px);
}
/* Group ② โต๊ะเทรด & Data (levels, setups, playbook): Emerald-Teal Jewel */
#tabList .tab:is([data-tab="levels"], [data-tab="setups"], [data-tab="playbook"]) {
  background: linear-gradient(135deg, #0f362f 0%, #081e1a 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.62) !important;
  color: #d1fae5 !important;
}
#tabList .tab:is([data-tab="levels"], [data-tab="setups"], [data-tab="playbook"]):is(:hover, :focus-visible, [aria-selected="true"]) {
  background: linear-gradient(135deg, #17594c 0%, #0d352d 100%) !important;
  border-color: #a7f3d0 !important;
  color: #ffffff !important;
  box-shadow: 0 0 18px rgba(16, 185, 129, 0.48), 0 6px 16px rgba(0, 0, 0, 0.44), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  transform: translateY(-1.5px);
}
/* Group ③ พอร์ต & จดเทรด (mytrades, trades): Sakura-Rose Jewel */
#tabList .tab:is([data-tab="mytrades"], [data-tab="trades"]) {
  background: linear-gradient(135deg, #451732 0%, #260c1b 100%) !important;
  border: 1.5px solid rgba(244, 114, 182, 0.62) !important;
  color: #fce7f3 !important;
}
#tabList .tab:is([data-tab="mytrades"], [data-tab="trades"]):is(:hover, :focus-visible, [aria-selected="true"]) {
  background: linear-gradient(135deg, #6b214d 0%, #3d122c 100%) !important;
  border-color: #f9a8d4 !important;
  color: #ffffff !important;
  box-shadow: 0 0 18px rgba(236, 72, 153, 0.48), 0 6px 16px rgba(0, 0, 0, 0.44), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  transform: translateY(-1.5px);
}
/* Group ④ คอร์ส & ความรู้ (library, lessons, tools): Royal-Violet Jewel */
#tabList .tab:is([data-tab="library"], [data-tab="lessons"], [data-tab="tools"]) {
  background: linear-gradient(135deg, #311e52 0%, #1b102e 100%) !important;
  border: 1.5px solid rgba(168, 85, 247, 0.62) !important;
  color: #f3e8ff !important;
}
#tabList .tab:is([data-tab="library"], [data-tab="lessons"], [data-tab="tools"]):is(:hover, :focus-visible, [aria-selected="true"]) {
  background: linear-gradient(135deg, #4e2f82 0%, #2c194d 100%) !important;
  border-color: #e9d5ff !important;
  color: #ffffff !important;
  box-shadow: 0 0 18px rgba(168, 85, 247, 0.48), 0 6px 16px rgba(0, 0, 0, 0.44), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  transform: translateY(-1.5px);
}
/* Group ⑤ หลังบ้าน Audi (review, paper): Ruby-Crimson Jewel */
body.is-owner-view #tabList .tab:is([data-tab="review"], [data-tab="paper"]) {
  background: linear-gradient(135deg, #471823 0%, #290d14 100%) !important;
  border: 1.5px solid rgba(244, 63, 94, 0.62) !important;
  color: #ffe4e6 !important;
  border-radius: 999px !important;
}
body.is-owner-view #tabList .tab:is([data-tab="review"], [data-tab="paper"]):is(:hover, :focus-visible, [aria-selected="true"]) {
  background: linear-gradient(135deg, #682132 0%, #3d121d 100%) !important;
  border-color: #fecdd3 !important;
  color: #ffffff !important;
  box-shadow: 0 0 18px rgba(244, 63, 94, 0.48), 0 6px 16px rgba(0, 0, 0, 0.44), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  transform: translateY(-1.5px);
}
/* GEX 2-Option Segmented Switchers (.gx-seg): Quiet Inactive vs Semantic Jewel Active per Control Group */
#panel-gex .gx-seg {
  background: rgba(9, 16, 30, 0.88) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  border-radius: 10px !important;
  padding: 3px !important;
  gap: 3px !important;
}
#panel-gex .gx-seg button {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: #94a3b8 !important;
  border-radius: 7px !important;
  font-weight: 600 !important;
}
#panel-gex .gx-seg:nth-of-type(1) button[aria-pressed="true"] {
  background: linear-gradient(135deg, #684812 0%, #3b2708 100%) !important;
  border: 1.5px solid #fde68a !important;
  color: #fffbeb !important;
  font-weight: 700 !important;
  box-shadow: 0 0 14px rgba(245, 158, 11, 0.35) !important;
}
#panel-gex .gx-seg:nth-of-type(2) button[aria-pressed="true"] {
  background: linear-gradient(135deg, #214985 0%, #132b52 100%) !important;
  border: 1.5px solid #bae6fd !important;
  color: #f0f9ff !important;
  font-weight: 700 !important;
  box-shadow: 0 0 14px rgba(56, 189, 248, 0.35) !important;
}
#panel-gex .gx-seg:nth-of-type(3) button[aria-pressed="true"] {
  background: linear-gradient(135deg, #17594c 0%, #0d352d 100%) !important;
  border: 1.5px solid #a7f3d0 !important;
  color: #ecfdf5 !important;
  font-weight: 700 !important;
  box-shadow: 0 0 14px rgba(16, 185, 129, 0.35) !important;
}
.gx-svg .gx-spotlab.is-zglab {
  fill: #fde68a !important;
}

/* ==========================================================================
   V103 — 6-POD MODULAR WORKSPACE COMMAND DECK, EQUAL-HEIGHT STRIKE SPREAD,
   CRISP DENSE-CLUSTER HEATMAP & 3-COLUMN SEPARATED OPEX HORIZON MATRIX
   ========================================================================== */

/* 1. Frameless 6-Pod Workspace Sub-Navigator Bar (nav.tabs & .dte-tab-shell — Zero Outer Box, Zero Inner Pod Boxes) */

html.dte-brand-managed .tabs {
  position: relative !important;
  top: auto !important;
  z-index: 10 !important;
  margin: 12px 0 10px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  backdrop-filter: none !important;
}
.dte-tab-shell {
  width: 100% !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 4px 20px 14px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
  box-shadow: none !important;
}
.tabs .wrap#tabList {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  gap: 12px 16px !important;
  padding: 0 !important;
  overflow: visible !important;
}
.dte-tab-shell .tab-sep {
  display: none !important;
}
.dte-tab-shell .tab-pod,
.dte-tab-shell .tab-pod.is-guide-pod,
.dte-tab-shell .tab-pod[data-pod="market"],
.dte-tab-shell .tab-pod[data-pod="desk"],
.dte-tab-shell .tab-pod[data-pod="journal"],
.dte-tab-shell .tab-pod[data-pod="learn"],
.dte-tab-shell .tab-pod[data-pod="owner"],
.dte-tab-shell .tab-pod:has([aria-selected="true"]) {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  padding: 0 16px 0 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-top: 0 !important;
  border-right: 1px solid rgba(226, 201, 143, 0.28) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
}
.dte-tab-shell .tab-pod:last-of-type,
body:not(.is-owner-view) .dte-tab-shell .tab-pod[data-pod="learn"] {
  border-right: 0 !important;
  padding-right: 0 !important;
}
body:not(.is-owner-view) .dte-tab-shell .tab-pod.owner-tab {
  display: none !important;
}
.dte-tab-shell .tab-group {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-family: var(--aku-font-body) !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.01em !important;
  color: var(--grp, #e2e8f0) !important;
  padding: 0 2px !important;
  white-space: nowrap !important;
  opacity: 0.94 !important;
}
.dte-tab-shell .tab-pod-btns {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}
#tabList .tab {
  position: relative !important;
  padding: 6px 12px !important;
  min-height: 35px !important;
  font-family: var(--aku-font-body) !important;
  font-size: 0.81rem !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease, background 0.16s ease !important;
}
/* Semantic Jewel-Tone Families across the 6 Frameless Groups */
#tabList .tab[data-tab="guide"] {
  background: linear-gradient(135deg, #433010 0%, #241907 100%) !important;
  border: 1.5px solid rgba(245, 158, 11, 0.68) !important;
  color: #fef3c7 !important;
}
#tabList .tab:is([data-tab="market"], [data-tab="news"], [data-tab="gex"], [data-tab="chart"]) {
  background: linear-gradient(135deg, #0d3644 0%, #072029 100%) !important;
  border: 1.5px solid rgba(34, 211, 238, 0.56) !important;
  color: #cffafe !important;
}
#tabList .tab:is([data-tab="levels"], [data-tab="setups"], [data-tab="playbook"]) {
  background: linear-gradient(135deg, #0f362f 0%, #081e1a 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.56) !important;
  color: #d1fae5 !important;
}
#tabList .tab:is([data-tab="mytrades"], [data-tab="trades"]) {
  background: linear-gradient(135deg, #451732 0%, #260c1b 100%) !important;
  border: 1.5px solid rgba(244, 114, 182, 0.56) !important;
  color: #fce7f3 !important;
}
#tabList .tab:is([data-tab="library"], [data-tab="lessons"], [data-tab="tools"]) {
  background: linear-gradient(135deg, #311e52 0%, #1b102e 100%) !important;
  border: 1.5px solid rgba(192, 132, 252, 0.56) !important;
  color: #f3e8ff !important;
}
body.is-owner-view #tabList .tab:is([data-tab="review"], [data-tab="paper"]) {
  background: linear-gradient(135deg, #471823 0%, #290d14 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.56) !important;
  color: #ffe4e6 !important;
  border-radius: 999px !important;
}
/* Unmistakable Active Tab Highlight across all Pods */
#tabList .tab[aria-selected="true"] {
  border-width: 1.5px !important;
  border-color: #fde047 !important;
  color: #ffffff !important;
  font-weight: 800 !important;
  box-shadow: 0 0 18px rgba(250, 204, 21, 0.42), 0 6px 14px rgba(0, 0, 0, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.35) !important;
  transform: translateY(-1.5px) !important;
}
#tabList .tab[aria-selected="true"]::after {
  content: none !important;
  display: none !important;
}

/* 2. Frameless Single-Layer Pill Sub-Navigator Bars (#deskSubTabs, .gx-sec-tabs, .ch-sec-tabs) — Zero Box-in-Box, Zero .dst-ico Box, Zero .dst-cta Pill, Zero Title Truncation */
#deskSubTabs.desk-subtabs,
#panel-gex .gx-sec-tabs.desk-subtabs,
#panel-chart .ch-sec-tabs.desk-subtabs {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 0 14px !important;
  margin: 0 0 18px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  box-shadow: none !important;
}
#deskSubTabs .desk-subtab,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 16px !important;
  min-height: 40px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #3b3329 0%, #241e18 100%) !important;
  border: 1.5px solid rgba(229, 197, 134, 0.52) !important;
  color: #f8fafc !important;
  cursor: pointer !important;
  text-align: left !important;
  flex: 0 0 auto !important;
  width: auto !important;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important;
}
#deskSubTabs .desk-subtab:hover,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab:hover,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab:hover {
  transform: translateY(-2px) !important;
  background: linear-gradient(135deg, #544636 0%, #332a20 100%) !important;
  border-color: #fbbf24 !important;
  color: #fffbeb !important;
  box-shadow: 0 8px 18px rgba(2, 6, 23, 0.42), 0 0 14px rgba(245, 158, 11, 0.24) !important;
}
#deskSubTabs .desk-subtab[aria-selected="true"],
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab[aria-selected="true"],
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab[aria-selected="true"],
#panel-chart .ch-sec-tabs .desk-subtab.is-active {
  background: linear-gradient(135deg, #684812 0%, #3b2708 100%) !important;
  border: 1.5px solid #fde68a !important;
  color: #fffbeb !important;
  box-shadow: 0 0 18px rgba(245, 158, 11, 0.42), 0 6px 16px rgba(2, 6, 23, 0.46), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
  transform: translateY(-1px) !important;
}
#deskSubTabs .desk-subtab .dst-ico,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab .dst-ico,
#panel-chart .ch-sec-tabs .desk-subtab .dst-ico {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  font-size: 1rem !important;
  flex-shrink: 0 !important;
}
#deskSubTabs .desk-subtab .dst-txt,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab .dst-txt,
#panel-chart .ch-sec-tabs .desk-subtab .dst-txt {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  flex: 0 1 auto !important;
}
#deskSubTabs .desk-subtab .dst-txt b,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab .dst-txt b,
#panel-chart .ch-sec-tabs .desk-subtab .dst-txt b {
  font-family: var(--aku-font-body) !important;
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  color: inherit !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
}
#deskSubTabs .desk-subtab .dst-txt small,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab .dst-txt small,
#panel-chart .ch-sec-tabs .desk-subtab .dst-txt small,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab .dst-cta {
  display: none !important;
}
/* Frameless 2-Option Segmented Switchers (#panel-gex .gx-seg) — Zero Outer Box */
#panel-gex .gx-seg {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  gap: 6px !important;
  box-shadow: none !important;
}
#panel-gex .gx-seg button {
  background: linear-gradient(135deg, #3b3329 0%, #241e18 100%) !important;
  border: 1px solid rgba(229, 197, 134, 0.42) !important;
  color: #e2e8f0 !important;
  border-radius: 999px !important;
  padding: 5px 12px !important;
  font-weight: 600 !important;
}

/* 3. Balanced Equal-Height .gx-spread + 3-Pillar Strike Footer (.gx-strike-pillars) & Crisp Heatmap (.gx-heat) */
#panel-gex .gx-spread {
  align-items: stretch !important;
}
#panel-gex .gx-spread > .gx-card {
  display: flex !important;
  flex-direction: column !important;
}
#panel-gex .gx-spread .gx-svg {
  max-height: 330px !important;
}
#panel-gex .gx-strike-pillars {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: auto !important;
  padding-top: 14px !important;
}
#panel-gex .gx-strike-pillars .gsp-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  padding: 11px 13px !important;
  border-radius: 12px !important;
}
#panel-gex .gx-strike-pillars .gsp-item small {
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
}
#panel-gex .gx-strike-pillars .gsp-item b {
  font-family: var(--aku-font-head) !important;
  font-size: 1.24rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  font-variant-numeric: tabular-nums !important;
  line-height: 1.15 !important;
}
#panel-gex .gx-strike-pillars .gsp-item span {
  font-size: 0.73rem !important;
  color: #94a3b8 !important;
}
#panel-gex .gx-cluster-callout {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px 12px !important;
  padding: 10px 14px !important;
  margin: 0 0 10px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.16) 0%, rgba(15, 23, 42, 0.85) 100%) !important;
  border: 1.5px solid rgba(245, 183, 59, 0.55) !important;
  box-shadow: 0 6px 18px rgba(245, 158, 11, 0.14) !important;
}
#panel-gex .gx-cluster-callout .gcc-left {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
#panel-gex .gx-cluster-callout .gcc-badge {
  font-family: var(--aku-font-head) !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  color: #fde68a !important;
  letter-spacing: 0.02em !important;
}
#panel-gex .gx-cluster-callout .gcc-left b {
  font-family: var(--aku-font-head) !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
}
#panel-gex .gx-cluster-callout .gcc-peak {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-head) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important;
}
#panel-gex .gx-cluster-callout .gcc-peak.is-call {
  background: rgba(16, 185, 129, 0.2) !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
  color: #a7f3d0 !important;
}
#panel-gex .gx-cluster-callout .gcc-peak.is-put {
  background: rgba(244, 63, 94, 0.2) !important;
  border: 1px solid rgba(251, 113, 133, 0.55) !important;
  color: #fecdd3 !important;
}
#panel-gex .gx-heat {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  background: rgba(8, 14, 26, 0.84) !important;
}
#panel-gex .gx-heat-h,
#panel-gex .gx-heat-r {
  grid-template-columns: 1.35fr 1.15fr 0.85fr 0.85fr !important;
  align-items: center !important;
}
#panel-gex .gx-heat-r span {
  font-family: var(--aku-font-head) !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums !important;
  padding: 7px 10px !important;
}
#panel-gex .gx-heat-r .k {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px !important;
}
#panel-gex .gx-heat-r .k b {
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
#panel-gex .gx-heat-r .v {
  background: transparent !important;
  padding: 4px 6px !important;
}
#panel-gex .gx-heat-r .v .v-pill {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: 100% !important;
  padding: 5px 9px !important;
  border-radius: 8px !important;
  font-style: normal !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}
#panel-gex .gx-heat-r .v .v-pill b {
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
}
#panel-gex .gx-heat-r .v .v-pill .gw-cell {
  display: inline-block !important;
  margin: 0 !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  color: rgba(255, 255, 255, 0.88) !important;
  background: rgba(15, 23, 42, 0.45) !important;
  padding: 1px 6px !important;
  border-radius: 999px !important;
}
#panel-gex .gx-heat .gx-heat-r.is-spot {
  outline: none !important;
  background: rgba(56, 189, 248, 0.08) !important;
  border-left: 3px solid #38bdf8 !important;
}
#panel-gex .gx-heat .gx-heat-r.is-dense-cluster {
  position: relative !important;
  background: linear-gradient(90deg, rgba(245, 183, 59, 0.16) 0%, rgba(245, 183, 59, 0.05) 100%) !important;
  border-left: 4px solid #f5b73b !important;
  border-right: 2px solid rgba(245, 183, 59, 0.55) !important;
}
#panel-gex .gx-heat .gx-heat-r.is-dense-cluster.is-cluster-first {
  border-top: 2px solid rgba(245, 183, 59, 0.75) !important;
  border-top-left-radius: 10px !important;
  border-top-right-radius: 10px !important;
  margin-top: 2px !important;
}
#panel-gex .gx-heat .gx-heat-r.is-dense-cluster.is-cluster-last {
  border-bottom: 2px solid rgba(245, 183, 59, 0.75) !important;
  border-bottom-left-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  margin-bottom: 2px !important;
}
#panel-gex .k-tag.cluster-tag {
  background: rgba(245, 183, 59, 0.24) !important;
  border: 1px solid rgba(253, 230, 138, 0.7) !important;
  color: #fef3c7 !important;
  font-weight: 800 !important;
}
#panel-gex .k-tag.spot-tag {
  background: rgba(56, 189, 248, 0.2) !important;
  border: 1px solid rgba(125, 211, 252, 0.6) !important;
  color: #e0f2fe !important;
  font-weight: 800 !important;
}

/* 4. Tube-Free Top 8 Strike Concentration Bento Tiles (#panel-gex .gw-bento-list .gw-row) */
#panel-gex .gw-bento-list .gw-row {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
}
#panel-gex .gw-bento-list .gw-row-top {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}
#panel-gex .gw-bento-list .gw-tier-badge {
  font-family: var(--font-body) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.14) !important;
  color: #cbd5e1 !important;
  white-space: nowrap !important;
}
#panel-gex .gw-bento-list .gw-row-hero {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 8px 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.14) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
}
#panel-gex .gw-bento-list .gw-hero-share {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
}
#panel-gex .gw-bento-list .gw-hero-share b {
  font-family: var(--aku-font-head) !important;
  font-size: 1.52rem !important;
  font-weight: 800 !important;
  line-height: 1.05 !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: -0.02em !important;
}
#panel-gex .gw-bento-list .gw-hero-share small {
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  color: #94a3b8 !important;
}
#panel-gex .gw-bento-list .gw-hero-meta {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 4px !important;
}
#panel-gex .gw-bento-list .gw-dollar {
  font-family: var(--aku-font-head) !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
}
#panel-gex .gw-bento-list .gw-row-sub {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  font-size: 0.75rem !important;
}

/* 5. Separated & 3-Column Aligned Expiry Horizon Matrix (#gexExpiry & #deskExpiry) */
#gexExpiry .ex-subhead,
#deskExpiry .ex-subhead {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 14px 0 10px !important;
}
#gexExpiry .ex-subhead.is-calendar,
#deskExpiry .ex-subhead.is-calendar {
  margin: 22px 0 14px !important;
  padding-top: 18px !important;
  border-top: 1.5px dashed rgba(148, 163, 184, 0.28) !important;
}
#gexExpiry .ex-sh-badge,
#deskExpiry .ex-sh-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 11px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-head) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  color: #fde68a !important;
  background: rgba(245, 183, 59, 0.14) !important;
  border: 1px solid rgba(245, 183, 59, 0.42) !important;
  white-space: nowrap !important;
}
#gexExpiry .ex-subhead.is-calendar .ex-sh-badge,
#deskExpiry .ex-subhead.is-calendar .ex-sh-badge {
  color: #bae6fd !important;
  background: rgba(56, 189, 248, 0.14) !important;
  border-color: rgba(56, 189, 248, 0.42) !important;
}
#gexExpiry .ex-sh-line,
#deskExpiry .ex-sh-line {
  flex: 1 1 auto !important;
  height: 1px !important;
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.32), rgba(148, 163, 184, 0.05)) !important;
}
#gexExpiry .ex-subhead small,
#deskExpiry .ex-subhead small {
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: #94a3b8 !important;
  white-space: nowrap !important;
}
#gexExpiry .ex-summary-strip,
#deskExpiry .ex-summary-strip {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 0 !important;
}
#gexExpiry .ex-sum-card,
#deskExpiry .ex-sum-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 15px 18px !important;
  border-radius: 14px !important;
  background: linear-gradient(160deg, rgba(17, 29, 52, 0.92) 0%, rgba(9, 16, 30, 0.96) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.26) !important;
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}
#gexExpiry .ex-sum-card.dk-range,
#deskExpiry .ex-sum-card.dk-range {
  border-top: 3.5px solid #38bdf8 !important;
}
#gexExpiry .ex-sum-card.dk-call,
#deskExpiry .ex-sum-card.dk-call {
  border-top: 3.5px solid #34d399 !important;
}
#gexExpiry .ex-sum-card.dk-zero,
#deskExpiry .ex-sum-card.dk-zero {
  border-top: 3.5px solid #f5b73b !important;
}
#gexExpiry .ex-sum-top,
#deskExpiry .ex-sum-top {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}
#gexExpiry .ex-sum-tag,
#deskExpiry .ex-sum-tag {
  font-family: var(--aku-font-head) !important;
  font-size: 0.75rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
#gexExpiry .ex-sum-date,
#deskExpiry .ex-sum-date {
  font-family: var(--aku-font-head) !important;
  font-size: 0.73rem !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.16) !important;
  color: #e2e8f0 !important;
}
#gexExpiry .ex-sum-card b,
#deskExpiry .ex-sum-card b {
  font-family: var(--aku-font-head) !important;
  font-size: 1.46rem !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
  color: #ffffff !important;
  line-height: 1.15 !important;
}
#gexExpiry .ex-sum-card .ex-sum-unit,
#deskExpiry .ex-sum-card .ex-sum-unit {
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  color: #94a3b8 !important;
}
#gexExpiry .ex-sum-card .ex-sum-sub,
#deskExpiry .ex-sum-card .ex-sum-sub {
  font-size: 0.75rem !important;
  color: #cbd5e1 !important;
}
/* 3-Column Daily Calendar Grid matching the 3-Column Summary Strip above */
#gexExpiry .ex-list,
#deskExpiry .ex-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px 14px !important;
  margin-top: 0 !important;
}
#gexExpiry .ex-r,
#deskExpiry .ex-r {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
  padding: 13px 15px !important;
  border-radius: 13px !important;
  background: rgba(9, 16, 30, 0.78) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
}
#gexExpiry .ex-r-top,
#deskExpiry .ex-r-top,
#gexExpiry .ex-r-mid,
#deskExpiry .ex-r-mid {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}
#gexExpiry .ex-cp-split,
#deskExpiry .ex-cp-split {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-family: var(--aku-font-head) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums !important;
}
#gexExpiry .ex-bar,
#deskExpiry .ex-bar {
  height: 9px !important;
  background: rgba(148, 163, 184, 0.14) !important;
}

@media (max-width: 1080px) {
  #gexExpiry .ex-list,
  #deskExpiry .ex-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #gexExpiry .ex-summary-strip,
  #deskExpiry .ex-summary-strip,
  #panel-gex .gx-strike-pillars {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  #gexExpiry .ex-list,
  #deskExpiry .ex-list {
    grid-template-columns: 1fr !important;
  }
  #gexExpiry .ex-subhead small,
  #deskExpiry .ex-subhead small {
    display: none !important;
  }
}

/* ============================================================================
   NO_DARK_BLUE_BUTTONS_20261022 + V104 Light Mode Sub-Navbar & Pill Contrast
   ============================================================================ */
.btn-ghost {
  background: linear-gradient(180deg, rgba(44, 36, 26, 0.94), rgba(28, 22, 16, 0.96)) !important;
  color: #fde68a !important;
  border: 1.5px solid rgba(251, 191, 36, 0.44) !important;
  box-shadow: 0 3px 0 rgba(8, 6, 4, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
  font-weight: 700 !important;
  transition: transform 0.15s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
}
.btn-ghost:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(251, 191, 36, 0.82) !important;
  background: linear-gradient(180deg, rgba(58, 46, 32, 0.98), rgba(36, 28, 19, 0.98)) !important;
  color: #ffffff !important;
}
.btn-primary {
  background: linear-gradient(180deg, #fbbf24 0%, #f59e0b 55%, #d97706 100%) !important;
  color: #1c1004 !important;
  border: 1.5px solid rgba(254, 240, 138, 0.85) !important;
  box-shadow: 0 3px 0 #92400e, 0 8px 18px rgba(245, 158, 11, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.45) !important;
  font-weight: 800 !important;
}
.btn-primary:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.06);
}
#viewModeBtn.view-mode-btn {
  background: linear-gradient(180deg, rgba(44, 36, 26, 0.95), rgba(28, 22, 16, 0.97)) !important;
  border: 1.5px solid rgba(251, 191, 36, 0.48) !important;
  color: #fef3c7 !important;
  box-shadow: 0 3px 0 rgba(8, 6, 4, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}
.chip.c-green {
  background: linear-gradient(180deg, rgba(6, 78, 59, 0.92), rgba(4, 47, 46, 0.95)) !important;
  color: #6ee7b7 !important;
  border: 1.5px solid rgba(52, 211, 153, 0.52) !important;
  box-shadow: 0 2px 0 rgba(2, 24, 20, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}
.chip.c-grey {
  background: linear-gradient(180deg, rgba(44, 36, 26, 0.92), rgba(28, 22, 16, 0.95)) !important;
  color: #fde68a !important;
  border: 1.5px solid rgba(251, 191, 36, 0.42) !important;
  box-shadow: 0 2px 0 rgba(8, 6, 4, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="light"] .dte-tab-shell {
  border-bottom-color: rgba(180, 83, 9, 0.18) !important;
}
html[data-theme="light"] .dte-tab-shell .tab-pod:not(:last-child) {
  border-right-color: rgba(180, 83, 9, 0.2) !important;
}
html[data-theme="light"] .dte-tab-shell .tab-pod-head {
  color: #92400e !important;
}
html[data-theme="light"] #tabList .tab,
html[data-theme="light"] #deskSubTabs.desk-subtabs .desk-subtab,
html[data-theme="light"] #panel-gex .gx-sec-tabs.desk-subtabs .desk-subtab,
html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs .desk-subtab,
html[data-theme="light"] #panel-gex .gx-seg-btn {
  background: linear-gradient(180deg, #ffffff 0%, #fef3c7 100%) !important;
  color: #451a03 !important;
  border: 1.5px solid rgba(217, 119, 6, 0.42) !important;
  box-shadow: 0 2px 0 rgba(180, 83, 9, 0.18), inset 0 1px 0 #ffffff !important;
}
html[data-theme="light"] #tabList .tab[aria-selected="true"],
html[data-theme="light"] #deskSubTabs.desk-subtabs .desk-subtab.is-active,
html[data-theme="light"] #panel-gex .gx-sec-tabs.desk-subtabs .desk-subtab.is-active,
html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs .desk-subtab.is-active,
html[data-theme="light"] #panel-gex .gx-seg-btn.is-active {
  background: linear-gradient(180deg, #fbbf24 0%, #f59e0b 60%, #d97706 100%) !important;
  color: #1c1004 !important;
  border: 1.5px solid #b45309 !important;
  box-shadow: 0 3px 0 #92400e, 0 6px 14px rgba(217, 119, 6, 0.25) !important;
}
html[data-theme="light"] #deskSubTabs.desk-subtabs .desk-subtab .dst-txt b,
html[data-theme="light"] #panel-gex .gx-sec-tabs.desk-subtabs .desk-subtab .dst-txt b,
html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs .desk-subtab .dst-txt b {
  color: inherit !important;
}
html[data-theme="light"] .btn-ghost,
html[data-theme="light"] #viewModeBtn.view-mode-btn {
  background: linear-gradient(180deg, #ffffff 0%, #fef3c7 100%) !important;
  color: #78350f !important;
  border: 1.5px solid rgba(217, 119, 6, 0.5) !important;
  box-shadow: 0 3px 0 rgba(180, 83, 9, 0.22), inset 0 1px 0 #ffffff !important;
}
html[data-theme="light"] .chip.c-green {
  background: linear-gradient(180deg, #ecfdf5 0%, #d1fae5 100%) !important;
  color: #065f46 !important;
  border: 1.5px solid rgba(16, 185, 129, 0.55) !important;
  box-shadow: 0 2px 0 rgba(5, 150, 105, 0.2) !important;
}
html[data-theme="light"] .chip.c-grey {
  background: linear-gradient(180deg, #fffbeb 0%, #fef3c7 100%) !important;
  color: #92400e !important;
  border: 1.5px solid rgba(217, 119, 6, 0.45) !important;
  box-shadow: 0 2px 0 rgba(180, 83, 9, 0.18) !important;
}


/* ==========================================================================
   V103.1 — SYMMETRIC 6-POD COMMAND DECK, LEFT STRIKE TELEMETRY DECK,
   & NON-WRAPPING HEATMAP NUMBERS
   ========================================================================== */
.dte-tab-shell {
  max-width: 1400px !important;
  padding: 10px 12px !important;
}
.tabs .wrap#tabList {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  justify-content: center !important;
  gap: 6px !important;
  max-width: 100% !important;
}
.dte-tab-shell .tab-pod,
.dte-tab-shell .tab-pod.is-guide-pod,
.dte-tab-shell .tab-pod[data-pod='market'],
.dte-tab-shell .tab-pod[data-pod='desk'],
.dte-tab-shell .tab-pod[data-pod='journal'],
.dte-tab-shell .tab-pod[data-pod='learn'],
.dte-tab-shell .tab-pod[data-pod='owner'] {
  padding: 0 8px 0 0 !important;
  gap: 5px !important;
  flex: 0 0 auto !important;
}
.dte-tab-shell .tab-pod:last-of-type {
  padding-right: 0 !important;
}
.dte-tab-shell .tab-pod.is-guide-pod {
  flex: 0 0 auto !important;
}
.dte-tab-shell .tab-group {
  font-size: 0.7rem !important;
  gap: 4px !important;
}
.dte-tab-shell .tab-pod-btns {
  flex-wrap: nowrap !important;
  gap: 4px !important;
}
#tabList .tab {
  padding: 5px 7px !important;
  min-height: 31px !important;
  font-size: 0.73rem !important;
  white-space: nowrap !important;
}
@media (max-width: 1380px) {
  .tabs .wrap#tabList {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
  .dte-tab-shell .tab-pod-btns {
    flex-wrap: wrap !important;
    gap: 5px !important;
  }
  #tabList .tab {
    padding: 5px 9px !important;
    font-size: 0.76rem !important;
  }
}
@media (max-width: 820px) {
  .tabs .wrap#tabList {
    grid-template-columns: 1fr !important;
  }
}

/* Left Card Telemetry Deck (.gx-left-telemetry) & Non-Wrapping Heatmap Numbers */
#panel-gex .gx-spread .gx-svg {
  max-height: 360px !important;
}
#panel-gex .gx-left-telemetry {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-top: auto !important;
  padding-top: 14px !important;
}
#panel-gex .gx-strike-pillars {
  margin-top: 10px !important;
  padding-top: 0 !important;
}
#panel-gex .glt-balance-box {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  padding: 11px 14px !important;
  border-radius: 12px !important;
  background: rgba(11, 19, 34, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
}
#panel-gex .glt-bal-head {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
}
#panel-gex .glt-bal-head b {
  font-family: var(--aku-font-head) !important;
  font-weight: 800 !important;
}
#panel-gex .glt-bal-ratio {
  padding: 2px 9px !important;
  border-radius: 999px !important;
  background: rgba(245, 183, 59, 0.14) !important;
  border: 1px solid rgba(245, 183, 59, 0.4) !important;
  color: #fde68a !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
}
#panel-gex .glt-bal-track {
  display: flex !important;
  height: 9px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(15, 23, 42, 0.85) !important;
  gap: 2px !important;
}
#panel-gex .glt-bal-track .glt-c {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #10b981, #34d399) !important;
  border-radius: 999px 0 0 999px !important;
}
#panel-gex .glt-bal-track .glt-p {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #fb7185, #f43f5e) !important;
  border-radius: 0 999px 999px 0 !important;
}
#panel-gex .glt-corridor-strip {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
#panel-gex .glt-c-chip {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  padding: 9px 12px !important;
  border-radius: 11px !important;
  background: rgba(11, 19, 34, 0.68) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
}
#panel-gex .glt-c-chip small {
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
}
#panel-gex .glt-c-chip b {
  font-family: var(--aku-font-head) !important;
  font-size: 1.04rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
  font-variant-numeric: tabular-nums !important;
}
#panel-gex .glt-c-chip span {
  font-size: 0.71rem !important;
  color: #cbd5e1 !important;
}
/* Lock single-line numbers in Heatmap (.gx-heat) so minus sign never wraps */
#panel-gex .gx-heat-h,
#panel-gex .gx-heat-r {
  grid-template-columns: 1.25fr 1.28fr 0.78fr 0.78fr !important;
}
#panel-gex .gx-heat-r .v .v-pill,
#panel-gex .gx-heat-r .v .v-pill b,
#panel-gex .gx-heat-r .v .v-pill .gw-cell,
#panel-gex .gx-heat-r .c,
#panel-gex .gx-heat-r .p,
#panel-gex .gx-heat-r .k .k-tag {
  white-space: nowrap !important;
}


/* Light Mode & Mobile Parity for Unboxed #tabList (.dte-tab-shell & .tab-pod) */
html[data-theme="light"] .dte-tab-shell {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(180, 83, 9, 0.2) !important;
  box-shadow: none !important;
}
html[data-theme="light"] .dte-tab-shell .tab-pod {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-theme="light"] .dte-tab-shell .tab-pod:not(:last-child) {
  border-right: 1px solid rgba(180, 83, 9, 0.22) !important;
}
@media (max-width: 720px) {
  .dte-tab-shell .tab-pod:not(:last-child),
  html[data-theme="light"] .dte-tab-shell .tab-pod:not(:last-child) {
    border-right: 0 !important;
    border-bottom: 1px solid rgba(226, 201, 143, 0.18) !important;
    padding-bottom: 8px !important;
    margin-bottom: 4px !important;
  }
}

/* ==========================================================================
   V105 & V106 — UNMISTAKABLE ACTIVE-TAB & ACTIVE-POD SPOTLIGHT BEACON
   (WITHOUT WASHING OUT INACTIVE TABS) + CAUSE-AND-EFFECT GEX INFOGRAPHICS +
   STRICT 2-COLUMN STRIKE BADGE ALIGNMENT + INSIDERFINANCE REAL-TIME PARITY
   (Audi 2026-10-22 & 2026-10-23:
   1. "ตอนอยู่หน้าไหนใน 📘 Guide ① ตลาด & กราฟ ... ช่วยทำให้มันเด่นชัดกว่านี้ได้ไหมว่ากดtabไหนอยู่"
   2. "สีส่วนอื่นมันจางไปไหม"
   3. "ตรงนี้ 🧭 1 · โหมดตลาด & พฤติกรรม MM ... รูปที่โชว์มันงงไหม"
   4. "แล้ว ⚖️ 2 · แรงชักเย่อ Call vs Put GEX ... ทำให้มันเหมือนมีแรงดันหน่อยไหม"
   5. "และ 🗺️ 3 · แผนที่กรอบราคา & จุดเปลี่ยนโหมด ... ทำให้ภาพมันเห็นแล้วเข้าใจง่ายขึ้นอีก"
   6. "แล้วที่ 🧱 Put Wall 🧲 พีคโซน ทำให้ column ตรงกับ $764 🎯 ใกล้ Spot หน่อย"
   7. "แล้วทำหน้า gex ให้มันเหมือนและ realtime เท่า https://www.insiderfinance.io/gamma-exposure ด้วย")
   ========================================================================== */

/* 1. Active vs Inactive Group Header Hierarchy (.tab-pod .tab-group) — Crisp Legibility + Active Gold Dot */
.dte-tab-shell .tab-pod:not(:has([aria-selected="true"])) .tab-group {
  opacity: 0.9 !important;
  color: #f8dfa2 !important;
  transition: opacity 0.18s ease, color 0.18s ease !important;
}
.dte-tab-shell .tab-pod:hover .tab-group {
  opacity: 1 !important;
}
.dte-tab-shell .tab-pod:has([aria-selected="true"]) .tab-group {
  opacity: 1 !important;
  color: #fde047 !important;
  text-shadow: 0 0 14px rgba(250, 204, 21, 0.55) !important;
}
.dte-tab-shell .tab-pod:has([aria-selected="true"]) .tab-group::before {
  content: "●" !important;
  display: inline-block !important;
  color: #fde047 !important;
  font-size: 0.56rem !important;
  margin-right: 3px !important;
  text-shadow: 0 0 8px #facc15 !important;
}

/* 2. Rich Vibrant Inactive Tabs (opacity: 0.92, filter: none) vs High-Luminance Jewel Spotlight Active Tab */
#tabList .tab:not([aria-selected="true"]) {
  opacity: 0.92 !important;
  filter: none !important;
  border-width: 1px !important;
  color: #f8fafc !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}
#tabList .tab:not([aria-selected="true"]):is(:hover, :focus-visible) {
  opacity: 1 !important;
  filter: none !important;
  transform: translateY(-1.5px) !important;
}
#tabList .tab[data-tab="guide"][aria-selected="true"] {
  background: linear-gradient(135deg, #b45309 0%, #92400e 55%, #78350f 100%) !important;
}
#tabList .tab:is([data-tab="market"], [data-tab="news"], [data-tab="gex"], [data-tab="chart"])[aria-selected="true"] {
  background: linear-gradient(135deg, #0369a1 0%, #075985 52%, #1e40af 100%) !important;
}
#tabList .tab:is([data-tab="levels"], [data-tab="setups"], [data-tab="playbook"])[aria-selected="true"] {
  background: linear-gradient(135deg, #047857 0%, #065f46 52%, #064e3b 100%) !important;
}
#tabList .tab:is([data-tab="mytrades"], [data-tab="trades"])[aria-selected="true"] {
  background: linear-gradient(135deg, #be185d 0%, #9d174d 52%, #831843 100%) !important;
}
#tabList .tab:is([data-tab="library"], [data-tab="lessons"], [data-tab="tools"])[aria-selected="true"] {
  background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 52%, #5b21b6 100%) !important;
}
body.is-owner-view #tabList .tab:is([data-tab="review"], [data-tab="paper"])[aria-selected="true"] {
  background: linear-gradient(135deg, #f43f5e 0%, #e11d48 52%, #9f1239 100%) !important;
}
.dte-tab-shell #tabList .tab[role="tab"][aria-selected="true"] {
  opacity: 1 !important;
  filter: none !important;
  border: 2px solid #fde047 !important;
  border-color: #fde047 !important;
  color: #ffffff !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72) !important;
  box-shadow:
    0 0 0 3px rgba(250, 204, 21, 0.38),
    0 0 24px rgba(250, 204, 21, 0.72),
    0 8px 18px rgba(0, 0, 0, 0.58),
    inset 0 1px 0 rgba(255, 255, 255, 0.52) !important;
  transform: translateY(-2.5px) scale(1.06) !important;
  z-index: 3 !important;
}
#tabList .tab[aria-selected="true"]::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 14% !important;
  right: 14% !important;
  bottom: -7px !important;
  height: 3.5px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #fde047, #f59e0b, #fde047) !important;
  box-shadow: 0 0 12px #facc15 !important;
}

/* 3. Refined Cool Slate-Cyan Glass Sub-Tabs (#deskSubTabs, .gx-sec-tabs, .ch-sec-tabs)
   — Subordinate to #tabList, Zero Muddy Brown (#3b3329), Zero Screaming Orange (#d97706)
   (Audi 2026-10-23: "แล้ว 👁️ ดูครบทุกส่วน 🧭 1. โหมดตลาด & กำแพง Wall 📊 2. กราฟแท่ง Strike & น้ำหนัก % 🔬 3. เจาะลึก Curve · Skew · OI ปุ่มพวกนี้สวยแล้วหรอ ทำให้มันสวยขึ้นๆได้ไหม ตอนนี้คู่สีไม่ดี ไหม แล้วสีปุ่มมันเด่นกว่าจุดอื่นจนเกินไหม ควรออกแบบใหม่ไหม") */
#deskSubTabs .desk-subtab,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab {
  border-radius: 10px !important;
  padding: 7px 14px !important;
  min-height: 36px !important;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.62) 0%, rgba(9, 15, 28, 0.78) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  color: #cbd5e1 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  transform: none !important;
}
#deskSubTabs .desk-subtab .dst-ico,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab .dst-ico,
#panel-chart .ch-sec-tabs .desk-subtab .dst-ico {
  font-size: 0.92rem !important;
  opacity: 0.88 !important;
}
#deskSubTabs .desk-subtab .dst-txt b,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab .dst-txt b,
#panel-chart .ch-sec-tabs .desk-subtab .dst-txt b {
  font-size: 0.81rem !important;
  font-weight: 600 !important;
  color: #cbd5e1 !important;
}
#deskSubTabs .desk-subtab:not([aria-selected="true"]):not(.is-active),
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab:not([aria-selected="true"]):not(.is-active),
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab:not([aria-selected="true"]):not(.is-active) {
  opacity: 1 !important;
  filter: none !important;
}
#deskSubTabs .desk-subtab:not([aria-selected="true"]):not(.is-active):hover,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab:not([aria-selected="true"]):not(.is-active):hover,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab:not([aria-selected="true"]):not(.is-active):hover {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.82) 0%, rgba(15, 23, 42, 0.92) 100%) !important;
  border-color: rgba(56, 189, 248, 0.45) !important;
  color: #f8fafc !important;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
  transform: translateY(-1px) !important;
}
#deskSubTabs .desk-subtab:not([aria-selected="true"]):not(.is-active):hover .dst-txt b,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab:not([aria-selected="true"]):not(.is-active):hover .dst-txt b,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab:not([aria-selected="true"]):not(.is-active):hover .dst-txt b {
  color: #f8fafc !important;
}
#deskSubTabs .desk-subtab[aria-selected="true"],
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab[aria-selected="true"],
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab[aria-selected="true"],
#panel-chart .ch-sec-tabs .desk-subtab.is-active {
  opacity: 1 !important;
  filter: none !important;
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.24) 0%, rgba(30, 58, 138, 0.36) 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.72) !important;
  color: #ffffff !important;
  box-shadow:
    0 4px 14px rgba(2, 132, 199, 0.2),
    inset 0 1px 0 rgba(186, 230, 253, 0.26) !important;
  transform: none !important;
}
#deskSubTabs .desk-subtab[aria-selected="true"] .dst-ico,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab[aria-selected="true"] .dst-ico,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab[aria-selected="true"] .dst-ico,
#panel-chart .ch-sec-tabs .desk-subtab.is-active .dst-ico {
  opacity: 1 !important;
}
#deskSubTabs .desk-subtab[aria-selected="true"] .dst-txt b,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab[aria-selected="true"] .dst-txt b,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab[aria-selected="true"] .dst-txt b,
#panel-chart .ch-sec-tabs .desk-subtab.is-active .dst-txt b {
  color: #ffffff !important;
  font-weight: 700 !important;
}
#deskSubTabs .desk-subtab[aria-selected="true"]::after,
#panel-gex .gx-sec-tabs .gx-sec-tab.desk-subtab[aria-selected="true"]::after,
#panel-chart .ch-sec-tabs .ch-sec-tab.desk-subtab[aria-selected="true"]::after,
#panel-chart .ch-sec-tabs .desk-subtab.is-active::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 18% !important;
  right: 18% !important;
  bottom: -1px !important;
  height: 2px !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, transparent, #38bdf8, transparent) !important;
  box-shadow: 0 0 8px rgba(56, 189, 248, 0.65) !important;
}

/* 4. Light Mode Parity for Active vs Inactive Tabs & Sub-Tabs */
html[data-theme="light"] .dte-tab-shell .tab-pod:not(:has([aria-selected="true"])) .tab-group {
  opacity: 0.92 !important;
  color: #92400e !important;
}
html[data-theme="light"] .dte-tab-shell .tab-pod:has([aria-selected="true"]) .tab-group {
  color: #b45309 !important;
  text-shadow: none !important;
}
html[data-theme="light"] .dte-tab-shell .tab-pod:has([aria-selected="true"]) .tab-group::before {
  color: #d97706 !important;
  text-shadow: none !important;
}
html[data-theme="light"] #tabList .tab:not([aria-selected="true"]),
html[data-theme="light"] #deskSubTabs.desk-subtabs .desk-subtab:not([aria-selected="true"]):not(.is-active),
html[data-theme="light"] #panel-gex .gx-sec-tabs.desk-subtabs .desk-subtab:not([aria-selected="true"]):not(.is-active),
html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs .desk-subtab:not([aria-selected="true"]):not(.is-active) {
  opacity: 0.94 !important;
  filter: none !important;
  background: linear-gradient(180deg, #ffffff 0%, #f1f5f9 100%) !important;
  color: #334155 !important;
  border: 1px solid rgba(148, 163, 184, 0.5) !important;
}
html[data-theme="light"] #deskSubTabs.desk-subtabs .desk-subtab:not([aria-selected="true"]):not(.is-active) .dst-txt b,
html[data-theme="light"] #panel-gex .gx-sec-tabs.desk-subtabs .desk-subtab:not([aria-selected="true"]):not(.is-active) .dst-txt b,
html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs .desk-subtab:not([aria-selected="true"]):not(.is-active) .dst-txt b {
  color: #334155 !important;
}
html[data-theme="light"] #tabList .tab[aria-selected="true"] {
  opacity: 1 !important;
  filter: none !important;
  background: linear-gradient(135deg, #1b2c47 0%, #101b2d 100%) !important;
  color: #ffffff !important;
  border: 2px solid #d97706 !important;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.35), 0 8px 18px rgba(15, 23, 42, 0.25) !important;
}
html[data-theme="light"] #deskSubTabs.desk-subtabs .desk-subtab[aria-selected="true"],
html[data-theme="light"] #panel-gex .gx-sec-tabs.desk-subtabs .desk-subtab[aria-selected="true"],
html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs .desk-subtab[aria-selected="true"],
html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs .desk-subtab.is-active {
  opacity: 1 !important;
  filter: none !important;
  background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%) !important;
  color: #0c4a6e !important;
  border: 1.5px solid #0284c7 !important;
  box-shadow: 0 4px 12px rgba(2, 132, 199, 0.16) !important;
}
html[data-theme="light"] #deskSubTabs.desk-subtabs .desk-subtab[aria-selected="true"] .dst-txt b,
html[data-theme="light"] #panel-gex .gx-sec-tabs.desk-subtabs .desk-subtab[aria-selected="true"] .dst-txt b,
html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs .desk-subtab[aria-selected="true"] .dst-txt b,
html[data-theme="light"] #panel-chart .ch-sec-tabs.desk-subtabs .desk-subtab.is-active .dst-txt b {
  color: #0c4a6e !important;
}

/* 5. Crystal-Clear GEX Command Deck Infographics (.gx-hcard, .gx-hero-svg, .gx-hcard-mech, .gx-tug-sides, .gcm-coord-strip) */
#panel-gex .gx-hcard {
  justify-content: flex-start !important;
  gap: 10px !important;
  padding: 18px 20px !important;
}
#panel-gex .gx-hcard > .gw-chips {
  margin-top: auto !important;
  padding-top: 6px !important;
}
#panel-gex .gx-hcard .gx-hero-svg {
  max-height: 142px !important;
  padding: 4px 0 !important;
  border: 0 !important;
  background: transparent !important;
}
#panel-gex .gx-hcard .gx-hero-svg.is-tug-svg {
  max-height: 98px !important;
  padding: 2px 0 !important;
}
#panel-gex .gx-hcard .gx-hero-svg.is-corridor-svg {
  max-height: 142px !important;
  padding: 4px 0 !important;
}
@keyframes gxPushRight {
  0%, 100% { transform: translateX(-4px); opacity: 0.72; }
  50% { transform: translateX(4px); opacity: 1; }
}
@keyframes gxPushLeft {
  0%, 100% { transform: translateX(4px); opacity: 0.72; }
  50% { transform: translateX(-4px); opacity: 1; }
}
@keyframes gxClashPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.08); }
}
#panel-gex .gx-push-chev.is-right {
  animation: gxPushRight 1.35s ease-in-out infinite;
}
#panel-gex .gx-push-chev.is-left {
  animation: gxPushLeft 1.35s ease-in-out infinite;
}
#panel-gex .gx-clash-orb,
#panel-gex .gx-clash-flare {
  transform-box: fill-box;
  transform-origin: center;
  animation: gxClashPulse 1.35s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  #panel-gex .gx-push-chev.is-right,
  #panel-gex .gx-push-chev.is-left,
  #panel-gex .gx-clash-orb,
  #panel-gex .gx-clash-flare {
    animation: none !important;
  }
}
#panel-gex .gx-hcard-mech {
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  line-height: 1.45 !important;
  color: #e2e8f0 !important;
  padding: 8px 0 2px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.22) !important;
}
#panel-gex .gx-hcard-mech.is-neg b {
  color: #fda4af !important;
}
#panel-gex .gx-hcard-mech.is-pos b {
  color: #6ee7b7 !important;
}
#panel-gex .gx-tug-sides {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 4px 0 8px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
}
#panel-gex .gx-tug-sides .gts-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
#panel-gex .gx-tug-sides .gts-col.is-call {
  align-items: flex-start !important;
  text-align: left !important;
}
#panel-gex .gx-tug-sides .gts-col.is-put {
  align-items: flex-end !important;
  text-align: right !important;
  border-left: 1px solid rgba(148, 163, 184, 0.14) !important;
  padding-left: 10px !important;
}
#panel-gex .gx-tug-sides .gts-col small {
  font-size: 0.73rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
}
#panel-gex .gx-tug-sides .gts-col b {
  font-family: var(--aku-font-head) !important;
  font-size: 1.18rem !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
  line-height: 1.15 !important;
}
#panel-gex .gx-tug-sides .gts-col.is-call b {
  color: #6ee7b7 !important;
}
#panel-gex .gx-tug-sides .gts-col.is-put b {
  color: #fda4af !important;
}
#panel-gex .gx-tug-sides .gts-col b em {
  font-style: normal !important;
  font-size: 0.84rem !important;
  opacity: 0.9 !important;
}
#panel-gex .gx-tug-sides .gts-col span {
  font-size: 0.72rem !important;
  color: #94a3b8 !important;
}
#panel-gex .gcm-coord-strip {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding: 8px 0 2px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
}
#panel-gex .gcm-coord-strip .gcm-pin {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  gap: 2px !important;
  padding: 0 4px !important;
  border-right: 1px solid rgba(148, 163, 184, 0.14) !important;
}
#panel-gex .gcm-coord-strip .gcm-pin:last-child {
  border-right: 0 !important;
}
#panel-gex .gcm-coord-strip .gcm-pin small {
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  white-space: nowrap !important;
}
#panel-gex .gcm-coord-strip .gcm-pin b {
  font-family: var(--aku-font-head) !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
  color: #f8fafc !important;
}
#panel-gex .gcm-coord-strip .gcm-pin.is-put b { color: #fda4af !important; }
#panel-gex .gcm-coord-strip .gcm-pin.is-spot b { color: #7dd3fc !important; }
#panel-gex .gcm-coord-strip .gcm-pin.is-zg b { color: #fde68a !important; }
#panel-gex .gcm-coord-strip .gcm-pin.is-call b { color: #6ee7b7 !important; }
#panel-gex .gcm-coord-strip .gcm-pin span {
  font-family: var(--aku-font-head) !important;
  font-size: 0.69rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
  font-variant-numeric: tabular-nums !important;
}
html[data-theme="light"] #panel-gex .gx-hcard-mech,
html[data-theme="light"] #panel-gex .gcm-coord-strip .gcm-pin b {
  color: #0f172a !important;
}

/* 6. Strict 2-Column Strike Cell & Vertical Badge Sub-Column in Heatmap (.gx-heat-r .k)
   (Audi 2026-10-23: "แล้วที่ 🧱 Put Wall 🧲 พีคโซน ทำให้ column ตรงกับ $764 🎯 ใกล้ Spot หน่อย") */
#panel-gex .gx-heat-h,
#panel-gex .gx-heat-r {
  grid-template-columns: 1.74fr 0.98fr 0.64fr 0.74fr !important;
  column-gap: 6px !important;
}
#panel-gex .gx-heat-r .c-col,
#panel-gex .gx-heat-r .p-col {
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}
#panel-gex .gx-heat-r > span.k {
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 5px !important;
  row-gap: 0 !important;
  padding: 6px 2px 6px 8px !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
#panel-gex .gx-heat-r .k > b {
  font-family: var(--aku-font-head) !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important;
  line-height: 1.15 !important;
}
#panel-gex .gx-heat-r .k > .k-tags {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 3px !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}
#panel-gex .gx-heat-r .k .k-tag {
  margin: 0 !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 2.5px !important;
  font-size: 0.6rem !important;
  padding: 1px 4.5px !important;
  line-height: 1.2 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* 7. InsiderFinance Real-Time Controls & Status Pill (.gx-controls, .gx-seg, .gx-realtime-pill) */
#panel-gex .gx-realtime-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-weight: 800 !important;
}
#panel-gex .gx-realtime-pill .live-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #34d399 !important;
  box-shadow: 0 0 8px #34d399 !important;
  display: inline-block !important;
}
#panel-gex .gx-card-head {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px 14px !important;
}
#panel-gex .gx-controls {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}
#panel-gex .gx-seg {
  display: inline-flex !important;
  background: rgba(9, 15, 28, 0.85) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-radius: 9px !important;
  padding: 2px !important;
  gap: 2px !important;
}
#panel-gex .gx-seg button {
  appearance: none !important;
  border: 0 !important;
  background: transparent !important;
  color: #cbd5e1 !important;
  font-family: var(--font-body) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  padding: 4px 9px !important;
  border-radius: 7px !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}
#panel-gex .gx-seg button:hover {
  color: #ffffff !important;
  background: rgba(148, 163, 184, 0.14) !important;
}
#panel-gex .gx-seg button.is-on,
#panel-gex .gx-seg:nth-of-type(1) button[aria-pressed="true"],
#panel-gex .gx-seg:nth-of-type(2) button[aria-pressed="true"],
#panel-gex .gx-seg:nth-of-type(3) button[aria-pressed="true"] {
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.28) 0%, rgba(30, 58, 138, 0.42) 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.68) !important;
  color: #f0f9ff !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 8px rgba(2, 132, 199, 0.24), inset 0 1px 0 rgba(186, 230, 253, 0.22) !important;
}
html[data-theme="light"] #panel-gex .gx-seg {
  background: #f1f5f9 !important;
  border-color: rgba(100, 116, 139, 0.3) !important;
}
html[data-theme="light"] #panel-gex .gx-seg button {
  color: #334155 !important;
}
html[data-theme="light"] #panel-gex .gx-seg button.is-on,
html[data-theme="light"] #panel-gex .gx-seg:nth-of-type(1) button[aria-pressed="true"],
html[data-theme="light"] #panel-gex .gx-seg:nth-of-type(2) button[aria-pressed="true"],
html[data-theme="light"] #panel-gex .gx-seg:nth-of-type(3) button[aria-pressed="true"] {
  background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%) !important;
  border: 1px solid #0284c7 !important;
  color: #0c4a6e !important;
  box-shadow: none !important;
}

/* ==========================================================================
   V107 & V108 — CONTINUOUS GOLDEN PEAK-ZONE BOX WITH NESTED SKY-BLUE SPOT
   FRAME (.gx-heat-r.is-dense-cluster.is-spot::after) + COMPACT NON-BLOCKING
   HOVER TOOLTIP (.gx-rich-tip.is-compact) WITH OVERLAPPING S/R CONFLUENCE
   (.grt-sr-box & .k-tag.conf-tag) & RETIRED STATIC #gxStrikeHud
   (Audi 2026-10-23:
   1. "ตรง 🔎 ดูทีละระดับราคา 🎯 ใกล้ Spot ตอนเลื่อนเข้าไปในพีคโซนก็ให้มันเห็นขอบน้ำเงินด้วยหน่อยไหม"
   2. "🔎 กำลังส่องระดับราคาบนกราฟ ... ตรงนี้ข้างบนกราฟไม่ต้องมีก็ได้มั้ง ตอนhoverก็ขึ้น"
   3. "แล้ว 🎯 ใกล้ Spot ทำให้มันยังดูรู้หน่อยว่าอยู่ใน 🧲 พีคโซน กล่องทอง แต่ตอนhoverทำให้มันไม่บังมากไปไหม แล้วเอาพวกแนวรับแนวต้านทับซ้อนมาโชว์ด้วยไหม")
   ========================================================================== */

/* 1. Continuous Golden Peak Zone Outer Box (.is-dense-cluster) + Nested Sky-Blue Spot Inner Ring (.is-spot) */
#panel-gex .gx-heat .gx-heat-r > span {
  position: relative !important;
  z-index: 1 !important;
}
#panel-gex .gx-heat .gx-heat-r.is-dense-cluster {
  position: relative !important;
  background: linear-gradient(90deg, rgba(245, 183, 59, 0.24) 0%, rgba(245, 183, 59, 0.08) 55%, rgba(245, 183, 59, 0.18) 100%) !important;
  border-left: 5px solid #f5b73b !important;
  border-right: 3px solid #f5b73b !important;
  border-radius: 0 !important;
}
#panel-gex .gx-heat .gx-heat-r.is-dense-cluster.is-cluster-first {
  border-top: 2.5px solid #f5b73b !important;
  border-top-left-radius: 10px !important;
  border-top-right-radius: 10px !important;
  margin-top: 3px !important;
}
#panel-gex .gx-heat .gx-heat-r.is-dense-cluster.is-cluster-last {
  border-bottom: 2.5px solid #f5b73b !important;
  border-bottom-left-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  margin-bottom: 3px !important;
}
#panel-gex .gx-heat .gx-heat-r.is-spot:not(.is-dense-cluster) {
  position: relative !important;
  z-index: 2 !important;
  outline: none !important;
  background: linear-gradient(90deg, rgba(14, 165, 233, 0.24) 0%, rgba(56, 189, 248, 0.09) 100%) !important;
  border-left: 4px solid #38bdf8 !important;
  box-shadow:
    inset 0 0 0 2px #38bdf8,
    0 0 14px rgba(56, 189, 248, 0.26) !important;
  border-radius: 8px !important;
}
#panel-gex .gx-heat .gx-heat-r.is-dense-cluster.is-spot {
  position: relative !important;
  z-index: 2 !important;
  outline: none !important;
  background: linear-gradient(90deg, rgba(245, 183, 59, 0.28) 0%, rgba(14, 165, 233, 0.18) 10%, rgba(56, 189, 248, 0.08) 68%, rgba(245, 183, 59, 0.24) 100%) !important;
  border-left: 5px solid #f5b73b !important;
  border-right: 3px solid #f5b73b !important;
  box-shadow: none !important;
}
#panel-gex .gx-heat .gx-heat-r.is-dense-cluster.is-spot::after {
  content: "" !important;
  position: absolute !important;
  inset: 2px 5px !important;
  border: 2px solid #38bdf8 !important;
  border-radius: 7px !important;
  box-shadow:
    0 0 12px rgba(56, 189, 248, 0.34),
    inset 0 0 10px rgba(56, 189, 248, 0.16) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
#panel-gex .gx-heat .gx-heat-r:hover {
  filter: brightness(1.08) !important;
}
#panel-gex .gx-heat .gx-heat-r.is-spot .k > b {
  color: #7dd3fc !important;
  text-shadow: 0 0 10px rgba(56, 189, 248, 0.38) !important;
}
#panel-gex .k-tag.spot-tag {
  background: rgba(14, 165, 233, 0.28) !important;
  border: 1.5px solid #38bdf8 !important;
  color: #f0f9ff !important;
  font-weight: 800 !important;
  box-shadow: 0 0 8px rgba(56, 189, 248, 0.28) !important;
}
#panel-gex .k-tag.cluster-sub-tag {
  background: rgba(245, 183, 59, 0.2) !important;
  border: 1px dashed rgba(253, 230, 138, 0.78) !important;
  color: #fde68a !important;
  font-weight: 700 !important;
}
#panel-gex .k-tag.conf-tag {
  background: rgba(168, 85, 247, 0.2) !important;
  border: 1px solid rgba(192, 132, 252, 0.62) !important;
  color: #f3e8ff !important;
  font-weight: 700 !important;
}
#panel-gex .k-tag.conf-tag.is-conf-heavy {
  background: linear-gradient(135deg, rgba(168, 85, 247, 0.34) 0%, rgba(245, 158, 11, 0.28) 100%) !important;
  border: 1.5px solid #f59e0b !important;
  color: #fef3c7 !important;
  font-weight: 800 !important;
  box-shadow: 0 0 8px rgba(245, 158, 11, 0.25) !important;
}
#panel-gex .k-tag.conf-tag.is-conf-med {
  background: rgba(139, 92, 246, 0.22) !important;
  border: 1px solid rgba(192, 132, 252, 0.72) !important;
  color: #f3e8ff !important;
  font-weight: 700 !important;
}
#panel-gex .k-tag.conf-tag.is-conf-light {
  background: rgba(51, 65, 85, 0.38) !important;
  border: 1px dashed rgba(148, 163, 184, 0.48) !important;
  color: #cbd5e1 !important;
  font-weight: 500 !important;
  font-size: 0.62rem !important;
  opacity: 0.78 !important;
}
html[data-theme="light"] #panel-gex .gx-heat .gx-heat-r.is-dense-cluster {
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.18) 0%, rgba(245, 158, 11, 0.06) 55%, rgba(245, 158, 11, 0.14) 100%) !important;
  border-left-color: #d97706 !important;
  border-right-color: #d97706 !important;
}
html[data-theme="light"] #panel-gex .gx-heat .gx-heat-r.is-dense-cluster.is-spot {
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.22) 0%, rgba(14, 165, 233, 0.12) 12%, rgba(56, 189, 248, 0.05) 68%, rgba(245, 158, 11, 0.18) 100%) !important;
}
html[data-theme="light"] #panel-gex .gx-heat .gx-heat-r.is-dense-cluster.is-spot::after {
  border-color: #0284c7 !important;
  box-shadow: 0 0 8px rgba(2, 132, 199, 0.22) !important;
}
html[data-theme="light"] #panel-gex .gx-heat .gx-heat-r.is-spot .k > b {
  color: #0369a1 !important;
  text-shadow: none !important;
}
html[data-theme="light"] #panel-gex .k-tag.cluster-sub-tag {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #92400e !important;
}
html[data-theme="light"] #panel-gex .k-tag.conf-tag {
  background: #f3e8ff !important;
  border-color: #9333ea !important;
  color: #581c87 !important;
}
html[data-theme="light"] #panel-gex .k-tag.conf-tag.is-conf-heavy {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #78350f !important;
  box-shadow: none !important;
}
html[data-theme="light"] #panel-gex .k-tag.conf-tag.is-conf-light {
  background: #f1f5f9 !important;
  border-color: #94a3b8 !important;
  color: #475569 !important;
}

/* 2. On-Chart Wall Callout Pills (.gx-wall-callout / .gx-wall-pill / .gx-wall-pin), Hover Crosshair (.gx-bar-guide) & Bar Hover Highlight */
#panel-gex .gx-svg .gx-bar-guide {
  stroke: rgba(56, 189, 248, 0.72) !important;
  stroke-width: 1.5px !important;
  stroke-dasharray: 4 3 !important;
  pointer-events: none !important;
}
#panel-gex .gx-svg .gx-wall-callout {
  pointer-events: none !important;
}
#panel-gex .gx-svg .gx-wall-leader {
  stroke-width: 1.4px !important;
  stroke-dasharray: 2 2 !important;
  pointer-events: none !important;
}
#panel-gex .gx-svg .gx-wall-leader.is-cw {
  stroke: rgba(52, 211, 153, 0.85) !important;
}
#panel-gex .gx-svg .gx-wall-leader.is-pw {
  stroke: rgba(251, 113, 133, 0.85) !important;
}
#panel-gex .gx-svg .gx-wall-pill {
  fill: rgba(7, 14, 28, 0.94) !important;
  stroke-width: 1.25px !important;
  pointer-events: none !important;
}
#panel-gex .gx-svg .gx-wall-pill.is-cw {
  stroke: rgba(52, 211, 153, 0.78) !important;
}
#panel-gex .gx-svg .gx-wall-pill.is-pw {
  stroke: rgba(251, 113, 133, 0.82) !important;
}
#panel-gex .gx-svg .gx-wall-pin {
  font-family: var(--aku-font-head) !important;
  font-size: 9.6px !important;
  font-weight: 800 !important;
  letter-spacing: 0.01em !important;
  stroke: none !important;
  pointer-events: none !important;
}
#panel-gex .gx-svg .gx-wall-pin.is-cw {
  fill: #6ee7b7 !important;
}
#panel-gex .gx-svg .gx-wall-pin.is-pw {
  fill: #fda4af !important;
}
html[data-theme="light"] #panel-gex .gx-svg .gx-wall-pill {
  fill: rgba(255, 255, 255, 0.96) !important;
}
html[data-theme="light"] #panel-gex .gx-svg .gx-wall-pin.is-cw {
  fill: #047857 !important;
}
html[data-theme="light"] #panel-gex .gx-svg .gx-wall-pin.is-pw {
  fill: #be123c !important;
}
#panel-gex .gx-svg rect[data-bar],
#panel-gex .gx-svg rect.gx-wall2 {
  pointer-events: none !important;
}
#panel-gex .gx-svg rect[data-bar].gx-hover {
  filter: brightness(1.22) drop-shadow(0 0 6px rgba(56, 189, 248, 0.55)) !important;
  stroke: #38bdf8 !important;
  stroke-width: 1.5px !important;
}

/* 3. Compact Contained Strike Tooltip (#gxTip .gx-rich-tip.is-compact) + Weighted S/R Hierarchy (.grt-sr-box) */
#panel-gex .gx-tip {
  width: 266px !important;
  max-width: 266px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  padding: 7px 9px !important;
  border-radius: 10px !important;
  background: rgba(7, 12, 24, 0.95) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.58) !important;
  box-shadow: 0 10px 24px rgba(2, 6, 23, 0.72), 0 0 14px rgba(14, 165, 233, 0.22) !important;
  backdrop-filter: blur(8px) !important;
  pointer-events: none !important;
  z-index: 60 !important;
}
#panel-gex .gx-rich-tip.is-compact {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
#panel-gex .gx-rich-tip .grt-head {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 6px !important;
  padding-bottom: 3px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
#panel-gex .gx-rich-tip .grt-head b {
  font-family: var(--aku-font-head) !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}
#panel-gex .gx-rich-tip .grt-head .grt-dist {
  font-family: var(--aku-font-head) !important;
  font-size: 0.71rem !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  min-width: 0 !important;
}
#panel-gex .gx-tip .grt-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 3px !important;
  max-width: 100% !important;
}
#panel-gex .gx-tip .grt-tag {
  display: inline-flex !important;
  align-items: center !important;
  padding: 1.5px 6px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-body) !important;
  font-size: 0.63rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#panel-gex .gx-tip .grt-tag.is-call {
  background: rgba(16, 185, 129, 0.2) !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
  color: #6ee7b7 !important;
}
#panel-gex .gx-tip .grt-tag.is-put {
  background: rgba(244, 63, 94, 0.2) !important;
  border: 1px solid rgba(251, 113, 133, 0.55) !important;
  color: #fda4af !important;
}
#panel-gex .gx-tip .grt-tag.is-gold {
  background: rgba(245, 183, 59, 0.2) !important;
  border: 1px solid rgba(253, 224, 71, 0.55) !important;
  color: #fde68a !important;
}
#panel-gex .gx-tip .grt-tag.is-sky {
  background: rgba(14, 165, 233, 0.22) !important;
  border: 1px solid rgba(56, 189, 248, 0.58) !important;
  color: #bae6fd !important;
}
#panel-gex .gx-rich-tip .grt-compact-stats {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px !important;
  padding: 4px 6px !important;
  border-radius: 6px !important;
  background: rgba(15, 23, 42, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  font-size: 0.67rem !important;
  color: #cbd5e1 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}
#panel-gex .gx-rich-tip .grt-compact-stats > span {
  white-space: nowrap !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#panel-gex .gx-rich-tip .grt-compact-stats b {
  font-family: var(--aku-font-head) !important;
  font-size: 0.73rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
  font-variant-numeric: tabular-nums !important;
}
#panel-gex .gx-rich-tip .grt-compact-stats em {
  font-style: normal !important;
  font-size: 0.63rem !important;
  color: #94a3b8 !important;
}
#panel-gex .gx-rich-tip .grt-split {
  display: flex !important;
  flex-direction: column !important;
  gap: 2.5px !important;
}
#panel-gex .gx-rich-tip .grt-split-lbl {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  font-size: 0.66rem !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
#panel-gex .gx-rich-tip .grt-split-bar {
  display: flex !important;
  height: 4.5px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(15, 23, 42, 0.9) !important;
  gap: 1.5px !important;
}
#panel-gex .gx-rich-tip .grt-split-bar .is-c {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #10b981, #34d399) !important;
}
#panel-gex .gx-rich-tip .grt-split-bar .is-p {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #fb7185, #f43f5e) !important;
}

/* Weighted S/R Confluence Hierarchy inside #gxTip (.grt-sr-box / .grt-sr-item.is-tier-high|med|low) */
#panel-gex .gx-rich-tip .grt-sr-box {
  display: flex !important;
  flex-direction: column !important;
  gap: 3.5px !important;
  padding: 5px 7px !important;
  border-radius: 7px !important;
  background: rgba(30, 27, 75, 0.42) !important;
  border: 1px solid rgba(168, 85, 247, 0.36) !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
#panel-gex .gx-rich-tip .grt-sr-box.is-conf-heavy {
  background: linear-gradient(145deg, rgba(67, 20, 7, 0.45) 0%, rgba(46, 16, 101, 0.55) 100%) !important;
  border: 1.5px solid rgba(245, 158, 11, 0.72) !important;
  box-shadow: inset 0 0 10px rgba(245, 158, 11, 0.14) !important;
}
#panel-gex .gx-rich-tip .grt-sr-box.is-conf-light {
  background: rgba(15, 23, 42, 0.55) !important;
  border: 1px dashed rgba(148, 163, 184, 0.28) !important;
}
#panel-gex .gx-rich-tip .grt-sr-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px !important;
  min-width: 0 !important;
}
#panel-gex .gx-rich-tip .grt-sr-title {
  font-size: 0.64rem !important;
  font-weight: 800 !important;
  color: #e9d5ff !important;
  white-space: nowrap !important;
}
#panel-gex .gx-rich-tip .grt-conf-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 1px 5px !important;
  border-radius: 999px !important;
  font-size: 0.6rem !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
#panel-gex .gx-rich-tip .grt-conf-pill.is-heavy {
  background: rgba(245, 158, 11, 0.24) !important;
  border: 1px solid #f59e0b !important;
  color: #fde68a !important;
}
#panel-gex .gx-rich-tip .grt-conf-pill.is-med {
  background: rgba(168, 85, 247, 0.24) !important;
  border: 1px solid rgba(192, 132, 252, 0.65) !important;
  color: #f3e8ff !important;
}
#panel-gex .gx-rich-tip .grt-conf-pill.is-light {
  background: rgba(51, 65, 85, 0.45) !important;
  border: 1px dashed rgba(148, 163, 184, 0.4) !important;
  color: #94a3b8 !important;
  font-weight: 600 !important;
}
#panel-gex .gx-rich-tip .grt-sr-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-tier-high {
  padding: 3.5px 6px !important;
  border-radius: 5px !important;
  background: rgba(255, 255, 255, 0.07) !important;
  border-left: 3px solid #f59e0b !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-tier-high.is-res {
  border-left-color: #34d399 !important;
  background: rgba(16, 185, 129, 0.12) !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-tier-high.is-sup {
  border-left-color: #fb7185 !important;
  background: rgba(244, 63, 94, 0.13) !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-tier-med {
  padding: 2px 5px !important;
  border-left: 2px solid rgba(56, 189, 248, 0.55) !important;
  background: rgba(15, 23, 42, 0.42) !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-tier-low {
  padding: 0 0 0 5px !important;
  border-left: 1px dashed rgba(148, 163, 184, 0.32) !important;
  opacity: 0.74 !important;
}
#panel-gex .gx-rich-tip .grt-sr-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px !important;
  min-width: 0 !important;
}
#panel-gex .gx-rich-tip .grt-sr-txt {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-tier-high .grt-sr-txt {
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-tier-med .grt-sr-txt {
  font-size: 0.65rem !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-tier-low .grt-sr-txt {
  font-size: 0.62rem !important;
  font-weight: 500 !important;
  color: #94a3b8 !important;
}
#panel-gex .gx-rich-tip .grt-sr-w {
  font-style: normal !important;
  flex-shrink: 0 !important;
  white-space: nowrap !important;
  border-radius: 999px !important;
  padding: 0.5px 4.5px !important;
  font-family: var(--aku-font-head) !important;
}
#panel-gex .gx-rich-tip .grt-sr-w.is-high {
  font-size: 0.59rem !important;
  font-weight: 800 !important;
  background: rgba(245, 158, 11, 0.25) !important;
  color: #fde68a !important;
}
#panel-gex .gx-rich-tip .grt-sr-w.is-med {
  font-size: 0.58rem !important;
  font-weight: 700 !important;
  background: rgba(56, 189, 248, 0.18) !important;
  color: #bae6fd !important;
}
#panel-gex .gx-rich-tip .grt-sr-w.is-low {
  font-size: 0.56rem !important;
  font-weight: 500 !important;
  color: #94a3b8 !important;
  padding: 0 !important;
}
#panel-gex .gx-rich-tip .grt-sr-bar {
  display: block !important;
  height: 2.5px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.85) !important;
  overflow: hidden !important;
}
#panel-gex .gx-rich-tip .grt-sr-bar > b {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #f59e0b, #fde047) !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-res .grt-sr-bar > b {
  background: linear-gradient(90deg, #10b981, #6ee7b7) !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-sup .grt-sr-bar > b {
  background: linear-gradient(90deg, #f43f5e, #fda4af) !important;
}
#panel-gex .gx-rich-tip .grt-sr-item.is-tech .grt-sr-bar > b {
  background: linear-gradient(90deg, #0ea5e9, #7dd3fc) !important;
}
#panel-gex .gx-rich-tip .grt-sr-more {
  font-size: 0.6rem !important;
  color: #94a3b8 !important;
  text-align: right !important;
}
#panel-gex .gx-rich-tip .grt-action {
  padding-top: 3px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.2) !important;
  font-size: 0.65rem !important;
  line-height: 1.3 !important;
  color: #e2e8f0 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ==========================================================================
   V109 — CROSS-TAB SIBLING POLISH ON #panel-chart, #panel-setups, #panel-playbook
   1. #panel-chart .ch-sec-tabs: hide .dsub-txt small + match Cool Slate-Cyan Glass sub-tabs;
      unbox #chTiming 5-KPI row out of .gx-top (Zero Box-in-Box) & unbox inner .ch-cpill / .ch-corridor-meter
   2. #panel-setups: prevent orphan syllable wrapping on .shc-title & unbox inner .shc-svg / .sbc-quick-box
   3. #panel-playbook: remove duplicate CSS dot before emoji in .legend, unbox outer .pb-flow & #pbLab .gx-card.lb-card
   ========================================================================== */
#panel-chart .ch-sec-tabs .desk-subtab .dsub-ico {
  font-size: 0.92rem !important;
  opacity: 0.88 !important;
}
#panel-chart .ch-sec-tabs .desk-subtab .dsub-txt {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
#panel-chart .ch-sec-tabs .desk-subtab .dsub-txt b {
  font-family: var(--aku-font-body) !important;
  font-size: 0.81rem !important;
  font-weight: 600 !important;
  color: inherit !important;
  white-space: nowrap !important;
}
#panel-chart .ch-sec-tabs .desk-subtab .dsub-txt small {
  display: none !important;
}
#panel-chart .gx-meta {
  order: 3 !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.16) !important;
  padding-top: 10px !important;
}
#panel-chart #chTiming.ch-timing-deck {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(195px, 1fr)) !important;
  gap: 12px !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
#panel-chart .ch-conf-card .ch-cpill {
  background: transparent !important;
  border: 0 !important;
  border-left: 2.5px solid rgba(148, 163, 184, 0.35) !important;
  border-radius: 0 !important;
  padding: 4px 0 4px 10px !important;
}
#panel-chart .ch-conf-card .ch-cpill.is-up {
  border-left-color: #34d399 !important;
}
#panel-chart .ch-conf-card .ch-cpill.is-dn {
  border-left-color: #fb7185 !important;
}
#panel-chart .ch-conf-card .ch-cpill.is-warn {
  border-left-color: #f5b73b !important;
}
#panel-chart .ch-conf-card .ch-corridor-meter {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.22) !important;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.22) !important;
  border-radius: 0 !important;
  padding: 8px 0 !important;
}

/* #panel-setups — Unboxed Inner Diagrams */
#panel-setups .setup-bento-card .sbc-quick-box {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.22) !important;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.22) !important;
  border-radius: 0 !important;
  padding: 8px 0 !important;
}

/* #panel-playbook — Zero Duplicate Legend Dots & Zero Box-in-Box on .pb-flow and #pbLab */
#panel-playbook .legend i.dot {
  display: none !important;
}
#panel-playbook .pb-flow,
#panel-playbook #pbLab > .gx-card.lb-card {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
  padding: 6px 0 18px !important;
  margin-bottom: 18px !important;
  box-shadow: none !important;
}

/* ==========================================================================
   V112 — #panel-chart (📈 กราฟเทคนิค SPY) Complete Visual & Stability Overhaul
   - 2-Row Command Deck (.ch-command-bar) with Cool Slate-Cyan Glass .gx-seg
   - Single-Layer Indicator Chips (Zero Pill-in-Button on .ch-toggle-state)
   - Unified 2-Card Intelligence Deck (Zero Empty Void, 4-Segment Alignment Meter,
     6-Tile Telemetry Matrix, Clean 2-Column S/R Strip, Honest ATR Quota)
   - Always-Visible Floating OHLC HUD (.ch-legend) & Structured Sub-Pane Headers
   ========================================================================== */
#panel-chart #chSubTabs.desk-subtabs {
  margin-bottom: 14px !important;
}
#panel-chart #chSubTabs .desk-subtab .dsub-txt {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 1px !important;
}
#panel-chart #chSubTabs .desk-subtab .dsub-txt b {
  font-size: 0.88rem !important;
  font-weight: 700 !important;
}
#panel-chart #chSubTabs .desk-subtab .dsub-txt small {
  display: block !important;
  font-size: 0.74rem !important;
  opacity: 0.78 !important;
}

/* 2-Row Command Bar */
#panel-chart .ch-command-bar {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  padding: 12px 16px !important;
  margin-bottom: 14px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.88) 0%, rgba(9, 14, 26, 0.95) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  box-shadow: 0 10px 28px rgba(2, 6, 23, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}
#panel-chart .ch-cmd-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px 14px !important;
}
#panel-chart .ch-cmd-bottom {
  padding-top: 10px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.18) !important;
}
#panel-chart .ch-preset-bar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
#panel-chart .ch-preset-lbl {
  font-family: var(--font-head) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  color: #fde68a !important;
  margin-right: 2px !important;
}
#panel-chart .ch-preset-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 13px !important;
  border-radius: 999px !important;
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  color: #cbd5e1 !important;
  background: linear-gradient(135deg, rgba(30, 41, 59, 0.78) 0%, rgba(15, 23, 42, 0.9) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  cursor: pointer !important;
  transition: transform 0.16s ease, border-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease !important;
}
#panel-chart .ch-preset-btn:hover {
  transform: translateY(-1px) !important;
  color: #ffffff !important;
  border-color: rgba(250, 204, 21, 0.55) !important;
}
#panel-chart .ch-preset-btn.is-active {
  background: linear-gradient(135deg, #1b2c47 0%, #101b2d 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border: 1.5px solid rgba(250, 204, 21, 0.82) !important;
  box-shadow: 0 4px 14px rgba(250, 204, 21, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;
}
#panel-chart .ch-live-strip {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px 12px !important;
  font-size: 0.8rem !important;
  color: #cbd5e1 !important;
}
#panel-chart #chLive {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: var(--mono) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
}
#panel-chart .ch-vixes {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
}
#panel-chart .ch-vix {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 0.78rem !important;
  color: #cbd5e1 !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}
#panel-chart .ch-vix b {
  font-family: var(--mono) !important;
  color: #f8fafc !important;
}
#panel-chart .ch-vix em {
  font-style: normal !important;
  font-family: var(--mono) !important;
  font-size: 0.75rem !important;
}
#panel-chart #chStatus {
  font-size: 0.76rem !important;
  color: #94a3b8 !important;
}
#panel-chart .ch-refresh-btn {
  padding: 5px 12px !important;
  border-radius: 999px !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  color: #e0f2fe !important;
  background: linear-gradient(135deg, #12355b 0%, #0b2038 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.55) !important;
  cursor: pointer !important;
  transition: transform 0.15s ease, border-color 0.15s ease !important;
}
#panel-chart .ch-refresh-btn:hover {
  transform: translateY(-1px) !important;
  border-color: #38bdf8 !important;
  color: #ffffff !important;
}

/* Cool Slate-Cyan Glass Segmented Switchers in #panel-chart (Timeframe + Zoom + 3m/1y Stats) */
#panel-chart .ch-tf-zoom {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}
#panel-chart .gx-seg, #panel-data .gx-seg {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 3px !important;
  border-radius: 11px !important;
  background: rgba(9, 14, 26, 0.84) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
}
#panel-chart .gx-seg button, #panel-data .gx-seg button {
  padding: 5px 11px !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #94a3b8 !important;
  font-family: var(--font-body) !important;
  font-size: 0.79rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease !important;
}
#panel-chart .gx-seg button:hover, #panel-data .gx-seg button:hover {
  color: #f8fafc !important;
  background: rgba(56, 189, 248, 0.12) !important;
}
#panel-chart .gx-seg button[aria-pressed="true"],
#panel-chart .gx-seg button.is-active, #panel-data .gx-seg button[aria-pressed="true"] {
  background: linear-gradient(135deg, #0284c7 0%, #1e3a8a 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border-color: rgba(56, 189, 248, 0.75) !important;
  box-shadow: 0 2px 10px rgba(2, 132, 199, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}
#panel-chart .ch-zoom-seg button {
  padding: 5px 9px !important;
  font-family: var(--mono) !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
}

/* Single-Layer Indicator Toggle Chips (Zero Pill-in-Button!) */
#panel-chart .ch-overlays {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}
#panel-chart .ch-overlays button[data-cht] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 11px !important;
  min-height: 32px !important;
  border-radius: 999px !important;
  font-family: var(--font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.75) 0%, rgba(9, 14, 26, 0.88) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  color: #94a3b8 !important;
  opacity: 0.72 !important;
  cursor: pointer !important;
  transition: opacity 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease !important;
}
#panel-chart .ch-overlays button[data-cht]:hover:not(:disabled) {
  opacity: 1 !important;
  transform: translateY(-1px) !important;
  color: #f8fafc !important;
  border-color: rgba(56, 189, 248, 0.55) !important;
}
#panel-chart .ch-overlays button[data-cht][aria-pressed="true"] {
  opacity: 1 !important;
  background: linear-gradient(135deg, rgba(16, 48, 44, 0.82) 0%, rgba(11, 29, 46, 0.92) 100%) !important;
  border-color: rgba(52, 211, 153, 0.62) !important;
  color: #ecfdf5 !important;
  box-shadow: 0 2px 10px rgba(16, 185, 129, 0.16) !important;
}
#panel-chart .ch-overlays button[data-cht]:disabled {
  opacity: 0.38 !important;
  cursor: not-allowed !important;
}
#panel-chart .ch-overlays .ch-ind-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #64748b !important;
  flex-shrink: 0 !important;
}
#panel-chart .ch-overlays button[data-cht][aria-pressed="true"] .ch-ind-dot {
  background: #34d399 !important;
  box-shadow: 0 0 8px rgba(52, 211, 153, 0.85) !important;
}
#panel-chart .ch-overlays .ch-toggle-state {
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  font-size: 0.73rem !important;
  font-weight: 600 !important;
  color: inherit !important;
  opacity: 0.8 !important;
}

/* Unified 2-Card Intelligence Deck (#chConfluence) — Zero Empty Void */
#panel-chart .ch-confluence-deck {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin-bottom: 14px !important;
  align-items: stretch !important;
}
#panel-chart .ch-conf-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  padding: 16px 18px !important;
  border-radius: 16px !important;
}
#panel-chart .ch-conf-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
}
#panel-chart .ch-conf-eyebrow {
  display: block !important;
  font-size: 0.74rem !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  letter-spacing: 0.03em !important;
  margin-bottom: 3px !important;
}
#panel-chart .ch-conf-title {
  display: block !important;
  font-family: var(--font-head) !important;
  font-size: 1.08rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
  line-height: 1.3 !important;
}
#panel-chart .ch-conf-score {
  flex-shrink: 0 !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-family: var(--mono) !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  color: #fde68a !important;
  background: rgba(245, 158, 11, 0.14) !important;
  border: 1px solid rgba(245, 158, 11, 0.42) !important;
}

/* Dribbble 4-Segment Alignment Meter Bar */
#panel-chart .ch-align-meter {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  padding: 8px 0 !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.2) !important;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.2) !important;
}
#panel-chart .ch-align-segs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
#panel-chart .ch-aseg {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
#panel-chart .ch-aseg i {
  display: block !important;
  height: 6px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.28) !important;
}
#panel-chart .ch-aseg.is-up i {
  background: linear-gradient(90deg, #10b981, #34d399) !important;
  box-shadow: 0 0 8px rgba(52, 211, 153, 0.42) !important;
}
#panel-chart .ch-aseg.is-dn i {
  background: linear-gradient(90deg, #f43f5e, #fb7185) !important;
  box-shadow: 0 0 8px rgba(251, 113, 133, 0.42) !important;
}
#panel-chart .ch-aseg.is-warn i {
  background: linear-gradient(90deg, #f59e0b, #fbbf24) !important;
}
#panel-chart .ch-aseg small {
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
  text-align: center !important;
}
#panel-chart .ch-conf-sub {
  margin: 0 !important;
  font-size: 0.8rem !important;
  color: #cbd5e1 !important;
  line-height: 1.45 !important;
}

/* 6-Tile Hairline Telemetry Grid inside Card 1 */
#panel-chart .ch-conf-pills.is-six-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px 12px !important;
  margin-top: 2px !important;
}
#panel-chart .panel-head .btn-primary {
  background: linear-gradient(135deg, #1b2c47 0%, #101b2d 100%) !important;
  color: #f8fafc !important;
  border: 1.5px solid rgba(250, 204, 21, 0.78) !important;
  box-shadow: 0 4px 14px rgba(2, 6, 23, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}
#panel-chart .panel-head .btn-primary:hover {
  background: linear-gradient(135deg, #243b5e 0%, #15243b 100%) !important;
  color: #ffffff !important;
  border-color: #fde047 !important;
}
#panel-chart .ch-corridor-meter .ch-cm-labels {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  font-size: 0.72rem !important;
  white-space: nowrap !important;
  margin-bottom: 6px !important;
}
#panel-chart .ch-cm-track {
  position: relative !important;
  height: 10px !important;
  border-radius: 999px !important;
  margin-top: 8px !important;
}
#panel-chart .ch-cm-wall {
  position: absolute !important;
  top: -3px !important;
  width: 3px !important;
  height: 16px !important;
  border-radius: 2px !important;
  transform: translateX(-50%) !important;
  z-index: 2 !important;
}
#panel-chart .ch-cm-wall.is-pw {
  background: #fb7185 !important;
  box-shadow: 0 0 6px rgba(251, 113, 133, 0.75) !important;
}
#panel-chart .ch-cm-wall.is-cw {
  background: #34d399 !important;
  box-shadow: 0 0 6px rgba(52, 211, 153, 0.75) !important;
}
#panel-chart .ch-plot-hint {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px 12px !important;
  font-size: 0.76rem !important;
  padding: 2px 4px 8px !important;
  margin-bottom: 4px !important;
}
#panel-chart #chZoomHelp {
  white-space: nowrap !important;
  flex: 0 1 auto !important;
}
#panel-chart #chWallNote {
  display: inline-flex !important;
  flex: 0 1 auto !important;
  flex-basis: auto !important;
  margin-top: 0 !important;
  margin-left: auto !important;
  white-space: nowrap !important;
}
#panel-chart .ch-conf-card .ch-cpill {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 2.5px solid rgba(148, 163, 184, 0.35) !important;
  border-radius: 0 !important;
  padding: 2px 0 2px 10px !important;
}
#panel-chart .ch-conf-card .ch-cpill small {
  font-size: 0.73rem !important;
  color: #94a3b8 !important;
  font-weight: 600 !important;
}
#panel-chart .ch-conf-card .ch-cpill strong {
  font-family: var(--font-head) !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
  line-height: 1.25 !important;
}
#panel-chart .ch-conf-card .ch-cpill em {
  font-style: normal !important;
  font-size: 0.72rem !important;
  color: #94a3b8 !important;
}

/* Card 2 S/R 2-Column Strip & ATR Fuel Row */
#panel-chart .ch-sr-strip {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  padding: 6px 0 !important;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.2) !important;
}
#panel-chart .ch-sr-pill {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  padding-left: 10px !important;
  border-left: 2.5px solid rgba(148, 163, 184, 0.35) !important;
}
#panel-chart .ch-sr-pill.is-sup {
  border-left-color: #fb7185 !important;
}
#panel-chart .ch-sr-pill.is-res {
  border-left-color: #34d399 !important;
}
#panel-chart .ch-sr-kicker {
  font-size: 0.73rem !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
}
#panel-chart .ch-sr-px {
  font-family: var(--mono) !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}
#panel-chart .ch-sr-meta {
  font-size: 0.74rem !important;
  color: #cbd5e1 !important;
}
#panel-chart .ch-fuel-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px 12px !important;
  margin-top: auto !important;
  padding-top: 2px !important;
  font-size: 0.81rem !important;
  color: #cbd5e1 !important;
}
#panel-chart .ch-fuel-txt strong {
  font-family: var(--mono) !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
}

/* Chart Canvas HUD (.ch-legend) & Sub-Pane Headers (#chMacdHead, #chRsiHead) */
#panel-chart .ch-legend {
  position: absolute !important;
  top: 10px !important;
  left: 12px !important;
  z-index: 4 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px 12px !important;
  max-width: calc(100% - 96px) !important;
  padding: 5px 12px !important;
  border-radius: 10px !important;
  background: rgba(9, 14, 26, 0.84) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  backdrop-filter: blur(8px) !important;
  font-size: 0.77rem !important;
  color: #cbd5e1 !important;
  pointer-events: none !important;
}
#panel-chart .ch-legend b {
  font-family: var(--mono) !important;
  font-size: 0.8rem !important;
  color: #f8fafc !important;
}
#panel-chart .ch-macd-head {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px 14px !important;
  padding: 8px 12px !important;
  margin-top: 6px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
  background: rgba(15, 23, 42, 0.45) !important;
  font-size: 0.8rem !important;
}
#panel-chart .ch-pane-head-left {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px 10px !important;
}
#panel-chart .ch-pane-badge {
  padding: 2px 8px !important;
  border-radius: 6px !important;
  background: rgba(15, 23, 42, 0.75) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  font-weight: 700 !important;
  font-size: 0.77rem !important;
}
#panel-chart .ch-pane-vals {
  color: #cbd5e1 !important;
  font-size: 0.78rem !important;
}
#panel-chart .ch-pane-vals b {
  font-family: var(--mono) !important;
  color: #f8fafc !important;
}
#panel-chart .ch-pane-head-right {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px !important;
}
#panel-chart .ch-macd-head .ch-macd-key {
  display: inline-flex !important;
  flex: 0 1 auto !important;
  flex-basis: auto !important;
  width: auto !important;
  margin: 0 !important;
  align-items: center !important;
  gap: 5px !important;
}
#panel-chart .ch-bottom-legend {
  padding: 10px 12px 4px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.18) !important;
  margin-top: 6px !important;
}

/* Light Mode Support for #panel-chart V112 */
html[data-theme="light"] #panel-chart .ch-command-bar {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(241, 245, 249, 0.96) 100%) !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important;
}
html[data-theme="light"] #panel-chart .ch-preset-lbl {
  color: #92400e !important;
}
html[data-theme="light"] #panel-chart .ch-preset-btn {
  background: #f8fafc !important;
  color: #334155 !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
}
html[data-theme="light"] #panel-chart .ch-preset-btn.is-active {
  background: #142032 !important;
  color: #ffffff !important;
  border-color: #c59738 !important;
}
html[data-theme="light"] #panel-chart #chLive,
html[data-theme="light"] #panel-chart .ch-vix b,
html[data-theme="light"] #panel-chart .ch-conf-title,
html[data-theme="light"] #panel-chart .ch-conf-card .ch-cpill strong,
html[data-theme="light"] #panel-chart .ch-fuel-txt strong {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .ch-live-strip,
html[data-theme="light"] #panel-chart .ch-vix,
html[data-theme="light"] #panel-chart .ch-conf-sub,
html[data-theme="light"] #panel-chart .ch-sr-meta,
html[data-theme="light"] #panel-chart .ch-fuel-row,
html[data-theme="light"] #panel-chart .ch-aseg small {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .gx-seg, html[data-theme="light"] #panel-data .gx-seg {
  background: #e2e8f0 !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] #panel-chart .gx-seg button, html[data-theme="light"] #panel-data .gx-seg button {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .gx-seg button[aria-pressed="true"], html[data-theme="light"] #panel-data .gx-seg button[aria-pressed="true"] {
  color: #ffffff !important;
}
html[data-theme="light"] #panel-chart .ch-overlays button[data-cht] {
  background: #f1f5f9 !important;
  color: #475569 !important;
  border-color: rgba(15, 23, 42, 0.15) !important;
}
html[data-theme="light"] #panel-chart .ch-overlays button[data-cht][aria-pressed="true"] {
  background: #142032 !important;
  color: #ecfdf5 !important;
  border-color: #10b981 !important;
}
html[data-theme="light"] #panel-chart .ch-legend {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .ch-legend b {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .ch-macd-head {
  background: rgba(241, 245, 249, 0.85) !important;
  color: #1e293b !important;
}
html[data-theme="light"] #panel-chart .ch-pane-vals {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .ch-pane-vals b {
  color: #0f172a !important;
}

@media (max-width: 960px) {
  #panel-chart .ch-confluence-deck {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  #panel-chart .ch-conf-pills.is-six-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #panel-chart .ch-sr-strip {
    grid-template-columns: 1fr !important;
  }
  #panel-chart .ch-corridor-meter .ch-cm-labels {
    flex-wrap: wrap !important;
    white-space: normal !important;
  }
  #panel-chart #chZoomHelp,
  #panel-chart #chWallNote {
    white-space: normal !important;
    margin-left: 0 !important;
  }
  #panel-chart .ch-legend {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    max-width: 100% !important;
    margin: 0 0 8px !important;
  }
}

/* ==========================================================================
   V113 — SMOOTH CHART NAVIGATION BAR (.ch-nav-bar), TIMELINE SCRUBBER
          (.ch-scrub-bar), WHEEL-GUARD RING, & 3-CARD TACTICAL DECISION DECK
          (#chTacticalDeck: MTF Trend Matrix · 3-Up/3-Down Price Ladder & R:R
          · RVOL + 5-Bar Buy/Sell Pressure + 0DTE Session Window)
   ========================================================================== */

#panel-chart .ch-nav-bar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px 10px !important;
  padding: 6px 8px 8px !important;
  margin-bottom: 6px !important;
  border-bottom: 1px solid rgba(226, 201, 143, 0.16) !important;
}
#panel-chart .ch-nav-group {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px 6px !important;
}
#panel-chart .ch-nav-lbl {
  font-family: var(--font-body) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
  white-space: nowrap !important;
}
#panel-chart .ch-span-seg button,
#panel-chart .ch-pan-seg button {
  padding: 4px 8px !important;
  font-size: 0.75rem !important;
}
#panel-chart .ch-span-seg button.is-active,
#panel-chart .ch-pan-seg button.is-jump-live {
  background: linear-gradient(135deg, #1b2c47 0%, #101b2d 100%) !important;
  color: #f8fafc !important;
  border: 1px solid rgba(229, 197, 134, 0.72) !important;
  box-shadow: 0 0 10px rgba(229, 197, 134, 0.24) !important;
}
#panel-chart .ch-pan-seg button:hover,
#panel-chart .ch-span-seg button:hover {
  background: linear-gradient(135deg, #243b5e 0%, #15233b 100%) !important;
  color: #ffffff !important;
}
#panel-chart .ch-guard-group {
  margin-left: auto !important;
}
#panel-chart .ch-guard-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 5px 9px !important;
  border-radius: 8px !important;
  font-family: var(--font-body) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  color: #e2e8f0 !important;
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.32) !important;
  cursor: pointer !important;
  transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, color 0.16s ease !important;
}
#panel-chart .ch-guard-btn small {
  font-size: 0.69rem !important;
  color: #94a3b8 !important;
  font-weight: 500 !important;
}
#panel-chart .ch-guard-btn:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(229, 197, 134, 0.68) !important;
  color: #ffffff !important;
}
#panel-chart .ch-guard-btn.is-on {
  background: linear-gradient(135deg, #1b2c47 0%, #101b2d 100%) !important;
  border-color: rgba(52, 211, 153, 0.75) !important;
  color: #ecfdf5 !important;
  box-shadow: 0 0 12px rgba(16, 185, 129, 0.25) !important;
}
#panel-chart .ch-guard-btn.is-on small {
  color: #a7f3d0 !important;
}
#panel-chart .ch-host.is-wheel-active {
  box-shadow: inset 0 0 0 1.5px rgba(52, 211, 153, 0.55) !important;
  border-radius: 8px !important;
}

/* Timeline Scrubber Bar (.ch-scrub-bar) */
#panel-chart .ch-scrub-bar {
  display: flex !important;
  align-items: center !important;
  gap: 10px 14px !important;
  padding: 7px 12px !important;
  margin-top: 4px !important;
  background: rgba(15, 23, 42, 0.55) !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
}
#panel-chart .ch-scrub-title {
  font-family: var(--font-body) !important;
  font-size: 0.77rem !important;
  font-weight: 700 !important;
  color: #e2c98f !important;
  white-space: nowrap !important;
}
#panel-chart .ch-scrub-input {
  flex: 1 1 180px !important;
  height: 6px !important;
  accent-color: #e5c586 !important;
  cursor: ew-resize !important;
}
#panel-chart .ch-scrub-lbl {
  font-family: var(--mono) !important;
  font-size: 0.76rem !important;
  font-weight: 600 !important;
  color: #cbd5e1 !important;
  white-space: nowrap !important;
}

/* 3-Card Tactical Decision Deck (#chTacticalDeck) */
#panel-chart .ch-tactical-deck {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 14px 0 18px !important;
  align-items: stretch !important;
}
#panel-chart .ch-tcard {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 16px 18px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.86) 0%, rgba(9, 14, 26, 0.94) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  box-shadow: 0 10px 26px rgba(2, 6, 23, 0.36) !important;
}
#panel-chart .ch-tc-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
}
#panel-chart .ch-tc-title {
  display: block !important;
  font-family: var(--font-head) !important;
  font-size: 1.04rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
  line-height: 1.3 !important;
  margin-top: 2px !important;
}
#panel-chart .ch-tc-foot {
  margin: 0 !important;
  padding-top: 8px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.2) !important;
  font-family: var(--font-body) !important;
  font-size: 0.8rem !important;
  color: #cbd5e1 !important;
  line-height: 1.5 !important;
}
#panel-chart .ch-tc-foot b {
  font-family: var(--mono) !important;
  color: #f8fafc !important;
}

/* Card 1: 5-Timeframe Trend Matrix (.ch-mtf-grid) — Frameless Top-Bar Conduit (Zero Box-in-Box) */
#panel-chart .ch-mtf-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding: 4px 0 !important;
}
#panel-chart .ch-mtf-node {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 5px !important;
  padding: 9px 7px 6px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 3px solid rgba(148, 163, 184, 0.38) !important;
  border-right: 1px dashed rgba(148, 163, 184, 0.18) !important;
  color: #f1f5f9 !important;
  text-align: left !important;
  cursor: pointer !important;
  transition: transform 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
}
#panel-chart .ch-mtf-node:last-child {
  border-right: 0 !important;
}
#panel-chart .ch-mtf-node:hover {
  transform: translateY(-2px) !important;
  border-top-color: #fde047 !important;
  color: #ffffff !important;
}
#panel-chart .ch-mtf-node.is-up {
  border-top-color: #34d399 !important;
}
#panel-chart .ch-mtf-node.is-dn {
  border-top-color: #fb7185 !important;
}
#panel-chart .ch-mtf-node.is-current {
  border-top-width: 4px !important;
  border-top-color: #fde047 !important;
  box-shadow: inset 0 6px 12px -6px rgba(250, 204, 21, 0.28) !important;
}
#panel-chart .ch-mtf-top {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
}
#panel-chart .ch-mtf-top b {
  font-family: var(--font-head) !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
}
#panel-chart .ch-mtf-top small {
  font-size: 0.68rem !important;
  color: #94a3b8 !important;
}
#panel-chart .ch-mtf-state {
  font-family: var(--font-body) !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
}
#panel-chart .ch-mtf-meta {
  font-style: normal !important;
  font-family: var(--mono) !important;
  font-size: 0.67rem !important;
  color: #cbd5e1 !important;
  line-height: 1.25 !important;
}

/* Card 2: Full-Width Vertical Price Staircase (.ch-ladder-stack) */
#panel-chart .ch-ladder-stack {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}
#panel-chart .ch-lad-spot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 5px 0 !important;
  margin: 2px 0 !important;
  border-top: 1px dashed rgba(250, 204, 21, 0.38) !important;
  border-bottom: 1px dashed rgba(250, 204, 21, 0.38) !important;
  font-size: 0.78rem !important;
  color: #fde68a !important;
}
#panel-chart .ch-lad-spot b {
  font-family: var(--mono) !important;
  font-size: 0.86rem !important;
  color: #ffffff !important;
}
#panel-chart .ch-lad-spot small {
  font-size: 0.7rem !important;
  color: #94a3b8 !important;
}
#panel-chart .ch-lad-row {
  display: grid !important;
  grid-template-columns: 56px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 2px 0 !important;
}
#panel-chart .ch-lad-rank {
  font-family: var(--font-body) !important;
  font-size: 0.73rem !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
#panel-chart .ch-lad-main {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  min-width: 0 !important;
}
#panel-chart .ch-lad-line {
  display: flex !important;
  align-items: baseline !important;
  gap: 7px !important;
  min-width: 0 !important;
}
#panel-chart .ch-lad-line strong {
  font-family: var(--mono) !important;
  font-size: 0.85rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
#panel-chart .ch-lad-name {
  font-size: 0.75rem !important;
  color: #cbd5e1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#panel-chart .ch-lad-bar {
  height: 4px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.16) !important;
  overflow: hidden !important;
}
#panel-chart .ch-lad-row.is-res .ch-lad-bar i {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #10b981, #34d399) !important;
}
#panel-chart .ch-lad-row.is-sup .ch-lad-bar i {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #f43f5e, #fb7185) !important;
}
#panel-chart .ch-lad-dist {
  font-style: normal !important;
  font-family: var(--mono) !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
#panel-chart .ch-lad-empty {
  margin: 4px 0 !important;
  font-size: 0.76rem !important;
  color: #94a3b8 !important;
}

/* Card 3: RVOL & 5-Bar Buy/Sell Pressure + Session Window */
#panel-chart .ch-pressure-box {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
#panel-chart .ch-pr-labels {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
}
#panel-chart .ch-pr-track {
  display: flex !important;
  width: 100% !important;
  height: 10px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(15, 23, 42, 0.8) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
}
#panel-chart .ch-pr-buy {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #059669 0%, #34d399 100%) !important;
}
#panel-chart .ch-pr-sell {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #fb7185 0%, #e11d48 100%) !important;
}
#panel-chart .ch-pr-track .is-zero-beam {
  display: none !important;
}
#panel-chart .ch-session-strip {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding-top: 8px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.2) !important;
}
#panel-chart .ch-sess-name {
  font-family: var(--font-head) !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  color: #fde68a !important;
}
#panel-chart .ch-sess-desc {
  margin: 0 !important;
  font-size: 0.79rem !important;
  color: #cbd5e1 !important;
  line-height: 1.5 !important;
}

/* Light Mode Overrides for V113 */
html[data-theme="light"] #panel-chart .ch-nav-lbl,
html[data-theme="light"] #panel-chart .ch-scrub-lbl,
html[data-theme="light"] #panel-chart .ch-tc-foot,
html[data-theme="light"] #panel-chart .ch-sess-desc,
html[data-theme="light"] #panel-chart .ch-lad-name {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .ch-scrub-bar {
  background: rgba(241, 245, 249, 0.9) !important;
}
html[data-theme="light"] #panel-chart .ch-scrub-title,
html[data-theme="light"] #panel-chart .ch-sess-name {
  color: #92400e !important;
}
html[data-theme="light"] #panel-chart .ch-tcard {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.07) !important;
}
html[data-theme="light"] #panel-chart .ch-tc-title,
html[data-theme="light"] #panel-chart .ch-tc-foot b,
html[data-theme="light"] #panel-chart .ch-lad-line strong {
  color: #0f172a !important;
}

@media (max-width: 1180px) {
  #panel-chart .ch-tactical-deck {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  #panel-chart .ch-mtf-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #panel-chart .ch-ladder-cols {
    grid-template-columns: 1fr !important;
  }
  #panel-chart .ch-scrub-bar {
    flex-wrap: wrap !important;
  }
  #panel-chart .ch-guard-group {
    margin-left: 0 !important;
    width: 100% !important;
  }
  #panel-chart .ch-guard-btn {
    flex: 1 1 100% !important;
    justify-content: center !important;
  }
}

/* ==========================================================================
   V116 — WEBULL INDICATOR HIERARCHY & TWO-ROW CHART HUD (.ch-legend)
   ========================================================================== */
#panel-chart .ch-legend {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 3px !important;
  max-width: calc(100% - 76px) !important;
  padding: 5px 10px !important;
  background: rgba(7, 11, 20, 0.84) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-radius: 9px !important;
  backdrop-filter: blur(6px) !important;
  pointer-events: none !important;
}
#panel-chart .chl-row-main,
#panel-chart .chl-row-inds {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px 10px !important;
  line-height: 1.35 !important;
}
#panel-chart .chl-row-inds {
  font-family: var(--mono) !important;
  font-size: 0.74rem !important;
  padding-top: 2px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.18) !important;
}
#panel-chart .chl-ind {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  white-space: nowrap !important;
}
#panel-chart .chl-ind.is-vwap {
  color: #ffffff !important;
  font-weight: 700 !important;
}
#panel-chart .chl-ind.is-vwap b {
  color: #ffffff !important;
  font-weight: 800 !important;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.35) !important;
}
#panel-chart .chl-ind.is-ema200 {
  color: #fde047 !important;
  font-weight: 700 !important;
}
#panel-chart .chl-ind.is-ema200 b {
  color: #facc15 !important;
  font-weight: 800 !important;
}
#panel-chart .chl-ind.is-sub {
  color: rgba(203, 213, 225, 0.78) !important;
  font-weight: 500 !important;
}
#panel-chart .sw-line {
  display: inline-block !important;
  width: 12px !important;
  border-radius: 999px !important;
}
#panel-chart .sw-vwap-bold {
  display: inline-block !important;
  width: 16px !important;
  height: 3.5px !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  box-shadow: 0 0 6px rgba(255, 255, 255, 0.65) !important;
}
#panel-chart .sw-ema200-bold {
  display: inline-block !important;
  width: 16px !important;
  height: 2.5px !important;
  border-radius: 999px !important;
  background: #facc15 !important;
  box-shadow: 0 0 6px rgba(250, 204, 21, 0.45) !important;
}
#panel-chart .sw-ema-sub {
  display: inline-block !important;
  width: 13px !important;
  height: 1.5px !important;
  border-radius: 999px !important;
}
html[data-theme="light"] #panel-chart .ch-legend {
  background: rgba(15, 23, 42, 0.9) !important;
  color: #f8fafc !important;
}
@media (max-width: 640px) {
  #panel-chart .ch-legend {
    left: 6px !important;
    top: 6px !important;
    max-width: calc(100% - 62px) !important;
    padding: 4px 7px !important;
    font-size: 0.68rem !important;
  }
  #panel-chart .chl-row-main,
  #panel-chart .chl-row-inds {
    gap: 2px 6px !important;
    font-size: 0.66rem !important;
  }
}

/* ==========================================================================
   V117 — DOCKED CHART COMMAND DECK (TIMEFRAME RIGHT ABOVE CANDLES)
          & MACD CROSSOVER MAGNIFIER + INLINE TIMEFRAME/ZOOM TOOLS
   ========================================================================== */
#panel-chart .ch-command-bar.is-docked-plot {
  margin: 0 0 8px 0 !important;
  padding: 0 0 10px 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
#panel-chart .ch-tf-zoom {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}
#panel-chart .ch-macd-cross-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  white-space: nowrap !important;
}
#panel-chart .ch-macd-cross-pill.is-up {
  background: rgba(16, 185, 129, 0.2) !important;
  border: 1px solid rgba(52, 211, 153, 0.65) !important;
  color: #a7f3d0 !important;
}
#panel-chart .ch-macd-cross-pill.is-dn {
  background: rgba(225, 29, 72, 0.22) !important;
  border: 1px solid rgba(251, 113, 133, 0.65) !important;
  color: #fecdd3 !important;
}
#panel-chart .ch-macd-cross-pill.is-warn {
  background: rgba(245, 158, 11, 0.24) !important;
  border: 1.5px solid rgba(250, 204, 21, 0.85) !important;
  color: #fef08a !important;
  box-shadow: 0 0 10px rgba(250, 204, 21, 0.25) !important;
}
#panel-chart .ch-macd-cross-pill.is-mid {
  background: rgba(30, 41, 59, 0.85) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
  color: #e2e8f0 !important;
}
#panel-chart .ch-macd-tools {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
}
#panel-chart .ch-macd-zoom-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 4px 11px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  background: linear-gradient(180deg, #4f3812 0%, #2d1f09 100%) !important;
  border: 1.5px solid rgba(245, 158, 11, 0.76) !important;
  color: #fef3c7 !important;
  cursor: pointer !important;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease !important;
}
#panel-chart .ch-macd-zoom-btn:hover {
  transform: translateY(-1px) !important;
  background: linear-gradient(180deg, #6e4e19 0%, #402c0d 100%) !important;
  border-color: #fde047 !important;
  color: #ffffff !important;
}
#panel-chart .ch-macd-zoom-btn.is-active {
  background: linear-gradient(180deg, #164e3e 0%, #0d3126 100%) !important;
  border-color: #34d399 !important;
  color: #ecfdf5 !important;
  box-shadow: 0 0 12px rgba(52, 211, 153, 0.35) !important;
}
#panel-chart .ch-macd-zseg button,
#panel-chart .ch-macd-tf-seg button {
  padding: 3px 8px !important;
  font-size: 0.74rem !important;
  font-family: var(--mono) !important;
  font-weight: 700 !important;
}
#panel-chart #chMacdHost.is-cross-zoom {
  border-top: 1px solid rgba(250, 204, 21, 0.35) !important;
  border-bottom: 1px solid rgba(250, 204, 21, 0.35) !important;
  background: radial-gradient(circle at 85% 50%, rgba(250, 204, 21, 0.06), transparent 65%) !important;
}
html[data-theme="light"] #panel-chart .ch-macd-cross-pill.is-up {
  background: #d1fae5 !important;
  border-color: #059669 !important;
  color: #065f46 !important;
}
html[data-theme="light"] #panel-chart .ch-macd-cross-pill.is-dn {
  background: #ffe4e6 !important;
  border-color: #e11d48 !important;
  color: #881337 !important;
}
html[data-theme="light"] #panel-chart .ch-macd-cross-pill.is-warn {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #78350f !important;
}
html[data-theme="light"] #panel-chart .ch-macd-cross-pill.is-mid {
  background: #f1f5f9 !important;
  border-color: #64748b !important;
  color: #1e293b !important;
}

/* ==========================================================================
   V118 — Deep Pitch-Black Obsidian Chart Canvas (#05070c / #060911 matching Webull)
   (Audi 2026-10-23: "แล้วพื้นหลังเอาเป็นสีดำกว่านี้จะดูง่ายกว่าไหม")
   ========================================================================== */
#panel-chart .gx-card.ch-plot {
  background: #060911 !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-top: 3px solid var(--gold) !important;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.56) !important;
}
#panel-chart .ch-host,
#panel-chart .ch-macd-host,
#panel-chart .ch-rsi-host {
  background: #05070c !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
#panel-chart .ch-legend {
  background: rgba(5, 7, 12, 0.90) !important;
  border-color: rgba(148, 163, 184, 0.26) !important;
}
#panel-chart #chMacdHost.is-cross-zoom {
  background: radial-gradient(circle at 85% 50%, rgba(250, 204, 21, 0.05), #05070c 70%) !important;
}

/* ==========================================================================
   V119 — Full-Width Proportioned Navigator (#tabList) · Realtime GEX Skyline
   · Dribbble Tactical Deck (5-TF Wave + R:R Tug + 5-Bar Vol Skyline)
   · Visual Target Probability Matrix (#chStats)
   (Audi 2026-10-23:
    - "GEXมันถูกจริงหรอ ทำไมมันดูแปลกๆ มันอัปเดตrealtimeรึป่าว"
    - "แล้วพวกตรงนี้ มันยังไม่สวยตามแบบvisualization เรารึป่าว 🧭 เช็คเทรนด์ประสาน 5 ไทม์เฟรม ... 🪜 บันไดด่านราคาใกล้สุด ... 🔥 พลังงาน Volume"
    - "แล้วตรงนี้ 🎯 โอกาสที่ราคาจะวิ่งถึงเป้า ... อธิบายให้เข้าใจกว่านี้หน่อยไหม"
    - "แล้วจริงๆ 🧭 เริ่มต้น ... navigatorพวกนี้มันควรทำใหญ่กว่านี้ไหม ให้สมดุลกับหน้า")
   ========================================================================== */

/* 1. Top Workspace Navigator (#tabList) — Full-Width Balanced Single-Row Command Deck */
.tabs {
  padding: 6px 0 !important;
}
.tabs .dte-tab-shell {
  max-width: 1420px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 10px 14px !important;
}
body.is-owner-view .tabs .dte-tab-shell {
  max-width: 1680px !important;
}
.tabs .wrap#tabList {
  max-width: 100% !important;
  width: 100% !important;
  padding: 2px 0 !important;
  gap: 8px 10px !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
}
.dte-tab-shell .tab-pod,
.dte-tab-shell .tab-pod.is-guide-pod,
.dte-tab-shell .tab-pod[data-pod="market"],
.dte-tab-shell .tab-pod[data-pod="desk"],
.dte-tab-shell .tab-pod[data-pod="journal"],
.dte-tab-shell .tab-pod[data-pod="learn"],
.dte-tab-shell .tab-pod[data-pod="owner"] {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  gap: 6px !important;
  padding: 0 10px 0 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-right: 1px solid rgba(226, 201, 143, 0.28) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  flex: 0 0 auto !important;
  min-width: max-content !important;
}
.dte-tab-shell .tab-pod.is-guide-pod {
  flex: 0 0 auto !important;
}
.dte-tab-shell .tab-pod:last-of-type,
body:not(.is-owner-view) .dte-tab-shell .tab-pod[data-pod="learn"] {
  border-right: 0 !important;
  padding-right: 0 !important;
}
body:not(.is-owner-view) .dte-tab-shell .tab-pod.owner-tab,
body:not(.is-owner-view) .dte-tab-shell .tab-sep.owner-tab {
  display: none !important;
}
.dte-tab-shell .tab-group {
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.015em !important;
  line-height: 1.25 !important;
  padding: 0 3px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: nowrap !important;
}
.dte-tab-shell .tab-pod-btns {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 5px !important;
  width: auto !important;
}
#tabList .tab {
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  min-height: 36px !important;
  padding: 5px 9px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  text-align: center !important;
}
body.is-owner-view #tabList .tab {
  font-size: 0.74rem !important;
  padding: 4px 7px !important;
  min-height: 34px !important;
  gap: 3px !important;
}
body.is-owner-view .dte-tab-shell .tab-pod {
  padding: 0 7px 0 0 !important;
}
body.is-owner-view .dte-tab-shell .tab-pod-btns {
  gap: 4px !important;
}
#tabList .tab-sep {
  display: none !important;
}
@media (max-width: 1380px) {
  .tabs .dte-tab-shell {
    padding: 8px 10px !important;
  }
  .tabs .wrap#tabList {
    gap: 6px 6px !important;
  }
  .dte-tab-shell .tab-pod,
  .dte-tab-shell .tab-pod.is-guide-pod,
  .dte-tab-shell .tab-pod[data-pod="market"],
  .dte-tab-shell .tab-pod[data-pod="desk"],
  .dte-tab-shell .tab-pod[data-pod="journal"],
  .dte-tab-shell .tab-pod[data-pod="learn"],
  .dte-tab-shell .tab-pod[data-pod="owner"] {
    padding: 0 6px 0 0 !important;
  }
  .dte-tab-shell .tab-pod-btns {
    gap: 4px !important;
  }
  #tabList .tab {
    font-size: 0.74rem !important;
    padding: 4px 7px !important;
    min-height: 34px !important;
    gap: 3px !important;
  }
}
@media (max-width: 1400px) {
  body.is-owner-view .tabs .wrap#tabList {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 10px 14px !important;
  }
}
@media (max-width: 1200px) {
  .tabs .wrap#tabList {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 10px 14px !important;
  }
}
@media (max-width: 760px) {
  .tabs .wrap#tabList {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }
  .dte-tab-shell .tab-pod,
  .dte-tab-shell .tab-pod.is-guide-pod,
  .dte-tab-shell .tab-pod[data-pod="market"],
  .dte-tab-shell .tab-pod[data-pod="desk"],
  .dte-tab-shell .tab-pod[data-pod="journal"],
  .dte-tab-shell .tab-pod[data-pod="learn"],
  .dte-tab-shell .tab-pod[data-pod="owner"] {
    width: 100% !important;
    min-width: 0 !important;
    border-right: 0 !important;
    padding-right: 0 !important;
  }
  .dte-tab-shell .tab-pod-btns {
    flex-wrap: wrap !important;
    width: 100% !important;
  }
}

/* 2. Realtime GEX Skyline Chart Enhancements (#mkLevels) */
.gex-realtime-explainer {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px 14px !important;
  margin: 0 0 12px 0 !important;
  padding: 10px 14px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.78) !important;
  border: 1px solid rgba(56, 189, 248, 0.32) !important;
  font-size: 0.83rem !important;
  color: #cbd5e1 !important;
}
.gex-realtime-explainer .gre-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-weight: 800 !important;
  font-size: 0.78rem !important;
  background: rgba(16, 185, 129, 0.18) !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
  color: #6ee7b7 !important;
}
.gex-realtime-explainer .gre-note {
  color: #e2e8f0 !important;
  line-height: 1.45 !important;
}
#mkSpy .spy-focal-hero {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
#mkSpy .spy-focal-hero .spy-price {
  line-height: 1.08 !important;
}
#mkSpy .spy-focal-hero .spy-ext {
  margin-top: 4px !important;
  line-height: 1.45 !important;
  display: block !important;
}
#mkLevels .gex-bars.is-skyline-chart,
#deskLevelsMirror .gex-bars.is-skyline-chart,
.gex-bars.is-skyline-chart {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 5px !important;
  padding: 12px 8px !important;
  overflow-x: hidden !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb.is-skyline-col,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb.is-skyline-col,
.gex-bars.is-skyline-chart .gb.is-skyline-col {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  padding: 8px 3px !important;
}
#mkLevels .gex-bars.is-skyline-chart .gb-axis-gap,
#deskLevelsMirror .gex-bars.is-skyline-chart .gb-axis-gap,
.gex-bars.is-skyline-chart .gb-axis-gap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  align-self: stretch !important;
  flex: 0 0 32px !important;
  min-width: 32px !important;
  max-width: 36px !important;
  padding: 4px 2px !important;
  margin: 0 !important;
  border-radius: 10px !important;
  border: 1px dashed rgba(148, 163, 184, 0.35) !important;
  background: rgba(15, 23, 42, 0.45) !important;
  color: #94a3b8 !important;
  font-family: var(--mono) !important;
  font-size: 0.66rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  line-height: 1.2 !important;
}
.gex-bars.is-skyline-chart .gb.is-down-pw {
  border-color: rgba(56, 189, 248, 0.55) !important;
  box-shadow: inset 0 0 0 1px rgba(56, 189, 248, 0.24) !important;
}
.gex-bars.is-skyline-chart .gb.is-near-cw {
  border-color: rgba(52, 211, 153, 0.52) !important;
  box-shadow: inset 0 0 0 1px rgba(52, 211, 153, 0.22) !important;
}
.gex-bars.is-skyline-chart .gb-role.is-sub-wall {
  font-size: 0.69rem !important;
  padding: 2px 6px !important;
  border-radius: 999px !important;
  font-weight: 800 !important;
}
.gex-bars.is-skyline-chart .gb-role.is-down-floor {
  background: rgba(14, 116, 144, 0.35) !important;
  border: 1px solid rgba(56, 189, 248, 0.68) !important;
  color: #bae6fd !important;
}
.gex-bars.is-skyline-chart .gb-role.is-near-ceil {
  background: rgba(6, 95, 70, 0.38) !important;
  border: 1px solid rgba(52, 211, 153, 0.68) !important;
  color: #a7f3d0 !important;
}
html[data-theme="light"] .gex-realtime-explainer {
  background: #f0f9ff !important;
  border-color: #7dd3fc !important;
  color: #0f172a !important;
}
html[data-theme="light"] .gex-realtime-explainer .gre-badge {
  background: #d1fae5 !important;
  border-color: #059669 !important;
  color: #065f46 !important;
}
html[data-theme="light"] .gex-realtime-explainer .gre-note {
  color: #1e293b !important;
}
html[data-theme="light"] .gex-bars.is-skyline-chart .gb-axis-gap {
  background: #f8fafc !important;
  border-color: #94a3b8 !important;
  color: #475569 !important;
}

/* 3. Tactical Deck (#chTacticalDeck) Dribbble Info-Vis Upgrades */
#panel-chart .ch-mtf-wave-wrap {
  margin: 4px 0 8px 0 !important;
  padding: 6px 10px !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.86) 0%, rgba(7, 11, 20, 0.94) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
}
#panel-chart .ch-mtf-wave-svg {
  width: 100% !important;
  height: 54px !important;
  display: block !important;
  overflow: visible !important;
}
#panel-chart .ch-mtf-bar-track {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 6px !important;
  border-radius: 999px !important;
  background: rgba(9, 13, 22, 0.92) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  overflow: hidden !important;
  margin: 4px 0 2px 0 !important;
}
#panel-chart .ch-mtf-bar-fill {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
}
#panel-chart .ch-mtf-bar-fill.is-up {
  background: linear-gradient(90deg, #059669, #34d399) !important;
}
#panel-chart .ch-mtf-bar-fill.is-dn {
  background: linear-gradient(90deg, #e11d48, #fb7185) !important;
}
#panel-chart .ch-mtf-bar-fill.is-mid {
  background: linear-gradient(90deg, #d97706, #fbbf24) !important;
}
#panel-chart .ch-mtf-ema {
  font-family: var(--mono) !important;
  font-size: 0.71rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}
#panel-chart .ch-mtf-ema.up {
  color: #6ee7b7 !important;
}
#panel-chart .ch-mtf-ema.down {
  color: #fda4af !important;
}
#panel-chart .ch-rr-tug-strip {
  margin-top: 6px !important;
  padding: 9px 11px !important;
  border-radius: 11px !important;
  background: rgba(15, 23, 42, 0.84) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}
#panel-chart .ch-rr-tug-strip .crt-labels {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  font-size: 0.74rem !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}
#panel-chart .ch-rr-tug-strip .crt-labels b {
  font-family: var(--mono) !important;
  font-size: 0.86rem !important;
}
@media (max-width: 960px) {
  #mkLevels .gex-bars.is-skyline-chart,
  #deskLevelsMirror .gex-bars.is-skyline-chart,
  .gex-bars.is-skyline-chart {
    overflow-x: auto !important;
  }
  #mkLevels .gex-bars.is-skyline-chart .gb.is-skyline-col,
  #deskLevelsMirror .gex-bars.is-skyline-chart .gb.is-skyline-col,
  .gex-bars.is-skyline-chart .gb.is-skyline-col {
    flex: 0 0 68px !important;
    min-width: 68px !important;
  }
}
#panel-chart .ch-rr-tug-strip .crt-track {
  display: flex !important;
  width: 100% !important;
  height: 10px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: #090d16 !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
}
#panel-chart .ch-rr-tug-strip .crt-fill.is-reward {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #059669 0%, #34d399 100%) !important;
}
#panel-chart .ch-rr-tug-strip .crt-fill.is-risk {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #fb7185 0%, #e11d48 100%) !important;
}
#panel-chart .ch-lad-row.is-testing-near {
  border-color: rgba(251, 191, 36, 0.45) !important;
}
#panel-chart .ch-lad-row.is-testing-near .ch-lad-name em {
  color: #fbbf24 !important;
  font-style: normal !important;
  font-weight: 700 !important;
}
#panel-chart .ch-vol-skyline-5 {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 7px !important;
  padding: 9px 10px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.82) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
}
#panel-chart .ch-vol-skyline-5 .cvs-col {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px 2px !important;
  border-radius: 8px !important;
}
#panel-chart .ch-vol-skyline-5 .cvs-col.is-last {
  background: rgba(56, 189, 248, 0.1) !important;
  border: 1px solid rgba(56, 189, 248, 0.32) !important;
}
#panel-chart .ch-vol-skyline-5 .cvs-val {
  font-family: var(--mono) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
}
#panel-chart .ch-vol-skyline-5 .cvs-track {
  width: 100% !important;
  max-width: 30px !important;
  height: 40px !important;
  border-radius: 6px !important;
  background: rgba(9, 13, 22, 0.92) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  display: flex !important;
  align-items: flex-end !important;
  padding: 2px !important;
  overflow: hidden !important;
}
#panel-chart .ch-vol-skyline-5 .cvs-fill {
  display: block !important;
  width: 100% !important;
  border-radius: 4px !important;
}
#panel-chart .ch-vol-skyline-5 .cvs-col.is-up .cvs-fill {
  background: linear-gradient(180deg, #34d399 0%, #059669 100%) !important;
}
#panel-chart .ch-vol-skyline-5 .cvs-col.is-dn .cvs-fill {
  background: linear-gradient(180deg, #fb7185 0%, #e11d48 100%) !important;
}
#panel-chart .ch-vol-skyline-5 .cvs-time {
  font-family: var(--mono) !important;
  font-size: 0.7rem !important;
  color: #94a3b8 !important;
}

/* 4. Target Probability Matrix (#chStats — .pt.is-visual-pt) */
#panel-chart .pt-explainer-strip, #panel-data .pt-explainer-strip {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 0 12px 0 !important;
}
#panel-chart .pte-item, #panel-data .pte-item {
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.76) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
#panel-chart .pte-tag, #panel-data .pte-tag {
  font-family: var(--font-head) !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
#panel-chart .pte-tag.is-range, #panel-data .pte-tag.is-range {
  color: #38bdf8 !important;
}
#panel-chart .pte-tag.is-open, #panel-data .pte-tag.is-open {
  color: #34d399 !important;
}
#panel-chart .pte-item small, #panel-data .pte-item small {
  font-size: 0.78rem !important;
  color: #cbd5e1 !important;
  line-height: 1.4 !important;
}
#panel-chart .pt.is-visual-pt .pt-h,
#panel-chart .pt.is-visual-pt .pt-r, #panel-data .pt.is-visual-pt .pt-h, #panel-data .pt.is-visual-pt .pt-r {
  display: grid !important;
  grid-template-columns: 1.2fr 1.25fr 1.15fr 1.35fr !important;
  gap: 8px !important;
  align-items: center !important;
}
#panel-chart .pt.is-visual-pt .pt-h span, #panel-data .pt.is-visual-pt .pt-h span {
  padding: 9px 10px !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  color: #e2e8f0 !important;
  background: rgba(30, 41, 59, 0.85) !important;
  border-radius: 8px !important;
  line-height: 1.3 !important;
}
#panel-chart .pt.is-visual-pt .pt-r, #panel-data .pt.is-visual-pt .pt-r {
  padding: 7px 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
}
#panel-chart .pt.is-visual-pt .pt-r > span, #panel-data .pt.is-visual-pt .pt-r > span {
  padding: 4px 6px !important;
  border-top: 0 !important;
}
#panel-chart .pt.is-visual-pt .pt-r span span, #panel-data .pt.is-visual-pt .pt-r span span {
  padding: 0 !important;
  border: 0 !important;
}
#panel-chart .pt-k-col, #panel-data .pt-k-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
}
#panel-chart .pt-k-col > b, #panel-data .pt-k-col > b {
  font-family: var(--mono) !important;
  font-size: 0.95rem !important;
  font-weight: 800 !important;
  color: #fbbf24 !important;
}
#panel-chart .pt-target-px, #panel-data .pt-target-px {
  font-family: var(--mono) !important;
  font-size: 0.73rem !important;
  color: #cbd5e1 !important;
  line-height: 1.3 !important;
}
#panel-chart .pt-target-px b, #panel-data .pt-target-px b {
  color: #f8fafc !important;
}
#panel-chart .pt-bar-cell, #panel-data .pt-bar-cell {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}
#panel-chart .pt-bc-top, #panel-data .pt-bc-top {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 4px !important;
  padding: 0 !important;
  border: 0 !important;
}
#panel-chart .pt-bc-top b, #panel-data .pt-bc-top b {
  font-family: var(--mono) !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
}
#panel-chart .pt-bc-top small, #panel-data .pt-bc-top small {
  font-family: var(--mono) !important;
  font-size: 0.71rem !important;
  color: #94a3b8 !important;
}
#panel-chart .pt.is-visual-pt .pt-r span.pt-bc-track, #panel-data .pt.is-visual-pt .pt-r span.pt-bc-track {
  display: block !important;
  width: 100% !important;
  height: 8px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background: rgba(9, 13, 22, 0.92) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  overflow: hidden !important;
}
#panel-chart .pt.is-visual-pt .pt-r span.pt-bc-track > i.pt-bc-fill, #panel-data .pt.is-visual-pt .pt-r span.pt-bc-track > i.pt-bc-fill {
  display: block !important;
  height: 100% !important;
  min-height: 6px !important;
  border-radius: 999px !important;
}
#panel-chart .pt.is-visual-pt .pt-r span.pt-bc-track > i.pt-bc-fill.is-high, #panel-data .pt.is-visual-pt .pt-r span.pt-bc-track > i.pt-bc-fill.is-high {
  background: linear-gradient(90deg, #059669, #34d399) !important;
  box-shadow: 0 0 8px rgba(52, 211, 153, 0.35) !important;
}
#panel-chart .pt.is-visual-pt .pt-r span.pt-bc-track > i.pt-bc-fill.is-mid, #panel-data .pt.is-visual-pt .pt-r span.pt-bc-track > i.pt-bc-fill.is-mid {
  background: linear-gradient(90deg, #d97706, #fbbf24) !important;
  box-shadow: 0 0 8px rgba(251, 191, 36, 0.3) !important;
}
#panel-chart .pt.is-visual-pt .pt-r span.pt-bc-track > i.pt-bc-fill.is-low, #panel-data .pt.is-visual-pt .pt-r span.pt-bc-track > i.pt-bc-fill.is-low {
  background: linear-gradient(90deg, #e11d48, #fb7185) !important;
  box-shadow: 0 0 8px rgba(251, 113, 133, 0.3) !important;
}
#panel-chart .pt-verdict, #panel-data .pt-verdict {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  gap: 2px !important;
  padding: 6px 10px !important;
  border-radius: 10px !important;
  font-family: var(--font-body) !important;
  font-size: 0.76rem !important;
  line-height: 1.25 !important;
}
#panel-chart .pt-verdict b, #panel-data .pt-verdict b {
  font-family: var(--font-head) !important;
  font-weight: 800 !important;
  font-size: 0.78rem !important;
}
#panel-chart .pt-verdict small, #panel-data .pt-verdict small {
  font-size: 0.71rem !important;
  opacity: 0.9 !important;
}
#panel-chart .pt-verdict.is-safe,
#panel-chart .pt-verdict.is-std, #panel-data .pt-verdict.is-safe, #panel-data .pt-verdict.is-std {
  background: rgba(16, 185, 129, 0.16) !important;
  border: 1px solid rgba(52, 211, 153, 0.52) !important;
  color: #6ee7b7 !important;
}
#panel-chart .pt-verdict.is-half, #panel-data .pt-verdict.is-half {
  background: rgba(245, 158, 11, 0.16) !important;
  border: 1px solid rgba(251, 191, 36, 0.52) !important;
  color: #fde68a !important;
}
#panel-chart .pt-verdict.is-trend, #panel-data .pt-verdict.is-trend {
  background: rgba(249, 115, 22, 0.16) !important;
  border: 1px solid rgba(251, 146, 60, 0.52) !important;
  color: #fed7aa !important;
}
#panel-chart .pt-verdict.is-rare, #panel-data .pt-verdict.is-rare {
  background: rgba(225, 29, 72, 0.16) !important;
  border: 1px solid rgba(251, 113, 133, 0.52) !important;
  color: #fecdd3 !important;
}
@media (max-width: 760px) {
  #panel-chart .pt-explainer-strip, #panel-data .pt-explainer-strip {
    grid-template-columns: 1fr !important;
  }
  #panel-chart .pt.is-visual-pt .pt-h, #panel-data .pt.is-visual-pt .pt-h {
    display: none !important;
  }
  #panel-chart .pt.is-visual-pt .pt-r, #panel-data .pt.is-visual-pt .pt-r {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 10px !important;
    margin-bottom: 8px !important;
    border-radius: 12px !important;
    background: rgba(15, 23, 42, 0.65) !important;
    border: 1px solid rgba(148, 163, 184, 0.2) !important;
  }
  #panel-chart .pt.is-visual-pt .pt-k-col,
  #panel-chart .pt.is-visual-pt .pt-verdict, #panel-data .pt.is-visual-pt .pt-k-col, #panel-data .pt.is-visual-pt .pt-verdict {
    grid-column: 1 / -1 !important;
  }
}
html[data-theme="light"] #panel-chart .ch-mtf-wave-wrap,
html[data-theme="light"] #panel-chart .ch-rr-tug-strip,
html[data-theme="light"] #panel-chart .ch-vol-skyline-5,
html[data-theme="light"] #panel-chart .pte-item, html[data-theme="light"] #panel-data .pte-item {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}
html[data-theme="light"] #panel-chart .pte-tag, html[data-theme="light"] #panel-data .pte-tag {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .pte-item small,
html[data-theme="light"] #panel-chart .pt-target-px, html[data-theme="light"] #panel-data .pte-item small, html[data-theme="light"] #panel-data .pt-target-px {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .pt-target-px b, html[data-theme="light"] #panel-data .pt-target-px b {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .pt.is-visual-pt .pt-h span, html[data-theme="light"] #panel-data .pt.is-visual-pt .pt-h span {
  background: #e2e8f0 !important;
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .pt-k-col > b, html[data-theme="light"] #panel-data .pt-k-col > b {
  color: #b45309 !important;
}
html[data-theme="light"] #panel-chart .pt-verdict.is-safe,
html[data-theme="light"] #panel-chart .pt-verdict.is-std, html[data-theme="light"] #panel-data .pt-verdict.is-safe, html[data-theme="light"] #panel-data .pt-verdict.is-std {
  background: #d1fae5 !important;
  border-color: #059669 !important;
  color: #065f46 !important;
}
html[data-theme="light"] #panel-chart .pt-verdict.is-half, html[data-theme="light"] #panel-data .pt-verdict.is-half {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #78350f !important;
}
html[data-theme="light"] #panel-chart .pt-verdict.is-trend, html[data-theme="light"] #panel-data .pt-verdict.is-trend {
  background: #ffedd5 !important;
  border-color: #ea580c !important;
  color: #7c2d12 !important;
}
html[data-theme="light"] #panel-chart .pt-verdict.is-rare, html[data-theme="light"] #panel-data .pt-verdict.is-rare {
  background: #ffe4e6 !important;
  border-color: #e11d48 !important;
  color: #881337 !important;
}

/* ==========================================================================
   V120 — Color-Coded On-Chart OHLC + Indicator HUD (.ch-legend) & Sub-Pane Values
   (Audi 2026-10-23: "ตรงนี้ทำให้มันเป็นสีด้วยดีไหม" on .ch-legend)
   ========================================================================== */
#panel-chart #chHost {
  height: auto !important;
}
#panel-chart #chHost .ch-legend {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 10px 10px 0 0 !important;
  background: rgba(6, 9, 17, 0.96) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22) !important;
  box-shadow: none !important;
  padding: 6px 12px !important;
  gap: 4px !important;
}
#panel-chart #chHost .ch-legend .chl-time {
  display: inline-flex !important;
  align-items: center !important;
  padding: 1px 7px !important;
  border-radius: 6px !important;
  border: 1px solid rgba(251, 191, 36, 0.36) !important;
  background: rgba(251, 191, 36, 0.12) !important;
}
#panel-chart #chHost .ch-legend .chl-time.is-live b {
  color: #fde68a !important;
}
#panel-chart #chHost .ch-legend .chl-time.is-hover {
  border-color: rgba(56, 189, 248, 0.44) !important;
  background: rgba(56, 189, 248, 0.14) !important;
}
#panel-chart #chHost .ch-legend .chl-time.is-hover b {
  color: #7dd3fc !important;
}
#panel-chart #chHost .ch-legend .chl-time.is-hist {
  border-color: rgba(192, 132, 252, 0.42) !important;
  background: rgba(192, 132, 252, 0.14) !important;
}
#panel-chart #chHost .ch-legend .chl-time.is-hist b {
  color: #d8b4fe !important;
}
#panel-chart #chHost .ch-legend .chl-item {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 4px !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-open {
  color: #94a3b8 !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-open b.chl-v-open {
  color: #f8fafc !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-high {
  color: #6ee7b7 !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-high b.chl-v-high {
  color: #34d399 !important;
  font-weight: 800 !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-low {
  color: #fda4af !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-low b.chl-v-low {
  color: #fb7185 !important;
  font-weight: 800 !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-close.is-up {
  color: #6ee7b7 !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-close b.chl-v-close.up {
  color: #34d399 !important;
  font-weight: 800 !important;
  text-shadow: 0 0 8px rgba(52, 211, 153, 0.28) !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-close.is-down {
  color: #fda4af !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-close b.chl-v-close.down {
  color: #fb7185 !important;
  font-weight: 800 !important;
  text-shadow: 0 0 8px rgba(251, 113, 133, 0.28) !important;
}
#panel-chart #chHost .ch-legend .chl-chg-pill {
  font-style: normal !important;
  display: inline-block !important;
  padding: 0 5px !important;
  border-radius: 4px !important;
  font-size: 0.75rem !important;
  font-weight: 800 !important;
}
#panel-chart #chHost .ch-legend .chl-chg-pill.up {
  color: #6ee7b7 !important;
  background: rgba(16, 185, 129, 0.18) !important;
  border: 1px solid rgba(52, 211, 153, 0.4) !important;
}
#panel-chart #chHost .ch-legend .chl-chg-pill.down {
  color: #fda4af !important;
  background: rgba(244, 63, 94, 0.18) !important;
  border: 1px solid rgba(251, 113, 133, 0.4) !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-rng {
  color: #fde68a !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-rng b.chl-v-rng {
  color: #fbbf24 !important;
  font-weight: 800 !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-vol {
  color: #7dd3fc !important;
}
#panel-chart #chHost .ch-legend .chl-item.is-vol b.chl-v-vol {
  color: #38bdf8 !important;
  font-weight: 800 !important;
}

/* Row 2: Live Indicator Strip Matching Exact Chart Line Colors + Visible Line Swatches */
#panel-chart #chHost .ch-legend .chl-row-inds {
  padding-top: 3px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.22) !important;
  gap: 4px 10px !important;
}
#panel-chart #chHost .ch-legend .chl-sep {
  color: rgba(148, 163, 184, 0.45) !important;
}
#panel-chart #chHost .ch-legend .chl-ind {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-weight: 700 !important;
}
#panel-chart #chHost .ch-legend .sw-line {
  display: inline-block !important;
  border-radius: 999px !important;
  flex-shrink: 0 !important;
}
#panel-chart #chHost .ch-legend .sw-line.is-vwap {
  width: 14px !important;
  height: 3.5px !important;
  background: #ffffff !important;
  box-shadow: 0 0 6px rgba(255, 255, 255, 0.8) !important;
}
#panel-chart #chHost .ch-legend .chl-ind-vwap {
  color: #e2e8f0 !important;
}
#panel-chart #chHost .ch-legend .chl-ind-vwap b {
  color: #ffffff !important;
  font-weight: 800 !important;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.38) !important;
}
#panel-chart #chHost .ch-legend .sw-line.is-e200 {
  width: 14px !important;
  height: 2.5px !important;
  background: #facc15 !important;
  box-shadow: 0 0 6px rgba(250, 204, 21, 0.65) !important;
}
#panel-chart #chHost .ch-legend .chl-ind-e200 {
  color: #fef08a !important;
}
#panel-chart #chHost .ch-legend .chl-ind-e200 b {
  color: #facc15 !important;
  font-weight: 800 !important;
  text-shadow: 0 0 8px rgba(250, 204, 21, 0.32) !important;
}
#panel-chart #chHost .ch-legend .sw-line.is-e20 {
  width: 12px !important;
  height: 2px !important;
  background: #38bdf8 !important;
  box-shadow: 0 0 5px rgba(56, 189, 248, 0.55) !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-e20 {
  color: #7dd3fc !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-e20 b {
  color: #38bdf8 !important;
  font-weight: 800 !important;
}
#panel-chart #chHost .ch-legend .sw-line.is-e50 {
  width: 12px !important;
  height: 2px !important;
  background: #818cf8 !important;
  box-shadow: 0 0 5px rgba(129, 140, 248, 0.55) !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-e50 {
  color: #a5b4fc !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-e50 b {
  color: #818cf8 !important;
  font-weight: 800 !important;
}
#panel-chart #chHost .ch-legend .sw-line.is-e90 {
  width: 12px !important;
  height: 2px !important;
  background: #c084fc !important;
  box-shadow: 0 0 5px rgba(192, 132, 252, 0.55) !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-e90 {
  color: #d8b4fe !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-e90 b {
  color: #c084fc !important;
  font-weight: 800 !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-ov-res,
html[data-theme="light"] #panel-chart #chHost .ch-legend .chl-ind.is-ov-res {
  color: #a7f3d0 !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-ov-res b,
html[data-theme="light"] #panel-chart #chHost .ch-legend .chl-ind.is-ov-res b {
  color: #34d399 !important;
  font-weight: 800 !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-ov-sup,
html[data-theme="light"] #panel-chart #chHost .ch-legend .chl-ind.is-ov-sup {
  color: #fecdd3 !important;
}
#panel-chart #chHost .ch-legend .chl-ind.is-ov-sup b,
html[data-theme="light"] #panel-chart #chHost .ch-legend .chl-ind.is-ov-sup b {
  color: #fb7185 !important;
  font-weight: 800 !important;
}

/* Sub-Pane Header Values (#chMacdHead & #chRsiHead) */
#panel-chart .ch-pane-vals b.is-macd-val {
  color: #facc15 !important;
  font-weight: 800 !important;
}
#panel-chart .ch-pane-vals b.is-sig-val {
  color: #c084fc !important;
  font-weight: 800 !important;
}
#panel-chart .ch-pane-vals b.up {
  color: #34d399 !important;
  font-weight: 800 !important;
}
#panel-chart .ch-pane-vals b.down {
  color: #fb7185 !important;
  font-weight: 800 !important;
}
#panel-chart .ch-macd-key .cmk-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-weight: 700 !important;
}
#panel-chart .ch-macd-key .cmk-item i.sw {
  display: inline-block !important;
  width: 12px !important;
  height: 3.5px !important;
  border-radius: 999px !important;
  flex-shrink: 0 !important;
}
#panel-chart .ch-macd-key .cmk-item.is-macd {
  color: #facc15 !important;
}
#panel-chart .ch-macd-key .cmk-item.is-sig {
  color: #c084fc !important;
}
#panel-chart .ch-macd-key .cmk-item.is-hist {
  color: #e2e8f0 !important;
}
#panel-chart .ch-macd-key .cmk-item.is-ob {
  color: #fda4af !important;
}
#panel-chart .ch-macd-key .cmk-item.is-os {
  color: #6ee7b7 !important;
}
#panel-chart .ch-bottom-legend .cbl-vwap b {
  color: #ffffff !important;
}
#panel-chart .ch-bottom-legend .cbl-e200 b {
  color: #facc15 !important;
}
#panel-chart .ch-bottom-legend .cbl-e20 {
  color: #38bdf8 !important;
  font-weight: 700 !important;
}
#panel-chart .ch-bottom-legend .cbl-e50 {
  color: #818cf8 !important;
  font-weight: 700 !important;
}
#panel-chart .ch-bottom-legend .cbl-e90 {
  color: #c084fc !important;
  font-weight: 700 !important;
}
#panel-chart .ch-bottom-legend .cbl-walls b.up {
  color: #34d399 !important;
}
#panel-chart .ch-bottom-legend .cbl-walls b.down {
  color: #fb7185 !important;
}
#panel-chart .ch-bottom-legend .cbl-walls b.sky {
  color: #38bdf8 !important;
}
html[data-theme="light"] #panel-chart #chHost .ch-legend {
  background: rgba(10, 15, 28, 0.94) !important;
  border-color: rgba(148, 163, 184, 0.35) !important;
}
html[data-theme="light"] #panel-chart .ch-pane-vals b.is-macd-val {
  color: #b45309 !important;
}
html[data-theme="light"] #panel-chart .ch-pane-vals b.is-sig-val {
  color: #7e22ce !important;
}
html[data-theme="light"] #panel-chart .ch-pane-vals b.up {
  color: #047857 !important;
}
html[data-theme="light"] #panel-chart .ch-pane-vals b.down {
  color: #be123c !important;
}

/* ==========================================================================
   V121 — SINGLE-SCREEN 3-PANE CHART STACK (PRICE + MACD + RSI IN 1 VIEWPORT)
   & HIGH-CLARITY SESSION-AWARE MACD / DYNAMIC RSI+SMA14
   (Audi 2026-10-23: "ในจอเดียวสามารถทำให้มันเห็นกราฟ macd rsiได้ ชัดกว่านี้ไดไหม")
   ========================================================================== */
#panel-chart .gx-card.ch-plot {
  padding: 8px 10px 8px !important;
  scroll-margin-top: 56px !important;
}
#panel-chart .ch-command-bar.is-docked-plot {
  padding: 2px 4px 6px !important;
  gap: 5px !important;
  margin-bottom: 5px !important;
}
#panel-chart .ch-command-bar .ch-cmd-row {
  gap: 6px 10px !important;
}
#panel-chart .ch-command-bar .ch-cmd-bottom {
  padding-top: 5px !important;
}
#panel-chart .ch-command-bar button,
#panel-chart .ch-nav-bar button,
#panel-chart #chMacdHead button,
#panel-chart #chRsiHead button,
#panel-chart .ch-command-bar .gx-seg button,
#panel-chart .ch-nav-bar .gx-seg button,
#panel-chart #chMacdHead .gx-seg button,
#panel-chart .ch-overlays button[data-cht], #panel-data #chMacdHead .gx-seg button {
  min-height: 25px !important;
  height: auto !important;
  line-height: 1.2 !important;
}
#panel-chart .ch-command-bar .gx-seg,
#panel-chart .ch-nav-bar .gx-seg,
#panel-chart #chMacdHead .gx-seg, #panel-data #chMacdHead .gx-seg {
  padding: 2px !important;
  gap: 2px !important;
  border-radius: 8px !important;
}
#panel-chart .ch-preset-btn {
  padding: 3px 9px !important;
  font-size: 0.74rem !important;
  white-space: nowrap !important;
}
#panel-chart .ch-live-strip {
  gap: 5px 8px !important;
  font-size: 0.74rem !important;
}
#panel-chart #chLive {
  font-size: 0.76rem !important;
  white-space: nowrap !important;
}
#panel-chart .ch-refresh-btn {
  padding: 3px 8px !important;
  font-size: 0.72rem !important;
  white-space: nowrap !important;
}
#panel-chart .ch-tf-seg button,
#panel-chart .ch-zoom-seg button {
  padding: 2px 7px !important;
  font-size: 0.73rem !important;
}
#panel-chart .ch-overlays {
  gap: 3px !important;
}
#panel-chart .ch-overlays button,
#panel-chart .ch-overlays button[data-cht] {
  padding: 2px 7px !important;
  font-size: 0.72rem !important;
  gap: 4px !important;
  white-space: nowrap !important;
}
#panel-chart .ch-nav-bar {
  padding: 3px 6px !important;
  gap: 3px 6px !important;
  margin-bottom: 2px !important;
}
#panel-chart .ch-nav-bar .ch-nav-group {
  gap: 4px !important;
}
#panel-chart .ch-nav-bar .ch-nav-lbl {
  font-size: 0.71rem !important;
  white-space: nowrap !important;
}
#panel-chart .ch-span-seg button,
#panel-chart .ch-pan-seg button,
#panel-chart .ch-guard-btn {
  padding: 2px 6px !important;
  font-size: 0.71rem !important;
  white-space: nowrap !important;
}
#panel-chart #chWheelBtn small {
  display: none !important;
}
#panel-chart .ch-plot-hint {
  padding: 1px 4px 3px !important;
  margin: 0 !important;
  font-size: 0.71rem !important;
  line-height: 1.25 !important;
}
@media (min-width: 1100px) {
  #panel-chart .ch-command-bar .ch-cmd-row,
  #panel-chart .ch-preset-bar,
  #panel-chart .ch-live-strip,
  #panel-chart .ch-vixes,
  #panel-chart .ch-tf-zoom,
  #panel-chart .ch-overlays,
  #panel-chart .ch-nav-bar,
  #panel-chart .ch-nav-group,
  #panel-chart .ch-guard-group,
  #panel-chart .gx-seg,
  #panel-chart #chMacdHead,
  #panel-chart #chRsiHead,
  #panel-chart .ch-pane-head-left,
  #panel-chart .ch-pane-head-right,
  #panel-chart .ch-macd-tools, #panel-data .gx-seg {
    flex-wrap: nowrap !important;
  }
  #panel-chart .ch-preset-lbl,
  #panel-chart .ch-nav-lbl,
  #panel-chart .gx-seg,
  #panel-chart .gx-seg button,
  #panel-chart .ch-pane-badge,
  #panel-chart #chMacdHead .ch-pane-head-left > b,
  #panel-chart #chRsiHead .ch-pane-head-left > b,
  #panel-chart #chMacdHead .dk-link, #panel-data .gx-seg, #panel-data .gx-seg button {
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }
  #panel-chart .ch-overlays button .ch-toggle-state {
    display: none !important;
  }
  #panel-chart #chStatus {
    display: none !important;
  }
  #panel-chart #chMacdHead .ch-macd-zseg,
  #panel-chart #chMacdHead .ch-macd-key {
    display: none !important;
  }
}
#panel-chart #chHost {
  border-radius: 10px 10px 0 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
}
#panel-chart #chMacdHead,
#panel-chart #chRsiHead {
  margin: 0 !important;
  padding: 3px 8px !important;
  border-radius: 0 !important;
  border-top: 1px solid rgba(56, 189, 248, 0.16) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
  background: linear-gradient(90deg, rgba(10, 16, 29, 0.96), rgba(15, 23, 42, 0.92)) !important;
  gap: 4px 8px !important;
  min-height: 26px !important;
  line-height: 1.25 !important;
  font-size: 0.74rem !important;
}
#panel-chart .ch-rsi-sma-pill,
#panel-chart .ch-macd-cross-pill {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  line-height: 1.2 !important;
}
#panel-chart #chMacdHead .ch-pane-vals,
#panel-chart #chRsiHead .ch-pane-vals {
  font-size: 0.74rem !important;
  white-space: nowrap !important;
}
#panel-chart #chMacdHead .ch-macd-key,
#panel-chart #chRsiHead .ch-macd-key {
  font-size: 0.72rem !important;
  white-space: nowrap !important;
}
#panel-chart #chMacdHead .ch-macd-zoom-btn {
  padding: 2px 8px !important;
  font-size: 0.72rem !important;
  white-space: nowrap !important;
}
#panel-chart #chMacdHead .ch-macd-tf-seg button {
  padding: 2px 6px !important;
  font-size: 0.71rem !important;
}
#panel-chart #chMacdHost,
#panel-chart #chRsiHost {
  border-radius: 0 !important;
  border-left: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-right: 1px solid rgba(148, 163, 184, 0.16) !important;
}
#panel-chart #chRsiHost {
  border-radius: 0 0 10px 10px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.2) !important;
}
#panel-chart #chScrubBar {
  margin-top: 5px !important;
  margin-bottom: 3px !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
}
#panel-chart .ch-bottom-legend {
  margin-top: 3px !important;
  padding: 3px 6px 0 !important;
  gap: 5px 10px !important;
  font-size: 0.74rem !important;
}

/* Single-Screen Layout Switcher (.ch-layout-seg) */
#panel-chart .ch-layout-seg {
  display: inline-flex !important;
  background: rgba(9, 14, 26, 0.85) !important;
  border: 1px solid rgba(56, 189, 248, 0.28) !important;
  border-radius: 8px !important;
  padding: 2px !important;
  gap: 2px !important;
}
#panel-chart .ch-layout-seg button {
  font-family: var(--font-head) !important;
  font-size: 0.74rem !important;
  font-weight: 700 !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
  color: #94a3b8 !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  transition: background 0.16s ease, color 0.16s ease, border-color 0.16s ease !important;
}
#panel-chart .ch-layout-seg button:hover {
  color: #f8fafc !important;
  background: rgba(56, 189, 248, 0.12) !important;
}
#panel-chart .ch-layout-seg button.is-active {
  color: #ffffff !important;
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.34), rgba(56, 189, 248, 0.2)) !important;
  border-color: rgba(56, 189, 248, 0.62) !important;
  box-shadow: 0 2px 8px rgba(14, 165, 233, 0.22) !important;
}

/* RSI & SMA14 Semantic Colors + Crosshair Hover Readout */
#panel-chart .ch-pane-vals b.is-rsi-val {
  color: #38bdf8 !important;
  font-weight: 800 !important;
}
#panel-chart .ch-pane-vals b.is-rsma-val {
  color: #facc15 !important;
  font-weight: 800 !important;
}
#panel-chart .ch-macd-key .cmk-item.is-rsi-line {
  color: #38bdf8 !important;
}
#panel-chart .ch-macd-key .cmk-item.is-rsma-line {
  color: #facc15 !important;
}
#panel-chart .ch-rsi-sma-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-size: 0.73rem !important;
  font-weight: 700 !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
}
#panel-chart .ch-rsi-sma-pill.is-up {
  color: #6ee7b7 !important;
  background: rgba(16, 185, 129, 0.14) !important;
  border-color: rgba(52, 211, 153, 0.44) !important;
}
#panel-chart .ch-rsi-sma-pill.is-dn {
  color: #fda4af !important;
  background: rgba(244, 63, 94, 0.14) !important;
  border-color: rgba(251, 113, 133, 0.44) !important;
}
#panel-chart .ch-pane-hover-tag {
  display: inline-block !important;
  font-style: normal !important;
  font-size: 0.7rem !important;
  font-weight: 800 !important;
  color: #fde047 !important;
  background: rgba(250, 204, 21, 0.16) !important;
  border: 1px solid rgba(250, 204, 21, 0.42) !important;
  border-radius: 5px !important;
  padding: 0 5px !important;
  margin-right: 3px !important;
}

html[data-theme="light"] #panel-chart #chMacdHead,
html[data-theme="light"] #panel-chart #chRsiHead {
  background: linear-gradient(90deg, rgba(241, 245, 249, 0.98), rgba(226, 232, 240, 0.95)) !important;
  border-top-color: rgba(14, 165, 233, 0.25) !important;
  border-bottom-color: rgba(100, 116, 139, 0.22) !important;
}
html[data-theme="light"] #panel-chart .ch-layout-seg {
  background: rgba(241, 245, 249, 0.95) !important;
  border-color: rgba(14, 165, 233, 0.35) !important;
}
html[data-theme="light"] #panel-chart .ch-layout-seg button {
  color: #475569 !important;
}
html[data-theme="light"] #panel-chart .ch-layout-seg button.is-active {
  color: #0369a1 !important;
  background: rgba(14, 165, 233, 0.16) !important;
  border-color: rgba(2, 132, 199, 0.52) !important;
}
html[data-theme="light"] #panel-chart .ch-pane-vals b.is-rsi-val {
  color: #0284c7 !important;
}
html[data-theme="light"] #panel-chart .ch-pane-vals b.is-rsma-val {
  color: #b45309 !important;
}
html[data-theme="light"] #panel-chart .ch-pane-hover-tag {
  color: #92400e !important;
  background: rgba(251, 191, 36, 0.22) !important;
  border-color: rgba(217, 119, 6, 0.55) !important;
}
html[data-theme="light"] #panel-chart .ch-bottom-legend .cbl-vwap,
html[data-theme="light"] #panel-chart .ch-bottom-legend .cbl-vwap b {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .ch-bottom-legend .cbl-vwap .sw-vwap-bold {
  background: #0f172a !important;
  box-shadow: none !important;
}
html[data-theme="light"] #panel-chart .ch-rsi-sma-pill.is-up {
  color: #047857 !important;
  background: rgba(16, 185, 129, 0.14) !important;
}
html[data-theme="light"] #panel-chart .ch-rsi-sma-pill.is-dn {
  color: #be123c !important;
  background: rgba(244, 63, 94, 0.14) !important;
}

/* ==========================================================================
   V122 — Price Ladder Unequal Support/Resistance Strength · Side-by-Side Call vs Put R:R Duel
   · Verified Regular-Hours Intraday High/Low Time-of-Day Distribution (#chTacticalDeck & #chStats)
   (Audi 2026-10-23:
    "คสรทำให้เห็นcall put r:rว่าอันไหนน่าเสี่ยงกว่าไหม แล้วรับ กับต้านควรให้ความสำคัญไม่เท่ากันด้วยไหม ว่าอันไหนแข็งอันไหนอ่อน
     แล้ว 🕐 ช่วงเวลาที่ SPY มักทำจุดสูงสุด / ต่ำสุดของวัน (เวลาไทย)ข้อมู,นี้ถูกแล้วใช่ไหม")
   ========================================================================== */

/* 1. Unequal Support vs Resistance Tier Badges & Strength Bars */
#panel-chart .ch-lad-row {
  padding: 4px 6px !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
  transition: background 180ms ease, border-color 180ms ease !important;
}
#panel-chart .ch-lad-row.is-tier-strong.is-res {
  background: rgba(16, 185, 129, 0.08) !important;
  border-color: rgba(52, 211, 153, 0.32) !important;
}
#panel-chart .ch-lad-row.is-tier-strong.is-sup {
  background: rgba(244, 63, 94, 0.08) !important;
  border-color: rgba(251, 113, 133, 0.32) !important;
}
#panel-chart .ch-lad-row.is-tier-weak {
  opacity: 0.88 !important;
}
#panel-chart .ch-lad-line {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px 6px !important;
}
#panel-chart .ch-lad-tier {
  display: inline-flex !important;
  align-items: center !important;
  padding: 1px 6px !important;
  border-radius: 999px !important;
  font-family: var(--font-body) !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
}
#panel-chart .ch-lad-tier.is-tier-strong {
  color: #fde68a !important;
  background: rgba(245, 158, 11, 0.2) !important;
  border: 1px solid rgba(251, 191, 36, 0.58) !important;
}
#panel-chart .ch-lad-tier.is-tier-med {
  color: #bae6fd !important;
  background: rgba(14, 165, 233, 0.16) !important;
  border: 1px solid rgba(56, 189, 248, 0.45) !important;
}
#panel-chart .ch-lad-tier.is-tier-weak {
  color: #94a3b8 !important;
  background: rgba(148, 163, 184, 0.1) !important;
  border: 1px dashed rgba(148, 163, 184, 0.36) !important;
}
#panel-chart .ch-lad-bar.is-tier-strong {
  height: 7px !important;
  background: rgba(15, 23, 42, 0.9) !important;
  border: 1px solid rgba(251, 191, 36, 0.35) !important;
}
#panel-chart .ch-lad-bar.is-tier-med {
  height: 5px !important;
}
#panel-chart .ch-lad-bar.is-tier-weak {
  height: 3.5px !important;
  opacity: 0.65 !important;
}

/* 2. Support vs Resistance Strength Balance Strip (.ch-sr-balance) — Zero Box-in-Box */
#panel-chart .ch-tcard.dk-lv b {
  font-size: inherit !important;
}
#panel-chart .ch-tcard.dk-lv .ch-lad-spot b {
  font-size: 0.86rem !important;
}
#panel-chart .ch-tcard.dk-lv .ch-mtf-top b {
  font-size: 0.84rem !important;
}
#panel-chart .ch-tcard.dk-lv .crt-labels b,
#panel-chart .ch-tcard.dk-lv .ch-pr-labels b {
  font-size: 0.84rem !important;
}
#panel-chart .ch-tc-head {
  flex-wrap: wrap !important;
}
#panel-chart .ch-sr-balance {
  margin-top: 6px !important;
  padding: 8px 0 4px 10px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.22) !important;
  border-left: 3px solid rgba(148, 163, 184, 0.45) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
}
#panel-chart .ch-sr-balance.is-sup-stronger {
  border-left-color: #34d399 !important;
}
#panel-chart .ch-sr-balance.is-res-stronger {
  border-left-color: #fb7185 !important;
}
#panel-chart .ch-sr-balance .csb-top {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
}
#panel-chart .ch-sr-balance .csb-badge {
  font-family: var(--font-head) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
#panel-chart .ch-sr-balance .csb-scores {
  font-family: var(--mono) !important;
  font-size: 0.74rem !important;
  font-weight: 700 !important;
}
#panel-chart .ch-sr-balance .csb-scores em {
  font-style: normal !important;
}
#panel-chart .ch-sr-balance .csb-note {
  margin: 0 !important;
  font-size: 0.74rem !important;
  color: #cbd5e1 !important;
  line-height: 1.4 !important;
}

/* 3. Side-by-Side Call R:R vs Put R:R Duel Grid (.ch-rr-duel-grid) — Zero Box-in-Box */
#panel-chart .ch-rr-tug-strip {
  margin-top: 4px !important;
  padding: 8px 0 0 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.22) !important;
}
#panel-chart .ch-rr-duel-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-bottom: 6px !important;
}
#panel-chart .crd-side {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 8px 10px !important;
  border-radius: 8px !important;
  background: rgba(9, 13, 22, 0.55) !important;
  border: 0 !important;
  border-top: 3px solid rgba(148, 163, 184, 0.35) !important;
  min-width: 0 !important;
}
#panel-chart .crd-side.is-call.is-winner {
  background: linear-gradient(180deg, rgba(6, 95, 70, 0.28) 0%, rgba(9, 13, 22, 0.65) 100%) !important;
  border-top: 3px solid #34d399 !important;
}
#panel-chart .crd-side.is-put.is-winner {
  background: linear-gradient(180deg, rgba(159, 18, 57, 0.28) 0%, rgba(9, 13, 22, 0.65) 100%) !important;
  border-top: 3px solid #fb7185 !important;
}
#panel-chart .crd-side.is-loser {
  opacity: 0.84 !important;
}
#panel-chart .crd-top {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px !important;
}
#panel-chart .crd-side-lbl {
  font-family: var(--font-head) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
}
#panel-chart .crd-verdict {
  font-size: 0.69rem !important;
  font-weight: 700 !important;
  padding: 1px 7px !important;
  border-radius: 999px !important;
  line-height: 1.25 !important;
}
#panel-chart .crd-verdict.is-win {
  color: #fde68a !important;
  background: rgba(245, 158, 11, 0.2) !important;
  border: 1px solid rgba(251, 191, 36, 0.52) !important;
}
#panel-chart .crd-verdict.is-lose {
  color: #94a3b8 !important;
  background: rgba(148, 163, 184, 0.12) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
}
#panel-chart .crd-ratio-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 2px !important;
}
#panel-chart .crd-ratio {
  font-family: var(--mono) !important;
  font-size: 1.08rem !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
}
#panel-chart .crd-major-rr {
  font-size: 0.7rem !important;
  color: #fde68a !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}
#panel-chart .crd-major-rr b {
  font-family: var(--mono) !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
}
#panel-chart .crd-obs-warn {
  font-size: 0.69rem !important;
  color: #fda4af !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
}
#panel-chart .crd-math {
  font-size: 0.71rem !important;
  color: #cbd5e1 !important;
  line-height: 1.35 !important;
}
#panel-chart .crd-math b {
  font-family: var(--mono) !important;
  font-size: 0.74rem !important;
  color: #f8fafc !important;
}
@media (max-width: 640px) {
  #panel-chart .ch-rr-duel-grid {
    grid-template-columns: 1fr !important;
  }
}

/* 4. Time-of-Day High/Low Distribution (.tod-insight-strip & 30m Range Slots) */
#panel-chart .tod-insight-strip, #panel-data .tod-insight-strip {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 14px !important;
  padding-bottom: 12px !important;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.24) !important;
}
#panel-chart .tis-card, #panel-data .tis-card {
  padding: 6px 0 6px 12px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 3px solid rgba(148, 163, 184, 0.45) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
#panel-chart .tis-card.is-open, #panel-data .tis-card.is-open {
  border-left-color: #34d399 !important;
}
#panel-chart .tis-card.is-close, #panel-data .tis-card.is-close {
  border-left-color: #fbbf24 !important;
}
#panel-chart .tis-head, #panel-data .tis-head {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px 8px !important;
}
#panel-chart .tis-head b, #panel-data .tis-head b {
  font-family: var(--font-head) !important;
  font-size: 0.84rem !important;
  color: #f8fafc !important;
}
#panel-chart .tis-stat, #panel-data .tis-stat {
  font-family: var(--mono) !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
}
#panel-chart .tis-stat em, #panel-data .tis-stat em {
  font-style: normal !important;
}
#panel-chart .tis-card p, #panel-data .tis-card p {
  margin: 0 !important;
  font-size: 0.78rem !important;
  line-height: 1.48 !important;
  color: #cbd5e1 !important;
}
#panel-chart .tod-h,
#panel-chart .tod-r, #panel-data .tod-h, #panel-data .tod-r {
  grid-template-columns: minmax(175px, 210px) 1fr 86px 1fr 86px !important;
  gap: 10px !important;
  align-items: center !important;
}
#panel-chart .tod-r, #panel-data .tod-r {
  padding: 4px 6px !important;
  border-radius: 7px !important;
}
#panel-chart .tod-r.is-peak-slot, #panel-data .tod-r.is-peak-slot {
  background: rgba(250, 204, 21, 0.06) !important;
}
#panel-chart .tod-t, #panel-data .tod-t {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 0.8rem !important;
}
#panel-chart .tod-t b, #panel-data .tod-t b {
  font-family: var(--mono) !important;
  font-weight: 700 !important;
  color: #f1f5f9 !important;
}
#panel-chart .tod-phase, #panel-data .tod-phase {
  display: inline-flex !important;
  align-items: center !important;
  padding: 1px 6px !important;
  border-radius: 999px !important;
  font-family: var(--font-body) !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  background: rgba(148, 163, 184, 0.15) !important;
  color: #e2e8f0 !important;
}
#panel-chart .tod-phase.is-open, #panel-data .tod-phase.is-open {
  background: rgba(16, 185, 129, 0.18) !important;
  color: #6ee7b7 !important;
  border: 1px solid rgba(52, 211, 153, 0.4) !important;
}
#panel-chart .tod-phase.is-power,
#panel-chart .tod-phase.is-close, #panel-data .tod-phase.is-power, #panel-data .tod-phase.is-close {
  background: rgba(245, 158, 11, 0.18) !important;
  color: #fde68a !important;
  border: 1px solid rgba(251, 191, 36, 0.4) !important;
}
#panel-chart .tod-n, #panel-data .tod-n {
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  color: #e2e8f0 !important;
  white-space: nowrap !important;
}
#panel-chart .tod-n small, #panel-data .tod-n small {
  font-size: 0.68rem !important;
  color: #94a3b8 !important;
  font-weight: 500 !important;
}
#panel-chart .tod-n.is-hot-hi, #panel-data .tod-n.is-hot-hi {
  color: #34d399 !important;
}
#panel-chart .tod-n.is-hot-lo, #panel-data .tod-n.is-hot-lo {
  color: #fb7185 !important;
}
@media (max-width: 900px) {
  #panel-chart .tod-insight-strip, #panel-data .tod-insight-strip {
    grid-template-columns: 1fr !important;
  }
  #panel-chart .tod-h,
  #panel-chart .tod-r, #panel-data .tod-h, #panel-data .tod-r {
    grid-template-columns: 92px 1fr 42px 1fr 42px !important;
    gap: 6px !important;
  }
  #panel-chart .tod-h, #panel-data .tod-h {
    font-size: 0.7rem !important;
    line-height: 1.25 !important;
  }
  #panel-chart .tod-phase,
  #panel-chart .tod-n small, #panel-data .tod-phase, #panel-data .tod-n small {
    display: none !important;
  }
}
@media (max-width: 640px) {
  #panel-chart .ch-tcard {
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 12px 12px !important;
  }
  #panel-chart .ch-rr-tug-strip .crt-labels,
  #panel-chart .ch-pr-labels,
  #panel-chart .ch-lad-spot {
    flex-wrap: wrap !important;
    white-space: normal !important;
  }
}

/* Light Mode Overrides for V122 */
html[data-theme="light"] #panel-chart .ch-tc-title,
html[data-theme="light"] #panel-chart .ch-mtf-top b,
html[data-theme="light"] #panel-chart .ch-mtf-state,
html[data-theme="light"] #panel-chart .ch-lad-spot b,
html[data-theme="light"] #panel-chart .ch-tc-foot b {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .ch-lad-spot {
  color: #92400e !important;
  border-color: rgba(217, 119, 6, 0.45) !important;
}
html[data-theme="light"] #panel-chart .ch-conf-score {
  color: #78350f !important;
  background: #fef3c7 !important;
  border-color: #d97706 !important;
}
html[data-theme="light"] #panel-chart .ch-conf-score.up {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #059669 !important;
}
html[data-theme="light"] #panel-chart .ch-conf-score.down {
  color: #9f1239 !important;
  background: #ffe4e6 !important;
  border-color: #e11d48 !important;
}
html[data-theme="light"] #panel-chart .crt-labels .up,
html[data-theme="light"] #panel-chart .crt-labels .up b,
html[data-theme="light"] #panel-chart .ch-pr-labels .up,
html[data-theme="light"] #panel-chart .ch-pr-labels .up b {
  color: #047857 !important;
}
html[data-theme="light"] #panel-chart .crt-labels .down,
html[data-theme="light"] #panel-chart .crt-labels .down b,
html[data-theme="light"] #panel-chart .ch-pr-labels .down,
html[data-theme="light"] #panel-chart .ch-pr-labels .down b {
  color: #be123c !important;
}
html[data-theme="light"] #panel-chart .ch-lad-tier.is-tier-strong {
  color: #92400e !important;
  background: #fef3c7 !important;
  border-color: #d97706 !important;
}
html[data-theme="light"] #panel-chart .ch-lad-tier.is-tier-med {
  color: #075985 !important;
  background: #e0f2fe !important;
  border-color: #0284c7 !important;
}
html[data-theme="light"] #panel-chart .ch-lad-tier.is-tier-weak {
  color: #475569 !important;
  background: #f1f5f9 !important;
  border-color: #94a3b8 !important;
}
html[data-theme="light"] #panel-chart .ch-sr-balance {
  background: transparent !important;
  border-top-color: #cbd5e1 !important;
}
html[data-theme="light"] #panel-chart .ch-sr-balance .csb-badge {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .ch-sr-balance .csb-note {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .crd-side {
  background: rgba(241, 245, 249, 0.72) !important;
  border-top-color: #94a3b8 !important;
}
html[data-theme="light"] #panel-chart .crd-side.is-call.is-winner {
  background: linear-gradient(180deg, rgba(16, 185, 129, 0.14) 0%, rgba(240, 253, 244, 0.85) 100%) !important;
  border-top-color: #059669 !important;
}
html[data-theme="light"] #panel-chart .crd-side.is-put.is-winner {
  background: linear-gradient(180deg, rgba(244, 63, 94, 0.14) 0%, rgba(255, 241, 242, 0.85) 100%) !important;
  border-top-color: #e11d48 !important;
}
html[data-theme="light"] #panel-chart .crd-verdict.is-win {
  color: #92400e !important;
  background: #fef3c7 !important;
  border-color: #d97706 !important;
}
html[data-theme="light"] #panel-chart .crd-verdict.is-lose {
  color: #475569 !important;
  background: #f1f5f9 !important;
}
html[data-theme="light"] #panel-chart .crd-major-rr {
  color: #b45309 !important;
}
html[data-theme="light"] #panel-chart .crd-obs-warn {
  color: #be123c !important;
}
html[data-theme="light"] #panel-chart .crd-math {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .crd-math b {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .tis-card, html[data-theme="light"] #panel-data .tis-card {
  background: transparent !important;
  border-left-color: #94a3b8 !important;
}
html[data-theme="light"] #panel-chart .tis-card.is-open, html[data-theme="light"] #panel-data .tis-card.is-open {
  border-left-color: #059669 !important;
}
html[data-theme="light"] #panel-chart .tis-card.is-close, html[data-theme="light"] #panel-data .tis-card.is-close {
  border-left-color: #d97706 !important;
}
html[data-theme="light"] #panel-chart .tis-head b,
html[data-theme="light"] #panel-chart .tod-t b, html[data-theme="light"] #panel-data .tis-head b, html[data-theme="light"] #panel-data .tod-t b {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .tis-card p,
html[data-theme="light"] #panel-chart .tis-stat,
html[data-theme="light"] #panel-chart .tod-n, html[data-theme="light"] #panel-data .tis-card p, html[data-theme="light"] #panel-data .tis-stat, html[data-theme="light"] #panel-data .tod-n {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .tod-phase.is-open, html[data-theme="light"] #panel-data .tod-phase.is-open {
  background: #d1fae5 !important;
  color: #065f46 !important;
}
html[data-theme="light"] #panel-chart .tod-phase.is-power,
html[data-theme="light"] #panel-chart .tod-phase.is-close, html[data-theme="light"] #panel-data .tod-phase.is-power, html[data-theme="light"] #panel-data .tod-phase.is-close {
  background: #fef3c7 !important;
  color: #92400e !important;
}

/* ==========================================================================
   V123 — Line-Touch Highlighting & Alerts, RSI Buy/Sell Pressure Callouts,
   Mobile-App Push Notification System, & Overlap #1 Sync onto SPY Chart
   ========================================================================== */

/* 1. Compact Alert Controls inside .ch-live-strip (Zero Height Expansion) */
#panel-chart .ch-alert-controls {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-wrap: nowrap;
}
#panel-chart .ch-alert-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 8px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.70rem;
  font-weight: 700;
  line-height: 1.25;
  cursor: pointer;
  white-space: nowrap;
  border: 1px solid rgba(148, 163, 184, 0.28);
  background: rgba(15, 23, 42, 0.78);
  color: #cbd5e1;
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease;
}
#panel-chart .ch-alert-btn.is-on {
  background: rgba(16, 185, 129, 0.16);
  border-color: rgba(52, 211, 153, 0.48);
  color: #6ee7b7;
}
#panel-chart .ch-alert-btn.is-perm {
  background: rgba(56, 189, 248, 0.13);
  border-color: rgba(56, 189, 248, 0.42);
  color: #7dd3fc;
}
#panel-chart .ch-alert-btn.is-perm.is-granted {
  background: rgba(16, 185, 129, 0.14);
  border-color: rgba(52, 211, 153, 0.42);
  color: #6ee7b7;
}
#panel-chart .ch-alert-btn.is-test {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.22), rgba(217, 119, 6, 0.14));
  border-color: rgba(251, 191, 36, 0.55);
  color: #fde68a;
}
#panel-chart .ch-alert-btn:hover {
  border-color: #facc15;
  color: #ffffff;
}
@media (min-width: 981px) and (max-width: 1560px) {
  #panel-chart .ch-live-strip #chStatus,
  #panel-chart .ch-live-strip #chVix,
  #panel-chart .ch-cmd-top .ch-preset-lbl {
    display: none !important;
  }
  #panel-chart .ch-cmd-top .ch-preset-bar,
  #panel-chart .ch-cmd-top .ch-live-strip {
    gap: 5px !important;
  }
  #panel-chart .ch-preset-btn {
    padding: 3px 8px !important;
    font-size: 0.70rem !important;
  }
  #panel-chart .ch-alert-btn {
    padding: 2px 7px !important;
    font-size: 0.68rem !important;
  }
}

/* 2. On-Chart Target Level Shake Animation & Live Level Pin Host (V128 — Prominent Right-Side Badges for 👑 ต้าน #1, 🛡️ รับ #1, 🟢 Call Wall, 🔴 Put Wall + Gentle Proximity Shake) */
@keyframes dteTargetShake {
  0%, 62%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  68% { transform: translate3d(-1.6px, -0.5px, 0) rotate(-0.4deg) scale(1.022); }
  74% { transform: translate3d(1.6px, 0.5px, 0) rotate(0.4deg) scale(1.022); }
  80% { transform: translate3d(-1.2px, 0, 0) rotate(-0.25deg) scale(1.014); }
  86% { transform: translate3d(1.2px, 0, 0) rotate(0.25deg) scale(1.014); }
  92% { transform: translate3d(-0.6px, 0, 0) scale(1.006); }
}
@keyframes dteLevelBeamPulse {
  0%, 62%, 100% { opacity: 0.48; transform: scaleX(0.94); }
  78% { opacity: 0.95; transform: scaleX(1.04); }
}
#panel-chart .chl-ind.is-ov-res b {
  color: #6ee7b7 !important;
}
#panel-chart .chl-ind.is-ov-sup b {
  color: #fda4af !important;
}
#panel-chart .chl-ind.is-touching {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 1px 8px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.22);
  border: 1.5px solid rgba(251, 191, 36, 0.72);
  box-shadow: 0 0 12px rgba(245, 158, 11, 0.28);
}
#panel-chart .chl-ind.is-ov-res.is-touching {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.28), rgba(245, 158, 11, 0.22));
  border-color: #34d399;
  box-shadow: 0 0 14px rgba(52, 211, 153, 0.36);
}
#panel-chart .chl-ind.is-ov-sup.is-touching {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.28), rgba(245, 158, 11, 0.22));
  border-color: #fb7185;
  box-shadow: 0 0 14px rgba(251, 113, 133, 0.36);
}
#panel-chart .chl-ind.is-hit-shaking {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  animation: dteTargetShake 3.2s ease-in-out infinite;
  will-change: transform;
}
#panel-chart .chl-touch-tag {
  font-style: normal;
  font-size: 0.65rem;
  font-weight: 800;
  color: #fde68a;
  letter-spacing: 0.01em;
}
#panel-chart #chHost .tv-lightweight-charts {
  position: relative !important;
}
#panel-chart .ch-live-level-pin-host {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 6;
  overflow: hidden;
}
#panel-chart .ch-level-target-pin {
  position: absolute;
  right: 0;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 0;
  pointer-events: auto;
  cursor: pointer;
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  outline: none;
  appearance: none;
  user-select: none;
  z-index: 6;
  transition: opacity 0.16s ease, filter 0.16s ease;
}
#panel-chart .ch-level-target-pin:hover,
#panel-chart .ch-level-target-pin:focus-visible {
  z-index: 9;
  filter: brightness(1.08);
}
#panel-chart .ch-level-target-pin .cltp-leader-svg {
  width: 66px;
  height: 36px;
  flex-shrink: 0;
  display: block;
  overflow: visible;
  pointer-events: none;
}
#panel-chart .ch-level-target-pin .cltp-leader-path {
  fill: none;
  stroke: #34d399;
  stroke-width: 1.85;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 5px rgba(52, 211, 153, 0.72));
}
#panel-chart .ch-level-target-pin.is-sup .cltp-leader-path {
  stroke: #fb7185;
  filter: drop-shadow(0 0 5px rgba(251, 113, 133, 0.72));
}
#panel-chart .ch-level-target-pin .cltp-leader-dot {
  fill: #34d399;
}
#panel-chart .ch-level-target-pin.is-sup .cltp-leader-dot {
  fill: #fb7185;
}
#panel-chart .ch-level-target-pin .cltp-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.73rem;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.30), rgba(5, 14, 24, 0.96));
  border: 1.5px solid #34d399;
  color: #ecfdf5;
  box-shadow: 0 5px 16px rgba(0, 0, 0, 0.58), 0 0 12px rgba(16, 185, 129, 0.28);
  backdrop-filter: blur(8px);
  transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease, opacity 0.16s ease;
}
#panel-chart .ch-level-target-pin:hover .cltp-pill,
#panel-chart .ch-level-target-pin:focus-visible .cltp-pill {
  transform: translateX(-2px);
  border-color: #facc15;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.68), 0 0 16px rgba(250, 204, 21, 0.38);
}
#panel-chart .ch-level-target-pin.is-sup .cltp-pill {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.30), rgba(24, 6, 16, 0.96));
  border-color: #fb7185;
  color: #fff1f2;
  box-shadow: 0 5px 16px rgba(0, 0, 0, 0.58), 0 0 12px rgba(244, 63, 94, 0.28);
}
#panel-chart .ch-level-target-pin.is-call-wall .cltp-pill {
  background: linear-gradient(135deg, rgba(5, 150, 105, 0.36), rgba(6, 20, 26, 0.96));
  border-color: #10b981;
}
#panel-chart .ch-level-target-pin.is-put-wall .cltp-pill {
  background: linear-gradient(135deg, rgba(225, 29, 72, 0.36), rgba(26, 8, 16, 0.96));
  border-color: #f43f5e;
}
#panel-chart .ch-level-target-pin .cltp-pill b {
  font-family: var(--font-head);
  font-weight: 800;
  color: #6ee7b7;
}
#panel-chart .ch-level-target-pin.is-sup .cltp-pill b {
  color: #fda4af;
}
#panel-chart .ch-level-target-pin .cltp-px {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 800;
  color: #ffffff;
}
#panel-chart .ch-level-target-pin .cltp-imp {
  font-family: var(--font-mono);
  font-size: 0.67rem;
  font-weight: 700;
  color: #cbd5e1;
}
#panel-chart .ch-level-target-pin .cltp-state {
  font-style: normal;
  font-size: 0.65rem;
  font-weight: 800;
  padding: 1px 6px;
  border-radius: 999px;
  background: rgba(250, 204, 21, 0.22);
  border: 1px solid rgba(250, 204, 21, 0.68);
  color: #fef08a;
}
#panel-chart .ch-level-target-pin .cltp-line-tog {
  display: inline-flex;
  align-items: center;
  padding: 1px 6px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.63rem;
  font-weight: 800;
  background: rgba(15, 23, 42, 0.58);
  border: 1px solid rgba(148, 163, 184, 0.38);
  color: #cbd5e1;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
#panel-chart .ch-level-target-pin:hover .cltp-line-tog {
  background: rgba(250, 204, 21, 0.22);
  border-color: rgba(250, 204, 21, 0.75);
  color: #fef08a;
}
#panel-chart .ch-level-target-pin.is-line-off .cltp-pill {
  background: rgba(15, 23, 42, 0.88) !important;
  border-style: dashed !important;
  opacity: 0.78;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.42);
}
#panel-chart .ch-level-target-pin.is-line-off:hover .cltp-pill {
  opacity: 1;
}
#panel-chart .ch-level-target-pin.is-line-off .cltp-leader-path {
  stroke-dasharray: 2.5 2.5;
  opacity: 0.52;
}
#panel-chart .ch-level-target-pin.is-line-off .cltp-line-tog {
  background: rgba(56, 189, 248, 0.20);
  border-color: rgba(56, 189, 248, 0.62);
  color: #bae6fd;
}
#panel-chart .ch-level-target-pin .cltp-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 6px #34d399;
  flex-shrink: 0;
}
#panel-chart .ch-level-target-pin.is-sup .cltp-dot {
  background: #fb7185;
  box-shadow: 0 0 6px #fb7185;
}
#panel-chart .ch-level-target-pin.is-touching .cltp-pill,
#panel-chart .ch-level-target-pin.is-near-shaking .cltp-pill {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.38), rgba(6, 14, 24, 0.97));
  border-color: #facc15;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.62), 0 0 18px rgba(52, 211, 153, 0.45), 0 0 8px rgba(250, 204, 21, 0.45);
}
#panel-chart .ch-level-target-pin.is-sup.is-touching .cltp-pill,
#panel-chart .ch-level-target-pin.is-sup.is-near-shaking .cltp-pill {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.38), rgba(24, 6, 16, 0.97));
  border-color: #facc15;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.62), 0 0 18px rgba(251, 113, 133, 0.45), 0 0 8px rgba(250, 204, 21, 0.45);
}
#panel-chart .ch-level-target-pin.is-touching .cltp-pill b {
  color: #fef08a;
}
#panel-chart .ch-level-target-pin.is-touching .cltp-dot {
  background: #facc15;
  box-shadow: 0 0 10px #facc15;
}
#panel-chart .ch-level-target-pin.is-near-shaking .cltp-pill,
#panel-chart .ch-level-target-pin.is-hit-shaking .cltp-pill {
  animation: dteTargetShake 3.2s ease-in-out infinite;
  will-change: transform;
}
@media (max-width: 640px) {
  #panel-chart .ch-level-target-pin {
    right: 0;
  }
  #panel-chart .ch-level-target-pin .cltp-leader-svg {
    width: 18px;
  }
  #panel-chart .ch-level-target-pin .cltp-pill {
    padding: 2px 7px;
    font-size: 0.65rem;
    gap: 3px;
  }
  #panel-chart .ch-level-target-pin .cltp-px {
    font-size: 0.67rem;
  }
  #panel-chart .ch-level-target-pin .cltp-imp,
  #panel-chart .ch-level-target-pin .cltp-state {
    display: none;
  }
  #panel-chart .ch-level-target-pin .cltp-line-tog {
    font-size: 0.58rem;
    padding: 1px 4px;
  }
}
#panel-chart .ch-touch-banner {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 6;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  width: 100% !important;
  max-width: 100% !important;
  padding: 5px 10px;
  background: rgba(6, 9, 17, 0.95);
  border-top: 1px solid rgba(148, 163, 184, 0.18);
  pointer-events: none;
}
#panel-chart .ctb-live-engine {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.72rem;
  line-height: 1.25;
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.28), rgba(6, 10, 20, 0.94));
  border: 1.5px solid rgba(52, 211, 153, 0.72);
  color: #ecfdf5;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45), 0 0 12px rgba(16, 185, 129, 0.24);
  backdrop-filter: blur(8px);
}
#panel-chart .ctb-live-engine b {
  font-weight: 800;
  color: #6ee7b7;
}
#panel-chart .ctb-live-engine small {
  font-size: 0.67rem;
  color: #a7f3d0;
  opacity: 0.92;
}
#panel-chart .ctb-live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 8px #34d399;
  flex-shrink: 0;
}
#panel-chart .ctb-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.74rem;
  line-height: 1.25;
  background: rgba(6, 10, 20, 0.90);
  border: 1.5px solid rgba(251, 191, 36, 0.68);
  color: #f8fafc;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45), 0 0 14px rgba(245, 158, 11, 0.22);
  backdrop-filter: blur(8px);
}
#panel-chart .ctb-pill.is-wick-hit {
  border-color: #facc15;
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.26), rgba(6, 10, 20, 0.92));
}
#panel-chart .ctb-pill.is-live-now {
  border-color: #fbbf24;
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.34), rgba(6, 10, 20, 0.95));
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.55), 0 0 18px rgba(251, 191, 36, 0.34);
}
#panel-chart .ctb-pill b {
  font-weight: 800;
  color: #fde68a;
}
#panel-chart .ctb-pill em {
  font-style: normal;
  font-family: var(--font-mono);
  font-size: 0.71rem;
  color: #cbd5e1;
}
#panel-chart .ctb-pulse {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #facc15;
  box-shadow: 0 0 8px #facc15;
  flex-shrink: 0;
}

/* 3. RSI Buy/Sell Pressure Callouts (<30 แรงขายเยอะมาก / >70 แรงซื้อเยอะมาก — Zero-Clip Header & Canvas) */
#panel-chart .ch-rsi-pressure-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.25;
  white-space: nowrap;
}
#panel-chart .ch-rsi-pressure-chip.is-ob-extreme,
#panel-chart .ch-rsi-pressure-chip.is-buy-heavy {
  background: rgba(251, 113, 133, 0.20);
  border: 1px solid rgba(251, 113, 133, 0.55);
  color: #fecdd3;
}
#panel-chart .ch-rsi-pressure-chip.is-os-extreme,
#panel-chart .ch-rsi-pressure-chip.is-sell-heavy {
  background: rgba(52, 211, 153, 0.20);
  border: 1px solid rgba(52, 211, 153, 0.55);
  color: #a7f3d0;
}
#panel-chart .ch-rsi-pressure-chip.is-buy-strong,
#panel-chart .ch-rsi-pressure-chip.is-buy-mid,
#panel-chart .ch-rsi-pressure-chip.is-buy-lead {
  background: rgba(16, 185, 129, 0.18);
  border: 1px solid rgba(52, 211, 153, 0.52);
  color: #a7f3d0;
}
#panel-chart .ch-rsi-pressure-chip.is-sell-strong,
#panel-chart .ch-rsi-pressure-chip.is-sell-mid,
#panel-chart .ch-rsi-pressure-chip.is-sell-lead {
  background: rgba(244, 63, 94, 0.18);
  border: 1px solid rgba(251, 113, 133, 0.52);
  color: #fecdd3;
}
#panel-chart .ch-rsi-ext-note {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 0.70rem;
  font-weight: 700;
  white-space: nowrap !important;
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.25);
  color: #cbd5e1;
}
#panel-chart .ch-rsi-ext-note.is-ob {
  border-color: rgba(251, 113, 133, 0.45);
  color: #fda4af;
}
#panel-chart .ch-rsi-ext-note.is-os {
  border-color: rgba(52, 211, 153, 0.45);
  color: #6ee7b7;
}
/* Permanently hide any floating RSI canvas banner so it never blocks 🔥 แรงซื้อเยอะ / 🩸 แรงขายเยอะ markers */
#panel-chart .ch-rsi-zone-banner {
  display: none !important;
}

/* 4. Synced Super-Confluence Overlap #1 Cards (👑 แนวต้านทับซ้อนอันดับ 1 & 🛡️ แนวรับทับซ้อนอันดับ 1) */
#panel-chart .ch-sr-strip.is-overlap-sync {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 8px !important;
}
#panel-chart .ch-sr-pill.is-overlap-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 5px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.68) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
}
#panel-chart .ch-sr-pill.is-overlap-card.is-res {
  border-left: 3px solid #10b981 !important;
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.13), rgba(15, 23, 42, 0.78)) !important;
}
#panel-chart .ch-sr-pill.is-overlap-card.is-sup {
  border-left: 3px solid #f43f5e !important;
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.13), rgba(15, 23, 42, 0.78)) !important;
}
#panel-chart .ch-sr-pill.is-overlap-card.is-testing-live {
  border-color: rgba(251, 191, 36, 0.62) !important;
  box-shadow: 0 0 14px rgba(245, 158, 11, 0.16);
}
#panel-chart .csro-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}
#panel-chart .csro-imp {
  font-family: var(--font-mono);
  font-size: 0.69rem;
  font-weight: 800;
  padding: 1px 7px;
  border-radius: 999px;
  background: rgba(245, 158, 11, 0.16);
  border: 1px solid rgba(251, 191, 36, 0.45);
  color: #fde68a;
  white-space: nowrap;
}
#panel-chart .csro-main {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
#panel-chart .csro-main .ch-sr-px {
  font-family: var(--font-mono);
  font-size: 1.24rem !important;
  font-weight: 800 !important;
  line-height: 1.1;
}
#panel-chart .csro-dist {
  font-size: 0.72rem;
  font-weight: 700;
  color: #cbd5e1;
}
#panel-chart .csro-dist.is-hot {
  color: #fde68a;
  background: rgba(245, 158, 11, 0.18);
  border: 1px solid rgba(251, 191, 36, 0.45);
  padding: 1px 7px;
  border-radius: 999px;
}
#panel-chart .csro-eq {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  font-size: 0.71rem;
  color: #e2e8f0;
  line-height: 1.35;
}
#panel-chart .csro-eq-pill {
  background: rgba(6, 10, 20, 0.56);
  border: 1px solid rgba(148, 163, 184, 0.22);
  padding: 2px 7px;
  border-radius: 6px;
  font-weight: 600;
}
#panel-chart .csro-eq-plus {
  font-size: 0.68rem;
  opacity: 0.85;
}
#panel-chart .csro-foot {
  font-size: 0.70rem;
  font-weight: 700;
  color: #94a3b8;
  margin-top: 1px;
}
#panel-chart .ch-sr-pill.is-overlap-card.is-res .csro-foot {
  color: #a7f3d0;
}
#panel-chart .ch-sr-pill.is-overlap-card.is-sup .csro-foot {
  color: #fecdd3;
}

/* 5. Mobile-App Style Dynamic Island / iOS Push Notification Toast */
.ch-push-toast-host {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 99999;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(495px, calc(100vw - 24px));
  pointer-events: none;
}
.ch-push-toast {
  pointer-events: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(9, 14, 26, 0.96);
  border: 1.5px solid rgba(251, 191, 36, 0.65);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.62), 0 0 22px rgba(245, 158, 11, 0.22);
  backdrop-filter: blur(16px);
  color: #f8fafc;
  transform: translateY(0);
  opacity: 1;
  transition: transform 0.26s ease, opacity 0.26s ease;
}
.ch-push-toast.is-bull {
  border-color: rgba(52, 211, 153, 0.72);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.62), 0 0 22px rgba(16, 185, 129, 0.24);
}
.ch-push-toast.is-bear {
  border-color: rgba(251, 113, 133, 0.72);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.62), 0 0 22px rgba(244, 63, 94, 0.24);
}
.ch-push-toast.is-leaving {
  transform: translateY(-12px);
  opacity: 0;
}
.cpt-app-bar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 5px;
  font-size: 0.70rem;
}
.cpt-app-icon {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  object-fit: cover;
  flex-shrink: 0;
}
.cpt-app-name {
  font-family: var(--font-head);
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #cbd5e1;
  white-space: nowrap;
  flex-shrink: 0;
}
.cpt-badge {
  padding: 1px 7px;
  border-radius: 999px;
  font-weight: 800;
  background: rgba(245, 158, 11, 0.2);
  border: 1px solid rgba(251, 191, 36, 0.48);
  color: #fde68a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.cpt-hold-pill {
  padding: 1px 7px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 0.66rem;
  background: rgba(244, 63, 94, 0.18);
  border: 1px solid rgba(251, 113, 133, 0.5);
  color: #fecdd3;
  white-space: nowrap;
  flex-shrink: 0;
}
.cpt-time {
  margin-left: auto;
  font-family: var(--font-mono);
  color: #94a3b8;
  font-size: 0.68rem;
  white-space: nowrap;
  flex-shrink: 0;
}
.cpt-close {
  appearance: none;
  border: 0;
  background: rgba(148, 163, 184, 0.16);
  color: #cbd5e1;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  font-size: 0.72rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.cpt-close:hover {
  background: rgba(244, 63, 94, 0.28);
  color: #ffffff;
}
.cpt-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.cpt-title {
  font-family: var(--font-head);
  font-size: 0.92rem;
  font-weight: 800;
  color: #ffffff;
  line-height: 1.3;
}
.cpt-desc {
  margin: 0;
  font-size: 0.78rem;
  color: #cbd5e1;
  line-height: 1.42;
}

@media (max-width: 640px) {
  #panel-chart .ch-sr-strip.is-overlap-sync {
    grid-template-columns: 1fr !important;
  }
  #panel-chart .ch-rsi-zone-banner .rzb-sub {
    display: none;
  }
  .ch-push-toast-host {
    top: 10px;
    right: 12px;
    left: 12px;
    width: auto;
  }
  .ch-push-toast-host .cpt-app-name {
    display: none;
  }
}

/* Light Mode Overrides for V123 */
html[data-theme="light"] #panel-chart .ch-touch-banner {
  background: #f8fafc !important;
  border-top-color: #cbd5e1 !important;
}
html[data-theme="light"] #panel-chart .ch-alert-btn {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .ch-alert-btn.is-on {
  background: #d1fae5 !important;
  border-color: #059669 !important;
  color: #065f46 !important;
}
html[data-theme="light"] #panel-chart .ch-alert-btn.is-test {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #92400e !important;
}
html[data-theme="light"] #panel-chart .ch-sr-pill.is-overlap-card {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}
html[data-theme="light"] #panel-chart .ch-sr-pill.is-overlap-card.is-res {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.12), #f8fafc) !important;
}
html[data-theme="light"] #panel-chart .ch-sr-pill.is-overlap-card.is-sup {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.12), #f8fafc) !important;
}
html[data-theme="light"] #panel-chart .csro-imp,
html[data-theme="light"] #panel-chart .csro-dist.is-hot {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #92400e !important;
}
html[data-theme="light"] #panel-chart .csro-dist,
html[data-theme="light"] #panel-chart .csro-eq {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .csro-eq-pill {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .ch-sr-pill.is-overlap-card.is-res .csro-foot {
  color: #047857 !important;
}
html[data-theme="light"] #panel-chart .ch-sr-pill.is-overlap-card.is-sup .csro-foot {
  color: #be123c !important;
}
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-ob-extreme,
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-buy-strong,
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-buy-heavy,
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-sell-strong,
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-sell-mid,
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-sell-lead {
  background: #ffe4e6 !important;
  border-color: #e11d48 !important;
  color: #9f1239 !important;
}
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-os-extreme,
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-sell-heavy,
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-buy-mid {
  background: #d1fae5 !important;
  border-color: #059669 !important;
  color: #065f46 !important;
}
html[data-theme="light"] #panel-chart .ch-rsi-pressure-chip.is-buy-lead {
  background: #e0f2fe !important;
  border-color: #0284c7 !important;
  color: #075985 !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin.is-res .cltp-pill {
  background: rgba(236, 253, 245, 0.96) !important;
  border-color: #059669 !important;
  color: #065f46 !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin.is-sup .cltp-pill {
  background: rgba(255, 241, 242, 0.96) !important;
  border-color: #e11d48 !important;
  color: #9f1239 !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin.is-res .cltp-pill b {
  color: #047857 !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin.is-sup .cltp-pill b {
  color: #be123c !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin .cltp-px {
  color: #0f172a !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin .cltp-imp {
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin .cltp-state {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #92400e !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin .cltp-line-tog {
  background: #ffffff !important;
  border-color: #94a3b8 !important;
  color: #334155 !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin.is-line-off .cltp-pill {
  background: rgba(248, 250, 252, 0.94) !important;
}
html[data-theme="light"] #panel-chart .ch-level-target-pin.is-line-off .cltp-line-tog {
  background: #e0f2fe !important;
  border-color: #0284c7 !important;
  color: #0369a1 !important;
}
html[data-theme="light"] #panel-chart .ch-rsi-ext-note {
  background: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #334155 !important;
}
html[data-theme="light"] .ch-push-toast {
  background: rgba(255, 255, 255, 0.97) !important;
  border-color: #d97706 !important;
  color: #0f172a !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.18) !important;
}
html[data-theme="light"] .cpt-app-name {
  color: #475569 !important;
}
html[data-theme="light"] .cpt-badge {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #92400e !important;
}
html[data-theme="light"] .cpt-hold-pill {
  background: #ffe4e6 !important;
  border-color: #e11d48 !important;
  color: #9f1239 !important;
}
html[data-theme="light"] .cpt-title {
  color: #0f172a !important;
}
html[data-theme="light"] .cpt-desc {
  color: #334155 !important;
}













/* ==========================================================================
   V133 · 3-STAGE TRADING LIFECYCLE COMMAND CENTER (#panel-levels)
   Stage ① Entry Gate · Stage ② In-Trade Holding Monitor · Stage ③ Exit & Review
   ========================================================================== */
:is(#panel-levels, #panel-library) .desk-lifecycle-stage {
  margin-bottom: 28px !important;
}
:is(#panel-levels, #panel-library) .dlc-stage-banner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  padding: 18px 22px !important;
  margin-bottom: 16px !important;
  border-radius: 16px !important;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(7, 13, 25, 0.96)) !important;
  border: 1px solid rgba(56, 189, 248, 0.28) !important;
  border-left: 5px solid #38bdf8 !important;
  box-shadow: 0 12px 28px rgba(2, 6, 23, 0.36) !important;
}
:is(#panel-levels, #panel-library) .dlc-stage-banner.is-entry {
  border-left-color: #34d399 !important;
  border-color: rgba(52, 211, 153, 0.32) !important;
}
:is(#panel-levels, #panel-library) .dlc-stage-banner.is-hold {
  border-left-color: #f5b73b !important;
  border-color: rgba(245, 183, 59, 0.34) !important;
}
:is(#panel-levels, #panel-library) .dlc-stage-banner.is-exit {
  border-left-color: #38bdf8 !important;
  border-color: rgba(56, 189, 248, 0.34) !important;
}
:is(#panel-levels, #panel-library) .dlc-stage-banner.is-plan {
  border-left-color: #c084fc !important;
  border-color: rgba(192, 132, 252, 0.32) !important;
}
:is(#panel-levels, #panel-library) .dlc-stage-left {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  flex: 1 1 480px !important;
  min-width: 0 !important;
}
:is(#panel-levels, #panel-library) .dlc-step-pill {
  display: inline-flex !important;
  align-items: center !important;
  align-self: flex-start !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  background: rgba(56, 189, 248, 0.14) !important;
  color: #7dd3fc !important;
  border: 1px solid rgba(56, 189, 248, 0.36) !important;
}
:is(#panel-levels, #panel-library) .dlc-step-pill.is-entry {
  background: rgba(16, 185, 129, 0.15) !important;
  color: #6ee7b7 !important;
  border-color: rgba(52, 211, 153, 0.4) !important;
}
:is(#panel-levels, #panel-library) .dlc-step-pill.is-hold {
  background: rgba(245, 183, 59, 0.16) !important;
  color: #fde68a !important;
  border-color: rgba(245, 183, 59, 0.42) !important;
}
:is(#panel-levels, #panel-library) .dlc-step-pill.is-plan {
  background: rgba(192, 132, 252, 0.16) !important;
  color: rgba(233, 213, 255, 0.96) !important;
  border-color: rgba(192, 132, 252, 0.42) !important;
}
:is(#panel-levels, #panel-library) .dlc-stage-title {
  margin: 0 !important;
  font-family: var(--aku-font-head) !important;
  font-size: clamp(1.22rem, 1.8vw, 1.48rem) !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
  line-height: 1.25 !important;
}
:is(#panel-levels, #panel-library) .dlc-stage-sub {
  margin: 4px 0 0 !important;
  font-size: 0.86rem !important;
  color: #94a3b8 !important;
  line-height: 1.45 !important;
}
:is(#panel-levels, #panel-library) .dlc-stage-jumps {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  align-items: center !important;
}
:is(#panel-levels, #panel-library) .dlc-jump-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px 13px !important;
  border-radius: 999px !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  background: rgba(14, 165, 233, 0.12) !important;
  border: 1px solid rgba(56, 189, 248, 0.35) !important;
  color: #e0f2fe !important;
  cursor: pointer !important;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease !important;
}
:is(#panel-levels, #panel-library) .dlc-jump-btn:hover {
  transform: translateY(-1px) !important;
  background: rgba(14, 165, 233, 0.24) !important;
  border-color: #7dd3fc !important;
}

/* 🚨 Persistent Zone & Level-Touch Radar on Trade Desk (.desk-zone-radar) */
#deskLive .desk-zone-radar {
  margin: 0 0 14px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  background: rgba(15, 23, 42, 0.82) !important;
  border: 1px solid rgba(52, 211, 153, 0.3) !important;
}
#deskLive .desk-zone-radar.is-clear {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
#deskLive .desk-zone-radar.is-clear .dzr-left {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
#deskLive .desk-zone-radar.is-clear .dzr-left b {
  font-size: 0.88rem !important;
  color: #e2e8f0 !important;
}
#deskLive .desk-zone-radar.is-active {
  background: linear-gradient(135deg, rgba(69, 10, 26, 0.52), rgba(15, 23, 42, 0.94)) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.55) !important;
  box-shadow: 0 10px 26px rgba(244, 63, 94, 0.16) !important;
}
#deskLive .dzr-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-bottom: 12px !important;
}
#deskLive .dzr-title-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
#deskLive .dzr-title-wrap b {
  font-size: 0.92rem !important;
  color: #fff1f2 !important;
}
#deskLive .dzr-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 10px !important;
}
#deskLive .dzr-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  padding: 12px 14px !important;
  border-radius: 12px !important;
  background: rgba(9, 14, 28, 0.82) !important;
  border-left: 4px solid #f59e0b !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-right: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
}
#deskLive .dzr-card.is-warn { border-left-color: #fb7185 !important; }
#deskLive .dzr-card.is-good { border-left-color: #34d399 !important; }
#deskLive .dzr-card.is-sky { border-left-color: #38bdf8 !important; }
#deskLive .dzr-card.is-purple { border-left-color: #c084fc !important; }
#deskLive .dzr-badge {
  align-self: flex-start !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  background: rgba(251, 113, 133, 0.16) !important;
  color: #fda4af !important;
}
#deskLive .dzr-card.is-good .dzr-badge {
  background: rgba(52, 211, 153, 0.16) !important;
  color: #6ee7b7 !important;
}
#deskLive .dzr-card b {
  font-size: 0.92rem !important;
  color: #f8fafc !important;
  line-height: 1.35 !important;
}
#deskLive .dzr-card small {
  font-size: 0.81rem !important;
  color: #cbd5e1 !important;
  line-height: 1.4 !important;
}

/* ⚖️ Cross-Tab Synthesis Deck (.desk-synthesis-grid) */
#deskLive .desk-synthesis-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 14px 0 !important;
}
#deskLive .dsg-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 16px 18px !important;
  border-radius: 14px !important;
  background: rgba(11, 18, 34, 0.88) !important;
  border: 1px solid rgba(56, 189, 248, 0.24) !important;
}
#deskLive .dsg-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
#deskLive .dsg-kicker {
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  color: #7dd3fc !important;
  letter-spacing: 0.02em !important;
}
#deskLive .dsg-rr-row {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
#deskLive .dsg-rr-side {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  background: rgba(15, 23, 42, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.18) !important;
}
#deskLive .dsg-rr-side.is-call.is-win {
  border-color: rgba(52, 211, 153, 0.55) !important;
  background: rgba(6, 78, 59, 0.26) !important;
}
#deskLive .dsg-rr-side.is-put.is-win {
  border-color: rgba(251, 113, 133, 0.55) !important;
  background: rgba(136, 19, 55, 0.26) !important;
}
#deskLive .dsg-rr-side small {
  font-size: 0.76rem !important;
  color: #94a3b8 !important;
}
#deskLive .dsg-rr-side b {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  font-family: var(--aku-font-head) !important;
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
#deskLive .dsg-rr-side.is-call b { color: #6ee7b7 !important; }
#deskLive .dsg-rr-side.is-put b { color: #fda4af !important; }
#deskLive .dsg-rr-tag {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.74rem !important;
  padding: 2px 7px !important;
  border-radius: 6px !important;
  background: rgba(15, 23, 42, 0.85) !important;
  color: #e2e8f0 !important;
}
#deskLive .dsg-duel-bar {
  position: relative !important;
  display: flex !important;
  height: 12px !important;
  border-radius: 999px !important;
  overflow: visible !important;
  background: rgba(15, 23, 42, 0.9) !important;
}
#deskLive .dsg-duel-bar i.is-call {
  display: block !important;
  height: 100% !important;
  border-radius: 999px 0 0 999px !important;
  background: linear-gradient(90deg, #059669, #34d399) !important;
}
#deskLive .dsg-duel-bar i.is-put {
  display: block !important;
  height: 100% !important;
  border-radius: 0 999px 999px 0 !important;
  background: linear-gradient(90deg, #fb7185, #e11d48) !important;
}
#deskLive .dsg-duel-seam {
  position: absolute !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 0.72rem !important;
  background: #0f172a !important;
  border: 2px solid #fde047 !important;
  box-shadow: 0 0 10px rgba(250, 204, 21, 0.55) !important;
  z-index: 2 !important;
}
#deskLive .dsg-pulse-bars {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
#deskLive .dpb-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}
#deskLive .dpb-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  font-size: 0.82rem !important;
  color: #e2e8f0 !important;
}
#deskLive .dpb-track {
  display: flex !important;
  height: 9px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(15, 23, 42, 0.85) !important;
}
#deskLive .dpb-track i.is-up {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #10b981, #34d399) !important;
}
#deskLive .dpb-track i.is-dn {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #fb7185, #f43f5e) !important;
}
#deskLive .dpb-sub {
  font-size: 0.77rem !important;
  color: #94a3b8 !important;
  line-height: 1.35 !important;
}
#deskLive .dsg-foot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.14) !important;
  font-size: 0.8rem !important;
  color: #cbd5e1 !important;
}

/* ☑️ Inline Interactive Playbook Must-Rule Checklist (.desk-inline-checklist) */
#deskLive .desk-inline-checklist {
  margin-top: 14px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  background: rgba(11, 18, 34, 0.86) !important;
  border: 1px solid rgba(245, 183, 59, 0.32) !important;
}
#deskLive .desk-inline-checklist.is-complete {
  border-color: rgba(52, 211, 153, 0.45) !important;
  background: linear-gradient(135deg, rgba(6, 78, 59, 0.25), rgba(11, 18, 34, 0.9)) !important;
}
#deskLive .dic-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin-bottom: 10px !important;
}
#deskLive .dic-title {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
#deskLive .dic-title b {
  font-size: 0.88rem !important;
  color: #f8fafc !important;
}
#deskLive .dic-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)) !important;
  gap: 8px !important;
}
#deskLive .dic-pill {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  padding: 8px 11px !important;
  border-radius: 10px !important;
  background: rgba(15, 23, 42, 0.78) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
  color: #cbd5e1 !important;
  font-size: 0.8rem !important;
  text-align: left !important;
  cursor: pointer !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}
#deskLive .dic-pill:hover {
  border-color: #7dd3fc !important;
  background: rgba(14, 165, 233, 0.14) !important;
}
#deskLive .dic-pill.is-checked {
  background: rgba(16, 185, 129, 0.14) !important;
  border-color: rgba(52, 211, 153, 0.48) !important;
  color: #ecfdf5 !important;
}
#deskLive .dic-box {
  width: 20px !important;
  height: 20px !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  font-weight: 900 !important;
  font-size: 0.76rem !important;
  background: rgba(15, 23, 42, 0.9) !important;
  border: 1.5px solid rgba(148, 163, 184, 0.45) !important;
  color: #34d399 !important;
}
#deskLive .dic-pill.is-checked .dic-box {
  background: #10b981 !important;
  border-color: #34d399 !important;
  color: #052e16 !important;
}
#deskLive .dic-txt {
  line-height: 1.3 !important;
}

/* 🏰 Stage ② · Interactive Spatial Battlefield Ladder & In-Trade Holding Monitor */
#panel-levels .desk-hold-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr) !important;
  gap: 16px !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
}
#panel-levels .desk-hold-grid > * {
  min-width: 0 !important;
  max-width: 100% !important;
}
#deskLadder .lad.is-battlefield-ladder {
  height: 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 18px 20px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(13, 21, 38, 0.96), rgba(8, 14, 26, 0.98)) !important;
  border: 1px solid rgba(56, 189, 248, 0.3) !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
#deskLadder .lad-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
#deskLadder .lad-title {
  margin: 2px 0 0 !important;
  font-size: 1.08rem !important;
  color: #f8fafc !important;
}
#deskLadder .lad-sub {
  margin: 4px 0 0 !important;
  font-size: 0.8rem !important;
  color: #94a3b8 !important;
  line-height: 1.4 !important;
}
#deskLadder .lad-rail {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
}
#deskLadder .lad-row {
  display: grid !important;
  grid-template-columns: 12px 84px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 12px !important;
  border-radius: 11px !important;
  background: rgba(11, 18, 34, 0.86) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  min-width: 0 !important;
}
#deskLadder .lad-row.lad-spot {
  background: linear-gradient(90deg, rgba(56, 189, 248, 0.18), rgba(15, 23, 42, 0.92)) !important;
  border: 1.5px solid #38bdf8 !important;
  box-shadow: 0 0 16px rgba(56, 189, 248, 0.2) !important;
}
#deskLadder .lad-row.lad-call { border-left: 3.5px solid #34d399 !important; }
#deskLadder .lad-row.lad-put  { border-left: 3.5px solid #fb7185 !important; }
#deskLadder .lad-row.lad-zero { border-left: 3.5px solid #fbbf24 !important; }
#deskLadder .lad-node {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: #64748b !important;
}
#deskLadder .lad-row.lad-spot .lad-node {
  background: #38bdf8 !important;
  box-shadow: 0 0 10px #38bdf8 !important;
}
#deskLadder .lad-row.lad-call .lad-node { background: #34d399 !important; }
#deskLadder .lad-row.lad-put .lad-node  { background: #fb7185 !important; }
#deskLadder .lad-row.lad-zero .lad-node { background: #fbbf24 !important; }
#deskLadder .lad-px {
  font-family: var(--aku-font-head) !important;
  font-size: 0.98rem !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
  white-space: nowrap !important;
}
#deskLadder .lad-meta {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 3px !important;
  min-width: 0 !important;
}
#deskLadder .lad-meta b {
  display: block !important;
  font-size: 0.85rem !important;
  color: #e2e8f0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
#deskLadder .lad-meta small {
  display: block !important;
  font-size: 0.75rem !important;
  color: #94a3b8 !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
#deskLadder .lad-dist {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 3px !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
  white-space: nowrap !important;
}
#deskLadder .lad-dist.up { color: #34d399 !important; }
#deskLadder .lad-dist.dn { color: #fb7185 !important; }
#deskLadder .lad-dist.here { color: #38bdf8 !important; }
#deskLadder .lad-foot {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  font-size: 0.76rem !important;
  color: #94a3b8 !important;
  padding-top: 6px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.2) !important;
}
#deskLadder .lad-head-badges {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 4px !important;
}
#deskLadder .lad-row[data-lad-sim] {
  cursor: pointer !important;
  transition: transform 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease !important;
}
#deskLadder .lad-row[data-lad-sim]:hover {
  transform: translateX(3px) !important;
  border-color: rgba(56, 189, 248, 0.55) !important;
}
#deskLadder .lad-row.is-sim-active {
  border-color: #f5b73b !important;
  box-shadow: 0 0 0 1px rgba(245, 183, 59, 0.45), 0 8px 20px rgba(2, 6, 23, 0.35) !important;
}
@keyframes ladNearPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.35); }
  50% { box-shadow: 0 0 0 4px rgba(251, 191, 36, 0.16); }
}
#deskLadder .lad-row.is-near-shaking {
  animation: ladNearPulse 2.2s ease-in-out infinite !important;
}
#deskLadder .lad-fort-bar {
  display: block !important;
  height: 4px !important;
  width: 100% !important;
  max-width: 160px !important;
  margin-top: 4px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.16) !important;
  overflow: hidden !important;
}
#deskLadder .lad-fort-bar i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #38bdf8, #34d399) !important;
}
#deskLadder .lad-put .lad-fort-bar i,
#deskLadder .lad-sup1 .lad-fort-bar i {
  background: linear-gradient(90deg, #fb7185, #f59e0b) !important;
}
#deskLadder .lad-sim-card {
  margin-top: 12px !important;
  padding: 13px 15px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.14), rgba(15, 23, 42, 0.92)) !important;
  border: 1px solid rgba(56, 189, 248, 0.42) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
}
#deskLadder .lsc-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
#deskLadder .lsc-kicker {
  font-size: 0.75rem !important;
  font-weight: 800 !important;
  color: #7dd3fc !important;
}
#deskLadder .lsc-main b {
  font-size: 0.95rem !important;
  color: #f8fafc !important;
}
#deskLadder .lsc-main p {
  margin: 4px 0 0 !important;
  font-size: 0.83rem !important;
  color: #cbd5e1 !important;
  line-height: 1.4 !important;
}
#deskLadder .lsc-frontrun {
  padding-top: 6px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.24) !important;
  font-size: 0.8rem !important;
  color: #fde68a !important;
}

/* ⏱️ Stage ② · Runner Hook & Theta Monitor (#deskHoldMonitor) */
#deskHoldMonitor .dhm-card {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 18px 20px !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(13, 21, 38, 0.96), rgba(8, 14, 26, 0.98)) !important;
  border: 1px solid rgba(245, 183, 59, 0.3) !important;
}
#deskHoldMonitor .dhm-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
#deskHoldMonitor .dhm-head h3 {
  margin: 2px 0 0 !important;
  font-size: 1.08rem !important;
  color: #f8fafc !important;
}
#deskHoldMonitor .dhm-sim-pills {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
#deskHoldMonitor .dhm-hook-alert {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 12px 14px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.84) !important;
  border: 1px solid rgba(56, 189, 248, 0.3) !important;
}
#deskHoldMonitor .dhm-hook-alert.is-call-exit,
#deskHoldMonitor .dhm-hook-alert.is-put-exit {
  background: linear-gradient(135deg, rgba(120, 53, 15, 0.48), rgba(15, 23, 42, 0.95)) !important;
  border: 1.5px solid #fbbf24 !important;
  box-shadow: 0 0 20px rgba(245, 158, 11, 0.25) !important;
}
#deskHoldMonitor .dhm-hook-alert b {
  font-size: 0.88rem !important;
  color: #f8fafc !important;
  line-height: 1.4 !important;
}
#deskHoldMonitor .dhm-gauges-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
#deskHoldMonitor .dhm-gauge-box {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 12px !important;
  border-radius: 12px !important;
  background: rgba(9, 15, 28, 0.82) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
}
#deskHoldMonitor .dhm-gauge-box.is-hook-hot {
  border-color: #fbbf24 !important;
  background: rgba(120, 53, 15, 0.22) !important;
}
#deskHoldMonitor .dgb-top {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}
#deskHoldMonitor .dgb-top b {
  font-size: 0.8rem !important;
  color: #e2e8f0 !important;
}
#deskHoldMonitor .dhm-gauge-svg {
  width: 100% !important;
  max-width: 176px !important;
  height: auto !important;
}
#deskHoldMonitor .dgb-note {
  font-size: 0.74rem !important;
  color: #94a3b8 !important;
  text-align: center !important;
  line-height: 1.35 !important;
}
#deskHoldMonitor .dhm-guard-strip {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
#deskHoldMonitor .dgs-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  background: rgba(9, 15, 28, 0.78) !important;
  border-left: 3.5px solid #64748b !important;
}
#deskHoldMonitor .dgs-item.is-bull { border-left-color: #34d399 !important; }
#deskHoldMonitor .dgs-item.is-bear { border-left-color: #fb7185 !important; }
#deskHoldMonitor .dgs-item small {
  font-size: 0.74rem !important;
  color: #94a3b8 !important;
}
#deskHoldMonitor .dgs-item b {
  font-size: 0.84rem !important;
  color: #f8fafc !important;
}
#deskHoldMonitor .dhm-theta-box {
  padding: 12px 14px !important;
  border-radius: 12px !important;
  background: rgba(9, 15, 28, 0.84) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
}
#deskHoldMonitor .dtb-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-bottom: 6px !important;
}
#deskHoldMonitor .dtb-top b {
  display: block !important;
  font-size: 0.85rem !important;
  color: #f8fafc !important;
}
#deskHoldMonitor .dtb-top small {
  font-size: 0.75rem !important;
  color: #94a3b8 !important;
}
#deskHoldMonitor .dhm-theta-svg {
  width: 100% !important;
  height: auto !important;
  max-height: 92px !important;
}

/* 🧮 Stage ③ · Sell Calculator GEX Regime Banner & Wall Front-Run Strip */
#deskSell .sc-regime-banner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  padding: 10px 14px !important;
  margin-bottom: 12px !important;
  border-radius: 11px !important;
  background: rgba(15, 23, 42, 0.82) !important;
  border: 1px solid rgba(52, 211, 153, 0.32) !important;
}
#deskSell .sc-regime-banner.is-neg {
  border-color: rgba(251, 113, 133, 0.42) !important;
}
#deskSell .srb-left {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  font-size: 0.84rem !important;
  color: #e2e8f0 !important;
}
#deskSell .sc-frontrun-strip {
  margin-top: 14px !important;
  padding: 13px 15px !important;
  border-radius: 12px !important;
  background: rgba(11, 18, 34, 0.88) !important;
  border: 1px solid rgba(245, 183, 59, 0.34) !important;
}
#deskSell .sfs-head {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  margin-bottom: 10px !important;
}
#deskSell .sfs-head b {
  font-size: 0.88rem !important;
  color: #fde68a !important;
}
#deskSell .sfs-head small {
  font-size: 0.76rem !important;
  color: #94a3b8 !important;
}
#deskSell .sfs-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
#deskSell .sfs-box {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 10px 12px !important;
  border-radius: 10px !important;
  background: rgba(15, 23, 42, 0.8) !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
}
#deskSell .sfs-box.is-call { border-left: 3.5px solid #34d399 !important; }
#deskSell .sfs-box.is-put { border-left: 3.5px solid #fb7185 !important; }
#deskSell .sfs-box b {
  font-family: var(--aku-font-head) !important;
  font-size: 0.96rem !important;
  color: #f8fafc !important;
}
#deskSell .sfs-box small {
  font-size: 0.76rem !important;
  color: #cbd5e1 !important;
}

/* Responsive Mobile (<= 960px) */
@media (max-width: 960px) {
  #panel-levels .desk-hold-grid,
  #deskLive .desk-synthesis-grid,
  #deskLive .dsg-rr-row,
  #deskHoldMonitor .dhm-gauges-grid,
  #deskHoldMonitor .dhm-guard-strip,
  #deskSell .sfs-grid {
    grid-template-columns: 1fr !important;
  }
  #panel-levels .dlc-stage-banner {
    padding: 14px 16px !important;
  }
  #deskLadder .lad-row {
    grid-template-columns: 10px 76px minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 9px 10px !important;
  }
  #deskLadder .lad-dist {
    grid-column: 2 / -1 !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding-top: 4px !important;
    border-top: 1px dashed rgba(148, 163, 184, 0.16) !important;
  }
  #deskLadder .lad-head-badges {
    align-items: flex-start !important;
  }
}

/* Light Mode Overrides */
html[data-theme="light"] :is(#panel-levels, #panel-library) .dlc-stage-banner {
  background: linear-gradient(135deg, #ffffff, #f8fafc) !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] :is(#panel-levels, #panel-library) .dlc-stage-title {
  color: #0f172a !important;
}
html[data-theme="light"] :is(#panel-levels, #panel-library) .dlc-stage-sub {
  color: #475569 !important;
}
html[data-theme="light"] :is(#panel-levels, #panel-library) .dlc-jump-btn {
  background: #f0f9ff !important;
  border-color: #7dd3fc !important;
  color: #0369a1 !important;
}
html[data-theme="light"] #deskLive .desk-zone-radar,
html[data-theme="light"] #deskLive .dsg-card,
html[data-theme="light"] #deskLive .desk-inline-checklist,
html[data-theme="light"] #deskHoldMonitor .dhm-card,
html[data-theme="light"] #deskLadder .lad.is-battlefield-ladder,
html[data-theme="light"] #deskLadder .lad-sim-card,
html[data-theme="light"] #deskSell .sc-regime-banner,
html[data-theme="light"] #deskSell .sc-frontrun-strip {
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}
html[data-theme="light"] #deskLive .dzr-card,
html[data-theme="light"] #deskLive .dsg-rr-side,
html[data-theme="light"] #deskLive .dic-pill,
html[data-theme="light"] #deskLadder .lad-row,
html[data-theme="light"] #deskHoldMonitor .dhm-gauge-box,
html[data-theme="light"] #deskHoldMonitor .dgs-item,
html[data-theme="light"] #deskHoldMonitor .dhm-theta-box,
html[data-theme="light"] #deskHoldMonitor .dhm-hook-alert,
html[data-theme="light"] #deskSell .sfs-box {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}
html[data-theme="light"] #deskHoldMonitor .dhm-gauge-hub {
  fill: #ffffff !important;
}
html[data-theme="light"] #deskLive .dzr-card b,
html[data-theme="light"] #deskLive .dic-title b,
html[data-theme="light"] #deskLadder .lad-title,
html[data-theme="light"] #deskLadder .lad-px,
html[data-theme="light"] #deskLadder .lad-meta b,
html[data-theme="light"] #deskHoldMonitor .dhm-head h3,
html[data-theme="light"] #deskHoldMonitor .dgb-top b,
html[data-theme="light"] #deskHoldMonitor .dgs-item b,
html[data-theme="light"] #deskHoldMonitor .dtb-top b,
html[data-theme="light"] #deskHoldMonitor .dhm-hook-alert b,
html[data-theme="light"] #deskLadder .lsc-main b,
html[data-theme="light"] #deskSell .sfs-box b,
html[data-theme="light"] #deskSell .srb-left {
  color: #0f172a !important;
}
html[data-theme="light"] #deskLive .dzr-card small,
html[data-theme="light"] #deskLive .dsg-foot,
html[data-theme="light"] #deskLadder .lad-sub,
html[data-theme="light"] #deskLadder .lad-meta small,
html[data-theme="light"] #deskHoldMonitor .dgb-note,
html[data-theme="light"] #deskLadder .lsc-main p,
html[data-theme="light"] #deskSell .sfs-box small {
  color: #334155 !important;
}
html[data-theme="light"] #deskLadder .lsc-frontrun,
html[data-theme="light"] #deskSell .sfs-head b {
  color: #b45309 !important;
}

/* ==========================================================================
   V134 · WEB STANDARD v2 (2026-10-24) — AUDIKUNG DESIGN SYSTEM HARMONY
   - Shared /assets/ak-ui.css tokens + JetBrains Mono
   - Zero circled numbers (①②③) or 1. 2. 3. prefixes on sub-navs
   - Sub-tabs (#deskSubTabs, .gx-sec-tabs, .ch-sec-tabs) & .filter-row =
     frameless underline filter bars (.aku-filterbar / .aku-ftab) with
     colour-coded category pods (.desk-subtab-pod)
   - Slim 40px action buttons (.aku-cta / .aku-cta--ghost) with 16-bit pixel
     sprites + hover arrow disc lift
   - North Star Night Sky (#ak-sky) + Daylight Ledger (html[data-theme="light"])
   ========================================================================== */

main#main,
footer#ak-site-footer {
  position: relative;
  z-index: 1;
}

/* 0. Hide owner-only tabs in public mode across all widths (including <1080px sticky rail) */
html body:not(.is-owner-view) nav.tabs:not(#akx) .owner-tab {
  display: none !important;
}

/* 1. Hero & Panel Head v2 Action Buttons (.aku-cta, 40px max height, Finance Emerald primary + outline ghost) */
.guide-cta-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.aku-cta,
.guide-cta-bar .aku-cta,
.panel-head .aku-cta,
.guide-hero-btns .aku-cta,
.dlc-stage-jumps .aku-cta,
.ach-bp-actions .aku-cta,
.ach-stage-actions .aku-cta,
.ach-head-right .aku-cta,
.lib-sec-head .aku-cta {
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  padding: 0 8px 0 12px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-head, 'Outfit', 'Plus Jakarta Sans', 'Sarabun', sans-serif) !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.aku-cta:not(.aku-cta--ghost),
.guide-cta-bar .aku-cta:not(.aku-cta--ghost),
.panel-head .aku-cta:not(.aku-cta--ghost),
.guide-hero-btns .aku-cta:not(.aku-cta--ghost),
.dlc-stage-jumps .aku-cta:not(.aku-cta--ghost),
.ach-bp-actions .aku-cta:not(.aku-cta--ghost),
.ach-stage-actions .aku-cta:not(.aku-cta--ghost),
.ach-head-right .aku-cta:not(.aku-cta--ghost),
.lib-sec-head .aku-cta:not(.aku-cta--ghost) {
  --c: #4ade80;
  --c2: #22c55e;
  --edge: #15803d;
  --ink: #052e16;
  background: linear-gradient(180deg, color-mix(in srgb, var(--c) 85%, #fff) 0%, var(--c) 38%, var(--c2) 100%) !important;
  color: var(--ink) !important;
  border: 1px solid color-mix(in srgb, var(--c) 55%, #fff) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), inset 0 -2px 0 color-mix(in srgb, var(--edge) 55%, transparent), 0 3px 0 var(--edge), 0 10px 18px -10px var(--c) !important;
}

.aku-cta[data-to="gold"]:not(.aku-cta--ghost) {
  --c: rgb(249, 223, 151);
  --c2: rgb(219, 169, 74);
  --edge: rgb(168, 119, 31);
  --ink: rgb(42, 28, 3);
}

.aku-cta.aku-cta--ghost,
.guide-cta-bar .aku-cta.aku-cta--ghost,
.panel-head .aku-cta.aku-cta--ghost,
.guide-hero-btns .aku-cta.aku-cta--ghost,
.dlc-stage-jumps .aku-cta.aku-cta--ghost,
.ach-bp-actions .aku-cta.aku-cta--ghost,
.ach-stage-actions .aku-cta.aku-cta--ghost,
.ach-head-right .aku-cta.aku-cta--ghost,
.lib-sec-head .aku-cta.aku-cta--ghost {
  background: rgba(15, 23, 42, 0.58) !important;
  border: 1.5px solid rgba(74, 222, 128, 0.45) !important;
  color: var(--aku-text, #f4f6fc) !important;
  box-shadow: none !important;
}

.aku-cta.aku-cta--ghost[data-to="gold"] {
  border-color: rgba(251, 191, 36, 0.5) !important;
}

.aku-cta.aku-cta--ghost:hover,
.guide-cta-bar .aku-cta.aku-cta--ghost:hover,
.panel-head .aku-cta.aku-cta--ghost:hover,
.guide-hero-btns .aku-cta.aku-cta--ghost:hover,
.dlc-stage-jumps .aku-cta.aku-cta--ghost:hover,
.ach-bp-actions .aku-cta.aku-cta--ghost:hover,
.ach-stage-actions .aku-cta.aku-cta--ghost:hover,
.ach-head-right .aku-cta.aku-cta--ghost:hover,
.lib-sec-head .aku-cta.aku-cta--ghost:hover {
  border-color: rgba(74, 222, 128, 0.85) !important;
  background: rgba(16, 185, 129, 0.16) !important;
}

.aku-cta.aku-cta--ghost[data-to="gold"]:hover {
  border-color: rgba(251, 191, 36, 0.88) !important;
  background: rgba(251, 191, 36, 0.15) !important;
}

.aku-cta .aku-cta-ico,
.aku-cta .aku-cta-ic {
  position: relative !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  margin-left: -3px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.22) !important;
  flex-shrink: 0 !important;
}

.aku-cta.aku-cta--ghost .aku-cta-ico,
.aku-cta.aku-cta--ghost .aku-cta-ic {
  background: rgba(255, 255, 255, 0.9) !important;
}

.aku-cta .aku-cta-ico > [data-ak-px],
.aku-cta .aku-cta-ic > [data-ak-px] {
  position: static !important;
  margin: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 16px !important;
  height: 16px !important;
  line-height: 0 !important;
}

.aku-cta .aku-cta-ico svg.ak-px,
.aku-cta .aku-cta-ic svg.ak-px {
  width: 16px !important;
  height: 16px !important;
  vertical-align: 0 !important;
  display: block !important;
}

.aku-cta .ak-emoji-lead {
  display: none !important;
}

.aku-cta .aku-cta-arrow,
.aku-cta .aku-cta-ar {
  display: inline-grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  margin-right: -2px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.34) !important;
  font-size: 0.82rem !important;
  flex-shrink: 0 !important;
}

.aku-cta.aku-cta--ghost .aku-cta-arrow,
.aku-cta.aku-cta--ghost .aku-cta-ar {
  background: rgba(255, 255, 255, 0.14) !important;
}
  font-weight: 800;
}

.guide-hero-more {
  margin: 0 0 14px;
  border: 1px solid var(--aku-line, rgba(148, 163, 184, 0.16));
  border-radius: 12px;
  background: rgba(11, 18, 32, 0.55);
  padding: 8px 14px;
}

.guide-hero-more > summary {
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--aku-copy, #bdcde2);
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
}

.guide-hero-more > summary::-webkit-details-marker {
  display: none;
}

.guide-hero-more > p {
  margin: 8px 0 2px;
  font-size: 0.82rem;
  line-height: 1.6;
  color: var(--aku-copy, #bdcde2);
}

/* 2. Grouped Sub-Tab Bar (#deskSubTabs) — Colour-Coded Category Pods + Underline Tabs */
#deskSubTabs.desk-subtabs.aku-filterbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 6px 14px !important;
  padding: 6px 12px 0 !important;
  margin: 0 0 14px !important;
  background: rgba(9, 15, 28, 0.62) !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-radius: 14px 14px 0 0 !important;
  box-shadow: none !important;
}

#deskSubTabs .desk-subtab-pod {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 8px;
  min-width: 0;
}

#deskSubTabs .desk-subtab-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px;
  margin-right: 2px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--grp, #38bdf8) 12%, rgba(15, 23, 42, 0.72));
  border: 1px solid color-mix(in srgb, var(--grp, #38bdf8) 34%, transparent);
  color: color-mix(in srgb, var(--grp, #38bdf8) 82%, #f8fafc);
  font-family: var(--aku-font-head, 'Outfit', 'Plus Jakarta Sans', 'Sarabun', sans-serif);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  white-space: nowrap;
}

#deskSubTabs .desk-subtab-group::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: var(--grp, #38bdf8);
  box-shadow: 0 0 8px var(--grp, #38bdf8);
}

#deskSubTabs .desk-subtab-btns {
  display: inline-flex;
  align-items: stretch;
  flex-wrap: wrap;
  gap: 2px;
}

#deskSubTabs .desk-subtab-sep {
  width: 1px;
  align-self: stretch;
  margin: 6px 2px;
  background: rgba(148, 163, 184, 0.2);
}

#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab,
#panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab,
#panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab {
  position: relative !important;
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 38px !important;
  max-height: 40px !important;
  padding: 6px 12px 9px !important;
  margin: 0 0 -1px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2.5px solid transparent !important;
  border-radius: 9px 9px 0 0 !important;
  box-shadow: none !important;
  color: var(--aku-copy, #bdcde2) !important;
  font-family: var(--aku-font-head, 'Outfit', 'Plus Jakarta Sans', 'Sarabun', sans-serif) !important;
  font-size: 0.83rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: color 0.16s ease, background 0.16s ease, border-color 0.16s ease !important;
}

#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab::after,
#panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab::after,
#panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab::after {
  display: none !important;
}

#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab .dst-txt {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: baseline !important;
  gap: 6px !important;
}

#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab .dst-txt b,
#panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab .dst-txt b,
#panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab .dsub-txt b {
  font-size: 0.83rem !important;
  font-weight: 700 !important;
  color: var(--aku-copy, #bdcde2) !important;
}

#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab .dst-txt small {
  display: none !important;
}

#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab:hover,
#panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab:hover,
#panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab:hover {
  color: var(--aku-text, #f4f6fc) !important;
  background: rgba(148, 163, 184, 0.08) !important;
}

#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab:hover .dst-txt b,
#panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab:hover .dst-txt b,
#panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab:hover .dsub-txt b {
  color: var(--aku-text, #f4f6fc) !important;
}

#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab.is-active,
#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab[aria-selected="true"],
#panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab.is-active,
#panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab[aria-selected="true"],
#panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab.is-active,
#panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab[aria-selected="true"] {
  color: var(--aku-text, #f4f6fc) !important;
  font-weight: 700 !important;
  border-bottom-color: var(--ftab, #38bdf8) !important;
  background: radial-gradient(90% 100% at 50% 100%, color-mix(in srgb, var(--ftab, #38bdf8) 22%, transparent), transparent 76%) !important;
}

#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab.is-active .dst-txt b,
#deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab[aria-selected="true"] .dst-txt b,
#panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab.is-active .dst-txt b,
#panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab[aria-selected="true"] .dst-txt b,
#panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab.is-active .dsub-txt b,
#panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab[aria-selected="true"] .dsub-txt b {
  color: var(--aku-text, #f4f6fc) !important;
}

.gx-sec-tabs.aku-filterbar,
.ch-sec-tabs.aku-filterbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 4px !important;
  padding: 4px 10px 0 !important;
  background: rgba(9, 15, 28, 0.56) !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-radius: 12px 12px 0 0 !important;
  box-shadow: none !important;
}

/* 3. Filter Rows (.filter-row .filter) — Frameless Underline Filter Bar (Never Boxed Buttons) */
.filter-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 6px !important;
  padding: 0 0 2px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
}

.filter-row .filter {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 8px 8px 0 0 !important;
  padding: 6px 11px 8px !important;
  min-height: 34px !important;
  margin-bottom: -1px !important;
  color: var(--aku-copy, #bdcde2) !important;
  font-family: var(--aku-font-head, 'Outfit', 'Plus Jakarta Sans', 'Sarabun', sans-serif) !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

.filter-row .filter:hover {
  color: var(--aku-text, #f4f6fc) !important;
  background: rgba(148, 163, 184, 0.08) !important;
}

.filter-row .filter.is-active,
.filter-row .filter[aria-pressed="true"] {
  color: var(--aku-text, #f4f6fc) !important;
  font-weight: 700 !important;
  border-bottom-color: var(--aku-cyan, #38bdf8) !important;
  background: radial-gradient(90% 100% at 50% 100%, rgba(56, 189, 248, 0.18), transparent 76%) !important;
}

/* 4. Daylight Ledger (html[data-theme="light"]) Harmony for v2 Sub-Tabs & Controls */
html[data-theme="light"] .dte-meta,
html[data-theme="light"] .dte-context.dte-top-ribbon {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-theme="light"] .aku-cta.aku-cta--ghost,
html[data-theme="light"] .guide-cta-bar .aku-cta.aku-cta--ghost,
html[data-theme="light"] .panel-head .aku-cta.aku-cta--ghost,
html[data-theme="light"] .guide-hero-btns .aku-cta.aku-cta--ghost,
html[data-theme="light"] .dlc-stage-jumps .aku-cta.aku-cta--ghost,
html[data-theme="light"] .ach-bp-actions .aku-cta.aku-cta--ghost,
html[data-theme="light"] .ach-stage-actions .aku-cta.aku-cta--ghost,
html[data-theme="light"] .ach-head-right .aku-cta.aku-cta--ghost,
html[data-theme="light"] .lib-sec-head .aku-cta.aku-cta--ghost {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(21, 128, 61, 0.45) !important;
  color: var(--aku-text) !important;
}

html[data-theme="light"] .aku-cta.aku-cta--ghost[data-to="gold"] {
  border-color: rgba(180, 83, 9, 0.48) !important;
}

html[data-theme="light"] .aku-cta.aku-cta--ghost .aku-cta-arrow,
html[data-theme="light"] .aku-cta.aku-cta--ghost .aku-cta-ar {
  background: rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] .guide-hero-more {
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(15, 23, 42, 0.12);
}

html[data-theme="light"] .guide-hero-more > summary {
  color: var(--aku-text, #142f49);
}

html[data-theme="light"] .guide-hero-more > p {
  color: var(--aku-copy, #425b78);
}

html[data-theme="light"] #deskSubTabs.desk-subtabs.aku-filterbar,
html[data-theme="light"] #panel-gex .gx-sec-tabs.aku-filterbar,
html[data-theme="light"] #panel-chart .ch-sec-tabs.aku-filterbar {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  border-bottom-color: rgba(15, 23, 42, 0.18) !important;
}

html[data-theme="light"] #deskSubTabs .desk-subtab-group {
  background: color-mix(in srgb, var(--grp, #0284c7) 12%, #ffffff);
  border-color: color-mix(in srgb, var(--grp, #0284c7) 36%, transparent);
  color: var(--aku-text, #142f49);
}

html[data-theme="light"] #deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab:not([aria-selected="true"]):not(.is-active),
html[data-theme="light"] #panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab:not([aria-selected="true"]):not(.is-active),
html[data-theme="light"] #panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab:not([aria-selected="true"]):not(.is-active),
html[data-theme="light"] .filter-row .filter:not(.is-active):not([aria-pressed="true"]) {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2.5px solid transparent !important;
  box-shadow: none !important;
  color: var(--aku-copy, #425b78) !important;
}

html[data-theme="light"] #deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab:not([aria-selected="true"]):not(.is-active) .dst-txt b,
html[data-theme="light"] #panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab:not([aria-selected="true"]):not(.is-active) .dst-txt b,
html[data-theme="light"] #panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab:not([aria-selected="true"]):not(.is-active) .dsub-txt b {
  color: var(--aku-copy, #425b78) !important;
}

html[data-theme="light"] #deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab.is-active,
html[data-theme="light"] #deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab[aria-selected="true"],
html[data-theme="light"] #panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab.is-active,
html[data-theme="light"] #panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab[aria-selected="true"],
html[data-theme="light"] #panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab.is-active,
html[data-theme="light"] #panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab[aria-selected="true"],
html[data-theme="light"] .filter-row .filter.is-active,
html[data-theme="light"] .filter-row .filter[aria-pressed="true"] {
  background: radial-gradient(90% 100% at 50% 100%, color-mix(in srgb, var(--ftab, #0284c7) 18%, transparent), transparent 76%) !important;
  border: 0 !important;
  border-bottom: 2.5px solid var(--ftab, #0284c7) !important;
  box-shadow: none !important;
  color: var(--aku-text, #142f49) !important;
}

html[data-theme="light"] #deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab.is-active .dst-txt b,
html[data-theme="light"] #deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab[aria-selected="true"] .dst-txt b,
html[data-theme="light"] #panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab.is-active .dst-txt b,
html[data-theme="light"] #panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab[aria-selected="true"] .dst-txt b,
html[data-theme="light"] #panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab.is-active .dsub-txt b,
html[data-theme="light"] #panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab[aria-selected="true"] .dsub-txt b {
  color: var(--aku-text, #142f49) !important;
}

/* 5. Responsive Tablet (720px) & Mobile (390px) Guards */
@media (max-width: 760px) {
  #deskSubTabs .desk-subtab-sep {
    display: none !important;
  }
  #deskSubTabs .desk-subtab-pod {
    width: 100%;
  }
  #deskSubTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab,
  #panel-gex .gx-sec-tabs.aku-filterbar .gx-sec-tab.aku-ftab,
  #panel-chart .ch-sec-tabs.aku-filterbar .ch-sec-tab.aku-ftab {
    padding: 5px 9px 8px !important;
    font-size: 0.78rem !important;
    min-height: 34px !important;
  }
  .guide-cta-bar .aku-cta,
  .panel-head .aku-cta {
    font-size: 0.78rem !important;
    padding: 0 11px !important;
  }
}

/* 6. #panel-library — Audi Clips vs Recommended External Clips Separation (#libOwnerTabs & .ach-player-blueprint) */
#libOwnerTabs.desk-subtabs.aku-filterbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px 14px !important;
  padding: 6px 12px 0 !important;
  margin-bottom: 16px !important;
  background: rgba(9, 15, 28, 0.56) !important;
  border: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-radius: 12px 12px 0 0 !important;
  box-shadow: none !important;
}

#libOwnerTabs .desk-subtab-pod {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

#libOwnerTabs .desk-subtab-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px;
  margin-bottom: 4px;
  border-radius: 999px;
  font-family: var(--aku-font-head, 'Outfit', 'Plus Jakarta Sans', 'Sarabun', sans-serif);
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--aku-text);
  background: color-mix(in srgb, var(--grp) 14%, transparent);
  border: 1px solid color-mix(in srgb, var(--grp) 38%, transparent);
  white-space: nowrap;
}

#libOwnerTabs .desk-subtab-group::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--grp);
  box-shadow: 0 0 8px var(--grp);
}

#libOwnerTabs .desk-subtab-btns {
  display: inline-flex;
  align-items: stretch;
  gap: 2px;
  flex-wrap: wrap;
}

#libOwnerTabs .desk-subtab-sep {
  width: 1px;
  height: 22px;
  background: rgba(148, 163, 184, 0.24);
  margin: 0 2px 4px;
}

#libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 38px !important;
  padding: 6px 12px 9px !important;
  margin-bottom: -1px !important;
  border: 0 !important;
  border-bottom: 2.5px solid transparent !important;
  border-radius: 8px 8px 0 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--aku-copy) !important;
  font-family: var(--aku-font-head, 'Outfit', 'Plus Jakarta Sans', 'Sarabun', sans-serif) !important;
  font-size: 0.83rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

#libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab::after {
  display: none !important;
}

#libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab .dst-txt {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: baseline !important;
  gap: 6px !important;
}

#libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab .dst-txt b {
  font-size: 0.83rem !important;
  font-weight: 700 !important;
  color: var(--aku-copy) !important;
}

#libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab .dst-txt small {
  font-size: 0.73rem !important;
  color: var(--aku-muted) !important;
}

#libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab.is-active,
#libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab[aria-selected="true"] {
  color: var(--aku-text) !important;
  font-weight: 700 !important;
  border-bottom-color: var(--ftab) !important;
  background: radial-gradient(90% 100% at 50% 100%, color-mix(in srgb, var(--ftab) 22%, transparent), transparent 76%) !important;
}

#libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab.is-active .dst-txt b,
#libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab[aria-selected="true"] .dst-txt b {
  color: var(--aku-text) !important;
}

.ach-player-poster.ach-player-blueprint {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 220px;
  padding: 16px 18px;
  background: radial-gradient(120% 120% at 50% 0%, rgba(251, 191, 36, 0.14), rgba(9, 15, 28, 0.88) 72%);
  border: 1px dashed rgba(251, 191, 36, 0.38);
  border-radius: 14px;
  cursor: default;
}

.ach-player-poster.ach-player-blueprint .ach-poster-top {
  position: static;
  display: flex;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.ach-blueprint-center {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-top: 10px;
}

.ach-bp-ico {
  font-size: 1.5rem;
  line-height: 1;
}

.ach-blueprint-center b {
  font-family: var(--aku-font-head, 'Outfit', 'Plus Jakarta Sans', 'Sarabun', sans-serif);
  font-size: 1rem;
  font-weight: 700;
  color: var(--aku-text);
}

.ach-blueprint-center p {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.5;
  color: var(--aku-copy);
}

.ach-bp-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 4px;
}

html[data-theme="light"] #libOwnerTabs.desk-subtabs.aku-filterbar {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  border-bottom-color: rgba(15, 23, 42, 0.18) !important;
}

html[data-theme="light"] #libOwnerTabs .desk-subtab-group {
  background: color-mix(in srgb, var(--grp) 12%, var(--aku-paper));
  border-color: color-mix(in srgb, var(--grp) 36%, transparent);
  color: var(--aku-text);
}

html[data-theme="light"] .ach-player-poster.ach-player-blueprint {
  background: radial-gradient(120% 120% at 50% 0%, rgba(251, 191, 36, 0.16), rgba(255, 255, 255, 0.94) 75%);
  border-color: rgba(217, 119, 6, 0.38);
}

@media (max-width: 760px) {
  #libOwnerTabs .desk-subtab-sep,
  #libOwnerTabs.desk-subtabs.aku-filterbar .desk-subtab.aku-ftab .dst-txt small {
    display: none !important;
  }
  #libOwnerTabs .desk-subtab-pod {
    width: 100%;
  }
}



/* ===== v136 base pass (Web Standard v2 · 2026-10-25) =====
   Whole-page shared base: tab sprites, dim-ink token, light-theme ink for text that sits on the dawn sky
   or inside translucent pills (contrast_pixels.py measured these at 1.1–4.4:1). Tab interiors stay as they are. */
:root { --dte-dim: #a9b8cc; }
html[data-theme="light"] { --dte-dim: #3d546c; --muted: #3d546c; }

/* tab rail: 16-bit sprite before the label (icon tier: sprite > emoji) */
.dte-tab-shell .tab .tab-px { display: inline-block; vertical-align: -3px; margin-right: 6px; flex: none; }

/* hero ink on the dawn sky */
html[data-theme="light"] body:not(#akx):not(#aky) .dte-head .dte-kicker { color: #0c4a6e !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .dte-head h1 em { color: #075985 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .dte-head .op-txt,
html[data-theme="light"] body:not(#akx):not(#aky) .dte-head .op-txt small,
html[data-theme="light"] body:not(#akx):not(#aky) .dte-session > .session-heading b,
html[data-theme="light"] body:not(#akx):not(#aky) .dte-session > .session-heading span { color: #142f49 !important; }
.dte-meta #savedAt a { font-family: var(--font-body); }

/* GEX skyline: a light chart in daylight (was a slate island with dark ink, 1.5–3:1) */
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart { background: #e8eff7 !important; border-color: rgba(20, 47, 73, .14) !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb.is-skyline-col { background: #ffffff !important; background-image: none !important; border-color: rgba(20, 47, 73, .14) !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb.is-skyline-col.is-pw { background-image: linear-gradient(#fff1f3, #ffe0e6) !important; border-color: #f4a3b4 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb.is-skyline-col.is-cw { background-image: linear-gradient(#effcf5, #d4f6e4) !important; border-color: #86d9ae !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb.is-skyline-col.spot { background-image: linear-gradient(#fffaeb, #fdecc0) !important; border-color: #e7b84a !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-k { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-axis-gap { background: rgba(20, 47, 73, .06) !important; color: #3d546c !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-axis-gap small,
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gag-dots,
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-conf-empty { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-role-cw { background-image: linear-gradient(135deg, #047857, #065f46) !important; color: #ffffff !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-conf-count { background: #fde68a !important; background-image: none !important; color: #5c3d03 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip { background: #fce7f3 !important; color: #831843 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-zg-fac { background: #fef3c7 !important; color: #6b4a06 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-mem-fac { background: #ede9fe !important; color: #4c1d95 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gbl-item { color: #142f49 !important; }

/* translucent verdict pills: opaque in daylight so the ink is measured against what is really there */
html[data-theme="light"] body:not(#akx):not(#aky) .mts-verdict.is-bear { background: #ffe4e8 !important; color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .mts-verdict.is-bull { background: #dcfce7 !important; color: #14532d !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .mts-verdict.is-flat { background: #e8eef5 !important; color: #334a62 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .mts-ema20-note { color: #3d546c !important; }

/* MACD frame nodes (ตลาดสด): translucent red/green glass over the sky read as mauve with grey ink (1.7–3.8:1) */
html[data-theme="light"] body:not(#akx):not(#aky) .macd-flow-strip .mfs-node { background-image: none !important; background-color: #ffffff !important; border-color: rgba(20, 47, 73, .16) !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .macd-flow-strip .mfs-node.is-down { background-color: #fff1f3 !important; border-color: #f4a3b4 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .macd-flow-strip .mfs-node.is-up { background-color: #effcf5 !important; border-color: #86d9ae !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .macd-flow-strip .mfs-tf,
html[data-theme="light"] body:not(#akx):not(#aky) .macd-flow-strip .mfs-role { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .macd-flow-strip .mfs-sub { color: #6b3f00 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .macd-flow-strip .mfs-state.down,
html[data-theme="light"] body:not(#akx):not(#aky) .macd-flow-strip .mfs-node.is-down .mfs-state { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .macd-flow-strip .mfs-node.is-up .mfs-state { color: #14532d !important; }

/* GEX heat cells + dense-cluster callout */
html[data-theme="light"] body:not(#akx):not(#aky) .gx-heat .gw-cell { background: #e8eef5 !important; color: #142f49 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gx-heat .v-pill b,
html[data-theme="light"] body:not(#akx):not(#aky) .gx-heat .v b { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gx-cluster-callout { background-image: linear-gradient(135deg, #fff7e0 0%, #ffffff 100%) !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gx-cluster-callout .gcc-badge { color: #6b4a06 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gx-cluster-callout .gcc-peak.is-put { background: #ffe4e8 !important; color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gx-cluster-callout .gcc-peak.is-call { background: #dcfce7 !important; color: #14532d !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gx-cluster-callout b { color: #142f49 !important; }

/* daylight semantic ink: one step darker so green/red/amber numbers hold 4.5:1 on tinted rows too */
html[data-theme="light"] { --green: #166534; --red: #9f1239; --amber: #92400e; --gold: #7a5208; --sky: #075985; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ls-tone-up, html[data-theme="light"] body:not(#akx) #main:not(#aky) .cvs-val.up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .crd-side-lbl, html[data-theme="light"] body:not(#akx) #main:not(#aky) .crd-ratio, html[data-theme="light"] body:not(#akx) #main:not(#aky) .c-col { color: #166534 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .crd-major-rr { color: #7c2d12 !important; }

/* chips: an opaque daylight tint + dark ink of the same hue (was translucent tint + adapter grey, 4.0–4.4:1) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .chip { color: #26405a !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .chip.c-sky { background: #e0f0fd !important; color: #0c4a6e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .chip.c-gold { background: #fdf3d8 !important; color: #5c3d03 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .chip.c-green { background: #dcfce7 !important; color: #14532d !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .chip.c-red { background: #ffe4e8 !important; color: #881337 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .chip.c-amber { background: #ffedd5 !important; color: #7c2d12 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .chip.c-grey { background: #e8eef5 !important; color: #26405a !important; }
/* chips printed on a video poster: give them their own dark plate in both themes (was 1.3–2.6:1 on the thumbnail) */
body:not(#akx) #panel-library:not(#aky) .ach-poster-top .chip, body:not(#akx) #panel-library:not(#aky) [class*="poster"] .chip { background: rgba(8, 15, 30, .82) !important; color: #f4f6fc !important; border-color: rgba(255, 255, 255, .22) !important; }

/* small labels that sat a hair under 4.5:1 in daylight */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .open-hint,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dlc-step-pill,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ex-sh-badge,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dzd-tag,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .k-tag,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-meta-pill,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .news-live-status,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gj-qs-verdict,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sca-f-kicker,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sca-f-pct,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sca-vs-tag,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sca-r-lbl,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .mws-pill { color: #1c3550 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .card-eyebrow { color: #5c3d03 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .mws-pill b { color: inherit !important; }

/* R:R duel rows: red/green glass → daylight tint */
html[data-theme="light"] body:not(#akx):not(#aky) .dsg-rr-side.is-put { background: #fff1f3 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .dsg-rr-side.is-call { background: #effcf5 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .dsg-rr-side small { color: #26405a !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .dsg-rr-side.is-put b { color: #881337 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .dsg-rr-side.is-call b { color: #14532d !important; }

/* Fear & Greed / VIX zone spectrum: the active glossy pill keeps its colour, its words go white; idle pills get dark ink */
html[data-theme="light"] body:not(#akx):not(#aky) .fg-zone-pill { color: #1c3550 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .fg-zone-pill b, html[data-theme="light"] body:not(#akx):not(#aky) .fg-zone-pill .sz-lbl { color: inherit !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .fg-zone-pill.is-active { color: #ffffff !important; text-shadow: 0 1px 2px rgba(0, 0, 0, .45); }

/* dark-theme stragglers from the same sweep */
body:not(#akx):not(#aky) .gex-bars .gb-role-cw { background-image: linear-gradient(135deg, #047857, #065f46) !important; color: #ffffff !important; }
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) small.k-tag { color: #ffffff !important; }

/* v136 r2: instruments that now own their daylight ink (tagged data-ak-lf-skip in 0dte-setup.html) */
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-role-spot { background-image: none !important; background-color: #fde68a !important; color: #3d2a00 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-role-pw { background-image: linear-gradient(135deg, #be123c, #9f1239) !important; color: #ffffff !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-v.up { background: #dcfce7 !important; color: #14532d !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-v.down { background: #ffe4e8 !important; color: #881337 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-v { background: #e8eef5; color: #142f49; }
html[data-theme="light"] body:not(#akx):not(#aky) .gx-heat .gw-cell.is-hot, html[data-theme="light"] body:not(#akx):not(#aky) .gx-heat .gw-cell[style*="background"] { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .fg-zones .fg-zone-pill, html[data-theme="light"] body:not(#akx):not(#aky) .fg-zones .fg-zone-pill * { color: #ffffff !important; text-shadow: 0 1px 2px rgba(0, 0, 0, .5); }
html[data-theme="light"] body:not(#akx):not(#aky) .vix-tier-bar .vix-tier-pill:not(.is-on) { background: #e8eef5 !important; color: #26405a !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .vix-tier-bar .vix-tier-pill:not(.is-on) * { color: #26405a !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .vix-tier-bar .vix-tier-pill.is-on, html[data-theme="light"] body:not(#akx):not(#aky) .vix-tier-bar .vix-tier-pill.is-on * { color: #ffffff !important; text-shadow: 0 1px 2px rgba(0, 0, 0, .5); }
html[data-theme="light"] body:not(#akx):not(#aky) #panel-levels summary, html[data-theme="light"] body:not(#akx):not(#aky) #panel-market summary { color: #1c3550; }
/* chips printed on a clip thumbnail = same dark plate as the domain pill beside them, both themes */
body:not(#akx) #panel-library:not(#aky) .lib-thumb-top .chip,
html[data-theme="light"] body:not(#akx) #panel-library:not(#aky) .lib-thumb-top .chip { background: rgba(8, 13, 24, .84) !important; color: #f4f6fc !important; border-color: rgba(255, 255, 255, .22) !important; }

/* cold read 25 ต.ค.: on a phone the walking slime sits on top of headings and numbers of this working page */
@media (max-width: 760px) { body:not(#akx) #slime-mate:not(#aky) { display: none !important; } }

/* v136 final-sweep stragglers */
body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-role-spot { background-image: none !important; background-color: #fde68a !important; color: #3d2a00 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) summary { color: #1c3550 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .spy-chg.down, html[data-theme="light"] body:not(#akx) #main:not(#aky) .spy-chg:not(.up) { color: #881337 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .spy-chg.up { color: #14532d !important; }
html[data-theme="light"] body:not(#akx):not(#aky) .gx-heat .k b { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-heat .k-tag { background: #ffffff !important; color: #142f49 !important; border-color: rgba(20, 47, 73, .2) !important; }

/* ===== v141 ตลาดสด infographics (Audi 2026-10-25: "อยากเน้นให้อัปเกรกพวกinfographic ต่างๆ ให้มันดูสนุกด้วย มีaniamtion เช่น rsi") ===== */
/* RSI dial: bigger, needle pivots on the real hub (84,68), sweeps in from the last shown value, extreme zone breathes */
svg.mts-rsi-dial.is-big-dial { width: 220px !important; height: 118px !important; }
@media (max-width: 760px) { svg.mts-rsi-dial.is-big-dial { width: 180px !important; height: 97px !important; } }
.mts-rsi-dial .rsi-needle-group { transform-box: view-box; transform-origin: 84px 68px; }
.mts-rsi-dial .rsi-needle-group.is-sweeping { animation: rsiNeedleSweep 1.1s cubic-bezier(.22, 1.3, .36, 1) both, rsiNeedleFlutter 2.2s ease-in-out 1.1s infinite; }
@keyframes rsiNeedleSweep { from { transform: rotate(var(--sweep, 0deg)); } to { transform: rotate(0deg); } }
.mts-rsi-dial.is-rsi-overbought .rsi-zone-ob, .mts-rsi-dial.is-rsi-oversold .rsi-zone-os { animation: rsiZoneBreathe 1.6s ease-in-out infinite; }
@keyframes rsiZoneBreathe { 50% { stroke-width: 14px; filter: drop-shadow(0 0 6px currentColor); } }
.mts-rsi-dial .rsi-zone-os { color: #34d399; } .mts-rsi-dial .rsi-zone-ob { color: #f97316; }
html[data-motion=paused] .mts-rsi-dial *, html[data-motion=paused] .mts-rsi-dial .rsi-needle-group { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .mts-rsi-dial *, .mts-rsi-dial .rsi-needle-group { animation: none !important; } }
html[data-theme="light"] .mts-rsi-dial text { fill: #26405a; }

/* 🛗 price lift (replaces the "เรดาร์ลำดับราคา" tower) */
#main .hcd-price-tower.dte-elev { --res: #34d399; --sup: #fb7185; --car: #fbbf24; display: flex !important; flex-direction: column !important; gap: 10px !important; padding: 16px 18px !important; border-radius: 18px !important; background: linear-gradient(180deg, rgba(16, 185, 129, .10), rgba(9, 23, 45, .55) 30%, rgba(9, 23, 45, .55) 70%, rgba(244, 63, 94, .10)) !important; border: 1px solid rgba(148, 163, 184, .18) !important; box-shadow: none !important; min-height: 0 !important; }
.dte-elev .elv-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.dte-elev .elv-title { font: 800 1rem/1.2 var(--font-head); color: var(--text); }
.dte-elev .elv-status { padding: 4px 10px; border-radius: 999px; font: 700 .8rem/1.2 var(--font-body); color: #fde68a; background: rgba(245, 158, 11, .16); border: 1px solid rgba(245, 158, 11, .4); }
.dte-elev .elv-floor { position: relative; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 10px 14px; border-radius: 12px; border: 1px solid; }
.dte-elev .elv-floor.is-ceiling { border-color: color-mix(in srgb, var(--res) 55%, transparent); background: color-mix(in srgb, var(--res) 12%, transparent); border-bottom-width: 4px; }
.dte-elev .elv-floor.is-ground { border-color: color-mix(in srgb, var(--sup) 55%, transparent); background: color-mix(in srgb, var(--sup) 12%, transparent); border-top-width: 4px; }
.dte-elev .elv-floor-name { font: 700 .86rem/1.3 var(--font-body); color: var(--text); }
.dte-elev .elv-px { margin-left: auto; font: 800 1.35rem/1 var(--mono); }
.dte-elev .is-ceiling .elv-px { color: var(--res); } .dte-elev .is-ground .elv-px { color: var(--sup); }
.dte-elev .elv-merge { flex-basis: 100%; font: 600 .76rem/1.3 var(--font-body); color: var(--dte-dim, #a9b8cc); }
/* the shaft: a rail on the left, the car rides it; distance tags sit halfway along each gap */
.dte-elev .elv-shaft { position: relative; height: 300px; margin: 0 4px; }
.dte-elev .elv-rail { position: absolute; left: 22px; top: 0; bottom: 0; width: 6px; border-radius: 3px; background: linear-gradient(180deg, var(--res), rgba(148, 163, 184, .35) 50%, var(--sup)); opacity: .55; }
.dte-elev .elv-cable { position: absolute; left: 24px; top: 0; width: 2px; background: repeating-linear-gradient(180deg, rgba(226, 232, 240, .7) 0 4px, transparent 4px 8px); }
.dte-elev .elv-car { position: absolute; left: 0; transform: translateY(50%); display: flex; align-items: center; gap: 10px; padding: 8px 14px 8px 10px; border-radius: 14px; background: linear-gradient(135deg, #fde68a, #f59e0b); color: #1c1204; box-shadow: 0 6px 22px -6px rgba(245, 158, 11, .7); animation: elvGlide 1.2s cubic-bezier(.3, 1.25, .4, 1) both; z-index: 2; }
.dte-elev .elv-car::before { content: ""; width: 12px; height: 12px; border-radius: 50%; background: #1c1204; box-shadow: 0 0 0 3px rgba(255, 255, 255, .55); }
.dte-elev .elv-car-lbl { font: 700 .78rem/1.1 var(--font-body); }
.dte-elev .elv-car-px { font: 800 1.25rem/1 var(--mono); }
@keyframes elvGlide { from { bottom: var(--from, 50%); } }
.dte-elev .elv-mark { position: absolute; left: 14px; right: 0; transform: translateY(50%); display: flex; align-items: center; gap: 8px; font: 700 .74rem/1.2 var(--font-body); color: var(--dte-dim, #a9b8cc); }
.dte-elev .elv-mark i { width: 22px; height: 0; border-top: 2px dashed currentColor; }
.dte-elev .elv-mark.is-res { color: color-mix(in srgb, var(--res) 80%, white); } .dte-elev .elv-mark.is-sup { color: color-mix(in srgb, var(--sup) 80%, white); }
.dte-elev .elv-gap { position: absolute; right: 4px; transform: translateY(50%); padding: 3px 10px; border-radius: 999px; font: 600 .8rem/1.2 var(--font-body); background: rgba(9, 23, 45, .6); border: 1px solid; }
.dte-elev .elv-gap.is-up { color: var(--res); border-color: color-mix(in srgb, var(--res) 45%, transparent); }
.dte-elev .elv-gap.is-down { color: var(--sup); border-color: color-mix(in srgb, var(--sup) 45%, transparent); }
.dte-elev .elv-gap b { font-family: var(--mono); }
/* the floor SPY is close to lights up */
.dte-elev.is-near-res .elv-floor.is-ceiling, .dte-elev.is-testing-res .elv-floor.is-ceiling { animation: elvFloorGlow 1.8s ease-in-out infinite; --glow: var(--res); }
.dte-elev.is-near-sup .elv-floor.is-ground, .dte-elev.is-testing-sup .elv-floor.is-ground { animation: elvFloorGlow 1.8s ease-in-out infinite; --glow: var(--sup); }
@keyframes elvFloorGlow { 50% { box-shadow: 0 0 22px -4px var(--glow); } }
html[data-motion=paused] .dte-elev *, html[data-motion=paused] .dte-elev .elv-floor { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .dte-elev *, .dte-elev .elv-floor { animation: none !important; } }
@media (max-width: 760px) { .dte-elev .elv-shaft { height: 240px; } .dte-elev .elv-px { font-size: 1.15rem; } }
/* daylight */
html[data-theme="light"] #main .hcd-price-tower.dte-elev { --res: #15803d; --sup: #be123c; background: linear-gradient(180deg, #ecfdf5, #ffffff 30%, #ffffff 70%, #fff1f3) !important; border-color: rgba(20, 47, 73, .14) !important; }
html[data-theme="light"] .dte-elev .elv-status { color: #6b3f00; background: #fdecc0; border-color: #e7b84a; }
html[data-theme="light"] .dte-elev .elv-gap { background: #ffffff; }
html[data-theme="light"] .dte-elev .elv-cable { background: repeating-linear-gradient(180deg, rgba(20, 47, 73, .45) 0 4px, transparent 4px 8px); }
html[data-theme="light"] .dte-elev .elv-mark.is-res { color: #166534; } html[data-theme="light"] .dte-elev .elv-mark.is-sup { color: #9f1239; }

/* GEX skyline: buildings rise once on first paint (not on every 3 s refresh), skipped strikes = slim divider, legend under the chart */
.gex-bars.is-first-paint .gb .gb-bar-fill { animation: gbRise .9s cubic-bezier(.25, 1.2, .4, 1) both; animation-delay: calc(var(--i, 0) * 45ms); transform-origin: bottom; }
.gex-bars.is-first-paint .gb .gb-v { animation: gbPop .5s ease-out both; animation-delay: calc(var(--i, 0) * 45ms + .55s); }
@keyframes gbRise { from { transform: scaleY(0); } }
@keyframes gbPop { from { opacity: 0; translate: 0 6px; } }
body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-axis-gap { flex: 0 0 14px !important; width: 14px !important; min-width: 14px !important; padding: 0 !important; background: none !important; border: 0 !important; border-left: 1px dashed rgba(148, 163, 184, .35) !important; border-right: 1px dashed rgba(148, 163, 184, .35) !important; border-radius: 0 !important; }
body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-axis-gap small { display: none !important; }
body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-axis-gap .gag-dots { font-size: .8rem; opacity: .7; }
#main .gex-under-legend { margin-top: 10px !important; }
#main .gex-under-legend .gul-chip.is-zg { color: #fcd34d; }
html[data-theme="light"] #main .gex-under-legend .gul-chip.is-zg { color: #6b3f00; }
html[data-theme="light"] body:not(#akx):not(#aky) .gex-bars.is-skyline-chart .gb-axis-gap { border-color: rgba(20, 47, 73, .25) !important; }
html[data-motion=paused] .gex-bars .gb-bar-fill, html[data-motion=paused] .gex-bars .gb-v { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .gex-bars .gb-bar-fill, .gex-bars .gb-v { animation: none !important; } }
/* distances live on the floor cards (a floating tag collided with the car on phones) */
.dte-elev .elv-floor .elv-gap { position: static; transform: none; order: 0; flex-basis: auto; width: max-content; margin-top: 0; }
.dte-elev .elv-floor .elv-merge { order: 4; }
.dte-elev .elv-shaft { height: 220px; }
@media (max-width: 760px) { .dte-elev .elv-shaft { height: 180px; } }
.dte-elev .elv-floor { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 6px; }
.dte-elev .elv-floor .elv-floor-name { grid-column: 1; grid-row: 1; }
.dte-elev .elv-floor .elv-px { grid-column: 2; grid-row: 1 / span 2; margin: 0; }
.dte-elev .elv-floor .elv-gap { grid-column: 1; grid-row: 2; flex-basis: auto; width: fit-content; margin: 0; }
.dte-elev .elv-floor .elv-merge { grid-column: 1 / -1; grid-row: 3; }
.dte-elev .elv-shaft { flex: 1 1 auto; min-height: 200px; height: auto; }
@media (max-width: 760px) { .dte-elev .elv-shaft { min-height: 170px; height: 170px; flex: none; } }
/* phones: the verdict (now stamped with its session) gets its own row above the two fighters instead of sitting on top of them */
@media (max-width: 760px) {
  body:not(#akx) #main:not(#aky) .spy-clash-arena .tug-head.sca-fighters { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px 10px !important; }
  body:not(#akx) #main:not(#aky) .spy-clash-arena .sca-center-badge { grid-column: 1 / -1 !important; order: -1; position: static !important; transform: none !important; width: auto !important; max-width: none !important; }
  body:not(#akx) #main:not(#aky) .spy-clash-arena :is(.sca-verdict, .sca-vs-tag) { white-space: normal !important; position: static !important; transform: none !important; }
}
@media (max-width: 760px) {
  body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb .gb-role { font-size: .6rem !important; padding: 2px 5px !important; max-width: calc(100% - 4px) !important; white-space: nowrap !important; overflow: hidden !important; letter-spacing: -.01em; }
}
@media (max-width: 760px) {
  body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb .gb-role { white-space: normal !important; overflow: visible !important; text-align: center; line-height: 1.15 !important; font-size: .62rem !important; }
}
.dte-elev .elv-floor .elv-gap { white-space: nowrap; font-size: .76rem; }

/* v143 lift: pressure from both sides, live struggle, contact sparks (Audi 2026-10-25: "ทำให้มันมีanimation แรงผลักจาก2ฝั่งเหมือนเดิมหน่อย แต่ทำให้สวยกว่า") */
.dte-elev .elv-shaft { border-radius: 14px; background: linear-gradient(90deg, rgba(148, 163, 184, .06), rgba(148, 163, 184, .02) 40%, transparent); overflow: hidden; }
.dte-elev .elv-field { position: absolute; left: 40px; right: 10px; display: block; pointer-events: none; overflow: hidden; }
.dte-elev .elv-field.is-down { top: 0; background: linear-gradient(180deg, color-mix(in srgb, var(--res) calc(var(--res-k) * 30%), transparent), transparent); }
.dte-elev .elv-field.is-up { bottom: 0; background: linear-gradient(0deg, color-mix(in srgb, var(--sup) calc(var(--sup-k) * 30%), transparent), transparent); }
.dte-elev .elv-field i { position: absolute; left: 50%; width: 38px; height: 14px; margin-left: -19px; opacity: 0; }
.dte-elev .elv-field.is-down i { top: 0; background: var(--res); clip-path: polygon(0 0, 50% 55%, 100% 0, 100% 42%, 50% 100%, 0 42%); animation: elvPushDownPct calc(2.6s - var(--res-k) * 1.2s) linear infinite; }
.dte-elev .elv-field.is-up i { bottom: 0; background: var(--sup); clip-path: polygon(0 58%, 50% 0, 100% 58%, 100% 100%, 50% 45%, 0 100%); animation: elvPushUpPct calc(2.6s - var(--sup-k) * 1.2s) linear infinite; }
.dte-elev .elv-field i:nth-child(2) { animation-delay: -.8s; } .dte-elev .elv-field i:nth-child(3) { animation-delay: -1.6s; }
@keyframes elvPushDownPct { 0% { top: 0; opacity: 0; } 25% { opacity: calc(.35 + var(--res-k) * .6); } 100% { top: calc(100% - 14px); opacity: 0; } }
@keyframes elvPushUpPct { 0% { bottom: 0; opacity: 0; } 25% { opacity: calc(.35 + var(--sup-k) * .6); } 100% { bottom: calc(100% - 14px); opacity: 0; } }
/* $1 ruler along the right edge */
.dte-elev .elv-tick { position: absolute; right: 8px; transform: translateY(50%); font: 600 .66rem/1 var(--mono); color: var(--dte-dim, #a9b8cc); opacity: .8; }
.dte-elev .elv-tick::before { content: ""; display: inline-block; width: 8px; height: 1px; margin-right: 4px; vertical-align: middle; background: currentColor; opacity: .6; }
/* live market: the car is being shoved from both sides (closed market: it rests) */
.dte-elev.is-live .elv-car { animation: elvGlide 1.2s cubic-bezier(.3, 1.25, .4, 1) both, elvStruggle 1.4s ease-in-out 1.2s infinite; }
@keyframes elvStruggle { 0%, 100% { translate: 0 0; } 25% { translate: 0 -3px; rotate: -.6deg; } 55% { translate: 0 2px; rotate: .5deg; } 80% { translate: 0 -1px; } }
.dte-elev.is-live.is-near-res .elv-car, .dte-elev.is-live.is-near-sup .elv-car { animation-duration: 1.2s, .7s; }
/* touching a level (within $0.30): that floor shakes and throws sparks */
.dte-elev.is-testing-res .elv-floor.is-ceiling, .dte-elev.is-testing-sup .elv-floor.is-ground { animation: elvFloorGlow 1.8s ease-in-out infinite, elvShake .35s ease-in-out infinite; }
@keyframes elvShake { 25% { translate: -1.5px 0; } 75% { translate: 1.5px 0; } }
.dte-elev.is-testing-res .elv-floor.is-ceiling::after, .dte-elev.is-testing-sup .elv-floor.is-ground::after { content: "✦ ✧ ✦"; position: absolute; left: 22px; font-size: .8rem; letter-spacing: .3em; color: #fde68a; animation: elvSpark .6s ease-out infinite; }
.dte-elev.is-testing-res .elv-floor.is-ceiling::after { bottom: -16px; } .dte-elev.is-testing-sup .elv-floor.is-ground::after { top: -16px; }
@keyframes elvSpark { from { opacity: 1; scale: .7; } to { opacity: 0; scale: 1.4; } }
html[data-motion=paused] .dte-elev .elv-field i, html[data-motion=paused] .dte-elev .elv-floor::after { animation: none !important; opacity: .5; }
@media (prefers-reduced-motion: reduce) { .dte-elev .elv-field i, .dte-elev .elv-floor::after { animation: none !important; opacity: .5; } }
html[data-theme="light"] .dte-elev .elv-tick { color: #3d546c; }
.dte-elev .elv-field { right: 56px !important; }

/* ===== v146 ข่าวตลาด: 🌬️ news wind (replaces the 3-box shock radar; Audi 2026-10-25 "มันกล่องในกล่องอ่ะ") ===== */
#main .news-wind { --bull: #34d399; --bear: #fb7185; position: relative; margin: 14px 0 18px; padding: 18px 20px 16px; border-radius: 20px; background: radial-gradient(120% 140% at 0% 0%, rgba(251, 113, 133, .10), transparent 55%), radial-gradient(120% 140% at 100% 0%, rgba(52, 211, 153, .10), transparent 55%), rgba(9, 23, 45, .55); border: 1px solid rgba(148, 163, 184, .18); }
.news-wind .nw-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; }
.news-wind .nw-title { margin: 0; font: 800 1.2rem/1.2 var(--font-head); color: var(--text); }
.news-wind .nw-vs { font: 700 .9rem/1.3 var(--font-body); }
.news-wind.is-bull .nw-vs { color: var(--bull); } .news-wind.is-bear .nw-vs { color: var(--bear); } .news-wind.is-calm .nw-vs { color: #fcd34d; }
.news-wind .nw-gauge { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; margin: 16px 0 8px; }
.news-wind .nw-end { font: 700 .82rem/1 var(--font-body); white-space: nowrap; }
.news-wind .nw-end.is-bear { color: var(--bear); } .news-wind .nw-end.is-bull { color: var(--bull); }
.news-wind .nw-track { position: relative; height: 26px; border-radius: 999px; background: linear-gradient(90deg, rgba(244, 63, 94, .55), rgba(148, 163, 184, .18) 50%, rgba(16, 185, 129, .55)); overflow: visible; }
.news-wind .nw-streaks { position: absolute; inset: 4px 10px; overflow: hidden; border-radius: 999px; }
.news-wind .nw-streaks i { position: absolute; top: 50%; width: 46px; height: 2px; border-radius: 2px; background: rgba(255, 255, 255, .7); opacity: 0; }
.news-wind .nw-streaks i:nth-child(1) { margin-top: -6px; animation-delay: 0s; } .news-wind .nw-streaks i:nth-child(2) { margin-top: 3px; animation-delay: .5s; }
.news-wind .nw-streaks i:nth-child(3) { margin-top: -1px; animation-delay: 1s; } .news-wind .nw-streaks i:nth-child(4) { margin-top: 6px; animation-delay: 1.5s; }
.news-wind .nw-streaks i:nth-child(5) { margin-top: -4px; animation-delay: 2s; }
.news-wind.is-bull .nw-streaks i { animation: nwBlowRight 2.4s linear infinite; }
.news-wind.is-bear .nw-streaks i { animation: nwBlowLeft 2.4s linear infinite; }
.news-wind.is-calm .nw-streaks i { animation: nwDrift 4s ease-in-out infinite; }
@keyframes nwBlowRight { 0% { left: -12%; opacity: 0; } 20% { opacity: .85; } 100% { left: 100%; opacity: 0; } }
@keyframes nwBlowLeft { 0% { left: 100%; opacity: 0; } 20% { opacity: .85; } 100% { left: -12%; opacity: 0; } }
@keyframes nwDrift { 0%, 100% { left: 40%; opacity: 0; } 50% { left: 52%; opacity: .5; } }
.news-wind .nw-needle { position: absolute; top: -10px; bottom: -10px; width: 6px; margin-left: -3px; border-radius: 3px; background: #f8fafc; box-shadow: 0 0 14px rgba(255, 255, 255, .55); transition: left .9s cubic-bezier(.3, 1.3, .4, 1); }
.news-wind .nw-needle::after { content: ""; position: absolute; top: -2px; left: 6px; width: 18px; height: 12px; background: #f8fafc; clip-path: polygon(0 0, 100% 50%, 0 100%); }
.news-wind.is-bear .nw-needle::after { left: auto; right: 6px; clip-path: polygon(100% 0, 0 50%, 100% 100%); }
.news-wind.is-bull .nw-needle, .news-wind.is-bull .nw-needle::after { background: var(--bull); box-shadow: 0 0 16px var(--bull); }
.news-wind.is-bear .nw-needle, .news-wind.is-bear .nw-needle::after { background: var(--bear); box-shadow: 0 0 16px var(--bear); }
.news-wind .nw-counts { margin: 4px 0 12px; font: 600 .9rem/1.4 var(--font-body); color: var(--text); }
.news-wind .nw-counts small { color: var(--dte-dim, #a9b8cc); margin-left: 6px; }
.news-wind .nw-alert { padding-top: 12px; border-top: 1px dashed rgba(148, 163, 184, .25); }
.news-wind .nw-alert-title { margin: 0 0 8px; font: 800 .98rem/1.2 var(--font-head); color: #fcd34d; }
.news-wind .nw-none { margin: 0; font: 600 .9rem/1.4 var(--font-body); color: var(--text); }
.news-wind .nw-against { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.news-wind .nw-against li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; padding: 8px 12px; border-radius: 12px; background: rgba(245, 158, 11, .08); border-left: 3px solid #f59e0b; }
.news-wind .nw-against a { color: var(--text); font-weight: 700; text-decoration: none; } .news-wind .nw-against a:hover { text-decoration: underline; }
.news-wind .nw-against small, .news-wind .nw-newest small { color: var(--dte-dim, #a9b8cc); }
.news-wind .nw-newest { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin: 12px 0 0; font: 600 .88rem/1.4 var(--font-body); color: var(--text); }
.news-wind .nw-newest-k { font-weight: 800; color: #93c5fd; }
html[data-motion=paused] .news-wind .nw-streaks i { animation: none !important; opacity: .35; left: 45%; }
@media (prefers-reduced-motion: reduce) { .news-wind .nw-streaks i { animation: none !important; opacity: .35; left: 45%; } .news-wind .nw-needle { transition: none; } }
@media (max-width: 760px) { .news-wind .nw-gauge { grid-template-columns: 1fr 1fr; } .news-wind .nw-track { grid-column: 1 / -1; grid-row: 1; } .news-wind .nw-end.is-bull { text-align: right; } }
html[data-theme="light"] #main .news-wind { --bull: #15803d; --bear: #be123c; background: radial-gradient(120% 140% at 0% 0%, #ffe4e8, transparent 55%), radial-gradient(120% 140% at 100% 0%, #dcfce7, transparent 55%), #ffffff; border-color: rgba(20, 47, 73, .14); }
html[data-theme="light"] .news-wind.is-calm .nw-vs, html[data-theme="light"] .news-wind .nw-alert-title { color: #6b3f00; }
html[data-theme="light"] .news-wind .nw-newest-k { color: #075985; }
html[data-theme="light"] .news-wind .nw-against li { background: #fff7e0; }
html[data-theme="light"] .news-wind .nw-needle, html[data-theme="light"] .news-wind .nw-needle::after { background: #142f49; }
.dte-h-sub { margin-left: 8px; font: 600 .8rem/1 var(--font-body); color: var(--dte-dim, #a9b8cc); }
/* daylight ink for the news filter counts and the wind counts (contrast_pixels: 3.5–4.5:1, 2.2:1 for the grey "เหวี่ยง") */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-filter-group[data-g="gold"] .aku-ftab .cnt { color: #5c3d03 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-filter-group[data-g="blue"] .aku-ftab .cnt { color: #0c4a6e !important; }
html[data-theme="light"] .news-wind .nw-counts .up { color: #166534 !important; }
html[data-theme="light"] .news-wind .nw-counts .down { color: #9f1239 !important; }
html[data-theme="light"] .news-wind .nw-counts .flat { color: #3d546c !important; }
.news-wind .nw-counts .flat { color: #cbd5e1; }
/* phones: Fear & Greed gauge on top, its history row full width under it (was squeezed to 70px beside the gauge) */
@media (max-width: 760px) {
  body:not(#akx) #main:not(#aky) .fg-visual-split { display: grid !important; grid-template-columns: 1fr !important; gap: 12px !important; }
  body:not(#akx) #main:not(#aky) .fg-visual-split > * { width: auto !important; min-width: 0 !important; max-width: none !important; }
  body:not(#akx) #main:not(#aky) .fg-hist-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; width: 100% !important; }
}

/* ===== v148 ปฏิทินข่าว card: hierarchy instead of a pile of pills (Audi 2026-10-25: "มันดูเป็นtagกล่องสี่เหลี่ยมหรือกล่องมนกระจุกตัวกัน") ===== */
body:not(#akx) #main:not(#aky) .ev-card .ev-info { display: grid; gap: 6px; align-content: start; }
body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill { display: inline-flex; align-items: center; gap: 8px; padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important; font: 800 .78rem/1.2 var(--font-body) !important; letter-spacing: .02em; color: #fcd34d !important; }
body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill.is-urgent { color: #fda4af !important; }
body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill.is-nearday { color: #fdba74 !important; }
body:not(#akx) #main:not(#aky) .ev-card .ev-title-row { display: flex; align-items: baseline; justify-content: space-between; gap: 6px 12px; flex-wrap: wrap; }
body:not(#akx) #main:not(#aky) .ev-card .ev-name { font: 800 1.08rem/1.35 var(--font-head) !important; color: var(--text) !important; }
body:not(#akx) #main:not(#aky) .ev-card .ev-title-row .chip { flex: none; padding: 3px 10px !important; font: 700 .76rem/1.2 var(--font-body) !important; }
body:not(#akx) #main:not(#aky) .ev-card .ev-meta-line { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 0; margin: 0; font: 600 .84rem/1.5 var(--font-body); color: var(--dte-dim, #a9b8cc); }
body:not(#akx) #main:not(#aky) .ev-card .ev-meta-t + .ev-meta-t::before { content: "·"; margin: 0 8px; opacity: .6; }
body:not(#akx) #main:not(#aky) .ev-card .ev-meta-t.is-intraday-warn { color: #fda4af; font-weight: 700; }
body:not(#akx) #main:not(#aky) .ev-card .ev-meta-t.is-preopen-tag { color: #fdba74; }
body:not(#akx) #main:not(#aky) .ev-card .ev-foot { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; padding-top: 6px; border-top: 1px dashed rgba(148, 163, 184, .22); }
body:not(#akx) #main:not(#aky) .ev-card .ev-prev-k { font: 600 .84rem/1.3 var(--font-body); color: var(--dte-dim, #a9b8cc); }
body:not(#akx) #main:not(#aky) .ev-card .ev-prev-k b { margin-left: 4px; font: 800 1rem/1 var(--mono); color: var(--text); }
body:not(#akx) #main:not(#aky) .ev-card .ev-src-link { font: 600 .82rem/1.3 var(--font-body); color: #93c5fd; text-decoration: none; border-bottom: 1px solid rgba(147, 197, 253, .35); }
body:not(#akx) #main:not(#aky) .ev-card .ev-src-link:hover { border-bottom-color: currentColor; }
body:not(#akx) #main:not(#aky) .ev-card .ev-note-line { font: 500 .82rem/1.5 var(--font-body); color: var(--dte-dim, #a9b8cc); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill { color: #6b3f00 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill.is-urgent { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill.is-nearday { color: #7c2d12 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .ev-meta-t.is-intraday-warn { color: #9f1239; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .ev-meta-t.is-preopen-tag { color: #7c2d12; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .ev-src-link { color: #075985; border-bottom-color: rgba(7, 89, 133, .35); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .ev-foot { border-top-color: rgba(20, 47, 73, .18); }

/* ===== v148 ลมข่าว: windsock + flying news pages ===== */
.news-wind .nw-track { height: 30px; }
.news-wind .nw-needle { width: 4px; margin-left: -2px; top: -34px; bottom: -6px; background: linear-gradient(#e2e8f0, #94a3b8) !important; box-shadow: none !important; transition: left 1.1s cubic-bezier(.3, 1.3, .4, 1); }
.news-wind .nw-needle::after { display: none !important; }
.news-wind .nw-needle::before { content: ""; position: absolute; top: -5px; left: -4px; width: 12px; height: 12px; border-radius: 50%; background: #f8fafc; box-shadow: 0 0 10px rgba(255, 255, 255, .6); }
.news-wind .nw-sock { position: absolute; top: 0; left: 4px; height: 20px; width: calc(var(--sock, .5) * 92px); transform-origin: 0 50%; clip-path: polygon(0 0, 100% 22%, 100% 78%, 0 100%); background: repeating-linear-gradient(90deg, var(--sock-a, #f97316) 0 18%, #f8fafc 18% 36%); filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .35)); animation: nwSockFlutter 1.1s ease-in-out infinite; }
.news-wind.is-bull .nw-sock { --sock-a: #10b981; }
.news-wind.is-bear .nw-sock { --sock-a: #f43f5e; left: auto; right: 4px; transform-origin: 100% 50%; clip-path: polygon(0 22%, 100% 0, 100% 100%, 0 78%); background: repeating-linear-gradient(270deg, var(--sock-a) 0 18%, #f8fafc 18% 36%); }
.news-wind.is-calm .nw-sock { --sock-a: #f59e0b; rotate: 72deg; animation: nwSockSway 3.2s ease-in-out infinite; }
@keyframes nwSockFlutter { 0%, 100% { scale: 1 1; skew: 0deg 0deg; } 30% { scale: .94 1.06; skew: 0deg 3deg; } 65% { scale: 1.02 .95; skew: 0deg -2deg; } }
@keyframes nwSockSway { 0%, 100% { rotate: 72deg; } 50% { rotate: 62deg; } }
/* news pages carried by the wind (direction = the side the news favours) */
.news-wind .nw-pages { position: absolute; inset: -14px 0; pointer-events: none; overflow: hidden; }
.news-wind .nw-pages em { position: absolute; top: 40%; width: 11px; height: 14px; border-radius: 2px; background: linear-gradient(#fff 0 22%, #cbd5e1 22% 30%, #fff 30% 46%, #cbd5e1 46% 54%, #fff 54% 70%, #cbd5e1 70% 78%, #fff 78%); opacity: 0; box-shadow: 0 2px 4px rgba(0, 0, 0, .3); }
.news-wind .nw-pages em:nth-child(2) { top: 10%; animation-delay: 1.1s !important; } .news-wind .nw-pages em:nth-child(3) { top: 62%; animation-delay: 2.2s !important; }
.news-wind.is-bull .nw-pages em { animation: nwPageRight 3.3s ease-in infinite; }
.news-wind.is-bear .nw-pages em { animation: nwPageLeft 3.3s ease-in infinite; }
.news-wind.is-calm .nw-pages em { display: none; }
@keyframes nwPageRight { 0% { left: -4%; opacity: 0; rotate: 0deg; } 15% { opacity: .95; } 60% { translate: 0 -8px; } 100% { left: 102%; opacity: 0; rotate: 300deg; } }
@keyframes nwPageLeft { 0% { left: 102%; opacity: 0; rotate: 0deg; } 15% { opacity: .95; } 60% { translate: 0 -8px; } 100% { left: -4%; opacity: 0; rotate: -300deg; } }
.news-wind .nw-gauge { margin-top: 30px; }
html[data-motion=paused] .news-wind .nw-sock, html[data-motion=paused] .news-wind .nw-pages em { animation: none !important; }
html[data-motion=paused] .news-wind .nw-pages em { display: none; }
@media (prefers-reduced-motion: reduce) { .news-wind .nw-sock, .news-wind .nw-pages em { animation: none !important; } .news-wind .nw-pages em { display: none; } }
html[data-theme="light"] .news-wind .nw-needle { background: linear-gradient(#64748b, #334155) !important; }
html[data-theme="light"] .news-wind .nw-needle::before { background: #334155; box-shadow: none; }
html[data-theme="light"] .news-wind .nw-pages em { box-shadow: 0 1px 3px rgba(20, 47, 73, .35); }
.news-wind .nw-gauge { margin-top: 46px; }
.news-wind .nw-sock { height: 24px; width: calc(var(--sock, .5) * 110px); }
html[data-theme="light"] .news-wind .nw-sock { filter: drop-shadow(0 0 .8px #334155) drop-shadow(0 0 .8px #334155) drop-shadow(0 3px 5px rgba(20, 47, 73, .3)); }
html[data-theme="light"] .news-wind .nw-sock { filter: none; }
html[data-theme="light"] .news-wind .nw-needle { filter: drop-shadow(0 0 .7px #1e293b) drop-shadow(0 0 .7px #1e293b) drop-shadow(0 2px 4px rgba(20, 47, 73, .3)); }
body:not(#akx) #main:not(#aky) .ev-card .ev-title-row { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
body:not(#akx) #main:not(#aky) .ev-card .ev-title-row .chip { justify-self: end; margin-top: 2px; }
body:not(#akx) #main:not(#aky) .ev-card .ev-meta-line { gap: 2px 16px; }
body:not(#akx) #main:not(#aky) .ev-card .ev-meta-t + .ev-meta-t::before { content: none; }

/* ===== v152 ปฏิทินข่าว: priority = importance × closeness ===== */
/* A · the next big release (or one landing this session): full width, bigger, glowing edge */
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a { grid-column: 1 / -1 !important; padding: 20px 22px !important; border: 2px solid rgba(251, 191, 36, .65) !important; background: radial-gradient(90% 140% at 0% 0%, rgba(251, 191, 36, .16), transparent 60%), rgba(15, 23, 42, .72) !important; box-shadow: 0 0 0 1px rgba(251, 191, 36, .15), 0 12px 32px -14px rgba(251, 191, 36, .45) !important; animation: evTierGlow 3.2s ease-in-out infinite; }
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a.is-today { border-color: rgba(251, 113, 133, .75) !important; background: radial-gradient(90% 140% at 0% 0%, rgba(244, 63, 94, .18), transparent 60%), rgba(15, 23, 42, .72) !important; }
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a .ev-name { font-size: 1.35rem !important; }
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a .ev-title-row .chip { padding: 6px 14px !important; font-size: .92rem !important; }
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a .ev-leaf { transform: scale(1.12); }
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a .ev-prev-k b { font-size: 1.2rem; }
@keyframes evTierGlow { 50% { box-shadow: 0 0 0 1px rgba(251, 191, 36, .3), 0 14px 38px -12px rgba(251, 191, 36, .6); } }
/* B · other high-impact releases within 7 days: a red edge */
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-b { border-left: 4px solid #fb7185 !important; }
/* C · medium/low or far: quieter and compact */
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-c { padding-top: 12px !important; padding-bottom: 12px !important; opacity: .86; }
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-c .ev-name { font-size: .98rem !important; }
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-c .ev-note-line { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-c:hover { opacity: 1; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a { background: radial-gradient(90% 140% at 0% 0%, #fef3c7, transparent 60%), #ffffff !important; border-color: #e7b84a !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a.is-today { background: radial-gradient(90% 140% at 0% 0%, #ffe4e8, transparent 60%), #ffffff !important; border-color: #f4a3b4 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-b { border-left-color: #be123c !important; }
html[data-motion=paused] .ev-timeline .ev-card.tier-a { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .ev-timeline .ev-card.tier-a { animation: none !important; } }

/* ===== v154 ปฏิทินข่าว: colour = importance only, legend, result after release ===== */
/* hero edge takes the impact colour (gold no longer competes with 🟡 = สำคัญกลาง) */
body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a { border-color: rgba(251, 113, 133, .7) !important; background: radial-gradient(90% 140% at 0% 0%, rgba(244, 63, 94, .16), transparent 60%), rgba(15, 23, 42, .72) !important; box-shadow: 0 0 0 1px rgba(251, 113, 133, .15), 0 12px 32px -14px rgba(244, 63, 94, .45) !important; animation-name: evTierGlowRed; }
@keyframes evTierGlowRed { 50% { box-shadow: 0 0 0 1px rgba(251, 113, 133, .3), 0 14px 38px -12px rgba(244, 63, 94, .6); } }
body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill.is-gold { color: #fda4af !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-timeline .ev-card.tier-a { background: radial-gradient(90% 140% at 0% 0%, #ffe4e8, transparent 60%), #ffffff !important; border-color: #f4a3b4 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill.is-gold { color: #9f1239 !important; }
/* countdown chips stay neutral (only "ออกคืนนี้" is red) */
body:not(#akx) #main:not(#aky) .ev-card .ev-title-row .chip.c-sky, body:not(#akx) #main:not(#aky) .ev-card .ev-title-row .chip.c-grey, body:not(#akx) #main:not(#aky) .ev-card .ev-title-row .chip.c-gold, body:not(#akx) #main:not(#aky) .ev-card .ev-title-row .chip.c-amber { background: rgba(148, 163, 184, .14) !important; color: #e2e8f0 !important; border-color: rgba(148, 163, 184, .3) !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .ev-title-row .chip:is(.c-sky, .c-grey, .c-gold, .c-amber) { background: #e8eef5 !important; color: #26405a !important; border-color: rgba(20, 47, 73, .18) !important; }
/* legend under the calendar heading */
#main .ev-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 4px 0 12px; font: 600 .82rem/1.4 var(--font-body); color: var(--dte-dim, #a9b8cc); }
#main .ev-legend .is-high { color: #fda4af; } #main .ev-legend .is-mid { color: #fcd34d; } #main .ev-legend .is-low { color: #cbd5e1; }
html[data-theme="light"] #main .ev-legend .is-high { color: #9f1239; } html[data-theme="light"] #main .ev-legend .is-mid { color: #6b3f00; } html[data-theme="light"] #main .ev-legend .is-low { color: #3d546c; }
/* result after release: actual · last time · good/bad for stocks */
body:not(#akx) #main:not(#aky) .ev-card .ev-result { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: 8px 12px; border-radius: 12px; background: rgba(148, 163, 184, .10); border-left: 4px solid #94a3b8; }
body:not(#akx) #main:not(#aky) .ev-card .ev-result.is-good { background: rgba(16, 185, 129, .12); border-left-color: #34d399; }
body:not(#akx) #main:not(#aky) .ev-card .ev-result.is-bad { background: rgba(244, 63, 94, .12); border-left-color: #fb7185; }
.ev-result .ev-result-k { font: 800 .82rem/1 var(--font-body); color: var(--text); }
.ev-result .ev-result-v { font: 800 1.25rem/1 var(--mono); color: var(--text); }
.ev-result .ev-result-prev { font: 600 .84rem/1.3 var(--font-body); color: var(--dte-dim, #a9b8cc); }
.ev-result.is-good .ev-result-tone { color: #34d399; font-weight: 800; } .ev-result.is-bad .ev-result-tone { color: #fb7185; font-weight: 800; } .ev-result.is-flat .ev-result-tone { color: #cbd5e1; font-weight: 700; }
.ev-result .ev-result-why, .ev-result .ev-result-basis { flex-basis: 100%; font: 500 .78rem/1.4 var(--font-body); color: var(--dte-dim, #a9b8cc); }
html[data-theme="light"] .ev-result.is-good .ev-result-tone { color: #166534; } html[data-theme="light"] .ev-result.is-bad .ev-result-tone { color: #9f1239; } html[data-theme="light"] .ev-result.is-flat .ev-result-tone { color: #3d546c; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .ev-result.is-good { background: #ecfdf5; } html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .ev-result.is-bad { background: #fff1f3; }
/* time is not importance: "ออกอีก N วัน" kicker and the total-count chip are neutral (yellow = สำคัญกลาง only) */
body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill.is-nearday { color: #bfdbfe !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-card .log-spotlight-pill.is-nearday { color: #075985 !important; }
body:not(#akx) #main:not(#aky) .ev-sec-badges .chip:not(.c-red) { background: rgba(148, 163, 184, .14) !important; color: #e2e8f0 !important; border-color: rgba(148, 163, 184, .3) !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ev-sec-badges .chip:not(.c-red) { background: #e8eef5 !important; color: #26405a !important; border-color: rgba(20, 47, 73, .18) !important; }

/* ===== v157 📍 วันนี้ (today first — consensus + actual as releases land) ===== */
#main .cal-today { margin: 6px 0 14px; padding: 14px 16px; border-radius: 16px; background: linear-gradient(135deg, rgba(56, 189, 248, .10), rgba(9, 23, 45, .55)); border: 1px solid rgba(56, 189, 248, .35); }
#main .cal-today .ct-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 8px; }
#main .cal-today .ct-head b { font: 800 1.02rem/1.2 var(--font-head); color: var(--text); }
#main .cal-today .ct-head span { font: 700 .86rem/1.2 var(--font-body); color: #bfdbfe; }
#main .cal-today .ct-head small { margin-left: auto; font: 500 .74rem/1.2 var(--font-body); color: var(--dte-dim, #a9b8cc); }
#main .cal-today .ct-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
#main .cal-today .ct-row { display: grid; grid-template-columns: 52px minmax(0, 1.4fr) minmax(0, 1.6fr) auto; align-items: center; gap: 4px 12px; padding: 7px 10px; border-radius: 10px; border-left: 3px solid rgba(148, 163, 184, .35); background: rgba(148, 163, 184, .06); }
#main .cal-today .ct-row.is-out { border-left-color: #93c5fd; }
#main .cal-today .ct-row.is-out.is-good { border-left-color: #34d399; background: rgba(16, 185, 129, .08); }
#main .cal-today .ct-row.is-out.is-bad { border-left-color: #fb7185; background: rgba(244, 63, 94, .08); }
#main .cal-today .ct-row.is-due { border-left-color: #fcd34d; }
#main .cal-today .ct-time { font: 700 .86rem/1 var(--mono); color: var(--text); }
#main .cal-today .ct-name { font: 700 .88rem/1.3 var(--font-body); color: var(--text); min-width: 0; }
#main .cal-today .ct-name small { display: block; font: 500 .72rem/1.2 var(--font-body); color: var(--dte-dim, #a9b8cc); }
#main .cal-today .ct-nums { display: flex; flex-wrap: wrap; gap: 2px 12px; font: 600 .82rem/1.3 var(--font-body); color: var(--dte-dim, #a9b8cc); }
#main .cal-today .ct-act { font: 800 .9rem/1.2 var(--mono); color: var(--text); }
#main .cal-today .ct-act.is-pending { font-family: var(--font-body); font-weight: 700; color: #cbd5e1; }
#main .cal-today .ct-verdict { font: 800 .8rem/1.2 var(--font-body); white-space: nowrap; color: #e2e8f0; }
#main .cal-today .is-good .ct-verdict { color: #34d399; } #main .cal-today .is-bad .ct-verdict { color: #fb7185; }
#main .ev-card .ev-prev-k.is-cons b { color: #bfdbfe; }
@media (max-width: 760px) { #main .cal-today .ct-row { grid-template-columns: 48px minmax(0, 1fr); } #main .cal-today .ct-nums, #main .cal-today .ct-verdict { grid-column: 2; } #main .cal-today .ct-head small { margin-left: 0; } }
html[data-theme="light"] #main .cal-today { background: linear-gradient(135deg, #e0f2fe, #ffffff); border-color: rgba(7, 89, 133, .3); }
html[data-theme="light"] #main .cal-today .ct-head span { color: #075985; }
html[data-theme="light"] #main .cal-today .ct-row { background: #f8fafc; }
html[data-theme="light"] #main .cal-today .ct-verdict { color: #26405a; } html[data-theme="light"] #main .cal-today .is-good .ct-verdict { color: #166534; } html[data-theme="light"] #main .cal-today .is-bad .ct-verdict { color: #9f1239; }
html[data-theme="light"] #main .cal-today .ct-act.is-pending { color: #3d546c; }
html[data-theme="light"] #main .ev-card .ev-prev-k.is-cons b { color: #075985; }

/* ===== v159 GEX: 🛣️ ถนนราคาวันนี้ + plain reads (replaces the three boxed cards) ===== */
#main .gx-road { margin: 16px 0 8px; padding: 18px 20px; border-radius: 20px; background: radial-gradient(120% 140% at 0% 0%, rgba(244, 63, 94, .08), transparent 55%), radial-gradient(120% 140% at 100% 0%, rgba(16, 185, 129, .08), transparent 55%), rgba(9, 23, 45, .55); border: 1px solid rgba(148, 163, 184, .18); }
.gx-road .gx-road-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.gx-road .gx-road-head h4 { margin: 0; font: 800 1.2rem/1.2 var(--font-head); color: var(--text); }
.gx-road .gx-road-plan { margin-left: auto; font: 700 .86rem/1.2 var(--font-body); color: #fcd34d; }
.gx-road .gx-road-scroll { margin: 8px -4px 4px; overflow-x: auto; scrollbar-width: thin; }
.gx-road .gx-road-svg { display: block; width: 100%; min-width: 760px; height: auto; }
.gx-road-svg .gr-zone.is-wild { fill: rgba(244, 63, 94, .22); } .gx-road-svg .gr-zone.is-calm { fill: rgba(16, 185, 129, .2); }
.gx-road-svg .gr-zone-t { font: 800 13px var(--font-body); } .gx-road-svg .gr-zone-t.is-wild { fill: #fda4af; } .gx-road-svg .gr-zone-t.is-calm { fill: #6ee7b7; }
.gx-road-svg .gr-em { fill: rgba(147, 197, 253, .10); stroke: rgba(147, 197, 253, .7); stroke-width: 1.5; stroke-dasharray: 6 4; }
.gx-road-svg .gr-em-t { font: 800 13px var(--font-body); fill: #bfdbfe; }
.gx-road-svg .gr-em-br { fill: none; stroke: rgba(147, 197, 253, .7); stroke-width: 1.5; }
.gx-road-svg .gr-post rect { stroke: rgba(255, 255, 255, .7); stroke-width: 1; }
.gx-road-svg .gr-post.is-put rect { fill: #fb7185; } .gx-road-svg .gr-post.is-call rect { fill: #34d399; }
.gx-road-svg .gr-post:not(.is-main) rect { opacity: .55; }
.gx-road-svg .gr-lab { font: 800 14px var(--font-body); fill: #f1f5f9; } .gx-road-svg .gr-post:not(.is-main) .gr-lab { font-size: 12px; font-weight: 700; fill: #cbd5e1; }
.gx-road-svg .gr-sub { font: 700 12px var(--mono); fill: #cbd5e1; }
.gx-road-svg .gr-post.is-put .gr-sub { fill: #fda4af; } .gx-road-svg .gr-post.is-call .gr-sub { fill: #6ee7b7; }
.gx-road-svg .gr-zg { stroke: #fcd34d; stroke-width: 2.5; stroke-dasharray: 6 4; } .gx-road-svg .gr-zg-t { font: 800 13px var(--font-body); fill: #fde68a; }
.gx-road-svg .gr-pain path { fill: #c084fc; } .gx-road-svg .gr-pain text { font: 700 12px var(--font-body); fill: #e9d5ff; }
.gx-road-svg .gr-flow { fill: none; stroke-width: 4; stroke-linecap: round; stroke-dasharray: 10 8; animation: grFlow 1.1s linear infinite; }
.gx-road-svg .gr-flow.is-up { stroke: #34d399; marker-end: url(#grHeadUp); } .gx-road-svg .gr-flow.is-down { stroke: #fb7185; marker-end: url(#grHeadDown); }
.gx-road-svg .gr-head.is-up { fill: #34d399; } .gx-road-svg .gr-head.is-down { fill: #fb7185; }
@keyframes grFlow { to { stroke-dashoffset: -36; } }
.gx-road-svg .gr-flow-t { font: 800 12px var(--font-body); } .gx-road-svg .gr-flow-t.is-up { fill: #a7f3d0; } .gx-road-svg .gr-flow-t.is-down { fill: #fecdd3; }
.gx-road-svg .gr-car-dot { fill: #38bdf8; stroke: #fff; stroke-width: 3; }
.gx-road-svg .gr-car-glow { fill: rgba(56, 189, 248, .25); transform-box: fill-box; transform-origin: center; animation: grGlow 2s ease-in-out infinite; }
@keyframes grGlow { 50% { transform: scale(1.35); opacity: .4; } }
.gx-road-svg .gr-car-t { font: 800 14px var(--mono); fill: #e0f2fe; }
.gx-road .gx-tug-line { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 6px 12px; margin: 8px 0 12px; }
.gx-road .gtl-k { font: 700 .84rem/1.2 var(--font-body); white-space: nowrap; } .gx-road .gtl-k.is-call { color: #6ee7b7; } .gx-road .gtl-k.is-put { color: #fda4af; }
.gx-road .gtl-bar { display: flex; height: 12px; border-radius: 999px; overflow: hidden; background: rgba(148, 163, 184, .2); }
.gx-road .gtl-verdict { grid-column: 1 / -1; font: 800 .9rem/1.3 var(--font-body); color: #fde68a; }
.gx-road .gx-reads { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
.gx-road .gx-read { display: flex; gap: 10px; align-items: flex-start; padding: 8px 12px; border-left: 3px solid rgba(148, 163, 184, .45); }
.gx-road .gx-read.is-good { border-left-color: #34d399; } .gx-road .gx-read.is-bad { border-left-color: #fb7185; } .gx-road .gx-read.is-warn { border-left-color: #fcd34d; }
.gx-road .gxr-ic { font-size: 1.1rem; line-height: 1.3; }
.gx-road .gx-read b { display: block; font: 700 .9rem/1.35 var(--font-body); color: var(--text); }
.gx-road .gx-read small { display: block; margin-top: 2px; font: 500 .8rem/1.45 var(--font-body); color: var(--dte-dim, #a9b8cc); }
@media (max-width: 760px) { .gx-road .gx-reads { grid-template-columns: 1fr; } .gx-road .gx-road-plan { margin-left: 0; } .gx-road .gx-tug-line { grid-template-columns: 1fr; } .gx-road .gtl-k.is-put { text-align: right; } }
html[data-motion=paused] .gx-road-svg .gr-flow, html[data-motion=paused] .gx-road-svg .gr-car-glow { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .gx-road-svg .gr-flow, .gx-road-svg .gr-car-glow { animation: none !important; } }
html[data-theme="light"] #main .gx-road { background: radial-gradient(120% 140% at 0% 0%, #ffe4e8, transparent 55%), radial-gradient(120% 140% at 100% 0%, #dcfce7, transparent 55%), #ffffff; border-color: rgba(20, 47, 73, .14); }
html[data-theme="light"] .gx-road-svg .gr-zone.is-wild { fill: rgba(244, 63, 94, .16); } html[data-theme="light"] .gx-road-svg .gr-zone.is-calm { fill: rgba(16, 185, 129, .16); }
html[data-theme="light"] .gx-road-svg .gr-zone-t.is-wild, html[data-theme="light"] .gx-road-svg .gr-post.is-put .gr-sub, html[data-theme="light"] .gx-road-svg .gr-flow-t.is-down { fill: #9f1239; }
html[data-theme="light"] .gx-road-svg .gr-zone-t.is-calm, html[data-theme="light"] .gx-road-svg .gr-post.is-call .gr-sub, html[data-theme="light"] .gx-road-svg .gr-flow-t.is-up { fill: #166534; }
html[data-theme="light"] .gx-road-svg .gr-em-t { fill: #075985; } html[data-theme="light"] .gx-road-svg .gr-em, html[data-theme="light"] .gx-road-svg .gr-em-br { stroke: #0369a1; }
html[data-theme="light"] .gx-road-svg .gr-lab, html[data-theme="light"] .gx-road-svg .gr-car-t { fill: #142f49; }
html[data-theme="light"] .gx-road-svg .gr-post:not(.is-main) .gr-lab, html[data-theme="light"] .gx-road-svg .gr-sub { fill: #3d546c; }
html[data-theme="light"] .gx-road-svg .gr-zg-t { fill: #6b3f00; } html[data-theme="light"] .gx-road-svg .gr-zg { stroke: #b45309; }
html[data-theme="light"] .gx-road-svg .gr-pain text { fill: #5b21b6; } html[data-theme="light"] .gx-road-svg .gr-post rect { stroke: rgba(20, 47, 73, .5); }
html[data-theme="light"] .gx-road .gtl-k.is-call { color: #166534; } html[data-theme="light"] .gx-road .gtl-k.is-put { color: #9f1239; }
html[data-theme="light"] .gx-road .gtl-verdict, html[data-theme="light"] .gx-road .gx-road-plan { color: #6b3f00; }
.gx-road-svg .gr-post:not(.is-main) .gr-sub { font-family: var(--font-body); font-weight: 600; }
/* phones: the strike column was squeezed to 23px under its value pill — give it room and stack its tags under the price */
@media (max-width: 760px) {
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-h, body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r { grid-template-columns: 76px minmax(0, 1fr) 64px 64px !important; }
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r .k, body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r > span.k { grid-template-columns: 1fr !important; gap: 2px !important; }
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r .k-tags { flex-wrap: wrap; }
}
@media (max-width: 760px) {
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-h, body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r { grid-template-columns: 66px minmax(0, 1fr) 58px 62px !important; gap: 0 6px !important; }
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r .v-pill { display: inline-flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 0 !important; padding: 3px 7px !important; max-width: 100%; }
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r .v-pill b { font-size: .8rem !important; white-space: nowrap; }
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r .v-pill .gw-cell { font-size: .66rem !important; padding: 0 !important; background: none !important; }
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r > span:not(.k):not(.v) { font-size: .76rem !important; white-space: nowrap; }
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r .k b { font-size: .9rem !important; }
}
@media (max-width: 760px) {
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-h, body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r { grid-template-columns: 60px minmax(0, 1fr) 54px 68px !important; }
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r > span:not(.k):not(.v) { font-size: .72rem !important; }
  body:not(#akx) #main:not(#aky) #panel-gex .gx-heat-r .k-tag { font-size: .56rem !important; padding: 1px 4px !important; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
  body:not(#akx) #main:not(#aky) .ex-subhead .ex-sh-badge { white-space: normal !important; max-width: 100%; }
}
body:not(#akx) #main:not(#aky) #panel-gex .k-tag.is-conf-heavy { color: #1c1204 !important; text-shadow: none !important; }
body:not(#akx) #main:not(#aky) #panel-gex .k-tag.is-conf-heavy { background: #fbbf24 !important; background-image: none !important; border-color: #f59e0b !important; }
/* Top-8 concentration cards: own daylight ink, so the 15 s GEX redraw never flashes dark-theme text on white before the shell light adapter re-runs */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gw-row { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gw-row :is(.gw-k, .gw-row-top b, .gw-row-hero b) { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gw-row :is(small, .gw-hero-meta, .gw-foot, .gw-row-sub) { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gw-row .gw-hero-share.up, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gw-row .gw-dollar.up { color: #166534 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gw-row .gw-hero-share.down, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gw-row .gw-dollar.down { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gw-row :is(.gw-oi-pill, .gw-tier-badge) { color: #26405a !important; background: #e8eef5 !important; border-color: rgba(20, 47, 73, .18) !important; }
.gx-road .gx-road-hint { display: none; margin: 0 0 6px; text-align: center; font: 600 .76rem/1 var(--font-body); color: var(--dte-dim, #a9b8cc); }
@media (max-width: 760px) { .gx-road .gx-road-hint { display: block; } }
.gx-road-svg .gr-pain-lead { stroke: #c084fc; stroke-width: 1.2; stroke-dasharray: 3 3; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-summary :is(b, .gx-v) { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-summary :is(small, span) { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-summary .up { color: #166534 !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-summary .down { color: #9f1239 !important; }
/* every .gx-stat cell in the GEX panel owns its daylight ink (the 15 s redraw otherwise flashes dark-theme text on white) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-stat > small { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-stat > b { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-stat > b.up { color: #166534 !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-stat > b.down { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-stat > span { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-stat .gx-distance.up { color: #166534 !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-stat .gx-distance.down { color: #9f1239 !important; }

/* ===== v170 · 🌊 GEX วันนี้ banner (GEX tab + ⚡ สรุปวันนี้) + road entry (Audi 2026-10-25: "🌊 Negative GEX · เร่งเทรนด์ มันตัวเล็กไปไหม เราควรรู้ก่อนว่าวันนี้GEXอะไร") ===== */
.gx-today-slot:empty { display: none; }
.gx-today-slot { margin: 0 0 12px; }
.gx-today { --gt: #fb7185; --gt-soft: rgba(244, 63, 94, .14); display: grid; grid-template-columns: 64px minmax(0, 1fr) minmax(220px, 300px); align-items: center; gap: 14px 18px; width: 100%; margin: 4px 0 14px; padding: 16px 20px; border-radius: 20px; border: 1px solid color-mix(in srgb, var(--gt) 45%, transparent); background: radial-gradient(120% 160% at 0% 50%, var(--gt-soft), transparent 60%), rgba(9, 23, 45, .55); color: #f4f6fc; text-align: left; font: inherit; }
.gx-today.is-pos { --gt: #34d399; --gt-soft: rgba(16, 185, 129, .14); }
button.gx-today { cursor: pointer; transition: transform 200ms var(--aku-ease, ease), border-color 200ms; }
button.gx-today:hover { transform: translateY(-2px); border-color: var(--gt); }
button.gx-today:focus-visible { outline: 3px solid var(--gt); outline-offset: 3px; }
.gx-today .gxt-ico { width: 64px; height: 64px; display: block; }
.gx-today .gxt-ico-bg { fill: color-mix(in srgb, var(--gt) 18%, #0b1830); stroke: var(--gt); stroke-width: 2; }
.gx-today .gxt-wave { fill: color-mix(in srgb, var(--gt) 70%, transparent); animation: gxtWave 2.4s linear infinite; }
.gx-today .gxt-wave.is-2 { fill: color-mix(in srgb, var(--gt) 40%, #ffffff); opacity: .55; animation-duration: 1.6s; animation-direction: reverse; }
.gx-today .gxt-magnet { fill: var(--gt); } .gx-today .gxt-magnet-tip { fill: #e2e8f0; }
.gx-today .gxt-pulse { fill: none; stroke: var(--gt); stroke-width: 2; transform-box: fill-box; transform-origin: center; animation: gxtPulse 2.2s ease-out infinite; }
.gx-today .gxt-pulse.is-2 { animation-delay: 1.1s; }
@keyframes gxtWave { to { transform: translateX(32px); } }
@keyframes gxtPulse { from { transform: scale(.6); opacity: .9; } to { transform: scale(2.1); opacity: 0; } }
.gx-today .gxt-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.gx-today .gxt-chip { align-self: flex-start; padding: 2px 10px; border-radius: 999px; background: color-mix(in srgb, var(--gt) 16%, transparent); color: color-mix(in srgb, var(--gt) 55%, #ffffff); font: 700 .78rem/1.5 var(--aku-font-body, var(--font-body)); }
.gx-today .gxt-title { font: 800 clamp(1.35rem, 2.4vw, 1.8rem)/1.2 var(--aku-font-head, var(--font-head)); color: color-mix(in srgb, var(--gt) 60%, #ffffff); }
.gx-today .gxt-net { margin-left: 6px; font: 700 .95rem/1.2 var(--aku-font-mono, var(--mono)); color: #e2e8f0; white-space: nowrap; }
.gx-today .gxt-mean { font: 600 .98rem/1.45 var(--aku-font-body, var(--font-body)); color: #e2e8f0; }
.gx-today .gxt-plan { font: 800 .92rem/1.4 var(--aku-font-body, var(--font-body)); color: #fcd34d; }
.gx-today .gxt-flip { font: 700 .86rem/1.4 var(--aku-font-body, var(--font-body)); color: #fde68a; }
.gx-today .gxt-levels { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 4px; }
.gx-today .gxt-lv { font: 600 .84rem/1.4 var(--aku-font-body, var(--font-body)); color: #cbd5e1; white-space: nowrap; }
.gx-today .gxt-lv b { font-family: var(--aku-font-mono, var(--mono)); color: #f1f5f9; }
.gx-today .gxt-lv em { font-style: normal; font-family: var(--aku-font-mono, var(--mono)); font-size: .8rem; }
.gx-today .gxt-lv.is-put em { color: #fda4af; } .gx-today .gxt-lv.is-call em { color: #6ee7b7; } .gx-today .gxt-lv.is-zg em { color: #fde68a; }
.gx-today .gxt-meter { display: flex; flex-direction: column; gap: 6px; }
.gx-today .gxt-meter-k { font: 600 .82rem/1.4 var(--aku-font-body, var(--font-body)); color: #cbd5e1; } .gx-today .gxt-meter-k b { color: color-mix(in srgb, var(--gt) 55%, #ffffff); }
.gx-today .gxt-track { position: relative; height: 12px; border-radius: 999px; background: linear-gradient(90deg, #059669, #34d399 30%, #94a3b8 50%, #fb7185 70%, #be123c); }
.gx-today .gxt-needle { position: absolute; top: -5px; width: 6px; height: 22px; margin-left: -3px; border-radius: 3px; background: #ffffff; box-shadow: 0 0 0 2px #0b1830, 0 0 10px rgba(255, 255, 255, .6); }
@keyframes gxtNeedle { from { left: 50%; } }
.gx-today .gxt-ends { display: flex; justify-content: space-between; font: 700 .78rem/1.3 var(--aku-font-body, var(--font-body)); }
.gx-today .gxt-ends .is-pos { color: #6ee7b7; } .gx-today .gxt-ends .is-neg { color: #fda4af; }
.gx-today .gxt-go { align-self: flex-end; font: 700 .82rem/1.3 var(--aku-font-body, var(--font-body)); color: #93c5fd; }
.gx-road .gx-road-sub { font: 500 .82rem/1.4 var(--aku-font-body, var(--font-body)); color: var(--dte-dim, #a9b8cc); }
.gx-road-svg .gr-em-edge { font: 700 12px var(--aku-font-mono, var(--mono)); fill: #bfdbfe; }
/* entry plays once, the first time the road is on screen (the 15 s redraw never replays it) */
.gx-road.is-intro .gr-post rect { transform-box: fill-box; transform-origin: bottom; animation: grRise 700ms var(--aku-ease, ease-out) both; }
.gx-road.is-intro .gr-post.is-main rect { animation-delay: 150ms; }
.gx-road.is-intro .gr-car { animation: grDrive 900ms var(--aku-ease, ease-out) 250ms both; }
.gx-road.is-intro .gr-flow, .gx-road.is-intro .gr-flow-t { animation-name: grFlow, grFade; animation-duration: 1.1s, 600ms; animation-timing-function: linear, ease-out; animation-iteration-count: infinite, 1; animation-delay: 0s, 900ms; animation-fill-mode: none, both; }
.gx-road.is-intro .gr-flow-t { animation: grFade 600ms ease-out 900ms both; }
@keyframes grRise { from { transform: scaleY(0); } }
@keyframes grDrive { from { transform: translateX(-80px); opacity: 0; } }
@keyframes grFade { from { opacity: 0; } }
@media (max-width: 760px) {
  .gx-today { grid-template-columns: 52px minmax(0, 1fr); padding: 14px; gap: 10px 12px; }
  .gx-today .gxt-ico { width: 52px; height: 52px; }
  .gx-today .gxt-meter { grid-column: 1 / -1; }
  .gx-today .gxt-net { display: block; margin: 2px 0 0; }
}
html[data-motion=paused] .gx-today *, html[data-motion=paused] .gx-road.is-intro * { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .gx-today *, .gx-road.is-intro * { animation: none !important; } }
/* daylight: own ink, never the shell adapter's guess */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today { background: radial-gradient(120% 160% at 0% 50%, color-mix(in srgb, var(--gt) 16%, transparent), transparent 60%), #ffffff; border-color: color-mix(in srgb, var(--gt) 45%, #9eb4c9); color: #142f49; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today.is-neg { --gt: #be123c; } html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today.is-pos { --gt: #15803d; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-ico-bg { fill: color-mix(in srgb, var(--gt) 12%, #ffffff); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-chip { color: var(--gt) !important; background: color-mix(in srgb, var(--gt) 10%, #ffffff); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-title, html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-meter-k b { color: var(--gt) !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-net, html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv b { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-mean, html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv, html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-meter-k { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-plan, html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-flip { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-put em, html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-ends .is-neg { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-call em, html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-ends .is-pos { color: #166534 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-zg em { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-go { color: #1d4ed8 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-road .gx-road-sub { color: #3d546c !important; }
html[data-theme="light"] .gx-road-svg .gr-em-edge { fill: #1e40af; }
/* summary column is ~445px wide on desktop: the banner folds to its compact form by its own width, not the screen */
.gx-today-slot { container-type: inline-size; }
@container (max-width: 640px) {
  .gx-today-slot .gx-today { grid-template-columns: 48px minmax(0, 1fr); padding: 14px; gap: 8px 12px; margin: 0; }
  .gx-today-slot .gx-today .gxt-ico { width: 48px; height: 48px; }
  .gx-today-slot .gx-today .gxt-meter { grid-column: 1 / -1; }
  .gx-today-slot .gx-today .gxt-title { font-size: 1.3rem; }
  .gx-today-slot .gx-today .gxt-net { display: block; margin: 2px 0 0; }
}
/* level chips under the GEX lines own their daylight ink too (same 15 s redraw flash as .gx-stat) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .glt-c-chip > small { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .glt-c-chip > b { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .glt-c-chip > span { color: #3d546c !important; }
.gx-today .gxt-num { font: 600 .86rem/1.45 var(--aku-font-body, var(--font-body)); color: #cbd5e1; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-num { color: #3d546c !important; }
/* expiry calendar uses the full width of its card, like the summary strip above it (Audi 2026-10-25: "มันควรจะใช้columnให้สมดุลกับข้างบนป่ะ ที่ด้านขวามันโล่ง");
   the old ≥1800px cap (max-width:1180px) left a third of the row empty. 12 expiries = 3 rows × 4 on wide screens */
#gexExpiry .ex-list, #deskExpiry .ex-list { max-width: none !important; width: 100% !important; }
@media (min-width: 1400px) { #gexExpiry .ex-list, #deskExpiry .ex-list { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }
/* ===== v175 · Audi 2026-10-25: "ตัวหนังสือมันเยอะเกินไปไหม" · "โหมดเร่งเทรนตัวหนังสือควรใหญ่กว่า" · "พวกตัวเลข1 2 3 ทำให้สวยและเน้นความสำคัญกว่านี้ไหม" ===== */
.gx-today .gxt-lv.is-spot b { color: #7dd3fc; }
/* plain reads: name = headline, meaning = second line, numbers = small */
.gx-road .gx-read .gxr-name { display: block; font: 800 1.05rem/1.3 var(--aku-font-head, var(--font-head)); color: #f4f6fc; }
.gx-road .gx-read.is-bad .gxr-name { color: #fda4af; } .gx-road .gx-read.is-good .gxr-name { color: #6ee7b7; } .gx-road .gx-read.is-warn .gxr-name { color: #fde68a; }
.gx-road .gx-read .gxr-mean { display: block; margin-top: 1px; font: 600 .88rem/1.4 var(--aku-font-body, var(--font-body)); color: #e2e8f0; }
.gx-road .gx-read small { font-size: .78rem; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-road .gx-read .gxr-name { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-road .gx-read.is-bad .gxr-name { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-road .gx-read.is-good .gxr-name { color: #166534 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-road .gx-read.is-warn .gxr-name { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-road .gx-read .gxr-mean { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-spot b { color: #0369a1 !important; }
/* Top 8 ranks: medal discs, size falls with rank */
body:not(#akx) #main:not(#aky) #panel-gex .gw-rank { position: relative; gap: 3px; min-width: 0 !important; width: 28px; height: 28px !important; padding: 0 !important; border-radius: 50% !important; font: 800 .9rem/1 var(--aku-font-head, var(--font-head)) !important; color: #cbd5e1 !important; background: rgba(148, 163, 184, .12) !important; border: 1.5px solid rgba(148, 163, 184, .45) !important; box-shadow: none !important; }
body:not(#akx) #main:not(#aky) #panel-gex .gw-rank i { position: absolute; top: -11px; left: 50%; translate: -50% 0; font-style: normal; font-size: .9rem; line-height: 1; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .5)); }
body:not(#akx) #main:not(#aky) #panel-gex .gw-rank.gw-rank-1 { width: 42px; height: 42px !important; font-size: 1.3rem !important; color: #3b2300 !important; background: radial-gradient(circle at 32% 28%, #fff7c2, #fbbf24 48%, #b45309) !important; border: 2px solid #fde68a !important; box-shadow: 0 0 0 3px rgba(251, 191, 36, .22), 0 0 18px rgba(251, 191, 36, .55) !important; }
body:not(#akx) #main:not(#aky) #panel-gex .gw-rank.gw-rank-1 i { top: -15px; font-size: 1.1rem; animation: gwCrown 2.6s ease-in-out infinite; }
body:not(#akx) #main:not(#aky) #panel-gex .gw-rank.gw-rank-2 { width: 36px; height: 36px !important; font-size: 1.1rem !important; color: #1e293b !important; background: radial-gradient(circle at 32% 28%, #ffffff, #cbd5e1 50%, #64748b) !important; border: 2px solid #e2e8f0 !important; box-shadow: 0 0 12px rgba(203, 213, 225, .35) !important; }
body:not(#akx) #main:not(#aky) #panel-gex .gw-rank.gw-rank-3 { width: 34px; height: 34px !important; font-size: 1.02rem !important; color: #2b1406 !important; background: radial-gradient(circle at 32% 28%, #fed7aa, #d97706 52%, #7c2d12) !important; border: 2px solid #fdba74 !important; box-shadow: 0 0 12px rgba(217, 119, 6, .35) !important; }
body:not(#akx) #main:not(#aky) #panel-gex .gw-row:has(.gw-rank-1) { box-shadow: inset 0 0 0 1.5px rgba(251, 191, 36, .55), 0 0 22px rgba(251, 191, 36, .14) !important; }
@keyframes gwCrown { 50% { translate: -50% -3px; rotate: -8deg; } }
html[data-motion=paused] #panel-gex .gw-rank i { animation: none !important; }
@media (prefers-reduced-motion: reduce) { #panel-gex .gw-rank i { animation: none !important; } }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gw-rank.gw-rank-n { color: #3d546c !important; background: #eef3f8 !important; border-color: #9eb4c9 !important; }
/* heat-table reason tags: one per reason, colour by kind */
#panel-gex .k-tags { flex-wrap: wrap; row-gap: 3px; }
body:not(#akx) #main:not(#aky) #panel-gex .gw-rank > b { color: inherit !important; font: inherit !important; }
/* ⚡ สรุปวันนี้ = compact: levels + meter only; the lit end of the meter carries the mode (Audi 2026-10-25: "เหลือสั้นๆพอ เพราะเดียวก็ไปดูตรงtabs gexได้อยุ่แล้ว") */
.gx-today .gxt-ends span { opacity: .6; transition: opacity 200ms; }
.gx-today .gxt-ends span.is-on { opacity: 1; font-size: .92rem; font-weight: 800; }
.gx-today.is-compact { align-items: center; }
.gx-today-slot .gx-today.is-compact .gxt-ico { width: 40px; height: 40px; }
@container (max-width: 640px) { .gx-today-slot .gx-today.is-compact { grid-template-columns: 40px minmax(0, 1fr); } }
/* ===== v180 · road flow (Audi 2026-10-25: "พวกแท่งแนวนอนทำให้มันดูมีflowหน่อยไหม") ===== */
.gx-road.is-intro .gr-post rect { transform-origin: center !important; }
.gx-road-svg .gr-zone { filter: drop-shadow(0 0 10px rgba(0, 0, 0, .25)); }
.gx-road-svg .gr-post.is-put.is-main rect { filter: drop-shadow(0 0 8px rgba(251, 113, 133, .7)); } .gx-road-svg .gr-post.is-call.is-main rect { filter: drop-shadow(0 0 8px rgba(52, 211, 153, .7)); }
/* Call vs Put bar: stripes stream toward the heavier side, fill grows in */
/* Put left · Call right: bar gradients, grow and stripe directions follow the new sides */
@media (max-width: 760px) { .gx-road .gtl-k.is-put { text-align: left !important; } .gx-road .gtl-k.is-call { text-align: right; } }
/* Wall pillars under the strike chart own their daylight ink (15 s redraw flash) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gsp-item > small { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gsp-item > b { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gsp-item > span { color: #3d546c !important; }

/* v184 · soft light sweeps instead of dots/stripes (Audi 2026-10-25: "ไม่เอาจุดสิ แบบนี้มันลายตา อ่านตัวหนังสือยาก ทำเปนgradientบางๆไม่ดีกว่าหรอ") */

/* v186 · Call/Put bar = liquid tube (Audi 2026-10-25: "แท่งเขียวแดงทำเป็นสีพื้นหลังเป็นเหมือนคลื่นได้ไหม … ทำไมแท่งมันเหมือนโหลดใหม่ตลอดเวลา") */
.gx-road .gtl-bar.gtl-wave { display: block; height: 22px; padding: 0; background: none; border-radius: 999px; box-shadow: inset 0 1px 4px rgba(0, 0, 0, .4), 0 0 0 1px rgba(148, 163, 184, .25); overflow: hidden; }
.gx-road .gtl-wave svg { display: block; width: 100%; height: 100%; }
.gx-road .gtl-wave .gw-layer { fill: rgba(255, 255, 255, .16); } .gx-road .gtl-wave .gw-layer.is-deep { fill: rgba(0, 0, 0, .14); }
.gx-road .gtl-wave .gw-drift { animation: gwDrift 14s linear infinite; } .gx-road .gtl-wave .gw-drift.is-b { animation-duration: 20s; animation-direction: reverse; }
.gx-road .gtl-wave .gw-split { animation: gwSplit 6s linear infinite; }
@keyframes gwDrift { to { transform: translateX(-480px); } }
@keyframes gwSplit { to { transform: translateY(15px); } }
html[data-theme="light"] .gx-road .gtl-bar.gtl-wave { box-shadow: inset 0 1px 3px rgba(20, 47, 73, .25), 0 0 0 1px #9eb4c9; }
html[data-motion=paused] .gx-road .gtl-wave *, html[data-motion=paused] .gx-today .gxt-needle { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .gx-road .gtl-wave *, .gx-today .gxt-needle { animation: none !important; } }
/* the needle sweeps in only on the first paint, never on the 15 s redraw */
.gx-today .gxt-needle { animation: none; } .gx-today.is-intro .gxt-needle { animation: gxtNeedle 900ms var(--aku-ease, ease-out) both; }

/* v188 · road surface = GEX heat per strike, darker = more GEX (Audi 2026-10-25: "ลองเปลี่ยนแสงวาวเป็นอย่างอื่นไหมมันไม่สวย … ตรงwallเข้มมาก") */
.gx-road-svg .gr-road-base { fill: rgba(148, 163, 184, .1); }
.gx-road-svg .gr-peak { transform-box: fill-box; transform-origin: center; animation: grPeak 5s ease-in-out infinite; }
@keyframes grPeak { 0%, 100% { opacity: .35; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.1); } }
html[data-theme="light"] .gx-road-svg .gr-road-base { fill: rgba(20, 47, 73, .06); }
html[data-motion=paused] .gx-road-svg .gr-peak { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .gx-road-svg .gr-peak { animation: none !important; } }
/* v189 · Zero Γ mode line stands out; label on two lines like the wall labels */
.gx-road-svg .gr-zg { stroke: #fcd34d !important; stroke-width: 3 !important; stroke-dasharray: 7 5; }
.gx-road-svg .gr-zg-glow { stroke: rgba(252, 211, 77, .28); stroke-width: 12; stroke-linecap: round; }
.gx-road-svg .gr-zg-dot { fill: #fcd34d; stroke: #0b1830; stroke-width: 2.5; }
.gx-road-svg .gr-zg-t { font: 800 14px var(--aku-font-body, var(--font-body)) !important; fill: #fde68a; }
.gx-road-svg .gr-zg-sub { font: 700 12px var(--aku-font-body, var(--font-body)); fill: #fcd34d; opacity: .9; }
html[data-theme="light"] .gx-road-svg .gr-zg { stroke: #b45309 !important; } html[data-theme="light"] .gx-road-svg .gr-zg-glow { stroke: rgba(217, 119, 6, .2); }
html[data-theme="light"] .gx-road-svg .gr-zg-dot { fill: #d97706; stroke: #ffffff; }
html[data-theme="light"] .gx-road-svg .gr-zg-t { fill: #92400e; } html[data-theme="light"] .gx-road-svg .gr-zg-sub { fill: #92400e; }
/* ===== v193 · กราฟ tab: no blank half-cards (equal-height rows left 110–460px empty at 1440/1871).
   Content stacks from the top and the card's own picture grows into the spare height instead. ===== */
#panel-chart .ch-tcard, #panel-chart .ch-conf-card { justify-content: flex-start !important; }
#panel-chart .ch-grid > .gx-card, #panel-data .ch-grid > .gx-card { display: flex; flex-direction: column; }
#panel-chart .ch-grid > .gx-card > .hist, #panel-data .ch-grid > .gx-card > .hist { flex: 1 1 auto; min-height: 180px; height: auto !important; }

/* rows whose cards hold different amounts of content: each card ends where its content ends (stretching left 110–460px blank) */
#panel-chart .ch-confluence-deck, #panel-chart .ch-trend-deck, #panel-chart :has(> .ch-tcard) { align-items: start !important; }
/* ===== v195 · 📏 SPY ปกติแกว่งยังไง = ค ruler → ข three decision boxes → ก five boxless numbers (Audi 2026-10-25: "ข + ค แล้วส่วนที่สำคัญน้อยกว่าเป็น ก") ===== */
#panel-chart .nd-wrap, #panel-data .nd-wrap { margin: 6px 0 18px; }
#panel-chart .nd-scroll, #panel-data .nd-scroll { padding: 14px 18px 4px; border-radius: 18px; background: rgba(16, 35, 63, .55); border: 1px solid rgba(148, 163, 184, .22); overflow-x: auto; }
#panel-chart .nd-svg, #panel-data .nd-svg { display: block; width: 100%; min-width: 640px; height: auto; }
#panel-chart .nd-svg text, #panel-data .nd-svg text { font-family: var(--aku-font-body); }
#panel-chart .nd-axis, #panel-data .nd-axis { stroke: rgba(148, 163, 184, .55); stroke-width: 2; }
#panel-chart .nd-tick text, #panel-data .nd-tick text { font-size: 12px; fill: #a9b8cc; }
#panel-chart .nd-atr, #panel-data .nd-atr { fill: rgba(125, 211, 252, .08); stroke: #7dd3fc; stroke-dasharray: 6 5; }
#panel-chart .nd-atr.is-hot, #panel-data .nd-atr.is-hot { fill: rgba(252, 211, 77, .12); stroke: #fcd34d; }
#panel-chart .nd-atr-t, #panel-data .nd-atr-t { font-size: 13px; font-weight: 700; fill: #bae6fd; }
#panel-chart .nd-atr-t.is-hot, #panel-data .nd-atr-t.is-hot { fill: #fde68a; }
#panel-chart .nd-dn, #panel-data .nd-dn { fill: #fb7185; opacity: .9; }
#panel-chart .nd-up, #panel-data .nd-up { fill: #34d399; opacity: .9; }
#panel-chart .nd-today { fill: #7dd3fc; }
#panel-chart .nd-now { fill: #ffffff; stroke: #0b1830; stroke-width: 2.5; }
#panel-chart .nd-br, #panel-data .nd-br { fill: none; stroke: #7dd3fc; stroke-width: 2; }
#panel-chart .nd-br-t, #panel-data .nd-br-t { font-size: 14px; font-weight: 800; fill: #bae6fd; }
#panel-chart .nd-open, #panel-data .nd-open { stroke: #f4f6fc; stroke-width: 3; }
#panel-chart .nd-open-dot, #panel-data .nd-open-dot { fill: #7dd3fc; stroke: #f4f6fc; stroke-width: 2; }
#panel-chart .nd-lab, #panel-data .nd-lab { font-size: 15px; font-weight: 800; fill: #f4f6fc; }
#panel-chart .nd-lab.is-dn, #panel-data .nd-lab.is-dn { fill: #fda4af; }
#panel-chart .nd-lab.is-up, #panel-data .nd-lab.is-up { fill: #6ee7b7; }
#panel-chart .nd-sub, #panel-data .nd-sub { font-size: 12px; fill: #a9b8cc; }
#panel-chart .nd-hint, #panel-data .nd-hint { margin: 6px 4px 12px; font-size: .8rem; color: #a9b8cc; }
#panel-chart .nd-keys, #panel-data .nd-keys { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 6px; }
#panel-chart .nd-key, #panel-data .nd-key { padding: 16px 18px; border-radius: 16px; background: rgba(16, 35, 63, .72); border: 1px solid rgba(148, 163, 184, .28); }
#panel-chart .nd-key small, #panel-data .nd-key small { display: block; font: 600 .86rem/1.4 var(--aku-font-body); color: #bdcde2; }
#panel-chart .nd-key b, #panel-data .nd-key b { display: block; margin: 6px 0 8px; font: 800 1.9rem/1.2 var(--aku-font-mono); color: #f4f6fc; }
#panel-chart .nd-key b.warn, #panel-data .nd-key b.warn { color: #fcd34d; }
#panel-chart .nd-key b.sky { color: #7dd3fc; }
#panel-chart .nd-meter, #panel-data .nd-meter { display: block; position: relative; height: 10px; border-radius: 999px; background: rgba(148, 163, 184, .2); overflow: hidden; }
#panel-chart .nd-meter i, #panel-data .nd-meter i { position: absolute; inset: 0 auto 0 0; border-radius: 999px; }
#panel-chart .nd-meter i.is-sky, #panel-data .nd-meter i.is-sky { background: #7dd3fc; }
#panel-chart .nd-meter i.is-warn, #panel-data .nd-meter i.is-warn { background: #fcd34d; }
#panel-chart .nd-meter i.is-good, #panel-data .nd-meter i.is-good { background: #34d399; }
#panel-chart .nd-note, #panel-data .nd-note { display: block; margin-top: 8px; font: 500 .82rem/1.45 var(--aku-font-body); color: #bdcde2; }
#panel-chart .nd-rest, #panel-data .nd-rest { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: 8px; border-top: 1px solid rgba(148, 163, 184, .25); }
#panel-chart .nd-cell, #panel-data .nd-cell { padding: 12px 16px; border-left: 1px solid rgba(148, 163, 184, .25); }
#panel-chart .nd-cell:first-child, #panel-data .nd-cell:first-child { border-left: 0; padding-left: 4px; }
#panel-chart .nd-cell small, #panel-data .nd-cell small { display: block; font: 600 .8rem/1.4 var(--aku-font-body); color: #bdcde2; }
#panel-chart .nd-cell b, #panel-data .nd-cell b { display: block; margin: 4px 0 2px; font: 800 1.35rem/1.25 var(--aku-font-mono); color: #f4f6fc; }
#panel-chart .nd-cell b.up, #panel-data .nd-cell b.up { color: #6ee7b7; }
#panel-chart .nd-cell b.down, #panel-data .nd-cell b.down { color: #fda4af; }
#panel-chart .nd-cell span, #panel-data .nd-cell span { display: block; font: 500 .76rem/1.4 var(--aku-font-body); color: #a9b8cc; }
@media (max-width: 900px) {
  #panel-chart .nd-keys, #panel-data .nd-keys { grid-template-columns: 1fr; }
  #panel-chart .nd-rest, #panel-data .nd-rest { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #panel-chart .nd-cell:nth-child(odd), #panel-data .nd-cell:nth-child(odd) { border-left: 0; padding-left: 4px; }
  #panel-chart .nd-cell:nth-child(n+3), #panel-data .nd-cell:nth-child(n+3) { border-top: 1px solid rgba(148, 163, 184, .2); }
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-scroll, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-scroll { background: #ffffff; border-color: #9eb4c9; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-key, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-key { background: #ffffff; border-color: #9eb4c9; }
html[data-theme="light"] #panel-chart .nd-axis, html[data-theme="light"] #panel-data .nd-axis { stroke: #9eb4c9; }
html[data-theme="light"] #panel-chart .nd-tick text, html[data-theme="light"] #panel-chart .nd-sub, html[data-theme="light"] #panel-data .nd-tick text, html[data-theme="light"] #panel-data .nd-sub { fill: #3d546c; }
html[data-theme="light"] #panel-chart .nd-atr, html[data-theme="light"] #panel-data .nd-atr { fill: rgba(3, 105, 161, .06); stroke: #0369a1; }
html[data-theme="light"] #panel-chart .nd-atr.is-hot, html[data-theme="light"] #panel-data .nd-atr.is-hot { fill: rgba(217, 119, 6, .1); stroke: #b45309; }
html[data-theme="light"] #panel-chart .nd-atr-t, html[data-theme="light"] #panel-data .nd-atr-t { fill: #0369a1; }
html[data-theme="light"] #panel-chart .nd-atr-t.is-hot, html[data-theme="light"] #panel-data .nd-atr-t.is-hot { fill: #92400e; }
html[data-theme="light"] #panel-chart .nd-dn, html[data-theme="light"] #panel-data .nd-dn { fill: #be123c; }
html[data-theme="light"] #panel-chart .nd-up, html[data-theme="light"] #panel-data .nd-up { fill: #15803d; }
html[data-theme="light"] #panel-chart .nd-today { fill: #0369a1; }
html[data-theme="light"] #panel-chart .nd-now { fill: #0369a1; stroke: #ffffff; }
html[data-theme="light"] #panel-chart .nd-br, html[data-theme="light"] #panel-data .nd-br { stroke: #0369a1; }
html[data-theme="light"] #panel-chart .nd-br-t, html[data-theme="light"] #panel-data .nd-br-t { fill: #0369a1; }
html[data-theme="light"] #panel-chart .nd-open, html[data-theme="light"] #panel-data .nd-open { stroke: #142f49; }
html[data-theme="light"] #panel-chart .nd-open-dot, html[data-theme="light"] #panel-data .nd-open-dot { fill: #0369a1; stroke: #142f49; }
html[data-theme="light"] #panel-chart .nd-lab, html[data-theme="light"] #panel-data .nd-lab { fill: #142f49; }
html[data-theme="light"] #panel-chart .nd-lab.is-dn, html[data-theme="light"] #panel-data .nd-lab.is-dn { fill: #9f1239; }
html[data-theme="light"] #panel-chart .nd-lab.is-up, html[data-theme="light"] #panel-data .nd-lab.is-up { fill: #166534; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-hint,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-cell span,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-note,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-key small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-cell small, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-hint, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-cell span, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-note, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-key small, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-cell small { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-key b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-cell b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-key b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-cell b { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-key b.warn, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-key b.warn { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-key b.sky { color: #0369a1 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-cell b.up, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-cell b.up { color: #166534 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-cell b.down, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-cell b.down { color: #9f1239 !important; }
#panel-chart .nd-swipe, #panel-data .nd-swipe { display: none; margin: 4px 0 0; text-align: center; font-size: .78rem; color: #a9b8cc; }
@media (max-width: 700px) { #panel-chart .nd-swipe, #panel-data .nd-swipe { display: block; } }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-swipe, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-swipe { color: #3d546c !important; }
/* ===== v198 · กราฟ tab round 2 (Audi 2026-10-25) =====
   Box surface = the liked "zone card" (--zone1-bg: gold corner glow over deep navy-to-ink, coloured 3px top edge), never flat navy.
   Groups of key numbers = the 🕐 time-of-day pattern: inside one card, each item split by a 3px coloured left edge. */
#panel-chart .nd-wrap, #panel-data .nd-wrap { margin: 6px 0 18px; padding: 16px 20px 14px; border-radius: 18px; background: var(--zone1-bg); border: 1px solid rgba(226, 201, 143, .22); border-top: 3px solid #38bdf8; box-shadow: 0 12px 30px rgba(0, 0, 0, .26); }
#panel-chart .nd-scroll, #panel-data .nd-scroll { padding: 0 !important; border: 0 !important; background: none !important; border-radius: 0 !important; }
#panel-chart .nd-keys, #panel-data .nd-keys { gap: 12px; margin: 4px 0 0; padding: 12px 0; border-top: 1px dashed rgba(148, 163, 184, .24); border-bottom: 1px dashed rgba(148, 163, 184, .24); }
#panel-chart .nd-key, #panel-data .nd-key { padding: 4px 0 4px 14px !important; border-radius: 0 !important; background: transparent !important; border: 0 !important; border-left: 3px solid #38bdf8 !important; }
#panel-chart .nd-key:nth-child(2), #panel-data .nd-key:nth-child(2) { border-left-color: #fbbf24 !important; }
#panel-chart .nd-key:nth-child(3), #panel-data .nd-key:nth-child(3) { border-left-color: #34d399 !important; }
#panel-chart .nd-key b, #panel-data .nd-key b { font-size: 1.7rem; margin: 4px 0 6px; }
#panel-chart .nd-rest, #panel-data .nd-rest { border-top: 0; margin-top: 0; }
/* ruler animation: first view only — bars grow out of the open price, the bracket and ATR band draw in; today's reach pulses while live */
#panel-chart .nd-wrap.is-intro .nd-dn, #panel-data .nd-wrap.is-intro .nd-dn { transform-box: fill-box; transform-origin: right center; animation: ndGrow 900ms var(--aku-ease, ease-out) 150ms both; }
#panel-chart .nd-wrap.is-intro .nd-up, #panel-data .nd-wrap.is-intro .nd-up { transform-box: fill-box; transform-origin: left center; animation: ndGrow 900ms var(--aku-ease, ease-out) 150ms both; }
#panel-chart .nd-wrap.is-intro .nd-br, #panel-data .nd-wrap.is-intro .nd-br { stroke-dasharray: 700; animation: ndDraw 1100ms ease-out 500ms both; }
#panel-chart .nd-wrap.is-intro .nd-atr, #panel-data .nd-wrap.is-intro .nd-atr { animation: ndFade 700ms ease-out 900ms both; }
#panel-chart .nd-wrap.is-intro .nd-lab, #panel-chart .nd-wrap.is-intro .nd-sub, #panel-chart .nd-wrap.is-intro .nd-br-t, #panel-chart .nd-wrap.is-intro .nd-atr-t, #panel-data .nd-wrap.is-intro .nd-lab, #panel-data .nd-wrap.is-intro .nd-sub, #panel-data .nd-wrap.is-intro .nd-br-t, #panel-data .nd-wrap.is-intro .nd-atr-t { animation: ndFade 600ms ease-out 1000ms both; }
#panel-chart .nd-wrap.is-intro .nd-meter i, #panel-data .nd-wrap.is-intro .nd-meter i { transform-origin: left; animation: ndGrow 900ms var(--aku-ease, ease-out) 300ms both; }
#panel-chart .nd-now { transform-box: fill-box; transform-origin: center; animation: ndPulse 2.4s ease-in-out infinite; }
@keyframes ndGrow { from { transform: scaleX(0); } }
@keyframes ndDraw { from { stroke-dashoffset: 700; } to { stroke-dashoffset: 0; } }
@keyframes ndFade { from { opacity: 0; } }
@keyframes ndPulse { 50% { transform: scale(1.35); } }

/* 5-timeframe card: one sentence that reads the five together */
#panel-chart .ch-mtf-read { margin: 2px 0 0; padding: 8px 12px; border-left: 3px solid #38bdf8; font: 500 .9rem/1.5 var(--aku-font-body); color: #e2e8f0; background: rgba(56, 189, 248, .06); border-radius: 0 10px 10px 0; }
#panel-chart .ch-mtf-read b { color: #7dd3fc; }

/* ladder: price-now = a lit sky line with a pulsing dot; strong levels keep their filled rows, so they still read first */
#panel-chart .ch-lad-spot { position: relative; padding: 9px 12px 9px 26px !important; margin: 6px 0 !important; border: 0 !important; border-radius: 999px !important; background: linear-gradient(90deg, rgba(56, 189, 248, .16), rgba(56, 189, 248, .04)) !important; box-shadow: inset 0 0 0 1px rgba(56, 189, 248, .45); color: #bae6fd !important; font-size: .82rem !important; }
#panel-chart .ch-lad-spot b { font-size: 1.05rem !important; color: #f0f9ff !important; }
#panel-chart .ch-lad-spot small { color: #93c5fd !important; }
#panel-chart .ch-lad-spot .cls-dot { position: absolute; left: 10px; top: 50%; width: 9px; height: 9px; margin-top: -4.5px; border-radius: 50%; background: #38bdf8; box-shadow: 0 0 0 0 rgba(56, 189, 248, .7); animation: clsPing 2s ease-out infinite; }
@keyframes clsPing { 70% { box-shadow: 0 0 0 8px rgba(56, 189, 248, 0); } 100% { box-shadow: 0 0 0 0 rgba(56, 189, 248, 0); } }

/* volume: taller bars, 20-bar average as a dashed line, each bar says how many times average it is */
#panel-chart .ch-vol-skyline-5 { background: transparent !important; border: 0 !important; padding: 6px 0 !important; }
#panel-chart .ch-vol-skyline-5 .cvs-track { position: relative; max-width: 44px !important; height: 92px !important; background: rgba(148, 163, 184, .08) !important; border: 0 !important; border-radius: 8px !important; overflow: visible !important; }
#panel-chart .ch-vol-skyline-5 .cvs-avg { position: absolute; left: -6px; right: -6px; bottom: var(--avg, 50%); border-top: 1.5px dashed rgba(253, 230, 138, .75); z-index: 1; }
#panel-chart .ch-vol-skyline-5 .cvs-x { font: 700 .72rem var(--aku-font-mono); color: #cbd5e1; }
#panel-chart .ch-vol-skyline-5 .cvs-col.is-last { background: rgba(56, 189, 248, .08) !important; border: 1px solid rgba(56, 189, 248, .3) !important; }

/* GEX range road */
#panel-chart .ch-cr { margin: 4px 0 6px; }
#panel-chart .ch-cr-svg { display: block; width: 100%; height: auto; }
#panel-chart .ch-cr-svg text { font-family: var(--aku-font-body); }
#panel-chart .ch-cr-base { fill: rgba(148, 163, 184, .14); }
#panel-chart .ch-cr-put { fill: rgba(244, 63, 94, .35); } #panel-chart .ch-cr-call { fill: rgba(16, 185, 129, .35); }
#panel-chart .ch-cr-post.is-put { fill: #fb7185; } #panel-chart .ch-cr-post.is-call { fill: #34d399; }
#panel-chart .ch-cr-zg { stroke: #fcd34d; stroke-width: 2.5; stroke-dasharray: 5 4; }
#panel-chart .ch-cr-lab { font-size: 13px; font-weight: 800; } #panel-chart .ch-cr-lab.is-put { fill: #fda4af; } #panel-chart .ch-cr-lab.is-call { fill: #6ee7b7; }
#panel-chart .ch-cr-sub { font-size: 12px; font-weight: 600; fill: #cbd5e1; }
#panel-chart .ch-cr-now { font-size: 14px; font-weight: 800; fill: #f0f9ff; }
#panel-chart .ch-cr-dot { fill: #38bdf8; stroke: #f8fafc; stroke-width: 3; }
#panel-chart .ch-cr-glow { fill: rgba(56, 189, 248, .25); transform-box: fill-box; transform-origin: center; animation: ndPulse 2.4s ease-in-out infinite; }
#panel-chart .ch-cr-read { margin: 2px 0 8px; font: 500 .86rem/1.5 var(--aku-font-body); color: #cbd5e1; }
#panel-chart .ch-cr-read b { color: #f1f5f9; }

html[data-motion=paused] #panel-chart .nd-wrap *, html[data-motion=paused] #panel-chart .cls-dot, html[data-motion=paused] #panel-chart .ch-cr-glow, html[data-motion=paused] #panel-data .nd-wrap * { animation: none !important; }
@media (prefers-reduced-motion: reduce) { #panel-chart .nd-wrap *, #panel-chart .cls-dot, #panel-chart .ch-cr-glow, #panel-data .nd-wrap * { animation: none !important; } }

/* daylight */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-wrap, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-wrap { background: var(--zone1-bg) !important; border-color: #9eb4c9 !important; border-top-color: #0369a1 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .nd-key, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .nd-key { background: transparent !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-mtf-read { color: #142f49 !important; background: rgba(3, 105, 161, .06) !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-mtf-read b { color: #0369a1 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-lad-spot { color: #0c4a6e !important; background: linear-gradient(90deg, rgba(3, 105, 161, .12), rgba(3, 105, 161, .03)) !important; box-shadow: inset 0 0 0 1px rgba(3, 105, 161, .4); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-lad-spot b { color: #0c4a6e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-lad-spot small { color: #0369a1 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-vol-skyline-5 .cvs-x { color: #3d546c !important; }
html[data-theme="light"] #panel-chart .ch-vol-skyline-5 .cvs-avg { border-top-color: #b45309; }
html[data-theme="light"] #panel-chart .ch-cr-base { fill: rgba(20, 47, 73, .08); }
html[data-theme="light"] #panel-chart .ch-cr-put { fill: rgba(190, 18, 60, .22); } html[data-theme="light"] #panel-chart .ch-cr-call { fill: rgba(21, 128, 61, .22); }
html[data-theme="light"] #panel-chart .ch-cr-lab.is-put { fill: #9f1239; } html[data-theme="light"] #panel-chart .ch-cr-lab.is-call { fill: #166534; }
html[data-theme="light"] #panel-chart .ch-cr-sub { fill: #3d546c; } html[data-theme="light"] #panel-chart .ch-cr-now { fill: #142f49; }
html[data-theme="light"] #panel-chart .ch-cr-zg { stroke: #b45309; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-cr-read { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-cr-read b { color: #142f49 !important; }
#panel-chart .ch-cr-read b { font: 700 .9rem/1.5 var(--aku-font-body) !important; }
#panel-chart .nd-svg, #panel-data .nd-svg { max-width: 1100px; margin: 0 auto; }
/* ===== v200 · กราฟ tab round 3 (Audi 2026-10-25) ===== */
/* reading sentence takes its side's colour: Put lean red, Call lean green, mixed amber */
#panel-chart .ch-mtf-read.is-bear { border-left-color: #fb7185; background: rgba(244, 63, 94, .08); }
#panel-chart .ch-mtf-read.is-bear b { color: #fda4af; }
#panel-chart .ch-mtf-read.is-bull { border-left-color: #34d399; background: rgba(16, 185, 129, .08); }
#panel-chart .ch-mtf-read.is-bull b { color: #6ee7b7; }
#panel-chart .ch-mtf-read.is-mixed { border-left-color: #fbbf24; background: rgba(251, 191, 36, .07); }
#panel-chart .ch-mtf-read.is-mixed b { color: #fde68a; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-mtf-read.is-bear { background: rgba(190, 18, 60, .07) !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-mtf-read.is-bear b { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-mtf-read.is-bull { background: rgba(21, 128, 61, .07) !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-mtf-read.is-bull b { color: #166534 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-mtf-read.is-mixed { background: rgba(217, 119, 6, .07) !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-mtf-read.is-mixed b { color: #92400e !important; }

/* GEX road: testing a wall = two forces at the contact point (chevrons pushing in from both sides, sparks, SPY trembling) */
#panel-chart .ch-cr-chev { font: 800 20px var(--aku-font-body); animation: crPush 1s ease-in-out infinite; }
#panel-chart .ch-cr-chev.is-spy { fill: #7dd3fc; }
#panel-chart .ch-cr-fight.is-put .ch-cr-chev.is-wall { fill: #fb7185; } #panel-chart .ch-cr-fight.is-call .ch-cr-chev.is-wall { fill: #34d399; }
#panel-chart .ch-cr-spark { fill: none; stroke: #fde68a; stroke-width: 2.5; transform-box: fill-box; transform-origin: center; animation: crSpark 1.1s ease-out infinite; }
#panel-chart .ch-cr-spark.is-2 { animation-delay: .55s; }
#panel-chart .ch-cr-car.is-testing { animation: crShake .32s ease-in-out infinite; }
#panel-chart .ch-cr.is-test-put .ch-cr-post.is-put, #panel-chart .ch-cr.is-test-call .ch-cr-post.is-call { animation: crWall 1s ease-in-out infinite; }
#panel-chart .ch-cr.is-test-put .ch-cr-read b { color: #fda4af; } #panel-chart .ch-cr.is-test-call .ch-cr-read b { color: #6ee7b7; }
@keyframes crPush { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }
@keyframes crSpark { from { transform: scale(.6); opacity: 1; } to { transform: scale(2.6); opacity: 0; } }
@keyframes crShake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-1.5px); } 75% { transform: translateX(1.5px); } }
@keyframes crWall { 50% { filter: brightness(1.45); } }
html[data-motion=paused] #panel-chart .ch-cr *, html[data-motion=paused] #panel-chart .ch-cr-car { animation: none !important; }
@media (prefers-reduced-motion: reduce) { #panel-chart .ch-cr *, #panel-chart .ch-cr-car { animation: none !important; } }
html[data-theme="light"] #panel-chart .ch-cr-chev.is-spy { fill: #0369a1; }
html[data-theme="light"] #panel-chart .ch-cr-fight.is-put .ch-cr-chev.is-wall { fill: #be123c; } html[data-theme="light"] #panel-chart .ch-cr-fight.is-call .ch-cr-chev.is-wall { fill: #15803d; }
html[data-theme="light"] #panel-chart .ch-cr-spark { stroke: #d97706; }

/* backtest: the trend-filtered column */
#panel-chart .mg-table td.mg-trend b, #panel-data .mg-table td.mg-trend b, #mkOdds .mg-table td.mg-trend b { font-family: var(--aku-font-mono); }
#panel-chart .mg-table td.mg-trend.is-good b, #panel-data .mg-table td.mg-trend.is-good b, #mkOdds .mg-table td.mg-trend.is-good b { color: #34d399; } #panel-chart .mg-table td.mg-trend.is-bad b, #panel-data .mg-table td.mg-trend.is-bad b, #mkOdds .mg-table td.mg-trend.is-bad b { color: #fb7185; } #panel-chart .mg-table td.mg-trend.is-flat b, #panel-data .mg-table td.mg-trend.is-flat b, #mkOdds .mg-table td.mg-trend.is-flat b { color: #fbbf24; }
#panel-chart .mg-table td.mg-trend span, #panel-data .mg-table td.mg-trend span, #mkOdds .mg-table td.mg-trend span { color: #a9b8cc; font-size: .78rem; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table td.mg-trend.is-good b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table td.mg-trend.is-good b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table td.mg-trend.is-good b { color: #166534 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table td.mg-trend.is-bad b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table td.mg-trend.is-bad b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table td.mg-trend.is-bad b { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table td.mg-trend.is-flat b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table td.mg-trend.is-flat b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table td.mg-trend.is-flat b { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table td.mg-trend span, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table td.mg-trend span, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table td.mg-trend span { color: #3d546c !important; }

/* alerts: frosted glass you can see through, side colour on the frame + a side pill (Call green · Put red · watch amber) */
.ch-push-toast { background: rgba(9, 14, 26, .62) !important; backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3); border-left-width: 5px !important; }
.ch-push-toast.is-bull { border-color: rgba(52, 211, 153, .85) !important; }
.ch-push-toast.is-bear { border-color: rgba(251, 113, 133, .85) !important; }
.ch-push-toast.is-touch { border-color: rgba(251, 191, 36, .85) !important; }
.ch-push-toast .cpt-side { padding: 1px 9px; border-radius: 999px; font: 800 .74rem/1.6 var(--aku-font-body); white-space: nowrap; }
.ch-push-toast.is-bull .cpt-side { background: rgba(16, 185, 129, .22); color: #a7f3d0; }
.ch-push-toast.is-bear .cpt-side { background: rgba(244, 63, 94, .22); color: #fecdd3; }
.ch-push-toast.is-touch .cpt-side { background: rgba(251, 191, 36, .2); color: #fde68a; }
html[data-theme="light"] .ch-push-toast { background: rgba(255, 255, 255, .72) !important; }
html[data-theme="light"] .ch-push-toast.is-bull .cpt-side { color: #166534; } html[data-theme="light"] .ch-push-toast.is-bear .cpt-side { color: #9f1239; } html[data-theme="light"] .ch-push-toast.is-touch .cpt-side { color: #92400e; }
#panel-chart .mg-table td.mg-trend.is-good b, #panel-data .mg-table td.mg-trend.is-good b, #mkOdds .mg-table td.mg-trend.is-good b { color: #6ee7b7; } #panel-chart .mg-table td.mg-trend.is-bad b, #panel-data .mg-table td.mg-trend.is-bad b, #mkOdds .mg-table td.mg-trend.is-bad b { color: #fda4af; } #panel-chart .mg-table td.mg-trend.is-flat b, #panel-data .mg-table td.mg-trend.is-flat b, #mkOdds .mg-table td.mg-trend.is-flat b { color: #fde68a; }
/* the "stays until the zone ends" pill is information, not a side: neutral so it never contradicts the frame colour */
.ch-push-toast .cpt-hold-pill { background: rgba(148, 163, 184, .18) !important; color: #e2e8f0 !important; border-color: rgba(148, 163, 184, .4) !important; }
html[data-theme="light"] .ch-push-toast .cpt-hold-pill { color: #142f49 !important; }
/* ===== v204 · combined-conditions stats + alert headline hierarchy (Audi 2026-10-25) ===== */
#panel-chart .mg-table .mg-hit, #panel-data .mg-table .mg-hit, #mkOdds .mg-table .mg-hit { display: block; margin-top: 2px; font-size: .76rem; color: #bdcde2; }
#panel-chart .mg-table tr.mg-combo, #panel-data .mg-table tr.mg-combo, #mkOdds .mg-table tr.mg-combo { background: linear-gradient(90deg, rgba(226, 201, 143, .1), transparent 70%) !important; box-shadow: inset 3px 0 0 #e2c98f; }
#panel-chart .mg-table tr.mg-combo th, #panel-data .mg-table tr.mg-combo th, #mkOdds .mg-table tr.mg-combo th { color: #fde68a !important; }
#panel-chart .mg-table tr.mg-combo .mg-two, #panel-data .mg-table tr.mg-combo .mg-two, #mkOdds .mg-table tr.mg-combo .mg-two { display: block; margin-top: 3px; font-size: .76rem; color: #bdcde2; }
#panel-chart .mg-table td.mg-combo-note, #panel-data .mg-table td.mg-combo-note, #mkOdds .mg-table td.mg-combo-note { font: 600 .84rem/1.45 var(--aku-font-body); color: #e2e8f0; }
#panel-chart .mg-table b.is-good, #panel-data .mg-table b.is-good, #mkOdds .mg-table b.is-good { color: #6ee7b7; } #panel-chart .mg-table b.is-bad, #panel-data .mg-table b.is-bad, #mkOdds .mg-table b.is-bad { color: #fda4af; } #panel-chart .mg-table b.is-flat, #panel-data .mg-table b.is-flat, #mkOdds .mg-table b.is-flat { color: #fde68a; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table .mg-hit, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table tr.mg-combo .mg-two, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table .mg-hit, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table tr.mg-combo .mg-two, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table .mg-hit, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table tr.mg-combo .mg-two { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table tr.mg-combo th, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table tr.mg-combo th, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table tr.mg-combo th { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table td.mg-combo-note, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table td.mg-combo-note, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table td.mg-combo-note { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table b.is-good, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table b.is-good, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table b.is-good { color: #166534 !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table b.is-bad, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table b.is-bad, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table b.is-bad { color: #9f1239 !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .mg-table b.is-flat, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table b.is-flat, html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkOdds .mg-table b.is-flat { color: #92400e !important; }
/* alert: headline (what happened) big, meaning on its own line one size down */
.ch-push-toast .cpt-title { display: block; font: 800 1.05rem/1.35 var(--aku-font-head) !important; }
.ch-push-toast .cpt-sub { display: block; margin-top: 2px; font: 600 .9rem/1.45 var(--aku-font-body); color: #e2e8f0; }
.ch-push-toast .cpt-desc { font-size: .8rem !important; opacity: .9; }
html[data-theme="light"] .ch-push-toast .cpt-sub { color: #142f49; }
/* ===== v205 · lift: cabin with an LED floor display, #2 levels and the day's first walls (Audi 2026-10-25) ===== */
body:not(#akx) #main:not(#aky) .dte-elev .elv-car.is-cabin { flex-direction: column; align-items: stretch; gap: 3px; padding: 6px 8px 8px; min-width: 132px; border-radius: 12px; color: #f8fafc; background: linear-gradient(180deg, #3b4a63 0%, #1e293b 55%, #111a2b 100%); border: 1.5px solid rgba(253, 230, 138, .7); box-shadow: 0 0 0 3px rgba(245, 158, 11, .18), 0 10px 24px -8px rgba(0, 0, 0, .7), inset 0 1px 0 rgba(255, 255, 255, .18); }
body:not(#akx) #main:not(#aky) .dte-elev .elv-car.is-cabin::before { display: none; }
.dte-elev .elv-car.is-cabin .elv-led { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 4px 8px; border-radius: 7px; background: #050a12; box-shadow: inset 0 0 0 1px rgba(253, 230, 138, .25), inset 0 0 12px rgba(0, 0, 0, .8); position: relative; overflow: hidden; }
.dte-elev .elv-car.is-cabin .elv-led::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 3px); pointer-events: none; }
body:not(#akx) #main:not(#aky) .dte-elev .elv-car.is-cabin .elv-car-px { font: 800 1.15rem/1.1 var(--aku-font-mono) !important; color: #fde68a !important; text-shadow: 0 0 8px rgba(253, 230, 138, .75); letter-spacing: .02em; }
.dte-elev .elv-car.is-cabin .elv-dir { font-style: normal; font-size: .78rem; color: #94a3b8; }
.dte-elev .elv-car.is-cabin.is-dir-up .elv-dir { color: #34d399; text-shadow: 0 0 8px rgba(52, 211, 153, .8); animation: elvDirBlink 1.2s ease-in-out infinite; }
.dte-elev .elv-car.is-cabin.is-dir-down .elv-dir { color: #fb7185; text-shadow: 0 0 8px rgba(251, 113, 133, .8); animation: elvDirBlink 1.2s ease-in-out infinite; }
body:not(#akx) #main:not(#aky) .dte-elev .elv-car.is-cabin .elv-car-lbl { text-align: center; font: 700 .72rem/1.2 var(--aku-font-body); color: #cbd5e1 !important; }
.dte-elev .elv-car.is-cabin .elv-doors { display: flex; justify-content: center; gap: 2px; height: 4px; }
.dte-elev .elv-car.is-cabin .elv-doors i { flex: 1; border-radius: 2px; background: linear-gradient(90deg, rgba(203, 213, 225, .45), rgba(148, 163, 184, .2)); }
@keyframes elvDirBlink { 50% { opacity: .35; } }
/* levels beyond the ceiling / ground */
.dte-elev .elv-beyond { display: flex; flex-direction: column; gap: 4px; margin: 4px 0; }
.dte-elev .elv-bey { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 5px 10px; border-left: 3px solid rgba(148, 163, 184, .5); background: rgba(148, 163, 184, .06); border-radius: 0 10px 10px 0; font: 600 .8rem/1.35 var(--aku-font-body); color: #cbd5e1; }
.dte-elev .elv-bey b { font: 800 .9rem var(--aku-font-mono); color: #f1f5f9; }
.dte-elev .elv-bey em { font-style: normal; } .dte-elev .elv-bey small { font: 700 .76rem var(--aku-font-mono); color: #a9b8cc; }
.dte-elev .elv-bey.is-res { border-left-color: #34d399; } .dte-elev .elv-bey.is-sup { border-left-color: #fb7185; }
.dte-elev .elv-bey.is-call { border-left-color: #34d399; } .dte-elev .elv-bey.is-put { border-left-color: #fb7185; }
.dte-elev .elv-bey.is-first { border-left-style: double; border-left-width: 5px; background: rgba(253, 230, 138, .08); box-shadow: inset 0 0 0 1px rgba(253, 230, 138, .25); }
.dte-elev .elv-bey.is-first em { color: #fde68a; font-weight: 800; }
/* marks inside the shaft for the new levels */
.dte-elev .elv-mark.is-first { color: #fde68a; } .dte-elev .elv-mark.is-first i { border-top: 2px dashed #fde68a !important; background: none !important; }
.dte-elev .elv-mark.is-call:not(.is-first) { color: #6ee7b7; } .dte-elev .elv-mark.is-put:not(.is-first) { color: #fda4af; }
html[data-motion=paused] .dte-elev .elv-dir { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .dte-elev .elv-dir { animation: none !important; } }
/* daylight */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-car.is-cabin { background: linear-gradient(180deg, #ffffff 0%, #e8eef6 100%); border-color: #b45309; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-car.is-cabin .elv-car-lbl { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-bey { color: #3d546c !important; background: rgba(20, 47, 73, .04); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-bey b { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-bey small { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-bey.is-first em, html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-first { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-call:not(.is-first) { color: #166534 !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-put:not(.is-first) { color: #9f1239 !important; }
.dte-elev .elv-bey.is-wait { opacity: .85; } .dte-elev .elv-bey.is-wait em { font-weight: 600 !important; color: #e2e8f0 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-bey.is-wait em { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-floor.is-ceiling .elv-px { color: #14532d !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-floor.is-ground .elv-px { color: #881337 !important; }

/* ===== v208 · 📊 Data tab (Audi 2026-10-25: "data จะโชว์ data ตลาดที่ AI เก็บทุกวัน, AI PAPER trade แล้วก็ที่เรากำลังจะเพิ่มเข้าไป") ===== */
#panel-data .data-jump { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 4px 0 18px; padding-bottom: 8px; border-bottom: 1px solid rgba(226, 201, 143, .16); }
#panel-data .data-jump a { --dj: #e6bf6f; color: #e6edf7; text-decoration: none; font: 700 .92rem/1.4 var(--aku-font-body); padding: 6px 2px; border-bottom: 2px solid color-mix(in srgb, var(--dj) 55%, transparent); transition: border-color .2s, color .2s; }
#panel-data .data-jump a:hover, #panel-data .data-jump a:focus-visible { border-bottom-color: var(--dj); color: #fff; }
#panel-data .data-zone { --dz: #e6bf6f; position: relative; margin: 0 0 34px; padding-top: 18px; border-top: 3px solid var(--dz); scroll-margin-top: 120px; }
#panel-data .data-zone > .panel-subhead:first-child, #panel-data .data-zone #chStatsSection > .panel-subhead, #panel-data #dataWallsRoot > .panel-subhead { margin-top: 0; }
/* backtest: each filter on its own */
#panel-chart .mg-solo, #panel-data .mg-solo, #mkOdds .mg-solo { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 6px; }
#panel-data .mg-solo i { font-style: normal; font-size: .8rem; color: #c9d6e6; padding-left: 8px; border-left: 3px solid #64748b; }
#panel-data .mg-solo i.is-good { border-left-color: #34d399; } #panel-data .mg-solo i.is-bad { border-left-color: #fb7185; } #panel-data .mg-solo i.is-flat { border-left-color: #fbbf24; }
#panel-data .mg-solo i b { font-family: var(--aku-font-mono); color: #f4f6fc; }
/* 📌 first wall of the day */
#panel-data .fw-score { --z: #fb7185; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 22px; align-items: center; }
#panel-data .fw-big b { display: block; font: 800 clamp(1.6rem, 3.4vw, 2.3rem)/1.1 var(--aku-font-head); color: #f4f6fc; font-variant-numeric: tabular-nums; }
#panel-data .fw-big span { display: block; margin-top: 4px; color: #bdcde2; font-size: .88rem; }
#panel-data .fw-big.is-good { --zi: #34d399; } #panel-data .fw-big.is-good b { color: #6ee7b7; }
#panel-data .fw-big.is-flat { --zi: #fbbf24; } #panel-data .fw-big.is-flat b { color: #fde68a; }
#panel-data .fw-big.is-bad { --zi: #fb7185; } #panel-data .fw-big.is-bad b { color: #fda4af; }
#panel-data .fw-big.is-few { --zi: #94a3b8; }
#panel-data .fw-side { display: grid; gap: 6px; --zi: #e6bf6f; }
#panel-data .fw-side i { font-style: normal; font-weight: 700; font-size: .9rem; } #panel-data .fw-side i.is-put { color: #fda4af; } #panel-data .fw-side i.is-call { color: #6ee7b7; }
#panel-data .fw-note { margin: 10px 0 0; color: #fde68a; font-size: .86rem; }
#panel-data .fw-days { margin-top: 12px; }
#panel-data .fw-table td b { font-weight: 800; margin-left: 6px; white-space: nowrap; }
#panel-data .fw-hit { color: #6ee7b7; } #panel-data .fw-near { color: #fde68a; } #panel-data .fw-miss { color: #fda4af; }
#panel-data .fw-table th small { display: block; color: #a9b8cc; font-weight: 500; font-size: .76rem; }
#panel-data .fw-live th { color: #7dd3fc; }
@media (max-width: 720px) { #panel-data .fw-score { grid-template-columns: 1fr 1fr; } #panel-data .fw-side { grid-column: 1 / -1; } }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .data-jump a { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-solo i { color: #3d546c !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-solo i b { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-big b { color: #142f49 !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-big span { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-big.is-good b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-hit, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-side i.is-call { color: #166534 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-big.is-flat b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-near, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-note { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-big.is-bad b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-miss, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-side i.is-put { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-table th small { color: #3d546c !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-live th { color: #0369a1 !important; }
#panel-data .fw-late { opacity: .62; } #panel-data .fw-late th small { color: #fde68a; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .fw-late th small { color: #92400e !important; }
/* 🔍 Audi's reads tested */
#panel-data .obs-h { margin: 14px 0 6px; font: 700 1rem/1.4 var(--aku-font-head); color: #e6edf7; }
#panel-data .obs-verdict { margin: 8px 0 4px; padding-left: 12px; border-left: 3px solid #fbbf24; color: #fde68a; font-weight: 700; font-size: .92rem; }
#panel-data .obs-verdict.is-good { border-left-color: #34d399; color: #6ee7b7; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .obs-h { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .obs-verdict { color: #92400e !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .obs-verdict.is-good { color: #166534 !important; }
#panel-data .obs-sub { margin: 10px 0 4px; color: #bdcde2; font-size: .86rem; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .obs-sub { color: #3d546c !important; }

/* ===== v209 · 🎯 โอกาสตอนนี้ (live-market tab) — zone card, today's reads as chips, a ladder of matching past days ===== */
#panel-market #mkOdds.odds-box { --z: #22d3ee; margin: 14px 0 16px; }
#panel-market #mkOdds .odds-head .gx-title { margin: 0 0 2px; font: 800 clamp(1.15rem, 2vw, 1.4rem)/1.3 var(--aku-font-head); color: #f4f6fc; }
#panel-market #mkOdds .odds-head .gx-sub { margin: 0 0 10px; color: #bdcde2; font-size: .86rem; }
#panel-market #mkOdds .odds-chips { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0 0 10px; }
#panel-market #mkOdds .odds-chips span { padding-left: 10px; border-left: 3px solid #22d3ee; color: #e6edf7; font-weight: 700; font-size: .9rem; }
#panel-market #mkOdds .odds-early { margin: 4px 0 10px; color: #fde68a; font-size: .88rem; }
#panel-market #mkOdds .mg-table th small { display: block; color: #a9b8cc; font-weight: 500; font-size: .76rem; }
#panel-market #mkOdds .mg-table td.mg-trend span { color: #a9b8cc; font-size: .78rem; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-head .gx-title, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-chips span { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-head .gx-sub, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table th small, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table td.mg-trend span { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-early { color: #92400e !important; }
#panel-market #mkOdds .mg-table td.mg-trend.is-info b { color: #c7d2fe; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table td.mg-trend.is-info b { color: #3730a3 !important; }
#panel-data .fw-moves-head { margin-top: 22px; }
#panel-data .mg-table td.mg-trend.is-info b { color: #c7d2fe; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .mg-table td.mg-trend.is-info b { color: #3730a3 !important; }
/* v210 · 🎯 box after the cold read: verdict line → big numbers → folded detail */
#panel-market #mkOdds .odds-verdict { margin: 4px 0 12px; padding: 8px 12px; border-left: 4px solid #fbbf24; background: rgba(251, 191, 36, .08); border-radius: 0 10px 10px 0; font: 700 1.02rem/1.5 var(--aku-font-body); color: #fde68a; }
#panel-market #mkOdds .odds-verdict.is-good { border-left-color: #34d399; background: rgba(16, 185, 129, .09); color: #a7f3d0; }
#panel-market #mkOdds .odds-verdict.is-bad { border-left-color: #fb7185; background: rgba(244, 63, 94, .09); color: #fecdd3; }
#panel-market #mkOdds .odds-big { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px 20px; margin: 0 0 8px; }
#panel-market #mkOdds .odds-num { padding-left: 12px; border-left: 3px solid #64748b; }
#panel-market #mkOdds .odds-num b { display: block; font: 800 clamp(1.3rem, 2.6vw, 1.75rem)/1.15 var(--aku-font-head); color: #f4f6fc; font-variant-numeric: tabular-nums; }
#panel-market #mkOdds .odds-num span { display: block; margin-top: 3px; color: #bdcde2; font-size: .84rem; line-height: 1.45; }
#panel-market #mkOdds .odds-num.is-good { border-left-color: #34d399; } #panel-market #mkOdds .odds-num.is-good b { color: #6ee7b7; }
#panel-market #mkOdds .odds-num.is-bad { border-left-color: #fb7185; } #panel-market #mkOdds .odds-num.is-bad b { color: #fda4af; }
#panel-market #mkOdds .odds-num.is-flat { border-left-color: #fbbf24; } #panel-market #mkOdds .odds-num.is-flat b { color: #fde68a; }
#panel-market #mkOdds .odds-num.is-info { border-left-color: #818cf8; } #panel-market #mkOdds .odds-num.is-info b { color: #c7d2fe; }
#panel-market #mkOdds .odds-note { margin: 2px 0 6px; color: #a9b8cc; font-size: .82rem; }
#panel-market #mkOdds .odds-reads { margin: 10px 0 8px; padding: 0; list-style: none; display: grid; gap: 4px; }
#panel-market #mkOdds .odds-reads li { padding-left: 10px; border-left: 3px solid #22d3ee; color: #e6edf7; font-size: .9rem; }
#panel-market #mkOdds .odds-table tr.odds-best th { color: #fde68a; } #panel-market #mkOdds .odds-table th em { font-style: normal; font-size: .76rem; color: #fde68a; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-verdict { color: #92400e !important; background: rgba(217, 119, 6, .08) !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-verdict.is-good { color: #166534 !important; background: rgba(21, 128, 61, .08) !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-verdict.is-bad { color: #9f1239 !important; background: rgba(190, 18, 60, .07) !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-reads li { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num span, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-note { color: #3d546c !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num.is-good b { color: #166534 !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num.is-bad b { color: #9f1239 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num.is-flat b, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-table tr.odds-best th, html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-table th em { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num.is-info b { color: #3730a3 !important; }
#panel-market #mkOdds .odds-verdict b { display: block; font-size: 1.05rem; } #panel-market #mkOdds .odds-verdict span { display: block; margin-top: 4px; font-weight: 500; font-size: .92rem; } #panel-market #mkOdds .odds-verdict span b { display: inline; font-weight: 800; }
#panel-market #mkOdds .odds-table th em.odds-skip { color: #a9b8cc; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-table th em.odds-skip { color: #3d546c !important; }
/* v211 · signal table + 1m flow: verdict first, rules folded, no sideways scroll for a few pixels */
#panel-data .sig-verdict { margin: 6px 0 10px; padding: 8px 12px; border-left: 4px solid #fbbf24; background: rgba(251, 191, 36, .07); border-radius: 0 10px 10px 0; }
#panel-data .sig-verdict b { display: block; color: #fde68a; font-size: 1rem; }
#panel-data .sig-verdict span { display: block; margin-top: 3px; font-size: .9rem; color: #e6edf7; }
#panel-data .sig-verdict span.is-good { color: #a7f3d0; } #panel-data .sig-verdict span.is-bad { color: #fecdd3; }
#panel-data .sig-how-list { margin: 6px 0 0; padding-left: 18px; display: grid; gap: 4px; }
#panel-data .mg-table td small.mg-hit { display: block; }
#panel-data .data-mtf { margin-top: 26px; }
@media (min-width: 900px) { #panel-data .mg-tablewrap { overflow-x: visible; } #panel-data .mg-table { width: 100%; table-layout: auto; } }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .sig-verdict b { color: #92400e !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .sig-verdict span { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .sig-verdict span.is-good { color: #166534 !important; } html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .sig-verdict span.is-bad { color: #9f1239 !important; }
#panel-data .obs-card .mg-table td, #panel-data .obs-card .mg-table th { white-space: normal; }
#panel-data .obs-card .mg-table td:last-child { min-width: 220px; }
#panel-data .wk-verdict { margin: 10px 0 0; padding-left: 12px; border-left: 3px solid #fbbf24; color: #fde68a; font-size: .9rem; font-weight: 600; }
#panel-data .obs-how, #panel-data .data-glossary { margin: 4px 0 10px; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .wk-verdict { color: #92400e !important; }
/* v212 · Data tab grouped by question (Audi 2026-10-26: "หน้า Data จัดให้มันดีอ่านง่ายหน่อยไหม") */
#panel-data .data-grp { margin: 30px 0 12px; padding-top: 14px; border-top: 3px solid rgba(226, 201, 143, .35); scroll-margin-top: 120px; }
#panel-data .data-grp:first-child { margin-top: 4px; }
#panel-data .data-grp-h { margin: 0; font: 800 clamp(1.25rem, 2.2vw, 1.55rem)/1.25 var(--aku-font-head); color: #f4f6fc; }
#panel-data .data-grp-sub { margin: 4px 0 0; color: #bdcde2; font-size: .9rem; }
#panel-data #dgNormal { border-top-color: #38bdf8; } #panel-data #dgTp { border-top-color: #34d399; } #panel-data #dgSig { border-top-color: #fbbf24; } #panel-data #dgAudi { border-top-color: #22d3ee; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .data-grp-h { color: #142f49 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-data .data-grp-sub { color: #3d546c !important; }

/* v213 · ☑️ checklist that feels like one: the whole row ticks, box on the left, "เหตุผล ›" opens the detail (Audi 2026-10-26) */
#panel-playbook #playbookList .rule { display: grid !important; grid-template-columns: 30px minmax(0, 1fr) auto auto; align-items: center !important; gap: 12px !important; cursor: pointer; }
#panel-playbook #playbookList .rule .rule-check { width: 28px; height: 28px; margin: 0; border-radius: 8px; border: 2px solid rgba(226, 201, 143, .55); display: grid; place-items: center; font: 900 1rem/1 var(--aku-font-body); color: #062a1c; transition: background .2s, border-color .2s, transform .2s; }
#panel-playbook #playbookList .rule.is-done .rule-check { background: #34d399; border-color: #34d399; animation: pbTick .35s var(--aku-ease, ease-out); }
#panel-playbook #playbookList .rule:hover .rule-check { border-color: #fde68a; }
#panel-playbook #playbookList .rule:focus-visible { outline: 2px solid #fde68a; outline-offset: 2px; }
#panel-playbook #playbookList .rule-info { padding: 4px 10px; border: 1px solid rgba(148, 163, 184, .45); border-radius: 999px; background: none; color: #c7d2fe; font: 600 .78rem/1.4 var(--aku-font-body); cursor: pointer; white-space: nowrap; }
#panel-playbook #playbookList .rule-info:hover { border-color: #c7d2fe; color: #fff; }
#panel-playbook .today-bar .pb-note { flex-basis: 100%; color: #a9b8cc; font-size: .8rem; }
@keyframes pbTick { 0% { transform: scale(.7); } 60% { transform: scale(1.15); } 100% { transform: scale(1); } }
html[data-motion=paused] #panel-playbook .rule .rule-check { animation: none !important; }
@media (prefers-reduced-motion: reduce) { #panel-playbook .rule .rule-check { animation: none !important; } }
@media (max-width: 640px) { #panel-playbook #playbookList .rule { grid-template-columns: 30px minmax(0, 1fr) auto; } #panel-playbook #playbookList .rule .chip { grid-column: 2; justify-self: start; } #panel-playbook #playbookList .rule-info { grid-column: 3; grid-row: 1; } }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-playbook #playbookList .rule .rule-check { border-color: #92400e; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-playbook #playbookList .rule.is-done .rule-check { background: #15803d; border-color: #15803d; color: #fff !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-playbook #playbookList .rule-info { color: #3730a3 !important; border-color: #6366f1; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-playbook .today-bar .pb-note { color: #3d546c !important; }
#panel-playbook #todayBar a.aku-cta, #panel-playbook #todayBar a.aku-cta span { color: #1b1305 !important; }
/* v214 · gold buttons stay gold on hover (Audi 2026-10-26: "ปุ่ม ✏️ แก้ไข สีทองตอนชี้เป็นสี navy blue นี่ยังใช้อยู่อีกหรอ ฉันบอกว่าไม่ชอบ")
   an older .btn-primary:hover painted a blue gradient that the gold base rule never overrode */
.btn-primary:hover, .btn-primary:focus-visible { background: linear-gradient(180deg, #fcd34d 0%, #fbbf24 55%, #f59e0b 100%) !important; border-color: rgba(254, 240, 138, .95) !important; color: #1c1004 !important; }
/* checklist: the box ticks, the text opens */
#panel-playbook #playbookList .rule { grid-template-columns: 44px minmax(0, 1fr) auto auto; gap: 8px 12px !important; cursor: default; }
#panel-playbook #playbookList .rule-check-hit { width: 44px; height: 44px; margin: -6px 0 -6px -6px; display: grid; place-items: center; background: none; border: 0; border-radius: 10px; cursor: pointer; }
#panel-playbook #playbookList .rule-check-hit:focus-visible { outline: 2px solid #fde68a; outline-offset: 1px; }
#panel-playbook #playbookList .rule-check-hit:hover .rule-check { border-color: #fde68a; }
#panel-playbook #playbookList .rule-body { cursor: pointer; }
#panel-playbook #playbookList .rule-body:hover .rule-text { text-decoration: underline; text-decoration-color: rgba(253, 230, 138, .6); text-underline-offset: 3px; }
@media (max-width: 640px) { #panel-playbook #playbookList .rule { grid-template-columns: 44px minmax(0, 1fr) auto; } }

/* v215 · ☑️ Action-first checklist headings + website tab jump pills (Audi 2026-10-26: "แล้วทำให้มันสัมพันธ์กับการใช้เว้ปนี้ด้วยไหม บางหัวข้อ่านแล้วงง ควรเปลี่ยนชื่อหัวข้อชไหม เช่น ดู MACD ทุกกรอบ D พวก 🌅 ก่อนตลาดเปิด เราก็เป้นหัวข้อ เช่น ดูMACD 15m 30m 1h D ก่อนดูภาพใหญ่ , ดูGexตอนตลาดเปิด , ดูsentimentตลาดก่อน อะไรีง้ไหม") */
#panel-playbook #playbookList .rule {
  grid-template-columns: 44px minmax(0, 1fr) auto auto !important;
  gap: 6px 12px !important;
  padding: 12px 16px !important;
  align-items: center !important;
}
#panel-playbook #playbookList .rule-check-hit {
  grid-column: 1;
  grid-row: 1 / span 2;
  margin: 0 !important;
  align-self: center;
}
#panel-playbook #playbookList .rule-body {
  grid-column: 2;
  grid-row: 1;
}
#panel-playbook #playbookList .rule-text {
  font-size: .96rem;
  font-weight: 700;
  line-height: 1.45;
  color: #f4f6fc;
}
#panel-playbook #playbookList .rule.is-done .rule-text {
  color: #94a3b8;
}
#panel-playbook #playbookList .rule > .chip {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
}
#panel-playbook #playbookList .rule > .rule-info {
  grid-column: 4;
  grid-row: 1;
  justify-self: end;
}
#panel-playbook #playbookList .rule-tab {
  grid-column: 2 / 5;
  grid-row: 2;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid rgba(56, 189, 248, .38);
  background: rgba(14, 116, 144, .18);
  color: #bae6fd;
  font: 600 .78rem/1.35 var(--aku-font-body);
  cursor: pointer;
  transition: background .18s, border-color .18s, color .18s, transform .18s;
}
#panel-playbook #playbookList .rule-tab:hover,
#panel-playbook #playbookList .rule-tab:focus-visible {
  background: rgba(14, 116, 144, .34);
  border-color: #38bdf8;
  color: #fff;
  transform: translateX(2px);
  outline: none;
}
.dv-rule-hero {
  margin-bottom: 14px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(226, 201, 143, .32);
  background: rgba(15, 23, 42, .75);
}
.dv-rule-hero > p > b {
  display: block;
  margin-bottom: 8px;
  color: #fde68a;
  font-size: .92rem;
}
.dv-rule-bullets {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
  color: #e6edf7;
  font-size: .94rem;
  line-height: 1.55;
}
.dv-rule-web-bar {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(148, 163, 184, .22);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  font-size: .86rem;
  color: #cbd5e1;
}
@media (max-width: 640px) {
  #panel-playbook #playbookList .rule {
    grid-template-columns: 44px minmax(0, 1fr) auto !important;
    gap: 8px 10px !important;
  }
  #panel-playbook #playbookList .rule-check-hit {
    grid-column: 1;
    grid-row: 1;
    align-self: start;
  }
  #panel-playbook #playbookList .rule-body {
    grid-column: 2 / 4;
    grid-row: 1;
  }
  #panel-playbook #playbookList .rule-tab {
    grid-column: 2 / 4;
    grid-row: 2;
  }
  #panel-playbook #playbookList .rule > .chip {
    grid-column: 2;
    grid-row: 3;
    justify-self: start;
  }
  #panel-playbook #playbookList .rule > .rule-info {
    grid-column: 3;
    grid-row: 3;
    justify-self: end;
  }
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-playbook #playbookList .rule-text {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-playbook #playbookList .rule.is-done .rule-text {
  color: #64748b !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-playbook #playbookList .rule-tab {
  background: rgba(2, 132, 199, .1) !important;
  border-color: rgba(2, 132, 199, .42) !important;
  color: #075985 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-playbook #playbookList .rule-tab:hover {
  background: rgba(2, 132, 199, .18) !important;
  color: #0c4a6e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dv-rule-hero {
  background: #f8fafc !important;
  border-color: rgba(180, 130, 35, .35) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dv-rule-hero > p > b {
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dv-rule-bullets,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dv-rule-web-bar {
  color: #1e293b !important;
}

/* ==========================================================================
   V217 — STEP-BY-STEP DEFAULT SETUP (#panel-setups): ZERO PILL CLOUD,
          LARGE HEADINGS, VERTICAL 1->2->3->4 TIMELINE, EMERALD A+ CTA
   ========================================================================== */
#panel-setups .def-head-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
}
#panel-setups .def-quiet-btn {
  appearance: none;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 6px 4px !important;
  font-family: var(--font-body);
  font-size: .88rem;
  font-weight: 600;
  color: var(--muted);
  cursor: pointer;
  transition: color .16s ease;
}
#panel-setups .def-quiet-btn:hover {
  color: var(--text);
  text-decoration: underline;
}
#panel-setups #setupsList {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}
#panel-setups .def-setup-card {
  padding: 0 !important;
  border-radius: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Catalog Header & 4-Setup Switcher (Hero Default GEX + on Row 1 · GEX − / After Midnight / Conflict on Row 2) */
#panel-setups .def-catalog-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  padding: 2px 2px 0;
}
#panel-setups .def-catalog-head-txt {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
#panel-setups .def-catalog-head-txt b {
  font-family: var(--font-head);
  font-size: 1.04rem;
  font-weight: 800;
  color: var(--text);
}
#panel-setups .def-catalog-head-txt span {
  font-size: .88rem;
  color: var(--muted);
  line-height: 1.48;
}
#panel-setups .def-catalog-head-txt strong {
  color: rgb(110, 231, 183);
  font-weight: 800;
}

#panel-setups .def-case-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
#panel-setups .def-case-tab {
  appearance: none;
  border: 1px solid rgba(148, 163, 184, .22);
  background: rgba(15, 23, 42, .66);
  border-radius: 16px;
  padding: 16px 18px;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  text-align: left;
  color: var(--text);
  cursor: pointer;
  transition: transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
#panel-setups .def-case-tab:hover {
  transform: translateY(-2px);
  background: rgba(30, 41, 59, .82);
  border-color: rgba(148, 163, 184, .44);
}
/* Featured Hero Card: Setup 1 (Default Setup · วัน GEX +) highlighted above all others */
#panel-setups .def-case-tab.is-default-hero {
  grid-column: 1 / -1;
  padding: 20px 22px;
  background: linear-gradient(135deg, rgba(6, 78, 59, .54), rgba(11, 24, 43, .94) 68%, rgba(120, 53, 15, .28));
  border: 1.5px solid rgba(52, 211, 153, .72);
  box-shadow: 0 12px 30px -10px rgba(16, 185, 129, .26), inset 0 1px 0 rgba(255, 255, 255, .1);
}
#panel-setups .def-case-tab.is-default-hero:hover {
  background: linear-gradient(135deg, rgba(6, 95, 70, .64), rgba(15, 23, 42, .96) 68%, rgba(146, 64, 14, .34));
  border-color: rgb(52, 211, 153);
}
#panel-setups .def-case-tab.is-pos[aria-selected="true"] {
  background: linear-gradient(135deg, rgba(6, 95, 70, .66), rgba(11, 24, 43, .95) 70%, rgba(120, 53, 15, .32));
  border-color: rgb(52, 211, 153);
  box-shadow: 0 12px 30px -8px rgba(16, 185, 129, .32), inset 0 1px 0 rgba(255, 255, 255, .14);
}
#panel-setups .def-case-tab.is-neg[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(136, 19, 55, .52), rgba(15, 23, 42, .94));
  border-color: rgb(251, 113, 133);
  box-shadow: 0 8px 22px rgba(244, 63, 94, .22), inset 0 1px 0 rgba(255, 255, 255, .1);
}
#panel-setups .def-case-tab.is-sky[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(12, 74, 110, .54), rgba(15, 23, 42, .94));
  border-color: rgb(56, 189, 248);
  box-shadow: 0 8px 22px rgba(56, 189, 248, .22), inset 0 1px 0 rgba(255, 255, 255, .1);
}
#panel-setups .def-case-tab.is-warn[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(120, 53, 15, .52), rgba(15, 23, 42, .94));
  border-color: rgb(251, 191, 36);
  box-shadow: 0 8px 22px rgba(245, 183, 59, .2), inset 0 1px 0 rgba(255, 255, 255, .1);
}

/* Zero Square Frame Behind 16-bit Pixel Sprites */
#panel-setups .def-case-px,
#panel-setups .def-now-px,
#panel-setups .sig-px,
#panel-setups .def-pt-pxbox,
#panel-setups .def-case-banner-ico {
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
#panel-setups .def-case-px {
  margin-top: 2px;
}
#panel-setups .def-case-txt {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  flex: 1 1 0%;
}
#panel-setups .def-case-toprow {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 12px;
}
#panel-setups .def-case-kicker {
  font-family: var(--font-head);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .03em;
  color: rgb(148, 163, 184);
}
#panel-setups .def-case-tab.is-default-hero .def-case-kicker,
#panel-setups .def-case-tab.is-pos[aria-selected="true"] .def-case-kicker {
  color: rgb(110, 231, 183);
}
#panel-setups .def-case-tab.is-neg .def-case-kicker {
  color: rgb(253, 164, 175);
}
#panel-setups .def-case-tab.is-sky .def-case-kicker {
  color: rgb(125, 211, 252);
}
#panel-setups .def-case-tab.is-warn .def-case-kicker {
  color: rgb(253, 230, 138);
}
#panel-setups .def-case-hero-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 11px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: .75rem;
  font-weight: 800;
  color: rgb(254, 243, 199);
  background: rgba(180, 83, 9, .48);
  border: 1px solid rgba(251, 191, 36, .62);
}
#panel-setups .def-case-title {
  font-family: var(--font-head);
  font-size: 1.02rem;
  font-weight: 800;
  line-height: 1.34;
  color: var(--text);
}
#panel-setups .def-case-tab.is-default-hero .def-case-title {
  font-size: 1.15rem;
}
#panel-setups .def-case-sub {
  font-size: .85rem;
  line-height: 1.5;
  color: var(--muted);
}
#panel-setups .def-case-tab.is-default-hero .def-case-sub {
  font-size: .91rem;
  color: rgb(226, 232, 240);
}
#panel-setups .def-case-cta {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  margin-top: 4px;
  padding: 6px 13px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: .79rem;
  font-weight: 800;
  color: rgb(226, 232, 240);
  background: rgba(30, 41, 59, .78);
  border: 1px solid rgba(148, 163, 184, .34);
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
#panel-setups .def-case-tab.is-default-hero .def-case-cta {
  font-size: .84rem;
  padding: 7px 15px;
  color: rgb(209, 250, 229);
  background: rgba(6, 95, 70, .55);
  border-color: rgba(52, 211, 153, .62);
}
#panel-setups .def-case-tab[aria-selected="true"] .def-case-cta {
  color: rgb(254, 243, 199);
  background: rgba(180, 83, 9, .45);
  border-color: rgba(251, 191, 36, .62);
}

/* Progressive Detail Container (.def-setup-detail) & Top Bar (.def-detail-bar) */
#panel-setups .def-setup-detail {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
#panel-setups .def-setup-detail[hidden] {
  display: none !important;
}
#panel-setups .def-detail-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  padding: 12px 18px;
  border-radius: 14px;
  background: rgba(15, 23, 42, .76);
  border: 1px solid rgba(148, 163, 184, .24);
}
#panel-setups .def-detail-bar-left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
#panel-setups .def-detail-bar-left small {
  display: block;
  font-family: var(--font-head);
  font-size: .73rem;
  font-weight: 800;
  color: rgb(110, 231, 183);
}
#panel-setups .def-detail-bar-left b {
  display: block;
  font-family: var(--font-head);
  font-size: .96rem;
  font-weight: 800;
  color: var(--text);
}
#panel-setups .def-detail-close {
  height: auto !important;
  min-height: 36px !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
}

#panel-setups .def-setup-steps {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
#panel-setups .def-step-box {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
}
#panel-setups .def-step-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#panel-setups .def-step-num {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  font-family: var(--font-head);
  font-size: 1.05rem;
  font-weight: 800;
  color: rgb(254, 243, 199);
  background: linear-gradient(180deg, rgba(245, 183, 59, .28), rgba(180, 118, 18, .24));
  border: 1.5px solid rgba(245, 183, 59, .62);
  box-shadow: 0 4px 12px rgba(0, 0, 0, .25);
  flex-shrink: 0;
}
#panel-setups .def-step-box[data-step="2"] .def-step-num {
  color: rgb(209, 250, 229);
  background: linear-gradient(180deg, rgba(16, 185, 129, .28), rgba(5, 150, 105, .22));
  border-color: rgba(52, 211, 153, .62);
}
#panel-setups .def-step-box[data-step="3"] .def-step-num {
  color: rgb(224, 242, 254);
  background: linear-gradient(180deg, rgba(56, 189, 248, .28), rgba(2, 132, 199, .22));
  border-color: rgba(56, 189, 248, .62);
}
#panel-setups .def-step-box[data-step="4"] .def-step-num {
  color: rgb(254, 226, 226);
  background: linear-gradient(180deg, rgba(244, 63, 94, .26), rgba(190, 18, 60, .2));
  border-color: rgba(251, 113, 133, .6);
}
#panel-setups .def-step-line {
  width: 2px;
  flex: 1 1 auto;
  min-height: 18px;
  margin-top: 8px;
  margin-bottom: -10px;
  background: linear-gradient(180deg, rgba(148, 163, 184, .38), rgba(148, 163, 184, .08));
}
#panel-setups .def-step-main {
  padding: 22px 26px;
  border-radius: 16px;
  background: rgba(10, 18, 34, .72);
  border: 1px solid rgba(148, 163, 184, .18);
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
#panel-setups .def-step-top {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px 16px;
  padding-bottom: 8px;
}
#panel-setups .def-step-heading {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
#panel-setups .def-step-title {
  margin: 0;
  font-family: var(--font-head);
  font-size: clamp(1.22rem, 1.55vw, 1.42rem) !important;
  font-weight: 800 !important;
  line-height: 1.32 !important;
  color: rgb(253, 230, 138) !important;
}
#panel-setups .def-step-box[data-step="2"] .def-step-title {
  color: rgb(110, 231, 183) !important;
}
#panel-setups .def-step-box[data-step="3"] .def-step-title {
  color: rgb(125, 211, 252) !important;
}
#panel-setups .def-step-box[data-step="4"] .def-step-title {
  color: rgb(253, 164, 175) !important;
}
#panel-setups .def-step-sub {
  margin: 0;
  font-size: .94rem !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  color: var(--text) !important;
  opacity: .92;
}

/* Unboxed Horizontal Step Rows (Zero Box-in-Box) */
#panel-setups .def-step-points {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-width: 0;
}
#panel-setups .def-pt-card {
  padding: 18px 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, .16) !important;
  box-shadow: none !important;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 16px 28px;
  min-width: 0;
  max-width: 100%;
}
#panel-setups .def-pt-card:last-child {
  padding-bottom: 4px !important;
}
#panel-setups .def-pt-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1 1 0%;
  min-width: 0;
}
#panel-setups .def-pt-head {
  display: flex;
  align-items: center;
  gap: 11px;
}
#panel-setups .def-pt-k {
  font-family: var(--font-head);
  font-size: 1.02rem !important;
  font-weight: 800 !important;
  line-height: 1.38 !important;
  color: var(--text) !important;
}
#panel-setups .def-pt-card.is-call .def-pt-k {
  color: rgb(110, 231, 183) !important;
}
#panel-setups .def-pt-card.is-put .def-pt-k {
  color: rgb(253, 164, 175) !important;
}
#panel-setups .def-pt-card.is-wait .def-pt-k,
#panel-setups .def-pt-card.is-gold .def-pt-k {
  color: rgb(253, 230, 138) !important;
}
#panel-setups .def-pt-v {
  font-size: .92rem !important;
  line-height: 1.64 !important;
  color: var(--muted) !important;
  padding-left: 35px;
}
#panel-setups .def-pt-foot {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
#panel-setups .def-pt-cta {
  width: auto !important;
  max-width: 100%;
  min-width: 0;
  height: auto !important;
  min-height: 38px !important;
  max-height: none !important;
  white-space: nowrap !important;
  justify-content: flex-start !important;
  padding: 7px 14px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-size: .82rem !important;
  font-weight: 700 !important;
  line-height: 1.32 !important;
  color: rgb(224, 242, 254) !important;
  background: rgba(14, 116, 144, .22) !important;
  border: 1px solid rgba(56, 189, 248, .38) !important;
  box-shadow: none !important;
  gap: 8px !important;
  text-align: left !important;
}
#panel-setups .def-pt-cta .aku-cta-arrow {
  margin-left: 2px !important;
  width: 22px !important;
  height: 22px !important;
  flex-shrink: 0 !important;
}
#panel-setups .def-pt-cta:hover {
  background: rgba(2, 132, 199, .36) !important;
  border-color: rgb(56, 189, 248) !important;
  color: rgb(255, 255, 255) !important;
  transform: translateY(-1px);
}
#panel-setups .def-pt-card.is-call .def-pt-cta {
  color: rgb(209, 250, 229) !important;
  background: rgba(6, 95, 70, .26) !important;
  border-color: rgba(52, 211, 153, .42) !important;
}
#panel-setups .def-pt-card.is-call .def-pt-cta:hover {
  background: rgba(5, 150, 105, .4) !important;
  border-color: rgb(52, 211, 153) !important;
}
#panel-setups .def-pt-card.is-put .def-pt-cta {
  color: rgb(255, 228, 230) !important;
  background: rgba(136, 19, 55, .26) !important;
  border-color: rgba(251, 113, 133, .42) !important;
}
#panel-setups .def-pt-card.is-put .def-pt-cta:hover {
  background: rgba(190, 18, 60, .4) !important;
  border-color: rgb(251, 113, 133) !important;
}
#panel-setups .def-pt-card.is-wait .def-pt-cta,
#panel-setups .def-pt-card.is-gold .def-pt-cta {
  color: rgb(254, 243, 199) !important;
  background: rgba(120, 53, 15, .28) !important;
  border-color: rgba(251, 191, 36, .42) !important;
}
#panel-setups .def-pt-card.is-wait .def-pt-cta:hover,
#panel-setups .def-pt-card.is-gold .def-pt-cta:hover {
  background: rgba(180, 83, 9, .42) !important;
  border-color: rgb(251, 191, 36) !important;
}

/* Deep-Link Target Offset & Spotlight Flash when jumping from Setups / Playbook */
#mkCross, #mkLevels, #mkMacd, #mkSpy, #mkBreadth, #mkEvents, #mkNews,
#gexRoot, #chRoot, #deskGo, #deskLadder, #deskSell,
#pb-pre, #pb-entry, #pb-exit, #pb-risk,
#def-step-1, #def-step-2, #def-step-3, #def-step-4 {
  scroll-margin-top: 132px;
}
@keyframes dteJumpPulse {
  0% { box-shadow: 0 0 0 0 rgba(56, 189, 248, .75), 0 0 28px rgba(56, 189, 248, .45); }
  50% { box-shadow: 0 0 0 4px rgba(245, 183, 59, .65), 0 0 34px rgba(245, 183, 59, .38); }
  100% { box-shadow: none; }
}
.dte-jump-flash {
  animation: dteJumpPulse 2.1s ease-out !important;
  border-radius: 16px;
}

/* Live Time-Phase Context Strip (.def-now-strip) & Active Step Highlight (.def-step-box.is-now) */
#panel-setups .def-now-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 16px;
  padding: 14px 18px;
  margin-bottom: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(245, 183, 59, .14), rgba(15, 23, 42, .82));
  border: 1px solid rgba(251, 191, 36, .42);
  box-shadow: none;
}
#panel-setups .def-now-strip.is-open {
  background: linear-gradient(135deg, rgba(16, 185, 129, .16), rgba(15, 23, 42, .84));
  border-color: rgba(52, 211, 153, .48);
}
#panel-setups .def-now-left {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1 1 320px;
  min-width: 0;
}
@keyframes defNowDotPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.26); opacity: .65; }
}
#panel-setups .def-now-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgb(251, 191, 36);
  box-shadow: 0 0 10px rgba(251, 191, 36, .85);
  flex-shrink: 0;
  animation: defNowDotPulse 2s ease-in-out infinite;
}
#panel-setups .def-now-strip.is-open .def-now-dot {
  background: rgb(52, 211, 153);
  box-shadow: 0 0 10px rgba(52, 211, 153, .85);
}
#panel-setups .def-now-txt {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
#panel-setups .def-now-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
}
#panel-setups .def-now-time {
  display: inline-flex;
  align-items: center;
  padding: 2px 9px;
  border-radius: 999px;
  font-family: var(--mono);
  font-size: .75rem;
  font-weight: 700;
  color: rgb(253, 230, 138);
  background: rgba(120, 53, 15, .45);
  border: 1px solid rgba(251, 191, 36, .42);
}
#panel-setups .def-now-strip.is-open .def-now-time {
  color: rgb(167, 243, 208);
  background: rgba(6, 95, 70, .45);
  border-color: rgba(52, 211, 153, .45);
}
#panel-setups .def-now-title {
  font-family: var(--font-head);
  font-size: .98rem !important;
  font-weight: 800 !important;
  color: var(--text) !important;
  line-height: 1.35;
}
#panel-setups .def-now-sub {
  margin: 0;
  font-size: .86rem !important;
  line-height: 1.5 !important;
  color: var(--muted) !important;
}
#panel-setups .def-now-jump {
  height: auto !important;
  min-height: 36px !important;
  max-height: none !important;
  padding: 6px 13px !important;
  border-radius: 999px !important;
  font-family: var(--font-head) !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
  color: rgb(254, 243, 199) !important;
  background: rgba(180, 83, 9, .34) !important;
  border: 1px solid rgba(251, 191, 36, .52) !important;
  flex-shrink: 0;
}
#panel-setups .def-now-jump:hover {
  background: rgba(217, 119, 6, .5) !important;
  border-color: rgb(251, 191, 36) !important;
}
#panel-setups .def-step-box.is-now .def-step-main {
  border: 1.5px solid rgba(251, 191, 36, .68) !important;
  background: linear-gradient(180deg, rgba(245, 183, 59, .08), rgba(10, 18, 34, .82)) !important;
  box-shadow: 0 12px 28px -12px rgba(245, 183, 59, .24) !important;
}
#panel-setups .def-step-box.is-now .def-step-num {
  box-shadow: 0 0 0 3px rgba(251, 191, 36, .32), 0 6px 14px rgba(245, 183, 59, .3) !important;
}
#panel-setups .def-step-now-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  padding: 3px 11px;
  margin-bottom: 2px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .01em;
  color: rgb(254, 243, 199);
  background: rgba(180, 83, 9, .48);
  border: 1px solid rgba(251, 191, 36, .6);
}

@media (max-width: 960px) {
  #panel-setups .def-case-tabs {
    grid-template-columns: 1fr !important;
  }
  #panel-setups .def-pt-card {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  #panel-setups .def-pt-body {
    flex: 0 0 auto;
    width: 100%;
  }
}
@media (max-width: 640px) {
  #panel-setups .def-step-box {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 10px;
  }
  #panel-setups .def-step-main {
    padding: 16px 16px;
  }
  #panel-setups .def-step-num {
    width: 30px;
    height: 30px;
    font-size: .9rem;
  }
  #panel-setups .def-pt-v {
    padding-left: 0;
  }
  #panel-setups .def-pt-cta {
    white-space: normal !important;
  }
  #panel-setups .def-now-jump {
    width: 100%;
    justify-content: space-between !important;
  }
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-setup-card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tabs {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab {
  background: rgba(255, 255, 255, .94) !important;
  border-color: rgba(15, 23, 42, .14) !important;
  color: rgb(15, 23, 42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-default-hero {
  background: linear-gradient(135deg, rgba(209, 250, 229, .94), rgba(255, 255, 255, .98) 66%, rgba(254, 243, 199, .78)) !important;
  border-color: rgb(5, 150, 105) !important;
  box-shadow: 0 10px 26px -10px rgba(5, 150, 105, .22) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-pos[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(209, 250, 229, .96), rgba(236, 253, 245, .98)) !important;
  border-color: rgb(5, 150, 105) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-neg[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(255, 228, 230, .95), rgba(255, 241, 242, .98)) !important;
  border-color: rgb(225, 29, 72) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sky[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(224, 242, 254, .95), rgba(240, 249, 255, .98)) !important;
  border-color: rgb(2, 132, 199) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-warn[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(254, 243, 199, .95), rgba(255, 251, 235, .98)) !important;
  border-color: rgb(217, 119, 6) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-banner-ico,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-pxbox {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-catalog-head-txt strong {
  color: rgb(6, 95, 70) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-kicker {
  color: rgb(71, 85, 105) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-default-hero .def-case-kicker,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-pos[aria-selected="true"] .def-case-kicker {
  color: rgb(6, 95, 70) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-neg .def-case-kicker {
  color: rgb(159, 18, 57) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sky .def-case-kicker {
  color: rgb(7, 89, 133) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-warn .def-case-kicker {
  color: rgb(146, 64, 14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-default-hero .def-case-sub {
  color: rgb(30, 41, 59) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-hero-pill {
  color: rgb(120, 53, 15) !important;
  background: rgba(254, 243, 199, .95) !important;
  border-color: rgba(217, 119, 6, .52) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-cta {
  color: rgb(30, 41, 59) !important;
  background: rgba(241, 245, 249, .92) !important;
  border-color: rgba(15, 23, 42, .18) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-default-hero .def-case-cta {
  color: rgb(6, 95, 70) !important;
  background: rgba(209, 250, 229, .9) !important;
  border-color: rgba(5, 150, 105, .45) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab[aria-selected="true"] .def-case-cta {
  color: rgb(120, 53, 15) !important;
  background: rgba(254, 243, 199, .92) !important;
  border-color: rgba(217, 119, 6, .52) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-detail-bar {
  background: rgba(255, 255, 255, .96) !important;
  border-color: rgba(15, 23, 42, .14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-detail-bar-left small {
  color: rgb(6, 95, 70) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-main {
  background: rgba(255, 255, 255, .96) !important;
  border-color: rgba(15, 23, 42, .14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-title {
  color: rgb(146, 64, 14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="2"] .def-step-title {
  color: rgb(6, 95, 70) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="3"] .def-step-title {
  color: rgb(7, 89, 133) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="4"] .def-step-title {
  color: rgb(159, 18, 57) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(15, 23, 42, .12) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-call .def-pt-k {
  color: rgb(6, 95, 70) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-put .def-pt-k {
  color: rgb(159, 18, 57) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-wait .def-pt-k,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-gold .def-pt-k {
  color: rgb(146, 64, 14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-num {
  color: rgb(120, 53, 15) !important;
  background: rgba(254, 243, 199, .9) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="2"] .def-step-num {
  color: rgb(6, 95, 70) !important;
  background: rgba(209, 250, 229, .9) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="3"] .def-step-num {
  color: rgb(7, 89, 133) !important;
  background: rgba(224, 242, 254, .9) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="4"] .def-step-num {
  color: rgb(159, 18, 57) !important;
  background: rgba(255, 228, 230, .9) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-cta {
  background: rgba(224, 242, 254, .75) !important;
  border-color: rgba(2, 132, 199, .38) !important;
  color: rgb(7, 89, 133) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-call .def-pt-cta {
  background: rgba(209, 250, 229, .75) !important;
  border-color: rgba(5, 150, 105, .38) !important;
  color: rgb(6, 95, 70) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-put .def-pt-cta {
  background: rgba(255, 228, 230, .75) !important;
  border-color: rgba(225, 29, 72, .38) !important;
  color: rgb(159, 18, 57) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-wait .def-pt-cta,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-gold .def-pt-cta {
  background: rgba(254, 243, 199, .78) !important;
  border-color: rgba(217, 119, 6, .42) !important;
  color: rgb(146, 64, 14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-strip {
  background: linear-gradient(135deg, rgba(254, 243, 199, .92), rgba(255, 255, 255, .98)) !important;
  border-color: rgba(217, 119, 6, .45) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-strip.is-open {
  background: linear-gradient(135deg, rgba(209, 250, 229, .9), rgba(255, 255, 255, .98)) !important;
  border-color: rgba(5, 150, 105, .45) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-time {
  color: rgb(120, 53, 15) !important;
  background: rgba(253, 230, 138, .65) !important;
  border-color: rgba(217, 119, 6, .42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-strip.is-open .def-now-time {
  color: rgb(6, 95, 70) !important;
  background: rgba(167, 243, 208, .65) !important;
  border-color: rgba(5, 150, 105, .42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-jump {
  color: rgb(120, 53, 15) !important;
  background: rgba(254, 243, 199, .9) !important;
  border-color: rgba(217, 119, 6, .5) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box.is-now .def-step-main {
  border: 1.5px solid rgb(217, 119, 6) !important;
  background: linear-gradient(180deg, rgba(255, 251, 235, .96), rgba(255, 255, 255, .98)) !important;
  box-shadow: 0 10px 24px -10px rgba(217, 119, 6, .18) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-now-pill {
  color: rgb(120, 53, 15) !important;
  background: rgba(253, 230, 138, .9) !important;
  border-color: rgba(217, 119, 6, .52) !important;
}

/* ==========================================================================
   v222 — SETUP INFOGRAPHIC (.setup-infographic) — UNBOXED INNER CANVAS & FOOTER
   ========================================================================== */
#panel-setups .setup-infographic {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px 24px;
  border-radius: 16px;
  background: radial-gradient(circle at 15% 0%, rgba(16, 185, 129, .12), transparent 55%),
              rgba(10, 18, 34, .78);
  border: 1px solid rgba(52, 211, 153, .34);
  box-shadow: none;
}
#panel-setups .setup-infographic.is-gex-neg {
  background: radial-gradient(circle at 15% 0%, rgba(244, 63, 94, .13), transparent 55%),
              rgba(15, 16, 30, .8);
  border-color: rgba(251, 113, 133, .38);
}
#panel-setups .setup-infographic.is-after-midnight {
  background: radial-gradient(circle at 15% 0%, rgba(56, 189, 248, .13), transparent 55%),
              rgba(10, 18, 34, .78);
  border-color: rgba(56, 189, 248, .38);
}
#panel-setups .setup-infographic.is-conflict,
#panel-setups .setup-infographic.is-conflict-mode {
  background: radial-gradient(circle at 15% 0%, rgba(245, 158, 11, .13), transparent 55%),
              rgba(18, 16, 16, .78);
  border-color: rgba(251, 191, 36, .4);
}

#panel-setups .sig-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px 16px;
  flex-wrap: wrap;
}
#panel-setups .sig-head-left {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  min-width: 0;
  flex: 1 1 380px;
}
#panel-setups .sig-head-txt {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
#panel-setups .sig-kicker {
  font-family: var(--font-head);
  font-size: .74rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgb(110, 231, 183);
}
#panel-setups .setup-infographic.is-gex-neg .sig-kicker {
  color: rgb(253, 164, 175);
}
#panel-setups .setup-infographic.is-after-midnight .sig-kicker {
  color: rgb(125, 211, 252);
}
#panel-setups .setup-infographic.is-conflict .sig-kicker {
  color: rgb(253, 224, 71);
}
#panel-setups .sig-title {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1.08rem;
  font-weight: 900;
  line-height: 1.35;
  color: rgb(248, 250, 252);
}
#panel-setups .sig-sub {
  margin: 0;
  font-size: .88rem;
  line-height: 1.54;
  color: rgb(203, 213, 225);
}

#panel-setups .sig-pills {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
#panel-setups .sig-pill {
  display: inline-flex;
  align-items: center;
  padding: 5px 11px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: .76rem;
  font-weight: 800;
  line-height: 1.2;
  border: 1px solid rgba(148, 163, 184, .32);
  background: rgba(15, 23, 42, .65);
  color: rgb(226, 232, 240);
}
#panel-setups .sig-pill.is-emerald {
  color: rgb(167, 243, 208);
  background: rgba(6, 78, 59, .45);
  border-color: rgba(52, 211, 153, .45);
}
#panel-setups .sig-pill.is-sky {
  color: rgb(186, 230, 253);
  background: rgba(12, 74, 110, .45);
  border-color: rgba(56, 189, 248, .45);
}
#panel-setups .sig-pill.is-gold {
  color: rgb(254, 240, 138);
  background: rgba(120, 53, 15, .45);
  border-color: rgba(251, 191, 36, .48);
}
#panel-setups .sig-pill.is-rose {
  color: rgb(254, 205, 211);
  background: rgba(136, 19, 55, .45);
  border-color: rgba(251, 113, 133, .48);
}

#panel-setups .sig-canvas-wrap {
  width: 100%;
  border-radius: 0 !important;
  padding: 4px 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow-x: auto;
}
#panel-setups .setup-viz-svg {
  display: block;
  width: 100%;
  min-width: 0;
  height: auto;
  max-height: 276px;
  font-family: var(--font-head);
}

#panel-setups .sig-foot-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
  padding-top: 14px;
  border-top: 1px solid rgba(148, 163, 184, .18);
}
#panel-setups .sig-foot-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
#panel-setups .sig-foot-item b {
  font-family: var(--font-head);
  font-size: .88rem;
  font-weight: 800;
  color: rgb(254, 243, 199);
}
#panel-setups .sig-foot-item span {
  font-size: .84rem;
  line-height: 1.52;
  color: rgb(203, 213, 225);
}

@media (max-width: 960px) {
  #panel-setups .sig-foot-grid {
    grid-template-columns: 1fr !important;
    gap: 12px;
  }
}

html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic {
  background: linear-gradient(180deg, rgba(240, 253, 244, .92), rgba(255, 255, 255, .98)) !important;
  border-color: rgba(5, 150, 105, .36) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-gex-neg {
  background: linear-gradient(180deg, rgba(255, 241, 242, .92), rgba(255, 255, 255, .98)) !important;
  border-color: rgba(225, 29, 72, .36) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-after-midnight {
  background: linear-gradient(180deg, rgba(240, 249, 255, .92), rgba(255, 255, 255, .98)) !important;
  border-color: rgba(2, 132, 199, .36) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-conflict {
  background: linear-gradient(180deg, rgba(255, 251, 235, .92), rgba(255, 255, 255, .98)) !important;
  border-color: rgba(217, 119, 6, .38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-kicker {
  color: rgb(6, 95, 70) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-gex-neg .sig-kicker {
  color: rgb(159, 18, 57) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-after-midnight .sig-kicker {
  color: rgb(7, 89, 133) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-conflict .sig-kicker {
  color: rgb(146, 64, 14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-title {
  color: rgb(15, 23, 42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-sub {
  color: rgb(51, 65, 85) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-pill.is-emerald {
  color: rgb(6, 95, 70) !important;
  background: rgba(209, 250, 229, .88) !important;
  border-color: rgba(5, 150, 105, .38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-pill.is-sky {
  color: rgb(7, 89, 133) !important;
  background: rgba(224, 242, 254, .88) !important;
  border-color: rgba(2, 132, 199, .38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-pill.is-gold {
  color: rgb(120, 53, 15) !important;
  background: rgba(254, 243, 199, .88) !important;
  border-color: rgba(217, 119, 6, .42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-pill.is-rose {
  color: rgb(159, 18, 57) !important;
  background: rgba(255, 228, 230, .88) !important;
  border-color: rgba(225, 29, 72, .42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-foot-grid {
  border-top-color: rgba(15, 23, 42, .12) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-foot-item {
  background: transparent !important;
  border: 0 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-foot-item b {
  color: rgb(15, 23, 42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-foot-item span {
  color: rgb(51, 65, 85) !important;
}

/* ==========================================================================
   V224 — #panel-market (📡 ตลาดสด · SPY & GEX) CATALOGUE B SURFACES,
          V11 CONTROLS, 16-BIT SPRITES & PIXEL CONTRAST LOCK (2026-10-28)
   ========================================================================== */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market {
  --aku-paper: #f3efe4;
  --dc-blue: oklch(from var(--aku-sky-2, #bfe0fa) .91 .045 h);
  --dc-blue-strong: #d2e6f9;
  --dc-mint: oklch(from var(--aku-accent, #10b981) .93 .06 h);
  --dc-mint-strong: #c7f3e2;
  --dc-surface: linear-gradient(125deg, var(--dc-blue), var(--aku-paper) 52%, var(--dc-mint));
  --dc-card-surface: linear-gradient(145deg, var(--aku-paper) 35%, var(--dc-mint));
  --mk-ink: #142f49;
  --mk-copy: #3c5472;
  --mk-line: rgba(20, 47, 73, 0.22);
  --text: #142f49;
  --muted: #3d546c;
  --dte-dim: #3d546c;
  --green: #14532d;
  --red: #9f1239;
  --amber: #92400e;
  --gold: #7a5208;
  --sky: #075985;
  color: #142f49;
}

/* Frameless 16-bit pixel sprites inside #panel-market */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .ak-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-head-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-sec-px {
  display: inline-block;
  vertical-align: -3px;
  flex-shrink: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* V11 Controls inside #panel-market */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .aku-control {
  font-family: var(--aku-font-body, var(--font-body)) !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .aku-control--quiet {
  background: #ffffff !important;
  color: #142f49 !important;
  border: 1px solid rgba(20, 47, 73, 0.22) !important;
  box-shadow: 0 2px 6px rgba(20, 47, 73, 0.06) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .aku-control--quiet:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .aku-control--quiet:focus-visible {
  background: #f0f7ff !important;
  color: #0c4a6e !important;
  border-color: rgba(3, 105, 161, 0.45) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .aku-control--nav {
  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 58%, #dcfce7 100%) !important;
  color: #0c4a6e !important;
  border: 1px solid rgba(3, 105, 161, 0.34) !important;
  box-shadow: 0 4px 12px rgba(3, 105, 161, 0.10) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .aku-control--nav:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .aku-control--nav:focus-visible {
  background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 58%, #bbf7d0 100%) !important;
  color: #082f49 !important;
  border-color: rgba(3, 105, 161, 0.55) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-how-btn,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-jump-btn {
  min-height: 36px !important;
  padding: 6px 12px !important;
  border-radius: 11px !important;
}

/* Top-level Catalogue B Reading Zones in #panel-market */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .panel-head {
  --mk-tone: #0284c7;
  background: var(--dc-surface) !important;
  border: 1px solid var(--mk-line) !important;
  border-top: 3px solid var(--mk-tone) !important;
  border-radius: 18px !important;
  padding: 18px 22px !important;
  margin-bottom: 14px !important;
  box-shadow: 0 12px 28px rgba(10, 26, 46, 0.12) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .panel-head h2 {
  color: #142f49 !important;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .panel-head p {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus.mk-status,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus.status-line {
  background: var(--dc-card-surface) !important;
  background-image: var(--dc-card-surface) !important;
  border: 1px solid var(--mk-line) !important;
  border-left: 4px solid #0d9488 !important;
  border-radius: 14px !important;
  padding: 10px 16px !important;
  margin-bottom: 16px !important;
  color: #142f49 !important;
  box-shadow: 0 6px 18px rgba(10, 26, 46, 0.08) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus *,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus .st-main {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus .muted {
  color: #26405a !important;
  background: transparent !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus #mkTick {
  background: #e0f2fe !important;
  color: #0c4a6e !important;
  border: 1px solid rgba(3, 105, 161, 0.28) !important;
}

html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-grid {
  gap: 18px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkCross,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkBreadth,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds.odds-box {
  background: var(--dc-surface) !important;
  border: 1px solid var(--mk-line) !important;
  border-top: 3px solid var(--mk-tone, #0284c7) !important;
  border-right: 1px solid var(--mk-line) !important;
  border-bottom: 1px solid var(--mk-line) !important;
  border-left: 1px solid var(--mk-line) !important;
  border-radius: 18px !important;
  padding: 20px 22px !important;
  margin-top: 0 !important;
  box-shadow: 0 12px 28px rgba(10, 26, 46, 0.12) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy { --mk-tone: #10b981; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd { --mk-tone: #0284c7; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds.odds-box { --mk-tone: #0891b2; margin: 16px 0 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels { --mk-tone: #d97706; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkCross { --mk-tone: #e11d48; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkBreadth { --mk-tone: #7c3aed; }

html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market > .wrap > .mk-note {
  background: var(--dc-card-surface) !important;
  border: 1px solid var(--mk-line) !important;
  border-radius: 14px !important;
  padding: 12px 16px !important;
  margin-top: 16px !important;
  color: #3d546c !important;
}

/* Section Headings & Chips inside #panel-market */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-box.mk-open-sec > h3 {
  color: #142f49 !important;
  border-left: 5px solid var(--mk-tone, #0284c7) !important;
  border-bottom: 1px solid rgba(20, 47, 73, 0.16) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sub-inline,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-note {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .chip {
  background: #e8eef5 !important;
  color: #26405a !important;
  border-color: rgba(20, 47, 73, 0.18) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .chip.c-sky {
  background: #e0f0fd !important;
  color: #0c4a6e !important;
  border-color: rgba(3, 105, 161, 0.28) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .chip.c-gold {
  background: #fdf3d8 !important;
  color: #5c3d03 !important;
  border-color: rgba(180, 83, 9, 0.28) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .chip.c-green {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: rgba(21, 128, 61, 0.28) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .chip.c-red {
  background: #ffe4e8 !important;
  color: #881337 !important;
  border-color: rgba(190, 18, 60, 0.28) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .chip.c-amber {
  background: #ffedd5 !important;
  color: #7c2d12 !important;
  border-color: rgba(194, 65, 12, 0.28) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .chip.c-grey {
  background: #e8eef5 !important;
  color: #26405a !important;
  border-color: rgba(20, 47, 73, 0.18) !important;
}

/* 1. #mkSpy Interior: Hero Price, Gap Journey SVG, Quota Strip, KPI Strip & Unfilled Gaps */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-price {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-chg.up {
  color: #14532d !important;
  background: #dcfce7 !important;
  border-color: rgba(21, 128, 61, 0.3) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-chg.down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-chg:not(.up) {
  color: #881337 !important;
  background: #ffe4e8 !important;
  border-color: rgba(190, 18, 60, 0.3) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-ext {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-ext b {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market svg.gap-journey-svg .wp-role {
  fill: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market svg.gap-journey-svg .wp-px {
  fill: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market svg.gap-journey-svg circle:not(.svg-pulse-ring) {
  stroke: #ffffff !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-quota-strip {
  background: rgba(255, 255, 255, 0.84) !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-qs-range,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-qs-range b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-qs-range small {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-qs-verdict {
  color: #1c3550 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-qs-verdict.is-tone-amber {
  background: #fef3c7 !important;
  color: #78350f !important;
  border-color: rgba(217, 119, 6, 0.35) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-qs-verdict.is-tone-green {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: rgba(21, 128, 61, 0.35) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-card {
  background: #ffffff !important;
  background-image: none !important;
  color: #142f49 !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green {
  background: linear-gradient(90deg, #effcf5 0%, #ffffff 100%) !important;
  border-left: 3.5px solid #15803d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  background: linear-gradient(90deg, #fff1f3 0%, #ffffff 100%) !important;
  border-left: 3.5px solid #be123c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-amber,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskSpyMirror .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-amber {
  background: linear-gradient(90deg, #fffbeb 0%, #ffffff 100%) !important;
  border-left: 3.5px solid #d97706 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-lbl,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-gap-hist-note,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskSpyMirror .gj-kpi-lbl,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskSpyMirror .gj-gap-hist-note {
  color: #1e293b !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-val,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-gap-hist-note b {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-val.up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-val .up {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-val.down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-val .down {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gsp-main,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gsp-sub {
  color: #26405a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-title,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-hero-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-far-px {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-summary.is-all-clear {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-hero {
  background: #ffffff !important;
  border: 1px solid rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-priority-pill {
  background: #fef3c7 !important;
  color: #78350f !important;
  border-color: rgba(217, 119, 6, 0.35) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-reach-tag {
  background: #dbeafe !important;
  color: #1e3a8a !important;
  border-color: rgba(59, 130, 246, 0.32) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-reach-tag.is-reachable {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-hero-dist.is-up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-far-meta.is-up {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-hero-dist.is-down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-far-meta.is-down {
  background: #ffe4e8 !important;
  color: #881337 !important;
  border-color: #f4a3b4 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-reach-txt,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-far-head,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-far-rank,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-far-date {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-far-col {
  background: rgba(255, 255, 255, 0.78) !important;
  border-color: rgba(20, 47, 73, 0.14) !important;
}

/* 2. #mkMacd Interior: Decision Banner, 5-TF Circuit Track, 5m Timing Strip & RSI Dial */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision {
  background: #ffffff !important;
  border: 1px solid rgba(20, 47, 73, 0.16) !important;
  border-left: 4px solid #0284c7 !important;
  color: #142f49 !important;
  box-shadow: 0 4px 14px rgba(20, 47, 73, 0.05) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-up {
  background: #effcf5 !important;
  border-left-color: #15803d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-down {
  background: #fff1f3 !important;
  border-left-color: #be123c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-warning,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-wait {
  background: #fffbeb !important;
  border-left-color: #d97706 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision > strong {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-up > strong {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-down > strong {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision > p {
  color: #26405a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision > .ls-warning {
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-node {
  background-image: none !important;
  background-color: #ffffff !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-node.is-down {
  background-color: #fff1f3 !important;
  border-color: #f4a3b4 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-node.is-up {
  background-color: #effcf5 !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-tf,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-role {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-sub {
  color: #6b3f00 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-state.down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-node.is-down .mfs-state {
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-state.up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-node.is-up .mfs-state {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-timing-strip .mts-item {
  background: rgba(255, 255, 255, 0.84) !important;
  border-color: rgba(20, 47, 73, 0.15) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-timing-strip .mts-item small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-ema20-note {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .rsi-big-num {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .rsi-big-num.up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-inline.up {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .rsi-big-num.down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-inline.down {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .rsi-big-num.flat,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-inline.flat {
  color: #0c4a6e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-verdict.is-bear {
  background: #ffe4e8 !important;
  color: #9f1239 !important;
  border-color: #f4a3b4 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-verdict.is-bull {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-verdict.is-flat {
  background: #e8eef5 !important;
  color: #26405a !important;
  border-color: rgba(20, 47, 73, 0.2) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-sub-val,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-sub-val b.flat {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-sub-val b.up {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mts-sub-val b.down {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market svg.mts-rsi-dial text {
  fill: #26405a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .rsi-sim-btn.is-active {
  background: #dbeafe !important;
  color: #1e3a8a !important;
  border-color: #3b82f6 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .rsi-sim-btn.is-active.is-os {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: #16a34a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .rsi-sim-btn.is-active.is-ob {
  background: #ffedd5 !important;
  color: #9a3412 !important;
  border-color: #ea580c !important;
}

/* 3. #mkOdds Interior: Verdict, Big Numbers & Backtest Table */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-head .gx-title,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-chips span,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-reads li,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table th,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table td,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table td.mg-combo-note {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-head .gx-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num span,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-note,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table th small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table td.mg-trend span,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table .mg-hit,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table tr.mg-combo .mg-two,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-table th em.odds-skip {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-verdict {
  color: #92400e !important;
  background: rgba(217, 119, 6, 0.10) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-verdict.is-good {
  color: #14532d !important;
  background: rgba(21, 128, 61, 0.10) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-verdict.is-bad {
  color: #9f1239 !important;
  background: rgba(190, 18, 60, 0.09) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num.is-good b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table td.mg-trend.is-good b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table b.is-good {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num.is-bad b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table td.mg-trend.is-bad b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table b.is-bad {
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num.is-flat b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table td.mg-trend.is-flat b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table b.is-flat,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-early,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-table tr.odds-best th,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-table th em,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table tr.mg-combo th {
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .odds-num.is-info b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds .mg-table td.mg-trend.is-info b {
  color: #3730a3 !important;
}

/* 4. #mkLevels Interior: Stat Strip, Confluence Deck, Price Lift (.dte-elev) & GEX Skyline */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat {
  background: rgba(255, 255, 255, 0.82) !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat em,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat .k,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat .s {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat b {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat b.up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat b.ls-tone-up {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat b.down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat b.ls-tone-down {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .lvl-list.is-frameless-strip .stat b.ls-tone-gold {
  color: #7a5208 !important;
}

html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-subzone-title {
  color: #142f49 !important;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-crumb,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-subzone-sub {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-overlap-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card {
  background: #ffffff !important;
  border: 1px solid rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
  box-shadow: 0 6px 18px rgba(10, 26, 46, 0.06) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-overlap-card.is-res,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card.is-res,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card.is-res {
  border: 1.5px solid rgba(21, 128, 61, 0.38) !important;
  border-left: 5px solid #15803d !important;
  background: linear-gradient(180deg, #effcf5 0%, #ffffff 65%) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-overlap-card.is-sup,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card.is-sup,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card.is-sup {
  border: 1.5px solid rgba(190, 18, 60, 0.38) !important;
  border-left: 5px solid #be123c !important;
  background: linear-gradient(180deg, #fff1f3 0%, #ffffff 65%) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-overlap-card .hoc-kicker,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-overlap-card .hoc-dist,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-overlap-card .hoc-why summary,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-overlap-card .hoc-why li,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card .hoc-kicker,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card .hoc-dist,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card .hoc-why summary,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card .hoc-why li {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card .hoc-power-lbl,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-power-lbl {
  background: #fef3c7 !important;
  border: 1px solid rgba(217, 119, 6, 0.45) !important;
  color: #78350f !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card .hoc-power-lbl b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-power-lbl b {
  color: #78350f !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card .hoc-strike,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-strike {
  background: #f8fafc !important;
  border: 1px solid rgba(20, 47, 73, 0.2) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card .hoc-strike.up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-strike.up {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card .hoc-strike.down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-strike.down {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card .hoc-eq-pill,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-eq-pill {
  background: #f8fafc !important;
  color: #142f49 !important;
  border: 1px solid rgba(20, 47, 73, 0.2) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels .hcd-overlap-card.is-spacious-card .hoc-action,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #deskLevelsMirror .hcd-overlap-card.is-spacious-card .hoc-action {
  background: #fefce8 !important;
  border: 1px solid rgba(217, 119, 6, 0.38) !important;
  color: #78350f !important;
}

/* Price Lift (.dte-elev) in #panel-market + Light Theme Contrast Lock */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-price-tower.dte-elev {
  --res: #15803d;
  --sup: #be123c;
  background: linear-gradient(180deg, #ecfdf5, #ffffff 30%, #ffffff 70%, #fff1f3) !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-title,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor-name,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-bey b {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-merge,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-tick,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-bey,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-bey small {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-bey {
  background: rgba(20, 47, 73, 0.04) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-bey.is-first em {
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-bey.is-wait em {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-status {
  color: #6b3f00 !important;
  background: #fdecc0 !important;
  border-color: #e7b84a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor.is-ceiling .elv-px {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor.is-ground .elv-px {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-gap {
  background: #ffffff !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-gap.is-up {
  color: #14532d !important;
  border-color: rgba(21, 128, 61, 0.4) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-gap.is-down {
  color: #881337 !important;
  border-color: rgba(190, 18, 60, 0.4) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-cable {
  background: repeating-linear-gradient(180deg, rgba(20, 47, 73, 0.45) 0 4px, transparent 4px 8px) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-car.is-cabin {
  background: linear-gradient(180deg, #ffffff 0%, #e8eef6 100%) !important;
  border-color: #b45309 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-car.is-cabin .elv-car-lbl {
  color: #3d546c !important;
}

/* Fix elv-mark contrast and prevent overlap with .elv-car on left rail (both #panel-market and Light theme) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-car,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-car {
  z-index: 5 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark {
  background: #ffffff !important;
  color: #142f49 !important;
  border: 1px solid rgba(20, 47, 73, 0.24) !important;
  border-radius: 999px !important;
  padding: 2px 9px !important;
  left: 146px !important;
  right: auto !important;
  width: max-content !important;
  max-width: calc(100% - 178px) !important;
  box-shadow: 0 2px 6px rgba(20, 47, 73, 0.10) !important;
  z-index: 2 !important;
}
@media (max-width: 760px) {
  html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark,
  html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark {
    left: 140px !important;
    max-width: calc(100% - 148px) !important;
    font-size: 0.68rem !important;
  }
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-res,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-call:not(.is-first),
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-res,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-call:not(.is-first) {
  background: #effcf5 !important;
  color: #14532d !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-sup,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-put:not(.is-first),
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-sup,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-put:not(.is-first) {
  background: #fff1f3 !important;
  color: #881337 !important;
  border-color: #f4a3b4 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-first,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-first {
  background: #fef3c7 !important;
  color: #78350f !important;
  border-color: #f59e0b !important;
}

/* GEX Skyline inside #panel-market */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars-head,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars-head b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gbl-item,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-under-legend,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gul-lead {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-realtime-explainer .gre-item {
  background: rgba(255, 255, 255, 0.84) !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-realtime-explainer .gre-badge.is-live {
  background: #dcfce7 !important;
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-realtime-explainer .gre-badge.is-warn {
  background: #fef3c7 !important;
  color: #78350f !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart {
  background: #e8eff7 !important;
  border-color: rgba(20, 47, 73, 0.14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb.is-skyline-col {
  background: #ffffff !important;
  background-image: none !important;
  border-color: rgba(20, 47, 73, 0.14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb.is-skyline-col.is-pw {
  background-image: linear-gradient(#fff1f3, #ffe0e6) !important;
  border-color: #f4a3b4 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb.is-skyline-col.is-cw {
  background-image: linear-gradient(#effcf5, #d4f6e4) !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb.is-skyline-col.spot {
  background-image: linear-gradient(#fffaeb, #fdecc0) !important;
  border-color: #e7b84a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-k {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-axis-gap {
  border-color: rgba(20, 47, 73, 0.25) !important;
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-role-cw {
  background-image: linear-gradient(135deg, #047857, #065f46) !important;
  color: #ffffff !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-role-pw {
  background-image: linear-gradient(135deg, #be123c, #9f1239) !important;
  color: #ffffff !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-role-spot {
  background-image: none !important;
  background-color: #fde68a !important;
  color: #3d2a00 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-v {
  background: #e8eef5 !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-v.up {
  background: #dcfce7 !important;
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-v.down {
  background: #ffe4e8 !important;
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-conf-count {
  background: #fde68a !important;
  background-image: none !important;
  color: #5c3d03 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-conf-chip {
  background: #fce7f3 !important;
  color: #831843 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-conf-chip.is-zg-fac {
  background: #fef3c7 !important;
  color: #6b4a06 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-bars.is-skyline-chart .gb-conf-chip.is-mem-fac {
  background: #ede9fe !important;
  color: #4c1d95 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-under-legend,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gex-under-legend {
  background: rgba(255, 255, 255, 0.9) !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-under-legend b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gex-under-legend b {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-under-legend .gul-chip {
  background: #ffffff !important;
  color: #142f49 !important;
  border: 1px solid rgba(20, 47, 73, 0.18) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gex-under-legend .gul-chip.is-zg {
  background: #fef3c7 !important;
  color: #6b3f00 !important;
}

/* 5. #mkCross & #mkBreadth Interior: Clash Arena, Non-Truncated Weight Chips & Heatmap Tiles */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-f-kicker,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-f-pct,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-f-pct b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-vs-tag,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-r-lbl {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .tug-side-up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-w-sum.up {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .tug-side-dn,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-w-sum.dn {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-verdict {
  color: #142f49 !important;
  background: #ffffff !important;
  border: 1px solid rgba(20, 47, 73, 0.18) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-battle-stage {
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.12), rgba(255, 255, 255, 0.92) 50%, rgba(244, 63, 94, 0.12)) !important;
  border: 1px solid rgba(20, 47, 73, 0.16) !important;
  border-radius: 16px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-fx-badge.is-fire {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-fx-badge.is-fire-bear {
  background: #ffe4e8 !important;
  color: #881337 !important;
  border-color: #f4a3b4 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-fx-badge.is-sweat {
  background: #e8eef5 !important;
  color: #26405a !important;
  border-color: rgba(20, 47, 73, 0.2) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-energy-hud .sca-beam-pct.is-bull-pct {
  background: #d1fae5 !important;
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-energy-hud .sca-beam-pct.is-bear-pct {
  background: #ffe4e6 !important;
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .spy-clash-arena .sca-energy-hud .sca-hud-mid {
  background: #f1f5f9 !important;
  color: #1e293b !important;
}

/* Fix BTC น้ำหนัก 3... truncation and lock crisp daylight ink on .sca-w-chip */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sca-w-chip {
  background: #ffffff !important;
  border: 1px solid rgba(20, 47, 73, 0.16) !important;
  justify-content: space-between !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sca-w-chip.is-bull {
  border-left: 3px solid #15803d !important;
  background: linear-gradient(90deg, #effcf5, #ffffff) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sca-w-chip.is-bear {
  border-left: 3px solid #be123c !important;
  background: linear-gradient(90deg, #fff1f3, #ffffff) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sca-w-chip .swc-left {
  flex-shrink: 0 !important;
  white-space: nowrap !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sca-w-chip .swc-sym {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sca-w-chip .swc-role,
.sca-w-chip .swc-role {
  color: #3d546c !important;
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sca-w-chip .swc-pts {
  background: #f1f5f9 !important;
  color: #142f49 !important;
  border: 1px solid rgba(20, 47, 73, 0.18) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sca-w-chip.is-bull .swc-pts {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .sca-w-chip.is-bear .swc-pts {
  background: #ffe4e8 !important;
  color: #881337 !important;
  border-color: #f4a3b4 !important;
}

html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mega-weight-strip .mws-lbl,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mega-weight-strip .mws-lbl b {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mega-weight-strip .mws-pill.is-up {
  background: #dcfce7 !important;
  color: #14532d !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mega-weight-strip .mws-pill.is-dn {
  background: #ffe4e8 !important;
  color: #881337 !important;
  border-color: #f4a3b4 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mega-weight-strip .mws-pill.is-flat {
  background: #e8eef5 !important;
  color: #26405a !important;
  border-color: rgba(20, 47, 73, 0.2) !important;
}

html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile {
  background: #ffffff !important;
  border: 1px solid rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile.lean-up {
  background: linear-gradient(145deg, #effcf5, #ffffff) !important;
  border-color: rgba(21, 128, 61, 0.38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile.lean-down {
  background: linear-gradient(145deg, #fff1f3, #ffffff) !important;
  border-color: rgba(190, 18, 60, 0.38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-name,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-name b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-name span,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-px {
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-role-meta,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-age {
  color: #3d546c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-reg-note,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .tiles .tile .t-reg-note {
  background: rgba(20, 47, 73, 0.06) !important;
  border-left: 2.5px solid rgba(20, 47, 73, 0.35) !important;
  color: #1e293b !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-chg.up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-lean .up {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-chg.down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-lean .down {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .tiles .tile .t-chg.flat {
  color: #3d546c !important;
}

/* Disclosures & Folded Tables inside #panel-market */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market details,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market details.explain,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market details.mk-fold {
  background: rgba(255, 255, 255, 0.78) !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market summary,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market details > summary {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
  color: #142f49 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-table th,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-table td,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-box,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-box-head,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .hcd-abbr-chip {
  color: #142f49 !important;
}

/* Global Light-Theme #gexTodayBanner .gxt-chip contrast lock (>= 5.8:1) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today.is-pos .gxt-chip {
  color: #14532d !important;
  background: #dcfce7 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today.is-neg .gxt-chip {
  color: #881337 !important;
  background: #ffe4e8 !important;
}

/* ==========================================================================
   V226 — UNIFIED CATALOGUE B STAGE ARCHITECTURE (2026-10-28)
   Fixes "ทำไมดูรวมๆมันยังแปลกๆอยู่เลย เกิดจากอะไร สีกับพื้นหลังไม่เข้ากันหรอ":
   1. Exact Catalogue B tokens from assets/design-contracts.css:
      --aku-paper (#f3efe4 warm ivory, never stark #ffffff)
      --dc-blue: oklch(from var(--aku-sky-2) .91 .045 h)
      --dc-mint: oklch(from var(--aku-accent) .93 .06 h)
      --dc-surface: linear-gradient(125deg, var(--dc-blue), var(--aku-paper) 52%, var(--dc-mint))
      --dc-card-surface: linear-gradient(145deg, var(--aku-paper) 35%, var(--dc-mint))
   2. Unified outer stages (header.dte-head .dte-opening and section.panel > .wrap)
      so cards sit inside a soft Mint-Sky stage instead of floating as scattered
      white rectangles over the pitch-black #081326 night sky.
   3. Unboxes non-card elements (.owner-pill, .saved-at-pill, summary.session-heading,
      .risk-note.risk-compact, .panel-head, .gj-quota-strip, .gj-kpi-card) to eliminate
      กล่องในกล่อง (nested box clutter).
   ========================================================================== */

html[data-theme="light"] body:not(#akx) #main:not(#aky) {
  --aku-paper: #f3efe4;
  --dc-panel: var(--aku-paper);
  --dc-card: var(--aku-paper);
  --dc-ink: var(--aku-ink, #142f49);
  --dc-muted: var(--aku-ink-2, #3c5472);
  --dc-edge: var(--aku-ink-2, #3c5472);
  --dc-blue: oklch(from var(--aku-sky-2, #bfe0fa) .91 .045 h);
  --dc-mint: oklch(from var(--aku-accent, #10b981) .93 .06 h);
  --dc-surface: linear-gradient(125deg, var(--dc-blue), var(--aku-paper) 52%, var(--dc-mint));
  --dc-card-surface: linear-gradient(145deg, var(--aku-paper) 35%, var(--dc-mint));
  --dc-shadow: color-mix(in srgb, var(--aku-night, #081326) 65%, transparent);
}

/* 0. Frameless 16-bit pixel sprites & unboxed .ak-emoji-lead across header, tabs, and panels */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ak-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gxt-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ov-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .risk-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .tab-px,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .ak-emoji-lead {
  display: inline-block;
  vertical-align: -3px;
  flex-shrink: 0;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  width: auto !important;
  height: auto !important;
}

/* 1. V11 Controls & Legacy .btn-ghost Upgrade Across #main (Warm Ivory + Mint, never stark #fff) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-control,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .btn.btn-ghost:not(.aku-cta),
html[data-theme="light"] body:not(#akx) #main:not(#aky) .def-quiet-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 36px !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-body, var(--font-body)) !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  background: var(--aku-paper, #f3efe4) !important;
  color: var(--dc-ink, #142f49) !important;
  border: 1px solid color-mix(in srgb, var(--dc-edge, #3c5472) 55%, transparent) !important;
  box-shadow: 0 2px 6px rgba(20, 47, 73, 0.08) !important;
  transition: transform 0.16s ease, background 0.16s ease, border-color 0.16s ease, color 0.16s ease !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-control:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-control:focus-visible,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .btn.btn-ghost:not(.aku-cta):hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .btn.btn-ghost:not(.aku-cta):focus-visible,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .def-quiet-btn:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .def-quiet-btn:focus-visible {
  background: var(--dc-card-surface) !important;
  color: #0c4a6e !important;
  border-color: var(--dc-edge, #3c5472) !important;
  transform: translateY(-1px) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-control.aku-control--nav,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .btn.btn-ghost.aku-control--nav {
  background: linear-gradient(135deg, var(--dc-blue) 0%, var(--aku-paper, #f3efe4) 55%, var(--dc-mint) 100%) !important;
  color: #0c4a6e !important;
  border: 1px solid color-mix(in srgb, var(--dc-edge, #3c5472) 65%, transparent) !important;
  box-shadow: 0 4px 12px rgba(20, 47, 73, 0.10) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-control.aku-control--nav:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-control.aku-control--nav:focus-visible,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .btn.btn-ghost.aku-control--nav:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .btn.btn-ghost.aku-control--nav:focus-visible {
  background: linear-gradient(135deg, var(--dc-mint) 0%, var(--aku-paper, #f3efe4) 55%, var(--dc-blue) 100%) !important;
  color: #082f49 !important;
  border-color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-cta.aku-cta--ghost {
  background: var(--aku-paper, #f3efe4) !important;
  color: var(--dc-ink, #142f49) !important;
  border: 1px solid color-mix(in srgb, var(--dc-edge, #3c5472) 58%, transparent) !important;
  box-shadow: 0 4px 12px rgba(20, 47, 73, 0.08) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-cta.aku-cta--ghost:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-cta.aku-cta--ghost:focus-visible {
  background: var(--dc-card-surface) !important;
  color: #0c4a6e !important;
  border-color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-cta.aku-cta--ghost .aku-cta-arrow,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-cta.aku-cta--ghost .aku-cta-ar {
  background: rgba(20, 47, 73, 0.09) !important;
  color: #0c4a6e !important;
}

/* 2. UNIFIED HERO STAGE: header.dte-head .dte-opening (Matches .contract-study-hero in design-standard.html) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head {
  padding: 92px 0 12px !important;
  background: transparent !important;
  border: 0 !important;
}
@media (max-width: 760px) {
  html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head {
    padding: 80px 0 10px !important;
  }
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  background:
    radial-gradient(ellipse at 90% 25%, color-mix(in srgb, var(--dc-mint) 78%, transparent), transparent 58%),
    var(--dc-surface) !important;
  border: 1px solid var(--dc-edge, #3c5472) !important;
  border-radius: 20px !important;
  padding: 20px 24px !important;
  box-shadow:
    inset 0 1px 0 var(--aku-paper, #f3efe4),
    0 18px 36px -22px var(--dc-shadow) !important;
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head .dte-intro {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid color-mix(in srgb, var(--dc-edge, #3c5472) 26%, transparent) !important;
  padding: 0 0 12px !important;
  margin: 0 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head .dte-intro-top {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 12px 20px !important;
  flex-wrap: wrap !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head .dte-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--dc-muted, #3c5472) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head .dte-kicker::before {
  content: "" !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: var(--aku-primary, #f5b93a) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--aku-primary, #f5b93a) 28%, transparent) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head h1 {
  color: var(--dc-ink, #142f49) !important;
  font-size: clamp(1.85rem, 2.7vw, 2.45rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  text-shadow: none !important;
  margin: 4px 0 0 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head h1 em {
  font-style: normal !important;
  color: var(--dc-ink, #142f49) !important;
  background: none !important;
  -webkit-text-fill-color: var(--dc-ink, #142f49) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--aku-primary, #f5b93a) !important;
  text-decoration-thickness: 4px !important;
  text-underline-offset: 6px !important;
}

/* Unbox status readouts (.owner-pill, .saved-at-pill) so only real buttons have pill borders */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .dte-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .owner-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-height: 0 !important;
  padding: 2px 6px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--dc-muted, #3c5472) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .owner-pill .op-dot {
  display: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .owner-pill.is-owner {
  color: #14532d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .owner-pill .op-txt,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .owner-pill .op-txt b {
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .owner-pill .op-txt small {
  color: var(--dc-muted, #3c5472) !important;
  font-weight: 600;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head #viewModeBtn .vmb-txt {
  color: var(--dc-ink, #142f49) !important;
  font-weight: 800;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head #viewModeBtn .vmb-txt small {
  color: var(--dc-muted, #3c5472) !important;
  font-weight: 600;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head #viewModeBtn .vmb-switch {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: var(--dc-blue) !important;
  color: #0c4a6e !important;
  font-weight: 800;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .saved-at-pill {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 0 !important;
  padding: 2px 6px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--dc-muted, #3c5472) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .saved-at-pill a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #075985 !important;
  font-weight: 800;
  text-decoration: none;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-head .saved-at-pill a:hover {
  color: #0c4a6e !important;
  text-decoration: underline;
}

/* 3. #sessionSummary — Full-Width Balanced 2-Column Dashboard Inside Hero Stage */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary {
  --text: #142f49;
  --muted: #3c5472;
  --dte-dim: #3c5472;
  color: #142f49;
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
@media (min-width: 961px) {
  html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid {
    display: grid !important;
    grid-template-columns: minmax(380px, 0.96fr) minmax(0, 1.24fr) !important;
    gap: 14px 16px !important;
    align-items: stretch !important;
  }
  html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid > #gexTodayBanner {
    grid-column: 1 / 2 !important;
    display: flex !important;
    margin: 0 !important;
  }
  html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid > #gexTodayBanner > .gx-today {
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    align-content: center !important;
  }
  html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid > #overview.today-strip {
    grid-column: 2 / 3 !important;
    margin: 0 !important;
    align-content: stretch !important;
  }
  html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid > .dte-context.dte-top-ribbon {
    grid-column: 1 / -1 !important;
    margin-top: 2px !important;
  }
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary > summary.session-heading {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 2px 0 6px !important;
  margin: 0 0 10px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--dc-ink, #142f49) !important;
  cursor: pointer;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary > summary.session-heading b {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--dc-ink, #142f49) !important;
  font-size: 0.96rem !important;
  font-weight: 800;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #sessionSummary > summary.session-heading > span {
  color: var(--dc-muted, #3c5472) !important;
  font-size: 0.82rem !important;
  font-weight: 700;
}

/* 4. #gexTodayBanner & .gx-today (Catalogue B Warm Ivory -> Mint Card Inside Hero Stage) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today {
  background: var(--dc-card-surface) !important;
  border: 1px solid var(--dc-edge, #3c5472) !important;
  border-left: 4px solid var(--gt, #15803d) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 20px -14px var(--dc-shadow) !important;
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today.is-pos {
  --gt: #15803d;
  --gt-soft: rgba(21, 128, 61, 0.12);
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today.is-neg {
  --gt: #be123c;
  --gt-soft: rgba(190, 18, 60, 0.12);
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-ico-bg {
  fill: color-mix(in srgb, var(--gt) 14%, var(--aku-paper, #f3efe4)) !important;
  stroke: var(--gt) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 11px;
  border-radius: 999px;
  font-weight: 800;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today.is-pos .gxt-chip {
  background: #dcfce7 !important;
  color: #14532d !important;
  border: 1px solid rgba(21, 128, 61, 0.36) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today.is-neg .gxt-chip {
  background: #ffe4e8 !important;
  color: #881337 !important;
  border: 1px solid rgba(190, 18, 60, 0.36) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-title,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-meter-k b {
  color: var(--gt) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-net,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv b {
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-mean,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-meter-k {
  color: var(--dc-muted, #3c5472) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-plan,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-flip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #7c2d12 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--aku-paper, #f3efe4) !important;
  border: 1px solid color-mix(in srgb, var(--dc-edge, #3c5472) 38%, transparent) !important;
  color: var(--dc-ink, #142f49) !important;
  font-weight: 700;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-spot {
  background: var(--dc-blue) !important;
  border-color: rgba(3, 105, 161, 0.35) !important;
  color: #0c4a6e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-spot b {
  color: #0c4a6e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-put {
  background: #fce8ec !important;
  border-color: rgba(190, 18, 60, 0.32) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-put em,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-ends .is-neg {
  color: #881337 !important;
  font-weight: 800;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-call {
  background: #dcfce7 !important;
  border-color: rgba(21, 128, 61, 0.32) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-call em,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-ends .is-pos {
  color: #14532d !important;
  font-weight: 800;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-zg {
  background: #fef3c7 !important;
  border-color: rgba(180, 83, 9, 0.32) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-lv.is-zg em {
  color: #7c2d12 !important;
  font-weight: 800;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today .gxt-ends > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

/* 5. #overview (.today-strip > button.ov-tile — Exact Catalogue B .dc-list-group button Recipe) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile {
  background: var(--dc-card-surface) !important;
  border: 1px solid var(--dc-edge, #3c5472) !important;
  border-radius: 14px !important;
  box-shadow: 0 6px 16px -10px var(--dc-shadow) !important;
  color: var(--dc-ink, #142f49) !important;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile::before {
  height: 3.5px !important;
  background: var(--accent, #0284c7) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile:focus-visible {
  background: linear-gradient(145deg, var(--dc-blue), var(--aku-paper, #f3efe4) 48%, var(--dc-mint)) !important;
  border-color: var(--dc-ink, #142f49) !important;
  box-shadow: 0 12px 24px -12px var(--dc-shadow) !important;
  transform: translateY(-2px) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: #26405a !important;
  font-size: 0.86rem !important;
  font-weight: 800 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-num {
  color: var(--dc-ink, #142f49) !important;
  font-size: 1.5rem !important;
  font-weight: 900 !important;
  margin-top: 2px;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-num .up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-note .up {
  color: #14532d !important;
  font-weight: 800 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-num .down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-note .down {
  color: #881337 !important;
  font-weight: 800 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-note,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-sub-muted {
  color: var(--dc-muted, #3c5472) !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-sub-warn {
  color: #7c2d12 !important;
  font-weight: 800 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-viz-svg text {
  fill: var(--dc-ink, #142f49) !important;
}

/* 6. Top Ribbon (.dte-context.dte-top-ribbon -> Frameless Left-Accent Risk Note + Single-Row CTA Bar) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-context.dte-top-ribbon {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px 18px !important;
  padding: 12px 0 0 !important;
  margin-top: 12px !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid color-mix(in srgb, var(--dc-edge, #3c5472) 26%, transparent) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .risk-note.risk-compact {
  flex: 1 1 360px !important;
  margin: 0 !important;
  padding: 2px 0 2px 11px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 3.5px solid #be123c !important;
  box-shadow: none !important;
  color: var(--dc-ink, #142f49) !important;
  font-size: 0.82rem !important;
  line-height: 1.48 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .risk-note.risk-compact .risk-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  color: #881337 !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .risk-note.risk-compact > span {
  color: #26405a !important;
  font-weight: 600 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .guide-cta-bar.guide-cta-compact {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .guide-cta-bar.guide-cta-compact .aku-cta {
  min-height: 36px !important;
  padding: 5px 13px !important;
  font-size: 0.81rem !important;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}
/* 7. #tabList Sub-Nav Capsules Harmonized with Catalogue B Stage (High-Specificity Override) */


/* 8. UNIFIED PANEL STAGES: #panel-market > .wrap, #panel-news > .wrap, #panel-setups > .wrap
      (Matches .dc-index / .dc-workspace in design-standard.html) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market > .wrap,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news > .wrap,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups > .wrap {
  background:
    radial-gradient(ellipse at 90% 8%, color-mix(in srgb, var(--dc-mint) 78%, transparent), transparent 52%),
    linear-gradient(100deg, var(--dc-blue) 0%, #f3efe4 52%, var(--dc-mint) 100%) !important;
  border: 1px solid var(--dc-edge, #3c5472) !important;
  border-radius: 20px !important;
  padding: 22px 26px !important;
  box-shadow:
    inset 0 1px 0 #f3efe4,
    0 18px 36px -22px var(--dc-shadow) !important;
  color: var(--dc-ink, #142f49) !important;
}

/* Unbox .panel-head inside unified stages so it sits directly on the Catalogue B Stage (like .dc-section-head) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market > .wrap > .panel-head,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news > .wrap > .panel-head,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups > .wrap > .panel-head {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid color-mix(in srgb, var(--dc-edge, #3c5472) 28%, transparent) !important;
  border-radius: 0 !important;
  padding: 0 0 12px !important;
  margin-bottom: 14px !important;
  box-shadow: none !important;
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market > .wrap > .panel-head h2,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news > .wrap > .panel-head h2,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups > .wrap > .panel-head h2 {
  color: var(--dc-ink, #142f49) !important;
  text-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market > .wrap > .panel-head p,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news > .wrap > .panel-head p,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups > .wrap > .panel-head p {
  color: var(--dc-muted, #3c5472) !important;
}

/* Make #mkStatus a clean compact ribbon on the stage instead of a giant stacked white box */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus.mk-status,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkStatus.status-line {
  background: color-mix(in srgb, var(--aku-paper, #f3efe4) 72%, var(--dc-mint)) !important;
  background-image: none !important;
  border: 1px solid color-mix(in srgb, var(--dc-edge, #3c5472) 38%, transparent) !important;
  border-left: 4px solid #0d9488 !important;
  border-radius: 12px !important;
  padding: 8px 14px !important;
  margin-bottom: 16px !important;
  box-shadow: none !important;
}

/* Primary Cards inside #panel-market Stage use --dc-card-surface (Warm Ivory -> Mint, never stark #ffffff) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkLevels,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkCross,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkBreadth,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkOdds.odds-box {
  background: var(--dc-card-surface) !important;
  border: 1px solid var(--dc-edge, #3c5472) !important;
  border-top: 3.5px solid var(--mk-tone, #0284c7) !important;
  border-radius: 16px !important;
  padding: 20px 22px !important;
  box-shadow: 0 8px 20px -14px var(--dc-shadow) !important;
  color: var(--dc-ink, #142f49) !important;
}

/* Unbox nested inner boxes (กล่องในกล่อง) inside #mkSpy & #mkMacd */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-quota-strip {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(20, 47, 73, 0.14) !important;
  border-bottom: 1px solid rgba(20, 47, 73, 0.14) !important;
  border-radius: 0 !important;
  padding: 8px 2px !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card {
  background: color-mix(in srgb, var(--aku-paper, #f3efe4) 82%, transparent) !important;
  background-image: none !important;
  border: 0 !important;
  border-left: 3.5px solid rgba(20, 47, 73, 0.28) !important;
  border-radius: 0 10px 10px 0 !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green {
  background: color-mix(in srgb, #dcfce7 55%, var(--aku-paper, #f3efe4)) !important;
  border-left: 3.5px solid #15803d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  background: color-mix(in srgb, #ffe4e8 55%, var(--aku-paper, #f3efe4)) !important;
  border-left: 3.5px solid #be123c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-amber {
  background: color-mix(in srgb, #fef3c7 62%, var(--aku-paper, #f3efe4)) !important;
  border-left: 3.5px solid #d97706 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .gj-ug-far-col {
  background: var(--aku-paper, #f3efe4) !important;
  border: 1px solid rgba(20, 47, 73, 0.18) !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision {
  background: color-mix(in srgb, var(--aku-paper, #f3efe4) 85%, transparent) !important;
  border: 0 !important;
  border-left: 4px solid #0284c7 !important;
  border-radius: 0 12px 12px 0 !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-up {
  background: color-mix(in srgb, #dcfce7 55%, var(--aku-paper, #f3efe4)) !important;
  border-left-color: #15803d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-down {
  background: color-mix(in srgb, #ffe4e8 55%, var(--aku-paper, #f3efe4)) !important;
  border-left-color: #be123c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-warning,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market #mkMacd .mk-macd-decision.ls-tone-wait {
  background: color-mix(in srgb, #fef3c7 62%, var(--aku-paper, #f3efe4)) !important;
  border-left-color: #d97706 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-node {
  background-color: var(--aku-paper, #f3efe4) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-node.is-down {
  background-color: #fce8ec !important;
  border-color: #f4a3b4 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .macd-flow-strip .mfs-node.is-up {
  background-color: #e2f8ec !important;
  border-color: #86d9ae !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-timing-strip .mts-item {
  background: var(--aku-paper, #f3efe4) !important;
  border-color: rgba(20, 47, 73, 0.16) !important;
  box-shadow: none !important;
}

/* 9. #panel-news & #panel-levels Cards inside Stage */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news {
  --text: #142f49;
  --muted: #3c5472;
  --dte-dim: #3c5472;
  color: #142f49;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .mk-grid.mk-open-zones > .mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-levels .mk-grid > .mk-box {
  background: var(--dc-card-surface) !important;
  border: 1px solid var(--dc-edge, #3c5472) !important;
  border-top: 3.5px solid #0284c7 !important;
  border-radius: 16px !important;
  padding: 20px 22px !important;
  box-shadow: 0 8px 20px -14px var(--dc-shadow) !important;
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .ev-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .news-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .news-wind,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .cal-today {
  background: var(--aku-paper, #f3efe4) !important;
  border: 1px solid rgba(20, 47, 73, 0.18) !important;
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .ev-card .ev-name,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .ev-card .ev-prev-k b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .cal-today .ct-head b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .cal-today .ct-time,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .cal-today .ct-name,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .cal-today .ct-act,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .news-card b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .news-card h4,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .news-wind b {
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .ev-card .ev-prev-k,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .ev-card .ev-note-line,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .cal-today .ct-name small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .cal-today .ct-nums,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .news-card small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .news-card p {
  color: var(--dc-muted, #3c5472) !important;
}

/* 10. #panel-setups Cards inside Stage */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-setup-card {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-catalog-head-txt strong {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-catalog-head-txt h3,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-title,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-detail-bar-left b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-v,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-txt b {
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-catalog-head-txt p,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-txt span {
  color: var(--dc-muted, #3c5472) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab {
  background: var(--dc-card-surface) !important;
  border-color: var(--dc-edge, #3c5472) !important;
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-default-hero {
  background: linear-gradient(135deg, #d1fae5 0%, var(--aku-paper, #f3efe4) 62%, #fef3c7 100%) !important;
  border-color: #059669 !important;
  box-shadow: 0 10px 26px -12px rgba(5, 150, 105, 0.22) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-kicker {
  color: var(--dc-muted, #3c5472) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-default-hero .def-case-kicker,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-pos .def-case-kicker {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-neg .def-case-kicker {
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sky .def-case-kicker {
  color: #075985 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-warn .def-case-kicker {
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-hero-pill {
  color: #78350f !important;
  background: #fef3c7 !important;
  border-color: rgba(217, 119, 6, 0.52) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-cta {
  color: var(--dc-ink, #142f49) !important;
  background: var(--aku-paper, #f3efe4) !important;
  border-color: rgba(20, 47, 73, 0.22) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-default-hero .def-case-cta {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: rgba(5, 150, 105, 0.45) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-detail-bar,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-main {
  background: var(--aku-paper, #f3efe4) !important;
  border-color: rgba(20, 47, 73, 0.18) !important;
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-detail-bar-left small {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-title {
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="2"] .def-step-title {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="3"] .def-step-title {
  color: #075985 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="4"] .def-step-title {
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-num {
  color: #78350f !important;
  background: #fef3c7 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="2"] .def-step-num {
  color: #065f46 !important;
  background: #d1fae5 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="3"] .def-step-num {
  color: #075985 !important;
  background: #e0f2fe !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-step-box[data-step="4"] .def-step-num {
  color: #9f1239 !important;
  background: #ffe4e6 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card {
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(20, 47, 73, 0.12) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card .def-pt-k {
  color: #075985 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-call .def-pt-k {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-put .def-pt-k {
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-wait .def-pt-k,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-pt-card.is-gold .def-pt-k {
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-strip {
  background: linear-gradient(135deg, #fef3c7 0%, var(--aku-paper, #f3efe4) 100%) !important;
  border-color: rgba(217, 119, 6, 0.45) !important;
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-strip.is-open {
  background: linear-gradient(135deg, #d1fae5 0%, var(--aku-paper, #f3efe4) 100%) !important;
  border-color: rgba(5, 150, 105, 0.45) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-time {
  color: #78350f !important;
  background: #fde68a !important;
  border-color: rgba(217, 119, 6, 0.42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-jump {
  color: #78350f !important;
  background: #fef3c7 !important;
  border-color: rgba(217, 119, 6, 0.5) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic {
  background: linear-gradient(180deg, #dcfce7 0%, var(--aku-paper, #f3efe4) 100%) !important;
  border-color: rgba(5, 150, 105, 0.36) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-gex-neg {
  background: linear-gradient(180deg, #ffe4e8 0%, var(--aku-paper, #f3efe4) 100%) !important;
  border-color: rgba(225, 29, 72, 0.36) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-after-midnight {
  background: linear-gradient(180deg, var(--dc-blue) 0%, var(--aku-paper, #f3efe4) 100%) !important;
  border-color: rgba(2, 132, 199, 0.36) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-conflict {
  background: linear-gradient(180deg, #fef3c7 0%, var(--aku-paper, #f3efe4) 100%) !important;
  border-color: rgba(217, 119, 6, 0.38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-kicker {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-gex-neg .sig-kicker {
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-after-midnight .sig-kicker {
  color: #075985 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-conflict .sig-kicker {
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-title,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-foot-item b {
  color: var(--dc-ink, #142f49) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-foot-item span {
  color: var(--dc-muted, #3c5472) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-pill.is-emerald {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: rgba(5, 150, 105, 0.38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-pill.is-sky {
  color: #075985 !important;
  background: #e0f2fe !important;
  border-color: rgba(2, 132, 199, 0.38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-pill.is-gold {
  color: #78350f !important;
  background: #fef3c7 !important;
  border-color: rgba(217, 119, 6, 0.42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .sig-pill.is-rose {
  color: #9f1239 !important;
  background: #ffe4e6 !important;
  border-color: rgba(225, 29, 72, 0.42) !important;
}

/* ==========================================================================
   V230 — DARK MODE DESIGN LAB: OPTION A (MOONLIT WHITE + NIGHT GLASS STAGE)
          VS OPTION B (3-STOP AURORA GLASS DARK MODE) COMPARISON (2026-10-28)
   ========================================================================== */

/* Keep crisp cool white (#ffffff -> #eef6ff -> #e8f8f1) that Audi prefers instead of warm cream #f3efe4 */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) {
  --aku-paper: #ffffff;
  --dc-blue: #eef6ff;
  --dc-mint: #e8f8f1;
  --dc-surface: linear-gradient(135deg, #ffffff 0%, #eef6ff 56%, #e8f8f1 100%);
  --dc-card-surface: linear-gradient(145deg, #ffffff 0%, #f4f9ff 58%, #ebf9f3 100%);
}

/* Remove V226 giant cream outer wrapper on #panel-market > .wrap so the comparison lab & night stage control the frame */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) > .wrap {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* 1. Sticky Design Lab Comparison Bar (#dteAbLabBar) */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-ab-lab-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 18px;
  padding: 14px 18px;
  margin-bottom: 18px;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(15, 34, 66, 0.94) 0%, rgba(11, 25, 48, 0.96) 55%, rgba(13, 48, 56, 0.94) 100%) !important;
  border: 1.5px solid rgba(94, 234, 212, 0.42) !important;
  box-shadow: 0 16px 36px rgba(2, 8, 20, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-lab-title {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-lab-kicker {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #5eead4 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-lab-title b {
  font-size: 0.95rem;
  font-weight: 800;
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-lab-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-lab-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  padding: 6px 13px;
  border-radius: 999px;
  font-family: var(--aku-font-body, var(--font-body));
  font-size: 0.82rem;
  font-weight: 800;
  color: #e0f2fe !important;
  background: rgba(15, 35, 68, 0.78) !important;
  border: 1px solid rgba(125, 211, 252, 0.34) !important;
  cursor: pointer;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-lab-btn:hover {
  background: rgba(23, 52, 98, 0.92) !important;
  border-color: rgba(94, 234, 212, 0.65) !important;
  transform: translateY(-1px);
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-lab-btn.is-active {
  background: linear-gradient(135deg, #38bdf8 0%, #2dd4bf 100%) !important;
  color: #061325 !important;
  border-color: #a5f3fc !important;
  box-shadow: 0 6px 18px rgba(45, 212, 191, 0.35) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-lab-btn.is-theme-toggle {
  background: rgba(245, 158, 11, 0.18) !important;
  color: #fde68a !important;
  border-color: rgba(251, 191, 36, 0.48) !important;
}

/* 2. Side-by-Side Split Comparison Arena (#dteAbCompareGrid) */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz):not([data-ab-mode="split"]) #dteAbCompareGrid {
  display: none !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz)[data-ab-mode="split"] #dteAbCompareGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  align-items: start;
  margin-bottom: 28px;
}
@media (max-width: 1100px) {
  html body:not(#akx) #main:not(#aky) #panel-market:not(#akz)[data-ab-mode="split"] #dteAbCompareGrid {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* In split mode, hide the duplicate top row (#mkSpy, #mkMacd, .panel-head, #mkStatus) in #dteAbLiveStage so the user sees the side-by-side comparison cleanly first */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz)[data-ab-mode="split"] #dteAbLiveStage > .panel-head,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz)[data-ab-mode="split"] #dteAbLiveStage > #mkStatus,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz)[data-ab-mode="split"] #dteAbLiveStage #mkSpy,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz)[data-ab-mode="split"] #dteAbLiveStage #mkMacd {
  display: none !important;
}

html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-compare-col {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px 14px;
  padding: 14px 18px;
  border-radius: 16px;
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner.is-banner-a {
  background: linear-gradient(135deg, rgba(14, 116, 144, 0.32) 0%, rgba(15, 31, 60, 0.92) 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.52) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner.is-banner-b {
  background: linear-gradient(135deg, rgba(13, 148, 136, 0.32) 0%, rgba(16, 36, 68, 0.92) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.52) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-tag {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: #67e8f9 !important;
  margin-bottom: 3px;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner.is-banner-b .ab-col-tag {
  color: #6ee7b7 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner h3 {
  margin: 0 0 4px;
  font-size: 1.02rem;
  font-weight: 800;
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner p {
  margin: 0;
  font-size: 0.81rem;
  line-height: 1.48;
  color: #cbd5e1 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner p b {
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner p code {
  padding: 1px 6px;
  border-radius: 6px;
  background: rgba(15, 23, 42, 0.65);
  color: #7dd3fc;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-use-btn {
  flex-shrink: 0;
  padding: 6px 13px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  background: rgba(56, 189, 248, 0.22) !important;
  color: #e0f2fe !important;
  border: 1px solid rgba(125, 211, 252, 0.5) !important;
  cursor: pointer;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-use-btn:hover {
  background: #38bdf8 !important;
  color: #061325 !important;
}

/* ==========================================================================
   🅰️ OPTION A — MOONLIT COOL WHITE CARDS ON NIGHT GLASS STAGE
      (.ab-scope-a in Dark Mode)
   ========================================================================== */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-a,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #dteAbLiveStage {
  background:
    radial-gradient(ellipse at 88% 4%, rgba(45, 212, 191, 0.16), transparent 52%),
    radial-gradient(ellipse at 12% 5%, rgba(56, 189, 248, 0.20), transparent 54%),
    linear-gradient(165deg, rgba(13, 29, 56, 0.88) 0%, rgba(8, 19, 38, 0.94) 100%) !important;
  border: 1.5px solid rgba(125, 211, 252, 0.34) !important;
  border-radius: 22px !important;
  padding: 20px 22px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.15),
    0 24px 52px rgba(2, 8, 20, 0.68) !important;
}

/* Option A Stage Header (.panel-head) & Status Bar (#mkStatus) stay Dark Glass so the outer stage belongs to the night sky */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #dteAbLiveStage > .panel-head {
  background: linear-gradient(135deg, rgba(18, 41, 77, 0.82) 0%, rgba(12, 28, 54, 0.88) 100%) !important;
  border: 1px solid rgba(125, 211, 252, 0.30) !important;
  border-top: 3px solid #38bdf8 !important;
  border-radius: 16px !important;
  padding: 16px 20px !important;
  margin-bottom: 12px !important;
  box-shadow: 0 10px 24px rgba(2, 8, 20, 0.42) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .panel-head h2,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #dteAbLiveStage > .panel-head h2 {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .panel-head p,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #dteAbLiveStage > .panel-head p {
  color: #bae6fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .panel-head .aku-cta--ghost,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .panel-head .aku-control--quiet,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #dteAbLiveStage > .panel-head .aku-cta--ghost,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #dteAbLiveStage > .panel-head .aku-control--quiet {
  background: rgba(15, 36, 68, 0.88) !important;
  color: #e0f2fe !important;
  border: 1px solid rgba(125, 211, 252, 0.38) !important;
}

html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-status,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #mkStatus {
  background: linear-gradient(90deg, rgba(13, 148, 136, 0.26) 0%, rgba(15, 34, 64, 0.88) 100%) !important;
  border: 1px solid rgba(45, 212, 191, 0.38) !important;
  border-left: 4px solid #2dd4bf !important;
  border-radius: 13px !important;
  padding: 10px 15px !important;
  margin-bottom: 16px !important;
  color: #f0fdfa !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-status *,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #mkStatus * {
  color: #e2e8f0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-status .st-pill,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-status .chip,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-status > span:first-child,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #mkStatus .st-pill,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #mkStatus .chip,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #mkStatus > span:first-child {
  background: rgba(15, 23, 42, 0.78) !important;
  color: #f8fafc !important;
  border: 1px solid rgba(148, 163, 184, 0.42) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-status b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #mkStatus b {
  color: #5eead4 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .ab-clone-mktick,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #mkStatus #mkTick {
  background: rgba(56, 189, 248, 0.22) !important;
  color: #bae6fd !important;
  border: 1px solid rgba(125, 211, 252, 0.42) !important;
}

/* Option A Data Cards: Moonlit Cool Pearl (#f5f9ff -> #e9f3ff -> #e3f6ef) + Cyan-Mint Atmospheric Rim */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a #mkOdds.odds-box {
  background: linear-gradient(135deg, #f5f9ff 0%, #e9f3ff 54%, #e2f5ee 100%) !important;
  border: 1.5px solid rgba(125, 211, 252, 0.72) !important;
  border-top: 3.5px solid var(--mk-tone, #0284c7) !important;
  border-radius: 18px !important;
  padding: 20px 22px !important;
  box-shadow:
    0 16px 36px rgba(2, 8, 22, 0.55),
    0 0 0 3px rgba(56, 189, 248, 0.14),
    inset 0 1px 0 #ffffff !important;
  color: #142f49 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-clone-spy { --mk-tone: #10b981; }
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-clone-macd { --mk-tone: #0284c7; }

/* Restore crisp boxed sub-cards inside Option A (instead of V226 cream #f3efe4) */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  background: linear-gradient(90deg, #fff1f3 0%, #ffffff 100%) !important;
  border: 1px solid rgba(244, 63, 94, 0.24) !important;
  border-left: 3.5px solid #be123c !important;
  border-radius: 12px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green {
  background: linear-gradient(90deg, #effcf5 0%, #ffffff 100%) !important;
  border: 1px solid rgba(16, 185, 129, 0.24) !important;
  border-left: 3.5px solid #15803d !important;
  border-radius: 12px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .gj-ug-hero,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .gj-ug-far-col,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-timing-strip .mts-item {
  background: #ffffff !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-macd-decision.ls-tone-warning,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-a .mk-macd-decision.ls-tone-wait {
  background: linear-gradient(90deg, #fffbeb 0%, #ffffff 100%) !important;
  border: 1px solid rgba(217, 119, 6, 0.28) !important;
  border-left: 4px solid #d97706 !important;
  border-radius: 12px !important;
}


/* ==========================================================================
   🅱️ OPTION B — 3-STOP AURORA GLASS DARK MODE
      (Luminous Sapphire #173a68 -> Deep Indigo #122c52 -> Mint Lagoon #0f3f49)
      Exact dark-polarity twin of Audi's Cool White-Blue-Mint card!
   ========================================================================== */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #dteAbLiveStage {
  background:
    radial-gradient(ellipse at 88% 4%, rgba(45, 212, 191, 0.16), transparent 52%),
    radial-gradient(ellipse at 12% 5%, rgba(56, 189, 248, 0.18), transparent 54%),
    linear-gradient(165deg, rgba(10, 22, 44, 0.90) 0%, rgba(7, 16, 34, 0.95) 100%) !important;
  border: 1.5px solid rgba(94, 234, 212, 0.32) !important;
  border-radius: 22px !important;
  padding: 20px 22px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    0 24px 52px rgba(2, 8, 20, 0.72) !important;
  color: #f8fafc !important;
}

/* Option B Stage Header & Status Bar */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #dteAbLiveStage > .panel-head {
  background: linear-gradient(135deg, #173a68 0%, #122c52 52%, #0f3f49 100%) !important;
  border: 1px solid rgba(94, 234, 212, 0.36) !important;
  border-top: 3px solid #38bdf8 !important;
  border-radius: 16px !important;
  padding: 16px 20px !important;
  margin-bottom: 12px !important;
  box-shadow: 0 12px 28px rgba(2, 8, 20, 0.5) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .panel-head h2,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #dteAbLiveStage > .panel-head h2 {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .panel-head p,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #dteAbLiveStage > .panel-head p {
  color: #bae6fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .panel-head .aku-cta--ghost,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .panel-head .aku-control--quiet,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #dteAbLiveStage > .panel-head .aku-cta--ghost,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #dteAbLiveStage > .panel-head .aku-control--quiet {
  background: rgba(15, 36, 68, 0.88) !important;
  color: #e0f2fe !important;
  border: 1px solid rgba(125, 211, 252, 0.38) !important;
}

html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-status,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkStatus {
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.24) 0%, rgba(18, 44, 82, 0.88) 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.42) !important;
  border-left: 4px solid #34d399 !important;
  border-radius: 13px !important;
  padding: 10px 15px !important;
  margin-bottom: 16px !important;
  color: #f0fdfa !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-status *,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkStatus * {
  color: #e2e8f0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-status b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkStatus b {
  color: #6ee7b7 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .ab-clone-mktick,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkStatus #mkTick {
  background: rgba(56, 189, 248, 0.24) !important;
  color: #bae6fd !important;
  border: 1px solid rgba(125, 211, 252, 0.45) !important;
}

/* Option B Primary Data Cards: 3-Stop Aurora Glass (Luminous Sapphire -> Indigo Glass -> Mint Lagoon) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds.odds-box {
  background:
    radial-gradient(ellipse at 92% 8%, rgba(45, 212, 191, 0.22), transparent 52%),
    radial-gradient(ellipse at 8% 10%, rgba(56, 189, 248, 0.22), transparent 54%),
    linear-gradient(135deg, #183c6c 0%, #132e56 52%, #10434e 100%) !important;
  border: 1.5px solid rgba(110, 231, 183, 0.42) !important;
  border-top: 3.5px solid var(--mk-tone, #38bdf8) !important;
  border-radius: 18px !important;
  padding: 20px 22px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.22),
    0 18px 38px rgba(2, 8, 22, 0.62) !important;
  color: #f8fafc !important;
}

/* Option B Section Headings, Buttons & Chips */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-box.mk-open-sec > h3,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mk-box.mk-open-sec > h3 {
  color: #f8fafc !important;
  border-bottom-color: rgba(125, 211, 252, 0.22) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .sub-inline,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .sub-inline,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .sub {
  color: #bae6fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .aku-control--quiet,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .aku-control--quiet {
  background: rgba(15, 34, 66, 0.85) !important;
  color: #e0f2fe !important;
  border: 1px solid rgba(125, 211, 252, 0.38) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .aku-control--nav,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .aku-control--nav {
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.26) 0%, rgba(16, 185, 129, 0.26) 100%) !important;
  color: #ecfeff !important;
  border: 1px solid rgba(94, 234, 212, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .chip,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .chip {
  background: rgba(30, 58, 95, 0.75) !important;
  color: #e2e8f0 !important;
  border-color: rgba(148, 163, 184, 0.35) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .chip.c-sky,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .chip.c-sky {
  background: rgba(56, 189, 248, 0.22) !important;
  color: #e0f2fe !important;
  border-color: rgba(125, 211, 252, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .chip.c-green,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .chip.c-green {
  background: rgba(16, 185, 129, 0.24) !important;
  color: #d1fae5 !important;
  border-color: rgba(52, 211, 153, 0.5) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .chip.c-red,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .chip.c-red {
  background: rgba(244, 63, 94, 0.24) !important;
  color: #ffe4e6 !important;
  border-color: rgba(251, 113, 133, 0.5) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .chip.c-gold,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .chip.c-amber,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .chip.c-gold,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .chip.c-amber {
  background: rgba(245, 158, 11, 0.24) !important;
  color: #fef3c7 !important;
  border-color: rgba(251, 191, 36, 0.5) !important;
}

/* Option B #mkSpy Interior: Hero Price, Gap Journey SVG, Quota Strip & Luminous Pastel Put/Call Sub-Cards */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .spy-price,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .spy-price {
  color: #f8fafc !important;
  text-shadow: 0 2px 12px rgba(56, 189, 248, 0.22) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .spy-chg.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .spy-chg.up {
  background: rgba(16, 185, 129, 0.26) !important;
  color: #a7f3d0 !important;
  border-color: rgba(52, 211, 153, 0.52) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .spy-chg.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .spy-chg:not(.up),
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .spy-chg.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .spy-chg:not(.up) {
  background: rgba(244, 63, 94, 0.26) !important;
  color: #fecdd3 !important;
  border-color: rgba(251, 113, 133, 0.52) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .spy-ext,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .spy-ext {
  color: #bae6fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .spy-ext b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .spy-ext b {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b svg.gap-journey-svg .wp-role,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] svg.gap-journey-svg .wp-role {
  fill: #bae6fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b svg.gap-journey-svg .wp-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] svg.gap-journey-svg .wp-px {
  fill: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-quota-strip,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-quota-strip {
  background: rgba(11, 25, 48, 0.58) !important;
  border-top: 1px solid rgba(125, 211, 252, 0.24) !important;
  border-bottom: 1px solid rgba(125, 211, 252, 0.24) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-qs-range,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-qs-range b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-qs-range small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-qs-range,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-qs-range b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-qs-range small {
  color: #e0f2fe !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-qs-verdict.is-tone-amber,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-qs-verdict.is-tone-amber {
  background: rgba(245, 158, 11, 0.24) !important;
  color: #fef3c7 !important;
  border-color: rgba(251, 191, 36, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-qs-verdict.is-tone-green,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-qs-verdict.is-tone-green {
  background: rgba(16, 185, 129, 0.24) !important;
  color: #d1fae5 !important;
  border-color: rgba(52, 211, 153, 0.48) !important;
}

/* Option B Luminous Pastel Action Cards (ลงต่อ ซื้อ Put / ขึ้นต่อ ซื้อ Call) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card {
  background: rgba(12, 28, 54, 0.72) !important;
  border: 1px solid rgba(125, 211, 252, 0.28) !important;
  border-left: 4px solid #38bdf8 !important;
  border-radius: 12px !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.25) 0%, rgba(136, 19, 55, 0.32) 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.48) !important;
  border-left: 4px solid #fb7185 !important;
  border-radius: 12px !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.25) 0%, rgba(6, 95, 70, 0.32) 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.48) !important;
  border-left: 4px solid #34d399 !important;
  border-radius: 12px !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-amber,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-amber {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.25) 0%, rgba(120, 53, 15, 0.32) 100%) !important;
  border: 1px solid rgba(251, 191, 36, 0.48) !important;
  border-left: 4px solid #fbbf24 !important;
  border-radius: 12px !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-lbl,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-gap-hist-note,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-kpi-lbl,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-gap-hist-note {
  color: #f1f5f9 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-val,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-gap-hist-note b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-kpi-val,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-gap-hist-note b {
  color: #ffffff !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-val.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-val .up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-kpi-val.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-kpi-val .up {
  color: #6ee7b7 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-val.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-val .down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-kpi-val.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-kpi-val .down {
  color: #fda4af !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gsp-main,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gsp-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-kpi-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gsp-main,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gsp-sub {
  color: #cbd5e1 !important;
}

/* Option B Unfilled Gaps Box (.gj-ug-hero, .gj-ug-far-col) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-title,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-hero-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-far-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-title,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-hero-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-far-px {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-hero,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-far-col,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-hero,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-far-col {
  background: rgba(11, 25, 48, 0.72) !important;
  border: 1px solid rgba(125, 211, 252, 0.28) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-reach-txt,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-far-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-far-rank,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-far-date,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-reach-txt,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-far-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-far-rank,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-far-date {
  color: #bae6fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-priority-pill,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-priority-pill {
  background: rgba(245, 158, 11, 0.24) !important;
  color: #fef3c7 !important;
  border-color: rgba(251, 191, 36, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-reach-tag,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-reach-tag {
  background: rgba(56, 189, 248, 0.22) !important;
  color: #e0f2fe !important;
  border-color: rgba(125, 211, 252, 0.45) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-hero-dist.is-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-far-meta.is-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-hero-dist.is-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-far-meta.is-up {
  background: rgba(16, 185, 129, 0.24) !important;
  color: #a7f3d0 !important;
  border-color: rgba(52, 211, 153, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-hero-dist.is-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-far-meta.is-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-hero-dist.is-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-far-meta.is-down {
  background: rgba(244, 63, 94, 0.24) !important;
  color: #fecdd3 !important;
  border-color: rgba(251, 113, 133, 0.48) !important;
}

/* Option B #mkMacd Interior: Decision Box, 5-TF Circuit Nodes & Timing Strip */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision {
  background: linear-gradient(90deg, rgba(56, 189, 248, 0.20) 0%, rgba(12, 28, 54, 0.78) 100%) !important;
  border: 1px solid rgba(125, 211, 252, 0.36) !important;
  border-left: 4px solid #38bdf8 !important;
  border-radius: 12px !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision.ls-tone-up {
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.24) 0%, rgba(12, 28, 54, 0.78) 100%) !important;
  border-color: rgba(52, 211, 153, 0.42) !important;
  border-left: 4px solid #34d399 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision.ls-tone-down {
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.24) 0%, rgba(12, 28, 54, 0.78) 100%) !important;
  border-color: rgba(251, 113, 133, 0.42) !important;
  border-left: 4px solid #fb7185 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-warning,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-wait,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision.ls-tone-warning,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision.ls-tone-wait {
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.24) 0%, rgba(12, 28, 54, 0.78) 100%) !important;
  border-color: rgba(251, 191, 36, 0.42) !important;
  border-left: 4px solid #fbbf24 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision > strong,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision > strong {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-up > strong,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision.ls-tone-up > strong {
  color: #6ee7b7 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-down > strong,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision.ls-tone-down > strong {
  color: #fda4af !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision > p,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision > p {
  color: #e2e8f0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision > .ls-warning,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision > .ls-warning {
  color: #fde68a !important;
}

html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-node {
  background-color: rgba(12, 28, 54, 0.78) !important;
  border-color: rgba(125, 211, 252, 0.32) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-node.is-down {
  background-color: rgba(159, 18, 57, 0.34) !important;
  border-color: rgba(251, 113, 133, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-node.is-up {
  background-color: rgba(6, 95, 70, 0.38) !important;
  border-color: rgba(52, 211, 153, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-tf,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-role,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-tf,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-role {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-sub {
  color: #fde68a !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-state.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-down .mfs-state,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-state.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-node.is-down .mfs-state {
  color: #fda4af !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-state.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-up .mfs-state,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-state.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-node.is-up .mfs-state {
  color: #6ee7b7 !important;
}

html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-timing-strip .mts-item,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mk-timing-strip .mts-item {
  background: rgba(11, 25, 48, 0.72) !important;
  border: 1px solid rgba(125, 211, 252, 0.28) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-timing-strip .mts-item small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-ema20-note,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mk-timing-strip .mts-item small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-ema20-note {
  color: #bae6fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .rsi-big-num,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-sub-val,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-sub-val b.flat,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .rsi-big-num,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-sub-val,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-sub-val b.flat {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .rsi-big-num.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-inline.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-sub-val b.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .rsi-big-num.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-inline.up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-sub-val b.up {
  color: #6ee7b7 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .rsi-big-num.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-inline.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-sub-val b.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .rsi-big-num.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-inline.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-sub-val b.down {
  color: #fda4af !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .rsi-big-num.flat,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-inline.flat,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .rsi-big-num.flat,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-inline.flat {
  color: #7dd3fc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-verdict.is-bear,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-verdict.is-bear {
  background: rgba(244, 63, 94, 0.24) !important;
  color: #fecdd3 !important;
  border-color: rgba(251, 113, 133, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-verdict.is-bull,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-verdict.is-bull {
  background: rgba(16, 185, 129, 0.24) !important;
  color: #a7f3d0 !important;
  border-color: rgba(52, 211, 153, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mts-verdict.is-flat,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mts-verdict.is-flat {
  background: rgba(56, 189, 248, 0.2) !important;
  color: #e0f2fe !important;
  border-color: rgba(125, 211, 252, 0.4) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b svg.mts-rsi-dial text,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] svg.mts-rsi-dial text {
  fill: #e2e8f0 !important;
}

/* Option B Full-Screen Support for #mkOdds, #mkLevels, #mkCross & #mkBreadth */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds .odds-head .gx-title,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds .odds-chips span,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds .odds-num b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds .odds-reads li,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds .mg-table th,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds .mg-table td,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .dte-subzone-title,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gex-bars-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gex-bars-head b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gbl-item,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .spy-clash-arena .sca-f-kicker,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .spy-clash-arena .sca-f-pct,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .spy-clash-arena .sca-f-pct b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mega-weight-strip .mws-lbl,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mega-weight-strip .mws-lbl b {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds .odds-head .gx-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds .odds-num span,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds .odds-note,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .dte-crumb,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .dte-subzone-sub {
  color: #bae6fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkLevels .lvl-list.is-frameless-strip .stat,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .hcd-overlap-card,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .sca-w-chip,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .tiles .tile {
  background: rgba(12, 28, 54, 0.78) !important;
  border-color: rgba(125, 211, 252, 0.28) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .tiles .tile.lean-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .sca-w-chip.is-bull {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.22), rgba(12, 28, 54, 0.82)) !important;
  border-color: rgba(52, 211, 153, 0.45) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .tiles .tile.lean-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .sca-w-chip.is-bear {
  background: linear-gradient(135deg, rgba(244, 63, 94, 0.22), rgba(12, 28, 54, 0.82)) !important;
  border-color: rgba(251, 113, 133, 0.45) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkLevels .lvl-list.is-frameless-strip .stat b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .hcd-overlap-card .hoc-kicker,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .hcd-overlap-card .hoc-dist,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .sca-w-chip .swc-sym,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .tiles .tile .t-name,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .tiles .tile .t-px {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkLevels .lvl-list.is-frameless-strip .stat small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .sca-w-chip .swc-role,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .tiles .tile .t-role-meta,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .tiles .tile .t-age {
  color: #bae6fd !important;
}

/* ==========================================================================
   V232 — ☀️ LIGHT MODE LOCKED TO B4 (ICE MIST) +
          🌙 4 DEEP DARK MODE ARCHITECTURES (D1 · D2 · D3 · D4)
   ========================================================================== */

/* ☀️ LIGHT MODE = B4 TWILIGHT ICE MIST (#c8dff8 ➔ #d5e6fa ➔ #c1ece0) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage {
  background:
    radial-gradient(ellipse at 88% 6%, rgba(16, 185, 129, 0.14), transparent 52%),
    linear-gradient(145deg, #dbeafe 0%, #e6f2fe 52%, #d4f4e8 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.55) !important;
  border-radius: 22px !important;
  padding: 20px 22px !important;
  box-shadow: 0 18px 38px rgba(15, 41, 66, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.75) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .panel-head,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds.odds-box,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile {
  background: linear-gradient(135deg, #c8dff8 0%, #d5e6fa 52%, #c1ece0 100%) !important;
  border: 1.5px solid rgba(3, 105, 161, 0.34) !important;
  border-top: 3.5px solid var(--mk-tone, #0284c7) !important;
  box-shadow:
    0 12px 28px rgba(15, 41, 66, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.70) !important;
  color: #0f2942 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkStatus {
  background: linear-gradient(90deg, #b8f2d6 0%, #d5e6fa 100%) !important;
  border: 1px solid rgba(13, 148, 136, 0.42) !important;
  border-left: 4px solid #0d9488 !important;
  color: #0f2942 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .gj-quota-strip {
  background: rgba(255, 255, 255, 0.42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green {
  background: linear-gradient(90deg, #b8f2d6 0%, #d8f8e8 100%) !important;
  border: 1px solid rgba(16, 185, 129, 0.42) !important;
  border-left: 4px solid #15803d !important;
  border-radius: 12px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  background: linear-gradient(90deg, #fbcfe8 0%, #ffe4ec 100%) !important;
  border: 1px solid rgba(225, 29, 72, 0.42) !important;
  border-left: 4px solid #be123c !important;
  border-radius: 12px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) details > summary {
  background: rgba(235, 245, 255, 0.76) !important;
  border: 1px solid rgba(15, 41, 66, 0.22) !important;
  color: #0f2942 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkMacd .mk-macd-decision.ls-tone-down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .macd-flow-strip .mfs-node.is-down {
  background: #fbd5df !important;
  border: 1px solid #f472b6 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkMacd .mk-macd-decision.ls-tone-up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .macd-flow-strip .mfs-node.is-up {
  background: #bcefd8 !important;
  border: 1px solid #34d399 !important;
}

/* --------------------------------------------------------------------------
   🌙 TRUE DEEP DARK MODE BASE (D1 · DEEP OBSIDIAN NAVY #071120 ➔ #0a182c)
   Replaces the bright blue/purple wash with deep obsidian + rich dark ruby/emerald wells
   -------------------------------------------------------------------------- */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #dteAbLiveStage {
  background: linear-gradient(165deg, rgba(6, 13, 26, 0.94) 0%, rgba(4, 10, 20, 0.98) 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.28) !important;
  border-radius: 22px !important;
  padding: 20px 22px !important;
  box-shadow: 0 24px 52px rgba(0, 0, 0, 0.72), inset 0 1px 0 rgba(186, 230, 253, 0.12) !important;
}

/* 1️⃣ D1 Card Surface: Deep Obsidian Navy (#071120 ➔ #09172a ➔ #071822) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #dteAbLiveStage > .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkOdds.odds-box {
  background:
    radial-gradient(ellipse at 90% 0%, rgba(56, 189, 248, 0.10), transparent 55%),
    linear-gradient(145deg, #071120 0%, #09172a 55%, #071822 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.32) !important;
  border-top: 3.5px solid var(--mk-tone, #38bdf8) !important;
  box-shadow:
    inset 0 1px 0 rgba(186, 230, 253, 0.16),
    0 18px 38px rgba(0, 0, 0, 0.68) !important;
  color: #f8fafc !important;
}

/* Deep Dark Gem Inner Sub-Boxes (NO powdery mauve/purple!) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-quota-strip,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-quota-strip {
  background: #050c17 !important;
  border: 1px solid rgba(96, 165, 250, 0.22) !important;
  border-radius: 10px !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green {
  background: linear-gradient(145deg, #06221b 0%, #051815 100%) !important;
  border: 1px solid rgba(16, 185, 129, 0.42) !important;
  border-left: 4px solid #10b981 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  background: linear-gradient(145deg, #240b16 0%, #180810 100%) !important;
  border: 1px solid rgba(244, 63, 94, 0.42) !important;
  border-left: 4px solid #f43f5e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-hero,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-ug-far-col,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-timing-strip .mts-item,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-hero,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .gj-ug-far-col,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .mk-timing-strip .mts-item {
  background: #050c17 !important;
  border: 1px solid rgba(96, 165, 250, 0.24) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision.ls-tone-down {
  background: linear-gradient(90deg, #260b17 0%, #120914 100%) !important;
  border: 1px solid rgba(244, 63, 94, 0.45) !important;
  border-left: 4px solid #f43f5e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkMacd .mk-macd-decision.ls-tone-up {
  background: linear-gradient(90deg, #06241d 0%, #071618 100%) !important;
  border: 1px solid rgba(16, 185, 129, 0.45) !important;
  border-left: 4px solid #10b981 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-node.is-down {
  background: linear-gradient(160deg, #240b16 0%, #160811 100%) !important;
  border: 1px solid rgba(244, 63, 94, 0.50) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .macd-flow-strip .mfs-node.is-up {
  background: linear-gradient(160deg, #06231c 0%, #051714 100%) !important;
  border: 1px solid rgba(16, 185, 129, 0.50) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b details,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b details > summary,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b details,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b details > summary {
  background: #050c17 !important;
  border-color: rgba(96, 165, 250, 0.24) !important;
  color: #bae6fd !important;
}

/* --------------------------------------------------------------------------
   2️⃣ PALETTE D2: MIDNIGHT CARBON & EMERALD EDGE (#090f18 ➔ #0b1420 ➔ #08181e)
   -------------------------------------------------------------------------- */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner.is-banner-b2 {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.22) 0%, rgba(10, 17, 28, 0.96) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.52) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner.is-banner-b2 .ab-col-tag {
  color: #6ee7b7 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-b2,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #dteAbLiveStage {
  background: linear-gradient(165deg, #060a11 0%, #05080f 100%) !important;
  border-color: rgba(45, 212, 191, 0.30) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #dteAbLiveStage > .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkOdds.odds-box {
  background:
    radial-gradient(ellipse at 92% 0%, rgba(45, 212, 191, 0.11), transparent 52%),
    linear-gradient(145deg, #090f18 0%, #0b131e 55%, #08171d 100%) !important;
  border: 1px solid rgba(45, 212, 191, 0.36) !important;
  border-top: 3.5px solid var(--mk-tone, #2dd4bf) !important;
  box-shadow:
    inset 0 1px 0 rgba(153, 246, 228, 0.15),
    0 18px 38px rgba(0, 0, 0, 0.75) !important;
}

/* --------------------------------------------------------------------------
   3️⃣ PALETTE D3: DARK STARLIGHT HARBOR (#0d213d ➔ #09172b ➔ #08242b)
      3-Stop Blue-Navy-Mint at HALF the brightness of old B1
   -------------------------------------------------------------------------- */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner.is-banner-b3 {
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.24) 0%, rgba(11, 24, 44, 0.96) 100%) !important;
  border: 1.5px solid rgba(125, 211, 252, 0.52) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner.is-banner-b3 .ab-col-tag {
  color: #7dd3fc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-b3,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b3 #dteAbLiveStage {
  background: linear-gradient(165deg, rgba(7, 16, 32, 0.94) 0%, rgba(5, 12, 24, 0.98) 100%) !important;
  border-color: rgba(56, 189, 248, 0.34) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b3 .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b3 #dteAbLiveStage > .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b3 .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b3 .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b3 #mkOdds.odds-box {
  background:
    radial-gradient(ellipse at 90% 8%, rgba(45, 212, 191, 0.14), transparent 52%),
    radial-gradient(ellipse at 10% 8%, rgba(56, 189, 248, 0.14), transparent 52%),
    linear-gradient(135deg, #0d213d 0%, #09172b 52%, #08242b 100%) !important;
  border: 1.5px solid rgba(94, 234, 212, 0.36) !important;
  border-top: 3.5px solid var(--mk-tone, #38bdf8) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    0 18px 38px rgba(0, 0, 0, 0.68) !important;
}

/* --------------------------------------------------------------------------
   4️⃣ PALETTE D4: OLED RECESSED NIGHT WELL
      Outer Stage is Illuminated Harbor (#102444 ➔ #0c2b36),
      Inner Cards are Recessed OLED Pitch-Night (#040a14 ➔ #060e1c)!
   -------------------------------------------------------------------------- */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner.is-banner-b4 {
  background: linear-gradient(135deg, rgba(56, 189, 248, 0.28) 0%, rgba(6, 12, 24, 0.98) 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.58) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner.is-banner-b4 .ab-col-tag {
  color: #38bdf8 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-b4,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b4 #dteAbLiveStage {
  background:
    radial-gradient(ellipse at 88% 6%, rgba(45, 212, 191, 0.20), transparent 52%),
    radial-gradient(ellipse at 12% 6%, rgba(56, 189, 248, 0.22), transparent 52%),
    linear-gradient(145deg, #12284c 0%, #0e203d 52%, #0d2e38 100%) !important;
  border: 1.5px solid rgba(125, 211, 252, 0.48) !important;
  box-shadow: 0 24px 52px rgba(0, 0, 0, 0.72), inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b4 .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b4 #dteAbLiveStage > .panel-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b4 .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b4 .mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b4 #mkOdds.odds-box {
  background: linear-gradient(160deg, #040913 0%, #060e1c 60%, #051218 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.42) !important;
  border-top: 3.5px solid var(--mk-tone, #38bdf8) !important;
  box-shadow:
    inset 0 2px 12px rgba(0, 0, 0, 0.75),
    0 12px 28px rgba(2, 6, 16, 0.65) !important;
  color: #f8fafc !important;
}

/* Dark Mode Top Hero (header.dte-head .dte-opening) -> Deep Obsidian Navy so no white/cream box remains in Dark Mode */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening {
  background:
    radial-gradient(ellipse at 88% 4%, rgba(45, 212, 191, 0.12), transparent 52%),
    linear-gradient(165deg, #060e1c 0%, #040a14 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.32) !important;
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.72), inset 0 1px 0 rgba(186, 230, 253, 0.14) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening h1,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .dte-opening-title,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .ov-head b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .ov-val,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening summary {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .dte-kicker,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .ov-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .gx-bar-meta,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .ov-meta {
  color: #bae6fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .gx-today,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening #overview.today-strip .ov-tile {
  background: linear-gradient(145deg, #091528 0%, #0b1930 55%, #081c24 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.32) !important;
  box-shadow: inset 0 1px 0 rgba(186, 230, 253, 0.14), 0 10px 24px rgba(0, 0, 0, 0.55) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .dte-disclaimer {
  background: rgba(244, 63, 94, 0.10) !important;
  border-color: rgba(244, 63, 94, 0.32) !important;
  color: #fecdd3 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening .dte-disclaimer b {
  color: #fda4af !important;
}








/* ==========================================================================
   V234 — 🌙 D2 MIDNIGHT CARBON + BOX-MATCHED CHROMATIC HIERARCHY
   (Audi 2026-10-28: "D2แต่สีที่มัวๆให้เป็นไปตามสีกล่องดีไหม")
   Every card & sub-box tints its ambient glow, border, sub-containers, and
   secondary/muted text ("สีที่มัวๆ") to match its own box color (--mk-tone /
   emerald / crimson / amber / sky / violet) instead of muddy grey or dim ink.
   ========================================================================== */

/* 1. Main Boxes in D2: Each Card's Ambient Glow, Rim & Muted Text Follow Its Box Color (--mk-tone) */
/* 1A. #mkSpy / .ab-clone-spy -> Emerald Box (--mk-tone: #10b981) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy.mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy.mk-box.mk-open-sec {
  --mk-tone: #10b981;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(16, 185, 129, 0.18), transparent 56%),
    linear-gradient(145deg, #081218 0%, #09181b 55%, #071e1a 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.44) !important;
  border-top: 3.5px solid #10b981 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .sub-inline,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .spy-ext,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .gj-ug-title,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .gj-ug-reach-txt,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .gj-ug-far-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .gj-ug-far-rank,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .gj-ug-far-date,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .sub-inline,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .spy-ext,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .gj-ug-title,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .gj-ug-reach-txt,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .gj-ug-far-head,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .gj-ug-far-rank,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .gj-ug-far-date {
  color: #a7f3d0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy svg.gap-journey-svg .wp-role,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy svg.gap-journey-svg .wp-role {
  fill: #a7f3d0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .gj-quota-strip,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .gj-ug-hero,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy .gj-ug-far-col,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy details,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-spy details > summary,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .gj-quota-strip,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .gj-ug-hero,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy .gj-ug-far-col,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy details,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkSpy details > summary {
  background: linear-gradient(145deg, #071d1a 0%, #061414 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.34) !important;
  color: #ecfdf5 !important;
}

/* 1B. #mkMacd / .ab-clone-macd -> Sky-Cyan Box (--mk-tone: #38bdf8) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-macd.mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkMacd.mk-box.mk-open-sec {
  --mk-tone: #38bdf8;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(56, 189, 248, 0.18), transparent 56%),
    linear-gradient(145deg, #08111c 0%, #091624 55%, #071b27 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.44) !important;
  border-top: 3.5px solid #38bdf8 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-macd .mk-timing-strip .mts-item,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-macd details,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-macd details > summary,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkMacd .mk-timing-strip .mts-item,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkMacd details,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkMacd details > summary {
  background: linear-gradient(145deg, #071928 0%, #06121e 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.34) !important;
  color: #f0f9ff !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-macd .mk-timing-strip .mts-item small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b2 .ab-clone-macd .mts-ema20-note,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkMacd .mk-timing-strip .mts-item small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkMacd .mts-ema20-note {
  color: #7dd3fc !important;
}

/* 2. Colored Sub-Boxes Inside #mkSpy & #mkMacd: Muted Text ("สีที่มัวๆ") Matches the Box Color! */
/* 2A. Green Sub-Boxes (.gj-kpi-card.is-tone-green, .mk-macd-decision.ls-tone-up, .mfs-node.is-up) -> Rich Emerald + Soft Mint Text (#a7f3d0) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green {
  background: linear-gradient(145deg, #083024 0%, #052018 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.50) !important;
  border-left: 4px solid #10b981 !important;
  box-shadow: inset 0 1px 0 rgba(167, 243, 208, 0.16) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-green .gj-kpi-lbl,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-green .gj-kpi-lbl {
  color: #d1fae5 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-green .gj-kpi-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-green .gsp-main,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-green .gsp-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-green .gj-gap-hist-note,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-green .gj-kpi-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-green .gsp-main,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-green .gsp-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-green .gj-gap-hist-note {
  color: #86efac !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-green .gj-gap-hist-note b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-green .gj-gap-hist-note b {
  color: #ecfdf5 !important;
}

/* 2B. Red Sub-Boxes (.gj-kpi-card.is-tone-red, .mk-macd-decision.ls-tone-down, .mfs-node.is-down) -> Rich Crimson + Soft Rose Text (#fecdd3) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  background: linear-gradient(145deg, #350e1e 0%, #220914 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.50) !important;
  border-left: 4px solid #f43f5e !important;
  box-shadow: inset 0 1px 0 rgba(254, 205, 211, 0.16) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-red .gj-kpi-lbl,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-red .gj-kpi-lbl {
  color: #ffe4e6 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-red .gj-kpi-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-red .gsp-main,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .gj-kpi-card.is-tone-red .gsp-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-red .gj-kpi-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-red .gsp-main,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkSpy .gj-kpi-card.is-tone-red .gsp-sub {
  color: #fda4af !important;
}

/* MACD Decision Box & 5-TF Circuit Nodes: Secondary Text Matches Red/Green Box Color! */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkMacd .mk-macd-decision.ls-tone-down {
  background: linear-gradient(90deg, #350e1e 0%, #1e0914 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.52) !important;
  border-left: 4px solid #f43f5e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-down > p,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkMacd .mk-macd-decision.ls-tone-down > p {
  color: #fecdd3 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkMacd .mk-macd-decision.ls-tone-up {
  background: linear-gradient(90deg, #083024 0%, #051e17 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.52) !important;
  border-left: 4px solid #10b981 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .mk-macd-decision.ls-tone-up > p,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkMacd .mk-macd-decision.ls-tone-up > p {
  color: #a7f3d0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .macd-flow-strip .mfs-node.is-down {
  background: linear-gradient(160deg, #330e1d 0%, #1e0812 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-down .mfs-role,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .macd-flow-strip .mfs-node.is-down .mfs-role {
  color: #fecdd3 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .macd-flow-strip .mfs-node.is-up {
  background: linear-gradient(160deg, #083024 0%, #051d16 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-scope-b .macd-flow-strip .mfs-node.is-up .mfs-role,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .macd-flow-strip .mfs-node.is-up .mfs-role {
  color: #a7f3d0 !important;
}

/* 3. Lower Market Cards (#mkOdds, #mkLevels, #mkCross, #mkBreadth) -> Box-Matched Chromatic Tones! */
/* 3A. #mkOdds (Teal-Aqua Box --mk-tone: #2dd4bf) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkOdds.odds-box {
  --mk-tone: #2dd4bf;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(45, 212, 191, 0.16), transparent 55%),
    linear-gradient(145deg, #08121a 0%, #091820 55%, #071d22 100%) !important;
  border: 1px solid rgba(45, 212, 191, 0.42) !important;
  border-top: 3.5px solid #2dd4bf !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkOdds .odds-verdict.is-good {
  background: linear-gradient(90deg, #083024 0%, #051e17 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.50) !important;
  border-left: 4px solid #10b981 !important;
  color: #d1fae5 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkOdds .odds-verdict.is-good b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkOdds .odds-verdict.is-good strong {
  color: #6ee7b7 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkOdds .odds-verdict.is-bad {
  background: linear-gradient(90deg, #350e1e 0%, #1e0914 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.50) !important;
  border-left: 4px solid #f43f5e !important;
  color: #fecdd3 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkOdds .odds-head .gx-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkOdds .odds-num span,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkOdds .odds-note,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkOdds .odds-early {
  color: #99f6e4 !important;
}

/* 3B. #mkLevels (Amber-Gold Box --mk-tone: #f59e0b) + 5 GEX Stat Boxes Matched to Their Own Box Colors! */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkLevels.mk-box.mk-open-sec {
  --mk-tone: #f59e0b;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(245, 158, 11, 0.16), transparent 55%),
    linear-gradient(145deg, #0b1018 0%, #11141d 55%, #18130a 100%) !important;
  border: 1px solid rgba(251, 191, 36, 0.42) !important;
  border-top: 3.5px solid #f59e0b !important;
}
/* 1) Call Wall Box -> Emerald Box + Soft Mint Sub-Text */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(1) {
  background: linear-gradient(145deg, #082d22 0%, #051d16 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.48) !important;
  border-top: 3px solid #10b981 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(1) small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(1) .s,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(1) .k {
  color: #86efac !important;
}
/* 2) Put Wall Box -> Crimson Box + Soft Rose Sub-Text */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(2) {
  background: linear-gradient(145deg, #330e1d 0%, #200913 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.48) !important;
  border-top: 3px solid #f43f5e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(2) small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(2) .s,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(2) .k {
  color: #fda4af !important;
}
/* 3) Zero Gamma Box -> Amber-Gold Box + Soft Gold Sub-Text */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(3) {
  background: linear-gradient(145deg, #2d1e08 0%, #1d1305 100%) !important;
  border: 1px solid rgba(251, 191, 36, 0.48) !important;
  border-top: 3px solid #f59e0b !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(3) small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(3) .s,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(3) .k {
  color: #fde68a !important;
}
/* 4) Net GEX Box -> Semantic Red Box when Net GEX < 0 (เร่งเทรนด์) or Emerald Box when Net GEX > 0 */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(4) {
  background: linear-gradient(145deg, #072726 0%, #051919 100%) !important;
  border: 1px solid rgba(45, 212, 191, 0.48) !important;
  border-top: 3px solid #2dd4bf !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(4).is-tone-red {
  background: linear-gradient(145deg, #4c1127 0%, #2d0a17 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.68) !important;
  border-top: 3.5px solid #f43f5e !important;
  box-shadow: 0 10px 22px -14px rgba(244, 63, 94, 0.42) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(4) small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(4) .s,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(4) .k {
  color: #5eead4 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(4).is-tone-red small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(4).is-tone-red em {
  color: #fecdd3 !important;
}
/* 5) Expected Move Box -> Sky-Cyan Box + Soft Sky Sub-Text */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(5) {
  background: linear-gradient(145deg, #081f32 0%, #061523 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.48) !important;
  border-top: 3px solid #38bdf8 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(5) small,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(5) .s,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(5) .k {
  color: #7dd3fc !important;
}

/* 3C. #mkCross (Force Clash Arena --mk-tone: #f43f5e) -> Call & Put Asset Boxes Match Their Green/Red Box Color! */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkCross.mk-box.mk-open-sec {
  --mk-tone: #f43f5e;
  background:
    radial-gradient(ellipse at 12% 0%, rgba(16, 185, 129, 0.14), transparent 50%),
    radial-gradient(ellipse at 88% 0%, rgba(244, 63, 94, 0.16), transparent 50%),
    linear-gradient(145deg, #091018 0%, #0d131d 55%, #160d16 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.40) !important;
  border-top: 3.5px solid #f43f5e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .sca-w-chip.is-bull {
  background: linear-gradient(145deg, #082e22 0%, #051d16 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.48) !important;
  border-left: 3.5px solid #10b981 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .sca-w-chip.is-bull .swc-role {
  color: #86efac !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .sca-w-chip.is-bear {
  background: linear-gradient(145deg, #330e1d 0%, #200913 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.48) !important;
  border-left: 3.5px solid #f43f5e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .sca-w-chip.is-bear .swc-role {
  color: #fda4af !important;
}

/* 3D. #mkBreadth (12 Mega-Cap AI Stocks --mk-tone: #a78bfa) -> Stock Tiles Match Their Green/Red/Violet Box Color! */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 #mkBreadth.mk-box.mk-open-sec {
  --mk-tone: #a78bfa;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(167, 139, 250, 0.18), transparent 55%),
    linear-gradient(145deg, #0a0f1a 0%, #101224 55%, #150f26 100%) !important;
  border: 1px solid rgba(167, 139, 250, 0.42) !important;
  border-top: 3.5px solid #a78bfa !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .tiles .tile.lean-up {
  background: linear-gradient(145deg, #082e22 0%, #051d16 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .tiles .tile.lean-up .t-role-meta,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .tiles .tile.lean-up .t-age {
  color: #86efac !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .tiles .tile.lean-down {
  background: linear-gradient(145deg, #330e1d 0%, #200913 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .tiles .tile.lean-down .t-role-meta,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .tiles .tile.lean-down .t-age {
  color: #fda4af !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .tiles .tile:not(.lean-up):not(.lean-down) {
  background: linear-gradient(145deg, #131429 0%, #0c0d1c 100%) !important;
  border: 1px solid rgba(167, 139, 250, 0.36) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .tiles .tile:not(.lean-up):not(.lean-down) .t-role-meta,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b .tiles .tile:not(.lean-up):not(.lean-down) .t-age {
  color: #ddd6fe !important;
}

/* 4. Compact V11 Controls & Frameless 16-bit Sprites in Dark Mode (#panel-market & #main) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .ak-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gxt-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .ov-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .risk-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .tab-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .ak-emoji-lead,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .mk-head-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .mk-sec-px {
  display: inline-block;
  vertical-align: -3px;
  flex-shrink: 0;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .aku-control,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .mk-how-btn,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .mk-jump-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--aku-font-body, var(--font-body)) !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-decoration: none !important;
  min-height: 36px !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--aku-sky-2, #151c28), var(--aku-sky-3, #1e2738)) !important;
  color: var(--aku-text, #f1f5f9) !important;
  border: 1px solid var(--aku-line, rgba(148, 163, 184, 0.32)) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .mk-jump-btn {
  background: linear-gradient(135deg, rgba(6, 78, 59, 0.55), rgba(4, 47, 46, 0.72)) !important;
  color: #a7f3d0 !important;
  border-color: rgba(52, 211, 153, 0.52) !important;
}


/* ==========================================================================
   V236 — 🌙 DARK MODE LOCKED TO D1 (DEEP OBSIDIAN NAVY) + ☀️ 4 LIGHT MODE PALETTES (L1 · L2 · L3 · L4)
   Audi 2026-10-28: "D1 แล้วกันสำหรับdark แต่ทีนี้ทำของlightมาเทียบให้หน่อยได้ไหม"
   ========================================================================== */

/* --------------------------------------------------------------------------
   PART A: Complete D1 (Deep Obsidian Navy) Outer Card Shells for Dark Mode
   -------------------------------------------------------------------------- */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkSpy.mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) .ab-clone-spy.mk-box.mk-open-sec {
  --mk-tone: #60a5fa;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(56, 189, 248, 0.16), transparent 55%),
    linear-gradient(145deg, #071120 0%, #09172b 54%, #081a28 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.36) !important;
  border-top: 3.5px solid #60a5fa !important;
  box-shadow: 0 18px 40px -22px rgba(2, 6, 15, 0.94), inset 0 1px 0 rgba(147, 197, 253, 0.16) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkSpy .mk-sec-head p,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkSpy .spy-ohlc span,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkSpy .spy-ohlc-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkSpy .gx-sub {
  color: #93c5fd !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkMacd.mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) .ab-clone-macd.mk-box.mk-open-sec {
  --mk-tone: #10b981;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(16, 185, 129, 0.16), transparent 55%),
    linear-gradient(145deg, #071120 0%, #091829 54%, #061c22 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.36) !important;
  border-top: 3.5px solid #10b981 !important;
  box-shadow: 0 18px 40px -22px rgba(2, 6, 15, 0.94), inset 0 1px 0 rgba(110, 231, 183, 0.14) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkOdds.mk-box.mk-open-sec {
  --mk-tone: #2dd4bf;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(45, 212, 191, 0.15), transparent 55%),
    linear-gradient(145deg, #071120 0%, #091829 54%, #061d24 100%) !important;
  border: 1px solid rgba(45, 212, 191, 0.38) !important;
  border-top: 3.5px solid #2dd4bf !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkLevels.mk-box.mk-open-sec {
  --mk-tone: #f59e0b;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(245, 158, 11, 0.15), transparent 55%),
    linear-gradient(145deg, #071120 0%, #0b1628 54%, #151412 100%) !important;
  border: 1px solid rgba(251, 191, 36, 0.38) !important;
  border-top: 3.5px solid #f59e0b !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkCross.mk-box.mk-open-sec {
  --mk-tone: #f43f5e;
  background:
    radial-gradient(ellipse at 12% 0%, rgba(16, 185, 129, 0.13), transparent 50%),
    radial-gradient(ellipse at 88% 0%, rgba(244, 63, 94, 0.15), transparent 50%),
    linear-gradient(145deg, #071120 0%, #0b1526 54%, #150e1c 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.38) !important;
  border-top: 3.5px solid #f43f5e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b:not(.ab-scope-b2):not(.ab-scope-b3):not(.ab-scope-b4) #mkBreadth.mk-box.mk-open-sec {
  --mk-tone: #a78bfa;
  background:
    radial-gradient(ellipse at 92% 0%, rgba(167, 139, 250, 0.16), transparent 55%),
    linear-gradient(145deg, #071120 0%, #0c1428 54%, #131028 100%) !important;
  border: 1px solid rgba(167, 139, 250, 0.38) !important;
  border-top: 3.5px solid #a78bfa !important;
}

/* --------------------------------------------------------------------------
   PART B: Light Mode Lab Bar & 2x2 Comparison Frame Styling
   -------------------------------------------------------------------------- */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLabBar {
  background: linear-gradient(135deg, #eef6ff 0%, #f5faff 50%, #ecfbf4 100%) !important;
  border: 1.5px solid rgba(37, 99, 235, 0.28) !important;
  box-shadow: 0 12px 28px -16px rgba(15, 23, 42, 0.12) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLabBar .ab-lab-kicker {
  color: #1d4ed8 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLabBar .ab-lab-title b {
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLabBar .ab-lab-btn {
  background: #ffffff !important;
  color: #1e3a8a !important;
  border: 1px solid rgba(59, 130, 246, 0.32) !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.05) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLabBar .ab-lab-btn.is-active {
  background: linear-gradient(135deg, #2563eb 0%, #0d9488 100%) !important;
  color: #ffffff !important;
  border-color: #1d4ed8 !important;
  box-shadow: 0 6px 16px -4px rgba(37, 99, 235, 0.42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLabBar .ab-lab-btn.is-theme-toggle {
  background: linear-gradient(135deg, #091528 0%, #0f243c 100%) !important;
  color: #e0f2fe !important;
  border-color: rgba(56, 189, 248, 0.50) !important;
}

/* Comparison Column Wrappers in Light Mode */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-compare-col {
  border-radius: 22px !important;
  padding: 14px !important;
  box-shadow: 0 18px 38px -20px rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-compare-col.is-col-b1 {
  background: linear-gradient(180deg, #f5f9ff 0%, #edf6fe 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.30) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-compare-col.is-col-b2 {
  background: linear-gradient(180deg, #bfd9f6 0%, #b4e6d8 100%) !important;
  border: 1.5px solid rgba(29, 78, 216, 0.38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-compare-col.is-col-b3 {
  background: linear-gradient(180deg, #c6dff8 0%, #bfece0 100%) !important;
  border: 1.5px solid rgba(13, 148, 136, 0.36) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-compare-col.is-col-b4 {
  background: linear-gradient(180deg, #ece8de 0%, #dcefe6 100%) !important;
  border: 1.5px solid rgba(15, 118, 110, 0.32) !important;
}

/* Column Header Banners in Light Mode */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner {
  background: rgba(255, 255, 255, 0.88) !important;
  border: 1px solid rgba(59, 130, 246, 0.26) !important;
  box-shadow: 0 6px 16px -8px rgba(15, 23, 42, 0.08) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner .ab-col-tag {
  color: #1d4ed8 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner h3 {
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner p {
  color: #1e3a5f !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner p b {
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner code {
  background: #e0f2fe !important;
  color: #0369a1 !important;
  border: 1px solid rgba(14, 165, 233, 0.28) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-col-banner .ab-use-btn {
  background: linear-gradient(135deg, #1d4ed8 0%, #0d9488 100%) !important;
  color: #ffffff !important;
  border: 0 !important;
}

/* --------------------------------------------------------------------------
   Shared Light Mode Fix for Cloned MACD Decision Banner & Box-Matched Sub-Text
   -------------------------------------------------------------------------- */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision {
  background: #ffffff !important;
  border: 1px solid rgba(37, 99, 235, 0.24) !important;
  border-left: 4px solid #0284c7 !important;
  color: #0f172a !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision.ls-tone-up {
  background: linear-gradient(90deg, #dcfce7 0%, #f0fdf4 100%) !important;
  border: 1px solid rgba(16, 185, 129, 0.36) !important;
  border-left: 4px solid #15803d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision.ls-tone-down {
  background: linear-gradient(90deg, #ffe4e6 0%, #fff1f2 100%) !important;
  border: 1px solid rgba(244, 63, 94, 0.36) !important;
  border-left: 4px solid #be123c !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision.ls-tone-warning,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision.ls-tone-wait {
  background: linear-gradient(90deg, #fef3c7 0%, #fffbeb 100%) !important;
  border: 1px solid rgba(217, 119, 6, 0.36) !important;
  border-left: 4px solid #d97706 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision > strong {
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision.ls-tone-up > strong {
  color: #064e3b !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision.ls-tone-up > p {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision.ls-tone-down > strong {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-macd-decision.ls-tone-down > p {
  color: #9f1239 !important;
}

/* --------------------------------------------------------------------------
   1️⃣ PALETTE L1: CRISP COOL WHITE & MINT-SKY (.ab-scope-l1)
   Pure crisp white to soft sky-mint on a soft morning sky stage
   -------------------------------------------------------------------------- */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l1,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage {
  background: linear-gradient(135deg, #e4f0fc 0%, #eef6fe 52%, #e2f7ef 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.28) !important;
  border-radius: 20px !important;
  padding: 16px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l1 .mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .mk-box.mk-open-sec {
  background: linear-gradient(135deg, #ffffff 0%, #f7faff 56%, #f0fcf6 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.28) !important;
  border-top: 3.5px solid var(--mk-tone, #2563eb) !important;
  box-shadow: 0 14px 30px -18px rgba(15, 23, 42, 0.12), inset 0 1px 0 #ffffff !important;
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l1 .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l1 .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l1 .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l1 .gj-quota-strip,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l1 .mk-timing-strip .mts-item,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .gj-quota-strip,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .mk-timing-strip .mts-item {
  background: #ffffff !important;
  border: 1px solid rgba(59, 130, 246, 0.22) !important;
}

/* --------------------------------------------------------------------------
   2️⃣ PALETTE L2: ICE MIST (.ab-scope-l2 — Zero White Glare, Tinted Sky-Aqua)
   -------------------------------------------------------------------------- */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage {
  background: linear-gradient(135deg, #9ec5f0 0%, #add0f5 52%, #96dcc8 100%) !important;
  border: 1.5px solid rgba(29, 78, 216, 0.42) !important;
  border-radius: 20px !important;
  padding: 16px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .mk-box.mk-open-sec {
  background: linear-gradient(135deg, #c2dffb 0%, #cfe6fc 52%, #b8ebd9 100%) !important;
  border: 1.5px solid rgba(37, 99, 235, 0.44) !important;
  border-top: 3.5px solid var(--mk-tone, #1d4ed8) !important;
  box-shadow: 0 16px 32px -18px rgba(12, 30, 58, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.55) !important;
  color: #071324 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .gj-quota-strip,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .gj-hist-details,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .mk-timing-strip .mts-item,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .gj-quota-strip,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .gj-hist-details,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .mk-timing-strip .mts-item {
  background: linear-gradient(135deg, #d6eafd 0%, #dff0fe 55%, #cbf3e5 100%) !important;
  border: 1px solid rgba(37, 99, 235, 0.36) !important;
  color: #071324 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .mk-macd-decision.ls-tone-down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .macd-flow-strip .mfs-node.is-down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .mk-macd-decision.ls-tone-down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .macd-flow-strip .mfs-node.is-down {
  background: linear-gradient(135deg, #fecdd3 0%, #fbcfe8 100%) !important;
  border-color: rgba(225, 29, 72, 0.48) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .mk-macd-decision.ls-tone-up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l2 .macd-flow-strip .mfs-node.is-up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .mk-macd-decision.ls-tone-up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l2 #dteAbLiveStage .macd-flow-strip .mfs-node.is-up {
  background: linear-gradient(135deg, #a7f3d0 0%, #99f6e4 100%) !important;
  border-color: rgba(5, 150, 105, 0.48) !important;
}

/* --------------------------------------------------------------------------
   3️⃣ PALETTE L3: CLOUD PORCELAIN ON ICE MIST STAGE (.ab-scope-l3)
   Outer stage is Ice Mist (#a8cdf3 -> #9ee2ce), while cards inside are
   Soft Cloud Porcelain (#f4f9ff -> #e8f8f1) with recessed Sky-Tint sub-boxes!
   -------------------------------------------------------------------------- */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l3,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l3 #dteAbLiveStage {
  background: linear-gradient(135deg, #a8cdf3 0%, #b8d8f8 50%, #9ee2ce 100%) !important;
  border: 1.5px solid rgba(37, 99, 235, 0.38) !important;
  border-radius: 20px !important;
  padding: 16px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l3 .mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l3 #dteAbLiveStage .mk-box.mk-open-sec {
  background: linear-gradient(135deg, #f5f9ff 0%, #ecf4fe 54%, #e6f8f0 100%) !important;
  border: 1.5px solid rgba(37, 99, 235, 0.38) !important;
  border-top: 3.5px solid var(--mk-tone, #2563eb) !important;
  box-shadow: 0 20px 38px -16px rgba(12, 32, 68, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.96) !important;
  color: #0b172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l3 .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l3 .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l3 .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l3 .gj-quota-strip,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l3 .gj-hist-details,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l3 .mk-timing-strip .mts-item,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l3 #dteAbLiveStage .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l3 #dteAbLiveStage .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l3 #dteAbLiveStage .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l3 #dteAbLiveStage .gj-quota-strip,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l3 #dteAbLiveStage .gj-hist-details,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l3 #dteAbLiveStage .mk-timing-strip .mts-item {
  background: linear-gradient(135deg, #e0effe 0%, #e7f3fe 55%, #daf4e8 100%) !important;
  border: 1px solid rgba(59, 130, 246, 0.30) !important;
  color: #0b172a !important;
}

/* --------------------------------------------------------------------------
   4️⃣ PALETTE L4: SUNLIT DAWN IVORY & SAGE-MINT (.ab-scope-l4)
   Warm morning paper (#fbf8ee -> #f4f6ed -> #e4f4ea) on a sunlit harbour stage
   -------------------------------------------------------------------------- */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l4,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l4 #dteAbLiveStage {
  background: linear-gradient(135deg, #e2dccb 0%, #dce7ee 52%, #cbe5d8 100%) !important;
  border: 1.5px solid rgba(180, 130, 50, 0.34) !important;
  border-radius: 20px !important;
  padding: 16px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l4 .mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l4 #dteAbLiveStage .mk-box.mk-open-sec {
  background: linear-gradient(135deg, #fcf9f0 0%, #f5f6ee 54%, #e6f5ec 100%) !important;
  border: 1.5px solid rgba(180, 130, 50, 0.32) !important;
  border-top: 3.5px solid var(--mk-tone, #0d9488) !important;
  box-shadow: 0 16px 32px -18px rgba(40, 32, 18, 0.16), inset 0 1px 0 #fffdf7 !important;
  color: #1c1917 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l4 .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l4 .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l4 .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l4 .gj-quota-strip,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l4 .gj-hist-details,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-stage-shell.ab-scope-l4 .mk-timing-strip .mts-item,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l4 #dteAbLiveStage .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l4 #dteAbLiveStage .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l4 #dteAbLiveStage .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l4 #dteAbLiveStage .gj-quota-strip,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l4 #dteAbLiveStage .gj-hist-details,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l4 #dteAbLiveStage .mk-timing-strip .mts-item {
  background: linear-gradient(135deg, #f3efe2 0%, #eef2ea 55%, #dff2e6 100%) !important;
  border: 1px solid rgba(180, 130, 50, 0.28) !important;
  color: #1c1917 !important;
}

/* --------------------------------------------------------------------------
   PART C: Box-Matched Chromatic Secondary Text in Light Mode (L1 · L2 · L3 · L4)
   "สีที่มัวๆ ให้เป็นไปตามสีกล่อง" — Green box -> Deep Emerald sub-text,
   Red box -> Deep Rose sub-text, Sky/Navy box -> Cobalt Blue sub-text
   -------------------------------------------------------------------------- */
/* Green / Call / Bullish Sub-Boxes in Light Mode */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .macd-flow-strip .mfs-node.is-up .mfs-role,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .macd-flow-strip .mfs-node.is-up .mfs-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-side.is-call .odds-why,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-side.is-call small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(1) small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(1) .s,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull .swc-role,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up .t-role-meta,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up .t-age {
  color: #065f46 !important;
  font-weight: 700 !important;
}
/* Red / Put / Bearish Sub-Boxes in Light Mode */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .macd-flow-strip .mfs-node.is-down .mfs-role,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .macd-flow-strip .mfs-node.is-down .mfs-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-side.is-put .odds-why,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-side.is-put small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(2) small,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(2) .s,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear .swc-role,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down .t-role-meta,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down .t-age {
  color: #9f1239 !important;
  font-weight: 700 !important;
}
/* Sky / Cobalt / Neutral Sub-Boxes in Light Mode */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .gj-kpi-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .gj-gap-hist-note,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .gj-ug-reach-txt,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .gj-ug-far-head,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-ext {
  color: #1e3a8a !important;
}


/* ==========================================================================
   V237 — LOCKED L1 (LIGHT) + D1 (DARK) PRODUCTION PAIR & FULL HARMONIZATION
   OF NAVIGATOR BAR (#tabList + Top Shell), HERO STAGE & BUTTONS (2026-10-28)
   Audi 2026-10-28: "เอา 1️⃣ โทน L1 · CRISP COOL WHITE & MINT-SKY ... แล้วกัน แล้วเซฟลงคลังไหม
   ทีนี้ได้โทนแล้ว ต้องไปดูเรื่องอื่นเช่น navigator bar, ปุ่มต่างๆป่ะ"
   ========================================================================== */

/* 1. Harmonize Light Mode Root Tokens Across #main to L1 (Crisp Cool White & Mint-Sky, replacing old #f3efe4 cream) */
html[data-theme="light"] body:not(#akx) #main:not(#aky),
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) {
  --aku-paper: #ffffff !important;
  --dc-panel: #f6faff !important;
  --dc-card: #ffffff !important;
  --dc-ink: #0f172a !important;
  --dc-muted: #1e3a8a !important;
  --dc-edge: rgba(59, 130, 246, 0.32) !important;
  --dc-blue: #eaf4ff !important;
  --dc-mint: #e8fbf3 !important;
  --dc-surface: linear-gradient(135deg, #e4f0fc 0%, #eef6fe 52%, #e2f7ef 100%) !important;
  --dc-card-surface: linear-gradient(135deg, #ffffff 0%, #f6faff 56%, #eefbf5 100%) !important;
}
/* 2. Sub-Navigator Bar (nav.tabs #tabList) — Harmonized for Both L1 (Light) & D1 (Dark) */

/* ☀️ Light Mode (L1): Crisp Cool White Capsules + Box-Matched Group Text */

/* 🌙 Dark Mode (D1): Deep Obsidian Navy Capsules + Box-Matched Pastel Group Text (Fixes V226 dark-on-dark tab ink!) */


/* 3. Harmonize Hero Opening Stage (header.dte-head .dte-opening, .gx-today, .ov-tile) in D1 Dark Mode */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening {
  background:
    radial-gradient(ellipse at 88% 0%, rgba(56, 189, 248, 0.14), transparent 55%),
    linear-gradient(165deg, #060d1a 0%, #071222 54%, #05131c 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.28) !important;
  border-radius: 22px !important;
  padding: 20px 24px !important;
  box-shadow: 0 22px 48px -24px rgba(0, 0, 0, 0.92), inset 0 1px 0 rgba(148, 163, 184, 0.12) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gx-today {
  background: linear-gradient(145deg, #071120 0%, #091829 55%, #061c22 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.38) !important;
  border-left: 4px solid var(--gt, #10b981) !important;
  border-radius: 16px !important;
  box-shadow: 0 14px 32px -18px rgba(2, 6, 15, 0.90) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile {
  background: linear-gradient(145deg, #071120 0%, #09172b 58%, #071822 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.34) !important;
  border-radius: 14px !important;
  box-shadow: 0 12px 26px -16px rgba(2, 6, 15, 0.88) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-note,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-sub-muted {
  color: #93c5fd !important;
}

/* 4. Unified Buttons & Interactive Controls Across L1 (Light) & D1 (Dark) */
/* ☀️ Light Mode (L1) Buttons */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-control,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .mk-how-btn,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .btn.btn-ghost:not(.aku-cta),
html[data-theme="light"] body:not(#akx) #main:not(#aky) .def-quiet-btn {
  background: linear-gradient(180deg, #ffffff 0%, #f2f8ff 100%) !important;
  color: #1e3a8a !important;
  border: 1px solid rgba(59, 130, 246, 0.34) !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-control:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .mk-how-btn:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .btn.btn-ghost:not(.aku-cta):hover {
  background: linear-gradient(135deg, #e0f2fe 0%, #dcfce7 100%) !important;
  color: #0f172a !important;
  border-color: rgba(37, 99, 235, 0.52) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-control.aku-control--nav,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .mk-jump-btn {
  background: linear-gradient(180deg, #dcfce7 0%, #bbf7d0 100%) !important;
  color: #064e3b !important;
  border: 1px solid rgba(16, 185, 129, 0.45) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .aku-cta.aku-cta--ghost {
  background: linear-gradient(180deg, #ffffff 0%, #f0f7ff 100%) !important;
  color: #1e3a8a !important;
  border: 1px solid rgba(59, 130, 246, 0.34) !important;
}

/* 🌙 Dark Mode (D1) Capsule Controls (Web Standard v2 / Controls29 — No Navy Rounded Rectangles) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .aku-control,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .mk-how-btn,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .btn.btn-ghost:not(.aku-cta),
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .def-quiet-btn {
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--aku-sky-2, #151c28), var(--aku-sky-3, #1e2738)) !important;
  color: var(--aku-text, #f1f5f9) !important;
  border: 1px solid var(--aku-line, rgba(148, 163, 184, 0.32)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 4px 12px rgba(2, 6, 16, 0.32) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .aku-control:hover,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .mk-how-btn:hover,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .btn.btn-ghost:not(.aku-cta):hover {
  background: linear-gradient(135deg, #1e293b, #283548) !important;
  color: #ffffff !important;
  border-color: rgba(148, 163, 184, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .aku-control.aku-control--nav,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .mk-jump-btn {
  border-radius: 999px !important;
  background: linear-gradient(135deg, #064e3b 0%, #042f2e 100%) !important;
  color: #ecfdf5 !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .aku-cta.aku-cta--ghost {
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--aku-sky-2, #151c28), var(--aku-sky-3, #1e2738)) !important;
  color: var(--aku-text, #f1f5f9) !important;
  border: 1px solid rgba(148, 163, 184, 0.38) !important;
}


/* 5. Shared Hero Stage Layout Parity (Dark Mode D1 gets the exact same balanced 2-column Hero Stage layout as Light Mode L1!) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head {
  padding: 92px 0 12px !important;
  background: transparent !important;
  border: 0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-intro {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(96, 165, 250, 0.22) !important;
  padding: 0 0 12px !important;
  margin: 0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) header.dte-head .dte-intro-top {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 12px 20px !important;
  flex-wrap: wrap !important;
}
@media (min-width: 961px) {
  html[data-theme="dark"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid {
    display: grid !important;
    grid-template-columns: minmax(380px, 0.96fr) minmax(0, 1.24fr) !important;
    gap: 14px 16px !important;
    align-items: stretch !important;
  }
  html[data-theme="dark"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid > #gexTodayBanner {
    grid-column: 1 / 2 !important;
    display: flex !important;
    margin: 0 !important;
  }
  html[data-theme="dark"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid > #gexTodayBanner > .gx-today {
    flex: 1 1 auto !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    align-content: center !important;
  }
  html[data-theme="dark"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid > #overview.today-strip {
    grid-column: 2 / 3 !important;
    margin: 0 !important;
    align-content: stretch !important;
  }
  html[data-theme="dark"] body:not(#akx) #main:not(#aky) #sessionSummary .session-body-grid > .dte-context.dte-top-ribbon {
    grid-column: 1 / -1 !important;
    margin-top: 2px !important;
  }
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-context.dte-top-ribbon {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px 18px !important;
  padding: 12px 0 0 !important;
  margin-top: 12px !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 1px solid rgba(96, 165, 250, 0.22) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .risk-note.risk-compact {
  flex: 1 1 360px !important;
  margin: 0 !important;
  padding: 2px 0 2px 11px !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 3.5px solid #f43f5e !important;
  box-shadow: none !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .guide-cta-bar.guide-cta-compact {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile .ov-viz-svg text {
  fill: #f8fafc !important;
}

/* 6. L1 Light Mode ID-Specificity Lock on #mkSpy & #mkMacd so inner sub-boxes are Crisp Cool White (#ffffff / #f0fdf4 / #fff1f2) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkSpy.mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkMacd.mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkOdds.odds-box,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkLevels.mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkCross.mk-box.mk-open-sec,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkBreadth.mk-box.mk-open-sec {
  background: linear-gradient(135deg, #ffffff 0%, #f6faff 56%, #eefbf5 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.28) !important;
  border-top: 3.5px solid var(--mk-tone, #2563eb) !important;
  box-shadow: 0 14px 30px -18px rgba(15, 23, 42, 0.12), inset 0 1px 0 #ffffff !important;
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkSpy .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkSpy .gj-kpi-card.is-tone-green,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkSpy .gj-kpi-card.is-tone-red,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkSpy .gj-kpi-card.is-tone-amber,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkSpy .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkSpy .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #mkSpy .gj-quota-strip {
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid rgba(59, 130, 246, 0.22) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 12px -6px rgba(15, 23, 42, 0.06) !important;
}


/* 7. Override V232 B4 Ice Mist leftovers on Hero Stage, .gx-today, .ov-tile & #mkSpy .gj-kpi-strip.is-frameless-strip with L1 Crisp Cool White */
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head .dte-opening,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage {
  background:
    radial-gradient(ellipse at 88% 6%, rgba(16, 185, 129, 0.08), transparent 52%),
    linear-gradient(135deg, #e6f1fc 0%, #eff6fe 52%, #e4f7ef 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.28) !important;
  box-shadow: 0 18px 36px -22px rgba(15, 23, 42, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.92) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .gx-today,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #overview.today-strip .ov-tile,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .panel-head {
  background: linear-gradient(135deg, #ffffff 0%, #f6faff 56%, #eefbf5 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.28) !important;
  box-shadow: 0 14px 30px -18px rgba(15, 23, 42, 0.12), inset 0 1px 0 #ffffff !important;
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkStatus {
  background: linear-gradient(90deg, #effcf5 0%, #f4f9ff 100%) !important;
  border: 1px solid rgba(16, 185, 129, 0.34) !important;
  border-left: 4px solid #10b981 !important;
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  background: #ffffff !important;
  border: 1px solid rgba(59, 130, 246, 0.22) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 12px -6px rgba(15, 23, 42, 0.06) !important;
}


/* ==========================================================================
   V238 — ☀️ LIGHT MODE (L1) MEDIUM-PASTEL SEMANTIC SUB-BOXES (GREEN & RED)
   Audi 2026-10-28: "แล้วอีกข้อนึงคือในkight modeพวกสีเขียว แดง มันดูยากไปไหม
   เพิ่มความเข้ามขึ้นหน่อยไหม แต่ไม่เอาเข้มเกินไป"
   Replaces the near-white (#effcf5->#fff / #fff1f3->#fff) gradients with
   balanced Medium-Pastel Mint (#bbf7d0 ➔ #dcfce7) & Rose (#fecdd3 ➔ #ffe4e6)
   so Green vs Red vs Neutral tiles pop at a single glance without being dark!
   ========================================================================== */

/* 1. #mkBreadth (12 Mega-Cap AI Stocks) — Distinct Green, Red & Neutral Tiles in Light Mode */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up {
  background: linear-gradient(145deg, #bbf7d0 0%, #dcfce7 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.58) !important;
  border-top: 3.5px solid #059669 !important;
  box-shadow: 0 8px 18px -10px rgba(5, 150, 105, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.65) !important;
  color: #064e3b !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up .t-name,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up .t-name b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up .t-px {
  color: #052e16 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up .t-role-meta,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up .t-name span,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up .t-age {
  color: #065f46 !important;
  font-weight: 700 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-up .t-reg-note {
  background: rgba(16, 185, 129, 0.20) !important;
  border-left: 3px solid #059669 !important;
  color: #064e3b !important;
}

html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down {
  background: linear-gradient(145deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1.5px solid rgba(244, 63, 94, 0.58) !important;
  border-top: 3.5px solid #e11d48 !important;
  box-shadow: 0 8px 18px -10px rgba(225, 29, 72, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.65) !important;
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down .t-name,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down .t-name b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down .t-px {
  color: #4c0519 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down .t-role-meta,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down .t-name span,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down .t-age {
  color: #9f1239 !important;
  font-weight: 700 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile.lean-down .t-reg-note {
  background: rgba(244, 63, 94, 0.18) !important;
  border-left: 3px solid #e11d48 !important;
  color: #881337 !important;
}

/* Neutral / Flat Tiles in Light Mode: Soft Cool Slate so Green & Red pop clearly */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile:not(.lean-up):not(.lean-down) {
  background: linear-gradient(145deg, #f1f5f9 0%, #f8fafc 100%) !important;
  border: 1.5px solid rgba(100, 116, 139, 0.34) !important;
  border-top: 3.5px solid #64748b !important;
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile:not(.lean-up):not(.lean-down) .t-role-meta,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .tiles .tile:not(.lean-up):not(.lean-down) .t-age {
  color: #334155 !important;
}

/* 2. #mkCross (Force Clash Arena) — Medium-Pastel Bull & Bear Asset Chips */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull {
  background: linear-gradient(90deg, #bbf7d0 0%, #dcfce7 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.55) !important;
  border-left: 4px solid #059669 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull .swc-pts {
  background: #86efac !important;
  color: #052e16 !important;
  border-color: rgba(5, 150, 105, 0.48) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear {
  background: linear-gradient(90deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1.5px solid rgba(244, 63, 94, 0.55) !important;
  border-left: 4px solid #e11d48 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear .swc-pts {
  background: #fda4af !important;
  color: #4c0519 !important;
  border-color: rgba(225, 29, 72, 0.48) !important;
}

/* 3. #mkLevels (GEX Walls & Overlap Cards) — Medium-Pastel Semantic Fills */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(1),
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-overlap-card.is-spacious-card.is-res {
  background: linear-gradient(145deg, #bbf7d0 0%, #dcfce7 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.55) !important;
  border-top: 3.5px solid #059669 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(2),
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-overlap-card.is-spacious-card.is-sup {
  background: linear-gradient(145deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1.5px solid rgba(244, 63, 94, 0.55) !important;
  border-top: 3.5px solid #e11d48 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(3) {
  background: linear-gradient(145deg, #fde68a 0%, #fef3c7 100%) !important;
  border: 1.5px solid rgba(217, 119, 6, 0.52) !important;
  border-top: 3.5px solid #d97706 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(4) {
  background: linear-gradient(145deg, #99f6e4 0%, #ccfbf1 100%) !important;
  border: 1.5px solid rgba(13, 148, 136, 0.50) !important;
  border-top: 3.5px solid #0d9488 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(4).is-tone-red {
  background: linear-gradient(145deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1.5px solid rgba(225, 29, 72, 0.58) !important;
  border-top: 3.5px solid #e11d48 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lvl-list.is-frameless-strip .stat:nth-child(5) {
  background: linear-gradient(145deg, #bae6fd 0%, #e0f2fe 100%) !important;
  border: 1.5px solid rgba(2, 132, 199, 0.50) !important;
  border-top: 3.5px solid #0284c7 !important;
}

/* 4. #mkSpy & #mkMacd & #mkOdds — Medium-Pastel Green & Red Sub-Boxes in Light Mode */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green {
  background: linear-gradient(145deg, #bbf7d0 0%, #dcfce7 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.55) !important;
  border-left: 4px solid #059669 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green .gj-kpi-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-green .gj-gap-hist-note {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red {
  background: linear-gradient(145deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1.5px solid rgba(244, 63, 94, 0.55) !important;
  border-left: 4px solid #e11d48 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red .gj-kpi-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy .gj-kpi-strip.is-frameless-strip .gj-kpi-card.is-tone-red .gj-gap-hist-note {
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkMacd .mk-macd-decision.ls-tone-down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .macd-flow-strip .mfs-node.is-down,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-side.is-put,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict.is-bad {
  background: linear-gradient(145deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1.5px solid rgba(244, 63, 94, 0.55) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkMacd .mk-macd-decision.ls-tone-up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .macd-flow-strip .mfs-node.is-up,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-side.is-call,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict.is-good {
  background: linear-gradient(145deg, #bbf7d0 0%, #dcfce7 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.55) !important;
}


/* ==========================================================================
   V239 — #mkCross FORCE CLASH ARENA & 16-BIT ASSET CHIP OVERHAUL
   (Audi 2026-10-28: "พวกตรงนี้มันยังแสดงผลเพี้ยนอยู่เลยป่ะ แล้วเราควรทำ16bitที่สื่อถึงแต่ละสินทรัพย์ด้วยไหม")
   1. Fix .sca-w-chip justify-content: center bug -> space-between in BOTH Dark & Light Mode
   2. Add 32x32 16-bit Pixel Asset Icon (.swc-ico) + Thai Asset Name (.swc-name) + Causal Role (.swc-role)
   3. Fix .sca-f-kicker monospace Thai font bug -> var(--aku-font-head) + 16-bit bull/bear sprite
   4. Fix .sca-f-score multiline flex break ("3 / ตัว") -> single unbroken inline row
   5. Harmonize .spy-clash-arena & .sca-battle-stage with D1 Deep Obsidian Navy in Dark Mode
   ========================================================================== */

body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .sca-f-kicker {
  font-family: var(--aku-font-head) !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  line-height: 1.35 !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .sca-f-kicker.is-right {
  justify-content: flex-end !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .sca-f-line {
  display: flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .sca-f-score,
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .tug-side {
  display: inline !important;
  white-space: nowrap !important;
  font-family: var(--aku-font-body) !important;
  font-size: 0.94rem !important;
  font-weight: 700 !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .sca-f-score b {
  font-family: var(--aku-font-mono) !important;
  font-weight: 800 !important;
  margin: 0 2px !important;
}

/* Harmonize .spy-clash-arena & .sca-battle-stage in Dark Mode (D1 Deep Obsidian Navy) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena {
  background:
    radial-gradient(ellipse 48% 90% at 8% 50%, rgba(16, 185, 129, 0.14), transparent 70%),
    radial-gradient(ellipse 48% 90% at 92% 50%, rgba(244, 63, 94, 0.14), transparent 70%),
    linear-gradient(160deg, #050c18 0%, #071326 52%, #061020 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.30) !important;
  box-shadow: inset 0 1px 0 rgba(186, 230, 253, 0.08), 0 12px 28px -12px rgba(2, 6, 23, 0.72) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .sca-battle-stage {
  background:
    linear-gradient(90deg, rgba(16, 185, 129, 0.16) 0%, rgba(7, 17, 32, 0.94) 50%, rgba(244, 63, 94, 0.16) 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.26) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .sca-bull .sca-f-kicker {
  color: #6ee7b7 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .sca-bear .sca-f-kicker {
  color: #fda4af !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .spy-clash-arena .sca-vs-tag {
  color: #bae6fd !important;
  font-size: 0.82rem !important;
}

/* Fix .sca-w-chip Layout & 16-Bit Asset Icon Badge in BOTH Modes */
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-chip-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
  gap: 10px !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 10px 13px !important;
  border-radius: 12px !important;
  min-width: 0 !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-main {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-ico {
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  background: rgba(15, 23, 42, 0.55) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  box-shadow: 0 2px 6px rgba(2, 6, 23, 0.25) !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-ico svg,
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .px-asset-ico {
  width: 22px !important;
  height: 22px !important;
  image-rendering: pixelated !important;
  shape-rendering: crispEdges !important;
  display: block !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-left {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-title-row {
  display: flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  min-width: 0 !important;
  flex-wrap: nowrap !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-sym {
  font-family: var(--aku-font-mono) !important;
  font-size: 0.94rem !important;
  font-weight: 800 !important;
  flex-shrink: 0 !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-name {
  font-family: var(--aku-font-body) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-role {
  font-family: var(--aku-font-body) !important;
  font-size: 0.77rem !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-pts {
  font-family: var(--aku-font-mono) !important;
  font-size: 0.85rem !important;
  font-weight: 800 !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

/* Dark Mode (D1) Colors for .sca-w-chip */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull {
  background: linear-gradient(145deg, #083024 0%, #052018 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.50) !important;
  border-left: 4px solid #10b981 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull .swc-sym {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull .swc-name {
  color: #d1fae5 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull .swc-role {
  color: #86efac !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull .swc-pts {
  background: rgba(6, 78, 59, 0.85) !important;
  color: #6ee7b7 !important;
  border: 1px solid rgba(52, 211, 153, 0.45) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear {
  background: linear-gradient(145deg, #350e1e 0%, #200913 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.50) !important;
  border-left: 4px solid #f43f5e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear .swc-sym {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear .swc-name {
  color: #ffe4e6 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear .swc-role {
  color: #fda4af !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear .swc-pts {
  background: rgba(136, 19, 55, 0.82) !important;
  color: #fecdd3 !important;
  border: 1px solid rgba(251, 113, 133, 0.45) !important;
}

/* Light Mode (L1) Colors for .sca-w-chip */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-ico {
  background: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.22) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull .swc-sym {
  color: #052e16 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull .swc-name {
  color: #064e3b !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bull .swc-role {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear .swc-sym {
  color: #4c0519 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear .swc-name {
  color: #881337 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip.is-bear .swc-role {
  color: #9f1239 !important;
}

/* V239.1 — Zero-truncation on .sca-w-chip & pure D1 Obsidian Navy on #mkCross outer card */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkCross.mk-box.mk-open-sec {
  background:
    radial-gradient(ellipse 65% 55% at 15% 0%, rgba(16, 185, 129, 0.12), transparent 70%),
    radial-gradient(ellipse 65% 55% at 85% 0%, rgba(56, 189, 248, 0.12), transparent 70%),
    linear-gradient(145deg, #071120 0%, #09172b 54%, #081a28 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.36) !important;
  border-top: 3.5px solid #10b981 !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-name,
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-role {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.25 !important;
}

/* V239.2 — Full-width single-column .sca-chip-grid inside each Bull/Bear column + D1 outer card specificity override */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b #mkCross.mk-box.mk-open-sec,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkCross.mk-box.mk-open-sec {
  background:
    radial-gradient(ellipse 65% 55% at 15% 0%, rgba(16, 185, 129, 0.12), transparent 70%),
    radial-gradient(ellipse 65% 55% at 85% 0%, rgba(56, 189, 248, 0.12), transparent 70%),
    linear-gradient(145deg, #071120 0%, #09172b 54%, #081a28 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.36) !important;
  border-top: 3.5px solid #10b981 !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-weight-col .sca-chip-grid {
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip {
  padding: 10px 14px !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-title-row {
  gap: 8px !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-name {
  font-size: 0.86rem !important;
}
body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .sca-w-chip .swc-role {
  font-size: 0.81rem !important;
}


/* ==========================================================================
   V240 — WHOLE-PAGE 0DTE HARMONIZATION ACROSS ALL 15 TABS & MODALS
   (Audi 2026-10-28: "งั้นฉันไปพิมเปิดในsession ว่าอะไรดีจะให้ไล่แก้เว็ปอ่ะ ส่วนsessionนี้ไล่แก้0dteแทนเลยแล้วกัน")
   Applies the locked Canonical Theme Pair across every tab of 0dte-setup.html:
   - ☀️ Light Mode = L1 · Crisp Cool White & Mint-Sky (#e4f0fc➔#eef6fe➔#e2f7ef stage + #ffffff➔#f6faff➔#eefbf5 cards)
     + Medium-Pastel Green (#bbf7d0➔#dcfce7) & Red (#fecdd3➔#ffe4e6) sub-boxes (replaces V226 #f3efe4 warm cream)
   - 🌙 Dark Mode = D1 · Deep Obsidian Navy (#060d1a➔#071222➔#05131c stage + #071120➔#09172b➔#081a28 cards)
     + Deep Gem Green (#083024) & Red (#350e1e) sub-boxes + Box-Matched Secondary Text
   - Unified Buttons (.btn-primary, .btn-ghost, .btn-danger, .uj-qbtn, .desk-sub-tab) across all 15 panels
   ========================================================================== */

/* 1. ☀️ Light Mode (L1) Root Token Override (Purges V226 #f3efe4 Warm Cream Everywhere on 0DTE) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) {
  --aku-paper: #ffffff !important;
  --dc-panel: #ffffff !important;
  --dc-card: #ffffff !important;
  --dc-ink: #0f172a !important;
  --dc-muted: #1e3a8a !important;
  --dc-edge: rgba(59, 130, 246, 0.30) !important;
  --dc-blue: #e4f0fc !important;
  --dc-mint: #e2f7ef !important;
  --dc-surface: linear-gradient(135deg, #e4f0fc 0%, #eef6fe 52%, #e2f7ef 100%) !important;
  --dc-card-surface: linear-gradient(135deg, #ffffff 0%, #f6faff 56%, #eefbf5 100%) !important;
}

/* 2. Unified Outer Stage Across ALL 15 Panels in ☀️ Light Mode (L1) & 🌙 Dark Mode (D1) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) section.panel > .wrap {
  background:
    radial-gradient(ellipse at 92% 4%, rgba(52, 211, 153, 0.14), transparent 52%),
    linear-gradient(135deg, #e4f0fc 0%, #eef6fe 52%, #e2f7ef 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.28) !important;
  border-radius: 22px !important;
  padding: 24px 28px !important;
  box-shadow: 0 20px 44px -24px rgba(15, 23, 42, 0.12), inset 0 1px 0 #ffffff !important;
  color: #0f172a !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) section.panel > .wrap {
  background:
    radial-gradient(ellipse at 90% 4%, rgba(56, 189, 248, 0.12), transparent 52%),
    linear-gradient(165deg, #060d1a 0%, #071222 54%, #05131c 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.28) !important;
  border-radius: 22px !important;
  padding: 24px 28px !important;
  box-shadow: 0 22px 48px -24px rgba(0, 0, 0, 0.92), inset 0 1px 0 rgba(148, 163, 184, 0.12) !important;
  color: #f8fafc !important;
}

/* Unbox .panel-head inside all 15 panels */
body:not(#akx) #main:not(#aky) section.panel > .wrap > .panel-head {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(96, 165, 250, 0.24) !important;
  border-radius: 0 !important;
  padding: 0 0 14px !important;
  margin-bottom: 18px !important;
  box-shadow: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) section.panel > .wrap > .panel-head h2 {
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) section.panel > .wrap > .panel-head p {
  color: #1e3a8a !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) section.panel > .wrap > .panel-head h2 {
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) section.panel > .wrap > .panel-head p {
  color: #bae6fd !important;
}

/* 3. Primary Cards Across All Remaining Tabs (#panel-news, #panel-gex, #panel-chart, #panel-levels, #panel-setups, #panel-playbook, #panel-data, #panel-tools, #panel-mytrades, #panel-trades, #panel-library, #panel-lessons, #panel-guide) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) section.panel:not(#panel-market) :is(.mk-box, .card, .tool-card, .pb-group, .def-step-box, .desk-card, #mkEvents, #mkNews, #deskToday, #deskGo, #deskLadder, #deskLive, #deskTodayReview, #deskExitHelper, #deskSell, #deskReach, #deskWallStats, .guide-card, .lesson-card, .lib-playlist-card, .uj-card) {
  background: linear-gradient(135deg, #ffffff 0%, #f6faff 56%, #eefbf5 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.28) !important;
  border-top: 3.5px solid var(--mk-tone, #0284c7) !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 24px -16px rgba(15, 23, 42, 0.10), inset 0 1px 0 #ffffff !important;
  color: #0f172a !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) section.panel:not(#panel-market) :is(.mk-box, .card, .tool-card, .pb-group, .def-step-box, .desk-card, #mkEvents, #mkNews, #deskToday, #deskGo, #deskLadder, #deskLive, #deskTodayReview, #deskExitHelper, #deskSell, #deskReach, #deskWallStats, .guide-card, .lesson-card, .lib-playlist-card, .uj-card) {
  background:
    radial-gradient(ellipse 65% 50% at 88% 0%, rgba(56, 189, 248, 0.10), transparent 70%),
    linear-gradient(145deg, #071120 0%, #09172b 54%, #081a28 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.34) !important;
  border-top: 3.5px solid var(--mk-tone, #38bdf8) !important;
  border-radius: 16px !important;
  box-shadow: 0 16px 34px -18px rgba(2, 6, 18, 0.88), inset 0 1px 0 rgba(186, 230, 253, 0.10) !important;
  color: #f8fafc !important;
}

/* 4. Semantic Green & Red Sub-Boxes Across #panel-setups, #panel-news, #panel-gex, #panel-chart, #panel-levels, #panel-mytrades */
/* ☀️ Light Mode (L1 Medium-Pastel Mint & Rose — Never fading to white or cream #f3efe4) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic:not(.is-gex-neg):not(.is-conflict):not(.is-after-midnight),
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-strip.is-open,
html[data-theme="light"] body:not(#akx) #main:not(#aky) section.panel:not(#panel-market) :is(.gex-zone-card.is-call, .desk-go-box.is-go, .uj-stat.is-win) {
  background: linear-gradient(145deg, #bbf7d0 0%, #dcfce7 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.58) !important;
  border-top: 3.5px solid #059669 !important;
  color: #052e16 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-gex-neg,
html[data-theme="light"] body:not(#akx) #main:not(#aky) section.panel:not(#panel-market) :is(.gex-zone-card.is-put, .desk-go-box.is-no, .uj-stat.is-loss) {
  background: linear-gradient(145deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1.5px solid rgba(244, 63, 94, 0.58) !important;
  border-top: 3.5px solid #e11d48 !important;
  color: #4c0519 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-conflict,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-strip:not(.is-open) {
  background: linear-gradient(145deg, #fde68a 0%, #fef3c7 100%) !important;
  border: 1.5px solid rgba(217, 119, 6, 0.52) !important;
  border-top: 3.5px solid #d97706 !important;
  color: #451a03 !important;
}

/* 🌙 Dark Mode (D1 Deep Gem Emerald, Crimson & Amber) */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic:not(.is-gex-neg):not(.is-conflict):not(.is-after-midnight),
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-setups .def-now-strip.is-open,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) section.panel:not(#panel-market) :is(.gex-zone-card.is-call, .desk-go-box.is-go, .uj-stat.is-win) {
  background: linear-gradient(145deg, #083024 0%, #052018 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.52) !important;
  border-top: 3.5px solid #10b981 !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-gex-neg,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) section.panel:not(#panel-market) :is(.gex-zone-card.is-put, .desk-go-box.is-no, .uj-stat.is-loss) {
  background: linear-gradient(145deg, #350e1e 0%, #200913 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.52) !important;
  border-top: 3.5px solid #f43f5e !important;
  color: #f8fafc !important;
}

/* 5. Unified Action & Quick-Select Buttons Across All Panels (.btn-primary, .btn-danger, .uj-qbtn, .desk-sub-tab) */
body:not(#akx) #main:not(#aky) .btn.btn-primary:not(.aku-cta) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 38px !important;
  padding: 7px 16px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-head) !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
  background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(167, 243, 208, 0.55) !important;
  box-shadow: 0 6px 16px -6px rgba(16, 185, 129, 0.55) !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease !important;
}
body:not(#akx) #main:not(#aky) .btn.btn-primary:not(.aku-cta):hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 22px -6px rgba(16, 185, 129, 0.72) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) :is(.uj-qbtn, .desk-sub-tab:not(.is-active)) {
  background: linear-gradient(180deg, #ffffff 0%, #f2f8ff 100%) !important;
  color: #1e3a8a !important;
  border: 1px solid rgba(59, 130, 246, 0.32) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) :is(.uj-qbtn, .desk-sub-tab:not(.is-active)) {
  background: linear-gradient(180deg, #0d1f38 0%, #081526 100%) !important;
  color: #bae6fd !important;
  border: 1px solid rgba(56, 189, 248, 0.36) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}


/* ==========================================================================
   V240.1 — SETUPS RECOMMENDED CARD & NEWS VIX CHART BOX L1/D1 POLISH
   ========================================================================== */
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) #panel-setups .def-card.is-recommended {
  background: linear-gradient(155deg, rgba(8, 48, 36, 0.96) 0%, rgba(5, 32, 24, 0.94) 100%) !important;
  border-color: rgba(16, 185, 129, 0.56) !important;
  box-shadow: 0 12px 28px rgba(2, 8, 20, 0.45), inset 0 1px 0 rgba(110, 231, 183, 0.22) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-card.is-recommended {
  background: linear-gradient(155deg, #bbf7d0 0%, #dcfce7 100%) !important;
  border-color: rgba(16, 185, 129, 0.62) !important;
  box-shadow: 0 10px 24px rgba(16, 185, 129, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-card.is-recommended .def-title,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-card.is-recommended .def-when,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-card.is-recommended .def-list li {
  color: #064e3b !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .fg-vix-chart-box,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-news .vix-mini-chart-wrap {
  background: linear-gradient(155deg, #e0f2fe 0%, #f0f9ff 100%) !important;
  border-color: rgba(59, 130, 246, 0.38) !important;
}


/* ==========================================================================
   V241 — UNIFIED OUTER ZONE RAIL (1360px) & INNER CARD ALIGNMENT LOCK (1310px)
   Fixes width mismatch between Hero (.dte-opening), Tab Bar (#tabList),
   Live Market Stage (#dteAbLiveStage), and all 13 other Tab Panels.
   ========================================================================== */
html body:not(#akx) #main:not(#aky) header.dte-head:not(#akz) > .wrap,
html body:not(#akx) #main:not(#aky) section#panel-market:not(#akz) > .wrap {
  max-width: 1360px !important;
  width: calc(100% - 48px) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

html body:not(#akx) #main:not(#aky) header.dte-head:not(#akz) .dte-opening:not(#akw),
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#akw),
html body:not(#akx) #main:not(#aky) section.panel:not(#panel-market):not(#akz) > .wrap:not(#akw) {
  max-width: 1360px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 24px 24px !important;
  border-width: 1.5px !important;
  border-radius: 22px !important;
  box-sizing: border-box !important;
}

html body:not(#akx) #main:not(#aky) section.panel:not(#panel-market):not(#akz) > .wrap:not(#akw) {
  width: calc(100% - 48px) !important;
}
html body:not(#akx) #main:not(#aky) header.dte-head:not(#akz) .dte-intro:not(#akw) {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
@media (min-width: 1180px) {
  html body:not(#akx) #main:not(#aky) header.dte-head:not(#akz) .dte-intro-top {
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
  }
}

@media (max-width: 768px) {
  html body:not(#akx) #main:not(#aky) header.dte-head:not(#akz) > .wrap,

  html body:not(#akx) #main:not(#aky) section#panel-market:not(#akz) > .wrap,

  html body:not(#akx) #main:not(#aky) section.panel:not(#panel-market):not(#akz) > .wrap:not(#akw){
    width: calc(100% - 24px) !important;
  }
  html body:not(#akx) #main:not(#aky) header.dte-head:not(#akz) .dte-opening:not(#akw),
  html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#akw),
  html body:not(#akx) #main:not(#aky) section.panel:not(#panel-market):not(#akz) > .wrap:not(#akw) {
    padding: 16px 14px !important;
  }
}



/* ==========================================================================
   V242 — TAB-BY-TAB QUALITY SWEEP, V11 PILL DISCLOSURES, RICH S/R ELEVATOR
   CARDS, REALTIME-GAMMA GAP FIX & S&P 500 SECTOR MONEY-FLOW HEATMAP (2026-10-28)
   Audi 2026-10-28:
   1. "ตอนนี้ที่เห้น พวก ℹ️ สถิติระยะวิ่ง 63 วันทำการย้อนหลัง ยังดูเป็นกล่องสี่เหลี่ยมอยู่เลย ในlight mode"
   2. "แล้ว 👑 แนวต้าน · Gap ค้าง 22 Oct ... และ 🛡️ แนวรับ · สูงสุดเมื่อวาน ... มันสีจืดชืดไปไหม"
   3. "แล้ว 🟢 อัปเดต Realtime กับ ค่า Gamma (M) มันติดกันเกินไปไหม"
   4. "แล้วที่ตลาด เพิ่มheatmap มาด้วยหน่อย แล้วขึ้นโชว์ด้วยว่า เงินไหลเข้าออกกลุ่มไหนบ้าง"
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. UNIVERSAL V11 PILL DISCLOSURE DRAWERS Across ALL 14 Tabs
   Replaces sharp rectangular (border-radius: 0px) <details>/<summary> boxes
   (.mk-disclosure, .guide-toggle, .hoc-why, .hcd-more-fold, .log-more-fold,
    .odds-more, .explain.mk-fold, .gx-wall2-toggle, .gx-card-guide, etc.)
   -------------------------------------------------------------------------- */
html body:not(#akx) #main:not(#aky) details:not(.dte-session) {
  border-radius: 14px !important;
  overflow: hidden !important;
  margin-top: 12px !important;
  transition: box-shadow 0.18s ease, border-color 0.18s ease !important;
}
html body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary {
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 10px 16px !important;
  border-radius: 13px !important;
  font-family: var(--aku-font-head) !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  cursor: pointer !important;
  user-select: none !important;
  transition: background 0.16s ease, transform 0.14s ease, box-shadow 0.16s ease !important;
}
html body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary::-webkit-details-marker,
html body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary::marker {
  display: none !important;
  content: "" !important;
}
html body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary::after {
  content: "กดดู ▾" !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-body) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  margin-left: auto !important;
}
html body:not(#akx) #main:not(#aky) details[open]:not(.dte-session) > summary {
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
html body:not(#akx) #main:not(#aky) details[open]:not(.dte-session) > summary::after {
  content: "ซ่อน ▴" !important;
}

/* ☀️ Light Mode (L1) Pill Disclosure Drawers */
html[data-theme="light"] body:not(#akx) #main:not(#aky) details:not(.dte-session) {
  background: linear-gradient(135deg, #f4f9ff 0%, #ffffff 55%, #eefbf5 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.34) !important;
  box-shadow: 0 4px 12px -6px rgba(15, 23, 42, 0.08) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary {
  background: linear-gradient(135deg, #dbeafe 0%, #eff6ff 54%, #d1fae5 100%) !important;
  color: #1e3a8a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary:hover {
  background: linear-gradient(135deg, #bfdbfe 0%, #e0f2fe 54%, #a7f3d0 100%) !important;
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary::after {
  background: #ffffff !important;
  color: #1d4ed8 !important;
  border: 1px solid rgba(37, 99, 235, 0.35) !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) details:not(.dte-session) > .mk-evidence-body,
html[data-theme="light"] body:not(#akx) #main:not(#aky) details[open]:not(.dte-session) > *:not(summary) {
  padding: 14px 16px !important;
  color: #0f172a !important;
}

/* 🌙 Dark Mode (D1) Pill Disclosure Drawers */
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) details:not(.dte-session) {
  background: linear-gradient(145deg, #071120 0%, #09172b 58%, #071923 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.34) !important;
  box-shadow: 0 8px 20px -10px rgba(2, 6, 18, 0.72) !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary {
  background: linear-gradient(135deg, #0c213d 0%, #09182e 54%, #072622 100%) !important;
  color: #bae6fd !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary:hover {
  background: linear-gradient(135deg, #122d52 0%, #0d2240 54%, #0a3630 100%) !important;
  color: #ffffff !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) details:not(.dte-session) > summary::after {
  background: rgba(15, 23, 42, 0.78) !important;
  color: #7dd3fc !important;
  border: 1px solid rgba(56, 189, 248, 0.42) !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) details:not(.dte-session) > .mk-evidence-body {
  padding: 14px 16px !important;
}

/* --------------------------------------------------------------------------
   2. RICH S/R PRICE ELEVATOR CARDS (.elv-floor.is-ceiling & .elv-floor.is-ground)
      + #mkSpy Gap Target Cards (.gj-ug-hero & .gj-ug-far-col)
      + #panel-gex 5-Column Strip (.gx-summary.is-frameless-strip .gx-stat)
      Fixes washed-out 12% opacity green/red fills in BOTH #panel-market & #panel-levels
   -------------------------------------------------------------------------- */
/* ☀️ Light Mode (L1 Medium-Pastel Emerald & Rose) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hcd-price-tower.dte-elev {
  background: linear-gradient(180deg, #e0f2fe 0%, #f8fbff 50%, #eefbf5 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.36) !important;
  border-radius: 18px !important;
  padding: 16px !important;
  box-shadow: 0 12px 26px -16px rgba(15, 23, 42, 0.12), inset 0 1px 0 #ffffff !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling {
  background: linear-gradient(135deg, #a7f3d0 0%, #d1fae5 100%) !important;
  border: 1.5px solid rgba(5, 150, 105, 0.62) !important;
  border-left: 5px solid #059669 !important;
  border-radius: 14px !important;
  padding: 12px 16px !important;
  box-shadow: 0 8px 18px -10px rgba(5, 150, 105, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.75) !important;
  color: #052e16 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling .elv-floor-name,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling strong {
  color: #052e16 !important;
  font-weight: 800 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling .elv-floor-px {
  color: #047857 !important;
  font-weight: 900 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling .elv-floor-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling .elv-conf-line,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling small {
  color: #065f46 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ground {
  background: linear-gradient(135deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1.5px solid rgba(225, 29, 72, 0.62) !important;
  border-left: 5px solid #e11d48 !important;
  border-radius: 14px !important;
  padding: 12px 16px !important;
  box-shadow: 0 8px 18px -10px rgba(225, 29, 72, 0.20), inset 0 1px 0 rgba(255, 255, 255, 0.75) !important;
  color: #4c0519 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ground .elv-floor-name,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ground b,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ground strong {
  color: #4c0519 !important;
  font-weight: 800 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ground .elv-floor-px {
  color: #be123c !important;
  font-weight: 900 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ground .elv-floor-sub,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ground .elv-conf-line,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .elv-floor.is-ground small {
  color: #9f1239 !important;
  font-weight: 700 !important;
}

/* 🌙 Dark Mode (D1 Deep Gem Emerald & Crimson for .elv-floor) */
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hcd-price-tower.dte-elev {
  background: linear-gradient(180deg, #071326 0%, #06101e 50%, #071923 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.34) !important;
  border-radius: 18px !important;
  padding: 16px !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling {
  background: linear-gradient(135deg, #083326 0%, #052219 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.58) !important;
  border-left: 5px solid #10b981 !important;
  border-radius: 14px !important;
  padding: 12px 16px !important;
  color: #f8fafc !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling .elv-floor-sub,
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling .elv-conf-line,
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .elv-floor.is-ceiling small {
  color: #86efac !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .elv-floor.is-ground {
  background: linear-gradient(135deg, #380e1f 0%, #220914 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.58) !important;
  border-left: 5px solid #f43f5e !important;
  border-radius: 14px !important;
  padding: 12px 16px !important;
  color: #f8fafc !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .elv-floor.is-ground .elv-floor-sub,
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .elv-floor.is-ground .elv-conf-line,
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .elv-floor.is-ground small {
  color: #fda4af !important;
}

/* Also enrich #mkSpy .gj-ug-hero & .gj-ug-far-col + #panel-gex .gx-summary in Light Mode */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .gj-ug-hero,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-levels:not(#akz) .gj-ug-hero {
  background: linear-gradient(135deg, #bbf7d0 0%, #dcfce7 58%, #e0f2fe 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.55) !important;
  border-left: 4px solid #059669 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .gj-ug-far-col,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-levels:not(#akz) .gj-ug-far-col {
  background: linear-gradient(135deg, #dbeafe 0%, #f0f9ff 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-summary.is-frameless-strip {
  background: linear-gradient(135deg, #ffffff 0%, #f4f9ff 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.34) !important;
  box-shadow: 0 12px 28px -16px rgba(15, 23, 42, 0.12) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-summary.is-frameless-strip .gx-stat.dk-put {
  background: linear-gradient(180deg, #fecdd3 0%, #fff1f2 100%) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-summary.is-frameless-strip .gx-stat.dk-call {
  background: linear-gradient(180deg, #bbf7d0 0%, #ecfdf5 100%) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-summary.is-frameless-strip .gx-stat.dk-zero {
  background: linear-gradient(180deg, #bae6fd 0%, #f0f9ff 100%) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-gex .gx-summary.is-frameless-strip .gx-stat.dk-range {
  background: linear-gradient(180deg, #fde68a 0%, #fffbeb 100%) !important;
}

/* --------------------------------------------------------------------------
   3. ZERO-COLLISION BADGE & SIBLING SPACING
      Fixes "🟢 อัปเดต Realtime" touching "ค่า Gamma (M)" (0px gap -> 14px gap)
      plus .nd-rest in #panel-data, .fg-hist-grid in #panel-news, .gx-seg in #panel-lessons
   -------------------------------------------------------------------------- */
html body:not(#akx) #main:not(#aky) .gex-realtime-explainer {
  padding: 10px 14px !important;
  border-radius: 14px !important;
  margin: 10px 0 14px !important;
}
html body:not(#akx) #main:not(#aky) .gex-realtime-explainer .gre-item {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 10px 14px !important;
  padding: 6px 12px !important;
  border-radius: 10px !important;
}
html body:not(#akx) #main:not(#aky) .gex-realtime-explainer .gre-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 12px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-head) !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  margin-right: 2px !important;
  flex-shrink: 0 !important;
}
html body:not(#akx) #main:not(#aky) #panel-data .nd-rest {
  gap: 12px !important;
}
html body:not(#akx) #main:not(#aky) #panel-news .fg-hist-grid.is-frameless-grid {
  gap: 12px !important;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .gx-seg {
  display: inline-flex !important;
  gap: 8px !important;
}

/* --------------------------------------------------------------------------
   4. S&P 500 SECTOR MONEY-FLOW & PROPORTIONAL HEATMAP (.sp500-heatmap-deck)
      in #mkBreadth (Both ☀️ Light L1 & 🌙 Dark D1)
   -------------------------------------------------------------------------- */
html body:not(#akx) #main:not(#aky) .sp500-heatmap-deck {
  margin: 14px 0 22px !important;
  padding: 18px 20px !important;
  border-radius: 18px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sp500-heatmap-deck {
  background: linear-gradient(135deg, #e8f3fe 0%, #f4f9ff 52%, #e6faf1 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.34) !important;
  box-shadow: inset 0 1px 0 #ffffff, 0 10px 24px -16px rgba(15, 23, 42, 0.10) !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .sp500-heatmap-deck {
  background: linear-gradient(155deg, #06101f 0%, #08162a 54%, #061822 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.32) !important;
  box-shadow: inset 0 1px 0 rgba(186, 230, 253, 0.08), 0 14px 30px -18px rgba(2, 6, 18, 0.85) !important;
}

html body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 12px 16px !important;
}
html body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--aku-font-head) !important;
  font-size: 1.02rem !important;
  font-weight: 800 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-kicker {
  color: #0f172a !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-kicker {
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-sub {
  margin: 4px 0 0 !important;
  font-size: 0.84rem !important;
  font-weight: 600 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-sub {
  color: #1e3a8a !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-sub {
  color: #93c5fd !important;
}

html body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-verdict {
  padding: 7px 14px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-head) !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-verdict.is-bull {
  background: linear-gradient(135deg, #bbf7d0 0%, #dcfce7 100%) !important;
  color: #064e3b !important;
  border: 1.5px solid rgba(5, 150, 105, 0.55) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-verdict.is-bear {
  background: linear-gradient(135deg, #fecdd3 0%, #ffe4e6 100%) !important;
  color: #881337 !important;
  border: 1.5px solid rgba(225, 29, 72, 0.55) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-verdict.is-warn,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-verdict.is-neutral {
  background: linear-gradient(135deg, #fde68a 0%, #fef3c7 100%) !important;
  color: #78350f !important;
  border: 1.5px solid rgba(217, 119, 6, 0.52) !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-verdict.is-bull {
  background: linear-gradient(135deg, #083326 0%, #052219 100%) !important;
  color: #6ee7b7 !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-verdict.is-bear {
  background: linear-gradient(135deg, #380e1f 0%, #220914 100%) !important;
  color: #fda4af !important;
  border: 1px solid rgba(251, 113, 133, 0.55) !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-verdict.is-warn,
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .sp500-heatmap-deck .shd-verdict.is-neutral {
  background: linear-gradient(135deg, #2c1e08 0%, #1c1305 100%) !important;
  color: #fde68a !important;
  border: 1px solid rgba(251, 191, 36, 0.50) !important;
}

/* Money Flow Summary Bar */
html body:not(#akx) #main:not(#aky) .smf-summary-bar {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
html body:not(#akx) #main:not(#aky) .smf-sum-labels {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-sum-labels .is-in { color: #047857 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-sum-labels .is-out { color: #be123c !important; }
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-sum-labels .is-in { color: #6ee7b7 !important; }
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-sum-labels .is-out { color: #fda4af !important; }

/* 12-Column Proportional S&P 500 Heatmap Grid */
html body:not(#akx) #main:not(#aky) .sp500-heatmap-grid {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
html body:not(#akx) #main:not(#aky) .hm-cell {
  border-radius: 14px !important;
  padding: 12px 14px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 6px !important;
  min-width: 0 !important;
  transition: transform 0.16s ease, box-shadow 0.16s ease !important;
}
html body:not(#akx) #main:not(#aky) .hm-cell:hover {
  transform: translateY(-2px) !important;
}
html body:not(#akx) #main:not(#aky) .hm-cell.hm-span-6 { grid-column: span 6 !important; }
html body:not(#akx) #main:not(#aky) .hm-cell.hm-span-3 { grid-column: span 3 !important; }
html body:not(#akx) #main:not(#aky) .hm-cell.hm-span-2 { grid-column: span 3 !important; }
@media (max-width: 1024px) {
  html body:not(#akx) #main:not(#aky) .hm-cell.hm-span-6 { grid-column: span 12 !important; }
  html body:not(#akx) #main:not(#aky) .hm-cell.hm-span-3,
  html body:not(#akx) #main:not(#aky) .hm-cell.hm-span-2 { grid-column: span 6 !important; }
}
@media (max-width: 640px) {
  html body:not(#akx) #main:not(#aky) .hm-cell.hm-span-6,
  html body:not(#akx) #main:not(#aky) .hm-cell.hm-span-3,
  html body:not(#akx) #main:not(#aky) .hm-cell.hm-span-2 { grid-column: span 12 !important; }
}

/* Heatmap Cell Colors — ☀️ Light Mode (L1 Medium-Pastel) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hm-cell.is-up-strong {
  background: linear-gradient(145deg, #86efac 0%, #bbf7d0 100%) !important;
  border: 1.5px solid #059669 !important;
  color: #052e16 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hm-cell.is-up-mild {
  background: linear-gradient(145deg, #bbf7d0 0%, #dcfce7 100%) !important;
  border: 1.5px solid rgba(5, 150, 105, 0.55) !important;
  color: #052e16 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hm-cell.is-dn-strong {
  background: linear-gradient(145deg, #fda4af 0%, #fecdd3 100%) !important;
  border: 1.5px solid #e11d48 !important;
  color: #4c0519 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hm-cell.is-dn-mild {
  background: linear-gradient(145deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1.5px solid rgba(225, 29, 72, 0.55) !important;
  color: #4c0519 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hm-cell.is-flat {
  background: linear-gradient(145deg, #dbeafe 0%, #eff6ff 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.45) !important;
  color: #0f172a !important;
}

/* Heatmap Cell Colors — 🌙 Dark Mode (D1 Deep Gem Emerald & Crimson) */
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hm-cell.is-up-strong {
  background: linear-gradient(145deg, #064e3b 0%, #063729 100%) !important;
  border: 1.5px solid #10b981 !important;
  color: #f8fafc !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hm-cell.is-up-mild {
  background: linear-gradient(145deg, #083024 0%, #052018 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
  color: #f8fafc !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hm-cell.is-dn-strong {
  background: linear-gradient(145deg, #4c0519 0%, #350e1e 100%) !important;
  border: 1.5px solid #f43f5e !important;
  color: #f8fafc !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hm-cell.is-dn-mild {
  background: linear-gradient(145deg, #350e1e 0%, #200913 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.55) !important;
  color: #f8fafc !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hm-cell.is-flat {
  background: linear-gradient(145deg, #0c223d 0%, #08172b 100%) !important;
  border: 1px solid rgba(96, 165, 250, 0.42) !important;
  color: #f8fafc !important;
}

/* Heatmap Cell Inner Typography & Sub-Stock Pills */
html body:not(#akx) #main:not(#aky) .hm-cell-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}
html body:not(#akx) #main:not(#aky) .hm-sec-id {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
}
html body:not(#akx) #main:not(#aky) .hm-ico {
  width: 24px !important;
  height: 24px !important;
  border-radius: 6px !important;
  background: #0f172a !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
html body:not(#akx) #main:not(#aky) .hm-sec-id b {
  font-family: var(--aku-font-head) !important;
  font-size: 0.92rem !important;
  font-weight: 800 !important;
}
html body:not(#akx) #main:not(#aky) .hm-sec-id small {
  font-family: var(--aku-font-mono) !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
  opacity: 0.85 !important;
}
html body:not(#akx) #main:not(#aky) .hm-weight-pill {
  font-family: var(--aku-font-mono) !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.12) !important;
  white-space: nowrap !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hm-weight-pill {
  background: rgba(255, 255, 255, 0.12) !important;
}
html body:not(#akx) #main:not(#aky) .hm-cell-main {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
html body:not(#akx) #main:not(#aky) .hm-pct {
  font-family: var(--aku-font-mono) !important;
  font-size: 1.24rem !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em !important;
}
html body:not(#akx) #main:not(#aky) .hm-flow-tag {
  font-size: 0.76rem !important;
  font-weight: 800 !important;
}
html body:not(#akx) #main:not(#aky) .hm-role-line {
  font-size: 0.78rem !important;
  font-weight: 700 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hm-cell:is(.is-up-strong, .is-up-mild) .hm-role-line { color: #065f46 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hm-cell:is(.is-dn-strong, .is-dn-mild) .hm-role-line { color: #9f1239 !important; }
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hm-cell:is(.is-up-strong, .is-up-mild) .hm-role-line { color: #86efac !important; }
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hm-cell:is(.is-dn-strong, .is-dn-mild) .hm-role-line { color: #fda4af !important; }

html body:not(#akx) #main:not(#aky) .hm-sub-stocks {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-top: 4px !important;
}
html body:not(#akx) #main:not(#aky) .hm-stock-pill {
  font-family: var(--aku-font-mono) !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hm-stock-pill {
  background: rgba(255, 255, 255, 0.78) !important;
  color: #0f172a !important;
  border: 1px solid rgba(15, 23, 42, 0.14) !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .hm-stock-pill {
  background: rgba(7, 17, 32, 0.72) !important;
  color: #f8fafc !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
}

/* 2-Column Sector Money-Flow Ranking (.smf-flow-grid) */
html body:not(#akx) #main:not(#aky) .smf-flow-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
@media (max-width: 860px) {
  html body:not(#akx) #main:not(#aky) .smf-flow-grid {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akx) #main:not(#aky) .smf-col {
  border-radius: 14px !important;
  padding: 12px 14px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-col.is-in {
  background: rgba(255, 255, 255, 0.82) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.42) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-col.is-out {
  background: rgba(255, 255, 255, 0.82) !important;
  border: 1.5px solid rgba(244, 63, 94, 0.42) !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-col.is-in {
  background: rgba(7, 19, 34, 0.82) !important;
  border: 1px solid rgba(52, 211, 153, 0.36) !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-col.is-out {
  background: rgba(7, 19, 34, 0.82) !important;
  border: 1px solid rgba(251, 113, 133, 0.36) !important;
}
html body:not(#akx) #main:not(#aky) .smf-col-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  font-size: 0.84rem !important;
  font-weight: 800 !important;
  padding-bottom: 6px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22) !important;
}
html body:not(#akx) #main:not(#aky) .smf-col-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
html body:not(#akx) #main:not(#aky) .smf-chip {
  border-radius: 12px !important;
  padding: 9px 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-chip.is-inflow {
  background: linear-gradient(90deg, #bbf7d0 0%, #dcfce7 100%) !important;
  border: 1px solid rgba(5, 150, 105, 0.52) !important;
  border-left: 4px solid #059669 !important;
  color: #052e16 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-chip.is-outflow {
  background: linear-gradient(90deg, #fecdd3 0%, #ffe4e6 100%) !important;
  border: 1px solid rgba(225, 29, 72, 0.52) !important;
  border-left: 4px solid #e11d48 !important;
  color: #4c0519 !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-chip.is-inflow {
  background: linear-gradient(90deg, #083024 0%, #052018 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.48) !important;
  border-left: 4px solid #10b981 !important;
  color: #f8fafc !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-chip.is-outflow {
  background: linear-gradient(90deg, #350e1e 0%, #200913 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.48) !important;
  border-left: 4px solid #f43f5e !important;
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) .smf-chip-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
}
html body:not(#akx) #main:not(#aky) .smf-chip-id {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
}
html body:not(#akx) #main:not(#aky) .smf-ico {
  width: 28px !important;
  height: 28px !important;
  border-radius: 7px !important;
  background: #0f172a !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
html body:not(#akx) #main:not(#aky) .smf-name-line {
  display: flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}
html body:not(#akx) #main:not(#aky) .smf-th {
  font-family: var(--aku-font-head) !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
}
html body:not(#akx) #main:not(#aky) .smf-sym {
  font-family: var(--aku-font-mono) !important;
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  opacity: 0.85 !important;
}
html body:not(#akx) #main:not(#aky) .smf-w {
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  opacity: 0.85 !important;
}
html body:not(#akx) #main:not(#aky) .smf-role {
  display: block !important;
  font-size: 0.77rem !important;
  font-weight: 600 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-chip.is-inflow .smf-role { color: #065f46 !important; }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-chip.is-outflow .smf-role { color: #9f1239 !important; }
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-chip.is-inflow .smf-role { color: #86efac !important; }
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-chip.is-outflow .smf-role { color: #fda4af !important; }

html body:not(#akx) #main:not(#aky) .smf-pct {
  font-family: var(--aku-font-mono) !important;
  font-size: 0.86rem !important;
  font-weight: 900 !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-chip.is-inflow .smf-pct {
  background: #86efac !important;
  color: #052e16 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .smf-chip.is-outflow .smf-pct {
  background: #fda4af !important;
  color: #4c0519 !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-chip.is-inflow .smf-pct {
  background: rgba(6, 78, 59, 0.9) !important;
  color: #6ee7b7 !important;
}
html:not([data-theme="light"]) body:not(#akx) #main:not(#aky) .smf-chip.is-outflow .smf-pct {
  background: rgba(136, 19, 55, 0.9) !important;
  color: #fecdd3 !important;
}
html body:not(#akx) #main:not(#aky) .smf-bar-track {
  height: 5px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.24) !important;
  overflow: hidden !important;
}
html body:not(#akx) #main:not(#aky) .smf-chip.is-inflow .smf-bar-track > i {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #10b981, #059669) !important;
  border-radius: 999px !important;
}
html body:not(#akx) #main:not(#aky) .smf-chip.is-outflow .smf-bar-track > i {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #f43f5e, #e11d48) !important;
  border-radius: 999px !important;
}

/* ============================================================================
   V243 — Audi 2026-10-28 Round 2 Polish:
   1. #mkSectorHeatmapDeck Dual SPY Basket Weight + Price-Weighted Index Impact
   2. #mkSpy .gj-kpi-strip.is-v243-tele (3 Visual Telemetry Cards + Dual Swing Pills + Animated Excursion Bar)
   3. #mkMacd .mts-right-stack.is-aligned-3col (Strict 3-Column Tabular Rail for VWAP / EMA200 / OR30m)
   4. #mkLevels .elv-shaft.is-two-lane (Zero-Collision 2-Lane Elevator + 5-Tick Spaced Ruler + Sticky Battle Hysteresis)
   5. #mkLevels .hoc-pillars-grid (4-Pillar Intrinsic Level Strength Meter + Role Reversal Banner)
   ============================================================================ */

/* --- 1. Sector Money-Flow Dual Badges (.smf-badges-col / .smf-impact-tag) --- */
html body:not(#akx) #main:not(#aky) .smf-badges-col {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
}
html body:not(#akx) #main:not(#aky) .smf-impact-tag {
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
html body:not(#akx) #main:not(#aky) .smf-impact-tag.is-in {
  background: #059669 !important;
  color: #ffffff !important;
  border: 1px solid #047857 !important;
  box-shadow: 0 2px 6px rgba(5, 150, 105, 0.22) !important;
}
html body:not(#akx) #main:not(#aky) .smf-impact-tag.is-out {
  background: #e11d48 !important;
  color: #ffffff !important;
  border: 1px solid #be123c !important;
  box-shadow: 0 2px 6px rgba(225, 29, 72, 0.22) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .smf-impact-tag.is-in {
  background: rgba(16, 185, 129, 0.24) !important;
  color: #6ee7b7 !important;
  border-color: rgba(52, 211, 153, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .smf-impact-tag.is-out {
  background: rgba(244, 63, 94, 0.24) !important;
  color: #fda4af !important;
  border-color: rgba(251, 113, 133, 0.55) !important;
}

/* --- 2. #mkSpy Visual Telemetry Cards (.gj-kpi-strip.is-v243-tele) --- */
@keyframes gjVecShimmer {
  0% { filter: brightness(1); }
  50% { filter: brightness(1.18); }
  100% { filter: brightness(1); }
}
html body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  align-items: stretch !important;
  margin-top: 10px !important;
}
@media (max-width: 860px) {
  html body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele > .gj-kpi-card {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 7px !important;
  padding: 12px 13px !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.04) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele > .gj-kpi-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08) !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele > .gj-kpi-card.is-tone-green {
  background: linear-gradient(180deg, #ecfdf5 0%, #ffffff 52%) !important;
  border-color: #6ee7b7 !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele > .gj-kpi-card.is-tone-red {
  background: linear-gradient(180deg, #fff1f2 0%, #ffffff 52%) !important;
  border-color: #fda4af !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele > .gj-kpi-card.is-tone-amber {
  background: linear-gradient(180deg, #fffbeb 0%, #ffffff 52%) !important;
  border-color: #fcd34d !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele > .gj-kpi-card {
  background: rgba(15, 23, 42, 0.88) !important;
  border-color: rgba(100, 116, 139, 0.45) !important;
  box-shadow: 0 4px 14px rgba(2, 6, 23, 0.35) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele > .gj-kpi-card.is-tone-green {
  background: linear-gradient(180deg, rgba(6, 78, 59, 0.42) 0%, rgba(15, 23, 42, 0.92) 55%) !important;
  border-color: rgba(52, 211, 153, 0.52) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele > .gj-kpi-card.is-tone-red {
  background: linear-gradient(180deg, rgba(136, 19, 55, 0.42) 0%, rgba(15, 23, 42, 0.92) 55%) !important;
  border-color: rgba(251, 113, 133, 0.52) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-strip.is-v243-tele > .gj-kpi-card.is-tone-amber {
  background: linear-gradient(180deg, rgba(120, 53, 15, 0.38) 0%, rgba(15, 23, 42, 0.92) 55%) !important;
  border-color: rgba(251, 191, 36, 0.52) !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-top-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-lbl {
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  color: #334155 !important;
  margin: 0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-lbl {
  color: #cbd5e1 !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-pill {
  font-size: 0.66rem !important;
  font-weight: 800 !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-up {
  background: #dcfce7 !important;
  color: #065f46 !important;
  border: 1px solid #6ee7b7 !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-dn {
  background: #ffe4e6 !important;
  color: #9f1239 !important;
  border: 1px solid #fda4af !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-warn {
  background: #fef3c7 !important;
  color: #92400e !important;
  border: 1px solid #fcd34d !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-sky,
html body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-flat {
  background: #e0f2fe !important;
  color: #075985 !important;
  border: 1px solid #7dd3fc !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-up {
  background: rgba(6, 95, 70, 0.72) !important;
  color: #a7f3d0 !important;
  border-color: rgba(52, 211, 153, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-dn {
  background: rgba(136, 19, 55, 0.72) !important;
  color: #fecdd3 !important;
  border-color: rgba(251, 113, 133, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-warn {
  background: rgba(120, 53, 15, 0.72) !important;
  color: #fde68a !important;
  border-color: rgba(251, 191, 36, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-sky,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-pill.is-flat {
  background: rgba(12, 74, 110, 0.72) !important;
  color: #bae6fd !important;
  border-color: rgba(56, 189, 248, 0.55) !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-val {
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  color: #0f172a !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-val {
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-val.up {
  color: #047857 !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-val.down,
html body:not(#akx) #main:not(#aky) .gj-kpi-val.dn {
  color: #be123c !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-val.up {
  color: #34d399 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-val.down,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-val.dn {
  color: #fb7185 !important;
}
html body:not(#akx) #main:not(#aky) .gj-vis-box {
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 9px !important;
  padding: 7px 9px !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-vis-box {
  background: rgba(2, 6, 23, 0.58) !important;
  border-color: rgba(71, 85, 105, 0.52) !important;
}
html body:not(#akx) #main:not(#aky) .gj-bridge-nodes {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  color: #334155 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-bridge-nodes {
  color: #cbd5e1 !important;
}
html body:not(#akx) #main:not(#aky) .gbn-node {
  display: inline-flex !important;
  flex-direction: column !important;
  line-height: 1.15 !important;
}
html body:not(#akx) #main:not(#aky) .gbn-node.is-right {
  text-align: right !important;
  align-items: flex-end !important;
}
html body:not(#akx) #main:not(#aky) .gbn-node > em {
  font-style: normal !important;
  font-size: 0.62rem !important;
  color: #64748b !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gbn-node > em {
  color: #94a3b8 !important;
}
html body:not(#akx) #main:not(#aky) .gbn-node > b {
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  color: #0f172a !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gbn-node > b {
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) .gbn-arrow {
  font-size: 0.64rem !important;
  font-weight: 800 !important;
  padding: 2px 6px !important;
  border-radius: 999px !important;
  background: #fef3c7 !important;
  color: #92400e !important;
  border: 1px solid #fcd34d !important;
  white-space: nowrap !important;
}
html body:not(#akx) #main:not(#aky) .gbn-arrow.is-cleared {
  background: #d1fae5 !important;
  color: #065f46 !important;
  border-color: #6ee7b7 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gbn-arrow {
  background: rgba(120, 53, 15, 0.75) !important;
  color: #fde68a !important;
  border-color: rgba(251, 191, 36, 0.5) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gbn-arrow.is-cleared {
  background: rgba(6, 95, 70, 0.75) !important;
  color: #a7f3d0 !important;
  border-color: rgba(52, 211, 153, 0.5) !important;
}
html body:not(#akx) #main:not(#aky) .gj-prob-bar {
  display: flex !important;
  height: 6px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.25) !important;
  overflow: hidden !important;
  margin-top: 6px !important;
}
html body:not(#akx) #main:not(#aky) .gj-prob-bar > i.is-clear {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #10b981, #059669) !important;
}
html body:not(#akx) #main:not(#aky) .gj-prob-bar > i.is-hold {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #f59e0b, #d97706) !important;
}
html body:not(#akx) #main:not(#aky) .gj-vec-endpoints {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px !important;
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  color: #334155 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-vec-endpoints {
  color: #cbd5e1 !important;
}
html body:not(#akx) #main:not(#aky) .gj-vec-flow {
  font-family: var(--aku-font-body), sans-serif !important;
  font-size: 0.64rem !important;
  font-weight: 800 !important;
}
html body:not(#akx) #main:not(#aky) .gj-vec-flow.is-up {
  color: #047857 !important;
}
html body:not(#akx) #main:not(#aky) .gj-vec-flow.is-dn {
  color: #be123c !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-vec-flow.is-up {
  color: #34d399 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-vec-flow.is-dn {
  color: #fb7185 !important;
}
html body:not(#akx) #main:not(#aky) .gj-vec-track {
  height: 7px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.25) !important;
  overflow: hidden !important;
  margin-top: 6px !important;
}
html body:not(#akx) #main:not(#aky) .gj-vec-track > i.gj-vec-bar {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #10b981, #059669) !important;
  transition: width 0.55s cubic-bezier(0.22, 1, 0.36, 1) !important;
  animation: gjVecShimmer 2.6s ease-in-out infinite !important;
}
html body:not(#akx) #main:not(#aky) .gj-vec-track.is-dn > i.gj-vec-bar {
  background: linear-gradient(90deg, #f43f5e, #e11d48) !important;
}
/* Dual Swing Pills on Card 3 (.gj-swing-dual) */
html body:not(#akx) #main:not(#aky) .gj-swing-dual {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 6px !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-chip {
  display: flex !important;
  flex-direction: column !important;
  gap: 1px !important;
  padding: 5px 8px !important;
  border-radius: 8px !important;
  border: 1px solid transparent !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-chip.is-up,
html body:not(#akx) #main:not(#aky) .gj-swing-chip.is-hi {
  background: #ecfdf5 !important;
  border-color: #6ee7b7 !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-chip.is-dn,
html body:not(#akx) #main:not(#aky) .gj-swing-chip.is-lo {
  background: #fff1f2 !important;
  border-color: #fda4af !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-swing-chip.is-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-swing-chip.is-hi {
  background: rgba(6, 78, 59, 0.45) !important;
  border-color: rgba(52, 211, 153, 0.48) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-swing-chip.is-dn,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-swing-chip.is-lo {
  background: rgba(136, 19, 55, 0.45) !important;
  border-color: rgba(251, 113, 133, 0.48) !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-chip > small {
  font-size: 0.65rem !important;
  font-weight: 800 !important;
  color: #475569 !important;
  margin: 0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-swing-chip > small {
  color: #cbd5e1 !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-chip.is-up > b,
html body:not(#akx) #main:not(#aky) .gj-swing-chip.is-hi > b {
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  color: #047857 !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-chip.is-dn > b,
html body:not(#akx) #main:not(#aky) .gj-swing-chip.is-lo > b {
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
  color: #be123c !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-swing-chip.is-up > b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-swing-chip.is-hi > b {
  color: #34d399 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-swing-chip.is-dn > b,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-swing-chip.is-lo > b {
  color: #fb7185 !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-labels {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 4px !important;
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.66rem !important;
  font-weight: 700 !important;
  margin-bottom: 4px !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-tug-track {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  height: 8px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.22) !important;
  margin: 4px 0 2px !important;
  overflow: visible !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-tug-track > i.is-dn-swing {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #fb7185, #e11d48) !important;
  border-radius: 999px 0 0 999px !important;
  transition: width 0.55s cubic-bezier(0.22, 1, 0.36, 1) !important;
}
html body:not(#akx) #main:not(#aky) .gj-swing-tug-track > i.is-up-swing {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, #10b981, #059669) !important;
  border-radius: 0 999px 999px 0 !important;
  transition: width 0.55s cubic-bezier(0.22, 1, 0.36, 1) !important;
}
html body:not(#akx) #main:not(#aky) .gj-open-tick {
  position: absolute !important;
  top: -2px !important;
  bottom: -2px !important;
  width: 2px !important;
  background: #0f172a !important;
  transform: translateX(-50%) !important;
  z-index: 2 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-open-tick {
  background: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) .gj-spot-pin {
  position: absolute !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  font-size: 0.72rem !important;
  line-height: 1 !important;
  color: #1d4ed8 !important;
  text-shadow: 0 0 4px #ffffff, 0 0 6px #ffffff !important;
  z-index: 3 !important;
  pointer-events: none !important;
  transition: left 0.55s cubic-bezier(0.22, 1, 0.36, 1) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-spot-pin {
  color: #fde047 !important;
  text-shadow: 0 0 6px rgba(2, 6, 23, 0.95) !important;
}
html body:not(#akx) #main:not(#aky) .gj-kpi-foot-note,
html body:not(#akx) #main:not(#aky) .gj-kpi-sub,
html body:not(#akx) #main:not(#aky) .gj-kpi-stat {
  font-size: 0.71rem !important;
  font-weight: 700 !important;
  color: #475569 !important;
  line-height: 1.35 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-foot-note,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-sub,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gj-kpi-stat {
  color: #94a3b8 !important;
}

/* --- 3. #mkMacd Strict 3-Column Timing Stack (.mts-right-stack.is-aligned-3col) --- */
html body:not(#akx) #main:not(#aky) .mts-right-stack.is-aligned-3col {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  justify-content: space-between !important;
}
html body:not(#akx) #main:not(#aky) .mts-right-stack.is-aligned-3col > .mts-item {
  display: grid !important;
  grid-template-columns: 144px auto minmax(0, 1fr) !important;
  align-items: center !important;
  column-gap: 10px !important;
  row-gap: 4px !important;
  padding: 9px 12px !important;
  border-radius: 10px !important;
  text-align: left !important;
}
@media (max-width: 640px) {
  html body:not(#akx) #main:not(#aky) .mts-right-stack.is-aligned-3col > .mts-item {
    grid-template-columns: 1fr auto !important;
  }
  html body:not(#akx) #main:not(#aky) .mts-right-stack.is-aligned-3col > .mts-item > .mts-sub-val {
    grid-column: 1 / -1 !important;
    justify-self: start !important;
    text-align: left !important;
  }
}
html body:not(#akx) #main:not(#aky) .mts-right-stack.is-aligned-3col .mts-col-lbl {
  margin: 0 !important;
  font-size: 0.77rem !important;
  font-weight: 800 !important;
  color: #1e293b !important;
  white-space: nowrap !important;
  text-align: left !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .mts-right-stack.is-aligned-3col .mts-col-lbl {
  color: #e2e8f0 !important;
}
html body:not(#akx) #main:not(#aky) .mts-right-stack.is-aligned-3col .mts-verdict {
  justify-self: start !important;
  white-space: nowrap !important;
  margin: 0 !important;
}
html body:not(#akx) #main:not(#aky) .mts-right-stack.is-aligned-3col .mts-sub-val {
  justify-self: end !important;
  text-align: right !important;
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.74rem !important;
  font-weight: 700 !important;
  color: #334155 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 100% !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .mts-right-stack.is-aligned-3col .mts-sub-val {
  color: #cbd5e1 !important;
}

/* --- 4. #mkLevels Two-Lane Non-Overlapping Price Elevator (.elv-shaft.is-two-lane) --- */
@keyframes elvBattlePulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.35); }
  50% { box-shadow: 0 0 0 5px rgba(245, 158, 11, 0.14); }
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane {
  position: relative !important;
  height: 256px !important;
  margin: 8px 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(180deg, #fff1f2 0%, #f8fafc 50%, #ecfdf5 100%) !important;
  border: 1.5px solid #cbd5e1 !important;
  overflow: hidden !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane {
  background: linear-gradient(180deg, rgba(136, 19, 55, 0.26) 0%, rgba(15, 23, 42, 0.92) 50%, rgba(6, 78, 59, 0.26) 100%) !important;
  border-color: rgba(100, 116, 139, 0.45) !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-rail {
  position: absolute !important;
  top: 10px !important;
  bottom: 10px !important;
  left: 62px !important;
  width: 3px !important;
  background: repeating-linear-gradient(180deg, #94a3b8 0 6px, transparent 6px 11px) !important;
  z-index: 2 !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-car.is-cabin,
html:not([data-theme="dark"]) body:not(#akx) #main:not(#aky) .dte-elev .elv-shaft.is-two-lane .elv-car.is-cabin,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-shaft.is-two-lane .elv-car.is-cabin {
  position: absolute !important;
  left: 8px !important;
  right: auto !important;
  width: 112px !important;
  max-width: 112px !important;
  transform: translateY(50%) !important;
  padding: 6px 8px !important;
  border-radius: 10px !important;
  background: #0f172a !important;
  color: #ffffff !important;
  border: 2px solid #38bdf8 !important;
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.24) !important;
  z-index: 6 !important;
  transition: bottom 0.55s cubic-bezier(0.22, 1, 0.36, 1), top 0.55s cubic-bezier(0.22, 1, 0.36, 1) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-car.is-cabin {
  background: #020617 !important;
  border-color: #38bdf8 !important;
  box-shadow: 0 6px 18px rgba(56, 189, 248, 0.28) !important;
}
/* Right Callout Lane (strictly separated at left: 136px, zero horizontal overlap with 112px cabin) */
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-callout-lane,
html:not([data-theme="dark"]) body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-callout-lane {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 136px !important;
  right: 44px !important;
  z-index: 5 !important;
  pointer-events: none !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-callout-lane .elv-mark,
html:not([data-theme="dark"]) body:not(#akx) #main:not(#aky) .dte-elev .elv-shaft.is-two-lane .elv-callout-lane .elv-mark,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-shaft.is-two-lane .elv-callout-lane .elv-mark {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  width: auto !important;
  max-width: none !important;
  transform: translateY(50%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  transition: bottom 0.45s cubic-bezier(0.22, 1, 0.36, 1) !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-callout-lane .elv-mark::before,
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-callout-lane .elv-mark::after,
html:not([data-theme="dark"]) body:not(#akx) #main:not(#aky) .dte-elev .elv-shaft.is-two-lane .elv-callout-lane .elv-mark::before,
html:not([data-theme="dark"]) body:not(#akx) #main:not(#aky) .dte-elev .elv-shaft.is-two-lane .elv-callout-lane .elv-mark::after {
  display: none !important;
  content: none !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark-line {
  flex: 0 0 12px !important;
  height: 0 !important;
  border-top: 1.5px dashed #64748b !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  padding: 3px 9px !important;
  border-radius: 8px !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  max-width: calc(100% - 16px) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1.5px solid #cbd5e1 !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark-pill > b {
  font-family: var(--aku-font-mono), monospace !important;
  font-weight: 800 !important;
  flex-shrink: 0 !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark.is-call .elv-mark-pill,
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark.is-res .elv-mark-pill {
  background: #ecfdf5 !important;
  color: #065f46 !important;
  border-color: #6ee7b7 !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark.is-put .elv-mark-pill,
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark.is-sup .elv-mark-pill {
  background: #fff1f2 !important;
  color: #9f1239 !important;
  border-color: #fda4af !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark-pill {
  background: rgba(15, 23, 42, 0.94) !important;
  color: #f1f5f9 !important;
  border-color: rgba(100, 116, 139, 0.55) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark.is-call .elv-mark-pill,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark.is-res .elv-mark-pill {
  background: rgba(6, 78, 59, 0.85) !important;
  color: #a7f3d0 !important;
  border-color: rgba(52, 211, 153, 0.58) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark.is-put .elv-mark-pill,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-mark.is-sup .elv-mark-pill {
  background: rgba(136, 19, 55, 0.85) !important;
  color: #fecdd3 !important;
  border-color: rgba(251, 113, 133, 0.58) !important;
}
/* Far-Right 5-Tick Spaced Ruler (.elv-ruler-lane) */
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-ruler-lane {
  position: absolute !important;
  top: 12px !important;
  bottom: 12px !important;
  right: 4px !important;
  width: 38px !important;
  border-left: 1px dashed rgba(148, 163, 184, 0.45) !important;
  z-index: 3 !important;
  pointer-events: none !important;
}
html body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-ruler-lane .elv-tick {
  position: absolute !important;
  right: 3px !important;
  left: auto !important;
  transform: translateY(50%) !important;
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.66rem !important;
  font-weight: 800 !important;
  color: #475569 !important;
  background: rgba(255, 255, 255, 0.85) !important;
  padding: 1px 3px !important;
  border-radius: 4px !important;
  line-height: 1 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-shaft.is-two-lane .elv-ruler-lane .elv-tick {
  color: #94a3b8 !important;
  background: rgba(15, 23, 42, 0.85) !important;
}

/* Elevator Top/Bottom Floor Headers (.elv-floor-top, .elv-floor-meta, .elv-role-state) */
html body:not(#akx) #main:not(#aky) .elv-floor.is-testing-floor {
  animation: elvBattlePulse 2.2s ease-in-out infinite !important;
}
html body:not(#akx) #main:not(#aky) .elv-floor-top,
html body:not(#akx) #main:not(#aky) .elv-floor-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  width: 100% !important;
}
html body:not(#akx) #main:not(#aky) .elv-role-state {
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
html body:not(#akx) #main:not(#aky) .elv-role-state.is-testing {
  background: #fef3c7 !important;
  color: #92400e !important;
  border: 1px solid #f59e0b !important;
}
html body:not(#akx) #main:not(#aky) .elv-role-state.is-flipped {
  background: #e0e7ff !important;
  color: #3730a3 !important;
  border: 1px solid #818cf8 !important;
}
html body:not(#akx) #main:not(#aky) .elv-role-state.is-fort {
  background: rgba(255, 255, 255, 0.82) !important;
  color: #0f172a !important;
  border: 1px solid rgba(100, 116, 139, 0.38) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-role-state.is-testing {
  background: rgba(120, 53, 15, 0.82) !important;
  color: #fde68a !important;
  border-color: rgba(245, 158, 11, 0.6) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-role-state.is-flipped {
  background: rgba(49, 46, 129, 0.82) !important;
  color: #c7d2fe !important;
  border-color: rgba(129, 140, 248, 0.6) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .elv-role-state.is-fort {
  background: rgba(15, 23, 42, 0.82) !important;
  color: #f1f5f9 !important;
  border-color: rgba(148, 163, 184, 0.42) !important;
}

/* --- 5. 4-Pillar Intrinsic Level Strength Meter (.hoc-pillars-grid & .hoc-flip-banner) --- */
html body:not(#akx) #main:not(#aky) .hoc-flip-banner {
  padding: 5px 10px !important;
  border-radius: 8px !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  background: #eef2ff !important;
  color: #3730a3 !important;
  border: 1px solid #818cf8 !important;
  margin-bottom: 4px !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .hoc-flip-banner {
  background: rgba(49, 46, 129, 0.55) !important;
  color: #c7d2fe !important;
  border-color: rgba(129, 140, 248, 0.55) !important;
}
html body:not(#akx) #main:not(#aky) .hoc-pillars-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 8px 12px !important;
  padding: 9px 11px !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.78) !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  margin-top: 4px !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .hoc-pillars-grid {
  background: rgba(2, 6, 23, 0.56) !important;
  border-color: rgba(71, 85, 105, 0.48) !important;
}
html body:not(#akx) #main:not(#aky) .hoc-pil-item {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
}
html body:not(#akx) #main:not(#aky) .hpi-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  font-size: 0.7rem !important;
  font-weight: 800 !important;
  color: #1e293b !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .hpi-top {
  color: #e2e8f0 !important;
}
html body:not(#akx) #main:not(#aky) .hpi-top > b {
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  background: rgba(148, 163, 184, 0.18) !important;
  padding: 1px 6px !important;
  border-radius: 999px !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .hpi-top > b {
  color: #f8fafc !important;
  background: rgba(148, 163, 184, 0.22) !important;
}
html body:not(#akx) #main:not(#aky) .hpi-bar {
  height: 5px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.25) !important;
  overflow: hidden !important;
}
html body:not(#akx) #main:not(#aky) .hpi-bar > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #10b981, #059669) !important;
  transition: width 0.5s ease !important;
}
html body:not(#akx) #main:not(#aky) .hoc-pil-item:nth-child(1) .hpi-bar > i {
  background: linear-gradient(90deg, #6366f1, #4f46e5) !important;
}
html body:not(#akx) #main:not(#aky) .hoc-pil-item:nth-child(2) .hpi-bar > i {
  background: linear-gradient(90deg, #0ea5e9, #0284c7) !important;
}
html body:not(#akx) #main:not(#aky) .hoc-pil-item:nth-child(3) .hpi-bar > i {
  background: linear-gradient(90deg, #f59e0b, #d97706) !important;
}
html body:not(#akx) #main:not(#aky) .hoc-pil-item:nth-child(4) .hpi-bar > i {
  background: linear-gradient(90deg, #10b981, #059669) !important;
}
html body:not(#akx) #main:not(#aky) .hoc-pil-item > small {
  font-size: 0.66rem !important;
  font-weight: 700 !important;
  color: #475569 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .hoc-pil-item > small {
  color: #94a3b8 !important;
}
/* ==========================================================================
   V244 — SINGLE-ROW SUB-NAVIGATOR (#tabList), ANIMATED RSI OVERBOUGHT/OVERSOLD
   BACKGROUND AURA & CHIBI GOJO VS SUKUNA KAMEHAMEHA SECTOR CLASH (2026-10-28)
   Audi 2026-10-28:
   1. "Guide 📊 ตลาด & กราฟ ... 🎓 คอร์ส & ความรู้ คอร์ส & คลิป บทเรียน อันนี้เรียงตัวกันแปลกๆป่ะ"
   2. "⚡ มาตรวัดความร้อน RSI 5m ... มันมีanimation backgroundพื้นหลังด้วยป่าวตอนมันoverอ่ะ"
   3. "💸 แรงเงินไหลเข้า 78% ... ทำanimation ของตัวเองเหมือน 🟢 ดันขึ้น · เอื้อ Call ... เอาเป็นสามารถทำ chibi gojo vs sukuna ปล่อยพลังสู้กันไหม ทำเป็นพลังคลื่นเต่า ก็ได้ ... ทำของตัวเองดีกว่า"
   ========================================================================== */

/* 1. Single-Row Balanced Sub-Navigator Bar (nav.tabs #tabList) — Zero Shrink & Owner 6-Pod Safe (V245) */


/* 2. Animated RSI 5m Overbought (🔥 >=70) & Oversold (⚡ <=30) Card Background Aura & Particles */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item.is-rsi-dial-card {
  position: relative !important;
  overflow: hidden !important;
  z-index: 1 !important;
  transition: background 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card > .mts-rsi-row,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card > .rsi-extreme-banner {
  position: relative !important;
  z-index: 2 !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-card-bg-fx {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  overflow: hidden !important;
  border-radius: inherit !important;
  opacity: 0;
  transition: opacity 0.35s ease !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card.is-rsi-overbought .rsi-card-bg-fx,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card.is-rsi-oversold .rsi-card-bg-fx,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="overbought"]:hover) .rsi-card-bg-fx,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="oversold"]:hover) .rsi-card-bg-fx {
  opacity: 1 !important;
}

@keyframes rsiCardBgSweep {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes rsiCardAuraPulse {
  0%, 100% { transform: scale(0.92); opacity: 0.45; }
  50% { transform: scale(1.18); opacity: 0.88; }
}
@keyframes rsiCardWaveRipple {
  0% { transform: translate(-50%, -50%) scale(0.45); opacity: 0.78; }
  100% { transform: translate(-50%, -50%) scale(2.15); opacity: 0; }
}
@keyframes rsiSparkFloatUp {
  0% { transform: translateY(18px) scale(0.7); opacity: 0; }
  30% { opacity: 0.92; }
  100% { transform: translateY(-48px) scale(1.25); opacity: 0; }
}
@keyframes rsiOverBorderPulse {
  0%, 100% { box-shadow: 0 0 0 1px rgba(249, 115, 22, 0.38), 0 10px 26px -10px rgba(249, 115, 22, 0.35); }
  50% { box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.78), 0 14px 32px -8px rgba(239, 68, 68, 0.52); }
}
@keyframes rsiUnderBorderPulse {
  0%, 100% { box-shadow: 0 0 0 1px rgba(16, 185, 129, 0.38), 0 10px 26px -10px rgba(16, 185, 129, 0.35); }
  50% { box-shadow: 0 0 0 2px rgba(52, 211, 153, 0.82), 0 14px 32px -8px rgba(6, 182, 212, 0.52); }
}

/* Overbought (>=70) Animated Background — Light & Dark */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .mk-timing-strip .mts-item.is-rsi-dial-card.is-rsi-overbought,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item.is-rsi-dial-card.is-rsi-overbought,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="overbought"]:hover) {
  background: linear-gradient(125deg, #fff7ed 0%, #ffedd5 32%, #ffe4e6 68%, #fef3c7 100%) !important;
  background-size: 220% 220% !important;
  animation: rsiCardBgSweep 3.2s ease-in-out infinite, rsiOverBorderPulse 1.8s ease-in-out infinite !important;
  border: 1.5px solid #f97316 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item.is-rsi-dial-card.is-rsi-overbought,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="overbought"]:hover) {
  background: linear-gradient(125deg, rgba(67, 20, 7, 0.92) 0%, rgba(124, 45, 18, 0.68) 38%, rgba(136, 19, 55, 0.65) 72%, rgba(15, 23, 42, 0.95) 100%) !important;
  background-size: 220% 220% !important;
  animation: rsiCardBgSweep 3.2s ease-in-out infinite, rsiOverBorderPulse 1.8s ease-in-out infinite !important;
  border: 1.5px solid #fb923c !important;
}

/* Oversold (<=30) Animated Background — Light & Dark */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-l1 #dteAbLiveStage .mk-timing-strip .mts-item.is-rsi-dial-card.is-rsi-oversold,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item.is-rsi-dial-card.is-rsi-oversold,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="oversold"]:hover) {
  background: linear-gradient(125deg, #ecfdf5 0%, #d1fae5 34%, #cffafe 68%, #e0f2fe 100%) !important;
  background-size: 220% 220% !important;
  animation: rsiCardBgSweep 3.2s ease-in-out infinite, rsiUnderBorderPulse 1.8s ease-in-out infinite !important;
  border: 1.5px solid #10b981 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item.is-rsi-dial-card.is-rsi-oversold,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-timing-strip .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="oversold"]:hover) {
  background: linear-gradient(125deg, rgba(6, 78, 59, 0.88) 0%, rgba(13, 148, 136, 0.56) 38%, rgba(8, 145, 178, 0.54) 72%, rgba(15, 23, 42, 0.95) 100%) !important;
  background-size: 220% 220% !important;
  animation: rsiCardBgSweep 3.2s ease-in-out infinite, rsiUnderBorderPulse 1.8s ease-in-out infinite !important;
  border: 1.5px solid #34d399 !important;
}

/* Inner Aura, Shockwave Rings & Floating Embers/Sparks inside .rsi-card-bg-fx */
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-card-bg-fx .rbf-aura {
  position: absolute !important;
  right: 12px !important;
  top: -18px !important;
  width: 190px !important;
  height: 150px !important;
  border-radius: 50% !important;
  filter: blur(14px) !important;
  animation: rsiCardAuraPulse 1.6s ease-in-out infinite !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card.is-rsi-overbought .rbf-aura,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="overbought"]:hover) .rbf-aura {
  background: radial-gradient(circle, rgba(249, 115, 22, 0.44) 0%, rgba(239, 68, 68, 0.22) 55%, transparent 75%) !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card.is-rsi-oversold .rbf-aura,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="oversold"]:hover) .rbf-aura {
  background: radial-gradient(circle, rgba(16, 185, 129, 0.44) 0%, rgba(6, 182, 212, 0.24) 55%, transparent 75%) !important;
}

html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-card-bg-fx .rbf-wave {
  position: absolute !important;
  right: 96px !important;
  top: 56% !important;
  width: 84px !important;
  height: 84px !important;
  border-radius: 50% !important;
  border: 2px solid transparent !important;
  animation: rsiCardWaveRipple 2.1s ease-out infinite !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-card-bg-fx .rbf-wave.w2 {
  animation-delay: 1.05s !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card.is-rsi-overbought .rbf-wave,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="overbought"]:hover) .rbf-wave {
  border-color: rgba(249, 115, 22, 0.46) !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card.is-rsi-oversold .rbf-wave,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="oversold"]:hover) .rbf-wave {
  border-color: rgba(16, 185, 129, 0.48) !important;
}

html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-card-bg-fx .rbf-sparks > i {
  position: absolute !important;
  bottom: 8px !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  animation: rsiSparkFloatUp 1.8s ease-out infinite !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rbf-sparks > i.s1 { left: 16%; animation-delay: 0s !important; }
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rbf-sparks > i.s2 { left: 38%; animation-delay: 0.35s !important; width: 6px !important; height: 6px !important; }
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rbf-sparks > i.s3 { left: 62%; animation-delay: 0.7s !important; width: 8px !important; height: 8px !important; }
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rbf-sparks > i.s4 { left: 78%; animation-delay: 1.05s !important; }
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rbf-sparks > i.s5 { left: 90%; animation-delay: 1.4s !important; width: 6px !important; height: 6px !important; }

html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card.is-rsi-overbought .rbf-sparks > i,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="overbought"]:hover) .rbf-sparks > i {
  background: radial-gradient(circle, #fef08a 0%, #f97316 70%, #ef4444 100%) !important;
  box-shadow: 0 0 8px rgba(249, 115, 22, 0.85) !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card.is-rsi-oversold .rbf-sparks > i,
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card:has(.rsi-sim-btn[data-rsi-sim="oversold"]:hover) .rbf-sparks > i {
  background: radial-gradient(circle, #ecfeff 0%, #34d399 70%, #06b6d4 100%) !important;
  box-shadow: 0 0 8px rgba(16, 185, 129, 0.85) !important;
}

html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-extreme-banner {
  margin-top: 8px !important;
  padding: 5px 10px !important;
  border-radius: 8px !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-extreme-banner.is-ob {
  background: rgba(249, 115, 22, 0.18) !important;
  border: 1px solid rgba(249, 115, 22, 0.48) !important;
  color: #9a3412 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-extreme-banner.is-ob {
  background: rgba(249, 115, 22, 0.24) !important;
  color: #fed7aa !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-extreme-banner.is-os {
  background: rgba(16, 185, 129, 0.18) !important;
  border: 1px solid rgba(16, 185, 129, 0.48) !important;
  color: #065f46 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-extreme-banner.is-os {
  background: rgba(16, 185, 129, 0.24) !important;
  color: #a7f3d0 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-sim-tag {
  background: #fef3c7 !important;
  color: #78350f !important;
  border: 1px solid #f59e0b !important;
  font-weight: 800 !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-sim-btn.is-active.is-ob {
  background: linear-gradient(135deg, #ea580c, #e11d48) !important;
  border-color: #fb923c !important;
  color: #ffffff !important;
  box-shadow: 0 0 12px rgba(249, 115, 22, 0.45) !important;
}
html body:not(#akx) #main:not(#aky) .mts-item.is-rsi-dial-card .rsi-sim-btn.is-active.is-os {
  background: linear-gradient(135deg, #059669, #0891b2) !important;
  border-color: #34d399 !important;
  color: #ffffff !important;
  box-shadow: 0 0 12px rgba(16, 185, 129, 0.45) !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .spy-clash-arena.is-sector-kame-clash .sca-f-kicker {
  white-space: nowrap !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}


/* 3. Chibi Gojo vs Chibi Sukuna Kamehameha Energy Clash Stage in #mkSectorHeatmapDeck */
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .spy-clash-arena.is-sector-kame-clash {
  margin: 4px 0 14px !important;
  padding: 14px 16px !important;
  border-radius: 16px !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .spy-clash-arena.is-sector-kame-clash {
  background: linear-gradient(135deg, #f0f9ff 0%, #ffffff 50%, #fff1f2 100%) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.28) !important;
  box-shadow: 0 10px 24px -14px rgba(15, 23, 42, 0.10) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .spy-clash-arena.is-sector-kame-clash {
  background: linear-gradient(135deg, rgba(8, 25, 48, 0.92) 0%, rgba(6, 15, 30, 0.96) 50%, rgba(38, 10, 24, 0.90) 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.28) !important;
}

/* Smooth High-Res Vector/Chibi Avatar Rendering (Not Pixelated like 16-bit sprites) */
html body:not(#akx) #main:not(#aky) .sca-battle-stage.is-jujutsu-kame-stage .sca-sprite-stack.is-chibi-stack {
  width: 66px !important;
  height: 66px !important;
}
html body:not(#akx) #main:not(#aky) .sca-battle-stage.is-jujutsu-kame-stage .sca-char-sprite.is-chibi-avatar {
  width: 66px !important;
  height: 66px !important;
  image-rendering: auto !important;
  object-fit: contain !important;
  filter: drop-shadow(0 4px 10px rgba(15, 23, 42, 0.28)) !important;
}
html body:not(#akx) #main:not(#aky) .sca-battle-stage.is-jujutsu-kame-stage .sca-duelist.is-bull .is-chibi-avatar {
  filter: drop-shadow(0 0 10px rgba(56, 189, 248, 0.55)) !important;
}
html body:not(#akx) #main:not(#aky) .sca-battle-stage.is-jujutsu-kame-stage .sca-duelist.is-bear .is-chibi-avatar {
  filter: drop-shadow(0 0 10px rgba(244, 63, 94, 0.55)) !important;
}

/* Kamehameha Palm Core & Wave Pulse */
@keyframes kamePalmSpinPulse {
  0%, 100% { transform: scale(0.88); opacity: 0.85; }
  50% { transform: scale(1.24); opacity: 1; }
}
@keyframes kameBeamStreamSlide {
  0% { background-position: 0 0; }
  100% { background-position: 56px 0; }
}
@keyframes kameBeamStreamSlideRev {
  0% { background-position: 0 0; }
  100% { background-position: -56px 0; }
}
html body:not(#akx) #main:not(#aky) .sca-push-rig .kame-palm-orb,
html body:not(#akx) #main:not(#aky) .sca-push-rig .kame-palm-core {
  transform-box: fill-box !important;
  transform-origin: center !important;
  animation: kamePalmSpinPulse 0.95s ease-in-out infinite !important;
}

/* Enhanced Kamehameha Blue-Emerald vs Sukuna Crimson Beam Track */
html body:not(#akx) #main:not(#aky) .sca-energy-bar.is-kamehameha-bar .sca-beam.is-bull.is-kame-blue {
  background: linear-gradient(90deg, #0284c7 0%, #0ea5e9 38%, #10b981 78%, #6ee7b7 100%) !important;
  box-shadow: 0 0 18px rgba(14, 165, 233, 0.55), inset 0 2px 5px rgba(255, 255, 255, 0.65) !important;
}
html body:not(#akx) #main:not(#aky) .sca-energy-bar.is-kamehameha-bar .sca-beam.is-bear.is-kame-crimson {
  background: linear-gradient(270deg, #881337 0%, #e11d48 42%, #f43f5e 80%, #fda4af 100%) !important;
  box-shadow: 0 0 18px rgba(244, 63, 94, 0.55), inset 0 2px 5px rgba(255, 255, 255, 0.55) !important;
}
html body:not(#akx) #main:not(#aky) .sca-energy-bar.is-kamehameha-bar .kame-core-stream {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: 50% !important;
  height: 7px !important;
  transform: translateY(-50%) !important;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.92) 0 14px, rgba(186, 230, 253, 0.35) 14px 28px) !important;
  background-size: 56px 100% !important;
  border-radius: 999px !important;
  filter: blur(0.4px) !important;
  animation: kameBeamStreamSlide 0.65s linear infinite !important;
  pointer-events: none !important;
}
html body:not(#akx) #main:not(#aky) .sca-energy-bar.is-kamehameha-bar .kame-core-stream.is-crimson {
  background: repeating-linear-gradient(90deg, rgba(254, 240, 138, 0.9) 0 14px, rgba(254, 205, 211, 0.35) 14px 28px) !important;
  background-size: 56px 100% !important;
  animation: kameBeamStreamSlideRev 0.65s linear infinite !important;
}


/* ==========================================================================
   V245 — 6-FACTOR DIRECTIONAL GRAVITY DECK, FAVORED TARGET ELEVATION,
   COMPLETE 12-SOURCE STRIKE DENSITY SKYLINE, MARKET SESSION BADGES &
   24-COLUMN PROPORTIONAL TREEMAP HEATMAP (2026-10-28)
   Audi 2026-10-28:
   1. "ไอลูกเล่นแบบoversold overboughtนี่จำเข้าคลังการทำเว็ปเราด้วยนะ อยากให้มันมีพวกลูกเล่นพื้นหลังเปลี่ยนด้วย"
   2. "แล้วส่วน Guide · ตลาดสด ... Review ยังแสดงผลเพี้ยนอยู่เลยนะ"
   3. "แล้วตรงโครงสร้าง GEX & แนวรับ–แนวต้าน โมเดลเราสามารถเอาข้อมูลอื่นๆมาประกอบได้ไหมว่า ทรงมันจะไปทางแนวต้านหรือแนวรับมากกว่า แล้วทำให้ทางนั้นดูเด่นกว่าอะไรงี้"
   4. "แล้วตรงนี้ 🔴 Put Wall ... ไอกล่องด้านล่างคือเอาข้อมูลสำคัญมาใส่ครบแล้วใช่ไหม เพื่อให้ดูรู้ว่าโซนราคานั้นหนาแน่น"
   5. "แล้วเรื่องข้อมูลต้องมีเขียนด้วยไหมว่าตลาดปิดอยู่"
   6. "แล้วตรง 12 หุ้นใหญ่ & S&P 500 Heatmap (กระแสเงินไหลเข้า–ออกรายกลุ่ม) มันเป็นสี่เหลี่ยมป่ะ"
   ========================================================================== */

/* 1. 6-Factor Directional Gravity Deck (.lvl-gravity-deck) */
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck {
  position: relative !important;
  overflow: hidden !important;
  margin: 0 0 14px !important;
  padding: 14px 16px !important;
  border-radius: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  z-index: 1 !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck > *:not(.lgd-ambient-fx) {
  position: relative !important;
  z-index: 2 !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-ambient-fx {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  opacity: 0.72 !important;
  background-size: 200% 200% !important;
  animation: rsiCardBgSweep 4.5s ease-in-out infinite !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck.is-bull-gravity {
  background: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 45%, #ffffff 100%) !important;
  border: 1.5px solid #10b981 !important;
  box-shadow: 0 10px 24px -14px rgba(16, 185, 129, 0.25) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck.is-bear-gravity {
  background: linear-gradient(135deg, #fff1f2 0%, #fef2f2 45%, #ffffff 100%) !important;
  border: 1.5px solid #f43f5e !important;
  box-shadow: 0 10px 24px -14px rgba(244, 63, 94, 0.25) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck.is-even-gravity {
  background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%) !important;
  border: 1.5px solid #cbd5e1 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck.is-bull-gravity {
  background: linear-gradient(135deg, rgba(6, 78, 59, 0.52) 0%, rgba(15, 23, 42, 0.94) 55%, rgba(6, 95, 70, 0.35) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.55) !important;
  box-shadow: 0 12px 28px -14px rgba(16, 185, 129, 0.35) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck.is-bear-gravity {
  background: linear-gradient(135deg, rgba(136, 19, 55, 0.52) 0%, rgba(15, 23, 42, 0.94) 55%, rgba(159, 18, 57, 0.35) 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.55) !important;
  box-shadow: 0 12px 28px -14px rgba(244, 63, 94, 0.35) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck.is-even-gravity {
  background: rgba(15, 23, 42, 0.88) !important;
  border: 1.5px solid rgba(148, 163, 184, 0.32) !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-title-col {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  flex: 1 1 520px !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-kicker {
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
  color: #0f766e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-kicker {
  color: #5eead4 !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-verdict {
  font-size: 0.88rem !important;
  line-height: 1.45 !important;
  color: #0f172a !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-verdict {
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-score-badges {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-side-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 6px 11px !important;
  border-radius: 999px !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  background: rgba(255, 255, 255, 0.7) !important;
  color: #475569 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-side-badge {
  background: rgba(15, 23, 42, 0.65) !important;
  color: #94a3b8 !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-side-badge.is-up.is-winner {
  background: linear-gradient(135deg, #059669, #10b981) !important;
  color: #ffffff !important;
  border-color: #34d399 !important;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.38) !important;
  transform: scale(1.03) !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-side-badge.is-dn.is-winner {
  background: linear-gradient(135deg, #e11d48, #f43f5e) !important;
  color: #ffffff !important;
  border-color: #fb7185 !important;
  box-shadow: 0 4px 12px rgba(244, 63, 94, 0.38) !important;
  transform: scale(1.03) !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-bar {
  position: relative !important;
  height: 24px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  display: flex !important;
  background: rgba(15, 23, 42, 0.12) !important;
  border: 1px solid rgba(148, 163, 184, 0.32) !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-fill {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 12px !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-fill.is-up {
  background: linear-gradient(90deg, #047857, #10b981, #34d399) !important;
  justify-content: flex-start !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35) !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-fill.is-dn {
  background: linear-gradient(90deg, #fb7185, #f43f5e, #be123c) !important;
  justify-content: flex-end !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35) !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-midline {
  position: absolute !important;
  left: 50% !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 2px !important;
  background: rgba(255, 255, 255, 0.85) !important;
  z-index: 3 !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pointer {
  position: absolute !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  background: #fef08a !important;
  border: 2px solid #f59e0b !important;
  color: #78350f !important;
  font-size: 0.75rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 0 12px rgba(245, 158, 11, 0.85) !important;
  z-index: 4 !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pills-grid {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 8px !important;
}
@media (max-width: 1180px) {
  html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pills-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 680px) {
  html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pills-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pill {
  padding: 7px 9px !important;
  border-radius: 10px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  background: rgba(255, 255, 255, 0.82) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pill {
  background: rgba(15, 23, 42, 0.72) !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pill.is-up {
  border-left: 3px solid #10b981 !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pill.is-dn {
  border-left: 3px solid #f43f5e !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-p-top {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 0.7rem !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-p-top b {
  color: #0f172a !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-p-top b {
  color: #f1f5f9 !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-p-top em {
  margin-left: auto !important;
  font-style: normal !important;
  font-weight: 800 !important;
  font-size: 0.66rem !important;
  white-space: nowrap !important;
}
html body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pill small {
  font-size: 0.66rem !important;
  color: #475569 !important;
  line-height: 1.25 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .lvl-gravity-deck .lgd-pill small {
  color: #94a3b8 !important;
}

/* 2. Favored Target Visual Elevation on Overlap Cards & Price Elevator */
html body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-spacious-card {
  position: relative !important;
  overflow: hidden !important;
  z-index: 1 !important;
}
html body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-spacious-card > *:not(.hoc-card-bg-fx) {
  position: relative !important;
  z-index: 2 !important;
}
html body:not(#akx) #main:not(#aky) .hcd-overlap-card .hoc-card-bg-fx {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  opacity: 0 !important;
}
html body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-favored-target .hoc-card-bg-fx {
  opacity: 1 !important;
  background-size: 220% 220% !important;
  animation: rsiCardBgSweep 3.8s ease-in-out infinite !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-res.is-favored-target .hoc-card-bg-fx {
  background: linear-gradient(125deg, rgba(209, 250, 229, 0.55) 0%, rgba(236, 253, 245, 0.85) 50%, rgba(207, 250, 254, 0.45) 100%) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-sup.is-favored-target .hoc-card-bg-fx {
  background: linear-gradient(125deg, rgba(255, 228, 230, 0.55) 0%, rgba(255, 241, 242, 0.85) 50%, rgba(254, 243, 199, 0.45) 100%) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-res.is-favored-target .hoc-card-bg-fx {
  background: linear-gradient(125deg, rgba(6, 78, 59, 0.42) 0%, rgba(15, 23, 42, 0.85) 55%, rgba(8, 145, 178, 0.28) 100%) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-sup.is-favored-target .hoc-card-bg-fx {
  background: linear-gradient(125deg, rgba(136, 19, 55, 0.42) 0%, rgba(15, 23, 42, 0.85) 55%, rgba(154, 52, 18, 0.28) 100%) !important;
}
html body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-res.is-favored-target {
  border: 2px solid #10b981 !important;
  box-shadow: 0 0 0 1px rgba(16, 185, 129, 0.32), 0 14px 30px -12px rgba(16, 185, 129, 0.32) !important;
}
html body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-sup.is-favored-target {
  border: 2px solid #f43f5e !important;
  box-shadow: 0 0 0 1px rgba(244, 63, 94, 0.32), 0 14px 30px -12px rgba(244, 63, 94, 0.32) !important;
}
html body:not(#akx) #main:not(#aky) .hcd-overlap-card.is-secondary-target {
  opacity: 0.92 !important;
}
html body:not(#akx) #main:not(#aky) .hoc-fav-ribbon {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  padding: 6px 11px !important;
  margin-bottom: 6px !important;
  border-radius: 10px !important;
  font-size: 0.74rem !important;
  color: #ffffff !important;
}
html body:not(#akx) #main:not(#aky) .hoc-fav-ribbon.is-up {
  background: linear-gradient(90deg, #047857, #059669, #0d9488) !important;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3) !important;
}
html body:not(#akx) #main:not(#aky) .hoc-fav-ribbon.is-dn {
  background: linear-gradient(90deg, #be123c, #e11d48, #ea580c) !important;
  box-shadow: 0 4px 12px rgba(244, 63, 94, 0.3) !important;
}
html body:not(#akx) #main:not(#aky) .hoc-fav-ribbon .hfr-badge {
  padding: 2px 8px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.22) !important;
  font-size: 0.7rem !important;
  font-weight: 800 !important;
}
html body:not(#akx) #main:not(#aky) .hoc-sec-ribbon {
  display: flex !important;
  align-items: center !important;
  padding: 4px 10px !important;
  margin-bottom: 4px !important;
  border-radius: 8px !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  background: rgba(148, 163, 184, 0.14) !important;
  color: #64748b !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .hoc-sec-ribbon {
  color: #94a3b8 !important;
}

/* Elevator Favored Floor Highlight */
html body:not(#akx) #main:not(#aky) .dte-elev .elv-floor.is-ceiling.is-favored-floor {
  border: 2px solid #10b981 !important;
  box-shadow: 0 0 18px rgba(16, 185, 129, 0.32) !important;
}
html body:not(#akx) #main:not(#aky) .dte-elev .elv-floor.is-ground.is-favored-floor {
  border: 2px solid #f43f5e !important;
  box-shadow: 0 0 18px rgba(244, 63, 94, 0.32) !important;
}
html body:not(#akx) #main:not(#aky) .dte-elev .elv-fav-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
}
html body:not(#akx) #main:not(#aky) .dte-elev .elv-fav-pill.is-up {
  background: linear-gradient(135deg, #059669, #10b981) !important;
}
html body:not(#akx) #main:not(#aky) .dte-elev .elv-fav-pill.is-dn {
  background: linear-gradient(135deg, #e11d48, #f43f5e) !important;
}
html body:not(#akx) #main:not(#aky) .dte-elev .elv-sub-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  background: rgba(148, 163, 184, 0.18) !important;
  color: #64748b !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-sub-pill {
  color: #94a3b8 !important;
}

/* 3. Under-Strike Zone Density Meter (.gb-dens-meter) & 3-Tier Weighted Factor Hierarchy (V246) */
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb.is-skyline-col.is-fortress-col {
  box-shadow: inset 0 -3.5px 0 #f59e0b, 0 10px 24px -12px rgba(245, 158, 11, 0.45) !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb.is-skyline-col.is-anchor-col {
  box-shadow: inset 0 -2.5px 0 #0ea5e9, 0 8px 18px -12px rgba(14, 165, 233, 0.28) !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb.is-skyline-col.is-minor-conf-col {
  box-shadow: none !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-foot .gb-dens-meter {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  padding: 3px 5px !important;
  border-radius: 6px !important;
  background: rgba(148, 163, 184, 0.12) !important;
  box-sizing: border-box !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-foot .gb-dens-meter .gdm-lbl {
  font-size: 0.6rem !important;
  font-weight: 700 !important;
  color: #475569 !important;
  display: flex !important;
  justify-content: space-between !important;
  line-height: 1.1 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-foot .gb-dens-meter .gdm-lbl {
  color: #cbd5e1 !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-foot .gb-dens-meter .gdm-track {
  position: relative !important;
  width: 100% !important;
  height: 4px !important;
  min-height: 4px !important;
  max-height: 4px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.25) !important;
  overflow: hidden !important;
  display: block !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-foot .gb-dens-meter .gdm-track > .gdm-fill {
  position: static !important;
  display: block !important;
  height: 4px !important;
  min-height: 4px !important;
  max-height: 4px !important;
  border-radius: 999px !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-foot .gb-dens-meter.is-high .gdm-track > .gdm-fill {
  background: linear-gradient(90deg, #f59e0b, #ef4444) !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-foot .gb-dens-meter.is-med .gdm-track > .gdm-fill {
  background: linear-gradient(90deg, #0ea5e9, #10b981) !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-foot .gb-dens-meter.is-low .gdm-track > .gdm-fill {
  background: rgba(148, 163, 184, 0.55) !important;
}

/* Top-3 Fortress Badge (🔥 ด่านหลัก #1-#3) vs Tier-1 Anchor Badge (⭐ แนวสำคัญ) */
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-count.is-fortress-badge {
  background: linear-gradient(90deg, #fef08a, #fde047) !important;
  border: 1.5px solid #f59e0b !important;
  color: #78350f !important;
  font-weight: 800 !important;
  font-size: 0.67rem !important;
  box-shadow: 0 2px 8px rgba(245, 158, 11, 0.28) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-count.is-fortress-badge {
  background: linear-gradient(90deg, rgba(245, 158, 11, 0.36), rgba(234, 88, 12, 0.36)) !important;
  border: 1.5px solid #fbbf24 !important;
  color: #fef08a !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-count.is-anchor-badge {
  background: #e0f2fe !important;
  border: 1px solid #38bdf8 !important;
  color: #0369a1 !important;
  font-weight: 800 !important;
  font-size: 0.65rem !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-count.is-anchor-badge {
  background: rgba(14, 165, 233, 0.24) !important;
  border: 1px solid rgba(56, 189, 248, 0.68) !important;
  color: #bae6fd !important;
}

/* 3-Tier Weighted Chip Hierarchy (.is-tier-heavy > .is-tier-med > .is-tier-light) */
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 2px !important;
  padding: 2px 4px !important;
  font-size: 0.62rem !important;
  letter-spacing: -0.015em !important;
  box-sizing: border-box !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip .gcc-txt {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  min-width: 0 !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip .gcc-pts {
  flex: 0 0 auto !important;
  font-family: var(--mono) !important;
  font-size: 0.55rem !important;
  font-weight: 800 !important;
  padding: 0 2.5px !important;
  border-radius: 3px !important;
  background: rgba(15, 23, 42, 0.08) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip .gcc-pts {
  background: rgba(255, 255, 255, 0.14) !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-tier-heavy {
  font-weight: 800 !important;
  font-size: 0.635rem !important;
  padding: 2.5px 4px !important;
  border-left-width: 3px !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08) !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-ema200-fac {
  background: #fef9c3 !important;
  border: 1.5px solid #eab308 !important;
  border-left: 3.5px solid #ca8a04 !important;
  color: #713f12 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-ema200-fac {
  background: rgba(234, 179, 8, 0.25) !important;
  border: 1.5px solid #facc15 !important;
  border-left: 3.5px solid #fde047 !important;
  color: #fef08a !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-vwap-fac {
  background: #e0f2fe !important;
  border: 1.5px solid #0284c7 !important;
  border-left: 3.5px solid #0369a1 !important;
  color: #0c4a6e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-vwap-fac {
  background: rgba(14, 165, 233, 0.28) !important;
  border: 1.5px solid #38bdf8 !important;
  border-left: 3.5px solid #7dd3fc !important;
  color: #e0f2fe !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-tech-fac:not(.is-ema200-fac):not(.is-vwap-fac) {
  background: rgba(14, 165, 233, 0.14) !important;
  border: 1px solid rgba(14, 165, 233, 0.38) !important;
  color: #0369a1 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-tech-fac:not(.is-ema200-fac):not(.is-vwap-fac) {
  background: rgba(14, 165, 233, 0.2) !important;
  color: #7dd3fc !important;
}
html body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-tier-light {
  font-size: 0.61rem !important;
  font-weight: 600 !important;
  opacity: 0.78 !important;
  background: rgba(148, 163, 184, 0.12) !important;
  border: 1px dashed rgba(148, 163, 184, 0.42) !important;
  color: #475569 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-bars.is-skyline-chart .gb-conf-chip.is-tier-light {
  background: rgba(30, 41, 59, 0.55) !important;
  border: 1px dashed rgba(148, 163, 184, 0.32) !important;
  color: #94a3b8 !important;
}
html body:not(#akx) #main:not(#aky) .gex-under-legend .gul-chip.is-tech {
  background: rgba(14, 165, 233, 0.15) !important;
  border: 1px solid rgba(14, 165, 233, 0.38) !important;
  color: #0369a1 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-under-legend .gul-chip.is-tech {
  color: #7dd3fc !important;
}

/* 4. Market Session Closed / Pre-Market Badges (.gre-badge.is-closed-sess, .is-pre-sess) */
html body:not(#akx) #main:not(#aky) .gex-realtime-explainer .gre-badge.is-closed-sess,
html body:not(#akx) #main:not(#aky) .gex-realtime-explainer .gre-badge.is-pre-sess {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  background: rgba(245, 158, 11, 0.18) !important;
  border: 1px solid rgba(245, 158, 11, 0.48) !important;
  color: #92400e !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-realtime-explainer .gre-badge.is-closed-sess,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .gex-realtime-explainer .gre-badge.is-pre-sess {
  background: rgba(245, 158, 11, 0.22) !important;
  color: #fde68a !important;
}

/* 5. 24-Column Proportional Treemap Grid for 11 Sectors & 12 Mega-Cap Stocks + Zero Sharp Rectangles */
html body:not(#akx) #main:not(#aky) #mkBreadth > h3,
html body:not(#akx) #main:not(#aky) #mkLevels > h3,
html body:not(#akx) #main:not(#aky) #mkCross > h3 {
  border-radius: 10px !important;
}
html body:not(#akx) #main:not(#aky) .tile .t-reg-note {
  border-radius: 8px !important;
  padding: 4px 8px !important;
}

/* Unbox stacked .smf-chip inside .smf-col so they read as clean hairline rows instead of nested boxes */
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .smf-col .smf-chip {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 8px 4px !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .smf-col .smf-chip:last-child {
  border-bottom: 0 !important;
}

/* 24-Column Proportional S&P 500 Sector Treemap (.sp500-heatmap-grid) */
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid {
  display: grid !important;
  grid-template-columns: repeat(24, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell {
  border-radius: 16px !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell.hm-w-span-11 { grid-column: span 11 !important; }
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell.hm-w-span-7  { grid-column: span 7 !important; }
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell.hm-w-span-6  { grid-column: span 6 !important; }
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell.hm-w-span-5  { grid-column: span 5 !important; }
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell.is-tier-xl {
  min-height: 158px !important;
  padding: 16px 18px !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell.is-tier-xl .hm-pct {
  font-size: 1.55rem !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell.is-tier-sm {
  min-height: 118px !important;
  padding: 11px 13px !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell .hm-w-meter {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  margin: 4px 0 !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell .hm-w-meter .hwm-lbl {
  font-size: 0.66rem !important;
  font-weight: 700 !important;
  opacity: 0.86 !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell .hm-w-meter .hwm-track {
  width: 100% !important;
  height: 5px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.14) !important;
  overflow: hidden !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell .hm-w-meter .hwm-track {
  background: rgba(255, 255, 255, 0.14) !important;
}
html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell .hm-w-meter .hwm-track > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: currentColor !important;
  opacity: 0.78 !important;
}

/* 24-Column Proportional 12 Mega-Cap Stocks Treemap (.tiles.is-heatmap-grid) */
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid {
  display: grid !important;
  grid-template-columns: repeat(24, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile {
  border-radius: 16px !important;
  grid-column: span 6 !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile.tile-w-span-8 { grid-column: span 8 !important; }
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile.tile-w-span-7 { grid-column: span 7 !important; }
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile.tile-w-span-6 { grid-column: span 6 !important; }
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile.tile-w-span-5 { grid-column: span 5 !important; }
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile.tile-w-span-4 { grid-column: span 4 !important; }
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile.is-tier-mega {
  padding: 15px 16px !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile.is-tier-mega .t-px {
  font-size: 1.42rem !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile.is-tier-compact {
  padding: 11px 12px !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile .t-spy-w-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 999px !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  background: rgba(15, 23, 42, 0.08) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile .t-spy-w-pill {
  background: rgba(255, 255, 255, 0.12) !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile .tile-w-meter {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  margin: 4px 0 6px !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile .tile-w-meter .twm-lbl {
  font-size: 0.66rem !important;
  font-weight: 700 !important;
  opacity: 0.85 !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile .tile-w-meter .twm-track {
  width: 100% !important;
  height: 4px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.12) !important;
  overflow: hidden !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile .tile-w-meter .twm-track {
  background: rgba(255, 255, 255, 0.14) !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile .tile-w-meter .twm-track > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: currentColor !important;
  opacity: 0.78 !important;
}
@media (max-width: 1024px) {
  html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell,
  html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile {
    grid-column: span 12 !important;
  }
}
@media (max-width: 640px) {
  html body:not(#akx) #main:not(#aky) #mkSectorHeatmapDeck .sp500-heatmap-grid .hm-cell,
  html body:not(#akx) #main:not(#aky) #mkBreadth .tiles.is-heatmap-grid > .tile {
    grid-column: span 24 !important;
  }
}

/* ==========================================================================
   V247 — Price Elevator Clean Architectural Shaft & Intermediate Strike Floor Cards
   Fixes:
   1. Removes muddy red-black partial-width .elv-field rectangle & inverted shaft gradient
   2. Replaces bare tiny $772 / $770 right-border ticks with readable Intermediate Strike Floor Cards
   3. Stacks .elv-floor-top and .elv-floor-meta vertically so ceiling/ground headers never squish
   ========================================================================== */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-floor {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 6px !important;
  padding: 11px 14px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor .elv-merge,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-floor .elv-merge {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  font-size: 0.72rem !important;
  line-height: 1.35 !important;
  margin-top: 2px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor-top,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-floor-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor-top .elv-px,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-floor-top .elv-px {
  margin-left: auto !important;
  font-size: 1.08rem !important;
  font-weight: 800 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor-meta,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-floor-meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  width: 100% !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft.is-two-lane,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-shaft.is-two-lane {
  height: 336px !important;
  min-height: 336px !important;
  border-radius: 14px !important;
  background: linear-gradient(
    180deg,
    rgba(16, 185, 129, 0.08) 0%,
    #f8fafc 26%,
    #ffffff 50%,
    #f8fafc 74%,
    rgba(244, 63, 94, 0.07) 100%
  ) !important;
  border: 1.5px solid #cbd5e1 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 4px 12px rgba(15, 23, 42, 0.04) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft.is-two-lane,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-shaft.is-two-lane {
  background: linear-gradient(
    180deg,
    rgba(16, 185, 129, 0.14) 0%,
    rgba(15, 23, 42, 0.88) 26%,
    rgba(15, 23, 42, 0.94) 50%,
    rgba(15, 23, 42, 0.88) 74%,
    rgba(244, 63, 94, 0.13) 100%
  ) !important;
  border: 1.5px solid rgba(100, 116, 139, 0.42) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 6px 18px rgba(2, 6, 23, 0.35) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-field,
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-field.is-up,
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-field.is-down,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-field,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-field.is-up,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-field.is-down {
  left: 0 !important;
  right: 0 !important;
  background: none !important;
  box-shadow: none !important;
  border: none !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-field i,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-field i {
  left: 62px !important;
  margin-left: -13px !important;
  width: 26px !important;
  height: 10px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-ruler-lane,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-ruler-lane {
  display: none !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-callout-lane,
html:not([data-theme="dark"]) body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-callout-lane,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-callout-lane {
  left: 126px !important;
  right: 10px !important;
  top: 0 !important;
  bottom: 0 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  transform: translateY(50%) !important;
  z-index: 4 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row .elv-mark-line,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row .elv-mark-line {
  width: 14px !important;
  height: 2px !important;
  flex: 0 0 14px !important;
  border-radius: 999px !important;
  background: #94a3b8 !important;
  border: 0 !important;
  opacity: 0.75 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-line,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-line {
  background: #f59e0b !important;
  height: 2.5px !important;
  opacity: 0.95 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-line,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-line {
  background: #0ea5e9 !important;
  opacity: 0.9 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card {
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: none !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 7px !important;
  padding: 5px 10px !important;
  border-radius: 9px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1.5px solid #cbd5e1 !important;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.06) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card {
  background: rgba(30, 41, 59, 0.94) !important;
  border-color: rgba(100, 116, 139, 0.48) !important;
  box-shadow: 0 3px 10px rgba(2, 6, 23, 0.4) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card {
  background: linear-gradient(90deg, #fffbeb 0%, #ffffff 65%) !important;
  border-color: #f59e0b !important;
  box-shadow: 0 3px 10px rgba(245, 158, 11, 0.14) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card {
  background: linear-gradient(90deg, rgba(120, 53, 15, 0.52) 0%, rgba(30, 41, 59, 0.96) 70%) !important;
  border-color: rgba(251, 191, 36, 0.72) !important;
  box-shadow: 0 3px 12px rgba(245, 158, 11, 0.2) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-pill.is-floor-card,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-pill.is-floor-card {
  background: linear-gradient(90deg, #f0f9ff 0%, #ffffff 65%) !important;
  border-color: #38bdf8 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-pill.is-floor-card,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-pill.is-floor-card {
  background: linear-gradient(90deg, rgba(12, 74, 110, 0.5) 0%, rgba(30, 41, 59, 0.95) 70%) !important;
  border-color: rgba(56, 189, 248, 0.62) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-px,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-px {
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  color: #0f172a !important;
  flex: 0 0 auto !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-px {
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card .ef-px,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card .ef-px {
  color: #b45309 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card .ef-px,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card .ef-px {
  color: #fde68a !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-badge,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  font-size: 0.67rem !important;
  font-weight: 800 !important;
  background: #f1f5f9 !important;
  color: #334155 !important;
  border: 1px solid #cbd5e1 !important;
  flex: 0 0 auto !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-badge,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-badge {
  background: rgba(51, 65, 85, 0.65) !important;
  color: #e2e8f0 !important;
  border-color: rgba(148, 163, 184, 0.35) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card .ef-badge,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card .ef-badge {
  background: #fef3c7 !important;
  color: #92400e !important;
  border-color: #f59e0b !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card .ef-badge,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-major-floor .elv-mark-pill.is-floor-card .ef-badge {
  background: rgba(180, 83, 9, 0.45) !important;
  color: #fef3c7 !important;
  border-color: rgba(251, 191, 36, 0.65) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-pill.is-floor-card .ef-badge,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-pill.is-floor-card .ef-badge {
  background: #e0f2fe !important;
  color: #0369a1 !important;
  border-color: #38bdf8 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-pill.is-floor-card .ef-badge,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark.is-floor-row.is-notable-floor .elv-mark-pill.is-floor-card .ef-badge {
  background: rgba(3, 105, 161, 0.45) !important;
  color: #e0f2fe !important;
  border-color: rgba(56, 189, 248, 0.55) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-facs,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-facs {
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  color: #334155 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-facs,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-facs {
  color: #cbd5e1 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-dist,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-dist {
  font-family: var(--aku-font-mono), monospace !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  padding: 1px 6px !important;
  border-radius: 6px !important;
  flex: 0 0 auto !important;
  margin-left: auto !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-up,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-up {
  background: rgba(16, 185, 129, 0.12) !important;
  color: #047857 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-up,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-up {
  background: rgba(16, 185, 129, 0.2) !important;
  color: #6ee7b7 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-dn,
html body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-dn {
  background: rgba(244, 63, 94, 0.12) !important;
  color: #be123c !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-dn,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-dn {
  background: rgba(244, 63, 94, 0.2) !important;
  color: #fda4af !important;
}






/* ==========================================================================
   V248 — 🛗 Elevator floor hierarchy + ⚔️ live battle floor
   (Audi 2026-10-28: "เน้นสีตรงจุดที่มีความสำคัญมากกว่าแล้วใช่ไหม หรือทำให้มี
   animationอะไรด้วยไหม สำหรับจุดที่กำลังต่อสู้ หรือว่าจุดที่มีความสำคัญ")
   Weight → loudness: 👑 top overlap (solid side colour) › 🧱 wall / 🔥 fortress
   (amber) › ⭐ notable (sky) › 📐 minor (dashed, faded). Only ONE floor pulses:
   the nearest strike within the 0.75 testing band. Phase comes from the clock
   (--elv-battle-phase) so 15 s redraws never restart the loop.
   ========================================================================== */
@keyframes elvFloorBattle {
  0%, 100% { box-shadow: 0 0 0 0 rgba(249, 115, 22, 0.55), 0 3px 10px rgba(249, 115, 22, 0.18); }
  50% { box-shadow: 0 0 0 4px rgba(249, 115, 22, 0), 0 3px 14px rgba(249, 115, 22, 0.32); }
}
@keyframes elvFloorBattleLine {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}

/* 📐 minor floors step back */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-minor-floor .elv-mark-pill.is-floor-card {
  opacity: 0.78 !important;
  border-style: dashed !important;
  box-shadow: none !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-minor-floor .elv-mark-pill.is-floor-card .ef-px {
  font-size: 0.8rem !important;
  color: #475569 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-minor-floor .elv-mark-pill.is-floor-card .ef-px {
  color: #cbd5e1 !important;
}

/* 👑 top overlap floor = the loudest card, coloured by its side */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor .elv-mark-pill.is-floor-card {
  border-width: 2px !important;
  border-left-width: 5px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-res .elv-mark-pill.is-floor-card {
  background: linear-gradient(90deg, #d1fae5 0%, #ffffff 70%) !important;
  border-color: #059669 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-sup .elv-mark-pill.is-floor-card {
  background: linear-gradient(90deg, #ffe4e6 0%, #ffffff 70%) !important;
  border-color: #e11d48 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-res .elv-mark-pill.is-floor-card {
  background: linear-gradient(90deg, rgba(6, 95, 70, 0.72) 0%, rgba(15, 23, 42, 0.96) 72%) !important;
  border-color: #34d399 !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-sup .elv-mark-pill.is-floor-card {
  background: linear-gradient(90deg, rgba(136, 19, 55, 0.72) 0%, rgba(15, 23, 42, 0.96) 72%) !important;
  border-color: #fb7185 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor .elv-mark-pill.is-floor-card .ef-px {
  font-size: 1rem !important;
  font-weight: 900 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-res .elv-mark-pill.is-floor-card .ef-px { color: #047857 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-sup .elv-mark-pill.is-floor-card .ef-px { color: #be123c !important; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-res .elv-mark-pill.is-floor-card .ef-px { color: #6ee7b7 !important; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-sup .elv-mark-pill.is-floor-card .ef-px { color: #fda4af !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-res .elv-mark-pill.is-floor-card .ef-badge {
  background: #047857 !important;
  color: #ffffff !important;
  border-color: #047857 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-sup .elv-mark-pill.is-floor-card .ef-badge {
  background: #be123c !important;
  color: #ffffff !important;
  border-color: #be123c !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-res .elv-mark-line { background: #059669 !important; height: 3px !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-top-floor.is-sup .elv-mark-line { background: #e11d48 !important; height: 3px !important; }

/* ⚔️ battle floor — one pulsing ring + blinking connector, clock-phased */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-battle .elv-mark-pill.is-floor-card {
  animation: elvFloorBattle 2.4s ease-in-out infinite !important;
  animation-delay: var(--elv-battle-phase, 0ms) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-battle .elv-mark-line {
  background: #f97316 !important;
  height: 3px !important;
  box-shadow: 0 0 6px rgba(249, 115, 22, 0.7) !important;
  animation: elvFloorBattleLine 2.4s ease-in-out infinite !important;
  animation-delay: var(--elv-battle-phase, 0ms) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-battle {
  background: #c2410c !important;
  color: #ffffff !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark-pill.is-floor-card .ef-dist.is-battle {
  background: #ea580c !important;
  color: #ffffff !important;
}
@media (prefers-reduced-motion: reduce) {
  html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-battle .elv-mark-pill.is-floor-card,
  html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-battle .elv-mark-line {
    animation: none !important;
  }
  html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-battle .elv-mark-pill.is-floor-card {
    box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.6) !important;
  }
}

/* V248b: battle card also changes its static rim so the state reads in a still frame */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-mark.is-floor-row.is-battle:not(.is-top-floor) .elv-mark-pill.is-floor-card {
  border-color: #f97316 !important;
  border-width: 2px !important;
}
/* V249 — elevator head/foot = frame edges; "ต้องผ่าน $770 👑 ⚔️ → $772 ก่อน" path row */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor .elv-path {
  display: block !important;
  font-size: 0.74rem !important;
  font-weight: 700 !important;
  line-height: 1.45 !important;
  color: #334155 !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  border: 1px dashed #cbd5e1 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor .elv-path b {
  font-family: var(--aku-font-mono), monospace !important;
  font-weight: 800 !important;
  color: #0f172a !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor .elv-path {
  color: #cbd5e1 !important;
  background: rgba(15, 23, 42, 0.55) !important;
  border-color: rgba(148, 163, 184, 0.35) !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor .elv-path b {
  color: #f8fafc !important;
}
/* V249b: .elv-floor must stack (a later row-flex override pushed .elv-merge off the right edge, clipped by overflow:hidden) */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor.elv-floor {
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-floor.elv-floor > .elv-merge {
  flex: 0 0 auto !important;
  width: auto !important;
  font-weight: 700 !important;
}
/* ==========================================================================
   V250 — Audi 2026-10-28
   1. "เปิดวันนี้ $767.34 อันนี้มันหลุดออกนอกกล่อง" → gap bridge = 2 nodes on row 1, status pill on row 2
   2. "ที่มันมีเส้นประ…มันไม่สวยไหม ทำเป็นแรงผลักกันดีกว่าไหม" → dashed rail retired; push beams from each edge toward the car
   3. "เส้นเดี่ยวที่เชื่อมกับ 🎯 ขอบบนกรอบ…ทำเป็นโซ่ หรือเชือก" → chain that pulls toward the model-favoured side
   4. "แท่งมันกว้างจัดเห็นไม่กี่แท่งเอง" → skyline columns capped, centred
   5. "แรงหนุน SPY ขึ้น … มันเป็นสี่เหลี่ยมไปรึป่าว" → cross-asset arena gets rounded corners
   ========================================================================== */

/* 1. Gap bridge: never wider than its box */
html body:not(#akx) #main:not(#aky) #panel-market .gj-vis-box.is-gap-vis .gj-bridge-nodes {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: end !important;
  gap: 4px 6px !important;
  min-width: 0 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .gj-vis-box.is-gap-vis .gbn-node { min-width: 0 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .gj-vis-box.is-gap-vis .gbn-node:not(.is-right) { grid-column: 1 !important; grid-row: 1 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .gj-vis-box.is-gap-vis .gbn-node.is-right { grid-column: 2 !important; grid-row: 1 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .gj-vis-box.is-gap-vis .gbn-node > b { white-space: nowrap !important; }
html body:not(#akx) #main:not(#aky) #panel-market .gj-vis-box.is-gap-vis .gbn-arrow {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  justify-self: center !important;
}

/* 2. Push beams (replace dashed rail + faint chevrons) */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft.is-two-lane .elv-rail { display: none !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-field.elv-field {
  left: 40px !important;
  right: auto !important;
  width: 48px !important;
  overflow: hidden !important;
  z-index: 1 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-field.elv-field.is-down {
  background: linear-gradient(180deg, rgba(16, 185, 129, 0.42) 0%, rgba(16, 185, 129, 0.06) 100%) !important;
  clip-path: polygon(0 0, 100% 0, 66% 100%, 34% 100%) !important;
  opacity: calc(0.45 + var(--res-k, 0.5) * 0.55) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-field.elv-field.is-up {
  background: linear-gradient(0deg, rgba(244, 63, 94, 0.42) 0%, rgba(244, 63, 94, 0.06) 100%) !important;
  clip-path: polygon(34% 0, 66% 0, 100% 100%, 0 100%) !important;
  opacity: calc(0.45 + var(--sup-k, 0.5) * 0.55) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-field.elv-field i {
  left: 50% !important;
  margin-left: -11px !important;
  width: 22px !important;
  height: 10px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-field.elv-field.is-down i { background: #059669 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-field.elv-field.is-up i { background: #e11d48 !important; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-field.elv-field.is-down i { background: #34d399 !important; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-field.elv-field.is-up i { background: #fb7185 !important; }
/* floor-card connectors: solid, not dashed */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft.is-two-lane .elv-mark-line {
  border-top: 0 !important;
  height: 2px !important;
  border-radius: 2px !important;
  background: rgba(100, 116, 139, 0.55) !important;
}

/* 3. Chain (pull toward the favoured side) */
@keyframes elvChainPullUp { from { background-position: 0 0, 0 0; } to { background-position: 0 -14px, 0 -14px; } }
@keyframes elvChainPullDown { from { background-position: 0 0, 0 0; } to { background-position: 0 14px, 0 14px; } }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain {
  position: absolute !important;
  left: 22px !important;
  width: 12px !important;
  z-index: 3 !important;
  pointer-events: none !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-links {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  /* alternating oval link (ring) + side link (bar) every 7px */
  background:
    radial-gradient(ellipse 4px 4.6px at 50% 3.5px, transparent 58%, var(--chain-c, #64748b) 62% 88%, transparent 92%) 0 0 / 12px 14px repeat-y,
    linear-gradient(var(--chain-c, #64748b), var(--chain-c, #64748b)) 50% 9px / 2.5px 6px repeat-y !important;
  animation: elvChainPullUp var(--pull-s, 2s) linear infinite !important;
  animation-delay: var(--chain-ph, 0ms) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-pull-up { --chain-c: #059669; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-pull-down { --chain-c: #e11d48; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-pull-up { --chain-c: #6ee7b7; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-pull-down { --chain-c: #fda4af; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-pull-down .elv-chain-links { animation-name: elvChainPullDown !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-tag {
  position: absolute !important;
  left: 16px !important;
  white-space: nowrap !important;
  font-style: normal !important;
  font-size: 0.64rem !important;
  font-weight: 800 !important;
  padding: 2px 7px !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  border: 1.5px solid var(--chain-c, #64748b) !important;
  color: #0f172a !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-tag {
  background: #0f172a !important;
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-pull-up .elv-chain-tag { top: 6px !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-pull-down .elv-chain-tag { bottom: 6px !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-short .elv-chain-tag { display: none !important; }
@media (prefers-reduced-motion: reduce) {
  html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-links { animation: none !important; }
}
html[data-motion=paused] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-links { animation: none !important; }

/* 4. GEX skyline: columns capped so few strikes don't become giant slabs */
html body:not(#akx) #main:not(#aky) #mkLevels .gex-bars.is-skyline-chart {
  justify-content: center !important;
}
html body:not(#akx) #main:not(#aky) #mkLevels .gex-bars.is-skyline-chart .gb.is-skyline-col {
  max-width: 136px !important;
}

/* 5. Cross-asset arena: rounded, not a square box */
html body:not(#akx) #main:not(#aky) #panel-market .tug-wrap.spy-clash-arena {
  border-radius: 16px !important;
}

/* V250b: chain drawn with an SVG link mask (the gradient version read as a dotted line again at 12px) */
@keyframes elvChainMaskUp { from { -webkit-mask-position: 50% 0; mask-position: 50% 0; } to { -webkit-mask-position: 50% -18px; mask-position: 50% -18px; } }
@keyframes elvChainMaskDown { from { -webkit-mask-position: 50% 0; mask-position: 50% 0; } to { -webkit-mask-position: 50% 18px; mask-position: 50% 18px; } }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-links {
  background: var(--chain-c, #64748b) !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='18'%3E%3Cellipse cx='6' cy='5' rx='4' ry='4.4' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3Crect x='4.5' y='8.6' width='3' height='9.4' rx='1.5'/%3E%3C/svg%3E") 50% 0 / 12px 18px repeat-y !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='18'%3E%3Cellipse cx='6' cy='5' rx='4' ry='4.4' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3Crect x='4.5' y='8.6' width='3' height='9.4' rx='1.5'/%3E%3C/svg%3E") 50% 0 / 12px 18px repeat-y !important;
  filter: drop-shadow(0 0 3px var(--chain-c, #64748b)) !important;
  animation: elvChainMaskUp var(--pull-s, 2s) linear infinite !important;
  animation-delay: var(--chain-ph, 0ms) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-pull-down .elv-chain-links { animation-name: elvChainMaskDown !important; }
@media (prefers-reduced-motion: reduce) {
  html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-links { animation: none !important; }
}
html[data-motion=paused] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-links { animation: none !important; }
/* V250c: dark cross-asset arena has a 1px frame — give its content breathing room inside the rounded frame */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .tug-wrap.spy-clash-arena {
  padding: 12px 14px !important;
  overflow: hidden !important;
}
/* V251 — chain tag explains its %: "🧭 ขึ้น 64% · หนุน 4/6 มิติ" + 3×2 grid of the 6 factor icons with ▲/▼ (Audi 2026-10-28: "ใส่ที่มาบนโซ่") */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-tag {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 2px !important;
  max-width: 88px !important;
  padding: 4px 7px 5px !important;
  border-radius: 10px !important;
  pointer-events: auto !important;
  cursor: help !important;
  line-height: 1.2 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-tag > b { font-size: 0.72rem !important; font-weight: 900 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .elv-chain-tag > small { font-size: 0.6rem !important; font-weight: 700 !important; opacity: 0.85 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .ecb-grid {
  display: grid !important;
  grid-template-columns: repeat(3, auto) !important;
  gap: 2px 3px !important;
  margin-top: 1px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .ecb-i {
  font-style: normal !important;
  font-size: 0.58rem !important;
  font-weight: 900 !important;
  padding: 1px 3px !important;
  border-radius: 5px !important;
  white-space: nowrap !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .ecb-i.is-up { background: #d1fae5 !important; color: #047857 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .ecb-i.is-dn { background: #ffe4e6 !important; color: #be123c !important; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .ecb-i.is-up { background: rgba(16, 185, 129, 0.22) !important; color: #6ee7b7 !important; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain .ecb-i.is-dn { background: rgba(244, 63, 94, 0.22) !important; color: #fda4af !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-shaft .elv-chain.is-short .elv-chain-tag { display: none !important; }
/* V252 — chain source moved OUT of the shaft into an anchor strip at the chain's end (Audi 2026-10-28:
   "มันไม่ได้อยู่ในกล่องนะ แล้ว ถ้า … SPY พรีมาร์เก็ต เลื่อนขึ้นมาชน 773 มันจะทับ กล่อง 🧭 ขึ้น 64% ไหม").
   Strip sits between the edge card and the shaft, so the moving car can never reach it. */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain .elv-chain-tag { display: none !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor {
  position: relative !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px 10px !important;
  margin: 8px 0 !important;
  padding: 7px 12px 7px 38px !important;
  border-radius: 12px !important;
  border: 1.5px solid var(--chain-c, #64748b) !important;
  background: color-mix(in srgb, var(--chain-c, #64748b) 9%, #ffffff) !important;
  color: #0f172a !important;
  line-height: 1.25 !important;
  cursor: help !important;
}
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor {
  background: color-mix(in srgb, var(--chain-c, #64748b) 14%, #0f172a) !important;
  color: #f8fafc !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor.is-pull-up { --chain-c: #059669; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor.is-pull-down { --chain-c: #e11d48; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor.is-pull-up { --chain-c: #34d399; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor.is-pull-down { --chain-c: #fb7185; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor > b { font-size: 0.8rem !important; font-weight: 900 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor > small { font-size: 0.72rem !important; font-weight: 700 !important; opacity: 0.85 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor .ecb-grid {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor .ecb-i {
  font-style: normal !important;
  font-size: 0.7rem !important;
  font-weight: 900 !important;
  padding: 2px 6px !important;
  border-radius: 6px !important;
  white-space: nowrap !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor .ecb-i.is-up { background: #d1fae5 !important; color: #047857 !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor .ecb-i.is-dn { background: #ffe4e6 !important; color: #be123c !important; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor .ecb-i.is-up { background: rgba(16, 185, 129, 0.22) !important; color: #6ee7b7 !important; }
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor .ecb-i.is-dn { background: rgba(244, 63, 94, 0.22) !important; color: #fda4af !important; }
/* the hook: the chain column (x≈28px in the shaft) continues into the strip so they read as one piece */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor .eca-link {
  position: absolute !important;
  left: 16px !important;
  width: 12px !important;
  height: 22px !important;
  background: var(--chain-c, #64748b) !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='18'%3E%3Cellipse cx='6' cy='5' rx='4' ry='4.4' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3Crect x='4.5' y='8.6' width='3' height='9.4' rx='1.5'/%3E%3C/svg%3E") 50% 0 / 12px 18px repeat-y !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='18'%3E%3Cellipse cx='6' cy='5' rx='4' ry='4.4' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3Crect x='4.5' y='8.6' width='3' height='9.4' rx='1.5'/%3E%3C/svg%3E") 50% 0 / 12px 18px repeat-y !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor.is-pull-up .eca-link { bottom: -10px !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor.is-pull-down .eca-link { top: -10px !important; }
/* V252b: hook link bridges the strip and the shaft, aligned with the chain column */
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor .eca-link {
  left: 21px !important;
  height: 36px !important;
  z-index: 4 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor.is-pull-up .eca-link { bottom: -36px !important; top: auto !important; }
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev .elv-chain-anchor.is-pull-down .eca-link { top: -36px !important; bottom: auto !important; }

/* ==========================================================================
   V253 — Audi 2026-10-29: Liquidity Sweep 2-Bounce Side Setup & Multi-Sweep Defense
   1. #panel-setups: 5th Side Setup tab (.def-case-tab.is-sweep), 4-column companion row on desktop, 2-Bounce SVG infographic (.setup-infographic.is-sweep-mode)
   2. #panel-market: Live Liquidity Sweep & 2-Bounce Radar (#mkSweepRadar / .mk-sweep-radar)
   3. #panel-lessons: Interactive Liquidity Sweep & 2-Bounce Lesson (#sweepLessonGuide / .sweep-lesson-card)
   4. #panel-review (🔒 หลังบ้าน Audi): Liquidity Sweep Playbook & Multi-Sweep Defense (.rv-sweep-playbook)
   ========================================================================== */

/* 1. #panel-setups 5-tab layout + .is-sweep Side Setup styling */
@media (min-width: 1120px) {
  html body:not(#akx) #main:not(#aky) #panel-setups .def-case-tabs {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}
@media (min-width: 641px) and (max-width: 1119px) {
  html body:not(#akx) #main:not(#aky) #panel-setups .def-case-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
html body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sweep {
  border-color: rgba(245, 183, 59, 0.36);
  background: linear-gradient(145deg, rgba(120, 53, 15, 0.28), rgba(15, 23, 42, 0.84) 55%, rgba(6, 78, 59, 0.22));
}
html body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sweep:hover {
  border-color: rgba(251, 191, 36, 0.68);
  background: linear-gradient(145deg, rgba(146, 64, 14, 0.38), rgba(15, 23, 42, 0.90) 55%, rgba(6, 95, 70, 0.30));
}
html body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sweep[aria-selected="true"] {
  background: linear-gradient(145deg, rgba(146, 64, 14, 0.56), rgba(15, 23, 42, 0.95) 55%, rgba(6, 95, 70, 0.44)) !important;
  border-color: #f5b73b !important;
  box-shadow: 0 10px 26px rgba(245, 183, 59, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}
html body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sweep .def-case-kicker {
  color: #fde68a !important;
}
html body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sweep[aria-selected="true"] .def-case-cta {
  background: rgba(217, 119, 6, 0.45) !important;
  border-color: rgba(251, 191, 36, 0.68) !important;
  color: #fef3c7 !important;
}
html body:not(#akx) #main:not(#aky) #panel-setups .def-case-banner.is-sweep {
  border-left: 4px solid #f5b73b !important;
  background: linear-gradient(135deg, rgba(120, 53, 15, 0.34), rgba(15, 23, 42, 0.92) 55%, rgba(6, 78, 59, 0.28)) !important;
}
html body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-sweep-mode {
  margin-top: 14px;
  border-radius: 14px;
  border: 1px solid rgba(245, 183, 59, 0.32);
  background: rgba(9, 13, 22, 0.88);
  padding: 12px 14px;
  overflow: hidden;
}
html body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-sweep-mode .setup-info-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-bottom: 10px;
}
html body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-sweep-mode .setup-info-svg {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 10px;
}

/* Light mode for #panel-setups .is-sweep */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sweep {
  background: linear-gradient(145deg, #fffbeb 0%, #ffffff 55%, #ecfdf5 100%) !important;
  border-color: rgba(217, 119, 6, 0.38) !important;
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sweep[aria-selected="true"] {
  background: linear-gradient(145deg, #fef3c7 0%, #fffbeb 55%, #d1fae5 100%) !important;
  border-color: #d97706 !important;
  box-shadow: 0 10px 24px rgba(217, 119, 6, 0.16) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sweep .def-case-kicker {
  color: #b45309 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-tab.is-sweep[aria-selected="true"] .def-case-cta {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .def-case-banner.is-sweep {
  background: linear-gradient(135deg, #fffbeb 0%, #ffffff 60%, #ecfdf5 100%) !important;
  border-color: rgba(217, 119, 6, 0.35) !important;
  border-left: 4px solid #d97706 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-sweep-mode {
  background: #0b1220 !important;
  border-color: rgba(15, 23, 42, 0.25) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-sweep-mode .setup-info-head b {
  color: #f8fafc !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-setups .setup-infographic.is-sweep-mode .setup-info-legend span {
  color: #e2e8f0 !important;
}

/* 2. #panel-market Liquidity Sweep & 2-Bounce Radar (#mkSweepRadar / .mk-sweep-radar) */
html body:not(#akx) #main:not(#aky) #panel-market .mk-sweep-radar {
  margin-top: 12px;
  padding: 12px 15px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.26);
  border-left: 4px solid #38bdf8;
  background: rgba(15, 23, 42, 0.62);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
html body:not(#akx) #main:not(#aky) #panel-market .mk-sweep-radar.is-warn {
  border-color: rgba(245, 183, 59, 0.38);
  border-left-color: #f5b73b;
  background: linear-gradient(135deg, rgba(120, 53, 15, 0.24), rgba(15, 23, 42, 0.72));
}
html body:not(#akx) #main:not(#aky) #panel-market .mk-sweep-radar.is-danger {
  border-color: rgba(251, 113, 133, 0.42);
  border-left-color: #fb7185;
  background: linear-gradient(135deg, rgba(136, 19, 55, 0.26), rgba(15, 23, 42, 0.76));
}
html body:not(#akx) #main:not(#aky) #panel-market .mk-sweep-radar.is-calm {
  border-color: rgba(52, 211, 153, 0.34);
  border-left-color: #34d399;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-title-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-kicker {
  font-family: var(--font-head);
  font-size: 0.84rem;
  font-weight: 800;
  color: #f8fafc;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: 0.76rem;
  font-weight: 800;
  background: rgba(56, 189, 248, 0.16);
  color: #bae6fd;
  border: 1px solid rgba(56, 189, 248, 0.38);
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-badge.is-warn {
  background: rgba(245, 183, 59, 0.2);
  color: #fde68a;
  border-color: rgba(245, 183, 59, 0.45);
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-badge.is-danger {
  background: rgba(244, 63, 94, 0.22);
  color: #fecdd3;
  border-color: rgba(251, 113, 133, 0.48);
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-badge.is-calm {
  background: rgba(16, 185, 129, 0.18);
  color: #a7f3d0;
  border-color: rgba(52, 211, 153, 0.42);
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-jump-btn {
  appearance: none;
  border: 1px solid rgba(245, 183, 59, 0.48);
  background: rgba(245, 183, 59, 0.14);
  color: #fef3c7;
  font-family: var(--font-head);
  font-size: 0.76rem;
  font-weight: 800;
  padding: 5px 11px;
  border-radius: 999px;
  cursor: pointer;
  transition: transform 0.15s ease, background 0.15s ease;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-jump-btn:hover {
  transform: translateY(-1px);
  background: rgba(245, 183, 59, 0.26);
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-desc {
  margin: 0;
  font-size: 0.85rem;
  line-height: 1.5;
  color: #e2e8f0;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 700;
  background: rgba(15, 23, 42, 0.78);
  border: 1px solid rgba(148, 163, 184, 0.28);
  color: #cbd5e1;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-pill.is-up-sweep {
  border-color: rgba(251, 113, 133, 0.44);
  color: #fecdd3;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-pill.is-dn-sweep {
  border-color: rgba(52, 211, 153, 0.44);
  color: #a7f3d0;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-pill.is-2bounce {
  border-color: rgba(245, 183, 59, 0.56);
  background: rgba(120, 53, 15, 0.34);
  color: #fef3c7;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-action {
  font-size: 0.82rem;
  line-height: 1.48;
  color: #f8fafc;
  padding-top: 6px;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-head-left {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-title {
  font-family: var(--font-head);
  font-size: 0.92rem;
  font-weight: 800;
  color: #f8fafc;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-vwap-tag {
  font-size: 0.78rem;
  font-weight: 700;
  color: #cbd5e1;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-ev-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-ev-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 0.78rem;
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(148, 163, 184, 0.25);
  color: #e2e8f0;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-ev-chip.is-upper {
  border-color: rgba(251, 113, 133, 0.42);
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-ev-chip.is-lower {
  border-color: rgba(52, 211, 153, 0.42);
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-2bounce-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding-top: 6px;
  border-top: 1px solid rgba(148, 163, 184, 0.18);
}
@media (max-width: 860px) {
  html body:not(#akx) #main:not(#aky) #panel-market .msr-2bounce-strip {
    grid-template-columns: 1fr;
  }
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-leg {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.82rem;
  line-height: 1.5;
  color: #cbd5e1;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-leg-tag {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 2px 9px;
  border-radius: 999px;
  font-family: var(--font-head);
  font-size: 0.75rem;
  font-weight: 800;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-leg.is-leg1 .msr-leg-tag {
  background: rgba(244, 63, 94, 0.2);
  border: 1px solid rgba(251, 113, 133, 0.45);
  color: #fecdd3;
}
html body:not(#akx) #main:not(#aky) #panel-market .msr-leg.is-leg2 .msr-leg-tag {
  background: rgba(16, 185, 129, 0.2);
  border: 1px solid rgba(52, 211, 153, 0.45);
  color: #a7f3d0;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-title {
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-vwap-tag,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-leg {
  color: #334155 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-ev-chip {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-leg.is-leg1 .msr-leg-tag {
  background: #ffe4e6 !important;
  border-color: #fda4af !important;
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-leg.is-leg2 .msr-leg-tag {
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
  color: #065f46 !important;
}

/* Light mode for #mkSweepRadar */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-sweep-radar {
  background: #f8fafc !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  border-left: 4px solid #0284c7 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-sweep-radar.is-warn {
  background: #fffbeb !important;
  border-color: rgba(217, 119, 6, 0.34) !important;
  border-left-color: #d97706 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-sweep-radar.is-danger {
  background: #fff1f2 !important;
  border-color: rgba(225, 29, 72, 0.32) !important;
  border-left-color: #e11d48 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .mk-sweep-radar.is-calm {
  background: #ecfdf5 !important;
  border-color: rgba(5, 150, 105, 0.3) !important;
  border-left-color: #059669 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-kicker,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-action {
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-desc {
  color: #334155 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-badge {
  background: #e0f2fe !important;
  color: #0369a1 !important;
  border-color: #7dd3fc !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-badge.is-warn {
  background: #fef3c7 !important;
  color: #92400e !important;
  border-color: #fcd34d !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-badge.is-danger {
  background: #ffe4e6 !important;
  color: #9f1239 !important;
  border-color: #fda4af !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-badge.is-calm {
  background: #d1fae5 !important;
  color: #065f46 !important;
  border-color: #6ee7b7 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-jump-btn {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-pill {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
  color: #1e293b !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-pill.is-up-sweep {
  border-color: #f43f5e !important;
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-pill.is-dn-sweep {
  border-color: #10b981 !important;
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market .msr-pill.is-2bounce {
  background: #fef3c7 !important;
  border-color: #d97706 !important;
  color: #92400e !important;
}

/* 3. #panel-lessons Interactive Liquidity Sweep & 2-Bounce Guide (#sweepLessonGuide / .sweep-lesson-card) */
html body:not(#akx) #main:not(#aky) #panel-lessons .sweep-lesson-card {
  margin-bottom: 18px;
  padding: 20px 22px;
  border-radius: 16px;
  border: 1.5px solid rgba(245, 183, 59, 0.42);
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(11, 18, 32, 0.96));
  display: flex;
  flex-direction: column;
  gap: 14px;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px 16px;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-head-left {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-head-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.22);
  padding-bottom: 8px;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-tab {
  appearance: none;
  background: transparent;
  border: 0;
  border-bottom: 2.5px solid transparent;
  padding: 6px 12px;
  font-family: var(--font-head);
  font-size: 0.86rem;
  font-weight: 800;
  color: #94a3b8;
  cursor: pointer;
  transition: color 0.15s ease, border-color 0.15s ease;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-tab:hover {
  color: #e2e8f0;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-tab.is-active {
  color: #fde68a;
  border-bottom-color: #f5b73b;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-svg {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.22);
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-step-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
@media (max-width: 960px) {
  html body:not(#akx) #main:not(#aky) #panel-lessons .slg-step-grid {
    grid-template-columns: 1fr;
  }
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-step {
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(15, 23, 42, 0.72);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-step.is-put {
  border-left: 4px solid #fb7185;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-step.is-call {
  border-left: 4px solid #34d399;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-step.is-warn {
  border-left: 4px solid #f5b73b;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-badge {
  font-family: var(--font-head);
  font-size: 0.74rem;
  font-weight: 800;
  color: #fde68a;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-step b {
  font-family: var(--font-head);
  font-size: 0.94rem;
  font-weight: 800;
  color: #f8fafc;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-step p {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.52;
  color: #cbd5e1;
}
html body:not(#akx) #main:not(#aky) #panel-lessons .slg-rule-box {
  padding: 12px 16px;
  border-radius: 12px;
  border-left: 4px solid #f5b73b;
  background: rgba(120, 53, 15, 0.22);
  font-size: 0.85rem;
  line-height: 1.52;
  color: #fef3c7;
}

/* Light mode for #sweepLessonGuide */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-lessons .sweep-lesson-card {
  background: #ffffff !important;
  border-color: rgba(217, 119, 6, 0.38) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-lessons .slg-tab {
  color: #475569 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-lessons .slg-tab.is-active {
  color: #b45309 !important;
  border-bottom-color: #d97706 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-lessons .slg-step {
  background: #f8fafc !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-lessons .slg-badge {
  color: #b45309 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-lessons .slg-step b {
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-lessons .slg-step p {
  color: #334155 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-lessons .slg-rule-box {
  background: #fffbeb !important;
  border-left-color: #d97706 !important;
  color: #78350f !important;
}

/* 4. #panel-review (🔒 หลังบ้าน Audi) Liquidity Sweep Playbook (.rv-sweep-playbook) */
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-playbook {
  margin-top: 16px;
  padding: 18px 20px;
  border-radius: 16px;
  border: 1.5px solid rgba(245, 183, 59, 0.38);
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(11, 18, 32, 0.95));
  display: flex;
  flex-direction: column;
  gap: 14px;
}
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px 16px;
}
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
@media (max-width: 960px) {
  html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-grid {
    grid-template-columns: 1fr;
  }
}
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-col {
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.24);
  background: rgba(15, 23, 42, 0.72);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-col.is-put {
  border-left: 4px solid #fb7185;
}
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-col.is-call {
  border-left: 4px solid #34d399;
}
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-col.is-warn {
  border-left: 4px solid #f5b73b;
}
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-step {
  font-family: var(--font-head);
  font-size: 0.74rem;
  font-weight: 800;
  color: #fde68a;
}
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-col b {
  font-family: var(--font-head);
  font-size: 0.94rem;
  font-weight: 800;
  color: #f8fafc;
}
html body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-col p {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.52;
  color: #cbd5e1;
}

/* Light mode for .rv-sweep-playbook */
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-playbook {
  background: #ffffff !important;
  border-color: rgba(217, 119, 6, 0.36) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-col {
  background: #f8fafc !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-step {
  color: #b45309 !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-col b {
  color: #0f172a !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-review .rv-sweep-col p {
  color: #334155 !important;
}

/* ==========================================================================
   V258: Standalone Top Radar Bar (#dteGlobalAlertBar Outside .dte-opening)
   + Unboxed Inline Status & 2-Row Split + Single-Family D1/L1 Toggle Buttons
   (Retiring Unapproved 3-Stop Green-Teal-Blue Gradient)
   ========================================================================== */
html body:not(#akx) #main:not(#aky) header.dte-head .dte-global-alert-bar,
html body:not(#akx) #main:not(#aky) .dte-global-alert-bar {
  box-sizing: border-box !important;
  max-width: 1360px !important;
  width: 100% !important;
  margin: 0 auto 14px !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 12px 20px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(96, 165, 250, 0.34) !important;
  background: linear-gradient(165deg, #060d1a 0%, #071222 52%, #05131c 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 14px 32px -18px rgba(2, 6, 23, 0.85) !important;
}
html body:not(#akx) #main:not(#aky) .dgab-main-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  width: 100%;
}
html body:not(#akx) #main:not(#aky) .dgab-left {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  min-width: 0;
}
html body:not(#akx) #main:not(#aky) .dgab-title {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--aku-font-head);
  font-size: 0.90rem;
  font-weight: 800;
  color: rgb(248, 250, 252);
  white-space: nowrap;
}
/* Unboxed inline status text — zero nested box-in-box inside #dteGlobalAlertBar */
html body:not(#akx) #main:not(#aky) .dgab-status {
  display: inline-flex;
  align-items: center;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 0.81rem;
  font-weight: 700;
  color: rgb(110, 231, 183);
}
html body:not(#akx) #main:not(#aky) .dgab-status.is-off {
  background: transparent !important;
  border: 0 !important;
  color: rgb(148, 163, 184);
}
html body:not(#akx) #main:not(#aky) .dgab-status.is-firing.is-bull {
  background: transparent !important;
  border: 0 !important;
  color: rgb(110, 231, 183);
}
html body:not(#akx) #main:not(#aky) .dgab-status.is-firing.is-bear {
  background: transparent !important;
  border: 0 !important;
  color: rgb(253, 164, 175);
}
html body:not(#akx) #main:not(#aky) .dgab-status.is-firing.is-warn {
  background: transparent !important;
  border: 0 !important;
  color: rgb(253, 224, 71);
}
html body:not(#akx) #main:not(#aky) .dgab-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
html body:not(#akx) #main:not(#aky) .dgab-test-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  width: 100%;
  padding: 8px 0 0 !important;
  border-left: 0 !important;
  border-top: 1px solid rgba(96, 165, 250, 0.20);
}
html body:not(#akx) #main:not(#aky) .dgab-test-kicker {
  font-family: var(--aku-font-body);
  font-size: 0.76rem;
  font-weight: 700;
  color: rgb(148, 163, 184);
  white-space: nowrap;
}
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control::after,
html body .ch-push-toast-host .aku-control::after,
html body .dte-signal-drawer-tab.aku-control::after {
  display: none !important;
}
/* V237 Single-Family D1 Dark Mode Toggle Buttons (Off = Deep Navy; On = Clean Deep Emerald, Zero 3-Stop Rainbow) */
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav,
html body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-body);
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  cursor: pointer;
  border: 1px solid rgba(148, 163, 184, 0.38) !important;
  background: linear-gradient(180deg, rgb(13, 31, 56) 0%, rgb(8, 21, 38) 100%) !important;
  color: rgb(203, 213, 225) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav:hover,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav:hover,
html body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn:hover,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(125, 211, 252, 0.75) !important;
  color: rgb(255, 255, 255) !important;
}
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav.is-on,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav.is-on,
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav.is-sound-on,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav.is-sound-on,
html body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn.is-on,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn.is-on,
html body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn.is-sound-on,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn.is-sound-on {
  background: linear-gradient(180deg, rgb(8, 51, 38) 0%, rgb(5, 34, 25) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.65) !important;
  color: rgb(236, 253, 245) !important;
  box-shadow: inset 0 1px 0 rgba(110, 231, 183, 0.18), 0 4px 12px -4px rgba(16, 185, 129, 0.25) !important;
}
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--quiet {
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 6px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  color: rgb(186, 230, 253) !important;
}
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--quiet:hover {
  color: rgb(255, 255, 255) !important;
  text-decoration: underline;
}
/* Unboxed Underline Filter Triggers in #dteGlobalAlertBar (buttons.md § Filter-frame retirement) */
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter {
  --f-tone: rgb(56, 189, 248);
  height: 28px !important;
  min-height: 28px !important;
  padding: 2px 6px 4px !important;
  border: 0 !important;
  border-bottom: 2px solid color-mix(in srgb, var(--f-tone) 55%, transparent) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  color: var(--f-tone) !important;
  gap: 5px !important;
}
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-news { --f-tone: rgb(196, 181, 253); }
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-setup { --f-tone: rgb(110, 231, 183); }
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-ind { --f-tone: rgb(125, 211, 252); }
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-warn { --f-tone: rgb(253, 164, 175); }
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-all { --f-tone: rgb(251, 191, 36); }
html body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter:hover {
  border-bottom-color: var(--f-tone) !important;
  background: radial-gradient(65% 90% at 50% 100%, color-mix(in srgb, var(--f-tone) 22%, transparent), transparent 82%) !important;
  color: rgb(255, 255, 255) !important;
}

/* ==========================================================================
   V259: Bottom-Right Signal & News Drawer (#dteSignalDrawerTab + #chPushToastHost.is-signal-sidebar)
   + Suppress #ak-quick-dock on 0dte-setup.html (Use Main Hub Tabs for Bug Dock)
   + Zero Scrollbar + Collection Filter/Sort Bar + Single-Family D1/L1 & A+ Buttons
   ========================================================================== */
html body #ak-quick-dock {
  display: none !important;
  pointer-events: none !important;
}
html body .dte-signal-drawer-tab[hidden] {
  display: none !important;
  pointer-events: none !important;
}
html body .dte-signal-drawer-tab {
  appearance: none;
  position: fixed !important;
  top: auto !important;
  bottom: 14px !important;
  right: 14px !important;
  left: auto !important;
  z-index: 99998;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  border: 1.5px solid rgba(52, 211, 153, 0.72) !important;
  background: linear-gradient(180deg, rgb(8, 51, 38) 0%, rgb(5, 34, 25) 100%) !important;
  color: rgb(236, 253, 245) !important;
  font-family: var(--aku-font-head);
  font-size: 0.78rem !important;
  font-weight: 800 !important;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 10px 26px -6px rgba(2, 6, 23, 0.82) !important;
  transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}
html body .dte-signal-drawer-tab:hover {
  transform: translateY(-2px);
  border-color: rgb(110, 231, 183) !important;
}
html body .dte-signal-drawer-tab .dsdt-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgb(167, 243, 208);
  box-shadow: 0 0 8px rgba(167, 243, 208, 0.9);
}
html body .dte-signal-drawer-tab .dsdt-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  font-size: 0.72rem;
  background: rgba(6, 78, 59, 0.75);
  border: 1px solid rgb(167, 243, 208);
  color: rgb(240, 253, 244);
}
html body .dte-signal-drawer-tab .dsdt-arr {
  font-size: 0.72rem;
  color: rgb(209, 250, 229);
}

/* Outer Sidebar Stage: D1 Deep Obsidian Navy in Dark Mode (Anchored Bottom-Right) */
html body .ch-push-toast-host.is-signal-sidebar {
  box-sizing: border-box !important;
  position: fixed !important;
  top: auto !important;
  right: 14px !important;
  bottom: 14px !important;
  left: auto !important;
  width: 368px !important;
  max-width: calc(100vw - 24px) !important;
  max-height: min(610px, calc(100vh - 90px)) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  padding: 8px 10px !important;
  border-radius: 18px !important;
  border: 1.5px solid rgba(96, 165, 250, 0.48) !important;
  background: linear-gradient(165deg, rgb(7, 17, 32) 0%, rgb(9, 23, 43) 58%, rgb(7, 25, 35) 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 20px 48px -12px rgba(2, 6, 23, 0.88) !important;
  overflow: hidden !important;
  scrollbar-width: none !important;
  pointer-events: auto !important;
  z-index: 99999;
  transform-origin: bottom right;
  transition: transform 0.24s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.2s ease;
}
html body .ch-push-toast-host.is-signal-sidebar.is-sidebar-collapsed {
  transform: translateY(calc(100% + 24px)) scale(0.96) !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
html body .ch-push-toast-host .cpt-sidebar-head {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(96, 165, 250, 0.26);
  flex-shrink: 0;
  pointer-events: auto !important;
}
html body .ch-push-toast-host .csh-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
html body .ch-push-toast-host .csh-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--aku-font-head);
  font-size: 0.85rem;
  font-weight: 800;
  color: rgb(240, 249, 255);
}
html body .ch-push-toast-host .csh-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgb(52, 211, 153);
  box-shadow: 0 0 8px rgba(52, 211, 153, 0.88);
}
html body .ch-push-toast-host .csh-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 19px;
  padding: 0 6px;
  border-radius: 999px;
  font-family: var(--aku-font-mono);
  font-size: 0.72rem;
  font-weight: 800;
  background: rgba(13, 148, 136, 0.36);
  border: 1px solid rgba(52, 211, 153, 0.72);
  color: rgb(209, 250, 229);
}
/* V11 Opaque Sapphire Control for พับเก็บ ▸ (Zero Navy-on-Navy Camouflage) */
html body .ch-push-toast-host .csh-collapse-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  font-family: var(--aku-font-body);
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  cursor: pointer;
  border: 1.5px solid rgba(125, 211, 252, 0.65) !important;
  background: linear-gradient(145deg, rgb(20, 48, 88) 0%, rgb(12, 31, 58) 100%) !important;
  color: rgb(240, 249, 255) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 2px 0 rgb(4, 12, 24) !important;
}
html body .ch-push-toast-host .csh-collapse-btn:hover {
  border-color: rgb(251, 191, 36) !important;
  color: rgb(255, 255, 255) !important;
}

/* Collection Filter & Sort Toolbar Inside Sidebar (SKILL.md §1.3 & §3b.15) */
html body .ch-push-toast-host .cpt-sidebar-toolbar {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
html body .ch-push-toast-host .cpt-filter-bar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 2px;
}
html body .ch-push-toast-host .cpt-filter-btn {
  --f-tone: rgb(125, 211, 252);
  height: 25px !important;
  min-height: 25px !important;
  padding: 1px 5px 3px !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-family: var(--aku-font-body);
  font-size: 0.69rem !important;
  font-weight: 700 !important;
  color: rgb(186, 230, 253) !important;
  gap: 4px !important;
  cursor: pointer;
}
html body .ch-push-toast-host .cpt-filter-btn.is-all { --f-tone: rgb(251, 191, 36); }
html body .ch-push-toast-host .cpt-filter-btn.is-setup { --f-tone: rgb(52, 211, 153); }
html body .ch-push-toast-host .cpt-filter-btn.is-indicator { --f-tone: rgb(56, 189, 248); }
html body .ch-push-toast-host .cpt-filter-btn.is-news { --f-tone: rgb(196, 181, 253); }
html body .ch-push-toast-host .cpt-filter-btn.is-warning { --f-tone: rgb(251, 113, 133); }
html body .ch-push-toast-host .cpt-filter-btn:hover,
html body .ch-push-toast-host .cpt-filter-btn[aria-pressed="true"],
html body .ch-push-toast-host .cpt-filter-btn.is-active {
  color: var(--f-tone) !important;
  border-bottom-color: var(--f-tone) !important;
  background: radial-gradient(65% 90% at 50% 100%, color-mix(in srgb, var(--f-tone) 24%, transparent), transparent 82%) !important;
}
html body .ch-push-toast-host .cpt-sort-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}
html body .ch-push-toast-host .cpt-filter-status {
  font-size: 0.68rem;
  font-weight: 700;
  color: rgb(147, 197, 253);
}
html body .ch-push-toast-host .cpt-sort-btn {
  height: 22px !important;
  min-height: 22px !important;
  padding: 0 4px !important;
  border: 0 !important;
  border-bottom: 1.5px solid rgba(56, 189, 248, 0.58) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 0.68rem !important;
  font-weight: 700 !important;
  color: rgb(224, 242, 254) !important;
  cursor: pointer;
}
html body .ch-push-toast-host .cpt-sort-btn:hover {
  color: rgb(251, 191, 36) !important;
  border-bottom-color: rgb(251, 191, 36) !important;
}
html body .ch-push-toast-host .cpt-empty-filter[hidden] {
  display: none !important;
}
html body .ch-push-toast-host .cpt-empty-filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px dashed rgba(125, 211, 252, 0.45);
  background: rgba(12, 31, 58, 0.65);
  font-size: 0.74rem;
  color: rgb(224, 242, 254);
}
html body .ch-push-toast-host .cpt-reset-filter-btn {
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 6px !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
  color: rgb(52, 211, 153) !important;
}

/* Zero Scrollbar Contract on Side Rail (SKILL.md §3.9 & INDEX.md row 78) */
html body .ch-push-toast-host .cpt-sidebar-list {
  box-sizing: border-box !important;
  display: flex;
  flex-direction: column;
  gap: 5px;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  padding: 0 !important;
  flex: 1 1 auto;
  pointer-events: auto !important;
}
html body .ch-push-toast-host .cpt-sidebar-list::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
html body .ch-push-toast-host .ch-push-toast[hidden] {
  display: none !important;
}
html body .ch-push-toast-host .ch-push-toast {
  box-sizing: border-box !important;
  flex-shrink: 0 !important;
  justify-content: flex-start !important;
  gap: 3px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 6px 9px !important;
  overflow: hidden !important;
}
html body .ch-push-toast .cpt-app-bar {
  box-sizing: border-box !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
html body .ch-push-toast .cpt-bar-left {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
}
html body .ch-push-toast .cpt-bar-right {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
}
html body .ch-push-toast .cpt-side {
  padding: 1px 7px !important;
  border-radius: 999px !important;
  font-size: 0.65rem !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  min-width: 0 !important;
}
html body .ch-push-toast .cpt-time {
  margin: 0 !important;
  font-size: 0.65rem !important;
}
html body .ch-push-toast .cpt-close {
  width: 20px !important;
  height: 20px !important;
  font-size: 0.68rem !important;
  background: rgba(15, 23, 42, 0.55) !important;
  border: 1px solid rgba(148, 163, 184, 0.42) !important;
  color: rgb(241, 245, 249) !important;
}
html body .ch-push-toast .cpt-close:hover {
  background: rgb(225, 29, 72) !important;
  border-color: rgb(253, 164, 175) !important;
  color: rgb(255, 255, 255) !important;
}
html body .ch-push-toast .cpt-title {
  font-size: 0.76rem !important;
  line-height: 1.24 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
html body .ch-push-toast .cpt-sub {
  font-size: 0.69rem !important;
  line-height: 1.22 !important;
  margin-top: 1px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Canonical Single-Family Capsule Disclosure (Zero 3-Stop Rainbow Gradient) */
html body .ch-push-toast .cpt-detail-fold {
  margin-top: 2px;
}
html body .ch-push-toast .cpt-detail-sum {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.68rem;
  font-weight: 800;
  cursor: pointer;
  user-select: none;
  background: linear-gradient(180deg, rgb(13, 31, 56) 0%, rgb(8, 21, 38) 100%);
  border: 1px solid rgba(96, 165, 250, 0.45);
  color: rgb(224, 242, 254);
}
html body .ch-push-toast .cpt-detail-sum::-webkit-details-marker {
  display: none;
}
html body .ch-push-toast .cpt-detail-sum .cds-left {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}
html body .ch-push-toast .cpt-detail-sum .cds-pill {
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  border-radius: 999px;
  font-size: 0.64rem;
  font-weight: 800;
  background: rgba(13, 148, 136, 0.38);
  border: 1px solid rgba(52, 211, 153, 0.65);
  color: rgb(209, 250, 229);
  flex-shrink: 0;
}
html body .ch-push-toast .cpt-detail-fold:not([open]) .cds-close-txt {
  display: none;
}
html body .ch-push-toast .cpt-detail-fold[open] .cds-open-txt {
  display: none;
}
html body .ch-push-toast .cpt-detail-body {
  margin-top: 5px;
}
html body .ch-push-toast .cpt-desc {
  font-size: 0.71rem !important;
  line-height: 1.34 !important;
  margin-top: 4px !important;
}

/* Footer with Canonical A+ (.aku-cta.aku-cta--take) Button */
html body .ch-push-toast .cpt-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin-top: 2px !important;
  padding-top: 3px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.22);
}
html body .ch-push-toast .cpt-foot-pin {
  font-size: 0.65rem;
  font-weight: 700;
  color: rgb(186, 230, 253);
  white-space: nowrap;
}
html body .ch-push-toast .aku-cta.aku-cta--take.cpt-action-btn:not(#aku1):not(#aku2):not(#aku3) {
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 4px 0 6px !important;
  font-size: 0.70rem !important;
  gap: 5px !important;
}
html body .ch-push-toast .aku-cta.cpt-action-btn .aku-cta-ic {
  width: 19px !important;
  height: 19px !important;
  margin-left: -2px !important;
}
html body .ch-push-toast .aku-cta.cpt-action-btn .aku-cta-ar {
  width: 19px !important;
  height: 19px !important;
  font-size: 0.70rem !important;
}

@media (max-width: 640px) {
  html body .dte-signal-drawer-tab {
    bottom: 12px !important;
    right: 10px !important;
  }
  html body .ch-push-toast-host.is-signal-sidebar {
    top: auto !important;
    bottom: 12px !important;
    right: 8px !important;
    left: 8px !important;
    width: auto !important;
    max-height: 64vh !important;
    border-radius: 16px !important;
    border-right: 1.5px solid rgba(96, 165, 250, 0.48) !important;
  }
}

/* Shared Archetype Tag in Header */
html body .ch-push-toast .cpt-arch-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  border-radius: 6px;
  font-family: var(--aku-font-head);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  white-space: nowrap;
  flex-shrink: 0;
}
html body .ch-push-toast .cpt-live-dot {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: rgb(244, 63, 94);
  box-shadow: 0 0 8px rgba(244, 63, 94, 0.9);
  animation: akPulseDot 1.3s infinite ease-in-out;
}
@keyframes akPulseDot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.45; transform: scale(0.82); }
}

/* 1. ARCHETYPE 1: 📰 ข่าวประกาศสำคัญ (.cpt--news) — D1 Deep Gem Royal-Indigo + Box-Matched Lavender Sub-Text */
html body .ch-push-toast.cpt--news {
  background: linear-gradient(145deg, rgb(34, 23, 74) 0%, rgb(19, 12, 46) 100%) !important;
  border: 1.5px solid rgba(167, 139, 250, 0.74) !important;
  border-left: 5px solid rgb(139, 92, 246) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 10px 24px -10px rgba(88, 28, 135, 0.55) !important;
}
html body .ch-push-toast.cpt--news .cpt-title { color: rgb(245, 243, 255) !important; }
html body .ch-push-toast.cpt--news .cpt-sub,
html body .ch-push-toast.cpt--news .cpt-foot-pin { color: rgb(221, 214, 254) !important; }
html body .ch-push-toast.cpt--news .cpt-arch-tag.is-news {
  background: rgba(109, 40, 217, 0.48);
  border: 1px solid rgba(196, 181, 253, 0.72);
  color: rgb(243, 232, 255);
}
html body .ch-push-toast.cpt--news .cpt-side {
  background: rgba(139, 92, 246, 0.28) !important;
  border: 1px solid rgba(196, 181, 253, 0.65) !important;
  color: rgb(237, 233, 254) !important;
}
html body .ch-push-toast .cpt-viz-news {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  margin-top: 6px;
  padding: 7px;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.76);
  border: 1px solid rgba(167, 139, 250, 0.42);
}
html body .ch-push-toast .cpt-viz-news .cvn-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 3px 5px;
  border-right: 1px solid rgba(148, 163, 184, 0.22);
}
html body .ch-push-toast .cpt-viz-news .cvn-cell:last-child { border-right: 0; }
html body .ch-push-toast .cpt-viz-news .cvn-k {
  font-size: 0.66rem;
  font-weight: 700;
  color: rgb(196, 181, 253);
}
html body .ch-push-toast .cpt-viz-news .cvn-v {
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.26;
  color: rgb(248, 250, 252);
}

/* 2. ARCHETYPE 2: 🎯 เข้า Setup ทำกำไร (.cpt--setup) — D1 Deep Gem Emerald + Box-Matched Mint Sub-Text */
html body .ch-push-toast.cpt--setup {
  background: linear-gradient(145deg, rgb(8, 51, 38) 0%, rgb(5, 34, 25) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.76) !important;
  border-top: 4px solid rgb(16, 185, 129) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 10px 24px -10px rgba(6, 95, 70, 0.55) !important;
}
html body .ch-push-toast.cpt--setup .cpt-title { color: rgb(236, 253, 245) !important; }
html body .ch-push-toast.cpt--setup .cpt-sub,
html body .ch-push-toast.cpt--setup .cpt-foot-pin { color: rgb(167, 243, 208) !important; }
html body .ch-push-toast.cpt--setup .cpt-arch-tag.is-setup {
  background: rgba(6, 95, 70, 0.68);
  border: 1px solid rgba(52, 211, 153, 0.78);
  color: rgb(209, 250, 229);
}
html body .ch-push-toast.cpt--setup .cpt-side {
  background: rgba(16, 185, 129, 0.25) !important;
  border: 1px solid rgba(110, 231, 183, 0.68) !important;
  color: rgb(209, 250, 229) !important;
}
html body .ch-push-toast .cpt-viz-setup {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: stretch;
  gap: 5px;
  margin-top: 6px;
  padding: 7px;
  border-radius: 10px;
  background: rgba(4, 24, 19, 0.78);
  border: 1px dashed rgba(52, 211, 153, 0.55);
}
html body .ch-push-toast .cpt-viz-setup .cvs-step {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
html body .ch-push-toast .cpt-viz-setup .cvs-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.76rem;
  font-weight: 900;
  color: rgb(52, 211, 153);
}
html body .ch-push-toast .cpt-viz-setup .cvs-k {
  font-size: 0.66rem;
  font-weight: 700;
  color: rgb(110, 231, 183);
}
html body .ch-push-toast .cpt-viz-setup .cvs-v {
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.26;
  color: rgb(240, 253, 244);
}

/* 3. ARCHETYPE 3: 📊 Indicator เตรียมเข้า/ออก (.cpt--indicator) — D1 Deep Gem Sapphire + Box-Matched Sky Sub-Text */
html body .ch-push-toast.cpt--indicator {
  background: linear-gradient(145deg, rgb(12, 40, 71) 0%, rgb(7, 26, 48) 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.76) !important;
  border-left: 5px solid rgb(14, 165, 233) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 10px 24px -10px rgba(3, 105, 161, 0.55) !important;
}
html body .ch-push-toast.cpt--indicator .cpt-title { color: rgb(240, 249, 255) !important; }
html body .ch-push-toast.cpt--indicator .cpt-sub,
html body .ch-push-toast.cpt--indicator .cpt-foot-pin { color: rgb(186, 230, 253) !important; }
html body .ch-push-toast.cpt--indicator .cpt-arch-tag.is-indicator {
  background: rgba(3, 105, 161, 0.56);
  border: 1px solid rgba(125, 211, 252, 0.76);
  color: rgb(224, 242, 254);
}
html body .ch-push-toast.cpt--indicator .cpt-side {
  background: rgba(14, 165, 233, 0.25) !important;
  border: 1px solid rgba(125, 211, 252, 0.68) !important;
  color: rgb(224, 242, 254) !important;
}
html body .ch-push-toast .cpt-viz-gauge {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: 6px;
  padding: 7px 9px;
  border-radius: 10px;
  background: rgba(7, 19, 36, 0.8);
  border: 1px solid rgba(56, 189, 248, 0.42);
}
html body .ch-push-toast .cpt-viz-gauge .cvg-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  font-size: 0.69rem;
  color: rgb(186, 230, 253);
}
html body .ch-push-toast .cpt-viz-gauge .cvg-now {
  font-size: 0.72rem;
  font-weight: 800;
  color: rgb(110, 231, 183);
}
html body .ch-push-toast .cpt-viz-gauge .cvg-track {
  position: relative;
  height: 8px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.95);
  border: 1px solid rgba(125, 211, 252, 0.36);
  overflow: visible;
}
html body .ch-push-toast .cpt-viz-gauge .cvg-fill {
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, rgb(14, 165, 233) 0%, rgb(16, 185, 129) 70%, rgb(52, 211, 153) 100%);
}
html body .ch-push-toast .cpt-viz-gauge .cvg-dot {
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: rgb(167, 243, 208);
  border: 2px solid rgb(7, 19, 36);
  box-shadow: 0 0 8px rgba(52, 211, 153, 0.95);
  transform: translate(-50%, -50%);
}
html body .ch-push-toast .cpt-viz-gauge .cvg-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
html body .ch-push-toast .cpt-viz-gauge .cvg-chip {
  font-size: 0.69rem;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 6px;
  background: rgba(15, 32, 58, 0.88);
  color: rgb(224, 242, 254);
}
html body .ch-push-toast .cpt-viz-gauge .cvg-chip.is-act {
  background: rgba(6, 95, 70, 0.58);
  border: 1px solid rgba(52, 211, 153, 0.58);
  color: rgb(209, 250, 229);
}

/* 4. ARCHETYPE 4: ⚠️ เตือนระวังภัย (.cpt--warning) — D1 Deep Gem Coral-Crimson + Box-Matched Rose Sub-Text */
html body .ch-push-toast.cpt--warning {
  background: linear-gradient(145deg, rgb(59, 16, 34) 0%, rgb(35, 9, 20) 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.76) !important;
  border-left: 5px solid rgb(244, 63, 94) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 10px 24px -10px rgba(159, 18, 57, 0.55) !important;
}
html body .ch-push-toast.cpt--warning .cpt-title { color: rgb(255, 241, 242) !important; }
html body .ch-push-toast.cpt--warning .cpt-sub,
html body .ch-push-toast.cpt--warning .cpt-foot-pin { color: rgb(254, 205, 211) !important; }
html body .ch-push-toast .cpt-hazard-stripe {
  height: 4px;
  width: auto !important;
  margin: -6px -9px 3px -9px !important;
  background: repeating-linear-gradient(
    -45deg,
    rgba(251, 191, 36, 0.92) 0px,
    rgba(251, 191, 36, 0.92) 9px,
    rgba(15, 23, 42, 0.95) 9px,
    rgba(15, 23, 42, 0.95) 18px
  );
  border-bottom: 1px solid rgba(251, 191, 36, 0.55);
}
html body .ch-push-toast.cpt--warning .cpt-arch-tag.is-warning {
  background: rgba(190, 18, 60, 0.58);
  border: 1px solid rgba(253, 164, 175, 0.78);
  color: rgb(255, 228, 230);
}
html body .ch-push-toast.cpt--warning .cpt-side {
  background: rgba(244, 63, 94, 0.25) !important;
  border: 1px solid rgba(253, 164, 175, 0.68) !important;
  color: rgb(255, 228, 230) !important;
}
html body .ch-push-toast .cpt-viz-hazard {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
  margin-top: 6px;
}
html body .ch-push-toast .cpt-viz-hazard .cvh-box {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 5px 7px;
  border-radius: 9px;
}
html body .ch-push-toast .cpt-viz-hazard .cvh-box.is-dont {
  background: rgba(136, 19, 55, 0.52);
  border: 1px solid rgba(251, 113, 133, 0.6);
}
html body .ch-push-toast .cpt-viz-hazard .cvh-box.is-do {
  background: rgba(6, 78, 59, 0.52);
  border: 1px solid rgba(52, 211, 153, 0.6);
}
html body .ch-push-toast .cpt-viz-hazard .cvh-k {
  font-size: 0.66rem;
  font-weight: 800;
}
html body .ch-push-toast .cpt-viz-hazard .cvh-box.is-dont .cvh-k { color: rgb(254, 205, 211); }
html body .ch-push-toast .cpt-viz-hazard .cvh-box.is-do .cvh-k { color: rgb(167, 243, 208); }
html body .ch-push-toast .cpt-viz-hazard .cvh-v {
  font-size: 0.71rem;
  font-weight: 800;
  line-height: 1.26;
  color: rgb(248, 250, 252);
}

/* ==========================================================================
   ☀️ L1 Light Mode (Standalone Top Radar Bar + Unboxed Status + Single-Family L1 Buttons)
   ========================================================================== */
html[data-theme="light"] body:not(#akx) #main:not(#aky) header.dte-head .dte-global-alert-bar,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dte-global-alert-bar {
  background: linear-gradient(165deg, #ffffff 0%, #f6faff 54%, #eefbf5 100%) !important;
  border: 1px solid rgba(59, 130, 246, 0.28) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.96), 0 12px 28px -18px rgba(15, 23, 42, 0.14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-title {
  color: rgb(15, 41, 66) !important;
}
/* Unboxed inline status text in Light Mode */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-status {
  background: transparent !important;
  border: 0 !important;
  color: rgb(6, 95, 70) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-status.is-off {
  background: transparent !important;
  border: 0 !important;
  color: rgb(71, 85, 105) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-status.is-firing.is-bull {
  background: transparent !important;
  border: 0 !important;
  color: rgb(6, 78, 59) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-status.is-firing.is-bear {
  background: transparent !important;
  border: 0 !important;
  color: rgb(159, 18, 57) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-status.is-firing.is-warn {
  background: transparent !important;
  border: 0 !important;
  color: rgb(146, 64, 14) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-test-group {
  border-top-color: rgba(59, 130, 246, 0.22);
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-test-kicker {
  color: rgb(71, 85, 105) !important;
}
/* V237 Single-Family L1 Light Mode Toggle Buttons (Off = Pure White; On = Soft Mint-Emerald, Zero 3-Stop Rainbow) */
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(242, 248, 255) 100%) !important;
  border: 1px solid rgba(100, 116, 139, 0.36) !important;
  color: rgb(51, 65, 85) !important;
  box-shadow: 0 2px 6px -2px rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav:hover,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn:hover {
  border-color: rgba(37, 99, 235, 0.55) !important;
  color: rgb(15, 41, 66) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav.is-on,
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--nav.is-sound-on,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn.is-on,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-chart .ch-alert-btn.is-sound-on {
  background: linear-gradient(180deg, rgb(220, 252, 231) 0%, rgb(187, 247, 208) 100%) !important;
  border: 1.5px solid rgba(16, 185, 129, 0.55) !important;
  color: rgb(6, 78, 59) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 2px 8px -2px rgba(16, 185, 129, 0.16) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--quiet {
  color: rgb(3, 105, 161) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-news { --f-tone: rgb(109, 40, 217); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-setup { --f-tone: rgb(5, 150, 105); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-ind { --f-tone: rgb(2, 132, 199); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-warn { --f-tone: rgb(225, 29, 72); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter.is-test-all { --f-tone: rgb(180, 83, 9); }
html[data-theme="light"] body:not(#akx) #main:not(#aky) .dgab-btn.aku-control--filter:hover {
  color: var(--f-tone) !important;
}

/* L1 Light Mode Sidebar Stage & Controls (Single-Family Soft Mint-Emerald Launcher Tab) */
html[data-theme="light"] body .dte-signal-drawer-tab {
  background: linear-gradient(180deg, rgb(220, 252, 231) 0%, rgb(187, 247, 208) 100%) !important;
  border-color: rgba(16, 185, 129, 0.55) !important;
  color: rgb(6, 78, 59) !important;
  box-shadow: -4px 8px 20px -6px rgba(15, 23, 42, 0.18) !important;
}
html[data-theme="light"] body .dte-signal-drawer-tab .dsdt-dot {
  background: rgb(5, 150, 105);
}
html[data-theme="light"] body .dte-signal-drawer-tab .dsdt-count {
  background: rgb(255, 255, 255);
  border-color: rgb(5, 150, 105);
  color: rgb(6, 78, 59);
}
html[data-theme="light"] body .dte-signal-drawer-tab .dsdt-arr {
  color: rgb(6, 78, 59);
}
html[data-theme="light"] body .ch-push-toast-host.is-signal-sidebar {
  background: linear-gradient(165deg, #ffffff 0%, #f6faff 54%, #eefbf5 100%) !important;
  border-color: rgba(59, 130, 246, 0.36) !important;
  box-shadow: -12px 16px 36px -12px rgba(15, 23, 42, 0.22) !important;
}
html[data-theme="light"] body .ch-push-toast-host .cpt-sidebar-head {
  border-bottom-color: rgba(59, 130, 246, 0.24);
}
html[data-theme="light"] body .ch-push-toast-host .csh-title {
  color: rgb(15, 41, 66);
}
html[data-theme="light"] body .ch-push-toast-host .csh-count {
  background: rgb(255, 255, 255);
  border-color: rgb(5, 150, 105);
  color: rgb(6, 95, 70);
}
html[data-theme="light"] body .ch-push-toast-host .csh-collapse-btn {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(242, 248, 255) 100%) !important;
  border-color: rgba(100, 116, 139, 0.36) !important;
  color: rgb(51, 65, 85) !important;
  box-shadow: 0 2px 6px -2px rgba(15, 23, 42, 0.06) !important;
}
html[data-theme="light"] body .ch-push-toast-host .cpt-filter-btn {
  color: rgb(51, 65, 85) !important;
}
html[data-theme="light"] body .ch-push-toast-host .cpt-filter-btn.is-all { --f-tone: rgb(3, 105, 161); }
html[data-theme="light"] body .ch-push-toast-host .cpt-filter-btn.is-setup { --f-tone: rgb(5, 150, 105); }
html[data-theme="light"] body .ch-push-toast-host .cpt-filter-btn.is-indicator { --f-tone: rgb(2, 132, 199); }
html[data-theme="light"] body .ch-push-toast-host .cpt-filter-btn.is-news { --f-tone: rgb(109, 40, 217); }
html[data-theme="light"] body .ch-push-toast-host .cpt-filter-btn.is-warning { --f-tone: rgb(225, 29, 72); }
html[data-theme="light"] body .ch-push-toast-host .cpt-filter-status {
  color: rgb(3, 105, 161);
}
html[data-theme="light"] body .ch-push-toast-host .cpt-sort-btn {
  color: rgb(15, 41, 66) !important;
  border-bottom-color: rgba(2, 132, 199, 0.58) !important;
}
html[data-theme="light"] body .ch-push-toast-host .cpt-empty-filter {
  background: rgb(255, 255, 255);
  border-color: rgba(14, 165, 233, 0.45);
  color: rgb(15, 41, 66);
}
html[data-theme="light"] body .ch-push-toast .cpt-detail-sum {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(242, 248, 255) 100%);
  border-color: rgba(59, 130, 246, 0.36);
  color: rgb(12, 74, 110);
}
html[data-theme="light"] body .ch-push-toast .cpt-detail-sum .cds-pill {
  background: rgb(255, 255, 255);
  border-color: rgba(5, 150, 105, 0.55);
  color: rgb(6, 95, 70);
}
html[data-theme="light"] body .ch-push-toast .cpt-close {
  background: rgb(241, 245, 249) !important;
  border-color: rgb(148, 163, 184) !important;
  color: rgb(30, 41, 59) !important;
}

/* L1 Light Mode 4 Archetype Cards (Pure Crisp White + Medium-Pastel Sub-Boxes + Box-Matched Sub-Text) */
html[data-theme="light"] body .ch-push-toast.cpt--news {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(245, 243, 255) 100%) !important;
  border-color: rgba(124, 58, 237, 0.58) !important;
  border-left: 5px solid rgb(109, 40, 217) !important;
  box-shadow: 0 8px 20px -10px rgba(109, 40, 217, 0.18) !important;
}
html[data-theme="light"] body .ch-push-toast.cpt--news .cpt-title { color: rgb(46, 16, 101) !important; }
html[data-theme="light"] body .ch-push-toast.cpt--news .cpt-sub,
html[data-theme="light"] body .ch-push-toast.cpt--news .cpt-foot-pin,
html[data-theme="light"] body .ch-push-toast.cpt--news .cpt-desc { color: rgb(91, 33, 182) !important; }
html[data-theme="light"] body .ch-push-toast.cpt--news .cpt-arch-tag.is-news {
  background: rgb(237, 233, 254);
  border-color: rgba(124, 58, 237, 0.65);
  color: rgb(76, 29, 149);
}
html[data-theme="light"] body .ch-push-toast.cpt--news .cpt-side {
  background: rgb(243, 232, 255) !important;
  border-color: rgba(124, 58, 237, 0.55) !important;
  color: rgb(91, 33, 182) !important;
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-news {
  background: rgb(245, 243, 255);
  border-color: rgba(139, 92, 246, 0.42);
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-news .cvn-k { color: rgb(91, 33, 182); }
html[data-theme="light"] body .ch-push-toast .cpt-viz-news .cvn-v { color: rgb(15, 23, 42); }

html[data-theme="light"] body .ch-push-toast.cpt--setup {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(236, 253, 245) 100%) !important;
  border-color: rgba(16, 185, 129, 0.62) !important;
  border-top: 4px solid rgb(5, 150, 105) !important;
  box-shadow: 0 8px 20px -10px rgba(5, 150, 105, 0.18) !important;
}
html[data-theme="light"] body .ch-push-toast.cpt--setup .cpt-title { color: rgb(5, 46, 22) !important; }
html[data-theme="light"] body .ch-push-toast.cpt--setup .cpt-sub,
html[data-theme="light"] body .ch-push-toast.cpt--setup .cpt-foot-pin,
html[data-theme="light"] body .ch-push-toast.cpt--setup .cpt-desc { color: rgb(6, 95, 70) !important; }
html[data-theme="light"] body .ch-push-toast.cpt--setup .cpt-arch-tag.is-setup {
  background: rgb(187, 247, 208);
  border-color: rgba(5, 150, 105, 0.65);
  color: rgb(6, 78, 59);
}
html[data-theme="light"] body .ch-push-toast.cpt--setup .cpt-side {
  background: rgb(209, 250, 229) !important;
  border-color: rgba(5, 150, 105, 0.55) !important;
  color: rgb(6, 95, 70) !important;
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-setup {
  background: linear-gradient(145deg, rgb(187, 247, 208) 0%, rgb(220, 252, 231) 100%);
  border-color: rgba(5, 150, 105, 0.55);
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-setup .cvs-k { color: rgb(6, 95, 70); }
html[data-theme="light"] body .ch-push-toast .cpt-viz-setup .cvs-v { color: rgb(5, 46, 22); }
html[data-theme="light"] body .ch-push-toast .cpt-viz-setup .cvs-arrow { color: rgb(5, 150, 105); }

html[data-theme="light"] body .ch-push-toast.cpt--indicator {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(240, 249, 255) 100%) !important;
  border-color: rgba(14, 165, 233, 0.62) !important;
  border-left: 5px solid rgb(2, 132, 199) !important;
  box-shadow: 0 8px 20px -10px rgba(2, 132, 199, 0.18) !important;
}
html[data-theme="light"] body .ch-push-toast.cpt--indicator .cpt-title { color: rgb(12, 74, 110) !important; }
html[data-theme="light"] body .ch-push-toast.cpt--indicator .cpt-sub,
html[data-theme="light"] body .ch-push-toast.cpt--indicator .cpt-foot-pin,
html[data-theme="light"] body .ch-push-toast.cpt--indicator .cpt-desc { color: rgb(3, 105, 161) !important; }
html[data-theme="light"] body .ch-push-toast.cpt--indicator .cpt-arch-tag.is-indicator {
  background: rgb(224, 242, 254);
  border-color: rgba(2, 132, 199, 0.65);
  color: rgb(12, 74, 110);
}
html[data-theme="light"] body .ch-push-toast.cpt--indicator .cpt-side {
  background: rgb(219, 234, 254) !important;
  border-color: rgba(2, 132, 199, 0.55) !important;
  color: rgb(3, 105, 161) !important;
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-gauge {
  background: rgb(240, 249, 255);
  border-color: rgba(14, 165, 233, 0.42);
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-gauge .cvg-head { color: rgb(12, 74, 110); }
html[data-theme="light"] body .ch-push-toast .cpt-viz-gauge .cvg-now { color: rgb(5, 150, 105); }
html[data-theme="light"] body .ch-push-toast .cpt-viz-gauge .cvg-track {
  background: rgb(219, 234, 254);
  border-color: rgba(59, 130, 246, 0.32);
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-gauge .cvg-chip {
  background: rgb(255, 255, 255);
  border: 1px solid rgba(14, 165, 233, 0.32);
  color: rgb(12, 74, 110);
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-gauge .cvg-chip.is-act {
  background: rgb(209, 250, 229);
  border-color: rgba(5, 150, 105, 0.6);
  color: rgb(6, 78, 59);
}

html[data-theme="light"] body .ch-push-toast.cpt--warning {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(255, 241, 242) 100%) !important;
  border-color: rgba(244, 63, 94, 0.62) !important;
  border-left: 5px solid rgb(225, 29, 72) !important;
  box-shadow: 0 8px 20px -10px rgba(225, 29, 72, 0.18) !important;
}
html[data-theme="light"] body .ch-push-toast.cpt--warning .cpt-title { color: rgb(76, 5, 25) !important; }
html[data-theme="light"] body .ch-push-toast.cpt--warning .cpt-sub,
html[data-theme="light"] body .ch-push-toast.cpt--warning .cpt-foot-pin,
html[data-theme="light"] body .ch-push-toast.cpt--warning .cpt-desc { color: rgb(159, 18, 57) !important; }
html[data-theme="light"] body .ch-push-toast.cpt--warning .cpt-arch-tag.is-warning {
  background: rgb(254, 205, 211);
  border-color: rgba(225, 29, 72, 0.68);
  color: rgb(136, 19, 55);
}
html[data-theme="light"] body .ch-push-toast.cpt--warning .cpt-side {
  background: rgb(255, 228, 230) !important;
  border-color: rgba(225, 29, 72, 0.55) !important;
  color: rgb(159, 18, 57) !important;
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-hazard .cvh-box.is-dont {
  background: linear-gradient(145deg, rgb(254, 205, 211) 0%, rgb(255, 228, 230) 100%);
  border-color: rgba(225, 29, 72, 0.58);
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-hazard .cvh-box.is-do {
  background: linear-gradient(145deg, rgb(187, 247, 208) 0%, rgb(220, 252, 231) 100%);
  border-color: rgba(5, 150, 105, 0.58);
}
html[data-theme="light"] body .ch-push-toast .cpt-viz-hazard .cvh-box.is-dont .cvh-k { color: rgb(159, 18, 57); }
html[data-theme="light"] body .ch-push-toast .cpt-viz-hazard .cvh-box.is-do .cvh-k { color: rgb(6, 95, 70); }
html[data-theme="light"] body .ch-push-toast .cpt-viz-hazard .cvh-v { color: rgb(15, 23, 42); }


/* ==========================================================================
   V260 · AUDI TRANSACTION STUDIO & ASYMMETRIC MULTI-PASTE EVIDENCE COMPOSER
   Zone 1: Asymmetric Multi-Paste Chart Gallery (Hero #1 Left + #2..#N Right)
   Zone 2: Perforated 3-Stub Options Execution Ticket + AI Smart-Fill + Thesis
   Zone 3: Dedicated Verified Real Broker Slip Proof Vault + Fullscreen Lightbox
   ========================================================================== */
#modalBack .modal.is-trade-studio {
  max-width: 1060px !important;
  width: calc(100vw - 28px) !important;
  max-height: calc(100vh - 28px) !important;
  border-radius: 24px !important;
  background: linear-gradient(165deg, rgb(8, 19, 38) 0%, rgb(5, 12, 24) 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.38) !important;
  box-shadow: 0 28px 72px rgba(2, 6, 23, 0.78), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
#modalBack .modal.is-trade-studio .modal-head {
  padding: 16px 22px !important;
  background: linear-gradient(90deg, rgba(14, 34, 64, 0.95) 0%, rgba(8, 22, 42, 0.95) 100%) !important;
  border-bottom: 1px solid rgba(56, 189, 248, 0.25) !important;
  flex-shrink: 0 !important;
}
#modalBack .modal.is-trade-studio .modal-head h2 {
  font-size: 1.18rem !important;
  font-weight: 800 !important;
  color: rgb(248, 250, 252) !important;
  margin: 0 !important;
}
#modalBack .modal.is-trade-studio .modal-body {
  padding: 18px 22px 22px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  flex: 1 1 auto !important;
}
#modalBack .modal.is-trade-studio .modal-foot {
  padding: 12px 22px !important;
  background: rgba(6, 14, 28, 0.96) !important;
  border-top: 1px solid rgba(148, 163, 184, 0.22) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  flex-shrink: 0 !important;
}
.tc-foot-note {
  font-size: 0.82rem;
  font-weight: 600;
  color: rgb(148, 163, 184);
}
.tc-foot-btns {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.tc-studio-form,
.tc-studio-detail {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.tc-zone {
  border-radius: 20px;
  padding: 18px 20px;
  background: linear-gradient(165deg, rgb(11, 25, 48) 0%, rgb(7, 17, 34) 100%);
  border: 1px solid rgba(56, 189, 248, 0.28);
  box-shadow: 0 14px 32px -18px rgba(2, 6, 23, 0.65), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  position: relative;
}
.tc-gallery-zone {
  border-top: 3.5px solid rgb(56, 189, 248);
}
.tc-ticket-zone {
  border-top: 3.5px solid rgb(250, 204, 21);
  background: linear-gradient(165deg, rgb(12, 27, 50) 0%, rgb(8, 18, 36) 100%);
}
.tc-slip-vault {
  border-top: 3.5px solid rgb(16, 185, 129);
  background: linear-gradient(160deg, rgb(6, 36, 30) 0%, rgb(5, 22, 20) 100%);
  border: 1.5px dashed rgba(52, 211, 153, 0.55);
}

.tc-zone-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.tc-zone-title-wrap {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.tc-zone-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-head);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  color: rgb(125, 211, 252);
  text-transform: uppercase;
}
.tc-zone-kicker.is-slip-kicker {
  color: rgb(110, 231, 183);
}
.tc-zone-title-wrap h3 {
  margin: 0;
  font-family: var(--font-head);
  font-size: 1.05rem;
  font-weight: 800;
  color: rgb(248, 250, 252);
  line-height: 1.3;
}
.tc-zone-title-wrap p {
  margin: 0;
  font-size: 0.82rem;
  color: rgb(186, 204, 226);
  line-height: 1.4;
}
.tc-zone-title-wrap kbd {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 6px;
  font-family: var(--font-mono);
  font-size: 0.74rem;
  font-weight: 700;
  background: rgba(15, 23, 42, 0.85);
  border: 1px solid rgba(125, 211, 252, 0.45);
  color: rgb(224, 242, 254);
}
.tc-zone-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.tc-paste-target-btn,
.tc-demo-btn,
.tc-upload-pill,
.tc-live-fill-btn,
.tc-copy-ai-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
  background: linear-gradient(180deg, rgb(15, 34, 62) 0%, rgb(9, 22, 42) 100%);
  border: 1px solid rgba(148, 163, 184, 0.38);
  color: rgb(226, 232, 240);
  transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}
.tc-paste-target-btn:hover,
.tc-demo-btn:hover,
.tc-upload-pill:hover,
.tc-live-fill-btn:hover,
.tc-copy-ai-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(125, 211, 252, 0.75);
}
.tc-paste-target-btn.is-active {
  background: linear-gradient(180deg, rgb(8, 51, 38) 0%, rgb(5, 34, 25) 100%);
  border: 1.5px solid rgba(52, 211, 153, 0.72);
  color: rgb(236, 253, 245);
  box-shadow: 0 6px 16px -8px rgba(16, 185, 129, 0.45);
}
.tc-demo-btn {
  background: linear-gradient(180deg, rgb(30, 58, 108) 0%, rgb(18, 38, 76) 100%);
  border-color: rgba(96, 165, 250, 0.58);
  color: rgb(239, 246, 255);
}

/* ---------- Zone 1: Asymmetric Gallery (Hero #1 Left + Side Stack Right) ---------- */
.tc-asymmetric-gallery {
  display: grid;
  grid-template-columns: minmax(0, 1.72fr) minmax(260px, 0.98fr);
  gap: 14px;
  align-items: stretch;
}
.tc-gal-hero {
  border-radius: 16px;
  background: rgb(6, 13, 26);
  border: 1.5px solid rgba(56, 189, 248, 0.42);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-height: 292px;
}
.tc-gal-hero.is-empty {
  border-style: dashed;
  justify-content: center;
  align-items: center;
  padding: 24px 20px;
  text-align: center;
}
.tc-gal-empty-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  max-width: 48ch;
}
.tc-empty-ico {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(56, 189, 248, 0.14);
  border: 1px solid rgba(56, 189, 248, 0.4);
}
.tc-gal-empty-inner b {
  font-size: 0.96rem;
  color: rgb(248, 250, 252);
}
.tc-gal-empty-inner p {
  margin: 0;
  font-size: 0.82rem;
  color: rgb(176, 196, 222);
  line-height: 1.45;
}
.tc-empty-cta-row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 6px;
}

.tc-gal-hero-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  background: rgba(11, 24, 46, 0.92);
  border-bottom: 1px solid rgba(56, 189, 248, 0.25);
}
.tc-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 800;
  background: rgba(250, 204, 21, 0.18);
  border: 1px solid rgba(250, 204, 21, 0.55);
  color: rgb(254, 240, 138);
}
.tc-hero-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}
.tc-img-btn,
.tc-mini-btn {
  appearance: none;
  border: 1px solid rgba(148, 163, 184, 0.36);
  background: rgba(15, 23, 42, 0.88);
  color: rgb(226, 232, 240);
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 0.73rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.tc-img-btn.is-zoom:hover,
.tc-mini-btn:hover {
  background: rgba(14, 165, 233, 0.26);
  border-color: rgba(56, 189, 248, 0.72);
  color: rgb(240, 249, 255);
}
.tc-img-btn.is-del:hover,
.tc-mini-btn.is-del:hover {
  background: rgba(244, 63, 94, 0.28);
  border-color: rgba(251, 113, 133, 0.72);
  color: rgb(255, 228, 230);
}
.tc-gal-hero-stage {
  position: relative;
  appearance: none;
  border: 0;
  background: rgb(4, 10, 20);
  padding: 10px;
  width: 100%;
  flex: 1 1 auto;
  min-height: 255px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: zoom-in;
}
.tc-gal-hero-stage img {
  width: 100%;
  max-height: 310px;
  object-fit: contain;
  border-radius: 10px;
  display: block;
}
.tc-zoom-float-hint {
  position: absolute;
  bottom: 12px;
  right: 14px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  background: rgba(6, 14, 28, 0.88);
  border: 1px solid rgba(56, 189, 248, 0.48);
  color: rgb(186, 230, 253);
  pointer-events: none;
}

.tc-gal-side {
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: rgba(6, 14, 28, 0.68);
  border: 1px solid rgba(148, 163, 184, 0.24);
  border-radius: 16px;
  padding: 10px 12px;
}
.tc-gal-side-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px;
  flex-wrap: wrap;
}
.tc-gal-side-head span {
  font-family: var(--font-head);
  font-size: 0.8rem;
  font-weight: 800;
  color: rgb(226, 232, 240);
}
.tc-gal-side-head small {
  font-size: 0.71rem;
  color: rgb(148, 163, 184);
}
.tc-gal-side-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1 1 auto;
}
.tc-gal-thumb-card {
  border-radius: 12px;
  background: rgb(9, 20, 38);
  border: 1px solid rgba(96, 165, 250, 0.34);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.tc-thumb-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 5px 8px;
  background: rgba(15, 29, 54, 0.9);
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}
.tc-thumb-num {
  font-size: 0.72rem;
  font-weight: 800;
  color: rgb(186, 230, 253);
}
.tc-thumb-btns {
  display: flex;
  align-items: center;
  gap: 4px;
}
.tc-mini-btn {
  padding: 2px 7px;
  font-size: 0.68rem;
}
.tc-thumb-img-btn {
  appearance: none;
  border: 0;
  background: rgb(4, 10, 20);
  padding: 6px;
  width: 100%;
  cursor: zoom-in;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tc-thumb-img-btn img {
  width: 100%;
  height: 98px;
  object-fit: contain;
  border-radius: 7px;
  display: block;
}
.tc-gal-paste-slot {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(14, 32, 60, 0.55);
  border: 1.5px dashed rgba(56, 189, 248, 0.45);
  color: rgb(226, 232, 240);
  margin-top: auto;
  transition: background 0.16s ease, border-color 0.16s ease;
}
.tc-gal-paste-slot:hover {
  background: rgba(14, 165, 233, 0.16);
  border-color: rgb(56, 189, 248);
}
.tc-slot-plus {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(56, 189, 248, 0.2);
  border: 1px solid rgba(56, 189, 248, 0.55);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  flex-shrink: 0;
}
.tc-slot-txt {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.tc-slot-txt b {
  font-size: 0.78rem;
  color: rgb(240, 249, 255);
}
.tc-slot-txt small {
  font-size: 0.7rem;
  color: rgb(148, 163, 184);
}

/* ---------- Zone 2: AI Smart-Fill, Tactile Choice Deck & Perforated Boarding Pass ---------- */
.tc-ai-bar {
  border-radius: 16px;
  padding: 12px 14px;
  background: linear-gradient(135deg, rgb(14, 34, 66) 0%, rgb(9, 22, 44) 100%);
  border: 1px solid rgba(96, 165, 250, 0.42);
  margin-bottom: 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tc-ai-bar-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.tc-ai-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.78rem;
  font-weight: 800;
  color: rgb(186, 230, 253);
}
.tc-ai-sample-chip {
  appearance: none;
  border: 1px solid rgba(250, 204, 21, 0.5);
  background: rgba(250, 204, 21, 0.14);
  color: rgb(254, 240, 138);
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 0.73rem;
  font-weight: 700;
  cursor: pointer;
}
.tc-ai-sample-chip:hover {
  background: rgba(250, 204, 21, 0.24);
}
.tc-ai-bar-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.tc-ai-input {
  flex: 1 1 320px;
  border-radius: 999px !important;
  padding: 8px 14px !important;
  background: rgb(6, 14, 28) !important;
  border: 1px solid rgba(125, 211, 252, 0.42) !important;
  color: rgb(248, 250, 252) !important;
  font-size: 0.84rem !important;
}

.tc-choice-deck {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
  gap: 14px;
  margin-bottom: 14px;
  align-items: start;
}
.tc-deck-label {
  display: block;
  font-size: 0.76rem;
  font-weight: 800;
  color: rgb(186, 204, 226);
  margin-bottom: 6px;
}
.tc-side-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.tc-side-card {
  appearance: none;
  border-radius: 16px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: left;
  cursor: pointer;
  background: rgb(9, 20, 38);
  border: 1.5px solid rgba(148, 163, 184, 0.32);
  color: rgb(226, 232, 240);
  transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}
.tc-side-card:hover {
  transform: translateY(-1px);
}
.tc-side-card.is-call.is-selected {
  background: linear-gradient(145deg, rgb(8, 62, 46) 0%, rgb(5, 38, 28) 100%);
  border: 2px solid rgb(52, 211, 153);
  color: rgb(236, 253, 245);
  box-shadow: 0 10px 24px -10px rgba(16, 185, 129, 0.55);
}
.tc-side-card.is-put.is-selected {
  background: linear-gradient(145deg, rgb(76, 16, 38) 0%, rgb(46, 10, 24) 100%);
  border: 2px solid rgb(251, 113, 133);
  color: rgb(255, 241, 242);
  box-shadow: 0 10px 24px -10px rgba(244, 63, 94, 0.55);
}
.tc-side-txt {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.tc-side-txt b {
  font-size: 0.9rem;
  font-weight: 800;
}
.tc-side-txt small {
  font-size: 0.72rem;
  opacity: 0.86;
}

.tc-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.tc-pill-choice {
  appearance: none;
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 0.76rem;
  font-weight: 700;
  cursor: pointer;
  background: rgb(9, 21, 40);
  border: 1px solid rgba(148, 163, 184, 0.34);
  color: rgb(203, 213, 225);
  transition: transform 0.14s ease, background 0.14s ease, border-color 0.14s ease;
}
.tc-pill-choice:hover {
  border-color: rgba(125, 211, 252, 0.68);
  color: rgb(248, 250, 252);
}
.tc-pill-choice.is-selected {
  background: linear-gradient(180deg, rgb(8, 51, 38) 0%, rgb(5, 34, 25) 100%);
  border: 1.5px solid rgb(52, 211, 153);
  color: rgb(236, 253, 245);
}
.tc-pill-choice.is-res-loss.is-selected,
.tc-pill-choice.is-fol-no.is-selected {
  background: linear-gradient(180deg, rgb(76, 18, 42) 0%, rgb(48, 10, 26) 100%);
  border-color: rgb(251, 113, 133);
  color: rgb(255, 228, 230);
}

/* Perforated 3-Stub Options Execution Boarding Pass */
.tc-boarding-pass {
  position: relative;
  border-radius: 20px;
  background: linear-gradient(180deg, rgb(8, 20, 38) 0%, rgb(6, 14, 28) 100%);
  border: 1.5px solid rgba(250, 204, 21, 0.45);
  box-shadow: 0 16px 34px -18px rgba(0, 0, 0, 0.72), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  margin-bottom: 14px;
}
.tc-boarding-pass[data-side="put"] {
  border-color: rgba(251, 113, 133, 0.55);
}
.tc-boarding-pass[data-side="call"] {
  border-color: rgba(52, 211, 153, 0.55);
}
.tc-pass-notch {
  position: absolute;
  top: 50%;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgb(7, 17, 34);
  border: 1.5px solid rgba(148, 163, 184, 0.4);
  transform: translateY(-50%);
  z-index: 2;
  pointer-events: none;
}
.tc-pass-notch.is-left { left: -11px; }
.tc-pass-notch.is-right { right: -11px; }

.tc-pass-stub {
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-right: 1.5px dashed rgba(148, 163, 184, 0.28);
}
.tc-pass-stub:last-child {
  border-right: 0;
}
.tc-stub-head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}
.tc-stub-step {
  padding: 2px 8px;
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: 0.66rem;
  font-weight: 800;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  background: rgba(56, 189, 248, 0.16);
  border: 1px solid rgba(56, 189, 248, 0.45);
  color: rgb(186, 230, 253);
}
.tc-stub-head b {
  font-size: 0.82rem;
  color: rgb(241, 245, 249);
}
.tc-slot-row-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
}
.tc-slot-field {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 4px;
}
.tc-slot-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  flex-wrap: wrap;
}
.tc-slot-top label {
  font-size: 0.74rem;
  font-weight: 700;
  color: rgb(186, 204, 226);
  margin: 0;
}
.tc-quick-chips {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  flex-wrap: nowrap;
  white-space: nowrap;
}
.tc-quick-chips button {
  appearance: none;
  border: 1px solid rgba(148, 163, 184, 0.3);
  background: rgba(15, 29, 54, 0.75);
  color: rgb(186, 230, 253);
  border-radius: 999px;
  padding: 1px 5px;
  font-family: var(--font-mono);
  font-size: 0.64rem;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}
.tc-quick-chips button:hover {
  background: rgba(56, 189, 248, 0.25);
  border-color: rgb(56, 189, 248);
  color: rgb(255, 255, 255);
}
.tc-slot-input {
  width: 100%;
  border-radius: 12px !important;
  padding: 7px 11px !important;
  background: rgba(13, 28, 52, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  border-bottom: 2px solid rgba(56, 189, 248, 0.55) !important;
  color: rgb(248, 250, 252) !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
}
.tc-slot-input.is-mono {
  font-family: var(--font-mono) !important;
}
.tc-slot-input.is-big {
  font-size: 1rem !important;
  font-weight: 800 !important;
}
.tc-roi-pill {
  display: inline-flex;
  align-items: center;
  padding: 1px 7px;
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  font-weight: 800;
}
.tc-roi-pill.is-up {
  background: rgba(16, 185, 129, 0.22);
  border: 1px solid rgba(52, 211, 153, 0.6);
  color: rgb(110, 231, 183);
}
.tc-roi-pill.is-down {
  background: rgba(244, 63, 94, 0.22);
  border: 1px solid rgba(251, 113, 133, 0.6);
  color: rgb(253, 164, 175);
}

/* Detail Boarding Pass KV */
.tc-detail-kv {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 4px 0;
  border-bottom: 1px dashed rgba(148, 163, 184, 0.16);
}
.tc-detail-kv:last-child { border-bottom: 0; }
.tc-detail-kv span {
  font-size: 0.78rem;
  color: rgb(176, 196, 222);
}
.tc-detail-kv b {
  font-family: var(--font-mono);
  font-size: 0.88rem;
  font-weight: 800;
  color: rgb(248, 250, 252);
}

/* Thesis & Discipline Stage */
.tc-thesis-stage {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
}
.tc-reason-card,
.tc-discipline-card {
  border-radius: 16px;
  padding: 14px 16px;
  background: rgba(8, 19, 36, 0.86);
  border: 1px solid rgba(148, 163, 184, 0.26);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.tc-reason-card h4,
.tc-discipline-card h4 {
  margin: 0;
  font-family: var(--font-head);
  font-size: 0.92rem;
  font-weight: 800;
  color: rgb(248, 250, 252);
}
.tc-reason-card p {
  margin: 2px 0 0;
  font-size: 0.78rem;
  color: rgb(176, 196, 222);
}
.tc-reason-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.tc-reason-chip {
  appearance: none;
  border-radius: 999px;
  padding: 4px 10px;
  font-size: 0.73rem;
  font-weight: 700;
  background: rgba(14, 165, 233, 0.14);
  border: 1px solid rgba(56, 189, 248, 0.42);
  color: rgb(186, 230, 253);
  cursor: pointer;
}
.tc-reason-chip:hover {
  background: rgba(14, 165, 233, 0.26);
  color: rgb(255, 255, 255);
}
.tc-thesis-textarea {
  width: 100%;
  min-height: 92px;
  border-radius: 12px !important;
  padding: 10px 12px !important;
  background: rgb(5, 12, 24) !important;
  border: 1px solid rgba(96, 165, 250, 0.34) !important;
  color: rgb(248, 250, 252) !important;
  font-size: 0.86rem !important;
  line-height: 1.5 !important;
  resize: vertical;
}
.tc-disc-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.tc-disc-lbl {
  font-size: 0.74rem;
  font-weight: 700;
  color: rgb(176, 196, 222);
}
.tc-disc-row-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.tc-disc-inputs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 2px;
}
.tc-mini-field {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.tc-mini-field label {
  font-size: 0.72rem;
  font-weight: 700;
  color: rgb(176, 196, 222);
}
.tc-mini-field input {
  border-radius: 10px !important;
  padding: 6px 10px !important;
  background: rgb(5, 12, 24) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  color: rgb(241, 245, 249) !important;
  font-size: 0.8rem !important;
}

/* ---------- Zone 3: Verified Real Order Slip Vault ---------- */
.tc-slip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
  align-items: stretch;
}
.tc-slip-card {
  border-radius: 16px;
  background: rgb(4, 20, 17);
  border: 1.5px solid rgba(52, 211, 153, 0.52);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.tc-slip-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 12px;
  background: rgba(6, 54, 42, 0.88);
  border-bottom: 1px solid rgba(52, 211, 153, 0.3);
}
.tc-slip-seal {
  font-size: 0.74rem;
  font-weight: 800;
  color: rgb(167, 243, 208);
}
.tc-slip-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}
.tc-slip-img-btn {
  appearance: none;
  border: 0;
  background: rgb(3, 14, 12);
  padding: 10px;
  width: 100%;
  cursor: zoom-in;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tc-slip-img-btn img {
  width: 100%;
  max-height: 210px;
  object-fit: contain;
  border-radius: 10px;
  display: block;
}
.tc-slip-dropzone {
  border-radius: 16px;
  padding: 16px 18px;
  background: rgba(6, 46, 36, 0.48);
  border: 1.5px dashed rgba(52, 211, 153, 0.55);
  display: flex;
  align-items: center;
  gap: 14px;
  color: rgb(236, 253, 245);
  transition: background 0.16s ease, border-color 0.16s ease;
}
.tc-slip-dropzone:hover {
  background: rgba(16, 185, 129, 0.2);
  border-color: rgb(52, 211, 153);
}
.tc-slip-drop-ico {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: rgba(16, 185, 129, 0.2);
  border: 1px solid rgba(52, 211, 153, 0.5);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.tc-slip-drop-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.tc-slip-drop-body b {
  font-size: 0.86rem;
  color: rgb(236, 253, 245);
}
.tc-slip-drop-body small {
  font-size: 0.76rem;
  color: rgb(167, 243, 208);
}

/* ---------- Fullscreen Interactive Zoom Lightbox (#dteImageLightbox) ---------- */
.dte-img-lightbox {
  position: fixed;
  inset: 0;
  z-index: 100020;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dte-img-lightbox[hidden] {
  display: none !important;
}
.dte-lb-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(2, 6, 18, 0.92);
  backdrop-filter: blur(12px);
}
.dte-lb-shell {
  position: relative;
  z-index: 1;
  width: min(1280px, calc(100vw - 28px));
  height: calc(100vh - 28px);
  border-radius: 22px;
  background: rgb(6, 13, 26);
  border: 1.5px solid rgba(56, 189, 248, 0.45);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.85);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.dte-lb-head {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 18px;
  background: rgba(11, 24, 46, 0.95);
  border-bottom: 1px solid rgba(56, 189, 248, 0.26);
  flex-wrap: wrap;
}
.dte-lb-title {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.dte-lb-badge {
  padding: 4px 11px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 800;
  background: rgba(56, 189, 248, 0.2);
  border: 1px solid rgba(56, 189, 248, 0.55);
  color: rgb(186, 230, 253);
}
.dte-lb-badge.is-slip {
  background: rgba(16, 185, 129, 0.22);
  border-color: rgba(52, 211, 153, 0.6);
  color: rgb(167, 243, 208);
}
.dte-lb-title b {
  font-size: 0.9rem;
  color: rgb(248, 250, 252);
}
.dte-lb-controls {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.dte-lb-btn,
.dte-lb-close {
  appearance: none;
  border: 1px solid rgba(148, 163, 184, 0.38);
  background: rgb(15, 29, 54);
  color: rgb(241, 245, 249);
  border-radius: 999px;
  padding: 5px 12px;
  font-size: 0.78rem;
  font-weight: 800;
  cursor: pointer;
}
.dte-lb-btn:hover {
  border-color: rgb(56, 189, 248);
  background: rgb(22, 46, 84);
}
.dte-lb-close {
  background: rgba(244, 63, 94, 0.22);
  border-color: rgba(251, 113, 133, 0.58);
  color: rgb(255, 228, 230);
}
.dte-lb-zoom-pill {
  padding: 4px 10px;
  border-radius: 999px;
  font-family: var(--font-mono);
  font-size: 0.78rem;
  font-weight: 800;
  background: rgba(250, 204, 21, 0.16);
  border: 1px solid rgba(250, 204, 21, 0.5);
  color: rgb(254, 240, 138);
}
.dte-lb-stage {
  position: relative;
  flex: 1 1 auto;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgb(3, 8, 18);
}
.dte-lb-canvas {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.dte-lb-canvas img {
  max-width: 92%;
  max-height: 88%;
  object-fit: contain;
  transition: transform 0.08s ease-out;
  user-select: none;
}
.dte-lb-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1.5px solid rgba(125, 211, 252, 0.55);
  background: rgba(9, 20, 38, 0.88);
  color: rgb(248, 250, 252);
  font-size: 1.5rem;
  font-weight: 800;
  cursor: pointer;
  z-index: 3;
}
.dte-lb-nav.is-prev { left: 16px; }
.dte-lb-nav.is-next { right: 16px; }
.dte-lb-filmstrip {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: rgba(9, 20, 38, 0.96);
  border-top: 1px solid rgba(148, 163, 184, 0.22);
  overflow-x: auto;
}
.dte-lb-thumb {
  appearance: none;
  border: 1.5px solid rgba(148, 163, 184, 0.32);
  background: rgb(6, 14, 28);
  border-radius: 10px;
  padding: 4px 8px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgb(203, 213, 225);
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
  flex-shrink: 0;
}
.dte-lb-thumb img {
  width: 44px;
  height: 28px;
  object-fit: cover;
  border-radius: 5px;
}
.dte-lb-thumb.is-active {
  border-color: rgb(250, 204, 21);
  background: rgba(250, 204, 21, 0.14);
  color: rgb(254, 240, 138);
}

/* ---------- Responsive (Tablet & Mobile 390x844) ---------- */
@media (max-width: 860px) {
  .tc-asymmetric-gallery,
  .tc-choice-deck,
  .tc-boarding-pass,
  .tc-thesis-stage {
    grid-template-columns: 1fr !important;
  }
  .tc-pass-stub {
    border-right: 0 !important;
    border-bottom: 1.5px dashed rgba(148, 163, 184, 0.28);
  }
  .tc-pass-stub:last-child {
    border-bottom: 0;
  }
  .tc-disc-row-2,
  .tc-disc-inputs {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================
   ☀️ L1 LIGHT MODE OVERRIDES FOR V260 AUDI TRANSACTION STUDIO
   ========================================================================== */
html[data-theme="light"] #modalBack .modal.is-trade-studio {
  background: linear-gradient(165deg, rgb(224, 242, 254) 0%, rgb(248, 250, 252) 52%, rgb(209, 250, 229) 100%) !important;
  border: 1.5px solid rgba(14, 165, 233, 0.42) !important;
  box-shadow: 0 28px 68px rgba(15, 23, 42, 0.22) !important;
}
html[data-theme="light"] #modalBack .modal.is-trade-studio .modal-head {
  background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(240, 249, 255) 100%) !important;
  border-bottom: 1px solid rgba(14, 165, 233, 0.28) !important;
}
html[data-theme="light"] #modalBack .modal.is-trade-studio .modal-head h2 {
  color: rgb(15, 23, 42) !important;
}
html[data-theme="light"] #modalBack .modal.is-trade-studio .modal-foot {
  background: rgb(255, 255, 255) !important;
  border-top: 1px solid rgba(148, 163, 184, 0.32) !important;
}
html[data-theme="light"] .tc-foot-note {
  color: rgb(71, 85, 105);
}
html[data-theme="light"] .tc-zone {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(250, 253, 255) 100%);
  border: 1px solid rgba(148, 163, 184, 0.34);
  box-shadow: 0 12px 28px -16px rgba(15, 23, 42, 0.12);
}
html[data-theme="light"] .tc-gallery-zone {
  border-top: 3.5px solid rgb(2, 132, 199);
}
html[data-theme="light"] .tc-ticket-zone {
  border-top: 3.5px solid rgb(14, 165, 233);
}
html[data-theme="light"] .tc-slip-vault {
  background: linear-gradient(155deg, rgb(209, 250, 229) 0%, rgb(236, 253, 245) 100%);
  border: 1.5px dashed rgba(5, 150, 105, 0.58);
  border-top: 3.5px solid rgb(5, 150, 105);
}
html[data-theme="light"] .tc-zone-kicker {
  color: rgb(3, 105, 161);
}
html[data-theme="light"] .tc-zone-kicker.is-slip-kicker {
  color: rgb(4, 120, 87);
}
html[data-theme="light"] .tc-zone-title-wrap h3 {
  color: rgb(15, 23, 42);
}
html[data-theme="light"] .tc-zone-title-wrap p {
  color: rgb(51, 65, 85);
}
html[data-theme="light"] .tc-zone-title-wrap kbd {
  background: rgb(241, 245, 249);
  border-color: rgba(2, 132, 199, 0.45);
  color: rgb(15, 23, 42);
}
html[data-theme="light"] .tc-paste-target-btn,
html[data-theme="light"] .tc-demo-btn,
html[data-theme="light"] .tc-upload-pill,
html[data-theme="light"] .tc-live-fill-btn,
html[data-theme="light"] .tc-copy-ai-btn {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(241, 245, 249) 100%);
  border-color: rgba(100, 116, 139, 0.38);
  color: rgb(30, 41, 59);
}
html[data-theme="light"] .tc-paste-target-btn.is-active {
  background: linear-gradient(180deg, rgb(220, 252, 231) 0%, rgb(187, 247, 208) 100%);
  border-color: rgba(16, 185, 129, 0.65);
  color: rgb(6, 78, 59);
}
html[data-theme="light"] .tc-demo-btn {
  background: linear-gradient(180deg, rgb(224, 242, 254) 0%, rgb(186, 230, 253) 100%);
  border-color: rgba(2, 132, 199, 0.52);
  color: rgb(12, 74, 110);
}
html[data-theme="light"] .tc-gal-hero {
  background: rgb(248, 250, 252);
  border-color: rgba(14, 165, 233, 0.45);
}
html[data-theme="light"] .tc-gal-hero-top {
  background: rgb(241, 245, 249);
  border-bottom-color: rgba(148, 163, 184, 0.28);
}
html[data-theme="light"] .tc-hero-badge {
  background: rgb(254, 243, 199);
  border-color: rgba(217, 119, 6, 0.55);
  color: rgb(146, 64, 14);
}
html[data-theme="light"] .tc-gal-empty-inner b {
  color: rgb(15, 23, 42);
}
html[data-theme="light"] .tc-gal-empty-inner p {
  color: rgb(71, 85, 105);
}
html[data-theme="light"] .tc-gal-side {
  background: rgb(248, 250, 252);
  border-color: rgba(148, 163, 184, 0.34);
}
html[data-theme="light"] .tc-gal-side-head span {
  color: rgb(15, 23, 42);
}
html[data-theme="light"] .tc-gal-side-head small {
  color: rgb(71, 85, 105);
}
html[data-theme="light"] .tc-gal-thumb-card {
  background: rgb(255, 255, 255);
  border-color: rgba(14, 165, 233, 0.36);
}
html[data-theme="light"] .tc-thumb-top {
  background: rgb(241, 245, 249);
}
html[data-theme="light"] .tc-thumb-num {
  color: rgb(3, 105, 161);
}
html[data-theme="light"] .tc-img-btn,
html[data-theme="light"] .tc-mini-btn {
  background: rgb(255, 255, 255);
  border-color: rgba(100, 116, 139, 0.38);
  color: rgb(30, 41, 59);
}
html[data-theme="light"] .tc-gal-paste-slot {
  background: rgb(240, 249, 255);
  border-color: rgba(2, 132, 199, 0.45);
  color: rgb(15, 23, 42);
}
html[data-theme="light"] .tc-slot-txt b {
  color: rgb(12, 74, 110);
}
html[data-theme="light"] .tc-slot-txt small {
  color: rgb(71, 85, 105);
}
html[data-theme="light"] .tc-ai-bar {
  background: linear-gradient(135deg, rgb(224, 242, 254) 0%, rgb(238, 242, 255) 100%);
  border-color: rgba(2, 132, 199, 0.42);
}
html[data-theme="light"] .tc-ai-badge {
  color: rgb(12, 74, 110);
}
html[data-theme="light"] .tc-ai-sample-chip {
  background: rgb(254, 243, 199);
  border-color: rgba(217, 119, 6, 0.55);
  color: rgb(146, 64, 14);
}
html[data-theme="light"] .tc-ai-input {
  background: rgb(255, 255, 255) !important;
  border-color: rgba(2, 132, 199, 0.45) !important;
  color: rgb(15, 23, 42) !important;
}
html[data-theme="light"] .tc-deck-label,
html[data-theme="light"] .tc-disc-lbl,
html[data-theme="light"] .tc-mini-field label {
  color: rgb(51, 65, 85);
}
html[data-theme="light"] .tc-side-card {
  background: rgb(248, 250, 252);
  border-color: rgba(148, 163, 184, 0.42);
  color: rgb(30, 41, 59);
}
html[data-theme="light"] .tc-side-card.is-call.is-selected {
  background: linear-gradient(145deg, rgb(187, 247, 208) 0%, rgb(220, 252, 231) 100%);
  border-color: rgb(5, 150, 105);
  color: rgb(5, 46, 22);
}
html[data-theme="light"] .tc-side-card.is-put.is-selected {
  background: linear-gradient(145deg, rgb(254, 205, 211) 0%, rgb(255, 228, 230) 100%);
  border-color: rgb(225, 29, 72);
  color: rgb(76, 5, 25);
}
html[data-theme="light"] .tc-pill-choice {
  background: rgb(248, 250, 252);
  border-color: rgba(100, 116, 139, 0.36);
  color: rgb(51, 65, 85);
}
html[data-theme="light"] .tc-pill-choice.is-selected {
  background: linear-gradient(180deg, rgb(220, 252, 231) 0%, rgb(187, 247, 208) 100%);
  border-color: rgb(5, 150, 105);
  color: rgb(6, 78, 59);
}
html[data-theme="light"] .tc-pill-choice.is-res-loss.is-selected,
html[data-theme="light"] .tc-pill-choice.is-fol-no.is-selected {
  background: linear-gradient(180deg, rgb(254, 205, 211) 0%, rgb(255, 228, 230) 100%);
  border-color: rgb(225, 29, 72);
  color: rgb(136, 19, 55);
}
html[data-theme="light"] .tc-boarding-pass {
  background: linear-gradient(180deg, rgb(248, 250, 252) 0%, rgb(241, 245, 249) 100%);
  border-color: rgba(14, 165, 233, 0.48);
  box-shadow: 0 10px 24px -14px rgba(15, 23, 42, 0.14);
}
html[data-theme="light"] .tc-pass-notch {
  background: rgb(255, 255, 255);
}
html[data-theme="light"] .tc-stub-head b,
html[data-theme="light"] .tc-detail-kv b {
  color: rgb(15, 23, 42);
}
html[data-theme="light"] .tc-stub-step {
  background: rgb(224, 242, 254);
  border-color: rgba(2, 132, 199, 0.48);
  color: rgb(3, 105, 161);
}
html[data-theme="light"] .tc-slot-top label,
html[data-theme="light"] .tc-detail-kv span {
  color: rgb(51, 65, 85);
}
html[data-theme="light"] .tc-quick-chips button {
  background: rgb(255, 255, 255);
  border-color: rgba(100, 116, 139, 0.36);
  color: rgb(3, 105, 161);
}
html[data-theme="light"] .tc-slot-input {
  background: rgb(255, 255, 255) !important;
  border-color: rgba(148, 163, 184, 0.42) !important;
  border-bottom: 2px solid rgb(2, 132, 199) !important;
  color: rgb(15, 23, 42) !important;
}
html[data-theme="light"] .tc-reason-card,
html[data-theme="light"] .tc-discipline-card {
  background: rgb(248, 250, 252);
  border-color: rgba(148, 163, 184, 0.36);
}
html[data-theme="light"] .tc-reason-card h4,
html[data-theme="light"] .tc-discipline-card h4 {
  color: rgb(15, 23, 42);
}
html[data-theme="light"] .tc-reason-card p {
  color: rgb(71, 85, 105);
}
html[data-theme="light"] .tc-reason-chip {
  background: rgb(224, 242, 254);
  border-color: rgba(2, 132, 199, 0.42);
  color: rgb(12, 74, 110);
}
html[data-theme="light"] .tc-thesis-textarea,
html[data-theme="light"] .tc-mini-field input {
  background: rgb(255, 255, 255) !important;
  border-color: rgba(148, 163, 184, 0.42) !important;
  color: rgb(15, 23, 42) !important;
}
html[data-theme="light"] .tc-slip-card {
  background: rgb(255, 255, 255);
  border-color: rgba(5, 150, 105, 0.55);
}
html[data-theme="light"] .tc-slip-card-head {
  background: rgb(209, 250, 229);
}
html[data-theme="light"] .tc-slip-seal {
  color: rgb(6, 78, 59);
}
html[data-theme="light"] .tc-slip-dropzone {
  background: rgba(255, 255, 255, 0.85);
  border-color: rgba(5, 150, 105, 0.58);
  color: rgb(6, 78, 59);
}
html[data-theme="light"] .tc-slip-drop-body b {
  color: rgb(6, 78, 59);
}
html[data-theme="light"] .tc-slip-drop-body small {
  color: rgb(4, 120, 87);
}

/* Modal Z-Plane Isolation: ensure #modalBack.open sits above #chPushToastHost & #dteSignalDrawerTab */
#modalBack.open {
  z-index: 9500 !important;
}
body:has(#modalBack.open) #chPushToastHost,
body:has(#modalBack.open) .is-signal-sidebar,
body:has(#modalBack.open) #dteSignalDrawer,
body:has(#modalBack.open) #dteSignalDrawerTab,
body:has(#modalBack.open) #dteAlertToastHost {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
}
body:has(#modalBack.open) #toast.show {
  z-index: 9800 !important;
  bottom: 84px !important;
}
#modalBack .modal.is-trade-studio .modal-foot [data-act="cancel"],
#modalBack .modal.is-trade-studio .modal-foot [data-act="close"],
#modalBack .modal.is-trade-studio .modal-foot [data-act="delete"] {
  border-radius: 999px !important;
  padding: 8px 18px !important;
  background: linear-gradient(180deg, rgb(13, 31, 56) 0%, rgb(8, 21, 38) 100%) !important;
  border: 1px solid rgba(148, 163, 184, 0.38) !important;
  color: rgb(226, 232, 240) !important;
  font-weight: 700 !important;
}
html[data-theme="light"] #modalBack .modal.is-trade-studio .modal-foot [data-act="cancel"],
html[data-theme="light"] #modalBack .modal.is-trade-studio .modal-foot [data-act="close"] {
  background: linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(241, 245, 249) 100%) !important;
  border: 1px solid rgba(100, 116, 139, 0.42) !important;
  color: rgb(30, 41, 59) !important;
}

/* ==========================================================================
   V241 — 🌐 ตลาดสด (#panel-market) Web Standard v2 & Impeccable Upgrade
   Audi 2026-10-31:
   1. Mixed Thai + Numeric Readouts (เปิดย่อ −$7.96 (−1.03%)) use AK Thai + Google Sans tabular-nums (NEVER Courier New monospace fallback).
   2. Segmented Capsule Controls for ⚡ ≤30 · 📡 สด · 🔥 ≥70 & capsule action pills (NO navy-blue rounded rectangles).
   3. Sweep Radar 2-Bounce SVG Infographic instead of wall-of-text paragraphs.
   4. Balanced 12-Asset Force Clash Arena columns (.sca-weight-deck.is-bear-heavy / .is-bull-heavy).
   ========================================================================== */

/* 1. Canonical Font Lock on Mixed Thai + Number Readouts in #panel-market */
html body:not(#akx) #main:not(#aky) #panel-market :is(.gj-kpi-val, .gj-kpi-word, .gj-kpi-num, .gj-kpi-pct, .mts-sub-val, .mts-val, .gj-swing-chip, .gj-swing-chip b) {
  font-family: var(--aku-font-head, 'Google Sans', 'AK Thai', 'Noto Sans Thai', sans-serif) !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: -0.01em !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .gj-kpi-val {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  align-items: baseline !important;
  gap: 5px !important;
  font-size: 1.18rem !important;
  font-weight: 800 !important;
  line-height: 1.28 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .gj-swing-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  white-space: nowrap !important;
  padding: 5px 10px !important;
  border-radius: 8px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .gj-swing-chip b {
  white-space: nowrap !important;
  font-size: 0.88rem !important;
  font-weight: 800 !important;
}
/* Flatten dark box-in-box inside the 3 SPY KPI sub-cards */
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market #mkSpy .gj-kpi-card .gj-vis-box {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  border-radius: 10px !important;
  padding: 8px 10px !important;
}

/* 2. Segmented Capsule Control for RSI Simulator (⚡ ≤30 · 📡 สด · 🔥 ≥70) — Zero Navy Rectangles */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mts-sim-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 6px 10px !important;
  margin-bottom: 8px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-pills {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  padding: 3px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.56) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  box-shadow: inset 0 1px 2px rgba(2, 6, 23, 0.45) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-pills {
  background: rgba(241, 245, 249, 0.94) !important;
  border: 1px solid rgba(100, 116, 139, 0.32) !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-btn {
  appearance: none !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: rgba(226, 232, 240, 0.82) !important;
  font-family: var(--aku-font-body, 'AK Thai', 'Google Sans', sans-serif) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  padding: 5px 11px !important;
  height: auto !important;
  min-height: 28px !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: background-color 0.16s ease, color 0.16s ease, border-color 0.16s ease !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-btn::after,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .aku-control::after {
  content: none !important;
  display: none !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-btn {
  color: #334155 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-btn:hover:not(.is-active) {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-btn:hover:not(.is-active) {
  color: #0f172a !important;
  background: rgba(15, 23, 42, 0.06) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-btn.is-active[data-rsi-sim="live"] {
  background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%) !important;
  color: #ffffff !important;
  border-color: rgba(186, 230, 253, 0.65) !important;
  box-shadow: 0 2px 8px rgba(14, 165, 233, 0.35) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-btn.is-active[data-rsi-sim="oversold"] {
  background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
  color: #ecfdf5 !important;
  border-color: rgba(167, 243, 208, 0.65) !important;
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.35) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .rsi-sim-btn.is-active[data-rsi-sim="overbought"] {
  background: linear-gradient(135deg, #f43f5e 0%, #e11d48 100%) !important;
  color: #fff1f2 !important;
  border-color: rgba(253, 164, 175, 0.65) !important;
  box-shadow: 0 2px 8px rgba(244, 63, 94, 0.35) !important;
}

/* 3. Clean Disclosure (<details class="explain">) & Action Pills in #panel-market */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .aku-control--quiet,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .aku-control--quiet,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-how-btn {
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--aku-sky-2, #151c28), var(--aku-sky-3, #1e2738)) !important;
  color: var(--aku-text, #f1f5f9) !important;
  border: 1px solid var(--aku-line, rgba(148, 163, 184, 0.34)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .aku-control--quiet,
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .mk-how-btn {
  background: linear-gradient(135deg, #ffffff, #f1f5f9) !important;
  color: #1e293b !important;
  border: 1px solid rgba(100, 116, 139, 0.36) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkMacd,
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSpy {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) details:is(.explain, .mk-disclosure, .hoc-why, .hcd-more-fold) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-top: 12px !important;
  overflow: visible !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) details:is(.explain, .mk-disclosure, .hoc-why, .hcd-more-fold) > summary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: fit-content !important;
  max-width: 100% !important;
  min-height: 36px !important;
  padding: 6px 16px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--aku-sky-2, #151c28), var(--aku-sky-3, #1e2738)) !important;
  border: 1px solid var(--aku-line, rgba(148, 163, 184, 0.34)) !important;
  color: var(--aku-text, #e2e8f0) !important;
  font: 700 0.84rem/1.4 var(--aku-font-body) !important;
  cursor: pointer !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) details:is(.explain, .mk-disclosure, .hoc-why, .hcd-more-fold) > summary {
  background: linear-gradient(135deg, #ffffff, #f1f5f9) !important;
  border: 1px solid rgba(100, 116, 139, 0.35) !important;
  color: #1e293b !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) details:is(.explain, .mk-disclosure, .hoc-why, .hcd-more-fold) > summary::after {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 0 0 4px !important;
  color: var(--aku-accent, #38bdf8) !important;
  font-weight: 800 !important;
}

/* 4. Sweep Radar 2-Bounce SVG Infographic Deck */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-2bounce-strip.is-infographic-deck {
  display: block !important;
  margin-top: 10px !important;
  padding: 10px 12px !important;
  border-radius: 12px !important;
  background: rgba(9, 15, 28, 0.62) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
}
html[data-theme="light"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-2bounce-strip.is-infographic-deck {
  background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%) !important;
  border: 1.5px solid rgba(15, 23, 42, 0.22) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-infographic-svg {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 196px !important;
  font-family: var(--aku-font-head, 'Google Sans', 'AK Thai', sans-serif) !important;
}

/* 5. Dynamic Column Balancing in 12-Asset Force Clash Arena (#mkCross) */
@media (min-width: 960px) {
  html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkCross .sca-weight-deck.is-bear-heavy {
    grid-template-columns: minmax(250px, 0.88fr) minmax(0, 1.72fr) !important;
    align-items: start !important;
  }
  html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkCross .sca-weight-deck.is-bull-heavy {
    grid-template-columns: minmax(0, 1.72fr) minmax(250px, 0.88fr) !important;
    align-items: start !important;
  }
  html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkCross .sca-weight-col.is-multi-col .sca-chip-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }
}
/* Red chip class c-red for negative GEX regime in #mkLevels header */
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .chip.c-red,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .chip.c-red {
  background: linear-gradient(135deg, #e11d48 0%, #be123c 100%) !important;
  color: #fff1f2 !important;
  border: 1px solid #fda4af !important;
  font-weight: 800 !important;
  box-shadow: 0 3px 10px rgba(244, 63, 94, 0.34) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market:not(#akz) .chip.c-green,
html[data-theme="dark"] body:not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] .chip.c-green {
  background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
  color: #ecfdf5 !important;
  border: 1px solid #6ee7b7 !important;
  font-weight: 800 !important;
}




/* V253 — CRAFT-A..F + 5m Candle Lock + Ticked Shaft + Single Active HUD + GEX Cluster Strip */
@keyframes dcRsiAuraPulse {
  0%, 100% { transform: scale(0.95); opacity: 0.78; }
  50% { transform: scale(1.12); opacity: 1; }
}
@keyframes dcRsiContactSonar {
  0% { transform: scale(0.75); opacity: 0.9; }
  100% { transform: scale(1.85); opacity: 0; }
}
.mts-rsi-dial .dc-rsi-contact-ring {
  transform-box: fill-box;
  transform-origin: center;
  animation: dcRsiContactSonar 1.9s ease-out infinite;
  pointer-events: none;
}
.mts-rsi-dial .dc-rsi-contact-ring.r2 {
  animation-delay: -0.95s;
}

/* ==========================================================================
   CRAFT-D (Chibi Gojo vs Chibi Sukuna Sector Clash + Proportional Treemap),
   CRAFT-E (Price Elevator + Ranked Wall Armor Barriers + Clash/Breakout FX),
   & CRAFT-F (9-Strike GEX Skyline + Orbiting Laser Wall Frame + Internal Bar Flow + Cluster Bar)
   ========================================================================== */
.dc-beauty-stage.is-craft-secflow,.dc-beauty-stage.is-craft-elevator,.dc-beauty-stage.is-craft-skyline{padding:22px 24px;display:grid;gap:16px}
.dc-beauty-stage.is-craft-secflow.is-cond-inflow{background:radial-gradient(90% 90% at 22% 20%,rgba(14,165,233,.32),rgba(59,130,246,.16) 48%,transparent 70%),radial-gradient(80% 80% at 82% 80%,rgba(225,29,72,.18),transparent 65%),linear-gradient(135deg,rgb(6,20,38),rgb(14,12,30))}
.dc-beauty-stage.is-craft-secflow.is-cond-rotation{background:radial-gradient(90% 90% at 50% 30%,rgba(168,85,247,.32),rgba(56,189,248,.18) 48%,transparent 72%),linear-gradient(135deg,rgb(18,12,40),rgb(10,16,34))}
.dc-beauty-stage.is-craft-secflow.is-cond-outflow{background:radial-gradient(90% 90% at 78% 20%,rgba(225,29,72,.34),rgba(147,51,234,.18) 48%,transparent 70%),radial-gradient(80% 80% at 20% 80%,rgba(14,165,233,.14),transparent 65%),linear-gradient(135deg,rgb(36,10,24),rgb(12,14,28))}

.dc-sf-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid rgba(148,163,184,.18)}
.dc-sf-title-block{display:grid;gap:5px;flex:1 1 420px}
.dc-sf-kicker{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;font:800 .8rem/1.3 var(--aku-font-body);color:rgb(226,232,240)}
.dc-sf-kicker b{color:rgb(186,230,253)}
.dc-sf-badge{padding:2px 9px;border-radius:999px;background:rgba(56,189,248,.16);border:1px solid rgba(56,189,248,.42);color:rgb(186,230,253);font-size:.71rem;font-weight:700}
.dc-sf-badge.is-jjk-badge{background:rgba(168,85,247,.2);border-color:rgba(192,132,252,.5);color:rgb(233,213,255)}
.dc-sf-verdict{font:800 .98rem/1.35 var(--aku-font-head)}
.dc-sf-verdict.is-up{color:rgb(110,231,183);text-shadow:0 0 18px rgba(16,185,129,.35)}
.dc-sf-verdict.is-jjk-blue{color:rgb(125,211,252);text-shadow:0 0 18px rgba(14,165,233,.45)}
.dc-sf-verdict.is-jjk-purple{color:rgb(216,180,254);text-shadow:0 0 18px rgba(168,85,247,.5)}
.dc-sf-verdict.is-dn{color:rgb(253,164,175);text-shadow:0 0 18px rgba(244,63,94,.35)}
.dc-sf-verdict.is-sky{color:rgb(186,230,253);text-shadow:0 0 18px rgba(56,189,248,.35)}

.dc-sf-hero-strip{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}
.dc-sf-wing{display:grid;gap:4px;padding:10px 14px;border-radius:12px;background:rgba(15,23,42,.52)}
.dc-sf-wing.is-gojo-wing{border-left:3.5px solid rgb(56,189,248);box-shadow:inset 12px 0 22px -14px rgba(14,165,233,.35)}
.dc-sf-wing.is-sukuna-wing{border-right:3.5px solid rgb(244,63,94);text-align:right;box-shadow:inset -12px 0 22px -14px rgba(225,29,72,.35)}
.dc-sf-wing-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.dc-sf-wing-top.is-right{justify-content:flex-end;gap:12px}
.dc-sf-wing-lbl{font:800 .9rem/1.3 var(--aku-font-head);color:rgb(241,245,249)}
.dc-sf-wing-lbl b{font-family:var(--aku-font-mono);font-size:1.05rem}
.dc-sf-wing-lbl em{font-style:normal;font-family:var(--aku-font-mono);font-weight:900}
.dc-sf-wing-lbl em.is-sky{color:rgb(56,189,248)}
.dc-sf-wing-lbl em.is-up{color:rgb(52,211,153)}
.dc-sf-wing-lbl em.is-dn{color:rgb(251,113,133)}
.dc-sf-wing-sub{font-size:.78rem;color:rgb(203,213,225)}
.dc-sf-wing-sub b{color:rgb(248,250,252)}
.dc-sca-fx-badge.is-jjk-blue{background:rgba(14,165,233,.25);border:1px solid rgb(56,189,248);color:rgb(224,242,254);box-shadow:0 0 12px rgba(14,165,233,.4)}

/* Chibi Gojo vs Chibi Sukuna Kamehameha Stage */
.dc-sca-battle-stage.is-jjk-kame-stage{background:linear-gradient(90deg,rgba(14,165,233,.16) 0%,rgba(88,28,135,.22) 50%,rgba(225,29,72,.18) 100%);border:1px solid rgba(125,211,252,.28)}
.dc-sca-sprite-stack.is-chibi-stack{width:64px;height:64px}
.dc-sca-char-sprite.is-chibi-avatar{width:64px;height:64px;image-rendering:auto!important;object-fit:contain;filter:drop-shadow(0 0 10px rgba(56,189,248,.55))}
.dc-sca-duelist.is-bear .dc-sca-char-sprite.is-chibi-avatar{filter:drop-shadow(0 0 10px rgba(244,63,94,.55))}
.dc-kame-orb,.dc-kame-core{transform-box:fill-box;transform-origin:center;animation:dcRsiAuraPulse .95s ease-in-out infinite}
.dc-sca-beam-pct.is-jjk-blue-pct{background:rgba(14,165,233,.24);border-color:rgba(56,189,248,.6);color:rgb(186,230,253)}
.dc-sca-beam-pct.is-jjk-red-pct{background:rgba(225,29,72,.24);border-color:rgba(251,113,133,.6);color:rgb(254,205,211)}
.dc-sca-hud-mid.is-jjk-mid{background:rgba(88,28,135,.45);border-color:rgba(192,132,252,.65);color:rgb(233,213,255)}

.dc-sca-energy-bar.is-jjk-kame-bar .dc-sca-beam.is-gojo-beam{background:linear-gradient(90deg,rgb(2,132,199) 0%,rgb(14,165,233) 42%,rgb(56,189,248) 78%,rgb(186,230,253) 100%);box-shadow:0 0 20px rgba(14,165,233,.6),inset 0 2px 6px rgba(255,255,255,.65)}
.dc-sca-energy-bar.is-jjk-kame-bar .dc-sca-beam.is-sukuna-beam{background:linear-gradient(270deg,rgb(88,28,135) 0%,rgb(190,18,60) 45%,rgb(244,63,94) 82%,rgb(253,164,175) 100%);box-shadow:0 0 20px rgba(244,63,94,.6),inset 0 2px 6px rgba(255,255,255,.55)}
.dc-jjk-spiral-stream{position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.45) 0 12px,transparent 12px 26px);background-size:52px 100%;animation:dcJjkStream 0.65s linear infinite;pointer-events:none}
.dc-jjk-spiral-stream.is-crimson{animation-direction:reverse}
@keyframes dcJjkStream{0%{background-position:0 0}100%{background-position:52px 0}}
.dc-jjk-wave-svg{display:block;overflow:visible;filter:drop-shadow(0 0 6px rgba(56,189,248,.8))}
.dc-jjk-wave-svg.is-crimson{filter:drop-shadow(0 0 6px rgba(244,63,94,.8))}
.dc-jjk-wave-svg .jw-ring{transform-box:fill-box;transform-origin:center;animation:dcRsiAuraPulse .8s ease-in-out infinite}
.dc-jjk-wave-svg .jw-ring.r2{animation-delay:.22s}
.dc-jjk-wave-svg .jw-ring.r3{animation-delay:.44s}

.dc-sca-clash-core.is-hollow-purple-core .dc-sca-clash-hex.is-purple-hex{background:radial-gradient(circle,rgb(243,232,255) 0%,rgb(168,85,247) 52%,rgb(88,28,135) 100%);border-color:rgb(216,180,254);box-shadow:0 0 22px rgb(168,85,247),0 0 36px rgba(56,189,248,.7)}
.dc-sca-clash-ring.is-purple-ring{border-color:rgb(192,132,252)}
.dc-sca-clash-flare.is-purple-flare{background:linear-gradient(180deg,transparent,rgb(192,132,252),rgb(255,255,255),rgb(56,189,248),transparent)}

.dc-sf-flow-dots{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.dc-sf-flow-dots i{position:absolute;top:50%;width:7px;height:7px;border-radius:50%;transform:translateY(-50%);opacity:0}
.dc-sf-flow-dots.is-in i{background:rgb(224,242,254);box-shadow:0 0 10px rgb(56,189,248),0 0 16px rgb(168,85,247);animation:dcSfDotIn 1.5s linear infinite}
.dc-sf-flow-dots.is-in i:nth-child(2){animation-delay:.38s;top:30%}
.dc-sf-flow-dots.is-in i:nth-child(3){animation-delay:.76s;top:70%}
.dc-sf-flow-dots.is-in i:nth-child(4){animation-delay:1.14s}
.dc-sf-flow-dots.is-out i{background:rgb(254,205,211);box-shadow:0 0 10px rgb(244,63,94);animation:dcSfDotOut 1.7s linear infinite}
.dc-sf-flow-dots.is-out i:nth-child(2){animation-delay:.55s;top:32%}
.dc-sf-flow-dots.is-out i:nth-child(3){animation-delay:1.1s;top:68%}
@keyframes dcSfDotIn{0%{left:4%;opacity:0;transform:translateY(-50%) scale(.6)}20%{opacity:.95}85%{opacity:.95}100%{left:92%;opacity:0;transform:translateY(-50%) scale(1.15)}}
@keyframes dcSfDotOut{0%{right:4%;opacity:0;transform:translateY(-50%) scale(.6)}20%{opacity:.9}85%{opacity:.9}100%{right:92%;opacity:0;transform:translateY(-50%) scale(1.1)}}

/* Proportional 11-Sector Treemap Heatmap Strip in CRAFT-D */
.dc-jjk-heatmap-strip{display:grid;gap:10px;padding-top:10px;border-top:1px solid rgba(148,163,184,.18)}
.dc-jhs-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:.78rem;color:rgb(226,232,240)}
.dc-jhs-head small{color:rgb(186,230,253);font-weight:700}
.dc-jhs-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px}
.dc-jhs-tile{display:grid;gap:4px;padding:9px 11px;border-radius:10px;border:1px solid rgba(148,163,184,.2);transition:transform .2s ease}
.dc-jhs-tile:hover{transform:translateY(-2px)}
.dc-jhs-tile.is-xl{grid-column:span 3}
.dc-jhs-tile.is-lg{grid-column:span 2}
.dc-jhs-tile.is-md{grid-column:span 2}
.dc-jhs-tile.is-sm{grid-column:span 1;grid-column:span 1}
.dc-jhs-grid>.dc-jhs-tile:nth-child(1){grid-column:span 3}
.dc-jhs-grid>.dc-jhs-tile:nth-child(2){grid-column:span 2}
.dc-jhs-grid>.dc-jhs-tile:nth-child(3){grid-column:span 2}
.dc-jhs-grid>.dc-jhs-tile:nth-child(4){grid-column:span 2}
.dc-jhs-grid>.dc-jhs-tile:nth-child(5){grid-column:span 2}
.dc-jhs-grid>.dc-jhs-tile:nth-child(6){grid-column:span 1;min-width:120px}
.dc-jhs-grid{grid-template-columns:2.4fr 1.5fr 1.35fr 1.55fr 1.6fr 1.4fr}
.dc-jhs-grid>.dc-jhs-tile{grid-column:auto!important;min-width:0}
.dc-jhs-tile.is-in{background:linear-gradient(135deg,rgba(14,165,233,.22),rgba(16,185,129,.16));border-color:rgba(56,189,248,.45)}
.dc-jhs-tile.is-out{background:linear-gradient(135deg,rgba(225,29,72,.24),rgba(136,19,55,.2));border-color:rgba(251,113,133,.45)}
.dc-jhs-top{display:flex;align-items:center;justify-content:space-between;gap:4px;font-size:.71rem;color:rgb(203,213,225);white-space:nowrap;overflow:hidden}
.dc-jhs-top b{color:rgb(248,250,252);font-size:.74rem;overflow:hidden;text-overflow:ellipsis}
.dc-jhs-top span{font-family:var(--aku-font-mono);font-size:.66rem;color:rgb(186,230,253)}
.dc-jhs-main{display:flex;align-items:baseline;justify-content:space-between;gap:6px;flex-wrap:wrap}
.dc-jhs-main strong{font:900 .9rem/1.1 var(--aku-font-mono)}
.dc-jhs-main strong.is-up{color:rgb(52,211,153)}
.dc-jhs-main strong.is-dn{color:rgb(251,113,133)}
.dc-jhs-main em{font-style:normal;font-size:.68rem;font-weight:700;color:rgb(226,232,240)}

/* ==========================================================================
   CRAFT-E: Spatial Price Elevator & Ranked Wall Armor Barrier Cards
   ========================================================================== */
.dc-beauty-stage.is-craft-elevator.is-cond-pullup{background:radial-gradient(85% 85% at 75% 18%,rgba(16,185,129,.25),transparent 65%),linear-gradient(135deg,rgb(8,26,34),rgb(11,16,30))}
.dc-beauty-stage.is-craft-elevator.is-cond-test770{background:radial-gradient(85% 85% at 75% 15%,rgba(245,158,11,.34),rgba(249,115,22,.2) 48%,transparent 72%),linear-gradient(135deg,rgb(32,22,10),rgb(12,16,30))}
.dc-beauty-stage.is-craft-elevator.is-cond-break770{background:radial-gradient(90% 90% at 75% 10%,rgba(16,185,129,.38),rgba(56,189,248,.22) 50%,transparent 75%),linear-gradient(135deg,rgb(6,34,32),rgb(9,18,32))}
.dc-beauty-stage.is-craft-elevator.is-cond-pulldown{background:radial-gradient(85% 85% at 75% 82%,rgba(244,63,94,.32),transparent 65%),linear-gradient(135deg,rgb(36,10,20),rgb(11,15,28))}

.dc-elev-arch-grid{display:grid;grid-template-columns:.88fr 1.32fr;gap:18px;align-items:stretch}
.dc-elev-wing-left{display:grid;gap:12px;align-content:space-between}
.dc-elev-gate{display:grid;gap:6px;padding:12px 15px;border-radius:14px;background:rgba(15,23,42,.55);border:1px solid rgba(148,163,184,.22);transition:border-color .3s ease,box-shadow .3s ease}
.dc-elev-gate.is-ceiling{border-left:4px solid rgb(52,211,153)}
.dc-elev-gate.is-ground{border-left:4px solid rgb(251,113,133)}
.dc-elev-gate.is-ceiling.is-favored{border-color:rgba(52,211,153,.7);box-shadow:0 8px 24px -10px rgba(16,185,129,.45),inset 0 0 18px rgba(16,185,129,.14)}
.dc-elev-gate.is-ground.is-favored{border-color:rgba(251,113,133,.7);box-shadow:0 8px 24px -10px rgba(244,63,94,.45),inset 0 0 18px rgba(244,63,94,.14)}
.dc-eg-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.dc-eg-title{font:800 .83rem/1.25 var(--aku-font-head);color:rgb(241,245,249)}
.dc-eg-fav{padding:2px 9px;border-radius:999px;font:800 .71rem/1.2 var(--aku-font-body)}
.dc-eg-fav.is-up{background:rgba(16,185,129,.24);border:1px solid rgb(52,211,153);color:rgb(167,243,208)}
.dc-eg-fav.is-dn{background:rgba(244,63,94,.24);border:1px solid rgb(251,113,133);color:rgb(254,205,211)}
.dc-eg-fav.is-muted{background:rgba(148,163,184,.16);border:1px solid rgba(148,163,184,.35);color:rgb(203,213,225)}
.dc-eg-px{font:900 1.25rem/1.1 var(--aku-font-mono);font-variant-numeric:tabular-nums}
.dc-eg-px.is-up{color:rgb(52,211,153)}
.dc-eg-px.is-dn{color:rgb(251,113,133)}
.dc-eg-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:.77rem;color:rgb(203,213,225)}
.dc-eg-dist.is-up b{color:rgb(110,231,183);font-family:var(--aku-font-mono)}
.dc-eg-dist.is-dn b{color:rgb(253,164,175);font-family:var(--aku-font-mono)}
.dc-eg-tier{padding:2px 8px;border-radius:6px;background:rgba(30,41,59,.8);font-weight:700;font-size:.71rem;color:rgb(226,232,240)}
.dc-eg-tier.is-tier-s{color:rgb(253,224,71);border:1px solid rgba(250,204,21,.38)}
.dc-eg-route{display:grid;gap:2px;padding-top:6px;border-top:1px dashed rgba(148,163,184,.2);font-size:.74rem;color:rgb(203,213,225)}
.dc-eg-step b{color:rgb(254,240,138);font-family:var(--aku-font-mono)}
.dc-eg-route small{font-size:.7rem;color:rgb(148,163,184)}

.dc-elev-chain-core{display:grid;gap:8px;padding:10px 14px;border-radius:12px;background:linear-gradient(90deg,rgba(16,185,129,.14),rgba(15,23,42,.65));border:1px solid rgba(52,211,153,.38)}
.dc-beauty-stage.is-cond-test770 .dc-elev-chain-core{background:linear-gradient(90deg,rgba(245,158,11,.18),rgba(15,23,42,.65));border-color:rgba(251,191,36,.48)}
.dc-beauty-stage.is-cond-pulldown .dc-elev-chain-core{background:linear-gradient(90deg,rgba(244,63,94,.18),rgba(15,23,42,.65));border-color:rgba(251,113,133,.48)}
.dc-ecc-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.dc-ecc-badge{font:800 .84rem/1.2 var(--aku-font-head);color:rgb(110,231,183)}
.dc-beauty-stage.is-cond-test770 .dc-ecc-badge{color:rgb(253,224,71)}
.dc-beauty-stage.is-cond-pulldown .dc-ecc-badge{color:rgb(253,164,175)}
.dc-ecc-top small{font-size:.71rem;color:rgb(203,213,225)}
.dc-ecc-factors{display:flex;flex-wrap:wrap;gap:6px}
.dc-ecc-chip{padding:3px 8px;border-radius:999px;font:700 .71rem/1.2 var(--aku-font-body)}
.dc-ecc-chip.is-up{background:rgba(16,185,129,.22);border:1px solid rgba(52,211,153,.55);color:rgb(167,243,208)}
.dc-ecc-chip.is-dn{background:rgba(244,63,94,.22);border:1px solid rgba(251,113,133,.55);color:rgb(254,205,211)}

.dc-elev-wing-right{display:grid;grid-template-columns:80px 1fr;gap:14px;align-items:stretch;padding:12px 14px;border-radius:14px;background:rgba(9,14,26,.68);border:1px solid rgba(148,163,184,.2)}
.dc-elev-shaft-col{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:6px;padding:6px 4px;border-radius:12px;background:rgba(15,23,42,.88);border:1px solid rgba(148,163,184,.24)}
.dc-es-cap{font:800 .72rem/1 var(--aku-font-mono);padding:3px 6px;border-radius:6px}
.dc-es-cap.is-top{color:rgb(110,231,183);background:rgba(16,185,129,.16)}
.dc-es-cap.is-bot{color:rgb(253,164,175);background:rgba(244,63,94,.16)}
.dc-es-track{position:relative;flex:1 1 auto;width:100%;min-height:220px;display:flex;justify-content:center}
.dc-es-track::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;transform:translateX(-50%);background:rgba(148,163,184,.25)}
.dc-es-chain{position:absolute;left:50%;width:6px;transform:translateX(-50%);background:repeating-linear-gradient(180deg,rgb(52,211,153) 0 6px,rgba(15,23,42,.2) 6px 11px);box-shadow:0 0 10px rgba(16,185,129,.6);animation:dcElevChainMove 1.1s linear infinite;transition:height .6s ease}
.dc-es-chain.is-fast{animation-duration:.5s}
.dc-es-chain.is-dn{background:repeating-linear-gradient(180deg,rgb(251,113,133) 0 6px,rgba(15,23,42,.2) 6px 11px);box-shadow:0 0 10px rgba(244,63,94,.6);animation-direction:reverse}
@keyframes dcElevChainMove{0%{background-position:0 11px}100%{background-position:0 0}}
.dc-es-cabin{position:absolute;left:50%;transform:translate(-50%,50%);display:grid;place-items:center;padding:4px 7px;border-radius:9px;background:rgb(6,46,38);border:1.8px solid rgb(52,211,153);box-shadow:0 0 16px rgba(16,185,129,.65);transition:bottom .65s cubic-bezier(.22,1,.36,1);z-index:3;white-space:nowrap}
.dc-es-cabin.is-clash{background:rgb(66,32,6);border-color:rgb(251,191,36);box-shadow:0 0 20px rgba(245,158,11,.85)}
.dc-es-cabin.is-dn{background:rgb(56,12,24);border-color:rgb(251,113,133);box-shadow:0 0 16px rgba(244,63,94,.65)}
.dc-es-cabin-ring{position:absolute;inset:-4px;border-radius:11px;border:1.5px solid rgba(52,211,153,.65);opacity:0;pointer-events:none;animation:dcCabinRingPulse 1.5s ease-out infinite}
.dc-es-cabin-ring.r2{animation-delay:.75s}
.dc-es-cabin.is-clash .dc-es-cabin-ring{border-color:rgb(253,224,71)}
.dc-es-cabin.is-dn .dc-es-cabin-ring{border-color:rgb(251,113,133)}
@keyframes dcCabinRingPulse{0%{transform:scale(.95);opacity:.85}100%{transform:scale(1.38);opacity:0}}
.dc-es-cabin-dir{font-style:normal;font-size:.68rem;line-height:1;color:rgb(167,243,208)}
.dc-es-cabin.is-dn .dc-es-cabin-dir{color:rgb(254,205,211)}
.dc-es-cabin b{font:900 .74rem/1.1 var(--aku-font-mono);color:rgb(248,250,252)}

/* Redesigned Wall Strength Barrier Cards ($770, $769, $768, $766) */
.dc-elev-ladder.is-barrier-ladder{display:grid;gap:8px;align-content:space-between}
.dc-el-barrier{position:relative;overflow:hidden;display:grid;gap:6px;padding:9px 13px;border-radius:11px;background:rgba(15,23,42,.58);border:1px solid rgba(148,163,184,.2);border-left:4px solid rgba(148,163,184,.45);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}
.dc-el-barrier.is-res-wall{border-left-color:rgb(52,211,153);background:linear-gradient(90deg,rgba(16,185,129,.16),rgba(15,23,42,.6))}
.dc-el-barrier.is-fortress-wall{border-left-color:rgb(251,146,60);background:linear-gradient(90deg,rgba(249,115,22,.18),rgba(15,23,42,.62))}
.dc-el-barrier.is-minor-wall{border-left-color:rgb(56,189,248);background:linear-gradient(90deg,rgba(56,189,248,.12),rgba(15,23,42,.55))}

/* Active Clash / Breakout / Breakdown Animations on Barrier Floors */
.dc-el-barrier.is-active-clash{border-color:rgba(251,191,36,.8);box-shadow:0 0 20px rgba(245,158,11,.35);animation:dcBarrierClashPulse 1.3s ease-in-out infinite}
.dc-el-barrier.is-broken-up{border-color:rgb(52,211,153);border-left-color:rgb(52,211,153);background:linear-gradient(90deg,rgba(16,185,129,.28),rgba(6,182,212,.18));box-shadow:0 0 22px rgba(16,185,129,.45)}
.dc-el-barrier.is-broken-dn{border-color:rgba(251,113,133,.8);border-left-color:rgb(244,63,94);background:linear-gradient(90deg,rgba(244,63,94,.24),rgba(15,23,42,.65));box-shadow:0 0 18px rgba(244,63,94,.35)}
.dc-elb-fx-wave{position:absolute;inset:0;background:linear-gradient(90deg,transparent 0%,rgba(253,224,71,.22) 50%,transparent 100%);transform:translateX(-100%);pointer-events:none}
.dc-el-barrier.is-active-clash .dc-elb-fx-wave{animation:dcBarrierWaveSweep 1.5s ease-in-out infinite}
.dc-el-barrier.is-broken-up .dc-elb-fx-wave{background:linear-gradient(90deg,transparent 0%,rgba(52,211,153,.3) 50%,transparent 100%);animation:dcBarrierWaveSweep 1.2s ease-in-out infinite}
@keyframes dcBarrierClashPulse{0%,100%{box-shadow:0 0 12px rgba(245,158,11,.25)}50%{box-shadow:0 0 24px rgba(251,191,36,.65),inset 0 0 14px rgba(245,158,11,.22)}}
@keyframes dcBarrierWaveSweep{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}

.dc-elb-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;position:relative;z-index:1}
.dc-elb-id{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap}
.dc-elb-px{font:900 1rem/1 var(--aku-font-mono);color:rgb(248,250,252)}
.dc-elb-role{padding:2px 8px;border-radius:6px;font:800 .68rem/1.15 var(--aku-font-body)}
.dc-elb-role.is-cw{background:rgba(16,185,129,.24);border:1px solid rgba(52,211,153,.5);color:rgb(167,243,208)}
.dc-elb-role.is-fort{background:rgba(249,115,22,.24);border:1px solid rgba(251,146,60,.55);color:rgb(254,215,170)}
.dc-elb-role.is-sup{background:rgba(56,189,248,.18);border:1px solid rgba(56,189,248,.4);color:rgb(186,230,253)}
.dc-elb-role.is-clash-badge{background:rgba(245,158,11,.32);border:1px solid rgb(253,224,71);color:rgb(254,249,195)}
.dc-elb-role.is-broken-badge{background:rgba(244,63,94,.28);border:1px solid rgb(251,113,133);color:rgb(254,205,211)}
.dc-elb-rank{padding:2px 7px;border-radius:999px;font:700 .66rem/1.15 var(--aku-font-body)}
.dc-elb-rank.is-rank-2{background:rgba(250,204,21,.18);border:1px solid rgba(250,204,21,.45);color:rgb(254,240,138)}
.dc-elb-rank.is-rank-3{background:rgba(249,115,22,.2);border:1px solid rgba(251,146,60,.45);color:rgb(253,186,116)}
.dc-elb-rank.is-rank-minor{background:rgba(148,163,184,.16);color:rgb(203,213,225)}
.dc-elb-dist{font:800 .76rem/1 var(--aku-font-mono);font-style:normal;white-space:nowrap}
.dc-elb-dist.is-up{color:rgb(52,211,153)}
.dc-elb-dist.is-clash{color:rgb(253,224,71)}
.dc-elb-dist.is-dn{color:rgb(251,113,133)}

.dc-elb-armor-row{display:grid;grid-template-columns:120px 1fr;align-items:center;gap:10px;position:relative;z-index:1}
.dc-elb-armor-track{height:7px;border-radius:999px;background:rgba(15,23,42,.85);border:1px solid rgba(148,163,184,.25);overflow:hidden}
.dc-elb-armor-track i{display:block;height:100%;border-radius:999px}
.dc-elb-armor-track i.is-cw-bar{background:linear-gradient(90deg,rgb(16,185,129),rgb(110,231,183));box-shadow:0 0 10px rgba(16,185,129,.6)}
.dc-elb-armor-track i.is-fort-bar{background:linear-gradient(90deg,rgb(245,158,11),rgb(253,224,71));box-shadow:0 0 10px rgba(245,158,11,.6)}
.dc-elb-armor-track i.is-sup-bar{background:linear-gradient(90deg,rgb(14,165,233),rgb(125,211,252))}
.dc-elb-factors{font-size:.71rem;color:rgb(203,213,225);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.dc-el-cabin-banner{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:8px 12px;border-radius:10px;background:linear-gradient(90deg,rgba(16,185,129,.28),rgba(6,182,212,.2));border:1.5px solid rgb(52,211,153);box-shadow:0 0 18px rgba(16,185,129,.28)}
.dc-beauty-stage.is-cond-test770 .dc-el-cabin-banner{background:linear-gradient(90deg,rgba(245,158,11,.32),rgba(249,115,22,.22));border-color:rgb(253,224,71);box-shadow:0 0 20px rgba(245,158,11,.38)}
.dc-beauty-stage.is-cond-pulldown .dc-el-cabin-banner{background:linear-gradient(90deg,rgba(244,63,94,.28),rgba(249,115,22,.18));border-color:rgb(251,113,133);box-shadow:0 0 18px rgba(244,63,94,.28)}
.dc-ecb-pulse{width:8px;height:8px;border-radius:50%;background:rgb(52,211,153);box-shadow:0 0 10px rgb(52,211,153);animation:dcRsiAuraPulse 1.2s ease-in-out infinite}
.dc-beauty-stage.is-cond-test770 .dc-ecb-pulse{background:rgb(253,224,71);box-shadow:0 0 10px rgb(253,224,71)}
.dc-beauty-stage.is-cond-pulldown .dc-ecb-pulse{background:rgb(251,113,133);box-shadow:0 0 10px rgb(251,113,133)}
.dc-el-cabin-banner strong{font:900 .85rem/1.2 var(--aku-font-mono);color:rgb(248,250,252)}
.dc-ecb-chain-tag{font:700 .73rem/1.2 var(--aku-font-body);color:rgb(167,243,208)}
.dc-beauty-stage.is-cond-test770 .dc-ecb-chain-tag{color:rgb(254,240,138)}
.dc-beauty-stage.is-cond-pulldown .dc-ecb-chain-tag{color:rgb(254,205,211)}

/* ==========================================================================
   CRAFT-F: 9-Strike 3D GEX Skyline + Orbiting Laser Wall Frame (NO BAR ZOOM)
   + Internal Plasma Flow + High-Density Cluster Strip
   ========================================================================== */
.dc-beauty-stage.is-craft-skyline.is-cond-fortress{background:radial-gradient(90% 80% at 50% 25%,rgba(245,158,11,.18),rgba(56,189,248,.12) 55%,transparent 75%),linear-gradient(135deg,rgb(10,18,34),rgb(8,13,24))}
.dc-beauty-stage.is-craft-skyline.is-cond-callsqueeze{background:radial-gradient(90% 80% at 68% 25%,rgba(16,185,129,.26),transparent 70%),linear-gradient(135deg,rgb(7,26,30),rgb(9,15,28))}
.dc-beauty-stage.is-craft-skyline.is-cond-puttest{background:radial-gradient(90% 80% at 18% 25%,rgba(244,63,94,.26),transparent 70%),linear-gradient(135deg,rgb(32,12,20),rgb(9,15,28))}

/* High-Density Confluence Cluster & Gravity Centers Strip */
.dc-gsky-cluster-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:10px 14px;border-radius:12px;background:linear-gradient(90deg,rgba(245,158,11,.18),rgba(16,185,129,.14) 55%,rgba(15,23,42,.7));border:1px solid rgba(251,191,36,.45)}
.dc-gsc-main{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dc-gsc-badge{padding:3px 9px;border-radius:999px;background:rgba(245,158,11,.28);border:1px solid rgb(251,191,36);color:rgb(254,240,138);font:800 .72rem/1.15 var(--aku-font-body)}
.dc-gsc-main strong{font:800 .84rem/1.2 var(--aku-font-head);color:rgb(248,250,252)}
.dc-gsc-main small{font-size:.72rem;color:rgb(203,213,225)}
.dc-gsc-centers{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.dc-gsc-pill{padding:3px 9px;border-radius:8px;font-size:.71rem;font-weight:700;background:rgba(15,23,42,.75);border:1px solid rgba(148,163,184,.3);color:rgb(226,232,240)}
.dc-gsc-pill b{font-family:var(--aku-font-mono)}
.dc-gsc-pill.is-pw{border-color:rgba(251,113,133,.55);color:rgb(254,205,211)}
.dc-gsc-pill.is-spot{border-color:rgba(52,211,153,.55);color:rgb(167,243,208)}
.dc-gsc-pill.is-zg{border-color:rgba(56,189,248,.55);color:rgb(186,230,253)}

.dc-gex-sky-grid{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:8px;align-items:stretch}
.dc-gsky-col{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:6px;padding:10px 7px;border-radius:12px;background:rgba(15,23,42,.58);border:1px solid rgba(148,163,184,.16);transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;z-index:1}
.dc-gsky-col>*{position:relative;z-index:2}
.dc-gsky-col:hover{transform:translateY(-3px);border-color:rgba(186,230,253,.55);box-shadow:0 10px 22px -10px rgba(56,189,248,.4)}

/* Orbiting 360-Degree Laser Border Around Put Wall ($765), Call Wall ($770), and Spot ($769) Cards! */
.dc-gsky-col.is-orbit-wall{border-color:transparent!important}
.dc-gsky-col.is-orbit-wall::before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;z-index:0;animation:dcWallOrbitSpin 3.2s linear infinite;pointer-events:none}
.dc-gsky-col.is-pw.is-orbit-wall::before{background:conic-gradient(from 0deg,transparent 0deg 200deg,rgb(244,63,94) 260deg,rgb(254,240,138) 320deg,rgb(251,113,133) 360deg)}
.dc-gsky-col.is-cw.is-orbit-wall::before{background:conic-gradient(from 180deg,transparent 0deg 200deg,rgb(16,185,129) 260deg,rgb(254,240,138) 320deg,rgb(52,211,153) 360deg)}
.dc-gsky-col.is-spot.is-orbit-wall::before{background:conic-gradient(from 90deg,transparent 0deg 210deg,rgb(245,158,11) 275deg,rgb(254,249,195) 330deg,rgb(251,191,36) 360deg)}
.dc-gsky-col.is-orbit-wall::after{content:"";position:absolute;inset:2px;border-radius:10px;z-index:1;pointer-events:none}
.dc-gsky-col.is-pw.is-orbit-wall::after{background:linear-gradient(180deg,rgb(42,12,24) 0%,rgb(15,20,36) 100%)}
.dc-gsky-col.is-cw.is-orbit-wall::after{background:linear-gradient(180deg,rgb(8,38,32) 0%,rgb(15,20,36) 100%)}
.dc-gsky-col.is-spot.is-orbit-wall::after{background:linear-gradient(180deg,rgb(42,28,10) 0%,rgb(15,20,36) 100%)}
@keyframes dcWallOrbitSpin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}

.dc-gsky-col.is-anchor{border-color:rgba(56,189,248,.35)}
.dc-gsky-col.is-in-cluster{box-shadow:0 0 18px -6px rgba(251,191,36,.35)}
.dc-beauty-stage.is-cond-callsqueeze .dc-gsky-col[data-sky-k="770"],.dc-beauty-stage.is-cond-callsqueeze .dc-gsky-col[data-sky-k="771"],.dc-beauty-stage.is-cond-callsqueeze .dc-gsky-col[data-sky-k="772"]{transform:translateY(-3px);box-shadow:0 0 22px rgba(16,185,129,.5)}
.dc-beauty-stage.is-cond-puttest .dc-gsky-col[data-sky-k="765"],.dc-beauty-stage.is-cond-puttest .dc-gsky-col[data-sky-k="769"]{transform:translateY(-3px);box-shadow:0 0 22px rgba(244,63,94,.5)}

.dc-gsky-crown{align-self:center;padding:2px 6px;border-radius:999px;font:800 .62rem/1.15 var(--aku-font-body);white-space:nowrap}
.dc-gsky-crown.is-pw{background:rgba(244,63,94,.28);border:1px solid rgb(251,113,133);color:rgb(254,205,211)}
.dc-gsky-crown.is-cw{background:rgba(16,185,129,.28);border:1px solid rgb(52,211,153);color:rgb(167,243,208)}
.dc-gsky-crown.is-spot{background:rgba(245,158,11,.28);border:1px solid rgb(251,191,36);color:rgb(254,240,138)}
.dc-gsky-crown.is-star{background:rgba(56,189,248,.2);border:1px solid rgba(56,189,248,.5);color:rgb(186,230,253)}
.dc-gsky-crown.is-empty{opacity:0;user-select:none}

.dc-gsky-gex{text-align:center;font:800 .74rem/1 var(--aku-font-mono);font-variant-numeric:tabular-nums}
.dc-gsky-gex.is-pos{color:rgb(52,211,153)}
.dc-gsky-gex.is-neg{color:rgb(251,113,133)}

/* 3D GEX Towers — NO SCALE/ZOOM! Instead, Internal Flowing Plasma & Laser Scanline */
.dc-gsky-tower-wrap{height:76px;display:flex;align-items:flex-end;justify-content:center;padding:0 8px;border-bottom:1px solid rgba(148,163,184,.24)}
.dc-gsky-tower{width:100%;max-width:34px;border-radius:6px 6px 0 0;position:relative;overflow:hidden;transition:height .5s ease}
.dc-gsky-tower::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;border-radius:6px 6px 0 0;background:rgba(255,255,255,.8);z-index:3}
.dc-gsky-tower.is-pos{background:linear-gradient(180deg,rgb(52,211,153),rgba(5,150,105,.38));box-shadow:0 0 14px rgba(16,185,129,.45)}
.dc-gsky-tower.is-neg{background:linear-gradient(180deg,rgb(251,113,133),rgba(225,29,72,.38));box-shadow:0 0 14px rgba(244,63,94,.42)}
.dc-gsky-tower.is-spot-bar{background:linear-gradient(180deg,rgb(253,224,71),rgba(245,158,11,.4));box-shadow:0 0 16px rgba(245,158,11,.55)}

/* Internal Rising Plasma Bands & Laser Scanline Inside Put Wall / Call Wall / Spot Towers */
.dc-gsky-tower-stream{position:absolute;inset:0;background:repeating-linear-gradient(180deg,rgba(255,255,255,.32) 0 6px,transparent 6px 14px);background-size:100% 28px;animation:dcTowerStreamRise 1.2s linear infinite;pointer-events:none;z-index:1}
.dc-gsky-tower-scan{position:absolute;left:0;right:0;height:8px;background:linear-gradient(180deg,rgba(255,255,255,.85),transparent);filter:blur(.5px);animation:dcTowerScanUp 1.9s ease-in-out infinite;pointer-events:none;z-index:2}
.dc-gsky-tower-cap{position:absolute;top:0;left:0;right:0;height:4px;background:rgb(255,255,255);box-shadow:0 0 12px rgb(255,255,255);z-index:4}
@keyframes dcTowerStreamRise{0%{background-position:0 28px}100%{background-position:0 0}}
@keyframes dcTowerScanUp{0%{bottom:-10%;opacity:0}25%{opacity:.95}80%{opacity:.95}100%{bottom:100%;opacity:0}}

.dc-gsky-k-box{display:grid;place-items:center;gap:2px;padding-bottom:6px;border-bottom:1px dashed rgba(148,163,184,.2)}
.dc-gsky-k{font:900 1.08rem/1 var(--aku-font-mono);color:rgb(248,250,252)}
.dc-gsky-col.is-pw .dc-gsky-k{color:rgb(253,164,175)}
.dc-gsky-col.is-cw .dc-gsky-k{color:rgb(110,231,183)}
.dc-gsky-col.is-spot .dc-gsky-k{color:rgb(254,240,138)}
.dc-gsky-pt{font-size:.66rem;color:rgb(148,163,184)}
.dc-gsky-pt b{color:rgb(226,232,240);font-family:var(--aku-font-mono)}
.dc-gsky-rank{margin-top:2px;padding:2px 6px;border-radius:5px;font:800 .62rem/1.15 var(--aku-font-body);background:rgba(249,115,22,.26);border:1px solid rgba(251,146,60,.6);color:rgb(254,215,170);white-space:nowrap}

.dc-gsky-factors{display:grid;gap:4px;align-content:start}
.dc-gsky-f{display:flex;align-items:center;justify-content:space-between;gap:3px;padding:3px 4px;border-radius:5px;background:rgba(9,14,26,.55);border-left:2.5px solid rgba(148,163,184,.45);font-size:.61rem;line-height:1.15;color:rgb(226,232,240);white-space:nowrap}
.dc-gsky-f.is-t1{border-left-color:rgb(250,204,21);background:rgba(245,158,11,.14);color:rgb(254,249,195)}
.dc-gsky-f.is-t2{border-left-color:rgb(56,189,248);background:rgba(56,189,248,.12)}
.dc-gsky-f b{font-family:var(--aku-font-mono);font-size:.64rem;color:rgb(110,231,183)}
.dc-gsky-f.is-t1 b{color:rgb(253,224,71)}

.dc-gsky-legend{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-top:10px;border-top:1px solid rgba(148,163,184,.18);font-size:.73rem;color:rgb(203,213,225)}
.dc-gsl-lead{color:rgb(241,245,249)}
.dc-gsl-chip{padding:3px 9px;border-radius:999px;font-size:.7rem;font-weight:700}
.dc-gsl-chip.is-fire{background:rgba(249,115,22,.2);border:1px solid rgba(251,146,60,.45);color:rgb(254,215,170)}
.dc-gsl-chip.is-t1{background:rgba(245,158,11,.16);border:1px solid rgba(250,204,21,.4);color:rgb(254,240,138)}
.dc-gsl-chip.is-t2{background:rgba(56,189,248,.16);border:1px solid rgba(56,189,248,.4);color:rgb(186,230,253)}

@media (max-width:1100px){
 .dc-elev-arch-grid,.dc-sf-hero-strip,.dc-jhs-grid{grid-template-columns:1fr}
 .dc-gex-sky-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.dc-sca-battle-stage.is-jjk-kame-stage .dc-sca-energy-hud{margin-bottom:10px}
.dc-sca-battle-stage.is-jjk-kame-stage .dc-sca-hud-mid{white-space:nowrap}
.dc-jjk-treemap-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
.dc-jjk-tm-cell{grid-column:span 1!important}
.dc-jjk-tm-top strong{overflow:visible!important;text-overflow:clip!important}
.dc-elb-tags{white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.dc-jhs-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
.dc-jhs-tile{grid-column:span 1!important}
.dc-jhs-top b{overflow:visible!important;text-overflow:clip!important}

/* === v28 UPGRADE: CRAFT-E Confluence Infographic & CRAFT-F High-Intensity Dual-Laser Orbiting Wall Frames === */
.dc-ecc-spot-hero{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:9px 12px;margin-bottom:4px;border-radius:10px;background:linear-gradient(90deg,rgba(16,185,129,.2),rgba(56,189,248,.12));border:1px solid rgba(52,211,153,.45);box-shadow:0 4px 14px rgba(16,185,129,.14)}
.dc-ecc-spot-top{display:flex;align-items:center;gap:8px}
.dc-ecc-spot-top strong{font:800 .86rem/1.2 var(--aku-font-mono);color:rgb(167,243,208)}
.dc-ecc-spot-route{font:700 .74rem/1.25 var(--aku-font-body);color:rgb(224,242,254);padding:3px 9px;border-radius:999px;background:rgba(15,23,42,.68);border:1px solid rgba(125,211,252,.32)}
.dc-el-section-tag{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:5px 10px;border-radius:8px;font:600 .72rem/1.25 var(--aku-font-body)}
.dc-el-section-tag.is-res-tag{background:rgba(244,63,94,.11);border-left:3.5px solid rgb(251,113,133);color:rgb(254,205,211)}
.dc-el-section-tag.is-sup-tag{background:rgba(16,185,129,.11);border-left:3.5px solid rgb(52,211,153);color:rgb(167,243,208)}
.dc-el-section-tag small{font:600 .68rem/1.2 var(--aku-font-body);color:rgb(203,213,225)}
.dc-el-barrier.is-major-wall{padding:12px 14px;border-width:1.5px}
.dc-elb-overlap-ribbon{display:flex;align-items:center;gap:6px;padding:4px 10px;margin-bottom:6px;border-radius:7px;background:linear-gradient(90deg,rgba(245,158,11,.24),rgba(251,191,36,.08));border:1px solid rgba(251,191,36,.48);font:700 .72rem/1.25 var(--aku-font-body);color:rgb(254,240,138)}
.dc-elb-confluence-vis{display:grid;gap:7px;margin-top:4px}
.dc-elb-seg-bar{display:flex;align-items:stretch;height:22px;border-radius:7px;overflow:hidden;border:1px solid rgba(148,163,184,.3);background:rgba(2,6,23,.85)}
.dc-elb-seg{display:flex;align-items:center;justify-content:center;font:800 .66rem/1 var(--aku-font-body);white-space:nowrap;padding:0 6px;border-right:1px solid rgba(2,6,23,.75)}
.dc-elb-seg.is-gex{background:linear-gradient(90deg,rgba(16,185,129,.42),rgba(52,211,153,.62));color:rgb(236,253,245)}
.dc-elb-seg.is-gap{background:linear-gradient(90deg,rgba(245,158,11,.42),rgba(251,191,36,.6));color:rgb(254,252,232)}
.dc-elb-seg.is-touch{background:linear-gradient(90deg,rgba(56,189,248,.35),rgba(96,165,250,.5));color:rgb(224,242,254)}
.dc-elb-seg.is-ema{background:linear-gradient(90deg,rgba(245,158,11,.48),rgba(251,191,36,.68));color:rgb(254,252,232)}
.dc-elb-seg.is-vwap{background:linear-gradient(90deg,rgba(56,189,248,.42),rgba(14,165,233,.62));color:rgb(224,242,254)}
.dc-elb-seg.is-orb{background:linear-gradient(90deg,rgba(168,85,247,.38),rgba(192,132,252,.56));color:rgb(250,245,255)}
.dc-elb-seg.is-low{background:linear-gradient(90deg,rgba(16,185,129,.38),rgba(52,211,153,.55));color:rgb(236,253,245)}
.dc-elb-pill-list{display:flex;flex-wrap:wrap;gap:5px}
.dc-elb-fchip{padding:3px 8px;border-radius:6px;font:600 .68rem/1.25 var(--aku-font-body);background:rgba(15,23,42,.82);border:1px solid rgba(148,163,184,.26);color:rgb(226,232,240)}
.dc-elb-fchip.is-gex{border-color:rgba(52,211,153,.45);color:rgb(167,243,208)}
.dc-elb-fchip.is-gap,.dc-elb-fchip.is-ema{border-color:rgba(251,191,36,.45);color:rgb(254,240,138)}
.dc-elb-fchip.is-vwap{border-color:rgba(56,189,248,.45);color:rgb(186,230,253)}
.dc-elb-fchip.is-orb{border-color:rgba(192,132,252,.45);color:rgb(233,213,255)}
.dc-elb-fchip.is-low{border-color:rgba(52,211,153,.42);color:rgb(167,243,208)}
.dc-el-laser-sightline{display:flex;align-items:center;gap:8px;padding:2px 0}
.dc-els-beam{flex:1;height:2px;background:linear-gradient(90deg,transparent,rgb(52,211,153),rgb(56,189,248),transparent);box-shadow:0 0 10px rgba(52,211,153,.6)}
.dc-els-pill{padding:4px 12px;border-radius:999px;background:rgba(6,78,59,.88);border:1.5px solid rgb(52,211,153);font:700 .72rem/1.2 var(--aku-font-body);color:rgb(236,253,245);box-shadow:0 0 14px rgba(16,185,129,.35);white-space:nowrap}
.dc-el-minor-cushions-wrap{display:grid;gap:6px;padding:8px 10px;border-radius:11px;background:rgba(9,16,29,.65);border:1px dashed rgba(148,163,184,.28)}
.dc-el-minor-head{font:600 .7rem/1.25 var(--aku-font-body);color:rgb(148,163,184)}
.dc-el-minor-head b{color:rgb(226,232,240)}
.dc-el-minor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dc-elb-minor-meta{display:grid;gap:4px}

/* CRAFT-F: High-Intensity Dual-Beam 3.5px Orbiting Laser Frame + Elevated Pedestals vs Recessed Minor Columns */
.dc-gsky-col.is-minor{opacity:.64;transform:scale(.96);filter:saturate(.75);transition:opacity .25s ease,transform .25s ease}
.dc-gsky-col.is-minor:hover{opacity:.92;transform:scale(.99)}
.dc-gsky-col.is-orbit-wall{padding:11px 7px;transform:translateY(-6px);z-index:4}
.dc-gsky-col.is-orbit-wall::after{inset:3.2px!important;border-radius:9.5px!important}
.dc-gsky-col.is-pw.is-orbit-wall{box-shadow:0 0 28px rgba(244,63,94,.48),0 0 52px rgba(244,63,94,.22),inset 0 0 22px rgba(244,63,94,.22)!important}
.dc-gsky-col.is-pw.is-orbit-wall::before{background:conic-gradient(from 0deg,transparent 0deg 20deg,rgba(244,63,94,.95) 35deg 130deg,rgb(254,240,138) 145deg 168deg,rgb(255,255,255) 172deg 180deg,transparent 180deg 200deg,rgba(244,63,94,.95) 215deg 310deg,rgb(254,240,138) 325deg 348deg,rgb(255,255,255) 352deg 360deg)!important;animation:dcWallOrbitSpin 2.3s linear infinite!important}
.dc-gsky-col.is-cw.is-orbit-wall{box-shadow:0 0 28px rgba(16,185,129,.52),0 0 54px rgba(56,189,248,.24),inset 0 0 22px rgba(16,185,129,.22)!important}
.dc-gsky-col.is-cw.is-orbit-wall::before{background:conic-gradient(from 90deg,transparent 0deg 20deg,rgba(16,185,129,.95) 35deg 130deg,rgb(125,211,252) 145deg 168deg,rgb(255,255,255) 172deg 180deg,transparent 180deg 200deg,rgba(16,185,129,.95) 215deg 310deg,rgb(254,240,138) 325deg 348deg,rgb(255,255,255) 352deg 360deg)!important;animation:dcWallOrbitSpin 2.3s linear infinite!important}
.dc-gsky-col.is-spot.is-orbit-wall{box-shadow:0 0 26px rgba(251,191,36,.46),0 0 48px rgba(245,158,11,.2),inset 0 0 20px rgba(251,191,36,.2)!important}
.dc-gsky-col.is-spot.is-orbit-wall::before{background:conic-gradient(from 180deg,transparent 0deg 25deg,rgba(245,158,11,.95) 40deg 130deg,rgb(254,240,138) 145deg 168deg,rgb(255,255,255) 172deg 180deg,transparent 180deg 205deg,rgba(245,158,11,.95) 220deg 310deg,rgb(254,240,138) 325deg 348deg,rgb(255,255,255) 352deg 360deg)!important;animation:dcWallOrbitSpin 2.6s linear infinite!important}
@media (max-width:720px){.dc-el-minor-grid{grid-template-columns:1fr}}

/* === v29 POLISH: Quad-Beam 360 Orbiting Laser Wall Frame (4 Laser Heads on All 4 Edges) & CRAFT-E Dynamic Sightline === */
.dc-elb-overlap-ribbon{display:block!important;line-height:1.35!important}
.dc-elb-seg{overflow:hidden;text-overflow:ellipsis}
.dc-ecc-spot-hero.is-clash{background:linear-gradient(90deg,rgba(245,158,11,.25),rgba(251,191,36,.12));border-color:rgba(251,191,36,.6);box-shadow:0 4px 16px rgba(245,158,11,.22)}
.dc-ecc-spot-hero.is-clash .dc-ecc-spot-top strong{color:rgb(254,240,138)}
.dc-ecc-spot-hero.is-dn{background:linear-gradient(90deg,rgba(244,63,94,.24),rgba(225,29,72,.12));border-color:rgba(251,113,133,.6);box-shadow:0 4px 16px rgba(244,63,94,.22)}
.dc-ecc-spot-hero.is-dn .dc-ecc-spot-top strong{color:rgb(254,205,211)}
.dc-el-laser-sightline.is-clash .dc-els-beam{background:linear-gradient(90deg,transparent,rgb(251,191,36),rgb(254,240,138),transparent);box-shadow:0 0 12px rgba(251,191,36,.75)}
.dc-el-laser-sightline.is-clash .dc-els-pill{background:rgba(120,53,15,.92);border-color:rgb(251,191,36);color:rgb(254,240,138);box-shadow:0 0 16px rgba(245,158,11,.45)}
.dc-el-laser-sightline.is-dn .dc-els-beam{background:linear-gradient(90deg,transparent,rgb(244,63,94),rgb(251,113,133),transparent);box-shadow:0 0 12px rgba(244,63,94,.75)}
.dc-el-laser-sightline.is-dn .dc-els-pill{background:rgba(136,19,55,.92);border-color:rgb(251,113,133);color:rgb(254,226,226);box-shadow:0 0 16px rgba(244,63,94,.45)}

/* CRAFT-F: 4-Head Quad-Laser Conic Gradient so ALL 4 SIDES of Put Wall, Call Wall, and Spot glow with running light beams simultaneously! */
.dc-gsky-col.is-orbit-wall{padding:12px 9px!important}
.dc-gsky-col.is-orbit-wall .dc-gsky-f{padding:3px 6px!important}
.dc-gsky-col.is-orbit-wall::after{inset:3.6px!important;border-radius:9px!important}
.dc-gsky-col.is-pw.is-orbit-wall{box-shadow:0 0 32px rgba(244,63,94,.65),0 0 64px rgba(244,63,94,.32),inset 0 0 26px rgba(244,63,94,.28)!important}
.dc-gsky-col.is-pw.is-orbit-wall::before{background:conic-gradient(from 0deg,rgba(225,29,72,.55) 0deg 28deg,rgb(244,63,94) 28deg 58deg,rgb(251,146,60) 58deg 76deg,rgb(255,255,255) 76deg 90deg,rgba(225,29,72,.55) 90deg 118deg,rgb(244,63,94) 118deg 148deg,rgb(251,146,60) 148deg 166deg,rgb(255,255,255) 166deg 180deg,rgba(225,29,72,.55) 180deg 208deg,rgb(244,63,94) 208deg 238deg,rgb(251,146,60) 238deg 256deg,rgb(255,255,255) 256deg 270deg,rgba(225,29,72,.55) 270deg 298deg,rgb(244,63,94) 298deg 328deg,rgb(251,146,60) 328deg 346deg,rgb(255,255,255) 346deg 360deg)!important;animation:dcWallOrbitSpin 2.2s linear infinite!important}
.dc-gsky-col.is-cw.is-orbit-wall{box-shadow:0 0 32px rgba(16,185,129,.68),0 0 64px rgba(56,189,248,.34),inset 0 0 26px rgba(16,185,129,.28)!important}
.dc-gsky-col.is-cw.is-orbit-wall::before{background:conic-gradient(from 45deg,rgba(5,150,105,.55) 0deg 28deg,rgb(16,185,129) 28deg 58deg,rgb(56,189,248) 58deg 76deg,rgb(255,255,255) 76deg 90deg,rgba(5,150,105,.55) 90deg 118deg,rgb(16,185,129) 118deg 148deg,rgb(56,189,248) 148deg 166deg,rgb(255,255,255) 166deg 180deg,rgba(5,150,105,.55) 180deg 208deg,rgb(16,185,129) 208deg 238deg,rgb(56,189,248) 238deg 256deg,rgb(255,255,255) 256deg 270deg,rgba(5,150,105,.55) 270deg 298deg,rgb(16,185,129) 298deg 328deg,rgb(56,189,248) 328deg 346deg,rgb(255,255,255) 346deg 360deg)!important;animation:dcWallOrbitSpin 2.2s linear infinite!important}
.dc-gsky-col.is-spot.is-orbit-wall{box-shadow:0 0 30px rgba(251,191,36,.62),0 0 58px rgba(245,158,11,.3),inset 0 0 24px rgba(251,191,36,.25)!important}
.dc-gsky-col.is-spot.is-orbit-wall::before{background:conic-gradient(from 22deg,rgba(180,83,9,.55) 0deg 28deg,rgb(245,158,11) 28deg 58deg,rgb(254,240,138) 58deg 76deg,rgb(255,255,255) 76deg 90deg,rgba(180,83,9,.55) 90deg 118deg,rgb(245,158,11) 118deg 148deg,rgb(254,240,138) 148deg 166deg,rgb(255,255,255) 166deg 180deg,rgba(180,83,9,.55) 180deg 208deg,rgb(245,158,11) 208deg 238deg,rgb(254,240,138) 238deg 256deg,rgb(255,255,255) 256deg 270deg,rgba(180,83,9,.55) 270deg 298deg,rgb(245,158,11) 298deg 328deg,rgb(254,240,138) 328deg 346deg,rgb(255,255,255) 346deg 360deg)!important;animation:dcWallOrbitSpin 2.5s linear infinite!important}
.dc-gex-sky-grid{grid-template-columns:1.22fr .86fr .9fr .86fr 1.25fr 1.25fr .96fr .96fr .86fr!important;gap:7px!important}
@media (max-width:1100px){.dc-gex-sky-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
.dc-gex-sky-grid{grid-template-columns:1.24fr .84fr .88fr .84fr 1.28fr 1.28fr .96fr .96fr .84fr!important;gap:7px!important}
@media (max-width:1100px){.dc-gex-sky-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
.dc-gsky-col.is-minor{padding:8px 4px!important}
.dc-gsky-col.is-minor .dc-gsky-f{padding:2px 4px!important;font-size:.58rem!important}
.dc-gsky-col.is-minor .dc-gsky-f b{font-size:.6rem!important}

/* === v32: SPACIOUS NON-REDUNDANT CRAFT-E INFOGRAPHIC & SLOW CALM ORBITING LASER BORDERS ON CRAFT-F === */
.dc-elev-ladder.is-clean-infographic{display:flex;flex-direction:column;justify-content:space-between;gap:12px}
.dc-elev-ladder.is-clean-infographic .dc-el-barrier.is-major-wall{padding:14px 16px;gap:10px;border-radius:14px}
.dc-elb-meter-line{height:6px;border-radius:999px;background:rgba(15,23,42,.9);border:1px solid rgba(148,163,184,.2);overflow:hidden}
.dc-elb-meter-line.is-thin{height:4.5px}
.dc-elb-meter-line>i{display:block;height:100%;border-radius:999px}
.dc-elb-meter-line>i.is-cw-bar{background:linear-gradient(90deg,rgb(16,185,129),rgb(52,211,153),rgb(125,211,252));box-shadow:0 0 10px rgba(52,211,153,.5)}
.dc-elb-meter-line>i.is-fort-bar{background:linear-gradient(90deg,rgb(245,158,11),rgb(251,191,36),rgb(254,240,138));box-shadow:0 0 10px rgba(251,191,36,.5)}
.dc-elb-meter-line>i.is-sup-bar{background:linear-gradient(90deg,rgb(14,165,233),rgb(56,189,248))}
.dc-elb-clean-grid{display:grid;gap:8px}
.dc-elb-clean-grid.is-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.dc-elb-clean-grid.is-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.dc-elb-stat{display:flex;flex-direction:column;gap:3px;padding:8px 10px;border-radius:9px;background:rgba(9,15,28,.78);border:1px solid rgba(148,163,184,.22)}
.dc-elb-stat span{font:600 .68rem/1.2 var(--aku-font-body);color:rgb(203,213,225)}
.dc-elb-stat b{font:800 .78rem/1.2 var(--aku-font-mono);color:rgb(248,250,252)}
.dc-elb-stat.is-gex{border-left:3px solid rgb(52,211,153);background:rgba(6,78,59,.22)}
.dc-elb-stat.is-gex b{color:rgb(167,243,208)}
.dc-elb-stat.is-gap,.dc-elb-stat.is-ema{border-left:3px solid rgb(251,191,36);background:rgba(120,53,15,.22)}
.dc-elb-stat.is-gap b,.dc-elb-stat.is-ema b{color:rgb(254,240,138)}
.dc-elb-stat.is-vwap,.dc-elb-stat.is-touch{border-left:3px solid rgb(56,189,248);background:rgba(12,74,110,.22)}
.dc-elb-stat.is-vwap b,.dc-elb-stat.is-touch b{color:rgb(186,230,253)}
.dc-elb-stat.is-orb{border-left:3px solid rgb(192,132,252);background:rgba(88,28,135,.22)}
.dc-elb-stat.is-orb b{color:rgb(233,213,255)}
.dc-elb-stat.is-low{border-left:3px solid rgb(52,211,153);background:rgba(6,78,59,.2)}
.dc-elb-stat.is-low b{color:rgb(167,243,208)}
.dc-elb-minor-tags{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font:600 .7rem/1.25 var(--aku-font-body);color:rgb(203,213,225)}
.dc-elb-minor-tags b{font:800 .72rem/1.2 var(--aku-font-mono);color:rgb(186,230,253)}

/* CRAFT-F: SLOW DOWN ORBITING LASER BORDERS (From 2.2s -> 9s calm luxury orbit!) */
.dc-gsky-col.is-pw.is-orbit-wall::before{animation:dcWallOrbitSpin 9s linear infinite!important}
.dc-gsky-col.is-cw.is-orbit-wall::before{animation:dcWallOrbitSpin 9s linear infinite!important}
.dc-gsky-col.is-spot.is-orbit-wall::before{animation:dcWallOrbitSpin 10.5s linear infinite!important}
.dc-gsky-tower-stream{animation-duration:5.5s!important}
.dc-gsky-tower-scan{animation-duration:6s!important}
@media (max-width:860px){.dc-elb-clean-grid.is-cols-3,.dc-elb-clean-grid.is-cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* === v33: TACTILE IMPACT TREMOR / SHAKE ON COLLIDING WALL BARRIERS (.dc-el-barrier.is-active-clash) === */
@keyframes dcBarrierImpactShake {
  0%, 100% {
    transform: translate3d(0, 0, 0) rotate(0deg);
    border-color: rgba(251, 191, 36, 0.78);
    box-shadow: 0 0 18px rgba(245, 158, 11, 0.24), inset 0 0 14px rgba(245, 158, 11, 0.12);
  }
  4% {
    transform: translate3d(-3.5px, -1.5px, 0) rotate(-0.45deg);
    border-color: rgb(254, 240, 138);
    box-shadow: 0 0 32px rgba(251, 191, 36, 0.72), 0 0 54px rgba(245, 158, 11, 0.35), inset 0 0 24px rgba(254, 240, 138, 0.32);
  }
  8% {
    transform: translate3d(3.5px, 1.5px, 0) rotate(0.45deg);
  }
  12% {
    transform: translate3d(-3px, 1px, 0) rotate(-0.35deg);
  }
  16% {
    transform: translate3d(2.8px, -1px, 0) rotate(0.3deg);
    border-color: rgb(253, 224, 71);
    box-shadow: 0 0 26px rgba(251, 191, 36, 0.58), inset 0 0 18px rgba(251, 191, 36, 0.22);
  }
  20% {
    transform: translate3d(-2px, 0.8px, 0) rotate(-0.2deg);
  }
  24% {
    transform: translate3d(1.5px, -0.5px, 0) rotate(0.15deg);
  }
  28% {
    transform: translate3d(-0.8px, 0.3px, 0) rotate(0deg);
  }
  32% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
}

@keyframes dcArmorBarImpact {
  0%, 32%, 100% { filter: brightness(1); transform: scaleY(1); }
  6%, 14% { filter: brightness(1.55) drop-shadow(0 0 8px rgb(254, 240, 138)); transform: scaleY(1.32); }
}

@keyframes dcCabinRamUp {
  0%, 32%, 100% { transform: translateY(50%); }
  6% { transform: translateY(calc(50% - 6px)) scale(1.06); }
  14% { transform: translateY(calc(50% + 2px)) scale(0.98); }
  22% { transform: translateY(calc(50% - 3px)); }
}

.dc-el-barrier.is-active-clash {
  animation: dcBarrierImpactShake 1.45s cubic-bezier(.36,.07,.19,.97) infinite!important;
  will-change: transform, box-shadow;
}
.dc-el-barrier.is-active-clash .dc-elb-meter-line > i {
  animation: dcArmorBarImpact 1.45s ease-out infinite!important;
}
.dc-el-barrier.is-active-clash .dc-elb-fx-wave {
  animation: dcBarrierWaveSweep 1.45s ease-out infinite!important;
}
.dc-es-cabin.is-clash {
  animation: dcCabinRamUp 1.45s cubic-bezier(.36,.07,.19,.97) infinite!important;
}

/* === v34/v35: INTERMEDIATE FLOOR TICKS ON THE ELEVATOR SHAFT (.dc-es-tick) — ZERO LINE OVERLAP ON CABIN === */
.dc-elev-wing-right.is-ticked-shaft-layout{grid-template-columns:160px minmax(0,1fr)!important;gap:14px!important}
.dc-elev-wing-right.is-ticked-shaft-layout .dc-elev-shaft-col{padding:10px 6px;border-radius:14px;background:rgba(4,9,20,.92);border:1px solid rgba(148,163,184,.24);position:relative}
.dc-elev-wing-right.is-ticked-shaft-layout .dc-es-track{width:100%;position:relative}
.dc-elev-wing-right.is-ticked-shaft-layout .dc-es-track::before{left:34px!important;transform:none!important;width:3px;background:rgba(148,163,184,.3)}
.dc-elev-wing-right.is-ticked-shaft-layout .dc-es-chain{left:32.5px!important;transform:none!important;width:6px}
.dc-elev-wing-right.is-ticked-shaft-layout .dc-es-cabin{left:4px!important;right:auto!important;width:62px;padding:4px 4px;transform:translateY(50%);z-index:12!important;background:rgb(6,46,38)}
.dc-elev-wing-right.is-ticked-shaft-layout .dc-es-cabin.is-clash{background:rgb(66,32,6)!important}
.dc-elev-wing-right.is-ticked-shaft-layout .dc-es-cabin.is-dn{background:rgb(56,12,24)!important}
.dc-elev-wing-right.is-ticked-shaft-layout .dc-es-cabin b{font:800 .74rem/1.1 var(--aku-font-head)!important;font-variant-numeric:tabular-nums}
.dc-es-tick{position:absolute;left:34px;right:2px;display:flex;align-items:center;gap:4px;transform:translateY(50%);z-index:3;pointer-events:none;transition:transform .25s ease,filter .25s ease}
.dc-est-line{width:38px;height:3.5px;border-radius:999px;background:rgba(148,163,184,.55);flex-shrink:0;box-shadow:0 0 6px rgba(148,163,184,.3);transition:width .25s ease,margin-left .25s ease}
.dc-est-tag{display:flex;flex-direction:column;align-items:flex-start;padding:2.5px 6px;border-radius:6px;background:rgba(15,23,42,.96);border:1px solid rgba(148,163,184,.34);line-height:1.1;margin-left:auto;min-width:64px}
.dc-est-tag b{font:800 .7rem/1.1 var(--aku-font-head);font-variant-numeric:tabular-nums;color:rgb(248,250,252)}
.dc-est-tag small{font:700 .55rem/1.1 var(--aku-font-body);color:rgb(148,163,184);white-space:nowrap}
.dc-es-tick.is-cw .dc-est-line{height:4px;background:rgb(52,211,153);box-shadow:0 0 10px rgba(52,211,153,.7)}
.dc-es-tick.is-cw .dc-est-tag{border-color:rgba(52,211,153,.55);background:rgba(6,78,59,.72)}
.dc-es-tick.is-cw .dc-est-tag small{color:rgb(167,243,208)}
.dc-es-tick.is-fort .dc-est-line{height:4px;background:rgb(251,191,36);box-shadow:0 0 10px rgba(251,191,36,.7)}
.dc-es-tick.is-fort .dc-est-tag{border-color:rgba(251,191,36,.55);background:rgba(120,53,15,.72)}
.dc-es-tick.is-fort .dc-est-tag small{color:rgb(254,240,138)}
.dc-es-tick.is-minor .dc-est-line{height:3px;background:rgb(56,189,248)}
.dc-es-tick.is-minor .dc-est-tag{border-color:rgba(56,189,248,.4);background:rgba(12,74,110,.58)}
.dc-es-tick.is-minor .dc-est-tag small{color:rgb(186,230,253)}
.dc-es-tick.is-broken .dc-est-line{background:rgb(244,63,94);box-shadow:0 0 10px rgba(244,63,94,.7)}
.dc-es-tick.is-broken .dc-est-tag{border-color:rgba(251,113,133,.65);background:rgba(136,19,55,.76)}
.dc-es-tick.is-broken .dc-est-tag small{color:rgb(254,205,211)}
@keyframes dcShaftTickShake {
  0%, 32%, 100% { transform: translateY(50%) translateX(0); }
  5% { transform: translateY(calc(50% - 2px)) translateX(-2px); filter: brightness(1.5); }
  10% { transform: translateY(calc(50% + 2px)) translateX(2.5px); }
  16% { transform: translateY(calc(50% - 1.5px)) translateX(-1.5px); }
  22% { transform: translateY(calc(50% + 1px)) translateX(1.5px); }
}
.dc-es-tick.is-hit{z-index:4!important;animation:dcShaftTickShake 1.45s cubic-bezier(.36,.07,.19,.97) infinite!important}
.dc-es-tick.is-hit .dc-est-tag{border-color:rgb(254,240,138);box-shadow:0 0 16px rgba(251,191,36,.75)}
.dc-es-tick.is-hit .dc-est-line{margin-left:32px;width:10px;background:rgb(254,240,138);box-shadow:0 0 14px rgb(254,240,138)}

/* === v36: SINGLE ACTIVE SITUATION HUD PILL (.dc-sca-energy-hud.is-single-status) === */
.dc-sca-energy-hud.is-single-status{display:flex;align-items:center;min-height:28px}
.dc-sca-energy-hud.is-single-status > [hidden]{display:none!important}
.dc-sca-energy-hud.is-single-status > [data-sf-hud-in],
.dc-sca-energy-hud.is-single-status > [data-c-bull-pct]{margin-right:auto;padding:4px 12px;border-radius:999px;font-size:.8rem;box-shadow:0 0 14px rgba(56,189,248,.24)}
.dc-sca-energy-hud.is-single-status > [data-sf-hud-mid],
.dc-sca-energy-hud.is-single-status > [data-c-hud-mid]{margin-inline:auto;padding:4px 14px;border-radius:999px;font-size:.8rem;font-weight:800;color:rgb(254,240,138);background:rgba(120,53,15,.65);border:1px solid rgba(251,191,36,.6);box-shadow:0 0 14px rgba(251,191,36,.28)}
.dc-sca-energy-hud.is-single-status > [data-sf-hud-out],
.dc-sca-energy-hud.is-single-status > [data-c-bear-pct]{margin-left:auto;padding:4px 12px;border-radius:999px;font-size:.8rem;box-shadow:0 0 14px rgba(244,63,94,.28)}

/* === v37: ANTI-WHIPSAW 5M CANDLE LOCK & 3-STEP USAGE STRIP (.dc-elev-howto-bar) === */
.dc-elev-howto-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:10px 14px;border-radius:12px;background:linear-gradient(90deg,rgba(15,23,42,.92) 0%,rgba(8,22,42,.88) 100%);border:1px solid rgba(56,189,248,.32);border-left:4px solid rgb(56,189,248)}
.dc-ehb-lock{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.dc-ehb-badge{display:inline-flex;align-items:center;padding:3px 9px;border-radius:999px;font:800 .72rem/1.2 var(--aku-font-body);color:rgb(224,242,254);background:rgba(3,105,161,.55);border:1px solid rgba(56,189,248,.5)}
.dc-ehb-lock small{font:600 .78rem/1.35 var(--aku-font-body);color:rgb(226,232,240)}
.dc-ehb-lock small b{color:rgb(254,240,138);font-weight:800}
.dc-ehb-steps{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.dc-ehb-step{padding:3px 9px;border-radius:7px;background:rgba(15,23,42,.78);border:1px solid rgba(148,163,184,.22);font:600 .73rem/1.3 var(--aku-font-body);color:rgb(203,213,225)}
.dc-ehb-step b{color:rgb(125,211,252);font-weight:800}


/* === 0DTE-SETUP.HTML#MARKET INTEGRATION OVERRIDES (DARK + LIGHT PARITY) === */
html body:not(#akx) #main:not(#aky) #panel-market .hos-grid.is-two-col-master.is-craft-e-master {
  display: block !important;
  grid-template-columns: 1fr !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .hcd-price-tower.dte-elev.is-craft-e-upgraded {
  display: grid !important;
  gap: 14px !important;
  padding: 20px 22px !important;
  border-radius: 16px !important;
  width: 100% !important;
  max-width: 100% !important;
  background: radial-gradient(85% 85% at 75% 18%, rgba(16, 185, 129, 0.22), transparent 65%), linear-gradient(135deg, rgb(8, 26, 34), rgb(11, 16, 30)) !important;
  border: 1px solid rgba(56, 189, 248, 0.32) !important;
  color: rgb(241, 245, 249) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .hcd-price-tower.dte-elev.is-craft-e-upgraded.is-cond-test770 {
  background: radial-gradient(85% 85% at 75% 15%, rgba(245, 158, 11, 0.3), rgba(249, 115, 22, 0.18) 48%, transparent 72%), linear-gradient(135deg, rgb(32, 22, 10), rgb(12, 16, 30)) !important;
  border-color: rgba(251, 191, 36, 0.45) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .hcd-price-tower.dte-elev.is-craft-e-upgraded.is-cond-pulldown {
  background: radial-gradient(85% 85% at 75% 82%, rgba(244, 63, 94, 0.28), transparent 65%), linear-gradient(135deg, rgb(36, 10, 20), rgb(11, 15, 28)) !important;
  border-color: rgba(251, 113, 133, 0.42) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-elev-arch-grid {
  display: grid !important;
  grid-template-columns: 0.88fr 1.32fr !important;
  gap: 18px !important;
  align-items: stretch !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-elev-wing-left {
  display: grid !important;
  gap: 12px !important;
  align-content: space-between !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .elv-floor.dc-elev-gate {
  display: grid !important;
  gap: 6px !important;
  padding: 12px 15px !important;
  border-radius: 14px !important;
  background: rgba(15, 23, 42, 0.84) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  color: rgb(241, 245, 249) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-eg-title.elv-floor-name {
  color: #f8fafc !important;
  font-weight: 800 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-eg-route,
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-eg-step {
  color: #cbd5e1 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-eg-step b {
  color: #fde047 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-eg-route small {
  color: #94a3b8 !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .elv-floor.dc-elev-gate.is-ceiling {
  border-left: 4px solid rgb(52, 211, 153) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .elv-floor.dc-elev-gate.is-ground {
  border-left: 4px solid rgb(251, 113, 133) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .elv-chain-anchor.dc-elev-chain-core {
  display: grid !important;
  gap: 8px !important;
  padding: 12px 14px !important;
  border-radius: 12px !important;
  margin: 0 !important;
  width: 100% !important;
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.16), rgba(15, 23, 42, 0.78)) !important;
  border: 1px solid rgba(52, 211, 153, 0.42) !important;
  color: rgb(241, 245, 249) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-elev-wing-right.is-ticked-shaft-layout {
  display: grid !important;
  grid-template-columns: 160px minmax(0, 1fr) !important;
  gap: 14px !important;
  align-items: stretch !important;
  padding: 12px 14px !important;
  border-radius: 14px !important;
  background: rgba(9, 14, 26, 0.82) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .elv-shaft.is-ticked-shaft.dc-elev-shaft-col {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px !important;
  padding: 10px 6px !important;
  border-radius: 14px !important;
  background: rgba(4, 9, 20, 0.94) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  min-height: 360px !important;
  height: auto !important;
  width: 100% !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-es-track {
  position: relative !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  min-height: 290px !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-es-track > .elv-field {
  opacity: 0.08 !important;
  pointer-events: none !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .elv-car.is-cabin.dc-es-cabin {
  position: absolute !important;
  left: 4px !important;
  right: auto !important;
  width: 62px !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 4px 5px !important;
  transform: translateY(50%) !important;
  z-index: 12 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 9px !important;
  background: rgb(6, 46, 38) !important;
  border: 1.8px solid rgb(52, 211, 153) !important;
  box-shadow: 0 0 16px rgba(16, 185, 129, 0.65) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .elv-car.is-cabin.dc-es-cabin.is-dn {
  background: rgb(56, 12, 24) !important;
  border-color: rgb(251, 113, 133) !important;
  box-shadow: 0 0 16px rgba(244, 63, 94, 0.65) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .elv-car.is-cabin.dc-es-cabin.is-clash {
  background: rgb(66, 32, 6) !important;
  border-color: rgb(251, 191, 36) !important;
  box-shadow: 0 0 20px rgba(245, 158, 11, 0.85) !important;
}
html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .elv-car.is-cabin.dc-es-cabin b.elv-car-px {
  font: 800 0.74rem/1.1 var(--aku-font-head) !important;
  color: #f8fafc !important;
  font-variant-numeric: tabular-nums !important;
}

/* CRAFT-D Sector Clash overrides inside #mkBreadth */
html body:not(#akx) #main:not(#aky) #mkBreadth .is-sector-kame-clash.dc-beauty-stage {
  padding: 20px 22px !important;
  border-radius: 16px !important;
  display: grid !important;
  gap: 14px !important;
  background: radial-gradient(90% 90% at 22% 20%, rgba(14, 165, 233, 0.28), rgba(59, 130, 246, 0.14) 48%, transparent 70%), radial-gradient(80% 80% at 82% 80%, rgba(225, 29, 72, 0.18), transparent 65%), linear-gradient(135deg, rgb(6, 20, 38), rgb(14, 12, 30)) !important;
  border: 1px solid rgba(56, 189, 248, 0.32) !important;
  color: rgb(241, 245, 249) !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .tug-head.sca-fighters.dc-sf-hero-strip {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  align-items: stretch !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .sca-fighter.dc-sf-wing {
  display: grid !important;
  gap: 5px !important;
  padding: 10px 14px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.68) !important;
}
html body:not(#akx) #main:not(#aky) #mkBreadth .sca-beam-arrows svg.dc-jjk-wave-svg {
  width: 98px !important;
  height: 24px !important;
}

/* CRAFT-F GEX Skyline Orbiting Laser Border inside #mkLevels */
html body:not(#akx) #main:not(#aky) #mkLevels .gex-bars-card.dc-beauty-stage.is-craft-skyline {
  padding: 20px 22px !important;
  border-radius: 16px !important;
  display: grid !important;
  gap: 14px !important;
}
html body:not(#akx) #main:not(#aky) #mkLevels .gb.is-skyline-col.dc-gsky-col.is-orbit-wall {
  position: relative !important;
  overflow: hidden !important;
  border-color: transparent !important;
  transform: translateY(-5px) !important;
  z-index: 3 !important;
}
html body:not(#akx) #main:not(#aky) #mkLevels .gb.is-skyline-col.dc-gsky-col.is-orbit-wall::after {
  content: "" !important;
  position: absolute !important;
  inset: 3.2px !important;
  width: auto !important;
  height: auto !important;
  border-radius: 10px !important;
  z-index: 1 !important;
  pointer-events: none !important;
}
html body:not(#akx) #main:not(#aky) #mkLevels .gb.is-skyline-col.dc-gsky-col.is-pw.is-orbit-wall::after {
  background: linear-gradient(180deg, rgb(42, 12, 24) 0%, rgb(15, 20, 36) 100%) !important;
}
html body:not(#akx) #main:not(#aky) #mkLevels .gb.is-skyline-col.dc-gsky-col.is-cw.is-orbit-wall::after {
  background: linear-gradient(180deg, rgb(8, 38, 32) 0%, rgb(15, 20, 36) 100%) !important;
}
html body:not(#akx) #main:not(#aky) #mkLevels .gb.is-skyline-col.dc-gsky-col.is-spot.is-orbit-wall::after {
  background: linear-gradient(180deg, rgb(42, 28, 10) 0%, rgb(15, 20, 36) 100%) !important;
}
html body:not(#akx) #main:not(#aky) #mkLevels .gb.is-skyline-col.dc-gsky-col.is-orbit-wall > * {
  position: relative !important;
  z-index: 2 !important;
}
html body:not(#akx) #main:not(#aky) #mkLevels .gb-bar-fill {
  overflow: hidden !important;
}

@media (max-width: 1080px) {
  html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-elev-arch-grid,
  html body:not(#akx) #main:not(#aky) #panel-market .dte-elev.is-craft-e-upgraded .dc-elev-wing-right.is-ticked-shaft-layout,
  html body:not(#akx) #main:not(#aky) #mkBreadth .tug-head.sca-fighters.dc-sf-hero-strip {
    grid-template-columns: 1fr !important;
  }
}

/* ==========================================================================
   V261 · AUDI FEEDBACK PARITY (2026-10-31):
   1. Frameless #mkTick ("ฟิวเจอร์สสด · อัปเดตใน 13 วิ" without rectangular background box)
   2. Unboxed <details> across #panel-market (no dark bar extending right of summary pill)
   3. Prominent Radar Liquidity Sweep (#mkSweepRadar) + 3-Step Visual Playbook
   4. Upgraded Similar-Days Odds (#mkOdds) with Visual Funnel & 3 Evidence Cards
   ========================================================================== */

/* 1. Frameless #mkTick ("ฟิวเจอร์สสด · อัปเดตใน 13 วิ") */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkStatus #mkTick,
html[data-theme="dark"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b[data-ab-mode="b"] #mkStatus #mkTick,
html[data-theme="dark"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-a[data-ab-mode="a"] #mkStatus #mkTick,
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkStatus #mkTick,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .ab-clone-mktick,
html body:not(#akw):not(#akx) #main:not(#aky) #deskMkTick {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 2px !important;
  border-radius: 0 !important;
}

/* 2. Unboxed <details> across #panel-market (no full-width dark bar extending right of the button) */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) details:not(.dte-session),
html[data-theme="dark"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 :is(#mkSpy, #mkMacd, #mkOdds, #mkLevels, #mkCross, #mkBreadth) details,
html[data-theme="dark"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b details,
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) details:not(.dte-session) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin-top: 12px !important;
  overflow: visible !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) details:not(.dte-session) > summary,
html[data-theme="dark"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b2 :is(#mkSpy, #mkMacd, #mkOdds, #mkLevels, #mkCross, #mkBreadth) details > summary,
html[data-theme="dark"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz).ab-scope-b details > summary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: fit-content !important;
  max-width: 100% !important;
  min-height: 38px !important;
  padding: 7px 16px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.92), rgba(30, 41, 59, 0.88)) !important;
  border: 1px solid rgba(56, 189, 248, 0.36) !important;
  color: #f1f5f9 !important;
  font: 700 0.84rem/1.4 var(--aku-font-body) !important;
  cursor: pointer !important;
  box-shadow: 0 4px 12px rgba(2, 6, 23, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) details:not(.dte-session) > summary {
  background: linear-gradient(135deg, #ffffff, #f1f5f9) !important;
  border: 1px solid rgba(14, 116, 144, 0.34) !important;
  color: #0f172a !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) details:not(.dte-session) > summary::after {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 0 0 4px !important;
  margin-left: 4px !important;
  color: #38bdf8 !important;
  font-weight: 800 !important;
}

/* 3. Prominent Radar Liquidity Sweep (#mkSweepRadar) */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar {
  position: relative !important;
  margin-top: 14px !important;
  padding: 16px 18px !important;
  border-radius: 16px !important;
  background:
    radial-gradient(ellipse at 12% 0%, rgba(56, 189, 248, 0.20), transparent 58%),
    radial-gradient(ellipse at 92% 100%, rgba(244, 63, 94, 0.16), transparent 58%),
    linear-gradient(145deg, #091526 0%, #0b192c 54%, #091322 100%) !important;
  border: 1.5px solid rgba(56, 189, 248, 0.44) !important;
  border-left: 4px solid #38bdf8 !important;
  box-shadow: 0 12px 28px rgba(2, 6, 23, 0.46), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar {
  background: linear-gradient(145deg, #f0f9ff 0%, #e0f2fe 54%, #f8fafc 100%) !important;
  border: 1.5px solid rgba(2, 132, 199, 0.38) !important;
  border-left: 4px solid #0284c7 !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-head {
  display: grid !important;
  gap: 10px !important;
  margin-bottom: 12px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-head-title-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-title-group {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-radar-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, #0284c7, #0369a1) !important;
  border: 1px solid #7dd3fc !important;
  color: #f0f9ff !important;
  font: 800 0.70rem/1.2 var(--aku-font-mono) !important;
  letter-spacing: 0.08em !important;
  box-shadow: 0 0 12px rgba(56, 189, 248, 0.4) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-radar-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #38bdf8 !important;
  box-shadow: 0 0 8px #38bdf8 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-title {
  margin: 0 !important;
  font: 800 1.06rem/1.3 var(--aku-font-head) !important;
  color: #f8fafc !important;
  letter-spacing: -0.01em !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-title {
  color: #0c4a6e !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-head-meta-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
  gap: 8px !important;
  margin-bottom: 12px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-chip {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  padding: 12px 14px !important;
  border-radius: 12px !important;
  background: rgba(6, 38, 30, 0.72) !important;
  border: 1px solid rgba(52, 211, 153, 0.38) !important;
  border-left: 3.5px solid #10b981 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-chip.is-tier-weak {
  background: rgba(30, 27, 38, 0.72) !important;
  border-color: rgba(251, 191, 36, 0.34) !important;
  border-left-color: #f59e0b !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-chip.is-upper {
  background: rgba(58, 12, 26, 0.72) !important;
  border-color: rgba(251, 113, 133, 0.42) !important;
  border-left-color: #f43f5e !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-main {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-reb {
  font-style: normal !important;
  font: 700 0.78rem/1.35 var(--aku-font-body) !important;
  padding: 5px 10px !important;
  border-radius: 9px !important;
  white-space: normal !important;
  max-width: 100% !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-reb.is-up {
  background: rgba(16, 185, 129, 0.22) !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
  color: #6ee7b7 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-reb.is-dn {
  background: rgba(244, 63, 94, 0.22) !important;
  border: 1px solid rgba(251, 113, 133, 0.55) !important;
  color: #fda4af !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-step-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin-top: 10px !important;
}
@media (max-width: 640px) {
  html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-step-grid {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-step-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  padding: 9px 11px !important;
  border-radius: 10px !important;
  background: rgba(15, 23, 42, 0.78) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-step-card.is-step-1 {
  border-top: 2.5px solid #fbbf24 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-step-card.is-step-2 {
  border-top: 2.5px solid #f43f5e !important;
  background: rgba(48, 10, 22, 0.55) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-step-card.is-step-3 {
  border-top: 2.5px solid #10b981 !important;
  background: rgba(6, 44, 34, 0.55) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-step-kicker {
  font: 800 0.70rem/1.2 var(--aku-font-body) !important;
  color: #94a3b8 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-step-card b {
  font: 800 0.82rem/1.3 var(--aku-font-head) !important;
  color: #f8fafc !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-step-card small {
  font: 600 0.75rem/1.35 var(--aku-font-body) !important;
  color: #cbd5e1 !important;
}

/* 4. Upgraded Similar-Days Odds (#mkOdds) */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-bottom: 14px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-head .gx-sub {
  margin: 0 !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  background: rgba(16, 185, 129, 0.14) !important;
  border: 1px solid rgba(52, 211, 153, 0.35) !important;
  font: 700 0.80rem/1.3 var(--aku-font-body) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict {
  display: grid !important;
  grid-template-columns: minmax(0, 1.55fr) minmax(260px, 0.95fr) !important;
  align-items: center !important;
  gap: 18px !important;
  padding: 16px 20px !important;
  border-radius: 15px !important;
  margin-bottom: 14px !important;
}
@media (max-width: 860px) {
  html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict-copy {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict-copy > b {
  font: 800 1.08rem/1.35 var(--aku-font-head) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-cond-strip {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-top: 4px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-cond-chip {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.58) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
  font: 700 0.75rem/1.3 var(--aku-font-body) !important;
  color: #e2e8f0 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-cond-chip {
  background: rgba(255, 255, 255, 0.85) !important;
  border-color: rgba(15, 23, 42, 0.16) !important;
  color: #0f172a !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-funnel-viz {
  display: grid !important;
  gap: 10px !important;
  padding: 12px 14px !important;
  border-radius: 12px !important;
  background: rgba(9, 15, 26, 0.56) !important;
  border: 1px solid rgba(148, 163, 184, 0.22) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-funnel-viz {
  background: rgba(255, 255, 255, 0.86) !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .ofv-row {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  gap: 4px 10px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .ofv-lbl {
  font: 700 0.76rem/1.2 var(--aku-font-body) !important;
  color: #cbd5e1 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .ofv-lbl {
  color: #334155 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .ofv-pct {
  font: 800 0.84rem/1.2 var(--aku-font-mono) !important;
  color: #6ee7b7 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .ofv-track {
  grid-column: 1 / -1 !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.2) !important;
  overflow: hidden !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .ofv-row.is-base .ofv-track > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #64748b, #94a3b8) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .ofv-row.is-match .ofv-track > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #10b981, #34d399) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-big {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
}
@media (max-width: 860px) {
  html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-big {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-num {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  background: linear-gradient(155deg, rgba(13, 25, 42, 0.88), rgba(9, 18, 32, 0.92)) !important;
  border: 1px solid rgba(56, 189, 248, 0.28) !important;
  border-top: 3px solid #38bdf8 !important;
  box-shadow: 0 8px 20px rgba(2, 6, 23, 0.34) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-num.is-good {
  background: linear-gradient(155deg, rgba(6, 46, 36, 0.82), rgba(5, 29, 23, 0.90)) !important;
  border-color: rgba(52, 211, 153, 0.38) !important;
  border-top-color: #10b981 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-num.is-bad {
  background: linear-gradient(155deg, rgba(56, 12, 26, 0.82), rgba(34, 8, 18, 0.90)) !important;
  border-color: rgba(251, 113, 133, 0.38) !important;
  border-top-color: #f43f5e !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-num {
  background: linear-gradient(155deg, #ffffff, #f8fafc) !important;
  border-color: rgba(14, 116, 144, 0.26) !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .on-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .on-kicker {
  font: 700 0.76rem/1.25 var(--aku-font-body) !important;
  color: #cbd5e1 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .on-kicker {
  color: #334155 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .on-pill {
  font-style: normal !important;
  font: 800 0.73rem/1.2 var(--aku-font-mono) !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.68) !important;
  border: 1px solid rgba(148, 163, 184, 0.32) !important;
  color: #f8fafc !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .on-pill {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .on-meter {
  height: 6px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.18) !important;
  overflow: hidden !important;
  margin: 2px 0 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-num.is-good .on-meter > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #10b981, #34d399) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-num.is-info .on-meter > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #0284c7, #38bdf8) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-num.is-bad .on-meter > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #e11d48, #fb7185) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-note {
  display: inline-flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 4px 0 8px !important;
  padding: 8px 14px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.65) !important;
  border: 1px dashed rgba(56, 189, 248, 0.35) !important;
  font: 600 0.80rem/1.4 var(--aku-font-body) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-note {
  background: rgba(241, 245, 249, 0.9) !important;
  border-color: rgba(2, 132, 199, 0.35) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .on-note-badge {
  padding: 2px 9px !important;
  border-radius: 999px !important;
  background: rgba(245, 158, 11, 0.18) !important;
  border: 1px solid rgba(251, 191, 36, 0.45) !important;
  color: #fde68a !important;
  font: 800 0.72rem/1.2 var(--aku-font-mono) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .on-note-badge {
  color: #92400e !important;
}

/* ==========================================================================
   V262 — REAL-TIME SWEEP COMPASS & TIER STRENGTH, COLOR-CODED S/R & GEX DECK,
          CLEAN GEX SKYLINE HEADER & LARGER SECTION / SUB-SECTION HEADINGS
   ========================================================================== */

/* 1. Section & Sub-Section Heading Hierarchy (Larger than body copy) */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .card > h3 > span:not(.chip):not(.ak-px) {
  font-family: var(--aku-font-display, var(--aku-font-body)) !important;
  font-size: clamp(1.22rem, 1.55vw, 1.48rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.25 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-subzone-title,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-title,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lgd-kicker,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-box-title,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkBreadth .dc-sf-kicker,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkBreadth .dc-jhs-head > span > b {
  font-family: var(--aku-font-display, var(--aku-font-body)) !important;
  font-size: clamp(1.06rem, 1.28vw, 1.24rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.3 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lgd-kicker {
  color: #7dd3fc !important;
  text-transform: none !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .lgd-kicker {
  color: #0369a1 !important;
}

/* 2. Real-Time Sweep Status Pill + Actionable 3-Box Tactical Compass + Sweep Strength Tiers */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-rt-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  font: 800 0.74rem/1.2 var(--aku-font-body) !important;
  letter-spacing: 0.01em !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-rt-pill.is-rt-scan {
  background: rgba(56, 189, 248, 0.16) !important;
  border: 1px solid rgba(56, 189, 248, 0.42) !important;
  color: #7dd3fc !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-rt-pill.is-rt-live {
  background: rgba(244, 63, 94, 0.25) !important;
  border: 1.5px solid #fb7185 !important;
  color: #ffe4e6 !important;
  box-shadow: 0 0 14px rgba(244, 63, 94, 0.45) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-rt-pill.is-rt-scan {
  background: #e0f2fe !important;
  border-color: rgba(2, 132, 199, 0.4) !important;
  color: #0369a1 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-rt-pill.is-rt-live {
  background: #ffe4e6 !important;
  border-color: #e11d48 !important;
  color: #9f1239 !important;
}

html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-compass-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 4px 0 6px !important;
}
@media (max-width: 900px) {
  html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-compass-grid {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 11px 14px !important;
  border-radius: 13px !important;
  background: rgba(15, 23, 42, 0.76) !important;
  border: 1px solid rgba(125, 211, 252, 0.28) !important;
  border-left: 3.5px solid #38bdf8 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-force-box.is-up {
  background: rgba(6, 46, 36, 0.65) !important;
  border-color: rgba(52, 211, 153, 0.36) !important;
  border-left-color: #10b981 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-force-box.is-dn {
  background: rgba(56, 12, 26, 0.65) !important;
  border-color: rgba(251, 113, 133, 0.36) !important;
  border-left-color: #f43f5e !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-magnet-box {
  background: rgba(30, 27, 75, 0.58) !important;
  border-color: rgba(251, 191, 36, 0.36) !important;
  border-left-color: #f59e0b !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card {
  background: #ffffff !important;
  border-color: rgba(2, 132, 199, 0.28) !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-force-box.is-up {
  background: #f0fdf4 !important;
  border-color: rgba(16, 185, 129, 0.35) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-force-box.is-dn {
  background: #fff1f2 !important;
  border-color: rgba(244, 63, 94, 0.35) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-magnet-box {
  background: #fffbeb !important;
  border-color: rgba(245, 158, 11, 0.38) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-k {
  font: 800 0.74rem/1.2 var(--aku-font-body) !important;
  color: #7dd3fc !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-force-box.is-up .msr-comp-k {
  color: #6ee7b7 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-force-box.is-dn .msr-comp-k {
  color: #fda4af !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-magnet-box .msr-comp-k {
  color: #fcd34d !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-k {
  color: #0369a1 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-force-box.is-up .msr-comp-k {
  color: #047857 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-force-box.is-dn .msr-comp-k {
  color: #be123c !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-card.is-magnet-box .msr-comp-k {
  color: #b45309 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-v {
  font: 800 0.88rem/1.35 var(--aku-font-body) !important;
  color: #f8fafc !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-v {
  color: #0f172a !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-sub {
  font: 600 0.76rem/1.35 var(--aku-font-body) !important;
  color: #cbd5e1 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-comp-sub {
  color: #475569 !important;
}

/* Sweep Event Strength Tier Pill & Sub-metrics */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-tier-pill {
  display: inline-flex !important;
  align-items: center !important;
  align-self: flex-start !important;
  gap: 5px !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  font: 800 0.72rem/1.25 var(--aku-font-body) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-tier-pill.is-tier-strong {
  background: rgba(16, 185, 129, 0.22) !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
  color: #a7f3d0 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-tier-pill.is-tier-weak {
  background: rgba(245, 158, 11, 0.18) !important;
  border: 1px solid rgba(251, 191, 36, 0.48) !important;
  color: #fde68a !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-tier-pill.is-tier-live {
  background: rgba(244, 63, 94, 0.26) !important;
  border: 1px solid #fb7185 !important;
  color: #ffe4e6 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-tier-pill.is-tier-mid {
  background: rgba(56, 189, 248, 0.18) !important;
  border: 1px solid rgba(125, 211, 252, 0.45) !important;
  color: #bae6fd !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-tier-pill.is-tier-strong {
  background: #d1fae5 !important;
  border-color: rgba(5, 150, 105, 0.45) !important;
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-tier-pill.is-tier-weak {
  background: #fef3c7 !important;
  border-color: rgba(217, 119, 6, 0.45) !important;
  color: #92400e !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-wick {
  font: 600 0.78rem/1.35 var(--aku-font-body) !important;
  color: #cbd5e1 !important;
  white-space: normal !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-post {
  font: 700 0.78rem/1.35 var(--aku-font-body) !important;
  white-space: normal !important;
  align-self: flex-start !important;
  padding: 5px 10px !important;
  border-radius: 9px !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-wick {
  color: #334155 !important;
}

/* 3. Color-Coded Historical S/R (.hcd-sr) & GEX Confluence (.hcd-mem) & Abbr Guide (.hcd-abbr-guide) */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row {
  padding: 12px 14px !important;
  border-radius: 13px !important;
  margin-bottom: 8px !important;
  transition: transform 0.15s ease, border-color 0.15s ease !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-res-row,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-res-mem {
  background: linear-gradient(145deg, rgba(64, 14, 30, 0.56) 0%, rgba(15, 23, 42, 0.84) 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.36) !important;
  border-left: 4px solid #fb7185 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-sup-row,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-sup-mem {
  background: linear-gradient(145deg, rgba(6, 52, 39, 0.58) 0%, rgba(15, 23, 42, 0.84) 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.38) !important;
  border-left: 4px solid #34d399 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-flip-row {
  border-left: 4px solid #f59e0b !important;
  box-shadow: inset 0 0 0 1px rgba(251, 191, 36, 0.22) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-spot-mem {
  background: linear-gradient(145deg, rgba(12, 46, 78, 0.62) 0%, rgba(15, 23, 42, 0.86) 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.42) !important;
  border-left: 4px solid #38bdf8 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-res-row,
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-res-mem {
  background: linear-gradient(90deg, #fff1f2 0%, #ffffff 100%) !important;
  border-color: rgba(244, 63, 94, 0.32) !important;
  border-left: 4px solid #e11d48 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-sup-row,
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-sup-mem {
  background: linear-gradient(90deg, #ecfdf5 0%, #ffffff 100%) !important;
  border-color: rgba(16, 185, 129, 0.34) !important;
  border-left: 4px solid #059669 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-flip-row {
  border-left-color: #d97706 !important;
}

html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-code-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  font: 800 0.72rem/1.2 var(--aku-font-mono) !important;
  margin-right: 6px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-code-badge.is-res {
  background: rgba(244, 63, 94, 0.24) !important;
  border: 1px solid rgba(251, 113, 133, 0.5) !important;
  color: #fecdd3 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-code-badge.is-sup {
  background: rgba(16, 185, 129, 0.24) !important;
  border: 1px solid rgba(52, 211, 153, 0.5) !important;
  color: #a7f3d0 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-code-badge.is-spot {
  background: rgba(56, 189, 248, 0.24) !important;
  border: 1px solid rgba(125, 211, 252, 0.5) !important;
  color: #bae6fd !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-code-badge.is-res {
  background: #ffe4e6 !important;
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-code-badge.is-sup {
  background: #d1fae5 !important;
  color: #065f46 !important;
}

html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-dist-pill,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-role-tag {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  font: 700 0.74rem/1.25 var(--aku-font-body) !important;
  margin-right: 6px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-dist-pill.is-res,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-role-tag.is-res {
  background: rgba(244, 63, 94, 0.18) !important;
  border: 1px solid rgba(251, 113, 133, 0.42) !important;
  color: #fda4af !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-dist-pill.is-sup,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-role-tag.is-sup {
  background: rgba(16, 185, 129, 0.18) !important;
  border: 1px solid rgba(52, 211, 153, 0.42) !important;
  color: #6ee7b7 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-role-tag.is-flip {
  background: rgba(245, 158, 11, 0.20) !important;
  border: 1px solid rgba(251, 191, 36, 0.48) !important;
  color: #fde68a !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-dist-pill.is-res,
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-role-tag.is-res {
  background: #ffe4e6 !important;
  color: #be123c !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-dist-pill.is-sup,
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-role-tag.is-sup {
  background: #d1fae5 !important;
  color: #047857 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-role-tag.is-flip {
  background: #fef3c7 !important;
  color: #92400e !important;
}

/* Color-Coded Abbr Chips (PDH / PDL / PDC / 5D / Sync) */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 11px !important;
  border-radius: 999px !important;
  font: 700 0.76rem/1.2 var(--aku-font-body) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-pdh {
  background: rgba(244, 63, 94, 0.16) !important;
  border: 1px solid rgba(251, 113, 133, 0.42) !important;
  color: #fecdd3 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-pdl {
  background: rgba(16, 185, 129, 0.16) !important;
  border: 1px solid rgba(52, 211, 153, 0.42) !important;
  color: #a7f3d0 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-pdc {
  background: rgba(56, 189, 248, 0.16) !important;
  border: 1px solid rgba(125, 211, 252, 0.42) !important;
  color: #bae6fd !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-5d {
  background: rgba(245, 158, 11, 0.16) !important;
  border: 1px solid rgba(251, 191, 36, 0.42) !important;
  color: #fde68a !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-sync {
  background: rgba(168, 85, 247, 0.18) !important;
  border: 1px solid rgba(192, 132, 252, 0.45) !important;
  color: #e9d5ff !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-pdh {
  background: #ffe4e6 !important;
  color: #9f1239 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-pdl {
  background: #d1fae5 !important;
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-pdc {
  background: #e0f2fe !important;
  color: #075985 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-5d {
  background: #fef3c7 !important;
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-abbr-chip.is-sync {
  background: #f3e8ff !important;
  color: #6b21a8 !important;
}

/* ==========================================================================
   V263 — AUDI FEEDBACK PARITY (2026-10-31):
   1. Zero-Overlap Elevator Shaft (.dc-es-tick / .dc-es-cabin / .dc-es-cap)
   2. Armored & Prominent Upper/Lower Range Gate Cards (.elv-floor.is-armored-gate + .dc-eg-power-meter)
   3. Curated Top-3 Hierarchy, Hero Rank #1 Card & Strength Bar in .hcd-sr / .hcd-mem
   4. 3-Role Put GEX Comparison Strip (.gex-realtime-explainer.is-three-role-guide)
   ========================================================================== */

/* 1. Zero-Overlap Elevator Shaft Spacing & Clean Cap Separation */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .dc-elev-wing-right.is-ticked-shaft-layout {
  grid-template-columns: 172px minmax(0, 1fr) !important;
  gap: 16px !important;
}
@media (max-width: 1080px) {
  html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .dc-elev-wing-right.is-ticked-shaft-layout {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-shaft.is-ticked-shaft.dc-elev-shaft-col {
  padding: 12px 8px !important;
  gap: 10px !important;
  min-height: 380px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .dc-es-cap {
  position: relative !important;
  z-index: 6 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  width: 100% !important;
  padding: 5px 8px !important;
  border-radius: 8px !important;
  font: 800 0.78rem/1.15 var(--aku-font-mono) !important;
  letter-spacing: -0.01em !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .dc-es-cap.is-top {
  background: linear-gradient(90deg, rgba(16, 185, 129, 0.28), rgba(6, 78, 59, 0.65)) !important;
  border: 1px solid rgba(52, 211, 153, 0.6) !important;
  color: #a7f3d0 !important;
  box-shadow: 0 2px 10px rgba(16, 185, 129, 0.25) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .dc-es-cap.is-bot {
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.28), rgba(136, 19, 55, 0.65)) !important;
  border: 1px solid rgba(251, 113, 133, 0.6) !important;
  color: #fecdd3 !important;
  box-shadow: 0 2px 10px rgba(244, 63, 94, 0.25) !important;
}

/* 2. Armored & Visually Prominent Upper/Lower Range Gate Cards (.elv-floor.is-armored-gate) */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.dc-elev-gate.is-armored-gate {
  position: relative !important;
  display: grid !important;
  gap: 8px !important;
  padding: 15px 18px !important;
  border-radius: 15px !important;
  opacity: 1 !important;
  overflow: hidden !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.dc-elev-gate.is-armored-gate.is-ceiling {
  background:
    radial-gradient(ellipse at 85% 0%, rgba(16, 185, 129, 0.28), transparent 62%),
    linear-gradient(155deg, rgba(6, 56, 44, 0.90) 0%, rgba(9, 28, 38, 0.94) 62%, rgba(12, 20, 36, 0.96) 100%) !important;
  border: 1.5px solid rgba(52, 211, 153, 0.58) !important;
  border-top: 4px solid #10b981 !important;
  border-left: 4.5px solid #34d399 !important;
  box-shadow: 0 10px 24px -8px rgba(16, 185, 129, 0.32), inset 0 1px 0 rgba(167, 243, 208, 0.18) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.dc-elev-gate.is-armored-gate.is-ground {
  background:
    radial-gradient(ellipse at 85% 100%, rgba(244, 63, 94, 0.30), transparent 62%),
    linear-gradient(155deg, rgba(68, 12, 30, 0.90) 0%, rgba(36, 12, 26, 0.94) 62%, rgba(12, 20, 36, 0.96) 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.62) !important;
  border-bottom: 4px solid #f43f5e !important;
  border-left: 4.5px solid #fb7185 !important;
  box-shadow: 0 10px 24px -8px rgba(244, 63, 94, 0.34), inset 0 1px 0 rgba(254, 205, 211, 0.16) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.dc-elev-gate.is-armored-gate.is-favored {
  box-shadow: 0 12px 28px -6px rgba(245, 158, 11, 0.36), 0 0 0 1px rgba(251, 191, 36, 0.42) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.dc-elev-gate.is-armored-gate.is-ceiling {
  background: linear-gradient(145deg, #ecfdf5 0%, #f0fdf4 58%, #ffffff 100%) !important;
  border-color: rgba(16, 185, 129, 0.55) !important;
  border-top: 4px solid #059669 !important;
  border-left: 4.5px solid #10b981 !important;
  color: #064e3b !important;
  box-shadow: 0 8px 20px rgba(5, 150, 105, 0.10) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.dc-elev-gate.is-armored-gate.is-ground {
  background: linear-gradient(145deg, #fff1f2 0%, #ffe4e6 58%, #ffffff 100%) !important;
  border-color: rgba(244, 63, 94, 0.55) !important;
  border-bottom: 4px solid #e11d48 !important;
  border-left: 4.5px solid #f43f5e !important;
  color: #881337 !important;
  box-shadow: 0 8px 20px rgba(225, 29, 72, 0.10) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate .dc-eg-title.elv-floor-name {
  font-size: 0.92rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate.is-ceiling .dc-eg-title.elv-floor-name {
  color: #a7f3d0 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate.is-ground .dc-eg-title.elv-floor-name {
  color: #fecdd3 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate.is-ceiling .dc-eg-title.elv-floor-name {
  color: #065f46 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate.is-ground .dc-eg-title.elv-floor-name {
  color: #9f1239 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate .dc-eg-px.elv-px {
  font: 900 1.44rem/1.05 var(--aku-font-mono) !important;
  letter-spacing: -0.02em !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate .dc-eg-px.is-up {
  color: #6ee7b7 !important;
  text-shadow: 0 0 14px rgba(16, 185, 129, 0.45) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate .dc-eg-px.is-dn {
  color: #fda4af !important;
  text-shadow: 0 0 14px rgba(244, 63, 94, 0.45) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate .dc-eg-px.is-up {
  color: #047857 !important;
  text-shadow: none !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate .dc-eg-px.is-dn {
  color: #be123c !important;
  text-shadow: none !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate .dc-eg-tier.is-tier-res {
  background: rgba(16, 185, 129, 0.22) !important;
  border: 1px solid rgba(52, 211, 153, 0.52) !important;
  color: #d1fae5 !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .elv-floor.is-armored-gate .dc-eg-tier.is-tier-sup {
  background: rgba(244, 63, 94, 0.24) !important;
  border: 1px solid rgba(251, 113, 133, 0.55) !important;
  color: #ffe4e6 !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .dc-eg-power-meter {
  width: 100% !important;
  margin: 2px 0 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .dc-eg-pm-track {
  height: 7px !important;
  border-radius: 999px !important;
  background: rgba(2, 6, 23, 0.72) !important;
  border: 1px solid rgba(148, 163, 184, 0.24) !important;
  overflow: hidden !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .dc-eg-power-meter.is-up .dc-eg-pm-track > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #059669, #34d399, #6ee7b7) !important;
  box-shadow: 0 0 12px rgba(52, 211, 153, 0.65) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) .dte-elev.is-craft-e-upgraded .dc-eg-power-meter.is-dn .dc-eg-pm-track > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #e11d48, #fb7185, #fda4af) !important;
  box-shadow: 0 0 12px rgba(251, 113, 133, 0.65) !important;
}

/* 3. Curated Top-3 Hierarchy, Hero Rank #1 Card & Strength Bar in .hcd-sr / .hcd-mem */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 13px 15px !important;
  border-radius: 14px !important;
  margin-bottom: 10px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-rank-1 {
  padding: 15px 17px !important;
  border-width: 1.5px !important;
  border-left-width: 5px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-rank-1.is-res-row,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-rank-1.is-res-mem {
  background:
    radial-gradient(ellipse at 90% 0%, rgba(244, 63, 94, 0.25), transparent 60%),
    linear-gradient(145deg, rgba(76, 14, 34, 0.78) 0%, rgba(15, 23, 42, 0.92) 100%) !important;
  border-color: rgba(251, 113, 133, 0.62) !important;
  border-left-color: #fb7185 !important;
  box-shadow: 0 10px 24px -8px rgba(244, 63, 94, 0.34), inset 0 1px 0 rgba(254, 205, 211, 0.16) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-rank-1.is-sup-row,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-rank-1.is-sup-mem {
  background:
    radial-gradient(ellipse at 90% 0%, rgba(16, 185, 129, 0.25), transparent 60%),
    linear-gradient(145deg, rgba(6, 62, 46, 0.78) 0%, rgba(15, 23, 42, 0.92) 100%) !important;
  border-color: rgba(52, 211, 153, 0.62) !important;
  border-left-color: #34d399 !important;
  box-shadow: 0 10px 24px -8px rgba(16, 185, 129, 0.34), inset 0 1px 0 rgba(167, 243, 208, 0.16) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-secondary-level {
  opacity: 0.92 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row-top-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 6px 10px !important;
  width: 100% !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-hero-kicker {
  margin: 0 !important;
  font: 800 0.78rem/1.25 var(--aku-font-body) !important;
  color: #fde68a !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-hero-kicker {
  color: #92400e !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-tier-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  font: 700 0.71rem/1.2 var(--aku-font-body) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-tier-pill.is-tier-a {
  background: rgba(245, 158, 11, 0.20) !important;
  border: 1px solid rgba(251, 191, 36, 0.5) !important;
  color: #fef08a !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-tier-pill.is-tier-b {
  background: rgba(56, 189, 248, 0.16) !important;
  border: 1px solid rgba(125, 211, 252, 0.4) !important;
  color: #bae6fd !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-tier-pill.is-tier-c {
  background: rgba(148, 163, 184, 0.16) !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  color: #cbd5e1 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-tier-pill.is-tier-a {
  background: #fef3c7 !important;
  color: #92400e !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-tier-pill.is-tier-b {
  background: #e0f2fe !important;
  color: #0369a1 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row-body {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-main {
  display: grid !important;
  grid-template-columns: 94px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-right.is-ring-col {
  flex: 0 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row .hcd-px {
  font: 800 1.16rem/1.1 var(--aku-font-mono) !important;
  font-variant-numeric: tabular-nums !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-rank-1 .hcd-px {
  font-size: 1.34rem !important;
  font-weight: 900 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-txt {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  min-width: 0 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-name-line {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  font: 700 0.85rem/1.35 var(--aku-font-body) !important;
  color: #f8fafc !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-name-line {
  color: #0f172a !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-tags-line {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-code-badge,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-dist-pill,
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-role-tag {
  margin-right: 0 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-w {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  justify-content: center !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-w-pct {
  font: 900 1.05rem/1 var(--aku-font-mono) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-rank-1 .hcd-w-pct {
  font-size: 1.22rem !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-strength-bar {
  width: 100% !important;
  height: 5px !important;
  border-radius: 999px !important;
  background: rgba(2, 6, 23, 0.65) !important;
  overflow: hidden !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-row.is-rank-1 .hcd-strength-bar {
  height: 6.5px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-strength-bar > i {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-strength-bar > i.is-res-fill {
  background: linear-gradient(90deg, #e11d48, #fb7185, #fda4af) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-strength-bar > i.is-sup-fill {
  background: linear-gradient(90deg, #059669, #34d399, #6ee7b7) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-more-list {
  margin-top: 10px !important;
}

/* 4. 3-Role Put GEX Quick Comparison Guide (.gex-realtime-explainer.is-three-role-guide) */
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gex-realtime-explainer.is-three-role-guide {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  margin: 4px 0 8px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
@media (max-width: 960px) {
  html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-grid {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  padding: 11px 14px !important;
  border-radius: 12px !important;
  background: rgba(15, 23, 42, 0.78) !important;
  border: 1px solid rgba(148, 163, 184, 0.28) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card.is-sup-real {
  background: linear-gradient(145deg, rgba(6, 52, 39, 0.65), rgba(15, 23, 42, 0.85)) !important;
  border-color: rgba(52, 211, 153, 0.45) !important;
  border-left: 4px solid #10b981 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card.is-sub-res {
  background: linear-gradient(145deg, rgba(68, 42, 12, 0.58), rgba(15, 23, 42, 0.85)) !important;
  border-color: rgba(251, 191, 36, 0.45) !important;
  border-left: 4px solid #f59e0b !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card.is-pw-above {
  background: linear-gradient(145deg, rgba(68, 14, 32, 0.68), rgba(15, 23, 42, 0.85)) !important;
  border-color: rgba(251, 113, 133, 0.48) !important;
  border-left: 4px solid #f43f5e !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card.is-sup-real {
  background: #ecfdf5 !important;
  border-color: rgba(16, 185, 129, 0.4) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card.is-sub-res {
  background: #fffbeb !important;
  border-color: rgba(245, 158, 11, 0.4) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card.is-pw-above {
  background: #fff1f2 !important;
  border-color: rgba(244, 63, 94, 0.4) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-tag {
  display: inline-flex !important;
  align-items: center !important;
  align-self: flex-start !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  font: 800 0.74rem/1.25 var(--aku-font-mono) !important;
  background: rgba(2, 6, 23, 0.55) !important;
  color: #f8fafc !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card.is-sup-real .gre-role-tag {
  color: #6ee7b7 !important;
  border: 1px solid rgba(52, 211, 153, 0.45) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card.is-sub-res .gre-role-tag {
  color: #fde68a !important;
  border: 1px solid rgba(251, 191, 36, 0.45) !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card.is-pw-above .gre-role-tag {
  color: #fda4af !important;
  border: 1px solid rgba(251, 113, 133, 0.48) !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-tag {
  background: #ffffff !important;
  color: #0f172a !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card p {
  margin: 0 !important;
  font: 500 0.77rem/1.45 var(--aku-font-body) !important;
  color: #cbd5e1 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card p b {
  color: #f8fafc !important;
  font-weight: 700 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card p {
  color: #334155 !important;
}
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gre-role-card p b {
  color: #0f172a !important;
}

/* ==========================================================================
   V264 — AUDI FEEDBACK PARITY (2026-10-31):
   1. Two-Lane Zero-Overlap Shaft Lock: reset min-width: 0 !important on .dc-es-cabin (fixing v205 min-width: 132px bleed) so all 4 intermediate ticks ($754 · $755 · $757 · $758) render in the right lane without colliding with the cabin or each other
   2. Collapsed Master Reference Fold (details.hcd-master-fold) for .hcd-grid & .hcd-abbr-chips so it does not duplicate the GEX Skyline below by default
   ========================================================================== */
html body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .elv-shaft.is-ticked-shaft.dc-elev-shaft-col {
  padding: 10px 6px !important;
  gap: 8px !important;
  min-height: 396px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-es-track {
  min-height: 316px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .elv-car.is-cabin.dc-es-cabin,
html[data-theme="dark"] body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .elv-shaft.is-two-lane .elv-car.is-cabin.dc-es-cabin,
html[data-theme="light"] body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .elv-shaft.is-two-lane .elv-car.is-cabin.dc-es-cabin {
  left: 4px !important;
  right: auto !important;
  width: 66px !important;
  min-width: 0 !important;
  max-width: 66px !important;
  padding: 4px 5px !important;
  z-index: 12 !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-es-tick {
  left: 36px !important;
  right: 2px !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-es-tick .dc-est-line,
html body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-es-tick.is-hit .dc-est-line {
  margin-left: 0 !important;
  width: 34px !important;
  flex: 0 0 34px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-es-tick.is-near-cabin .dc-est-line {
  margin-left: 34px !important;
  width: 6px !important;
  flex: 0 0 6px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-es-tick .dc-est-tag {
  margin-left: auto !important;
  width: 74px !important;
  min-width: 74px !important;
  max-width: 74px !important;
  flex: 0 0 74px !important;
  padding: 2.5px 6px !important;
  box-sizing: border-box !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) details.hcd-master-fold {
  margin-top: 12px !important;
}
html body:not(#akw):not(#akx) #main:not(#aky) details.hcd-master-fold > summary {
  font-size: 0.80rem !important;
  opacity: 0.92 !important;
}


/* ==========================================================================
   V265 — OUTERMOST BOX REMOVAL & ANTI-"BOX-IN-BOX-IN-BOX" FLATTENING (Audi 2026-10-31)
   Quote: "คุณคิดว่าที่หน้าตอนนี้มันมีบางส่วนดูเป็นกล่องในกล่องในกล่อง เกินไปไหม?
   เริ่มจากเอากล่องนอกสุดออกก่อนไหม ที่คลุมทุกอย่างอยู๋อ่ะ
   แล้วนอกจากนี้ในหน้านี้ มีนมีข้อมูลเดียวกันแต่อยู่หลายส่วนไหม?"
   1. Remove outermost wrapper box (#dteAbLiveStage & section.panel > .wrap) across Dark/Light
   2. Unbox .panel-head & #mkLevels outer container so top-level cards sit directly on the canvas
   3. Flatten inner nested boxes (.gj-quota-strip, .gj-vis-box, .macd-rsi-box, .rsi-act-box,
      .dc-elev-wing-right, .dc-elev-howto-bar, .dc-elb-tactical-line, .dc-gsky-cluster-bar, .gex-under-legend)
   4. Convert #mkLevels .lvl-list into a slim 1-row inline HUD bar
   ========================================================================== */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku),
html[data-theme="dark"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku),
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku),
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) section.panel:not(#akz) > .wrap:not(#aku) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* Unbox .panel-head so it doesn't sit as a thick box above #mkStatus box */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage > .panel-head,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) section.panel:not(#akz) .panel-head {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 2px 2px 10px 2px !important;
  border-radius: 0 !important;
  margin-bottom: 6px !important;
}

/* Unbox #mkLevels outer container so .dte-elev and .gex-bars-card are top-level peer cards (not Box inside Box inside Box) */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels,
html[data-theme="dark"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels,
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 6px 0 0 0 !important;
  border-radius: 0 !important;
}

/* V266: Rich GEX-Tab Semantic Color Glow & Tinted Surfaces for #mkLevels .lvl-list (frameless outer row + glowing semantic cards) */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip,
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels .lvl-list.is-frameless-strip {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(185px, 1fr)) !important;
  gap: 10px !important;
  padding: 0 !important;
  margin: 6px 0 14px 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip > .stat,
html[data-theme="dark"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip > .stat,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels .lvl-list.is-frameless-strip > .stat {
  border-radius: 14px !important;
  padding: 11px 14px !important;
  min-height: 0 !important;
  position: relative !important;
  overflow: hidden !important;
}
/* 1. Call Wall (Emerald Glow) */
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip > .stat:nth-child(1),
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels .lvl-list.is-frameless-strip > .stat.is-tone-green {
  background: radial-gradient(125% 110% at 0% 0%, rgba(16, 185, 129, 0.28) 0%, rgba(6, 52, 38, 0.84) 55%, rgba(7, 20, 34, 0.94) 100%) !important;
  border: 1px solid rgba(52, 211, 153, 0.55) !important;
  box-shadow: 0 10px 26px -10px rgba(16, 185, 129, 0.45), inset 0 1px 0 rgba(167, 243, 208, 0.25) !important;
}
/* 2. Put Wall (Crimson Rose Glow) */
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip > .stat:nth-child(2),
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels .lvl-list.is-frameless-strip > .stat.is-tone-red {
  background: radial-gradient(125% 110% at 0% 0%, rgba(244, 63, 94, 0.28) 0%, rgba(68, 12, 30, 0.84) 55%, rgba(10, 18, 34, 0.94) 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.55) !important;
  box-shadow: 0 10px 26px -10px rgba(244, 63, 94, 0.45), inset 0 1px 0 rgba(254, 205, 211, 0.25) !important;
}
/* 3. Zero Gamma (Amber Gold Glow) */
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip > .stat:nth-child(3) {
  background: radial-gradient(125% 110% at 0% 0%, rgba(245, 158, 11, 0.28) 0%, rgba(62, 36, 8, 0.82) 55%, rgba(10, 18, 34, 0.94) 100%) !important;
  border: 1px solid rgba(251, 191, 36, 0.55) !important;
  box-shadow: 0 10px 26px -10px rgba(245, 158, 11, 0.42), inset 0 1px 0 rgba(254, 240, 138, 0.25) !important;
}
/* 4. Net GEX (Intense Crimson when Negative / Emerald when Positive) */
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip > .stat:nth-child(4).is-tone-red {
  background: radial-gradient(130% 115% at 10% 0%, rgba(225, 29, 72, 0.36) 0%, rgba(82, 17, 40, 0.90) 58%, rgba(41, 9, 21, 0.96) 100%) !important;
  border: 1.5px solid rgba(251, 113, 133, 0.68) !important;
  box-shadow: 0 12px 28px -8px rgba(244, 63, 94, 0.52), inset 0 1px 0 rgba(254, 205, 211, 0.30) !important;
}
/* 5. Expected Move (Luminous Sky-Cyan Glow) */
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip > .stat:nth-child(5) {
  background: radial-gradient(125% 110% at 0% 0%, rgba(56, 189, 248, 0.26) 0%, rgba(12, 42, 72, 0.84) 55%, rgba(8, 18, 34, 0.94) 100%) !important;
  border: 1px solid rgba(56, 189, 248, 0.52) !important;
  box-shadow: 0 10px 26px -10px rgba(56, 189, 248, 0.40), inset 0 1px 0 rgba(186, 230, 253, 0.25) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip > .stat b,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels .lvl-list.is-frameless-strip > .stat b {
  font-size: 1.18rem !important;
  line-height: 1.2 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .lvl-list.is-frameless-strip > .stat em,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels .lvl-list.is-frameless-strip > .stat em {
  font-size: 0.74rem !important;
  line-height: 1.3 !important;
  display: block !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Flatten nested boxes inside #mkSpy (.gj-quota-strip, .gj-qs-verdict, .gj-vis-box, details.msr-play-fold) */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .gj-quota-strip,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .gj-qs-verdict,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .gj-vis-box {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .gj-quota-strip {
  padding: 6px 0 8px 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy details.msr-play-fold {
  margin-top: 8px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy details.msr-play-fold > summary {
  font-size: 0.78rem !important;
  padding: 7px 12px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-2bounce-strip {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 8px 0 0 0 !important;
}

/* Flatten nested boxes inside #mkMacd (.mk-timing-strip .mts-item.is-rsi-dial-card, .mts-sim-bar) */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkMacd .mk-timing-strip .mts-item.is-rsi-dial-card,
html[data-theme="dark"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkMacd .mk-timing-strip .mts-item.is-rsi-dial-card,
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkMacd .mk-timing-strip .mts-item.is-rsi-dial-card,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mk-timing-strip .mts-item.is-rsi-dial-card {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 12px 0 6px 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkMacd .mk-timing-strip .mts-sim-bar,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mk-timing-strip .mts-sim-bar {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Flatten nested boxes inside .dte-elev (🛗 ลิฟต์ราคา) & .gex-bars-card (🏙️ ตึกระฟ้า GEX) */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-elev-howto-bar.is-slim-lock-line,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-elev-wing-right {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-elev-howto-bar.is-slim-lock-line {
  padding: 4px 0 10px 0 !important;
  margin-bottom: 8px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-elb-tactical-line {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 6px 12px !important;
  padding-top: 4px !important;
  font-size: 0.76rem !important;
  line-height: 1.35 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-elbt-facs {
  color: rgba(203, 213, 225, 0.9) !important;
  font-weight: 600 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-elbt-facs {
  color: #334155 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-elbt-act {
  color: #fde68a !important;
  font-weight: 700 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev.is-craft-e-upgraded .dc-elbt-act {
  color: #0f172a !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .gex-bars-card .dc-gsky-cluster-bar,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .gex-bars-card .gex-under-legend {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ==========================================================================
   V266 · AUDI FEEDBACK PARITY (2026-10-31):
   1. #mkSweepRadar 3-Dimension Real-Time Status Tracker (.msr-status-tracker)
   2. #mkOdds Directional Color Parity (CALL ขึ้น = เขียว · PUT ลง = แดง) + Unboxed Funnel
   3. Unbox .dc-ecc-spot-hero & .dc-ecc-spot-route inside 🛗 ลิฟต์ราคา (.dc-elev-chain-core)
   4. Unbox #mkBreadth outer container & inner wings/stage inside 💸 กระแสเงิน 11 กลุ่มหุ้น
   ========================================================================== */

/* 1. #mkSweepRadar 3-Dimension Real-Time Status Tracker */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-status-tracker {
  display: grid !important;
  gap: 6px !important;
  margin: 6px 0 8px 0 !important;
  padding: 8px 0 6px 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  background: transparent !important;
  box-shadow: none !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-row {
  display: grid !important;
  grid-template-columns: 148px minmax(0, 1fr) !important;
  align-items: baseline !important;
  gap: 8px !important;
  padding: 3px 0 !important;
  font-size: 0.78rem !important;
  line-height: 1.38 !important;
}
@media (max-width: 640px) {
  html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-row {
    grid-template-columns: 1fr !important;
    gap: 2px !important;
  }
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-lbl {
  font-weight: 700 !important;
  color: rgba(148, 163, 184, 0.92) !important;
  white-space: nowrap !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-lbl {
  color: #475569 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val {
  color: #e2e8f0 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val {
  color: #0f172a !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-done b {
  color: #6ee7b7 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-wick-strong b,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-approaching b {
  color: #fde68a !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-firing b {
  color: #fda4af !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-calm b {
  color: #7dd3fc !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-done b {
  color: #047857 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-wick-strong b,
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-approaching b {
  color: #b45309 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-firing b {
  color: #be123c !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-st-val.is-calm b {
  color: #0369a1 !important;
}

/* 2. #mkOdds Directional Color Parity (CALL ขึ้น = เขียว · PUT ลง = แดง) + Unboxed Funnel */
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .odds-verdict.is-bad,
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-verdict.is-bad {
  background: radial-gradient(120% 120% at 0% 0%, rgba(244, 63, 94, 0.24) 0%, rgba(68, 12, 30, 0.78) 55%, rgba(18, 10, 24, 0.92) 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.52) !important;
  border-left: 4px solid #f43f5e !important;
  box-shadow: 0 10px 26px -10px rgba(244, 63, 94, 0.42) !important;
  color: #fecdd3 !important;
}
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .odds-verdict.is-bad .odds-verdict-copy > b,
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-verdict.is-bad .odds-verdict-copy > b {
  color: #fda4af !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict.is-bad {
  background: linear-gradient(135deg, #fff1f2, #ffe4e6) !important;
  border: 1px solid rgba(225, 29, 72, 0.35) !important;
  border-left: 4px solid #e11d48 !important;
  color: #881337 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-funnel-viz {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-left: 1px solid rgba(148, 163, 184, 0.24) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 2px 0 2px 16px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict.is-bad .ofv-row.is-match .ofv-pct {
  color: #fda4af !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict.is-bad .ofv-row.is-match .ofv-pct {
  color: #be123c !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-verdict.is-bad .ofv-row.is-match .ofv-track > i {
  background: linear-gradient(90deg, #e11d48, #fb7185) !important;
}
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .odds-num.is-bad,
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-num.is-bad {
  background: radial-gradient(125% 115% at 0% 0%, rgba(244, 63, 94, 0.25) 0%, rgba(64, 12, 28, 0.84) 58%, rgba(16, 10, 22, 0.94) 100%) !important;
  border: 1px solid rgba(251, 113, 133, 0.52) !important;
  border-top: 3px solid #f43f5e !important;
  box-shadow: 0 10px 24px -10px rgba(244, 63, 94, 0.42) !important;
}
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .odds-num.is-bad b,
html:not([data-theme="light"]) body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-num.is-bad b {
  color: #fda4af !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-num.is-bad {
  background: linear-gradient(155deg, #fff1f2, #ffe4e6) !important;
  border: 1px solid rgba(225, 29, 72, 0.36) !important;
  border-top: 3px solid #e11d48 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .odds-num.is-bad b {
  color: #be123c !important;
}

/* 3. Unbox .dc-ecc-spot-hero & .dc-ecc-spot-route inside 🛗 ลิฟต์ราคา (.dc-elev-chain-core) */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev .dc-elev-chain-core .dc-ecc-spot-hero,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev .dc-elev-chain-core .dc-ecc-spot-hero.is-clash,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev .dc-elev-chain-core .dc-ecc-spot-hero.is-dn {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(251, 191, 36, 0.26) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 0 8px 0 !important;
  margin-bottom: 8px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev .dc-elev-chain-core .dc-ecc-spot-route {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  color: #fde68a !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev .dc-elev-chain-core .dc-ecc-spot-route {
  color: #92400e !important;
}

/* 4. Unbox #mkBreadth outer container & inner wings/stage inside 💸 กระแสเงิน 11 กลุ่มหุ้น */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkBreadth,
html[data-theme="dark"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkBreadth,
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkBreadth,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkBreadth {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 4px 0 0 0 !important;
  border-radius: 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(#mkBreadth, #mkCross) .spy-clash-arena .sca-fighter,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(#mkBreadth, #mkCross) .spy-clash-arena .dc-sf-wing,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(#mkBreadth, #mkCross) .spy-clash-arena .sca-battle-stage,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(#mkBreadth, #mkCross) .spy-clash-arena .dc-jjk-heatmap-strip,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkBreadth .smf-verdict-banner,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkBreadth .smf-rot-chip,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkBreadth .smf-flow-col {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(#mkBreadth, #mkCross) .spy-clash-arena .sca-fighter.is-bull {
  padding-right: 14px !important;
  border-right: 1px solid rgba(148, 163, 184, 0.18) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(#mkBreadth, #mkCross) .spy-clash-arena .sca-fighter.is-bear {
  padding-left: 14px !important;
}
@media (max-width: 860px) {
  html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(#mkBreadth, #mkCross) .spy-clash-arena .sca-fighter.is-bull {
    padding-right: 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
    padding-bottom: 10px !important;
  }
  html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(#mkBreadth, #mkCross) .spy-clash-arena .sca-fighter.is-bear {
    padding-left: 0 !important;
    padding-top: 10px !important;
  }
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkBreadth .smf-verdict-banner {
  padding: 2px 0 8px 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(#mkBreadth, #mkCross) .spy-clash-arena .dc-jjk-heatmap-strip {
  padding-top: 10px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
}

/* 5. Neutral slate for base row percentage in #mkOdds funnel & unbox .msr-ev-reb / .msr-ev-tier-pill inside #mkSpy .msr-ev-chip */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .ofv-row.is-base .ofv-pct {
  color: #cbd5e1 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkOdds .ofv-row.is-base .ofv-pct {
  color: #475569 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-chip .msr-ev-reb,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-chip .msr-ev-tier-pill,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-ev-chip .msr-ev-reb,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-ev-chip .msr-ev-tier-pill {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkSweepRadar .msr-ev-chip .msr-ev-reb,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-ev-chip .msr-ev-reb {
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  padding: 6px 0 0 0 !important;
  margin-top: 6px !important;
}

/* 6. Unbox macro-section outer wrappers (.dte-elev, #dteMorningWallStrip, .gex-bars-card, .is-sector-kame-clash, .spy-clash-arena) so inner cards are true Level-1 cards (zero Box-in-Box) */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .hcd-price-tower.dte-elev.is-craft-e-upgraded,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .hcd-price-tower.dte-elev.is-craft-e-upgraded,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels .dte-elev.is-craft-e-upgraded,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkLevels .gex-bars-card.dc-beauty-stage.is-craft-skyline,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkLevels .gex-bars-card.dc-beauty-stage.is-craft-skyline,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels .gex-bars-card.dc-beauty-stage.is-craft-skyline,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkBreadth .is-sector-kame-clash.dc-beauty-stage,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkBreadth .is-sector-kame-clash.dc-beauty-stage,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkBreadth .is-sector-kame-clash.dc-beauty-stage,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkCross .spy-clash-arena,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #mkCross .spy-clash-arena,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkCross .spy-clash-arena {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 14px 0 6px 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev #dteMorningWallStrip,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) .dte-elev .dte-mwall-strip,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #dteMorningWallStrip {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 4px 0 8px 0 !important;
  margin-bottom: 10px !important;
}

/* ==========================================================================
   V269 — UI NUMBER FONT LOCK (Google Sans tabular-nums, NO JetBrains Mono 0-dot)
   + #panel-market FULL VISUAL, BUTTON, INFOGRAPHIC & ANIMATION UPGRADE
   ========================================================================== */

/* 1. Retire JetBrains Mono on UI numbers so '0' in 10%, 90%, 60%, +0.22% never looks like '8' */
:root,
html,
body,
html[data-theme="dark"],
html[data-theme="light"] {
  --aku-font-mono: 'AK Thai', 'Google Sans', 'Noto Sans Thai', sans-serif !important;
  --mono: 'AK Thai', 'Google Sans', 'Noto Sans Thai', sans-serif !important;
}

html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) :is(
  .dc-sf-wing-lbl b,
  .dc-sf-wing-lbl em,
  .sca-f-kicker b,
  .ofv-pct,
  .osp-pct,
  .odds-delta-pill,
  .on-pill,
  .odds-num b,
  .gb-k,
  .gb-v,
  .dc-eg-px,
  .gj-kpi-num,
  .mts-item b,
  .lvl-list .stat b,
  .dc-ecc-spot-px,
  .hm-cell b,
  .msr-hud-main b,
  .msr-ev-top b,
  .mws-Side-pct
) {
  font-family: 'AK Thai', 'Google Sans', 'Noto Sans Thai', sans-serif !important;
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" 1, "zero" 0 !important;
  letter-spacing: -0.015em !important;
}

/* 2. Shrink .rsi-sim-pills (⚡ ≤30 · 📡 สด · 🔥 ≥70) to fit-content — no stretched bar */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-rsi-head {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .rsi-sim-pills {
  display: inline-flex !important;
  width: fit-content !important;
  max-width: max-content !important;
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  margin-left: auto !important;
  padding: 3px 5px !important;
  gap: 4px !important;
  border-radius: 999px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .rsi-sim-btn {
  flex: 0 0 auto !important;
  width: auto !important;
  padding: 3px 9px !important;
  font-size: 11.5px !important;
  white-space: nowrap !important;
}

/* 3. #mkMacd 3-Column Visual Position Radar (.mts-right-stack.is-aligned-3col) + Pulsing Spot Dot */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-right-stack.is-aligned-3col {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: stretch !important;
}
@media (max-width: 900px) {
  html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-right-stack.is-aligned-3col {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-right-stack.is-aligned-3col .mts-item {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 6px !important;
  padding: 12px 14px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-right-stack.is-aligned-3col .mts-verdict {
  grid-column: 1 / -1 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 10px 2px 2px 2px !important;
  margin-top: 2px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-pos-track {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 8px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.16) !important;
  margin: 4px 0 2px 0 !important;
  overflow: visible !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-pos-track.is-bull {
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.14) 0%, rgba(16, 185, 129, 0.28) 100%) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-pos-track.is-bear {
  background: linear-gradient(90deg, rgba(244, 63, 94, 0.28) 0%, rgba(148, 163, 184, 0.14) 100%) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-ref-line {
  position: absolute !important;
  top: -3px !important;
  bottom: -3px !important;
  width: 2px !important;
  background: rgba(226, 232, 240, 0.75) !important;
  border-radius: 2px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-orb-zone {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 25% !important;
  width: 50% !important;
  background: rgba(245, 158, 11, 0.22) !important;
  border-left: 1.5px dashed rgba(245, 158, 11, 0.65) !important;
  border-right: 1.5px dashed rgba(245, 158, 11, 0.65) !important;
}
@keyframes dteSpotBeaconPulse {
  0%, 100% { transform: translate(-50%, -50%) scale(1); box-shadow: 0 0 0 0 rgba(56, 189, 248, 0.55); }
  50% { transform: translate(-50%, -50%) scale(1.18); box-shadow: 0 0 0 6px rgba(56, 189, 248, 0); }
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-spot-dot {
  position: absolute !important;
  top: 50% !important;
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  background: #38bdf8 !important;
  border: 2px solid #0f172a !important;
  transform: translate(-50%, -50%) !important;
  animation: dteSpotBeaconPulse 2.2s infinite ease-in-out !important;
  z-index: 2 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-pos-track.is-bull .mts-spot-dot {
  background: #10b981 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-pos-track.is-bear .mts-spot-dot {
  background: #f43f5e !important;
}

/* 4. #mkOdds 3-Stage Visual Filter Pipeline (.odds-step-pipeline) + Animated Flow Arrow */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .odds-verdict,
html[data-theme="dark"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .odds-verdict,
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .odds-verdict,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-verdict {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: 1fr !important;
  align-items: stretch !important;
  gap: 10px !important;
  padding: 14px 18px !important;
  overflow: hidden !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-verdict-copy {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 100% !important;
  gap: 10px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-verdict-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-bottom: 2px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-delta-pill {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 11px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  background: rgba(148, 163, 184, 0.14) !important;
  color: #e2e8f0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-delta-pill.is-up {
  background: rgba(16, 185, 129, 0.18) !important;
  color: #6ee7b7 !important;
  border: 1px solid rgba(16, 185, 129, 0.35) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-delta-pill.is-dn {
  background: rgba(244, 63, 94, 0.18) !important;
  color: #fda4af !important;
  border: 1px solid rgba(244, 63, 94, 0.35) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-step-pipeline {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(190px, 0.85fr) minmax(0, 1.08fr) !important;
  gap: 14px !important;
  align-items: center !important;
  width: 100% !important;
  margin-top: 2px !important;
}
@media (max-width: 860px) {
  html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-step-pipeline {
    grid-template-columns: 1fr !important;
  }
}
/* Unbox .osp-stage inside .odds-verdict so there is ZERO box-in-box */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .osp-stage,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-stage {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 4px 6px !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-step-kicker {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #cbd5e1 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-step-kicker {
  color: #334155 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-metric-row {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .osp-stage.is-base-stage .ofv-pct,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-stage.is-base-stage .ofv-pct {
  font-size: 26px !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  color: #cbd5e1 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-stage.is-base-stage .ofv-pct {
  color: #475569 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .odds-verdict.is-bad .osp-stage.is-match-stage .ofv-pct,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-verdict.is-bad .osp-stage.is-match-stage .ofv-pct {
  font-size: 26px !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  color: #fb7185 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-verdict.is-bad .osp-stage.is-match-stage .ofv-pct {
  color: #be123c !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #panel-market:not(#akz) #dteAbLiveStage:not(#aku) #mkOdds .odds-verdict.is-good .osp-stage.is-match-stage .ofv-pct,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .odds-verdict.is-good .osp-stage.is-match-stage .ofv-pct {
  font-size: 26px !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  color: #34d399 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-days {
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-bar-track {
  width: 100% !important;
  height: 8px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.18) !important;
  overflow: hidden !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-bar-fill {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: #64748b !important;
}
@keyframes dteBarShimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-stage.is-matched.is-dn .osp-bar-fill.is-shimmer-bar {
  background: linear-gradient(90deg, #e11d48 0%, #fb7185 50%, #e11d48 100%) !important;
  background-size: 200% 100% !important;
  animation: dteBarShimmer 3.2s infinite linear !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-stage.is-matched.is-up .osp-bar-fill.is-shimmer-bar {
  background: linear-gradient(90deg, #059669 0%, #34d399 50%, #059669 100%) !important;
  background-size: 200% 100% !important;
  animation: dteBarShimmer 3.2s infinite linear !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-sub {
  font-size: 11.5px !important;
  color: #94a3b8 !important;
}
@keyframes dteOddsArrowSlide {
  0%, 100% { transform: translateX(-4px); opacity: 0.65; }
  50% { transform: translateX(4px); opacity: 1; }
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-filter-bridge {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-align: center !important;
  padding: 4px 10px !important;
  border-left: 1px dashed rgba(148, 163, 184, 0.25) !important;
  border-right: 1px dashed rgba(148, 163, 184, 0.25) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-arrow-flow {
  font-size: 20px !important;
  font-weight: 900 !important;
  color: #38bdf8 !important;
  animation: dteOddsArrowSlide 1.8s infinite ease-in-out !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkOdds .osp-filter-pills {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 5px !important;
}

/* 5. #mkSweepRadar 3-Column Visual HUD (.msr-status-tracker.is-hud-3col) */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-status-tracker.is-hud-3col {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin: 8px 0 10px 0 !important;
  padding: 10px 0 !important;
  border-top: 1px solid rgba(148, 163, 184, 0.18) !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
}
@media (max-width: 860px) {
  html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-status-tracker.is-hud-3col {
    grid-template-columns: 1fr !important;
  }
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-status-tracker.is-hud-3col .msr-st-row {
  display: flex !important;
  flex-direction: column !important;
  grid-template-columns: 1fr !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 5px !important;
  padding: 2px 12px 2px 2px !important;
  border-right: 1px solid rgba(148, 163, 184, 0.16) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-status-tracker.is-hud-3col .msr-st-row:last-child {
  border-right: 0 !important;
  padding-right: 2px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-status-tracker.is-hud-3col .msr-st-lbl {
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-status-tracker.is-hud-3col .msr-st-val {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  width: 100% !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-hud-main {
  font-size: 13.5px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-hud-track {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 7px !important;
  border-radius: 999px !important;
  background: rgba(148, 163, 184, 0.18) !important;
  overflow: visible !important;
  margin: 3px 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-hud-fill {
  display: block !important;
  height: 100% !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, #38bdf8, #818cf8) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-thresh-tick {
  position: absolute !important;
  top: -3px !important;
  bottom: -3px !important;
  width: 2px !important;
  background: #f59e0b !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-spot-beacon {
  position: absolute !important;
  top: 50% !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  background: #38bdf8 !important;
  border: 2px solid #0f172a !important;
  transform: translate(-50%, -50%) !important;
  animation: dteSpotBeaconPulse 2s infinite ease-in-out !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-hud-sub {
  font-size: 11.5px !important;
  color: #94a3b8 !important;
}

/* 6. Unbox remaining micro-chips (.gj-swing-chip in #mkSpy & .dc-jhs-stocks span in #mkBreadth) + style folded GEX guide */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .gj-swing-chip,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkBreadth .dc-jhs-stocks span {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 2px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels details.gex-how-fold {
  margin-top: 10px !important;
  padding-top: 8px !important;
  border-top: 1px solid rgba(148, 163, 184, 0.16) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkLevels details.gex-how-fold > summary {
  cursor: pointer !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  padding: 4px 0 !important;
}

/* ==========================================================================
   V270 — DUAL-SIDE LIQUIDITY SWEEP (ทั้ง 2 ฝั่ง: 🔻 กวาดบน Put➔Call · 🔺 กวาดล่าง Call➔Put)
   ========================================================================== */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-ev-play-hint {
  display: block !important;
  margin-top: 6px !important;
  padding-top: 6px !important;
  border-top: 1px dashed rgba(148, 163, 184, 0.2) !important;
  font-size: 11.5px !important;
  line-height: 1.38 !important;
  color: #cbd5e1 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-ev-play-hint.is-up-sweep b {
  color: #fda4af !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-ev-play-hint.is-lo-sweep b {
  color: #6ee7b7 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-ev-play-hint {
  color: #334155 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-dual-infographic-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin-top: 8px !important;
}
@media (max-width: 900px) {
  html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-dual-infographic-grid {
    grid-template-columns: 1fr !important;
  }
}
/* Frameless hairline split inside .msr-play-fold so there is ZERO box-in-box */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-side-card {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 6px 4px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-side-card.is-upper-card {
  padding-right: 14px !important;
  border-right: 1px solid rgba(148, 163, 184, 0.18) !important;
}
@media (max-width: 900px) {
  html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-side-card.is-upper-card {
    padding-right: 4px !important;
    border-right: 0 !important;
    padding-bottom: 12px !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
  }
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-side-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-side-title {
  font-size: 13px !important;
  font-weight: 800 !important;
  color: #f8fafc !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-side-title {
  color: #0f172a !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-side-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 9px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  background: rgba(148, 163, 184, 0.14) !important;
  color: #94a3b8 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-side-badge.is-hit {
  background: rgba(245, 158, 11, 0.18) !important;
  color: #fcd34d !important;
  border: 1px solid rgba(245, 158, 11, 0.38) !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy details.msr-play-fold,
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-play-fold-body {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-side-card svg.msr-infographic-svg {
  width: 100% !important;
  height: auto !important;
  min-height: 112px !important;
  display: block !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-step-grid.is-compact-3 {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  margin-top: 4px !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-step-grid.is-compact-3 .msr-step-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: baseline !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  padding: 4px 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(148, 163, 184, 0.14) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-step-grid.is-compact-3 .msr-step-card:last-child {
  border-bottom: 0 !important;
}

/* ==========================================================================
   V272 — SEMANTIC LINE-BREAK CHUNKING (แยกบรรทัดสถานะหลัก vs ตัวเลข/หน่วยนับ)
   Audi 2026-10-31: "การขึ้นบรรทัดใหม่ เช่น ⚪ ไม่เกิด Sweep 0 รอบในรอบนี้ -> ⚪ ไม่เกิด Sweep \n 0 รอบในรอบนี้ ไม่งั้นมันจะอ่านต่อกันแล้วงงอ่ะ"
   ========================================================================== */
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-hud-main {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  line-height: 1.25 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-hud-main > b {
  display: block !important;
  font-size: 13.8px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-hud-main > small {
  display: block !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #94a3b8 !important;
  line-height: 1.28 !important;
}
html[data-theme="light"] body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy .msr-hud-main > small {
  color: #475569 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy details.msr-play-fold > summary .msr-fold-tag {
  white-space: nowrap !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkSpy details.msr-play-fold > summary .msr-fold-sub {
  display: inline-block !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #94a3b8 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-right-stack .mts-item .mts-sub-val {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 2px !important;
  line-height: 1.3 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-right-stack .mts-item .mts-sub-val > b {
  display: block !important;
  font-size: 13.5px !important;
  font-weight: 800 !important;
}
html body:not(#akv):not(#akw):not(#akx) #main:not(#aky) #mkMacd .mts-right-stack .mts-item .mts-sub-val > small {
  display: block !important;
  font-size: 11.8px !important;
  font-weight: 600 !important;
  color: #94a3b8 !important;
}