/* PROJECT MAGNETO — APP NEXT · the SHELL (DO-00, builder A, 2026-10-28; design work copy, never deployed from here)
   One stylesheet for every screen page of the lab (the home links it too, nav only).
     · tokens + base   : byte-identical to design/app_next/index.html (:root / html.light / base). The home defines the same values inline.
     · .mgs-hd         : the header the shell injects on <body data-shell="full"> pages — the home's header rules, scoped, so a page's
                         own .btn / .pill / .seg classes can never collide with it and the home (own header) is never touched.
     · .mgs-nav        : the navigation, on both data-shell modes. Phone (< 1024 px): bottom tab bar, height --nb-h (56 px) + safe area.
                         Desktop (>= 1024 px): left rail --rail-w (72 px), mirrored to the right under dir=rtl (logical properties only).
     · .mgs-sheet      : the phone "More" sheet (rest of the screens + Notifications + Appearance / Data / Session rows).
     · .mgs-titlerow   : optional title row for screens (h1 22/800 + SAMPLE chip + actions).
   Space reservation is done HERE, never by a screen: body padding-bottom on the phone, main margin-inline-start on desktop.
   Colour only from tokens; glow on data only; logical properties everywhere; motion = transform/opacity, none under reduced motion. */

/* Fail closed, same idea as the classic relay-locked shell: the app is hidden from the first byte.
   Each page also inlines this rule so a slow stylesheet cannot flash the layout.
   The sign-in dialog is allowed through the lock only after html.mg-hold is removed, and that
   happens only once auth has settled on a signed-out visitor. A page change keeps the hold,
   so a returning session never flashes the email form. This is paint, not the authorization
   boundary — the relay still rejects a request that has no bearer. */
html.mg-locked body > *:not(.mgl-scrim):not(noscript) { display: none !important; }
html.mg-locked, html.mg-locked body { background: #071426; }
html.mg-hold .mgl-scrim { display: none !important; }

/* ── tokens (identical to index.html) ───────────────────────────────────────────────────────────────── */
:root {
  --bg-base:#071426; --bg-surface:#0C1C36; --bg-elevated:#143056; --bg-deeper:#040C18;
  --bg-hover:rgba(232,195,106,0.12);
  --border-subtle:#2A4570; --border-default:#5070A4; --border-strong:#6284BC;
  --text-primary:#F7F4EC; --text-secondary:#D5DBE4; --text-tertiary:#B7C0CE;
  --mark-navy:#1E4A8C; --mark-gold:#E0B454; --mark-ink:#F7F4EC;
  --accent:#E8C36A; --accent-2:#F3D48A; --accent-dim:#C4A15A;
  --accent-bg:rgba(232,195,106,0.16); --accent-glow:rgba(232,195,106,0.40);
  --on-accent:#071426;
  --up:#3DDC9A; --up-bg:rgba(61,220,154,0.14); --up-glow:rgba(61,220,154,0.32);
  --down:#F58A8E; --down-bg:rgba(245,138,142,0.14);
  --warn:#E8B04A; --warn-bg:rgba(232,176,74,0.14);
  --info:#9BB8DC; --info-bg:rgba(155,184,220,0.14);
  --aurora:linear-gradient(90deg,#8A6428 0%,#E0B454 48%,#F6E3B0 100%);
  --edge-top:linear-gradient(180deg,rgba(255,255,255,0.08),rgba(255,255,255,0) 22%);
  --page-glow:radial-gradient(1100px 520px at 12% -10%,rgba(30,74,140,0.45),transparent 60%),
              radial-gradient(900px 420px at 88% -20%,rgba(224,180,84,0.08),transparent 60%);
  --font-sans:'Inter',-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  --font-mono:'JetBrains Mono','SF Mono',Menlo,monospace;
  --header-h:64px;
  --gutter:24px;
  /* shell-only */
  --nb-h:56px; --rail-w:72px;
  --mgs-line:color-mix(in srgb,var(--border-default) 38%,transparent);
}
html.light {
  --bg-base:#F4F0E6; --bg-surface:#FFFCF8; --bg-elevated:#FFFFFF; --bg-deeper:#E7DFD0;
  --bg-hover:rgba(2,29,67,0.06);
  --border-subtle:#D4CBB8; --border-default:#8A7350; --border-strong:#7A6844;
  --text-primary:#021D43; --text-secondary:#163056; --text-tertiary:#2C4264;
  --mark-navy:#021D43; --mark-gold:#8F6C28; --mark-ink:#021D43;
  --accent:#5A400E; --accent-2:#5A400E; --accent-dim:#5A400E;
  --accent-bg:rgba(90,64,14,0.10); --accent-glow:rgba(90,64,14,0.22);
  --on-accent:#F7F4EC;
  --up:#065F46; --up-bg:rgba(6,95,70,0.10); --up-glow:rgba(6,95,70,0.18);
  --down:#9F1239; --down-bg:rgba(159,18,57,0.08);
  --warn:#9A3412; --warn-bg:rgba(154,52,18,0.10);
  --info:#163E78; --info-bg:rgba(22,62,120,0.08);
  --edge-top:linear-gradient(180deg,rgba(2,29,67,0.05),rgba(2,29,67,0) 22%);
  --page-glow:radial-gradient(1000px 480px at 50% -18%,rgba(224,180,84,0.16),transparent 62%);
}
html[lang="he"] { --font-sans:'Heebo','Inter',-apple-system,system-ui,sans-serif; }
@media (max-width:720px) { :root { --gutter:16px; --header-h:56px; } }

/* ── base (identical to index.html) ─────────────────────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html,body { min-height:100%; }
body {
  font-family:var(--font-sans); font-size:13px; line-height:1.5; letter-spacing:-0.005em;
  color:var(--text-primary); background:var(--bg-base); background-image:var(--page-glow);
  background-attachment:fixed; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
button { font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
/* U1 (packet NEXT): the global ring is an OUTLINE. It is drawn over the element, follows the element's own corners (a card stays a
   card, a pill stays a pill) and survives a component's own box-shadow. The old rule set border-radius:999px on whatever took focus. */
:focus-visible { outline:2px solid var(--accent); outline-offset:2px; box-shadow:none; }
.vh { position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
/* "hidden" must mean hidden even where a component rule sets display (the .btn / chip pattern). Full pages and the shell's own parts only —
   the home keeps its own rule. */
body[data-shell="full"] [hidden], .mgs-hd [hidden], .mgs-nav [hidden], .mgs-sheet [hidden], .mgs-toast[hidden] { display:none !important; }

/* ── space reservation for the navigation (the screens never do this) ───────────────────────────────── */
@media (max-width:1023.98px) { body[data-shell] { padding-bottom:calc(var(--nb-h) + env(safe-area-inset-bottom)); } }
@media (min-width:1024px)    { body[data-shell] > main, body[data-shell] main.screen { margin-inline-start:var(--rail-w); } }
/* the band's Expand fills "canvas − header − title row"; on the phone/tablet the tab bar is chrome too (the band itself is unchanged) */
@media (max-width:720px) { body[data-shell] .omap.is-expanded .om-band { height:calc(100dvh - var(--header-h) - var(--hm-hd-h,0px) - var(--hm-sit-h,0px) - var(--nb-h) - env(safe-area-inset-bottom) - 8px); } }
@media (min-width:721px) and (max-width:1023.98px) { body[data-shell] .omap.is-expanded .om-band { height:calc(100dvh - var(--header-h) - var(--hm-hd-h,0px) - var(--hm-sit-h,0px) - var(--nb-h) - env(safe-area-inset-bottom) - 24px); } }

/* two repairs to the home's own layout, scoped to the home (nav-only), found by re-running DO-02's gates with the nav in place:
   1. its header is 5-7 px wider than the viewport at 1280-1440 whenever the session pill carries its countdown ("Pre-market · 3h 53m to open"); DO-02 ran with the
      market closed, so the pill was short. The countdown is hidden below 1520 px (the home already hid it at <= 1200); the label stays.
   2. on the phone the title row wraps to two lines (72 px) while --hm-hd-h says 56, so Expand overshot the viewport by 16 px — under the tab bar now. */
/* D5 (architect, from the independent verifier): Expand must end EXACTLY where the tab bar begins. The title row WRAPS on the phone, so the home's single 56 px token
   under-counts it. Real heights, measured on the untouched home in both languages (harness/title_heights.mjs, every 2 px): EN 3 lines (100.4) up to 383 px · 72.4 at
   384-393 · 76 at 394-509 · 1 line (56) from 510; HE 3 lines up to 365 · 76 at 366-499 · 56 from 500. The title row already has min-height: var(--hm-hd-h) and the band's
   offset subtracts the same token, so a token >= the real height makes the row exactly that tall and the band's bottom edge land on the nav's top edge (gap 0). */
@media (max-width:509.98px) { body[data-shell="nav-only"] { --hm-hd-h:77px; } }
@media (max-width:383.98px) { body[data-shell="nav-only"] { --hm-hd-h:101px; } }
/* D6: the band's own phone rule leaves its legend row `overflow: visible; flex-wrap: nowrap`; in Hebrew the row is 14 px wider than a 320 px screen (8 px at 360) and widens
   the whole document. Let the row wrap instead (the map's files are untouched). */
@media (max-width:720px) { body[data-shell] .om-legend { flex-wrap:wrap; row-gap:4px; } }

/* THE BAND'S BOTTOM BAR beside the rail (found by re-running the work with the rail in place; probed in both languages and both states by harness/band_bar_probe.mjs).
   The band's own compact layouts key on the VIEWPORT width, but the rail makes the band 72 px narrower than its viewport says, and the Hebrew labels are wider than the
   English ones its breakpoints were drawn for; when the bar is over-full its flex items SHRINK below their content (the "Unplaced" pill was squeezed and its number spilled out).
   So: (1) the compaction is applied later, (2) the as-of text goes first (it is also in the title row's chip), (3) flex-wrap is the safety net — a pill is never squeezed again. */
@media (min-width:1024px) and (max-width:1252px) {
  body[data-shell] .omap:not(.has-panel) .om-tog .l, body[data-shell] .omap:not(.has-panel) .om-lgt,
  body[data-shell] .omap:not(.has-panel) .om-filtb .l, body[data-shell] .omap:not(.has-panel) .om-unp .l { display:none; }
  body[data-shell] .omap:not(.has-panel) .om-hist { width:160px; }
  body[data-shell] .omap.has-panel .om-hist { width:110px; }
}
@media (min-width:1253px) and (max-width:1340px) { body[data-shell] .omap:not(.has-panel) .om-hist { width:190px; } }
@media (min-width:1024px) and (max-width:1299.98px) { body[data-shell] .omap:not(.has-panel) .om-asof { display:none; } }
@media (min-width:1300px) and (max-width:1440px) { html[lang="he"] body[data-shell] .omap:not(.has-panel) .om-asof { display:none; } }
@media (min-width:721px) { body[data-shell] .om-bar { flex-wrap:wrap; row-gap:8px; } }

/* ── skip link ──────────────────────────────────────────────────────────────────────────────────────── */
.mgs-skip { position:fixed; top:8px; inset-inline-start:8px; z-index:100; padding:8px 14px; border-radius:10px; font-size:12px; font-weight:800;
  color:var(--on-accent); background:var(--accent); text-decoration:none; transform:translateY(-220%); }
.mgs-skip:focus { transform:none; outline:2px solid var(--accent); outline-offset:2px; box-shadow:none; border-radius:10px; }

/* ══ THE HEADER (injected on data-shell="full") ═══════════════════════════════════════════════════════ */
.mgs-hd { position:sticky; top:0; z-index:50;
  background:color-mix(in srgb,var(--bg-deeper) 82%,transparent);
  backdrop-filter:blur(20px) saturate(180%); -webkit-backdrop-filter:blur(20px) saturate(180%); }
html.light .mgs-hd { background:color-mix(in srgb,var(--bg-surface) 88%,transparent); }
.mgs-hd::before { content:""; position:absolute; inset:0 0 auto 0; height:1px; background:var(--edge-top); pointer-events:none; }
.mgs-hd::after { content:""; position:absolute; inset:auto 0 0 0; height:1px; background:var(--aurora); opacity:.55; }
html.light .mgs-hd::after { opacity:.7; }
.mgs-hd .hd-in { height:var(--header-h); display:flex; align-items:center; gap:18px;
  padding-inline:max(var(--gutter),env(safe-area-inset-left)) max(var(--gutter),env(safe-area-inset-right)); }
.mgs-hd :focus-visible { outline:2px solid var(--accent); outline-offset:2px; box-shadow:none; border-radius:10px; }
.mgs-hd .search:focus-within { outline:0; }
.mgs-hd .search input:focus-visible { outline:0; border-radius:0; }

.mgs-hd .brand { display:flex; align-items:center; gap:12px; flex:none; text-decoration:none; color:inherit; border-radius:10px; }
.mgs-hd .brand .mv-mark { width:34px; height:37px; display:block; filter:drop-shadow(0 2px 6px color-mix(in srgb,var(--bg-deeper) 70%,transparent)); }
html.light .mgs-hd .brand .mv-mark { filter:none; }
.mgs-hd .wm { display:flex; flex-direction:column; line-height:1.05; }
.mgs-hd .wm-1 { font-family:'Inter',var(--font-sans); font-size:10px; font-weight:700; letter-spacing:.32em; color:var(--text-tertiary); }
.mgs-hd .wm-2 { font-family:'Inter',var(--font-sans); font-size:15px; font-weight:800; letter-spacing:.24em; color:var(--mark-ink); }
.mgs-hd .wm-2 b { font-weight:800; background:var(--aurora); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
html.light .mgs-hd .wm-2 b { background:none; -webkit-text-fill-color:var(--accent); color:var(--accent); }
.mgs-hd .beta { align-self:flex-start; margin-top:2px; padding:2px 7px; border-radius:999px; font-size:9px; font-weight:800;
  letter-spacing:.14em; color:var(--accent); background:var(--accent-bg); box-shadow:0 0 0 1px var(--accent-dim) inset; }

.mgs-hd .seg { display:inline-flex; padding:2px; border-radius:999px; flex:none;
  background:color-mix(in srgb,var(--bg-elevated) 40%,transparent); box-shadow:0 0 0 1px var(--border-subtle) inset; }
.mgs-hd .seg button { padding:4px 11px; border-radius:999px; font-size:11px; font-weight:700; letter-spacing:.08em; color:var(--text-tertiary);
  unicode-bidi:isolate; transition:color .16s ease,background-color .16s ease; }
.mgs-hd .seg button:hover { color:var(--text-secondary); }
.mgs-hd .seg button[aria-pressed="true"] { color:var(--text-primary); background:var(--accent-bg); box-shadow:0 0 0 1px var(--accent-dim) inset; }
.mgs-hd .sp { flex:1 1 0; min-width:0; }

.mgs-hd .search { position:relative; display:flex; align-items:center; gap:8px; height:36px; flex:0 1 300px; min-width:170px; padding-inline:2px 6px; border-radius:0;
  color:var(--text-tertiary); background:transparent; box-shadow:none;
  border-bottom:1px solid var(--border-subtle); transition:border-color .16s ease; }
.mgs-hd .search:hover { border-bottom-color:var(--border-default); box-shadow:none; }
.mgs-hd .search:focus-within { border-bottom-color:var(--accent); box-shadow:none; }
.mgs-hd .search input { flex:1; min-width:0; height:100%; font:inherit; font-size:13px; color:var(--text-primary); background:transparent; border:0; outline:0;
  border-radius:0; -webkit-appearance:none; appearance:none; }
.mgs-hd .search input:focus, .mgs-hd .search input:focus-visible { outline:0; box-shadow:none; border-radius:0; }
.mgs-hd .search input::-webkit-search-decoration,
.mgs-hd .search input::-webkit-search-cancel-button,
.mgs-hd .search input::-webkit-search-results-button,
.mgs-hd .search input::-webkit-search-results-decoration { -webkit-appearance:none; appearance:none; display:none; }
.mgs-hd .search input::placeholder { color:var(--text-tertiary); }
/* ticker options under the flat field. A symbol query offers the ticker page; it does not filter the map. */
.mgs-suggest { position:absolute; z-index:6; top:calc(100% + 8px); inset-inline-start:0; width:max(100%, 340px); margin:0; padding:4px; list-style:none;
  background:var(--bg-elevated); border:1px solid var(--border-subtle);
  box-shadow:0 16px 36px -18px color-mix(in srgb, var(--bg-deeper) 80%, transparent); }
.mgs-suggest[hidden] { display:none; }
.mgs-suggest a { display:flex; align-items:center; gap:10px; min-height:40px; padding:6px 10px; text-decoration:none; color:var(--text-primary); }
.mgs-suggest a.on, .mgs-suggest a:hover { background:var(--accent-bg); }
.mgs-suggest .sym { flex:none; min-width:64px; font-family:var(--font-mono); font-size:13px; font-weight:800; letter-spacing:.02em; }
.mgs-suggest .co { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; color:var(--text-secondary); }
.mgs-suggest .go { flex:none; font-size:10.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); }
.mgs-suggest .hd { padding:8px 10px 2px; font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--text-tertiary); }
.mgs-suggest a:focus-visible { outline:0; box-shadow:none; border-radius:0; background:var(--accent-bg); }
.mgs-hd .kbd { font-family:var(--font-mono); font-size:10px; font-weight:700; padding:2px 6px; border-radius:6px; color:var(--text-tertiary);
  box-shadow:0 0 0 1px var(--border-subtle) inset; direction:ltr; }
.mgs-hd .ico { width:16px; height:16px; flex:none; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.mgs-hd .pill { display:inline-flex; align-items:center; gap:7px; height:30px; padding-inline:12px; border-radius:999px; flex:none;
  font-size:10.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; white-space:nowrap; }
.mgs-hd .pill .dot { width:7px; height:7px; border-radius:50%; background:currentColor; box-shadow:0 0 10px currentColor; }
.mgs-hd .pill.s-open { color:var(--up); background:var(--up-bg); box-shadow:0 0 0 1px color-mix(in srgb,var(--up) 45%,transparent) inset; }
.mgs-hd .pill.s-ext  { color:var(--warn); background:var(--warn-bg); box-shadow:0 0 0 1px color-mix(in srgb,var(--warn) 45%,transparent) inset; }
.mgs-hd .pill.s-shut { color:var(--text-tertiary); background:color-mix(in srgb,var(--bg-elevated) 40%,transparent); box-shadow:0 0 0 1px var(--border-subtle) inset; }
.mgs-hd .pill.s-shut .dot { box-shadow:none; }
/* the data chip: SAMPLE (amber, steady) · LIVE (green, the dot breathes) · stale (amber) */
.mgs-hd .mgs-data { text-transform:none; letter-spacing:.04em; font-size:10.5px; gap:8px; padding-inline:11px; border:0; font-family:inherit; }
.mgs-hd .mgs-data .w { font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.mgs-hd .mgs-data .lbl-x { font-weight:700; }
.mgs-hd .mgs-data.is-sample { color:var(--text-tertiary); background:transparent; box-shadow:0 0 0 1px var(--border-subtle) inset; }
.mgs-hd .mgs-data.is-stale { color:var(--warn); background:var(--warn-bg); box-shadow:0 0 0 1px color-mix(in srgb,var(--warn) 45%,transparent) inset; }
.mgs-hd .mgs-data.is-live { color:var(--up); background:transparent; box-shadow:0 0 0 1px color-mix(in srgb,var(--up) 40%,transparent) inset; }
.mgs-hd .mgs-data.is-live .dot { animation:mgs-pulse 2.4s ease-in-out infinite; }
.mgs-hd .mgs-data.is-sample .dot, .mgs-hd .mgs-data.is-stale .dot { box-shadow:none; }
.mgs-hd button.mgs-data { cursor:pointer; }
.mgs-hd button.mgs-data:hover { filter:brightness(1.12); }
@keyframes mgs-pulse { 0%,100% { opacity:1; } 50% { opacity:.35; } }
@media (prefers-reduced-motion:reduce) { .mgs-hd .mgs-data.is-live .dot { animation:none; } }

.mgs-hd .clock { display:flex; flex-direction:column; align-items:flex-end; line-height:1; flex:none; direction:ltr; }
.mgs-hd .clock-t { font-family:var(--font-mono); font-size:20px; font-weight:700; letter-spacing:-.02em;
  background:var(--aurora); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
html.light .mgs-hd .clock-t { background:none; -webkit-text-fill-color:var(--text-primary); color:var(--text-primary); }
.mgs-hd .clock-d { margin-top:4px; font-size:9.5px; font-weight:700; letter-spacing:.14em; color:var(--text-tertiary); text-transform:uppercase; }
[dir="rtl"] .mgs-hd .clock { align-items:flex-start; }

.mgs-hd .btn { display:inline-flex; align-items:center; gap:7px; height:34px; padding-inline:12px; border-radius:10px; flex:none;
  font-size:12px; font-weight:700; color:var(--text-secondary); text-decoration:none; box-shadow:0 0 0 1px var(--border-subtle) inset;
  transition:color .16s ease,box-shadow .16s ease,background-color .16s ease; }
.mgs-hd .btn:hover { color:var(--text-primary); background:var(--bg-hover); box-shadow:0 0 0 1px var(--border-default) inset; }
.mgs-hd .btn.gold { color:var(--accent); box-shadow:0 0 0 1px var(--accent-dim) inset; background:var(--accent-bg); }
.mgs-hd .btn.gold:hover { color:var(--accent-2); box-shadow:0 0 0 1px var(--accent) inset,0 6px 20px var(--accent-bg); }
/* Classic — the way back to the current app. Present only when the shell is mounted at /next/. Hidden on the phone; the More sheet carries the same link. */
header.hd .mgs-classic, .mgs-hd .mgs-classic { height:30px; padding-inline:11px; border-radius:999px; font-size:10.5px; font-weight:800;
  letter-spacing:.08em; text-transform:uppercase; text-decoration:none; }
@media (max-width:720px) { header.hd .mgs-classic, .mgs-hd .mgs-classic { display:none; } }
.mgs-hd .icon-btn { width:34px; height:34px; padding:0; justify-content:center; }
.mgs-hd .search-ico { display:none; }
.mgs-hd .bell { position:relative; }
.mgs-hd .bell[aria-current="page"] { color:var(--text-primary); background:var(--bg-hover); box-shadow:0 0 0 1px var(--border-default) inset; }
.mgs-hd .bell-n { position:absolute; top:-6px; inset-inline-end:-6px; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--accent); color:var(--on-accent);
  font:800 10px/18px var(--font-mono); text-align:center; box-shadow:0 0 0 2px var(--bg-deeper); pointer-events:none; direction:ltr; }
html.light .mgs-hd .bell-n { box-shadow:0 0 0 2px var(--bg-surface); }

.mgs-hd .acct { display:flex; align-items:center; gap:10px; height:38px; padding-inline:6px 4px; border-radius:12px; flex:none; box-shadow:0 0 0 1px var(--border-subtle) inset; }
.mgs-hd .avatar { width:28px; height:28px; border-radius:50%; display:grid; place-items:center; font-size:11px; font-weight:800; color:var(--on-accent); background:var(--aurora); }
html.light .mgs-hd .avatar { background:var(--accent); }
.mgs-hd .acct-who { display:flex; flex-direction:column; line-height:1.15; min-width:0; }
.mgs-hd .acct-mail { font-size:11.5px; font-weight:600; color:var(--text-secondary); max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; direction:ltr; text-align:start; }
.mgs-hd .tier { align-self:flex-start; margin-top:2px; padding:1px 7px; border-radius:999px; font-size:9px; font-weight:800; letter-spacing:.14em;
  color:var(--info); background:var(--info-bg); box-shadow:0 0 0 1px color-mix(in srgb,var(--info) 40%,transparent) inset; }
.mgs-hd .acct .icon-btn { width:30px; height:30px; box-shadow:none; color:var(--text-tertiary); }
.mgs-hd .acct .icon-btn:hover { color:var(--down); background:var(--down-bg); }

/* the long chip text only where the header has room */
.mgs-hd .mgs-data .lbl-x { display:none; }
@media (min-width:1760px) { .mgs-hd .mgs-data .lbl-x { display:inline; } }

@media (max-width:1340px) { .mgs-hd .acct-who, .mgs-hd .clock-d { display:none; } .mgs-hd .hd-in { gap:14px; } }
@media (max-width:1200px) { .mgs-hd .fb .lbl { display:none; } }
@media (max-width:1024px) { .mgs-hd .wm-1, .mgs-hd .beta, .mgs-hd .clock { display:none; } .mgs-hd .hd-in { gap:10px; } }
@media (max-width:900px)  { .mgs-hd .pill.sess, .mgs-hd .search { display:none; } .mgs-hd .search-ico { display:inline-flex; } }
@media (max-width:720px) {
  .mgs-hd .hd-in { gap:10px; }
  /* the phone: mark + wordmark, EN/HE, search, bell, avatar. Theme, data chip and session live in the More sheet. */
  .mgs-hd .search, .mgs-hd .clock, .mgs-hd .fb, .mgs-hd .pill.sess, .mgs-hd .mgs-data, .mgs-hd #mgsTheme, .mgs-hd .acct-who, .mgs-hd .acct .icon-btn { display:none; }
  .mgs-hd .search-ico { display:inline-flex; }
  .mgs-hd .acct { padding:0; height:auto; box-shadow:none; }
  .mgs-hd .avatar { width:34px; height:34px; }
  .mgs-hd .seg button { padding:4px 9px; }
  .mgs-hd .wm-2 { font-size:13px; letter-spacing:.18em; }
  .mgs-hd .beta { display:none; }
}
@media (max-width:340px) { .mgs-hd .wm { display:none; } }
/* the phone search: the icon opens a full-width strip attached under the header (nothing of the page shows around the field) */
.mgs-hd.is-search .search { display:flex; position:absolute; inset-inline:0; top:var(--header-h); height:56px; flex:none; min-width:0; z-index:3; padding-inline:var(--gutter);
  border-radius:0; border-bottom:0; background:var(--bg-surface); box-shadow:0 1px 0 var(--mgs-line),0 18px 30px -14px color-mix(in srgb,var(--bg-deeper) 85%,transparent); }
.mgs-hd.is-search .search:hover { box-shadow:0 1px 0 var(--mgs-line),0 18px 30px -14px color-mix(in srgb,var(--bg-deeper) 85%,transparent); }
.mgs-hd.is-search .search:focus-within { box-shadow:0 2px 0 var(--accent),0 18px 30px -14px color-mix(in srgb,var(--bg-deeper) 85%,transparent); }
.mgs-hd.is-search .search input { font-size:15px; }
.mgs-sscrim { position:fixed; inset:0; z-index:48; touch-action:none; background:color-mix(in srgb,var(--bg-deeper) 62%,transparent);
  opacity:0; visibility:hidden; transition:opacity 200ms ease,visibility 0s linear 200ms; }
.mgs-sscrim.is-open { opacity:1; visibility:visible; transition:opacity 200ms ease,visibility 0s; }
@media (min-width:901px) { .mgs-sscrim { display:none; } }
@media (prefers-reduced-motion:reduce) { .mgs-sscrim { transition:none; } }
@media (max-width:900px) { .mgs-hd .kbd { display:none; } }

/* ══ THE HEADER'S WIDTH BUDGET — "the header may never widen the page" (architect's rule, proven by harness/gates_header.mjs) ═══════════════════════════
   One ladder for the shell's header AND the home's own (the build emits every rule below for both roots). Order of give: the search shrinks first (floor 110),
   the session pill drops its countdown, the Feedback label goes (the button keeps its aria-label), the clock goes below 1200, on the phone the spacer goes and
   the wordmark gives way to the mark below 384. The bell and the avatar never leave. The account e-mail is already capped (max-width + ellipsis, min-width 0). */
/* the header's width budget — emitted for the shell's header and for the home's (nav-only) */
.mgs-hd .search,
body[data-shell="nav-only"] header.hd .search { flex: 0 10 300px; min-width: 110px; }
.mgs-hd .acct-who,
body[data-shell="nav-only"] header.hd .acct-who { min-width: 0; }
.mgs-hd .acct-mail,
body[data-shell="nav-only"] header.hd .acct-mail { min-width: 0; }
@media (max-width: 1519.98px) {
.mgs-hd .pill.sess .lbl-x,
body[data-shell="nav-only"] header.hd .pill.sess .lbl-x { display: none; }
}
@media (max-width: 1399.98px) {
.mgs-hd .fb .lbl,
body[data-shell="nav-only"] header.hd .fb .lbl { display: none; }
}
@media (max-width: 1199.98px) {
.mgs-hd .clock,
body[data-shell="nav-only"] header.hd .clock { display: none; }
}
@media (max-width: 720px) {
.mgs-hd .hd-in,
body[data-shell="nav-only"] header.hd .hd-in { gap: 8px; }
.mgs-hd .sp,
body[data-shell="nav-only"] header.hd .sp { display: none; }
.mgs-hd .search-ico,
body[data-shell="nav-only"] header.hd .search-ico { margin-inline-start: auto; }
}
@media (max-width: 383.98px) {
.mgs-hd .wm,
body[data-shell="nav-only"] header.hd .wm { display: none; }
}

/* ══ THE NAVIGATION ═══════════════════════════════════════════════════════════════════════════════════ */
.mgs-nav { position:fixed; z-index:40; display:flex; flex-direction:column;
  background:color-mix(in srgb,var(--bg-deeper) 90%,transparent);
  backdrop-filter:blur(20px) saturate(180%); -webkit-backdrop-filter:blur(20px) saturate(180%); }
html.light .mgs-nav { background:color-mix(in srgb,var(--bg-surface) 94%,transparent); }
.mgs-nav ul { list-style:none; display:flex; flex:1; }
.mgs-nav li { display:flex; }
.mgs-item { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; width:100%; min-width:0;
  font:inherit; font-size:10px; font-weight:700; letter-spacing:.01em; line-height:1.15; text-align:center; text-decoration:none;
  color:var(--text-tertiary); background:none; border:0; cursor:pointer; border-radius:12px; transition:color .16s ease,background-color .16s ease; }
.mgs-item:hover { color:var(--text-primary); background:var(--bg-hover); }
.mgs-item[aria-current="page"] { color:var(--accent); }
.mgs-ico { width:22px; height:22px; flex:none; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.mgs-ico.fill { fill:currentColor; stroke:none; }
.mgs-lbl { max-width:100%; overflow-wrap:anywhere; unicode-bidi:isolate; padding-inline:2px; }
.mgs-nav :focus-visible, .mgs-sheet :focus-visible { outline:2px solid var(--accent); outline-offset:-2px; box-shadow:none; border-radius:12px; }
.mgs-badge { position:absolute; top:6px; inset-inline-end:calc(50% - 20px); min-width:16px; height:16px; padding:0 4px; border-radius:999px; background:var(--accent); color:var(--on-accent);
  font:800 9.5px/16px var(--font-mono); text-align:center; direction:ltr; }

@media (min-width:1024px) {
  .mgs-nav { top:var(--header-h); bottom:0; inset-inline-start:0; width:var(--rail-w); padding:10px 6px; border-inline-end:1px solid var(--mgs-line); overflow-y:auto; overflow-x:hidden; }
  .mgs-nav ul { flex-direction:column; gap:4px; }
  .mgs-item { min-height:58px; padding:8px 2px 7px; }
  .mgs-lbl { overflow-wrap:normal; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:-.01em; }
  .mgs-nav li.mgs-bottom { margin-top:auto; }
  .mgs-nav li.mgs-m { display:none; }
  .mgs-item[aria-current="page"] { background:var(--accent-bg); }
  .mgs-item[aria-current="page"]::before { content:""; position:absolute; inset-block:12px; inset-inline-start:-6px; width:3px; border-radius:3px; background:var(--aurora); }
}
@media (max-width:1023.98px) {
  .mgs-nav { inset-inline:0; bottom:0; height:calc(var(--nb-h) + env(safe-area-inset-bottom)); padding-bottom:env(safe-area-inset-bottom); border-top:1px solid var(--mgs-line); }
  .mgs-nav ul { flex-direction:row; }
  .mgs-nav li { flex:1 1 0; min-width:0; }
  .mgs-nav li:not(.mgs-t):not(.mgs-m) { display:none; }
  .mgs-item { min-height:var(--nb-h); padding:6px 2px; border-radius:0; }
  .mgs-item[aria-current="page"]::before { content:""; position:absolute; top:0; inset-inline:24%; height:3px; border-radius:0 0 3px 3px; background:var(--aurora); }
}

/* ── LOCKED doors (packet NEXT-PARITY-1, operator order 2026-11-03): visible, grey, a lock mark, not a link. The feed's grey chips are the model. ───────── */
.mgs-item.is-locked { color:var(--text-tertiary); opacity:.62; cursor:not-allowed; }
.mgs-item.is-locked:hover { color:var(--text-tertiary); background:transparent; }
.mgs-item .mgs-lock { position:absolute; top:5px; inset-inline-end:calc(50% - 23px); box-sizing:content-box; width:11px; height:11px; padding:2px; border-radius:50%;
  stroke:currentColor; fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; color:var(--text-secondary); background:var(--bg-deeper);
  box-shadow:0 0 0 1px var(--mgs-line); }
html.light .mgs-item .mgs-lock { background:var(--bg-surface); }
.mgs-row.is-locked { color:var(--text-tertiary); cursor:not-allowed; }
.mgs-row.is-locked:hover { background:transparent; }
.mgs-row.is-locked .mgs-ico { color:var(--text-tertiary); opacity:.75; }
[dir="rtl"] .mgs-row.is-locked .mgs-chev { transform:none; }
/* the label "Smart Money" is two words in a 72 px rail: it may break between them rather than lose its end to an ellipsis */
@media (min-width:1024px) { .mgs-item[data-mgs-k="smartmoney"] .mgs-lbl { white-space:normal; line-height:1.1; text-align:center; } }

/* ══ THE PHONE "MORE" SHEET ═══════════════════════════════════════════════════════════════════════════ */
.mgs-scrim { position:fixed; inset:0; z-index:65; touch-action:none; background:color-mix(in srgb,var(--bg-deeper) 58%,transparent);
  opacity:0; visibility:hidden; transition:opacity 250ms ease,visibility 0s linear 250ms; }
.mgs-scrim.is-open { opacity:1; visibility:visible; transition:opacity 250ms ease,visibility 0s; }
.mgs-sheet { position:fixed; z-index:70; inset-inline:0; bottom:0; display:flex; flex-direction:column; max-height:calc(100dvh - var(--header-h) - 8px);
  padding-bottom:env(safe-area-inset-bottom); border-radius:16px 16px 0 0; color:var(--text-primary); background:var(--bg-surface);
  box-shadow:0 0 0 1px var(--border-subtle) inset,0 -14px 40px color-mix(in srgb,var(--bg-deeper) 60%,transparent);
  transform:translateY(100%); visibility:hidden; transition:transform 320ms cubic-bezier(0.32,0.72,0,1),visibility 0s linear 320ms; }
.mgs-sheet.is-open { transform:none; visibility:visible; transition:transform 320ms cubic-bezier(0.32,0.72,0,1),visibility 0s; }
.mgs-handle { width:38px; height:4px; border-radius:4px; margin:8px auto 2px; background:var(--border-default); flex:none; }
.mgs-sh-hd { display:flex; align-items:center; gap:8px; padding:6px 8px 6px 18px; flex:none; }
.mgs-sh-hd h2 { flex:1; font-size:16px; font-weight:800; letter-spacing:-.01em; outline:none; }
.mgs-x { width:40px; height:40px; display:grid; place-items:center; border-radius:12px; color:var(--text-secondary); }
.mgs-x:hover { color:var(--text-primary); background:var(--bg-hover); }
.mgs-sh-bd { overflow-y:auto; padding:2px 10px 12px; overscroll-behavior:contain; }
.mgs-sh-bd ul { list-style:none; }
.mgs-row { position:relative; display:flex; align-items:center; gap:14px; width:100%; min-height:52px; padding:8px 12px; border-radius:12px; font:inherit; font-size:14px; font-weight:600;
  text-align:start; text-decoration:none; color:var(--text-primary); background:none; border:0; cursor:pointer; }
.mgs-row:hover { background:var(--bg-hover); }
.mgs-row[aria-current="page"] { color:var(--accent); background:var(--accent-bg); }
.mgs-row .mgs-ico { color:var(--text-secondary); }
.mgs-row[aria-current="page"] .mgs-ico { color:var(--accent); }
.mgs-row .grow { flex:1; min-width:0; overflow-wrap:anywhere; }
.mgs-row .val { font-size:12px; font-weight:700; color:var(--text-secondary); }
.mgs-row .mgs-chev { width:16px; height:16px; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; color:var(--text-tertiary); flex:none; }
[dir="rtl"] .mgs-chev { transform:scaleX(-1); }
.mgs-sec { margin:12px 12px 4px; font-size:10.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color:var(--text-tertiary); }
.mgs-pref { display:flex; align-items:center; gap:14px; min-height:48px; padding:6px 12px; border-radius:12px; font-size:13px; color:var(--text-secondary); }
.mgs-pref .grow { flex:1; min-width:0; overflow-wrap:anywhere; }
.mgs-pref .mgs-chip, .mgs-row .mgs-chip { display:inline-flex; align-items:center; gap:7px; height:26px; padding:0 10px; border-radius:999px; font-size:10.5px; font-weight:800; letter-spacing:.06em; white-space:nowrap; }
.mgs-chip.is-sample { color:var(--text-secondary); background:transparent; box-shadow:0 0 0 1px var(--border-default) inset; }
.mgs-chip.is-stale { color:var(--warn); background:var(--warn-bg); box-shadow:0 0 0 1px color-mix(in srgb,var(--warn) 45%,transparent) inset; }
.mgs-chip.is-live { color:var(--up); background:var(--up-bg); box-shadow:0 0 0 1px color-mix(in srgb,var(--up) 40%,transparent) inset; }
.mgs-chip i { width:6px; height:6px; border-radius:50%; background:currentColor; }
.mgs-row .mgs-badge { position:static; }
@media (min-width:1024px) { .mgs-sheet, .mgs-scrim { display:none; } }
@media (prefers-reduced-motion:reduce) { .mgs-sheet, .mgs-scrim { transition:none !important; } }

/* ── the toast + announcements ──────────────────────────────────────────────────────────────────────── */
.mgs-toast { position:fixed; z-index:80; inset-inline:12px; bottom:calc(var(--nb-h) + env(safe-area-inset-bottom) + 14px); margin-inline:auto; width:fit-content; max-width:min(520px,calc(100vw - 24px));
  padding:10px 16px; border-radius:12px; font-size:12.5px; font-weight:600; color:var(--text-primary); background:var(--bg-elevated);
  box-shadow:0 0 0 1px var(--border-default) inset,0 10px 30px color-mix(in srgb,var(--bg-deeper) 70%,transparent);
  opacity:0; transform:translateY(6px); visibility:hidden; pointer-events:none; transition:opacity .2s ease,transform .2s ease,visibility 0s linear .2s; }
.mgs-toast.is-on { opacity:1; transform:none; visibility:visible; transition:opacity .2s ease,transform .2s ease,visibility 0s; }
@media (min-width:1024px) { .mgs-toast { bottom:24px; } }
@media (prefers-reduced-motion:reduce) { .mgs-toast { transition:none; transform:none; } }

/* ══ OPTIONAL SHARED TITLE ROW for screens (mgs- prefix; a screen may use it or copy the look under its own prefix) ═════ */
.mgs-titlerow { display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; min-height:52px; padding:14px var(--gutter) 0; }
.mgs-h1 { font-size:22px; font-weight:800; letter-spacing:-0.012em; line-height:1.2; color:var(--text-primary); }
.mgs-sample { display:inline-flex; align-items:center; gap:8px; height:24px; padding:0 10px 0 9px; border-radius:999px; font-size:10.5px; font-weight:800; letter-spacing:.1em;
  text-transform:uppercase; color:var(--warn); background:var(--warn-bg); box-shadow:0 0 0 1px color-mix(in srgb,var(--warn) 45%,transparent) inset; white-space:nowrap; }
.mgs-sample i { width:6px; height:6px; border-radius:50%; background:currentColor; }
.mgs-sample .fig { font-family:var(--font-mono); font-variant-numeric:tabular-nums; direction:ltr; unicode-bidi:isolate; font-size:10.5px; font-weight:700; letter-spacing:.02em; text-transform:none; color:var(--warn); }
.mgs-titlerow-act { margin-inline-start:auto; display:flex; align-items:center; gap:8px; }
@media (max-width:720px) { .mgs-h1 { font-size:20px; } }
.mgs-sec:empty { height:1px; margin:10px 12px; padding:0; background:var(--mgs-line); }

/* Feedback. The dialog sits on the body, outside the header the shell marks inert. */
.mgs-fb-scrim { position:fixed; inset:0; z-index:90; display:grid; place-items:center; padding:24px 16px; background:color-mix(in srgb, var(--bg-deeper) 62%, transparent); }
.mgs-fb { width:min(440px, 100%); display:grid; gap:14px; padding:16px; border-radius:14px; background:var(--bg-surface); box-shadow:0 0 0 1px var(--border-default) inset, 0 24px 60px color-mix(in srgb, var(--bg-deeper) 70%, transparent); }
.mgs-fb-top { display:flex; align-items:center; gap:12px; }
.mgs-fb-t { flex:1; margin:0; font-size:16px; font-weight:800; }
.mgs-fb-x, .mgs-fb-cancel, .mgs-fb-send { min-height:34px; padding:0 12px; border-radius:8px; font:inherit; font-size:13px; font-weight:700; color:var(--text-primary); background:transparent; box-shadow:0 0 0 1px var(--border-default) inset; cursor:pointer; }
.mgs-fb-send { color:var(--bg-deeper); background:var(--accent); box-shadow:none; }
.mgs-fb-send:disabled { opacity:.55; cursor:default; }
.mgs-fb-form { display:grid; gap:8px; }
.mgs-fb-l { font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--text-tertiary); }
.mgs-fb-in { width:100%; box-sizing:border-box; padding:8px 10px; border-radius:8px; border:0; font:inherit; font-size:13px; color:var(--text-primary); background:var(--bg-base); box-shadow:0 0 0 1px var(--border-subtle) inset; }
.mgs-fb-check { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--text-secondary); }
.mgs-fb-status { min-height:1.2em; margin:0; font-size:12.5px; color:var(--text-secondary); }
.mgs-fb-act { display:flex; justify-content:flex-end; gap:8px; }

/* ══ EXTREME CRITICAL INTEREST · CARD v2 (packet NEXT 2026-11-02 · shell/shell.js MGCard) ═══════════════════════════════
   A solid red row: every list adds .mgx to the row of a card the relay stamped osint_extreme. The interest cell carries the
   chip (EXTREME CRITICAL INTEREST + the lane); the direction cell says Watch. Ink on fill ≥ 7:1 in both skins. */
:root { --mgx-fill:#8E0B1E; --mgx-ink:#FFF7F6; --mgx-line:#FF6B7A; --mgx-chip:#FFF7F6; --mgx-chip-ink:#7A0A1C; }
html.light { --mgx-fill:#A3122A; --mgx-ink:#FFFFFF; --mgx-line:#5E0716; --mgx-chip:#FFFFFF; --mgx-chip-ink:#7A0A1C; }
.mgx { background:var(--mgx-fill) !important; box-shadow:0 0 0 2px var(--mgx-line) inset !important; color:var(--mgx-ink) !important; }
.mgx::before { background:var(--mgx-ink) !important; }
.mgx :is(p,span,b,small,strong,em,h2,h3,h4,a,button,div,bdi,time,i,li):not(.mgx-chip):not(.mgx-chip *):not(.mgx-ack):not(.mgx-ack *) { color:var(--mgx-ink) !important; }
.mgx :is(.rd-int,.rd-dir,.rd-tag,.rd-badge,.rd-fam,.hm-int,.hm-dir,.hm-tag,.hm-badge,.hm-fam,.os-int,.os-dir,.os-tag,.os-badge,.os-fam,.os-chip,.ex-int,.ex-dir,.ex-fam,.kw-int,.st-int,.st-dir,.st-fam,.st-tag) {
  background:transparent !important; box-shadow:0 0 0 1px color-mix(in srgb,var(--mgx-ink) 70%,transparent) inset !important; }
.mgx svg { stroke:currentColor; }
.mgx-chip { display:inline-flex; flex-wrap:wrap; align-items:center; gap:2px 6px; max-width:100%; padding:3px 9px; border-radius:12px;
  background:var(--mgx-chip); color:var(--mgx-chip-ink) !important; font-size:10.5px; font-weight:800; letter-spacing:.05em; line-height:1.3;
  box-shadow:0 0 0 1px var(--mgx-chip-ink) inset; unicode-bidi:isolate; }
.mgx-chip * { color:var(--mgx-chip-ink) !important; }
.mgx-chip b { font-weight:800; white-space:normal; }   /* a narrow interest cell wraps the label instead of clipping it */
.mgx-chip .mgx-lane { font-weight:700; letter-spacing:.02em; white-space:nowrap; padding-inline-start:6px; border-inline-start:1px solid currentColor; }
.mgx-chip.sm { font-size:10px; padding:2px 7px; }
.mgx-pin { font-size:11px; font-weight:700; letter-spacing:.02em; }
.mgx-ack, .mgx .mgx-ack { display:inline-flex; align-items:center; gap:6px; width:auto; min-height:28px; padding:0 12px !important; border-radius:999px !important;
  background:var(--mgx-chip) !important; color:var(--mgx-chip-ink) !important; font:inherit; font-size:11.5px; font-weight:800; letter-spacing:.03em;
  line-height:1.2; text-align:center; cursor:pointer; border:0; box-shadow:none !important; }
.mgx-ack * { color:var(--mgx-chip-ink) !important; }
.mgx-ack:hover { filter:brightness(.94); }
.mgx-ack:focus-visible { outline:2px solid var(--mgx-ink); outline-offset:2px; }
.mgx-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; margin-top:6px; }
/* CARD v2 — the impact grade (a rule-table outcome of verified facts), and its five blocks in the expanded card */
.mgc-imp { display:inline-flex; flex-wrap:wrap; align-items:baseline; gap:0 5px; max-width:100%; padding:2px 8px; border-radius:10px; font-size:10.5px; font-weight:800;
  letter-spacing:.04em; line-height:1.4; box-shadow:0 0 0 1px currentColor inset; unicode-bidi:isolate; }
.mgc-imp b { white-space:nowrap; }
.mgc-imp small { font-size:10px; font-weight:600; letter-spacing:0; opacity:.9; }
.mgc-imp.up { color:var(--up); } .mgc-imp.down { color:var(--down); } .mgc-imp.flat, .mgc-imp.watch { color:var(--text-secondary); }
.mgc-imp.x.up { background:var(--up); box-shadow:none; } .mgc-imp.x.down { background:var(--down); box-shadow:none; }
.mgc-imp.x b, .mgc-imp.x small { color:var(--on-accent, #071426); }
.mgc-v2 { display:grid; gap:12px; margin:12px 0 4px; text-align:start; }
.mgc-blk h4 { margin:0 0 4px; font-size:10.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--text-tertiary); }
.mgc-blk p, .mgc-blk li { margin:0; font-size:13px; line-height:1.55; color:var(--text-primary); }
.mgc-blk ul { margin:0; padding-inline-start:18px; display:grid; gap:4px; }
.mgc-blk small { color:var(--text-tertiary); font-size:11.5px; }
.mgc-imp-l { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px; }
.mgc-note { margin-top:4px !important; font-size:12px !important; color:var(--text-tertiary) !important; }
/* U1: the header search shows a ring while its input holds the keyboard focus (the input itself draws none) */
.mgs-hd .search:has(input:focus-visible), header.hd .search:has(input:focus-visible) { outline:2px solid var(--accent); outline-offset:2px; }
