/* shuriq-combar.css — the ShurIQ COMBAR, ported verbatim from the live shuriq-dbm editorial build
 * (v0.3.0, matches the local shuriq-dbm copy). No reimplementation. The only addition: the token
 * values these rules consume are pinned on the combar roots so the pitch page dark-surface tokens
 * (--bg:#21262E) cannot leak into the bar. Markup + behavior: shuriq-combar.js. Loaded on all pages.
 * Whole @media blocks are kept verbatim, so a few DBM page-level rules ride along inertly (.wrap,
 * #lens-panel) — they match nothing in this package.
 */
#combar, #cb-scrim, #m-drawer {
  --bg:#FFFFFF; --line:#ECECEC; --muted:#8C8C8A; --gapc:#1E50C8; --cobalt:#1E3A6E;
  --font-sans:"Geist",system-ui,-apple-system,sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
}
/* Narrow widths: single-column body. The left rail is hidden at <=1120px (the header
   persistent section panel #m-secpanel replaces it for section nav); above 1120px the sticky left rail stays. */
@media(max-width:1120px){.wrap{grid-template-columns:minmax(0,1fr)}}
#lens-panel .lp-rows{padding:8px;display:flex;flex-direction:column;gap:2px}
.lp-row{display:flex;align-items:center;border-radius:12px;padding:12px;cursor:pointer;transition:background .15s}
.lp-row:hover{background:#F5F5F7}
.lp-row.on{background:#F5F5F7}
.lp-row .ic{width:32px;height:32px;border:1.6px solid #C7C7CC;border-radius:9px;display:flex;align-items:center;justify-content:center;margin-right:14px;flex-shrink:0;color:#86868B}
.lp-row.on .ic{border-color:#111111;color:#111111}
.lp-row .tx b{display:block;font-weight:500;font-size:14px;color:#1D1D1F}
.lp-row.on .tx b{color:#111111}
.lp-row .tx span{font-size:12.5px;color:#86868B}
.lp-row .ck{margin-left:auto;color:#111111;font-size:14px;opacity:0;padding-left:10px}
.lp-row.on .ck{opacity:1}
.shur-lg{display:inline-flex;align-items:flex-start;line-height:1;font-family:Inter,system-ui,sans-serif;text-transform:none!important;letter-spacing:0!important}
.shur-lg b{text-transform:none!important;font-weight:500;letter-spacing:-0.04em;color:#FFFFFF;font-size:1em;line-height:1.05}
.shur-lg i{font-style:normal;font-weight:400;color:#888888;font-size:0.46em;margin-left:0.09em;margin-top:0.07em;letter-spacing:0}
/* persistent header */
/* Stripe-style header: transparent (no backplate) at top; backplate appears on hover; floating container by default once scrolled */
#combar{position:fixed;top:0;left:0;right:0;z-index:800;background:transparent;border:none;transition:background .35s}
#combar{padding:10px 72px}
#combar .cwrap{max-width:1440px;margin:0 auto;display:flex;flex-direction:column;
  background:transparent;border:1px solid transparent;border-radius:16px;
  -webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);transition:background .35s cubic-bezier(0.22,1,0.36,1),border-color .35s,backdrop-filter .35s,box-shadow .35s}
#combar .cbar{display:flex;align-items:center;gap:26px;padding:12px 22px}
/* scrolled off the very top (still over the cover), dark frosted backplate appears */
#combar.peeked .cwrap{background:rgba(15,8,9,0.42);border-color:rgba(255,255,255,0.10);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
/* scrolled, the floating container is shown by default (light, detached, shadow) */
#combar.scrolled .cwrap{background:rgba(255,255,255,0.86);border-color:rgba(0,0,0,0.06);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 8px 30px rgba(0,0,0,0.10),0 2px 8px rgba(0,0,0,0.05)}
#combar .shur-lg b{color:#fff;transition:color .35s}
#combar .shur-lg i{color:rgba(255,255,255,0.55)}
#combar.scrolled .shur-lg b{color:#111}
#combar.scrolled .shur-lg i{color:#888}
#combar .cbar{position:relative}
#combar .cnav-r{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:3px}
#combar .cnow{font-family:var(--font-mono);font-size:9.5px;letter-spacing:0.12em;text-transform:uppercase;color:rgba(255,255,255,0.65);white-space:nowrap;padding:6px 16px;border-radius:999px;border:1px solid rgba(255,255,255,0.25);background:rgba(255,255,255,0.08);transition:color .35s,border-color .35s,background .35s}
#combar .cnow b{font-weight:600;color:#fff}
#combar .cnav-arrow{opacity:0;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1;text-decoration:none;color:rgba(255,255,255,0.65);pointer-events:none;margin:0 -10px;transition:opacity .2s,margin .2s,color .35s}
#combar .cnav-r:hover .cnav-arrow{opacity:0.8;margin:0;pointer-events:auto}
#combar .cnav-r:hover .cnav-arrow:hover{opacity:1}
#combar.scrolled .cnow{color:var(--muted);border-color:var(--line);background:rgba(0,0,0,0.02)}
#combar.scrolled .cnow b{color:#111}
#combar.scrolled .cnav-arrow{color:var(--muted)}
#combar.drawer-open .cnow{color:rgba(255,255,255,0.7);border-color:rgba(255,255,255,0.22);background:rgba(255,255,255,0.08)}
#combar.drawer-open .cnow b{color:#fff}
#combar.drawer-open .cnav-arrow{color:rgba(255,255,255,0.7)}
#combar .cnav{display:flex;gap:8px;font-family:var(--font-mono);font-size:12px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.5)}
#combar .cnav .ctab{cursor:pointer;padding:8px 14px;border-radius:999px;color:rgba(255,255,255,0.55);transition:color .2s,background .2s;background:transparent;border:none;font:inherit;letter-spacing:inherit;text-transform:inherit;display:inline-flex;align-items:center;gap:7px}
#combar .cnav .ctab:hover{color:#fff}
#combar .cnav .ctab.on{color:#fff;font-weight:500}
#combar .cnav .ctab .cv{display:inline-flex;align-items:center;margin-left:1px;transition:transform .3s cubic-bezier(0.22,1,0.36,1);opacity:0.7}
#combar .cnav .ctab.open .cv{transform:rotate(180deg)}
#combar.scrolled .cnav .ctab{color:#999}
#combar.scrolled .cnav .ctab:hover{color:#111}
#combar.scrolled .cnav .ctab.on{color:#111;font-weight:500}
#combar.scrolled .cnav{color:#999}
#combar.scrolled .cnav .on{color:#111}
#combar .cright{margin-left:auto;display:flex;align-items:center;gap:10px}
#cb-context{display:flex;align-items:center;justify-content:center;cursor:pointer;
 border:1px solid rgba(255,255,255,0.35);border-radius:999px;width:34px;height:34px;padding:0;color:rgba(255,255,255,0.85);transition:all .2s;background:transparent;flex-shrink:0}
#cb-context:hover{border-color:#fff;color:#fff}
#cb-context.on{background:#fff;color:#111;border-color:#fff}
#combar.scrolled #cb-context{border-color:rgba(0,0,0,0.14);color:#444;background:#fff}
#combar.scrolled #cb-context:hover{border-color:#111;color:#111}
#combar.scrolled #cb-context.on{background:#111;color:#fff;border-color:#111}
#cb-focus{position:relative;display:flex;align-items:center;gap:2px;border:1px solid rgba(255,255,255,0.3);border-radius:999px;padding:3px;background:transparent;transition:border-color .35s}
#cb-focus .fopt-ind{position:absolute;top:3px;left:0;height:calc(100% - 6px);border-radius:999px;background:#fff;z-index:0;transition:transform .34s cubic-bezier(0.22,1,0.36,1),width .34s cubic-bezier(0.22,1,0.36,1)}
#cb-focus .opt{position:relative;z-index:1;font-family:var(--font-mono);cursor:pointer;border-radius:999px;padding:6px 13px;font-size:10.5px;letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.7);transition:color .18s;text-decoration:none}
#cb-focus .opt:hover{color:#fff}
#cb-focus .opt.on{color:#111}
/* Deep, disabled for now (later feature): crossed out, dimmed, non-interactive */
#cb-focus .opt.disabled{text-decoration:line-through;opacity:0.4;cursor:not-allowed;pointer-events:none}
#cb-focus .opt.disabled:hover{color:rgba(255,255,255,0.7)}
#combar.scrolled #cb-focus{border-color:rgba(0,0,0,0.12);background:#fff}
#combar.scrolled #cb-focus .opt{color:#777;text-decoration:none}
#combar.scrolled #cb-focus .opt:hover{color:#111}
#combar.scrolled #cb-focus .opt.on{color:#fff}
#combar.scrolled #cb-focus .fopt-ind{background:#111}
#cb-listen{display:flex;align-items:center;gap:8px;cursor:pointer;font-family:var(--font-mono);font-size:11.5px;letter-spacing:0.08em;text-transform:uppercase;
 background:transparent;border:1px solid rgba(255,255,255,0.45);color:#fff;border-radius:999px;padding:8px 16px;transition:all .25s;flex-shrink:0}
#cb-listen:hover{border-color:#fff}
#cb-listen i{font-size:0;line-height:0;width:0;height:0;border-style:solid;border-width:4.5px 0 4.5px 8px;border-color:transparent transparent transparent currentColor;color:#6AA0FF}
#combar.scrolled #cb-listen{border-color:rgba(0,0,0,0.22);color:#111}
#combar.scrolled #cb-listen:hover{border-color:#111}
#combar.scrolled #cb-listen i{color:var(--gapc)}
/* ===== fold-down drawer system ===== */
/* when a drawer is open, the combar stays dark regardless of scroll */
#combar.drawer-open .cwrap{background:rgba(18,13,12,0.88);border-color:rgba(255,255,255,0.12);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 24px 50px rgba(0,0,0,0.28)}
#combar.drawer-open .shur-lg b{color:#fff}
#combar.drawer-open .shur-lg i{color:rgba(255,255,255,0.55)}
#combar.drawer-open .cnav .ctab{color:rgba(255,255,255,0.55)}
#combar.drawer-open .cnav .ctab:hover{color:#fff}
#combar.drawer-open .cnav .ctab.on{color:#fff;font-weight:500}
#combar.drawer-open #cb-context{border-color:rgba(255,255,255,0.35);color:rgba(255,255,255,0.85);background:transparent}
#combar.drawer-open #cb-context.on{background:#fff;color:#111;border-color:#fff}
#combar.drawer-open #cb-focus{border-color:rgba(255,255,255,0.3);background:transparent}
#combar.drawer-open #cb-focus .opt{color:rgba(255,255,255,0.7);text-decoration:none}
#combar.drawer-open #cb-focus .opt:hover{color:#fff}
#combar.drawer-open #cb-focus .opt.on{color:#111}
#combar.drawer-open #cb-focus .fopt-ind{background:#fff}
#combar.drawer-open #cb-listen{border-color:rgba(255,255,255,0.45);color:#fff}
#combar.drawer-open #cb-listen i{color:#6AA0FF}
/* ============================================================
   COMBAR HANDOFF (<=960px) - Nav Approach A: header hamburger + drawer.
   The desktop combar (.cnav + .cright: Index/Report/Insights/Listen/
   Ambient) overflows below ~960px, so the mobile nav takes over at
   960px to avoid a dead zone where both navs render and collide.
   Body single-column layout still kicks in at <=600px (block below).
   ============================================================ */
.m-only{display:none}
@media (max-width:1120px){
  body{overflow-x:hidden}
  /* neutralize desktop fold-down drawers + AI lens float on mobile. The narrow-width
     section nav is the persistent #m-secpanel sub-row below, not a fold-down drawer. */
  #combar .cwrap .cdrawer:not(#cd-dash){display:none!important}
  #combar .cbar .cnav,#combar .cbar .cright,#combar .cbar .cnav-r{display:none!important}
  #lens-panel,#lens-chip{display:none!important}

  /* compact mobile bar: logo + section-dropdown + report pill + hamburger.
     Inset 72px to match the house combar gutters in the half-desktop band (600-1120) so the
     header isn't edge-to-edge; phones (<=600) drop to tight gutters below. */
  #combar{padding:10px 72px;position:fixed}
  #combar .cwrap{border-radius:16px;max-width:none;overflow:hidden;background:transparent;border:1px solid transparent;box-shadow:none;-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);transition:background .35s,border-color .35s,box-shadow .35s,backdrop-filter .35s}
  /* FIX 1, disable scroll-reveal on mobile so content is always visible */
  .L3 .l3rail,.L3 .l3main>*,.L3 .l3main,.rv,[class*="reveal"]{opacity:1!important;transform:none!important;visibility:visible!important;animation:none!important}

  #combar.scrolled .cwrap{background:rgba(255,255,255,0.94);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-color:var(--line);box-shadow:0 10px 30px rgba(0,0,0,0.12)}
  #combar .cbar{padding:8px 18px;gap:12px;justify-content:space-between}
  #combar .shur-lg{font-size:18px!important;flex-shrink:0}
  /* Narrow combar row reads: logo (left) · plain report-name label (#m-pill,
     non-interactive identity) · hamburger (right). The section nav is NOT in this
     row, it lives in the persistent #m-secpanel sub-row below the combar. */

  /* compact, NON-interactive report-name label (plain identity, no chevron) */
  .m-bar-title{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;
    font-family:var(--font-mono);font-size:9.5px;letter-spacing:0.12em;text-transform:uppercase;
    padding:6px 11px;border-radius:999px;border:1px solid rgba(255,255,255,0.26);
    background:rgba(255,255,255,0.10);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
    color:rgba(255,255,255,0.82);cursor:default;
    transition:color .35s,border-color .35s,background .35s}
  .m-bar-title .mpt-label{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #combar.scrolled .m-bar-title{color:var(--muted);border-color:var(--line);background:rgba(0,0,0,0.03);-webkit-backdrop-filter:none;backdrop-filter:none}
  /* tiny phones (<=380px): drop the report pill's "DBM Brief" words to just "No.01" */
  @media (max-width:380px){
    .m-bar-title .mpt-label{font-size:0;letter-spacing:0}
    .m-bar-title .mpt-label::after{content:"No.01";font-size:9.5px;letter-spacing:0.1em}
  }
  /* when the section panel is expanded, the cwrap goes dark, force logo + burger light even if .scrolled */
  #combar.sec-open .shur-lg b{color:#fff}
  #combar.sec-open .shur-lg i{color:rgba(255,255,255,0.55)}
  #combar.sec-open .m-bar-title{color:rgba(255,255,255,0.82);border-color:rgba(255,255,255,0.26);background:rgba(255,255,255,0.10)}
  #combar.sec-open #m-burger span{background:#fff!important}

  #m-burger{display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
    width:44px;height:44px;align-items:center;border:none;background:transparent;cursor:pointer;margin-right:-9px;flex-shrink:0}
  #m-burger span{display:block;width:22px;height:2px;background:#fff;border-radius:2px;transition:background .35s}
  #combar.scrolled #m-burger span{background:#111}
  .m-only{display:flex}

  /* hide the desktop left rail entirely on narrow widths (the persistent section panel replaces it). */
  .rail,.railtoc{display:none!important;position:static!important}
  /* hide the per-section rail breaks carried over from the left rail. */
  .L3 .l3rail{display:none!important}
  /* rail is gone at this width, so drop the section to a plain block, keeps the flex-column
     .l3main from sizing to its widest child's min-content (e.g. the competitive table),
     which otherwise broke the page over the right edge in the 600-1120 band. The table now
     scrolls inside its own .l3rankwrap instead. */
  .L3{display:block!important}

  /* =========================================================================
     PERSISTENT SECTION PANEL (#m-secpanel), narrow widths only.
     A slim sub-row INSIDE .cwrap, directly below the combar row, so it reads as
     the header extending down: same backplate treatment as the combar, separated
     by a thin seam. ALWAYS visible while scrolling. The trigger (#m-secnow) shows
     the current section (driven by the shared scroll-spy setActive, one observer,
     no second one) and is itself a dropdown that expands #m-seclist (all sections).
     Styled in our system: JetBrains Mono, cobalt active state.
     ========================================================================= */
  /* Reveal-gated: hidden by default (over the hero at top, and over the appendix at bottom),
     shown only while reading the report BODY. A separate visibility observer toggles
     #combar.show-secpanel (does NOT touch the scroll-spy setActive observer). The fixed
     combar floats over content and reserves no body space, so display:none<->block causes
     no content jump. */
  #m-secpanel{width:100%;flex-direction:column;border-top:1px solid rgba(255,255,255,0.14);
    display:none;transition:border-color .35s}
  #combar.show-secpanel #m-secpanel{display:flex}
  #combar.scrolled #m-secpanel{border-top-color:rgba(0,0,0,0.07)}
  #combar.sec-open #m-secpanel{border-top-color:rgba(255,255,255,0.14)}

  /* trigger row: full-width, current section name + chevron */
  #m-secnow{display:flex;align-items:center;gap:10px;width:100%;padding:11px 19px;
    border:none;background:transparent;cursor:pointer;text-align:left;
    font-family:var(--font-sans);transition:background .25s}
  #m-secnow:active{background:rgba(255,255,255,0.05)}
  #m-secnow .msn-ey{font-family:var(--font-mono);font-size:8.5px;letter-spacing:0.16em;
    text-transform:uppercase;color:rgba(255,255,255,0.5);flex-shrink:0;transition:color .35s}
  #m-secnow .msn-label{min-width:0;flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    font-family:var(--font-mono);font-size:12px;letter-spacing:0.04em;color:#fff;font-weight:600;
    text-shadow:0 1px 12px rgba(0,0,0,0.45);transition:color .35s,text-shadow .35s}
  #m-secnow .msn-caret{flex-shrink:0;margin-left:auto;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;
    color:rgba(255,255,255,0.75);transition:transform .32s cubic-bezier(0.22,1,0.36,1),color .35s}
  #combar.sec-open #m-secnow .msn-caret{transform:scaleY(-1)}
  /* scrolled (light backplate): trigger text goes dark/cobalt, lose the over-hero shadow */
  #combar.scrolled #m-secnow .msn-ey{color:var(--muted)}
  #combar.scrolled #m-secnow .msn-label{color:var(--cobalt);text-shadow:none}
  #combar.scrolled #m-secnow .msn-caret{color:var(--muted)}
  /* expanded (cwrap dark): force trigger light regardless of scroll state */
  #combar.sec-open #m-secnow{background:rgba(255,255,255,0.04)}
  #combar.sec-open #m-secnow .msn-ey{color:rgba(255,255,255,0.55)}
  #combar.sec-open #m-secnow .msn-label{color:#fff;text-shadow:none}
  #combar.sec-open #m-secnow .msn-caret{color:#fff}

  /* expandable section list: collapses to 0 height, grows in-flow (extends the header down) */
  #m-seclist{max-height:0;overflow-y:auto;overscroll-behavior:contain;
    transition:max-height .42s cubic-bezier(0.22,1,0.36,1);will-change:max-height;
    padding:0 8px;-webkit-overflow-scrolling:touch}
  #combar.sec-open #m-seclist{max-height:min(70vh,560px);padding:4px 8px 12px}
  #m-seclist .csec-item{display:flex;align-items:center;gap:13px;width:100%;
    padding:12px 14px;text-decoration:none;cursor:pointer;border:none;background:transparent;
    border-radius:8px;text-align:left;
    transition:background .18s,border-color .18s}
  #m-seclist .csec-item:active{background:rgba(255,255,255,0.06)}
  #m-seclist .csec-item .csi-n{font-family:var(--font-mono);font-size:10.5px;color:rgba(255,255,255,0.4);
    width:24px;flex-shrink:0;text-align:center}
  #m-seclist .csec-item .csi-t{font-size:15px;font-weight:500;color:#fff;flex:1;line-height:1.3}
  #m-seclist .csec-item.on{background:rgba(106,160,255,0.12)}
  #m-seclist .csec-item.on .csi-n{color:#6AA0FF}
  #m-seclist .csec-item.on .csi-t{color:#6AA0FF;font-weight:600}

  /* when the section panel is expanded, the whole .cwrap becomes one continuous dark
     panel, combar row + persistent sub-row + list share the surface (seamless). */
  #combar.sec-open .cwrap{background:rgba(20,14,13,0.94);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
    border-color:rgba(255,255,255,0.12);box-shadow:0 24px 50px rgba(0,0,0,0.42)}

  /* ===== full-viewport mobile drawer ===== */
  #m-drawer{position:fixed;inset:0;z-index:1000;background:#15100F;color:#fff;
    transform:translateX(100%);transition:transform .42s cubic-bezier(0.22,1,0.36,1);
    display:flex;flex-direction:column;visibility:hidden;overscroll-behavior:contain}
  body.m-nav-open #m-drawer{transform:none;visibility:visible}
  #m-drawer .md-top{display:flex;align-items:center;justify-content:space-between;
    padding:18px 30px;border-bottom:1px solid rgba(255,255,255,0.10);flex-shrink:0}
  #m-drawer .md-top .shur-lg{font-size:18px}
  #m-drawer .md-top .shur-lg b{color:#fff}#m-drawer .md-top .shur-lg i{color:rgba(255,255,255,0.55)}
  #m-close{width:44px;height:44px;border:none;background:transparent;color:rgba(255,255,255,0.7);
    font-size:26px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;margin-right:-9px}
  #m-drawer .md-scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:6px 20px 48px}
  #m-drawer .md-sec{padding:22px 0;border-bottom:1px solid rgba(255,255,255,0.08)}
  #m-drawer .md-sec:last-child{border-bottom:none}
  #m-drawer .md-h{font-family:var(--font-mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;
    color:#6AA0FF;margin-bottom:14px}
  /* Display controls in the drawer: Standard/Ambient sliding toggle + Listen, relocated from the old report-pill dropdown */
  #m-drawer .md-ctl{display:flex;align-items:center;gap:12px}
  #m-drawer .md-focus{position:relative;display:flex;align-items:center;gap:2px;flex:1 1 auto;
    border:1px solid rgba(255,255,255,0.3);border-radius:999px;padding:3px;background:transparent}
  #m-drawer .md-focus .md-foptind{position:absolute;top:3px;left:0;height:calc(100% - 6px);width:0;
    border-radius:999px;background:#fff;z-index:0;
    transition:transform .34s cubic-bezier(0.22,1,0.36,1),width .34s cubic-bezier(0.22,1,0.36,1)}
  #m-drawer .md-focus .md-opt{position:relative;z-index:1;flex:1 1 0;border:none;background:transparent;cursor:pointer;
    font-family:var(--font-mono);font-size:10.5px;letter-spacing:0.08em;text-transform:uppercase;
    padding:9px 13px;border-radius:999px;color:rgba(255,255,255,0.7);transition:color .18s;white-space:nowrap;text-decoration:none;text-align:center}
  #m-drawer .md-focus .md-opt.on{color:#111}
  #m-drawer .md-listenbtn{display:inline-flex;align-items:center;gap:8px;flex-shrink:0;cursor:pointer;
    font-family:var(--font-mono);font-size:11px;letter-spacing:0.08em;text-transform:uppercase;
    background:transparent;border:1px solid rgba(255,255,255,0.45);color:#fff;border-radius:999px;padding:10px 16px;transition:all .25s}
  #m-drawer .md-listenbtn:active{background:rgba(255,255,255,0.08)}
  #m-drawer .md-listenbtn i{font-size:0;line-height:0;width:0;height:0;border-style:solid;
    border-width:4.5px 0 4.5px 8px;border-color:transparent transparent transparent currentColor;color:#6AA0FF}
  #m-drawer a.md-item{display:flex;align-items:center;gap:13px;width:100%;
    color:#fff;text-decoration:none;padding:11px 0;min-height:44px}
  #m-drawer a.md-item:active{opacity:0.6}
  #m-drawer .md-item .mi-n{font-family:var(--font-mono);font-size:11px;color:rgba(255,255,255,0.5);
    width:30px;flex-shrink:0;letter-spacing:0.08em}
  #m-drawer .md-item .mi-t{font-size:16px;font-weight:500;line-height:1.3;flex:1}
  #m-drawer .md-item .mi-d{display:block;font-size:12.5px;font-weight:400;color:rgba(255,255,255,0.5);margin-top:3px;line-height:1.4}
  #m-drawer .md-item .mi-arrow{color:rgba(255,255,255,0.4);font-size:15px;flex-shrink:0}
  #m-drawer .md-thumb{width:50px;height:32px;border-radius:3px;overflow:hidden;flex-shrink:0;background:#241B1A;display:flex;align-items:center;justify-content:center}
  #m-drawer .md-thumb img{width:100%;height:100%;object-fit:cover;display:block}
  /* in-page section TOC: tap scrolls + closes */
  #m-drawer .md-tocgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  #m-drawer .md-tile{display:flex;flex-direction:column;gap:5px;padding:13px;min-height:60px;justify-content:center;
    background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:10px;color:#fff;text-decoration:none}
  #m-drawer .md-tile .mt-n{font-size:13.5px;font-weight:500;line-height:1.25}
  #m-drawer .md-tile .mt-d{font-size:11px;color:rgba(255,255,255,0.5);line-height:1.4}
}
/* Stripe-style smooth frosted scrim, blur amount itself eases in from 0, soft neutral tint, no hard dim */
#cb-scrim{position:fixed;inset:0;z-index:795;background:rgba(10,10,12,0.40);
 backdrop-filter:blur(0px) saturate(100%);-webkit-backdrop-filter:blur(0px) saturate(100%);
 opacity:0;visibility:hidden;
 transition:opacity .5s cubic-bezier(0.22,1,0.36,1),backdrop-filter .5s cubic-bezier(0.22,1,0.36,1),-webkit-backdrop-filter .5s cubic-bezier(0.22,1,0.36,1),visibility .5s}
#cb-scrim.open{opacity:1;visibility:visible;backdrop-filter:blur(10px) saturate(118%);-webkit-backdrop-filter:blur(10px) saturate(118%)}
/* Drawer reads as the header pill extending downward: same width/inset/backplate as .cwrap, connected (no gap, only bottom corners rounded) */
.cdrawer{overflow:hidden;max-height:0;transition:max-height .42s cubic-bezier(0.22,1,0.36,1);will-change:max-height}
.cdrawer.open{max-height:84vh}
.cdrawer .cdin{padding:32px 22px 40px;max-height:84vh;overflow-y:auto;overscroll-behavior:contain}
.cdrawer .cd-eye{display:flex;align-items:baseline;justify-content:space-between;gap:24px;
 padding-bottom:16px;margin-bottom:28px;border-bottom:1px solid rgba(255,255,255,0.10)}
.cdrawer .cd-eye .cd-meta{font-family:var(--font-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:#6AA0FF}
.cdrawer .cd-eye a.cd-top{display:inline-block;cursor:pointer;text-decoration:none;transition:opacity .2s}
.cdrawer .cd-eye a.cd-top:hover{opacity:0.7}
.cdrawer .cd-eye .cd-close{font-family:var(--font-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;
 color:rgba(255,255,255,0.5);cursor:pointer;background:none;border:none;flex-shrink:0;transition:color .2s}
.cdrawer .cd-eye .cd-close:hover{color:#fff}
/* report drawer */
.cd-cover{display:flex;gap:34px;align-items:flex-start;cursor:pointer;border-radius:4px;transition:opacity .2s}
.cd-cover:hover .cd-title{color:#6AA0FF;transition:color .2s}
.cd-cover .cd-img img{filter:brightness(0.82);transition:transform .35s cubic-bezier(0.22,1,0.36,1),filter .3s ease}
.cd-cover:hover .cd-img img{transform:scale(1.03);filter:brightness(1)}
.cd-cover .cd-img{width:360px;flex-shrink:0;aspect-ratio:16/9;border-radius:2px;overflow:hidden;background:#1A1413;display:block}
.cd-cover .cd-img img{width:100%;height:100%;object-fit:cover;display:block}
.cd-cover .cd-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:16px}
.cd-cover .cd-title{font-family:var(--font-sans);font-weight:500;font-size:26px;line-height:1.2;letter-spacing:-0.01em;color:#fff;max-width:600px}
.cd-cover .cd-dek{font-family:var(--font-sans);font-weight:400;font-size:15px;line-height:1.65;color:rgba(255,255,255,0.62);max-width:600px}
.cd-past{margin-top:34px;padding-top:30px;border-top:1px solid rgba(255,255,255,0.10)}
.cd-past .cd-eye2{font-family:var(--font-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:rgba(255,255,255,0.5);display:block;margin-bottom:18px}
.cd-past .cd-row{display:flex;gap:44px}
.cd-past .cd-item{display:flex;gap:16px;align-items:flex-start;text-decoration:none;flex:1}
.cd-past .cd-thumb{width:112px;height:63px;flex-shrink:0;border-radius:2px;background:#241B1A;overflow:hidden}
.cd-past .cd-thumb img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(0.6);transition:filter .3s ease}
.cd-item:hover .cd-thumb img{filter:brightness(1)}
.cd-past .cd-pn{font-family:var(--font-mono);font-size:9.5px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.5);display:block;margin-bottom:6px}
.cd-past .cd-pt{font-family:var(--font-sans);font-weight:500;font-size:15px;line-height:1.3;color:#fff;transition:color .2s}
.cd-past .cd-item:hover .cd-pt{color:#6AA0FF}
/* insights drawer */
.cd-ihead .cd-ititle{font-family:var(--font-sans);font-weight:500;font-size:24px;line-height:1.2;letter-spacing:-0.01em;color:#fff;margin-top:6px}
.cd-cards{display:flex;gap:24px}
.cd-card{flex:1;min-width:0;text-decoration:none;display:flex;flex-direction:column;gap:14px}
.cd-card .cd-tile{height:96px;background:#16100F;border:1px solid rgba(255,255,255,0.07);border-radius:3px;
 display:flex;align-items:center;justify-content:center;transition:border-color .2s}
.cd-card:hover .cd-tile{border-color:rgba(232,105,60,0.45)}
.cd-card .cd-cn{display:block;font-family:var(--font-sans);font-weight:500;font-size:15px;color:#fff;transition:color .2s}
.cd-card:hover .cd-cn{color:#6AA0FF}
.cd-card .cd-cd{display:block;margin-top:5px;font-family:var(--font-sans);font-weight:400;font-size:13px;line-height:1.5;color:rgba(255,255,255,0.5)}
@media(max-width:1000px){.cdrawer .cdin{padding:32px 24px 36px}.cd-cover{flex-direction:column}.cd-cover .cd-img{width:100%}.cd-cards,.cd-past .cd-row{flex-wrap:wrap;gap:20px}.cd-card,.cd-past .cd-item{flex:1 1 40%}}
/* context drawer, single illustrative loop + four lens options */
.cd-ctx{display:flex;gap:48px;align-items:stretch}
.cd-ctx-demo{flex:0 0 300px;display:flex;flex-direction:column;gap:16px}
.cd-ctx-demo .ctx-explain{height:150px;background:#16100F;border:1px solid rgba(255,255,255,0.07);border-radius:6px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.cxd-page{display:flex;flex-direction:column;gap:9px;width:150px}
.cxd-page .cxd-ln{height:8px;border-radius:3px;background:rgba(255,255,255,0.16);opacity:0.32;transform:scaleX(0.62);transform-origin:left;animation:cxdDim 4.6s ease-in-out infinite}
.cxd-page .cxd-ln.a{animation-delay:.0s}
.cxd-page .cxd-ln.b{animation-delay:.18s}
.cxd-page .cxd-ln.c{animation-delay:.36s}
.cxd-page .cxd-ln.d{animation-delay:.54s}
/* the four "relevant" lines (a–d) brighten + extend, the rest fade back, report focusing */
.cxd-page .cxd-ln.a,.cxd-page .cxd-ln.b,.cxd-page .cxd-ln.c,.cxd-page .cxd-ln.d{animation-name:cxdFocus}
.cd-ctx-demo .ctx-cap{font-family:var(--font-sans);font-size:12.5px;line-height:1.55;color:rgba(255,255,255,0.55)}
.cd-ctx-opts{flex:1 1 0;display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;align-self:center}
.cd-ctx-opts .lp-row{padding:14px 14px;border-radius:12px}
.cd-ctx-opts .lp-row .ic{border-color:rgba(255,255,255,0.25);color:rgba(255,255,255,0.7)}
.cd-ctx-opts .lp-row .tx b{color:#fff}
.cd-ctx-opts .lp-row .tx span{color:rgba(255,255,255,0.5)}
.cd-ctx-opts .lp-row .ck{color:#6AA0FF}
.cd-ctx-opts .lp-row:hover{background:rgba(255,255,255,0.05)}
.cd-ctx-opts .lp-row.on{background:rgba(255,255,255,0.06)}
.cd-ctx-opts .lp-row.on .ic{border-color:#6AA0FF;color:#6AA0FF}
@media(max-width:1000px){.cd-ctx{flex-direction:column;gap:24px}.cd-ctx-demo{flex:1 1 auto}}
@media print{#combar,.railtoc,#player,#lens-panel,#lens-btn,#lens-chip,#lens-overlay,footer{display:none!important}body{padding-top:0!important}}
:where(#m-drawer,.cdrawer,#m-pop,#m-seclist) :where(a,button,select):focus-visible{outline-color:#6AA0FF}
/* ===== Standard / Ambient mode (pattern: part-i / report-combo; spec: ShurAI/AMBIENT-PLAYBOOK.md) ===== */
#cb-focus{position:relative;display:flex;align-items:center;gap:2px;border:1px solid rgba(255,255,255,0.3);border-radius:999px;padding:3px;background:transparent;transition:border-color .35s}
#cb-focus .fopt-ind{position:absolute;top:3px;left:0;height:calc(100% - 6px);border-radius:999px;background:#fff;z-index:0;transition:transform .34s cubic-bezier(0.22,1,0.36,1),width .34s cubic-bezier(0.22,1,0.36,1)}
#cb-focus .opt{position:relative;z-index:1;font-family:var(--font-mono);cursor:pointer;border-radius:999px;padding:6px 13px;font-size:10.5px;letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.7);transition:color .18s}
#cb-focus .opt:hover{color:#fff}
#cb-focus .opt.on{color:#111}
#combar.scrolled #cb-focus{border-color:rgba(0,0,0,0.12);background:#fff}
#combar.scrolled #cb-focus .opt{color:rgba(0,0,0,0.55)}
#combar.scrolled #cb-focus .opt.on{color:#111}
#combar.scrolled #cb-focus .fopt-ind{background:rgba(30,58,110,0.12)}
body.m-ambient .hero,body.m-ambient .wrap,body.m-ambient .methodfull,body.m-ambient>footer,body.m-ambient #lens-panel,body.m-ambient #m-secpanel{display:none!important}
@media(max-width:1000px){.nd-cols{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.nd-cols{grid-template-columns:1fr;gap:26px}.nd-strip{gap:10px 26px}.nd-stat b{font-size:21px}}
@media(max-width:900px){.nd-cols4{grid-template-columns:1fr}
  .nd-cols4 > .nd-col:nth-child(1),.nd-cols4 > .nd-col:nth-child(2),.nd-cols4 > .nd-col:nth-child(3){grid-column:1;grid-row:auto}}
@media(max-width:900px){.nd-figs{grid-template-columns:repeat(2,1fr)}}
#cb-listen{display:none;width:30px;height:30px;border-radius:999px;border:1px solid rgba(255,255,255,0.35);background:transparent;color:rgba(255,255,255,0.85);font-size:10px;cursor:pointer;transition:all .2s}
#cb-listen:hover{border-color:#fff;color:#fff}
body.m-ambient #cb-listen{display:inline-flex;align-items:center;justify-content:center}
#combar.scrolled #cb-listen{border-color:rgba(0,0,0,0.25);color:#111}
.md-mode{display:flex;gap:8px}
.md-mode-btn{flex:1;font-family:var(--font-mono);font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.75);background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.18);border-radius:999px;padding:11px 0;cursor:pointer;min-height:44px}
.md-mode-btn.on{background:#fff;color:#111;border-color:#fff}
.md-mode-btn.md-listen{flex:0 0 auto;padding:11px 16px;color:#6AA0FF;border-color:rgba(106,160,255,0.5)}
/* ===== scrolled header: DARK GLASS, never a white backplate (late override block) ===== */
#combar.scrolled .cwrap{background:rgba(15,8,9,0.62)!important;border-color:rgba(255,255,255,0.12)!important;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 10px 30px rgba(0,0,0,0.28)!important}
#combar.scrolled .shur-lg b{color:#fff!important}
#combar.scrolled .shur-lg i{color:rgba(255,255,255,0.55)!important}
#combar.scrolled .cnav .ctab{color:rgba(255,255,255,0.75)!important}
#combar.scrolled .cnav .ctab:hover,#combar.scrolled .cnav .ctab.on,#combar.scrolled .cnav .on{color:#fff!important}
#combar.scrolled .cnav-arrow{color:rgba(255,255,255,0.7)!important}
#combar.scrolled .cnow{color:rgba(255,255,255,0.7)!important;border-color:rgba(255,255,255,0.22)!important;background:rgba(255,255,255,0.08)!important}
#combar.scrolled .cnow b{color:#fff!important}
#combar.scrolled #cb-context{color:rgba(255,255,255,0.8)!important;border-color:rgba(255,255,255,0.3)!important;background:transparent!important}
#combar.scrolled #cb-context:hover,#combar.scrolled #cb-context.on{color:#fff!important;border-color:#fff!important}
#combar.scrolled #cb-focus{border-color:rgba(255,255,255,0.3)!important;background:transparent!important}
#combar.scrolled #cb-focus .opt{color:rgba(255,255,255,0.7)!important}
#combar.scrolled #cb-focus .opt:hover{color:#fff!important}
#combar.scrolled #cb-focus .opt.on{color:#111!important}
#combar.scrolled #cb-focus .fopt-ind{background:#fff!important}
#combar.scrolled #cb-listen{border-color:rgba(255,255,255,0.35)!important;color:rgba(255,255,255,0.85)!important}
#combar.scrolled #m-burger span{background:#fff!important}
#combar.scrolled .m-bar-title{color:rgba(255,255,255,0.85)!important;border-color:rgba(255,255,255,0.25)!important;background:rgba(255,255,255,0.08)!important}
#combar.scrolled #m-secpanel{border-top-color:rgba(255,255,255,0.12)!important;background:transparent!important}
#combar.scrolled #m-secnow .msn-ey{color:rgba(255,255,255,0.5)!important}
#combar.scrolled #m-secnow .msn-label{color:#fff!important;text-shadow:none}
#combar.scrolled #m-secnow .msn-caret{color:rgba(255,255,255,0.6)!important}
/* drawer scrollbar — thin translucent thumb on the dark glass, no default chrome */
.cdrawer .cdin{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,0.28) transparent;padding-right:32px!important}
.cdrawer .cdin::-webkit-scrollbar{width:12px}
.cdrawer .cdin::-webkit-scrollbar-track{background:transparent;margin:10px 0}
.cdrawer .cdin::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.22);border-radius:99px;border:4px solid transparent;background-clip:padding-box}
.cdrawer .cdin::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.38)}
.cdrawer .cdin::-webkit-scrollbar-corner{background:transparent}
@media(max-width:1200px){.nd-cols3b{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.nd-cols3b{grid-template-columns:1fr}}
@media(max-width:700px){.nd-power{grid-template-columns:1fr}}
/* audio hidden in the report for now */
#cb-listen,#md-listen,.md-listen{display:none!important}
/* ══ ndash — the composite-dashboard bento, VERBATIM from the deterministic renderer sample (dist/index.html) ══ */
.cddwrap{position:relative;display:inline-flex}
/* combar dropdown = the LIVE DBM slide-down DRAWER — CONNECTED to the header: it lives INSIDE the plate and the
   plate expands as one continuous shape (no floating gap). max-height accordion; divider from the bar row. */
/* CARD drawers (Report / Insights): animate HEIGHT via grid-template-rows 0fr→1fr (a real auto-height animation — no
   max-height dead-zone) + an opacity fade. Their content is short, so 1fr = exact content height. */
.cdd:not(.cdd-tall){display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .46s cubic-bezier(.22,1,.36,1),opacity .38s ease}
.cdd:not(.cdd-tall)[data-shown="1"]{grid-template-rows:1fr;opacity:1}
/* TALL drawer (Dashboard): the embedded dashboard is much taller than the screen, so it uses a max-height accordion
   (its content overflows the cap → no dead-zone anyway) — grid-rows can't CAP height, which pushed the plate off the
   bottom of the viewport on mobile. The cap keeps the whole plate on-screen; the inner scrolls. */
.cdd-tall{max-height:0;overflow:hidden;opacity:0;transition:max-height .46s cubic-bezier(.22,1,.36,1),opacity .38s ease}
.cdd-tall[data-shown="1"]{max-height:min(88dvh,860px);opacity:1}
/* the Dashboard drawer embeds the ACTUAL composite dashboard (lifted verbatim from the live DBM .ndash), so it's
   taller than the card drawers and scrolls internally. .cd-close doubles as the Open-full-viewport action link. */
/* the tall (dashboard) drawer: grid-rows animates its height; the inner caps + scrolls so it never exceeds the viewport. */
.cdd-tall .cdin{overflow-x:hidden;overflow-y:auto;max-height:min(72dvh,760px);overscroll-behavior:contain;padding-right:10px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.28) transparent}
.cdd-tall .cdin::-webkit-scrollbar{width:10px}
.cdd-tall .cdin::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:99px;border:3px solid transparent;background-clip:padding-box}
/* ONE gap — equal bento spacing (Alex) */
.nd-strip{display:flex;flex-wrap:wrap;gap:10px 40px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:16px 20px}
.nd-stat b{display:block;font-weight:300;font-size:26px;letter-spacing:-.01em;color:#fff}
.nd-stat i{font-style:normal;font-family:var(--font-mono);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.nd-cols{display:grid;grid-template-columns:1fr 1fr .9fr;gap:12px}
.nd-cols .nd-col{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:18px 20px}
.nd-h{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:#6AA0FF;margin-bottom:14px}
.nd-score{display:flex;align-items:baseline;gap:10px;margin-bottom:14px}
.nd-score b{font-weight:300;font-size:34px;color:#fff}
.nd-score span{font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45)}
.nd-dim{display:grid;grid-template-columns:130px 1fr 36px;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.nd-dim>span:first-child{font-family:var(--font-mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nd-dim b{font-weight:400;font-size:13px;color:#fff;text-align:right}
.nd-tr{height:6px;border-radius:3px;overflow:hidden;background:rgba(255,255,255,.14);position:relative;display:block}
.nd-fl{position:absolute;left:0;top:0;height:100%;border-radius:3px;background:#6AA0FF;display:block}
.nd-fl.sev9{background:#8B2020}
.nd-fl.sev8,.nd-fl.sev7{background:#C4A882}
.nd-p{font-size:13px;line-height:1.65;color:rgba(255,255,255,.75);margin-bottom:16px}
.nd-lift{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border:1px solid rgba(106,160,255,.4);border-radius:10px;margin-bottom:16px}
.nd-lift span{font-family:var(--font-mono);font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.nd-lift b{font-weight:300;font-size:22px;color:#6AA0FF}
.nd-link{display:block;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.65);text-decoration:none;padding:7px 0;transition:color .18s}
.nd-link:hover{color:#fff}
.nd-cols4{grid-template-columns:1.5fr 1fr;grid-auto-rows:min-content;align-items:stretch}
.nd-cols4>.nd-col:nth-child(1){grid-column:1;grid-row:1/span 2}
.nd-cols4>.nd-col:nth-child(2){grid-column:2;grid-row:1}
.nd-cols4>.nd-col:nth-child(3){grid-column:2;grid-row:2}
.nd-cols3b{grid-template-columns:1.2fr 1.1fr .9fr}
.nd-power{display:grid;grid-template-columns:.8fr 1.2fr;gap:6px 20px;align-items:center}
.nd-power-left{display:flex;align-items:center;justify-content:flex-start}
.nd-power-left .nd-score{margin-bottom:0;flex-wrap:wrap;align-items:baseline;gap:0 10px}
.nd-power-left .nd-score b{font-size:clamp(64px,5.4vw,88px);line-height:.95;letter-spacing:-.02em}
.nd-power-left .nd-score .nd-per{font-family:var(--font-sans);font-size:32px;font-weight:300;letter-spacing:0;text-transform:none;color:rgba(255,255,255,.55);line-height:1}
.nd-power-left .nd-score .nd-sub{width:100%;font-style:normal;font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-top:10px}
.nd-power .nd-power-bars{min-width:0;grid-column:1/-1}
.nd-brg{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.nd-brg span{font-size:11.5px;color:rgba(255,255,255,.8);min-width:0}
.nd-brg span:last-child{text-align:right}
.nd-brg i{font-style:normal;font-family:var(--font-mono);font-size:7.5px;letter-spacing:.08em;text-transform:uppercase;color:#C4A882;border-bottom:1px dashed rgba(196,168,130,.5);padding:0 4px 2px;white-space:nowrap}
.nd-rank{display:flex;align-items:center;gap:10px;padding:7px 6px;border-bottom:1px solid rgba(255,255,255,.08)}
.nd-rank b{font-family:var(--font-mono);font-weight:400;font-size:10px;color:rgba(255,255,255,.45);width:14px;text-align:right}
.nd-rank span{flex:1;font-size:12px;color:#fff;min-width:0}
.nd-rank span i{display:block;font-style:normal;font-family:var(--font-mono);font-size:7.5px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-top:1px}
.nd-rank em{font-style:normal;font-weight:500;font-size:13px;color:#6AA0FF}
.nd-rank.subject{background:rgba(106,160,255,.10);border-radius:8px;border-bottom-color:transparent;padding-left:10px;padding-right:10px}
.nd-ins{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.nd-ins a{align-items:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:10px;color:#fff;display:flex;min-width:0;font-family:var(--font-sans);font-size:12.5px;font-weight:500;gap:10px;line-height:16px;padding:8px 14px 8px 8px;text-decoration:none;transition:border-color .2s,background .2s}
.nd-ins a:hover{border-color:rgba(255,255,255,.42);background:rgba(255,255,255,.09)}
.nd-ins a svg{width:34px;height:22px;flex-shrink:0}
.nd-ins .nd-ghost{align-items:center;border:1px dashed rgba(255,255,255,.22);border-radius:10px;color:rgba(255,255,255,.40);display:flex;min-width:0;font-family:var(--font-sans);font-size:12.5px;font-weight:500;gap:10px;line-height:15px;padding:8px 14px 8px 8px}
.nd-ins .nd-ghost svg{width:34px;height:22px;flex-shrink:0;opacity:.45}
.nd-ins .nd-ghost i{display:block;font-style:normal;font-family:var(--font-mono);font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.28)}
.nd-col.nd-ghostcol{background:transparent;border:1px dashed rgba(255,255,255,.22);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:112px;text-align:center}
.nd-ghostcol .nd-h{color:rgba(255,255,255,.45);margin:0}
.nd-ghostcol i{font-style:normal;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.28)}
.nd-figs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:16px 20px}
.nd-fig b{display:block;font-weight:400;font-size:15px;color:#fff}
.nd-fig i{font-style:normal;font-family:var(--font-mono);font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.45)}
@media(max-width:1000px){.nd-ins{grid-template-columns:repeat(2,1fr)}.nd-cols{grid-template-columns:1fr 1fr}.nd-cols4{grid-template-columns:1fr}.nd-cols4>.nd-col{grid-column:1!important;grid-row:auto!important}.nd-figs{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.nd-cols,.nd-cols3b{grid-template-columns:1fr}.nd-power{grid-template-columns:1fr}}
/* the bento container itself — was missed in the extraction prefix list; verbatim from the renderer:
   ONE gap, equal spacing between every tile */
.ndash{padding-top:4px;font-family:var(--font-sans);display:flex;flex-direction:column;gap:12px}
/* outbound arrows on the viewport links (Alex: "the links need arrow-outs to indicate") */
.nd-ins a .nd-go{margin-left:auto;flex-shrink:0;color:rgba(255,255,255,0.45);font-size:11px;transition:color .2s}
.nd-ins a:hover .nd-go{color:#6AA0FF}
/* suite-drawer intro paragraph (the suite index copy, carried verbatim) */
.cd-intro{font-family:var(--font-sans);font-size:13.5px;line-height:1.75;color:rgba(255,255,255,0.66);max-width:820px;margin:10px 0 2px}
.cd-cn .nd-go{color:rgba(255,255,255,0.4);font-size:10px;margin-left:5px}
.cd-card:hover .cd-cn .nd-go{color:#6AA0FF}


/* five tabs + the center pill collide below ~1420px, and the pill silently steals the Team/Video
   clicks (it opens the Insights dropdown). The tabs win: the pill yields until the bar is wide
   enough for both. The narrow-width #m-pill takes over below 1120px as before. */
@media (max-width: 1420px) {
  #combar .cnav-r { display: none; }
}

/* v80 — drawer tile hover: the tile NAME turns accent along with the arrow */
.nd-ins a{transition:border-color .2s,background .2s,color .2s}
.nd-ins a:hover{color:#6AA0FF}

/* v85 — cd-suite: tile + description as one hover unit. Hovering anywhere in the column
   turns the tile name, arrow, and description accent. No underlines, ever. */
#cd-suite .cd-suite-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px}
#cd-suite .cd-vp{display:flex;flex-direction:column;gap:10px;min-width:0;text-decoration:none}
#cd-suite .cd-vp:hover,#cd-suite .cd-vp:focus{text-decoration:none}
#cd-suite .cd-vp-tile{align-items:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:10px;color:#fff;display:flex;min-width:0;font-family:var(--font-sans);font-size:12.5px;font-weight:500;gap:10px;line-height:16px;padding:8px 14px 8px 8px;transition:border-color .2s,background .2s,color .2s}
#cd-suite .cd-vp-tile svg{width:34px;height:22px;flex-shrink:0}
#cd-suite .cd-vp .nd-go{margin-left:auto;flex-shrink:0;color:rgba(255,255,255,.45);font-size:11px;transition:color .2s}
#cd-suite .cd-vp-dek{font-family:var(--font-sans);font-size:11.5px;font-weight:400;line-height:1.55;color:rgba(255,255,255,.55);transition:color .2s}
#cd-suite .cd-vp:hover .cd-vp-tile{border-color:rgba(106,160,255,.5);background:rgba(255,255,255,.09);color:#6AA0FF}
#cd-suite .cd-vp:hover .nd-go{color:#6AA0FF}
#cd-suite .cd-vp:hover .cd-vp-dek{color:#6AA0FF}
@media(max-width:1000px){#cd-suite .cd-suite-grid{grid-template-columns:repeat(2,1fr)}}

/* v91 — DELTA v2: gap severity + unmade-connections panels retired with the Gap Radar
   viewport — the second bento row now carries two columns, not three */
.nd-cols3b{grid-template-columns:1.2fr 1fr}