/* 0DTE sub-nav = the site's approved in-page zone bar (finance option A, /design-standard.html#z-subnav):
   one night-glass bar · each group = a capsule tinted with its colour · tabs are plain pills (sprite + name) ·
   the open tab fills with its group colour · sticky under the shell; while stuck = one swipe row.
   Audi 2026-10-25: "แก้คือแก้ให้เหมือนหน้าอื่นเลยนะพวกsub navigator" (the old rail = bordered gradient pills + labels above).
   Selectors carry #tabList + :not(#a…) ids so they beat the older rail layers in dte-workspace.css. */
html body nav.tabs:not(#akx){position:sticky!important;top:var(--ak-shell-height,72px)!important;z-index:40!important;margin:8px 0 6px!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
html body nav.tabs:not(#akx) .dte-tab-shell{max-width:none!important;width:auto!important;margin:0 auto!important;padding:0 24px!important;background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important}
html body nav.tabs:not(#akx) #tabList:not(#a){display:flex!important;flex-wrap:wrap!important;flex-direction:row!important;justify-content:center!important;align-items:center!important;gap:8px 10px!important;grid-template-columns:none!important;padding:8px 10px!important;border-radius:18px!important;background:none!important;border:0!important;box-shadow:none!important;-webkit-backdrop-filter:none;backdrop-filter:none;overflow:visible;scrollbar-width:none}
html body nav.tabs:not(#akx) #tabList::-webkit-scrollbar{display:none}
html body nav.tabs:not(#akx) #tabList .tab-sep,html body nav.tabs:not(#akx) #tabList .dte-tab-indicator{display:none!important}
html body nav.tabs:not(#akx) #tabList .tab-group:not(#a){position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;user-select:none!important;-webkit-user-select:none!important;pointer-events:none!important;margin:0!important;padding:0!important;border:0!important}
/* group capsule */
html body nav.tabs:not(#akx) #tabList .tab-pod:not(#a):not(#b){--g:#22d3ee;display:inline-flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;flex:0 0 auto!important;width:max-content!important;min-width:max-content!important;max-width:none!important;height:auto!important;min-height:0!important;gap:2px!important;padding:3px 4px!important;margin:0!important;border:0!important;border-radius:999px!important;background:color-mix(in srgb,var(--g) 22%,transparent)!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--g) 45%,transparent)!important;box-sizing:border-box!important}
html body nav.tabs:not(#akx) #tabList .tab-pod[data-pod=guide]:not(#a):not(#b):not(#c){--g:#fbbf24}
html body nav.tabs:not(#akx) #tabList .tab-pod[data-pod=market]:not(#a):not(#b):not(#c){--g:#22d3ee}
html body nav.tabs:not(#akx) #tabList .tab-pod[data-pod=desk]:not(#a):not(#b):not(#c){--g:#34d399}
html body nav.tabs:not(#akx) #tabList .tab-pod[data-pod=journal]:not(#a):not(#b):not(#c){--g:#f472b6}
html body nav.tabs:not(#akx) #tabList .tab-pod[data-pod=learn]:not(#a):not(#b):not(#c){--g:#c084fc}
html body nav.tabs:not(#akx) #tabList .tab-pod[data-pod=owner]:not(#a):not(#b):not(#c){--g:#fb7185}
html body nav.tabs:not(#akx) #tabList .tab-pod-btns:not(#a){display:inline-flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:flex-start!important;flex:0 0 auto!important;gap:2px!important;width:max-content!important;min-width:max-content!important;margin:0!important;padding:0!important;grid-template-columns:none!important;background:none!important;border:0!important}
/* tab = plain pill */
html body nav.tabs:not(#akx) #tabList .tab:not(#a):not(#b){display:inline-flex!important;align-items:center!important;gap:6px!important;flex:0 0 auto!important;width:auto!important;min-width:0!important;height:34px!important;min-height:34px!important;padding:0 12px!important;margin:0!important;border:0!important;border-radius:999px!important;background:none!important;box-shadow:none!important;outline-offset:2px;color:rgb(232,238,252)!important;font:600 .86rem/1 var(--font-body)!important;white-space:nowrap!important;opacity:1!important;filter:none!important;transform:none!important;text-shadow:none!important;transition:background-color .2s,color .2s!important}
html body nav.tabs:not(#akx) #tabList .tab:not(#a):not(#b)::before,html body nav.tabs:not(#akx) #tabList .tab:not(#a):not(#b)::after{content:none!important;display:none!important}
html body nav.tabs:not(#akx) #tabList .tab .tab-px{margin:0!important;transition:translate .25s}
html body nav.tabs:not(#akx) #tabList .tab:not(#a):not(#b):hover{background:color-mix(in srgb,var(--g) 26%,transparent)!important}
html body nav.tabs:not(#akx) #tabList .tab:not(#a):not(#b):hover .tab-px{translate:0 -2px}
/* tab text carries a light tint of its group so each capsule reads as its own colour family */
html:not([data-theme=light]) body nav.tabs:not(#akx) #tabList .tab:not([aria-selected="true"]):not(#a):not(#b){color:color-mix(in srgb,var(--g) 38%,rgb(240,244,252))!important}
html body nav.tabs:not(#akx) #tabList .tab[aria-selected="true"]:not(#a):not(#b){background:var(--g)!important;color:rgb(8,15,30)!important}
html body nav.tabs:not(#akx) #tabList .tab[aria-selected="true"]:not(#a):not(#b) .tab-px{animation:dteTabBob 1.6s ease-in-out infinite}
@keyframes dteTabBob{50%{translate:0 -2px}}
/* daylight: white bar, navy ink, same group colours */
html[data-theme=light] body nav.tabs:not(#akx) #tabList:not(#a){background:none!important;box-shadow:none!important}
html[data-theme=light] body nav.tabs:not(#akx) #tabList .tab:not(#a):not(#b){color:rgb(20,47,73)!important}
html[data-theme=light] body nav.tabs:not(#akx) #tabList .tab-pod:not(#a):not(#b){background:color-mix(in srgb,var(--g) 18%,white)!important}
html[data-theme=light] body nav.tabs:not(#akx) #tabList .tab[aria-selected="true"]:not(#a):not(#b){color:rgb(8,15,30)!important}
/* stuck under the shell: one swipe row, open tab kept in view by dte-subnav-sticky.js */
html body nav.tabs.is-stuck:not(#akx){margin-top:0!important}
html body nav.tabs.is-stuck:not(#akx) #tabList:not(#a){flex-wrap:nowrap!important;justify-content:flex-start!important;overflow-x:auto!important;padding:6px 8px!important;border-radius:0 0 16px 16px!important}
/* no black band at rest (Audi 2026-10-25: "แถบพื้นหลังของไอพวกนี้มันเห็นเป็นดำๆไม่สวย"); only while stuck over content does the row get
   a soft night-sky / dawn glass so the capsules stay readable on top of the page */
html body nav.tabs.is-stuck:not(#akx):not(#aky){padding:6px 0!important;background:rgba(9,23,45,.74)!important;-webkit-backdrop-filter:blur(14px) saturate(1.2)!important;backdrop-filter:blur(14px) saturate(1.2)!important;box-shadow:0 8px 20px -14px rgba(0,0,0,.6)!important}
html[data-theme=light] body nav.tabs.is-stuck:not(#akx):not(#aky){background:rgba(245,248,249,.82)!important;box-shadow:0 8px 20px -14px rgba(20,47,73,.35)!important}
html body nav.tabs.is-stuck:not(#akx) #tabList:not(#a){background:none!important;box-shadow:none!important;padding:0 8px!important}
html body nav.tabs.is-stuck:not(#akx) #tabList .tab:not(#a):not(#b){height:30px!important;min-height:30px!important}
@media (max-width:1600px){
html body nav.tabs:not(#akx) #tabList:not(#a){gap:8px!important;padding:8px!important}
html body nav.tabs:not(#akx) #tabList .tab:not(#a):not(#b){padding:0 8px!important;gap:5px!important}
}
@media (max-width:1080px){
html body nav.tabs:not(#akx) .dte-tab-shell{padding:0 12px!important}
html body nav.tabs:not(#akx) #tabList:not(#a){justify-content:flex-start!important}
html body nav.tabs:not(#akx) #tabList .tab:not(#a):not(#b){padding:0 10px!important;font-size:.82rem!important}
}
/* phones: one swipe row from the start (the wrapped rail took a whole screen before any content) */
@media (max-width:760px){
html body nav.tabs:not(#akx) #tabList:not(#a){flex-wrap:nowrap!important;overflow-x:auto!important;border-radius:14px!important}
}
html[data-motion=paused] nav.tabs #tabList .tab-px{animation:none!important}
@media (prefers-reduced-motion:reduce){nav.tabs #tabList .tab,nav.tabs #tabList .tab-px{animation:none!important;transition:none!important}}

/* sub-zone heading inside a zone: smaller, carries its parent as a crumb, hangs on a rail in the parent's colour
   instead of opening with a new divider. Audi 2026-10-25: the overlap section under 🧱 โครงสร้าง GEX looked like a peer zone. */
html body #main:not(#akx) .hist-confluence-deck:not(#a){border-top:0!important;margin-top:22px!important;padding-left:18px!important;border-left:3px solid rgba(245,158,11,.55)!important}
html body #main:not(#akx) .dte-subzone-title:not(#a){display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0!important;font:700 1.08rem/1.3 var(--font-head)!important;color:var(--text)!important}
html body #main:not(#akx) .dte-crumb:not(#a){display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font:700 .74rem/1 var(--font-body);color:#fcd34d;background:rgba(245,158,11,.16)}
html[data-theme=light] body #main:not(#akx) .dte-crumb:not(#a){color:#6b3f00;background:#fdecc0}
html body #main:not(#akx) .dte-subzone-sub:not(#a){margin:4px 0 0!important;font:500 .86rem/1.5 var(--font-body);color:var(--dte-dim,#a9b8cc)}
/* owner-only group stays hidden for visitors (the capsule rule above would otherwise show it) */
html body:not(.is-owner-view) nav.tabs:not(#akx) #tabList .owner-tab:not(#a):not(#b):not(#c){display:none!important}
/* SPY session path labels were painted with dark-theme fills (#cbd5e1/#f8fafc) and vanished on the dawn sky */
html[data-theme=light] body #main:not(#akx) svg text.wp-px{fill:#142f49!important}
html[data-theme=light] body #main:not(#akx) svg text.wp-role{fill:#3d546c!important}