/* ============================================================
   market-intelligence.css — BrickCapital Market Intelligence
   Premium landing ("the trading floor"). Loaded on
   market-intelligence.html after styles.css. Presentation only —
   every number still comes from the real score engine. Reuses the
   existing .mi-mover-card design untouched; this file only adds the
   hero, dashboard, featured, insights, and curated-row scaffolding.
   ============================================================ */

/* ============================================================
   EMERALD FINANCIAL PALETTE — Market Intelligence section identity.
   Graphite base with a cool green tint, emerald accent, deep green
   and mint highlights. Neutral text tokens and the shared
   radius, shadow, ease and font-mono tokens are reused unchanged.
   Gold is never used here (reserved for Marketplace).
============================================================ */
.page-intelligence {
  --mi-graphite: #14181a;      /* base */
  --mi-graphite-2: #171c1a;    /* panel, cool-green tint */
  --mi-graphite-3: #0f1315;    /* deepest */
  --mi-emerald: #10b981;       /* primary accent */
  --mi-emerald-2: #34d399;     /* light accent / eyebrow dot */
  --mi-deep: #0c3b2c;          /* deep green */
  --mi-mint: #6ee7b7;          /* mint highlight */
  --mi-pos: #34d399;           /* positive stat */
  --mi-neg: #f0687e;           /* negative stat */
  --mi-glow: rgba(16,185,129,0.20);
  --mi-glow-soft: rgba(52,211,153,0.13);
  --mi-line: rgba(52,211,153,0.16);
}

.page-intelligence main.wrap { max-width: 1180px; }

.mil-reveal { opacity: 0; transform: translateY(16px); transition: opacity .55s var(--ease), transform .55s var(--ease); }
.mil-reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .mil-reveal { opacity: 1; transform: none; transition: none; } }

.mil-section { margin: 0 0 44px; }
.mil-head { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; margin: 0 0 18px; }
.mil-head .kick { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono, monospace); font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--mi-emerald-2); }
.mil-head .kick::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--mi-emerald-2); box-shadow: 0 0 8px rgba(52,211,153,0.85); flex-shrink: 0; }
.mil-head h2 { font-size: clamp(22px, 2.6vw, 30px); font-weight: 800; letter-spacing: -0.025em; margin: 0; }
.mil-head .sub { flex-basis: 100%; font-size: 14px; color: var(--ink-muted); margin: 2px 0 0; line-height: 1.55; max-width: 760px; }
.mil-head .more { margin-left: auto; font-size: 13px; font-weight: 640; color: var(--ink-muted); text-decoration: none; white-space: nowrap; }
.mil-head .more:hover { color: var(--mi-emerald-2); }

/* ============================================================
   1 · CINEMATIC HERO
============================================================ */
.mil-hero {
  position: relative; overflow: hidden; isolation: isolate;
  border-radius: 26px; border: 1px solid var(--glass-border);
  margin: 8px 0 20px; padding: 62px 48px 54px;
  background:
    radial-gradient(680px 380px at 16% 6%, rgba(52,211,153,0.10), transparent 60%),
    radial-gradient(720px 460px at 92% 30%, rgba(16,185,129,0.09), transparent 62%),
    linear-gradient(165deg, #171c1a 0%, #0f1315 58%, #141a18 100%),
    var(--mi-graphite-3);
}
/* faint market-grid + abstract data lines behind the copy */
.mil-hero-grid { position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0.5;
  background-image: linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
  background-size: 46px 46px;
  -webkit-mask: radial-gradient(120% 100% at 70% 20%, #000 20%, transparent 76%);
  mask: radial-gradient(120% 100% at 70% 20%, #000 20%, transparent 76%);
}
.mil-hero-lines { position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0.5; }
.mil-hero-lines path { fill: none; stroke-width: 2; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: milLine 2.2s var(--ease-out) forwards; }
@keyframes milLine { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { .mil-hero-lines path { animation: none; stroke-dashoffset: 0; } }
.mil-hero-glow { position: absolute; width: 460px; height: 460px; right: -80px; top: -120px; z-index: 0; pointer-events: none; border-radius: 50%; background: radial-gradient(circle, rgba(16,185,129,0.14), transparent 68%); filter: blur(20px); animation: milGlow 18s ease-in-out infinite; }
@keyframes milGlow { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-24px,20px) scale(1.08); } }
@media (prefers-reduced-motion: reduce) { .mil-hero-glow { animation: none; } }

.mil-hero-inner { position: relative; z-index: 2; max-width: 720px; }
.mil-eyebrow { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono, monospace); font-size: 11.5px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--mi-emerald-2); }
.mil-eyebrow::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--mi-emerald-2); box-shadow: 0 0 8px rgba(52,211,153,0.85); }
.mil-title { font-size: clamp(40px, 6vw, 72px); font-weight: 840; letter-spacing: -0.035em; line-height: 1.0; margin: 16px 0 0; color: #fff; }
.mil-title em { font-style: normal; color: #34d399; background: linear-gradient(118deg, #6ee7b7, #34d399 48%, #10b981); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.mil-sub { font-size: 17px; line-height: 1.6; color: var(--ink-soft); margin: 18px 0 0; max-width: 620px; }

/* elevated AI search inside the hero */
.mil-search { position: relative; z-index: 2; margin-top: 28px; max-width: 660px; }
.mil-search-card { border-radius: 18px; border: 1px solid var(--glass-border); background: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.015)); box-shadow: var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,0.06); padding: 18px 18px; backdrop-filter: var(--glass-blur, blur(14px)); -webkit-backdrop-filter: var(--glass-blur, blur(14px)); }
.mil-search-label { display: flex; align-items: center; gap: 9px; font-size: 13.5px; font-weight: 700; color: var(--ink); }
.mil-search-label .spark { color: var(--mi-emerald-2); font-size: 16px; }
.mil-search-hint { font-size: 12.5px; color: var(--ink-muted); margin: 3px 0 13px; line-height: 1.5; }
/* re-style the existing generate form (keeps its ids) */
.mil-search .mi-ai-generate-form { display: flex; gap: 10px; }
.mil-search .mi-ai-generate-form input { flex: 1; min-width: 0; padding: 13px 16px; border-radius: 12px; border: 1px solid var(--glass-border); background: var(--near-black); color: var(--ink); font-size: 14.5px; }
.mil-search .mi-ai-generate-form input:focus { outline: none; border-color: rgba(16,185,129,0.5); box-shadow: 0 0 0 3px rgba(16,185,129,0.14); }
.mil-search .mi-ai-generate-form .btn { flex-shrink: 0; }
.mil-search .mi-ai-generate-status { font-size: 12.5px; color: var(--ink-muted); margin-top: 8px; min-height: 0; }
@media (max-width: 560px) {
  .mil-search .mi-ai-generate-form { flex-direction: column; }
  .mil-search .mi-ai-generate-form .btn { width: 100%; justify-content: center; }
}

/* ticker sits just under the hero as a live band */
.page-intelligence .mi-ticker { margin: 0 0 26px; }

/* ============================================================
   2 · MARKET OVERVIEW DASHBOARD
============================================================ */
.mil-dash { display: grid; grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); gap: 14px; }
.mil-tile { position: relative; overflow: hidden; border-radius: 18px; border: 1px solid var(--glass-border); background: linear-gradient(160deg, rgba(255,255,255,0.05), rgba(255,255,255,0.012)); box-shadow: var(--shadow-md); padding: 18px; transition: transform .18s var(--ease), border-color .18s var(--ease), box-shadow .18s var(--ease); }
.mil-tile:hover { transform: translateY(-4px); border-color: var(--border-hover); box-shadow: var(--shadow-hover); }
.mil-tile::before { content: ""; position: absolute; top: 0; left: 16px; right: 16px; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent); opacity: 0.6; }
.mil-tile .ico { display: inline-flex; width: 34px; height: 34px; border-radius: 10px; align-items: center; justify-content: center; color: var(--mi-emerald-2); background: rgba(16,185,129,0.13); border: 1px solid rgba(16,185,129,0.2); margin-bottom: 12px; }
.mil-tile .ico svg { width: 17px; height: 17px; }
.mil-tile .k { font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink-muted); }
.mil-tile .v { font-size: 26px; font-weight: 820; letter-spacing: -0.02em; line-height: 1.1; margin-top: 3px; font-variant-numeric: tabular-nums; }
.mil-tile .v small { font-size: 14px; color: var(--ink-muted); font-weight: 600; }
.mil-tile .d { font-size: 12.5px; color: var(--ink-soft); margin-top: 4px; overflow-wrap: anywhere; }
.mil-tile .d.up { color: #34d399; } .mil-tile .d.down { color: #e0576a; }
.mil-tile.accent-gold .v { color: var(--mi-emerald-2); }
.mil-tile.accent-green .v { color: #34d399; }

/* ============================================================
   3 · FEATURED ANALYSIS
============================================================ */
.mil-featured { position: relative; overflow: hidden; border-radius: 22px; border: 1px solid var(--glass-border); background: var(--near-black); isolation: isolate; }
.mil-feat-bg { position: absolute; inset: -8%; z-index: 0; }
.mil-feat-bg .thumb { width: 100%; height: 100%; filter: blur(46px) saturate(1.15); transform: scale(1.25); opacity: 0.42; }
.mil-featured::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(9,9,11,0.94) 34%, rgba(9,9,11,0.55) 62%, rgba(9,9,11,0.25)), linear-gradient(0deg, rgba(9,9,11,0.8), transparent 55%); }
.mil-feat-inner { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 380px; gap: 32px; align-items: center; padding: 30px 32px; }
.mil-feat-info { min-width: 0; }
.mil-feat-tagrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.mil-feat-kick { font-family: var(--font-mono, monospace); font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--mi-emerald-2); }
.mil-feat-theme { font-size: 12.5px; color: var(--ink-muted); }
.mil-feat-name { font-size: clamp(26px, 3.4vw, 40px); font-weight: 820; letter-spacing: -0.03em; line-height: 1.04; margin: 8px 0 12px; color: #fff; }
.mil-feat-metrics { display: flex; gap: 26px; flex-wrap: wrap; margin: 6px 0 14px; }
.mil-feat-metric .mk { font-size: 11px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-muted); }
.mil-feat-metric .mv { font-size: 20px; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.mil-feat-metric .mv.up { color: #34d399; } .mil-feat-metric .mv.gold { color: var(--mi-emerald-2); }
.mil-feat-summary { font-size: 14.5px; line-height: 1.65; color: var(--ink-soft); max-width: 620px; }
.mil-feat-summary b { color: var(--ink); }
.mil-feat-outlook { display: inline-flex; align-items: center; gap: 8px; margin: 14px 0 18px; padding: 6px 13px; border-radius: 999px; font-size: 13px; font-weight: 700; background: rgba(16,185,129,0.13); border: 1px solid rgba(16,185,129,0.35); color: var(--mi-emerald-2); }
.mil-feat-media { position: relative; }
.mil-feat-media .thumb { width: 100%; aspect-ratio: 4/3; border-radius: 16px; border: 1px solid rgba(255,255,255,0.1); box-shadow: 0 24px 60px -22px rgba(0,0,0,0.7); }
.mil-feat-scorebadge { position: absolute; top: 14px; right: 14px; z-index: 3; }
@media (max-width: 860px) {
  .mil-feat-inner { grid-template-columns: 1fr; gap: 22px; }
  .mil-feat-media { order: -1; max-width: 320px; }
}

/* ============================================================
   4 · AI INSIGHTS
============================================================ */
.mil-insights { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.mil-insight { display: flex; gap: 14px; padding: 18px; border-radius: 16px; border: 1px solid var(--glass-border); background: linear-gradient(160deg, rgba(255,255,255,0.045), rgba(255,255,255,0.01)); box-shadow: var(--shadow-sm); transition: transform .18s var(--ease), border-color .18s var(--ease); }
.mil-insight:hover { transform: translateY(-3px); border-color: var(--border-hover); }
.mil-insight-ico { width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: var(--mi-emerald-2); background: rgba(16,185,129,0.12); border: 1px solid rgba(16,185,129,0.22); }
.mil-insight-ico svg { width: 19px; height: 19px; }
.mil-insight-body { min-width: 0; }
.mil-insight-title { font-size: 14.5px; font-weight: 750; letter-spacing: -0.01em; }
.mil-insight-text { font-size: 13px; color: var(--ink-soft); margin-top: 4px; line-height: 1.55; }
.mil-insight-text b { color: var(--ink); font-weight: 700; }

/* ============================================================
   5 · CURATED CARD ROWS (reuse .mi-mover-card)
============================================================ */
.mil-row-scroll { display: grid; grid-auto-flow: column; grid-auto-columns: 300px; gap: 16px; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-left: 2px; padding: 4px 2px 12px; scrollbar-width: thin; scrollbar-color: var(--line-soft) transparent; overscroll-behavior-x: contain; }
.mil-row-scroll::-webkit-scrollbar { height: 8px; }
.mil-row-scroll::-webkit-scrollbar-thumb { background: var(--line-soft); border-radius: 999px; }
.mil-row-scroll .mi-mover-card { scroll-snap-align: start; margin: 0; }
.mil-head .emoji { font-size: 22px; line-height: 1; }

/* ============================================================
   FULL LIBRARY heading spacing
============================================================ */
#miAllSetsSection { margin-top: 6px; }

/* ============================================================
   RESPONSIVE
============================================================ */
@media (max-width: 700px) {
  .mil-hero { padding: 40px 22px 34px; border-radius: 20px; }
  .mil-title { font-size: 38px; }
  .mil-section { margin-bottom: 36px; }
  .mil-feat-metrics { gap: 16px 22px; }
  .mil-feat-inner { padding: 24px 22px; }
  .mil-row-scroll { grid-auto-columns: 84%; }
}

/* keep grid/flex children from blowing out narrow layouts */
.mil-dash > *, .mil-insights > * { min-width: 0; }

/* ============================================================
   LAUNCH POLISH — appended for public launch. Presentation only;
   every figure still comes from the real score engine.
============================================================ */

/* 1 · TICKER CRAWL SPEED ---------------------------------------
   main.js renders #miTicker with a fast 46s marquee on
   .mi-ticker-track. Override to a calm, readable ~90s loop and
   keep the hover/focus pause. Scoped to this page only so the
   shared ticker component is untouched elsewhere. */
.page-intelligence .mi-ticker { margin-bottom: 30px; border-color: rgba(255,255,255,0.09); }
.page-intelligence .mi-ticker-track { animation-duration: 90s !important; }
.page-intelligence .mi-ticker:hover .mi-ticker-track,
.page-intelligence .mi-ticker:focus-within .mi-ticker-track { animation-play-state: paused !important; }
/* widen the edge fade a touch so items enter/exit more gracefully */
.page-intelligence .mi-ticker::before,
.page-intelligence .mi-ticker::after { width: 72px; }
@media (prefers-reduced-motion: reduce) {
  .page-intelligence .mi-ticker-track { animation: none !important; }
}

/* 2 · LOADING / EMPTY STATES ----------------------------------
   The premium sections are painted a tick after main.js runs.
   Reserve their space with a subtle shimmer so the page never
   collapses or jumps (CLS) before the real cards arrive. Once JS
   fills a container it is no longer :empty and the skeleton drops.
   Sections with too little data are hidden by the JS, so an empty
   placeholder is never left stranded. */
#milDash:empty,
#milFeatured:empty,
#milInsights:empty,
.mil-row-scroll:empty {
  border-radius: 18px;
  border: 1px solid var(--glass-border);
  background:
    linear-gradient(100deg, rgba(255,255,255,0.02) 28%, rgba(255,255,255,0.06) 50%, rgba(255,255,255,0.02) 72%);
  background-size: 220% 100%;
  animation: milShimmer 1.5s var(--ease) infinite;
}
#milDash:empty { min-height: 118px; }
#milFeatured:empty { min-height: 300px; }
#milInsights:empty { min-height: 108px; }
.mil-row-scroll:empty { min-height: 240px; }
@keyframes milShimmer {
  from { background-position: 220% 0; }
  to { background-position: -120% 0; }
}
@media (prefers-reduced-motion: reduce) {
  #milDash:empty,
  #milFeatured:empty,
  #milInsights:empty,
  .mil-row-scroll:empty { animation: none; }
}

/* 3 · ANCHOR OFFSET -------------------------------------------
   "View full library →" and the generated-analyses links jump to
   in-page anchors; give the targets a scroll offset so their
   headings clear the fixed site nav instead of hiding under it. */
.page-intelligence #miAllSetsSection,
.page-intelligence #aiMiResultsSection { scroll-margin-top: 88px; }

/* 4 · RHYTHM + HIERARCHY --------------------------------------
   Tighten the vertical rhythm around the intro band and give the
   "How the Market Score works" note a little more air so the page
   closes cleanly rather than butting against the last card row. */
.page-intelligence .mi-disclaimer-top { margin-bottom: 30px; }
.page-intelligence .news-section-heading + .mi-zone-sub { margin-top: -10px; }
/* Reflow the preview disclaimer as a clean paragraph with an inline icon.
   (mi-enhance.css sets display:flex, which turns the icon, text and <b> into
   separate flex items that split into awkward columns.) Scoped to the MI
   landing page so the set-analysis .mi-disclaimer is untouched. */
.page-intelligence .mi-disclaimer { margin-top: 26px; display: block; }
.page-intelligence .mi-disclaimer svg { display: inline; vertical-align: -2px; margin-right: 6px; }

/* 5 · KEYBOARD FOCUS ------------------------------------------
   Clear, on-brand focus rings so the scrollable rows and the
   view/library controls stay legible under keyboard navigation. */
.page-intelligence .mil-row-scroll:focus-visible {
  outline: 2px solid var(--mi-emerald-2);
  outline-offset: 3px;
  border-radius: var(--radius-m);
}
.page-intelligence .mi-view-toggle button:focus-visible,
.page-intelligence .mil-head .more:focus-visible {
  outline: 2px solid var(--mi-emerald-2);
  outline-offset: 2px;
  border-radius: 8px;
}

/* 6 · REDUCED MOTION — also neutralize hover lifts/transitions, not
   just the reveal + decorative animations, so nothing shifts for
   users who ask for calm. */
@media (prefers-reduced-motion: reduce) {
  .mil-tile,
  .mil-insight { transition: none; }
  .mil-tile:hover,
  .mil-insight:hover { transform: none; }
}

/* ============================================================
   CARD SYSTEM ALIGNMENT
   Bring the dashboard stat tiles and AI-insight cards up to the
   canonical BrickCapital gradient-glass card (the marketplace
   listing + hero grid are the reference). The mover cards and the
   featured spotlight are already canonical and left untouched.
   Presentation only — every figure still comes from the score engine.
============================================================ */
.mil-tile {
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.014)) padding-box,
    linear-gradient(150deg, rgba(255,255,255,0.22), rgba(255,255,255,0.03) 48%, rgba(16,185,129,0.14)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 18px 40px rgba(0,0,0,0.34), 0 3px 10px rgba(0,0,0,0.26);
  transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out), background .45s var(--ease);
}
.mil-tile:hover {
  transform: translateY(-5px); border-color: transparent;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.072), rgba(255,255,255,0.02)) padding-box,
    linear-gradient(150deg, rgba(16,185,129,0.5), rgba(255,255,255,0.06) 52%, rgba(16,185,129,0.28)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.09), 0 30px 60px rgba(0,0,0,0.46), 0 8px 20px rgba(0,0,0,0.3), 0 0 40px rgba(16,185,129,0.13);
}
/* the icon chip picks up the same soft top-light + gold ambient */
.mil-tile .ico { box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 0 16px rgba(16,185,129,0.1); }

.mil-insight {
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.012)) padding-box,
    linear-gradient(150deg, rgba(255,255,255,0.2), rgba(255,255,255,0.03) 50%, rgba(16,185,129,0.12)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 14px 32px rgba(0,0,0,0.3), 0 3px 9px rgba(0,0,0,0.24);
  transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out), background .45s var(--ease);
}
.mil-insight:hover {
  transform: translateY(-5px); border-color: transparent;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.066), rgba(255,255,255,0.018)) padding-box,
    linear-gradient(150deg, rgba(16,185,129,0.46), rgba(255,255,255,0.05) 52%, rgba(16,185,129,0.24)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 26px 54px rgba(0,0,0,0.44), 0 0 38px rgba(16,185,129,0.12);
}
.mil-insight-ico { box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 0 14px rgba(16,185,129,0.1); }
.mil-insight-title { color: #f4f2ee; }

@media (prefers-reduced-motion: reduce) {
  .mil-tile, .mil-insight { transition: none; }
  .mil-tile:hover, .mil-insight:hover { transform: none; }
}

/* ============================================================
   EMERALD REDESIGN — ground-up card identity for Market Intelligence.
   Scoped to .page-intelligence so the Marketplace benchmark and the
   shared components stay untouched everywhere else. Presentation only;
   every figure still comes from the real score engine.
   Graphite base + cool-green tint, emerald accent, mint on positives,
   deep-green depth, premium capsule badges, cinematic image fades,
   and a soft emerald ambient glow on hover.
============================================================ */

/* --- richer, layered hero ambient (emerald + deep green) --- */
.page-intelligence .mil-hero {
  background:
    radial-gradient(680px 380px at 16% 4%, rgba(16,185,129,0.14), transparent 60%),
    radial-gradient(720px 480px at 94% 26%, rgba(12,59,44,0.55), transparent 64%),
    radial-gradient(420px 300px at 78% 84%, rgba(52,211,153,0.08), transparent 66%),
    linear-gradient(165deg, #171c1a 0%, #0f1315 58%, #141a18 100%),
    var(--mi-graphite-3);
  border-color: var(--mi-line);
}
.page-intelligence .mil-hero-glow { background: radial-gradient(circle, rgba(16,185,129,0.18), transparent 68%); }

/* --- Market Overview dashboard tiles: graphite glass, emerald edge --- */
.page-intelligence .mil-tile {
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(24,31,28,0.9), rgba(16,21,22,0.86)) padding-box,
    linear-gradient(150deg, rgba(52,211,153,0.34), rgba(255,255,255,0.04) 48%, rgba(16,185,129,0.14)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.07), 0 18px 40px rgba(0,0,0,0.4), 0 3px 10px rgba(0,0,0,0.28);
}
.page-intelligence .mil-tile:hover {
  transform: translateY(-6px);
  background:
    linear-gradient(180deg, rgba(28,37,33,0.94), rgba(18,24,25,0.9)) padding-box,
    linear-gradient(150deg, rgba(52,211,153,0.62), rgba(255,255,255,0.06) 52%, rgba(16,185,129,0.3)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 30px 62px rgba(0,0,0,0.5), 0 0 44px var(--mi-glow);
}
.page-intelligence .mil-tile::before { background: linear-gradient(90deg, transparent, rgba(110,231,183,0.5), transparent); }
.page-intelligence .mil-tile .ico {
  color: var(--mi-emerald-2);
  background: linear-gradient(160deg, rgba(16,185,129,0.2), rgba(16,185,129,0.06));
  border-color: rgba(52,211,153,0.28);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 0 18px rgba(16,185,129,0.16);
}
.page-intelligence .mil-tile.accent-green .v,
.page-intelligence .mil-tile .d.up { color: var(--mi-pos); }
.page-intelligence .mil-tile .d.down { color: var(--mi-neg); }

/* --- AI insight cards --- */
.page-intelligence .mil-insight {
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(23,30,27,0.9), rgba(15,20,21,0.84)) padding-box,
    linear-gradient(150deg, rgba(52,211,153,0.3), rgba(255,255,255,0.035) 50%, rgba(16,185,129,0.12)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 14px 32px rgba(0,0,0,0.36), 0 3px 9px rgba(0,0,0,0.26);
}
.page-intelligence .mil-insight:hover {
  transform: translateY(-6px);
  background:
    linear-gradient(180deg, rgba(27,35,31,0.94), rgba(17,23,24,0.88)) padding-box,
    linear-gradient(150deg, rgba(52,211,153,0.56), rgba(255,255,255,0.05) 52%, rgba(16,185,129,0.26)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.09), 0 26px 56px rgba(0,0,0,0.48), 0 0 40px var(--mi-glow);
}
.page-intelligence .mil-insight-ico {
  color: var(--mi-emerald-2);
  background: linear-gradient(160deg, rgba(16,185,129,0.2), rgba(16,185,129,0.05));
  border-color: rgba(52,211,153,0.26);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 0 16px rgba(16,185,129,0.14);
}

/* --- Featured spotlight: emerald glass frame + cinematic image --- */
.page-intelligence .mil-featured {
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, rgba(20,26,24,0.4), rgba(13,17,18,0.4)) padding-box,
    linear-gradient(150deg, rgba(52,211,153,0.4), rgba(255,255,255,0.05) 46%, rgba(16,185,129,0.16)) border-box,
    var(--mi-graphite);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 26px 60px rgba(0,0,0,0.5);
  transition: box-shadow .5s var(--ease-out);
}
.page-intelligence .mil-featured:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 34px 74px rgba(0,0,0,0.56), 0 0 54px var(--mi-glow); }
/* fade the blurred backdrop into a green-graphite base, not neutral black */
.page-intelligence .mil-featured::after {
  background:
    linear-gradient(90deg, rgba(15,19,21,0.95) 34%, rgba(15,19,21,0.55) 62%, rgba(15,19,21,0.22)),
    linear-gradient(0deg, rgba(12,17,16,0.85), transparent 55%),
    radial-gradient(120% 90% at 80% 12%, rgba(16,185,129,0.1), transparent 60%);
}
.page-intelligence .mil-feat-media .thumb { transition: transform 1s var(--ease-out); border-color: rgba(52,211,153,0.2); }
.page-intelligence .mil-featured:hover .mil-feat-media .thumb { transform: scale(1.07); }
.page-intelligence .mil-feat-media::after {
  content: ""; position: absolute; inset: 0; border-radius: 16px; pointer-events: none;
  background: linear-gradient(180deg, rgba(52,211,153,0.08) 0%, transparent 26%, transparent 62%, rgba(12,17,16,0.5) 100%);
}
.page-intelligence .mil-feat-metric .mv.up { color: var(--mi-pos); }
.page-intelligence .mil-feat-outlook {
  background: linear-gradient(180deg, rgba(16,185,129,0.18), rgba(16,185,129,0.07));
  border-color: rgba(52,211,153,0.4); color: var(--mi-mint);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 4px 14px rgba(0,0,0,0.3);
}

/* ============================================================
   SHARED MOVER CARD — re-skinned for the emerald section (scoped).
   Same footprint + data; a ground-up financial-report look.
============================================================ */
.page-intelligence .mi-mover-card {
  border: 1px solid transparent;
  border-radius: 22px;
  background:
    linear-gradient(180deg, rgba(24,30,28,0.94), rgba(15,20,21,0.94)) padding-box,
    linear-gradient(150deg, rgba(52,211,153,0.32), rgba(255,255,255,0.04) 46%, rgba(16,185,129,0.13)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 18px 40px rgba(0,0,0,0.42), 0 3px 10px rgba(0,0,0,0.3);
  transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out), background .45s var(--ease-out);
}
.page-intelligence .mi-mover-card::before {
  background: linear-gradient(90deg, var(--mi-emerald-2), var(--mi-emerald));
  box-shadow: 0 0 14px rgba(16,185,129,0.55);
}
.page-intelligence .mi-mover-card:hover {
  transform: translateY(-6px);
  border-color: transparent;
  background:
    linear-gradient(180deg, rgba(28,36,33,0.96), rgba(17,23,24,0.94)) padding-box,
    linear-gradient(150deg, rgba(52,211,153,0.62), rgba(255,255,255,0.06) 50%, rgba(16,185,129,0.3)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.09), 0 32px 66px rgba(0,0,0,0.52), 0 0 46px var(--mi-glow);
}
.page-intelligence .mi-mover-card:hover .mi-mover-body h4 { color: var(--mi-emerald-2); }
.page-intelligence .mi-card-cta { color: var(--mi-emerald-2); }

/* cinematic image: dissolve the thumb bottom into the card base + soft top-light */
.page-intelligence .mi-mover-top::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(52,211,153,0.07) 0%, transparent 24%),
    linear-gradient(180deg, transparent 52%, rgba(18,23,22,0.5) 80%, rgba(24,30,28,0.96) 100%);
}
.page-intelligence .mi-mover-top .mi-score-badge,
.page-intelligence .mi-mover-top .watch-btn { z-index: 2; }

/* --- premium capsule badges (rarity / demand) with an emerald marker --- */
.page-intelligence .mi-pill {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(180deg, rgba(52,211,153,0.13), rgba(16,185,129,0.05));
  border: 1px solid rgba(52,211,153,0.24);
  color: var(--mi-mint); font-weight: 650;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 2px 6px rgba(0,0,0,0.24);
}
.page-intelligence .mi-pill::before {
  content: ""; width: 5px; height: 5px; border-radius: 1px; transform: rotate(45deg);
  background: var(--mi-emerald-2); box-shadow: 0 0 6px rgba(52,211,153,0.75); flex-shrink: 0;
}

/* --- Market Score capsule: emerald gradient with inner light --- */
.page-intelligence .mi-score-badge.mi-score-premium,
.page-intelligence .mi-score-badge.mi-score-strong,
.page-intelligence .mi-score-badge.mi-score-watch,
.page-intelligence .mi-score-badge.mi-score-cooling,
.page-intelligence .mi-score-badge.mi-score-unrated {
  background: linear-gradient(135deg, var(--mi-emerald-2), var(--mi-emerald));
  color: #04150f;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.28), 0 4px 14px rgba(16,185,129,0.3);
}
.page-intelligence .mi-ticker-badge { box-shadow: inset 0 1px 0 rgba(255,255,255,0.22); }

/* --- positive/negative stat hues across the section --- */
.page-intelligence .mi-growth-up { color: var(--mi-pos); }
.page-intelligence .mi-growth-down { color: var(--mi-neg); }
.page-intelligence .mi-price-value { color: #f2f5f3; }

/* --- ticker: calm emerald trading strip --- */
.page-intelligence .mi-ticker {
  background: linear-gradient(180deg, #171c1a, #0f1315);
  border-color: var(--mi-line);
}
.page-intelligence .mi-ticker::before { background: linear-gradient(90deg, #0f1315, transparent); }
.page-intelligence .mi-ticker::after { background: linear-gradient(270deg, #0f1315, transparent); }

/* --- skeleton loaders retinted to emerald --- */
.page-intelligence #milDash:empty,
.page-intelligence #milFeatured:empty,
.page-intelligence #milInsights:empty,
.page-intelligence .mil-row-scroll:empty {
  border-color: var(--mi-line);
  background:
    linear-gradient(100deg, rgba(16,185,129,0.03) 28%, rgba(52,211,153,0.09) 50%, rgba(16,185,129,0.03) 72%);
  background-size: 220% 100%;
}

/* --- focus rings + section link hover in emerald --- */
.page-intelligence .mil-row-scroll:focus-visible,
.page-intelligence .mi-view-toggle button:focus-visible,
.page-intelligence .mil-head .more:focus-visible { outline-color: var(--mi-emerald-2); }
.page-intelligence .mil-head .more:hover { color: var(--mi-emerald-2); }

/* --- reduced motion: neutralize the extra lifts introduced above --- */
@media (prefers-reduced-motion: reduce) {
  .page-intelligence .mi-mover-card,
  .page-intelligence .mil-featured,
  .page-intelligence .mil-feat-media .thumb { transition: none; }
  .page-intelligence .mi-mover-card:hover,
  .page-intelligence .mil-tile:hover,
  .page-intelligence .mil-insight:hover { transform: none; }
  .page-intelligence .mil-featured:hover .mil-feat-media .thumb { transform: none; }
}

/* ============================================================
   RESTRAINT PASS — Marketplace-level calm (final override).
   The blocks above (the "identity" pass) leaned loud: bright
   emerald gradient borders on every tile, green-tinted card
   surfaces, stacked heavy shadows, gradient-FILLED score/rarity
   pills, glowing top bars and hover halos. This block subtracts
   that noise to match the Marketplace benchmark's confident
   restraint: near-neutral graphite glass, a ~1px hairline with
   only a whisper of emerald, ONE soft inset top-light + ONE soft
   layered shadow, a gentle lift with a FAINT emerald ambient on
   hover. Emerald survives only as small highlights (eyebrow dot,
   quiet pill edge/dot, positive-stat tint, hovered title/link
   tint). Presentation only — every figure still comes from the
   real score engine; IDs, classes and data flows are untouched.
============================================================ */

/* 1 · HERO — dial the emerald radials + drifting glow back to a
   quiet ambient so the header no longer glows over the page. */
.page-intelligence .mil-hero {
  background:
    radial-gradient(680px 380px at 16% 4%, rgba(16,185,129,0.07), transparent 62%),
    radial-gradient(720px 480px at 94% 26%, rgba(12,59,44,0.28), transparent 66%),
    linear-gradient(165deg, #171c1a 0%, #0f1315 58%, #141a18 100%),
    var(--mi-graphite-3);
  border-color: var(--glass-border);
}
.page-intelligence .mil-hero-glow {
  background: radial-gradient(circle, rgba(16,185,129,0.09), transparent 70%);
}
.page-intelligence .mil-hero-grid { opacity: 0.32; }
.page-intelligence .mil-hero-lines { opacity: 0.32; }

/* 2 · CANONICAL CARD SURFACE — dashboard tiles, insight cards and
   the shared mover cards share ONE calm graphite-glass recipe:
   near-neutral fill, a hairline border that is mostly neutral with
   just a whisper of emerald, a single soft top-light + one layered
   shadow. No bright accent border-box, no stacked shadows. */
.page-intelligence .mil-tile,
.page-intelligence .mil-insight,
.page-intelligence .mi-mover-card {
  border: 1px solid transparent;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.013)) padding-box,
    linear-gradient(150deg, rgba(255,255,255,0.20), rgba(255,255,255,0.03) 50%, rgba(16,185,129,0.13)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 18px 40px rgba(0,0,0,0.34), 0 3px 10px rgba(0,0,0,0.26);
  transition: transform .4s var(--ease-out), box-shadow .4s var(--ease-out);
}
/* hover: gentle lift + soft shadow deepen + a FAINT emerald ambient.
   Border/fill stay constant — no bright emerald swap. */
.page-intelligence .mil-tile:hover,
.page-intelligence .mil-insight:hover,
.page-intelligence .mi-mover-card:hover {
  transform: translateY(-6px);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.013)) padding-box,
    linear-gradient(150deg, rgba(255,255,255,0.24), rgba(255,255,255,0.04) 50%, rgba(16,185,129,0.18)) border-box;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 30px 60px rgba(0,0,0,0.46), 0 0 40px rgba(16,185,129,0.10);
}
/* tile top-light back to neutral (was a mint gradient) */
.page-intelligence .mil-tile::before {
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
}
/* icon chips: quiet emerald, no glow */
.page-intelligence .mil-tile .ico,
.page-intelligence .mil-insight-ico {
  color: var(--mi-emerald-2);
  background: rgba(16,185,129,0.10);
  border: 1px solid rgba(52,211,153,0.20);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}

/* 3 · MOVER CARD — demote the glowing full-width accent bar to a
   thin faded emerald hairline; keep the quiet title/CTA tint. */
.page-intelligence .mi-mover-card::before {
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(52,211,153,0.45), transparent);
  box-shadow: none;
}
/* image bottom dissolve stays; drop the emerald top wash */
.page-intelligence .mi-mover-top::after {
  background: linear-gradient(180deg, transparent 52%, rgba(18,23,22,0.5) 80%, rgba(24,30,28,0.96) 100%);
}

/* 4 · SCORE CAPSULE — from a filled emerald gradient to a quiet
   dark-glass pill with an emerald edge + emerald numerals. Legible
   over the image, calm across a grid. This is the card's ONE badge. */
.page-intelligence .mi-score-badge.mi-score-premium,
.page-intelligence .mi-score-badge.mi-score-strong,
.page-intelligence .mi-score-badge.mi-score-watch,
.page-intelligence .mi-score-badge.mi-score-cooling,
.page-intelligence .mi-score-badge.mi-score-unrated {
  background: rgba(13,17,16,0.72);
  color: var(--mi-emerald-2);
  border: 1px solid rgba(52,211,153,0.30);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 2px 8px rgba(0,0,0,0.3);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.page-intelligence .mi-ticker-badge { box-shadow: none; }

/* 5 · RARITY / DEMAND PILLS — quiet glass, small emerald dot only
   (was a gradient fill with a glowing diamond marker). */
.page-intelligence .mi-pill {
  background: rgba(255,255,255,0.04);
  border: 1px solid var(--line-soft);
  color: var(--ink-soft);
  font-weight: 600;
  box-shadow: none;
}
.page-intelligence .mi-pill::before {
  width: 5px; height: 5px; border-radius: 50%; transform: none;
  background: var(--mi-emerald-2);
  box-shadow: none;
}

/* 6 · FEATURED SPOTLIGHT — neutral hairline frame + one soft
   shadow; faint emerald ambient on hover only. Drop the emerald
   gradient border-box and the extra glow. */
.page-intelligence .mil-featured {
  border: 1px solid var(--glass-border);
  background: var(--mi-graphite);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 22px 50px rgba(0,0,0,0.44);
}
.page-intelligence .mil-featured:hover {
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.07), 0 28px 62px rgba(0,0,0,0.5), 0 0 44px rgba(16,185,129,0.09);
}
.page-intelligence .mil-featured::after {
  background:
    linear-gradient(90deg, rgba(15,19,21,0.95) 34%, rgba(15,19,21,0.55) 62%, rgba(15,19,21,0.22)),
    linear-gradient(0deg, rgba(12,17,16,0.82), transparent 55%);
}
.page-intelligence .mil-feat-media .thumb { border-color: rgba(255,255,255,0.10); }
.page-intelligence .mil-feat-outlook {
  background: rgba(16,185,129,0.10);
  border: 1px solid rgba(52,211,153,0.30);
  color: var(--mi-mint);
  box-shadow: none;
}

/* 7 · TICKER — neutralize the tinted border to a hairline. */
.page-intelligence .mi-ticker { border-color: var(--glass-border); }

/* 8 · reduced motion — cover the calm hover lifts declared here. */
@media (prefers-reduced-motion: reduce) {
  .page-intelligence .mil-tile,
  .page-intelligence .mil-insight,
  .page-intelligence .mi-mover-card { transition: none; }
  .page-intelligence .mil-tile:hover,
  .page-intelligence .mil-insight:hover,
  .page-intelligence .mi-mover-card:hover { transform: none; }
}

/* ============================================================
   PROFILE MATERIAL — final calibration (wins by source order).
   The RESTRAINT PASS above already returned the loud emerald
   surfaces/borders/badges to neutral graphite profile-glass with
   a soft inset top-light and a single soft ambient shadow. This
   closing block finishes the match to THE PROFILE MATERIAL:
   · one consistent content-card radius (var(--radius-m), 18px);
   · a gentle profile-calm hover lift (was -5/-6px) with only a
     FAINT emerald ambient — no big colored glow, no accent border
     swap (the surface + hairline stay constant on hover);
   · quieter numeric weight so stat -> label -> supporting text
     transition smoothly as ONE calm object.
   Emerald survives only as small highlights (eyebrow dot, icon
   chips, positive-stat tint, score edge, factor/chart fills).
   Presentation only; IDs, classes, data flows and layout untouched.
============================================================ */
.page-intelligence .mil-tile,
.page-intelligence .mil-insight,
.page-intelligence .mi-mover-card { border-radius: var(--radius-m); }

.page-intelligence .mil-tile:hover,
.page-intelligence .mil-insight:hover,
.page-intelligence .mi-mover-card:hover {
  transform: translateY(-3px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 22px 46px rgba(0,0,0,0.40),
    0 0 30px rgba(16,185,129,0.08);
}

/* quiet the loudest dashboard numeral toward the profile hierarchy
   (title near-white draws the eye; the value supports, not shouts) */
.page-intelligence .mil-tile .v { font-weight: 800; }

@media (prefers-reduced-motion: reduce) {
  .page-intelligence .mil-tile:hover,
  .page-intelligence .mil-insight:hover,
  .page-intelligence .mi-mover-card:hover { transform: none; }
}

/* ============================================================
   PREVIEW "SHOW CARDS" (Trending / Hidden Gems / Recently Added rows)
   Simplified to an image-led card — no rarity/demand pills or "why"
   sentences. The photo is enlarged so it extends further down the card.
============================================================ */
.page-intelligence .mil-row-scroll .mi-mover-top .thumb { aspect-ratio: auto; height: 360px; }

/* ============================================================
   COMPACT PREVIEW ROWS — Trending / Hidden Gems / Recently Added
   Shrink the show cards ~20% so the rows take up less scroll room.
============================================================ */
.page-intelligence .mil-row-scroll { grid-auto-columns: 248px; gap: 14px; }
.page-intelligence .mil-row-scroll .mi-mover-top .thumb { height: 286px; }
.page-intelligence .mil-row-scroll .mi-mover-body { padding: 13px 15px 15px; }
.page-intelligence .mil-row-scroll .mi-mover-body h4 { font-size: 15px; }
.page-intelligence .mil-row-scroll .mi-card-theme { font-size: 10.5px; margin-bottom: 5px; }
.page-intelligence .mil-row-scroll .mi-price-pair { gap: 14px; margin: 8px 0; }
.page-intelligence .mil-row-scroll .mi-price-value { font-size: 15px; }
.page-intelligence .mil-row-scroll .mi-price-label { font-size: 10px; }
.page-intelligence .mil-row-scroll .mi-growth-row { gap: 6px; margin: 9px 0; }
.page-intelligence .mil-row-scroll .mi-growth-row small { font-size: 9.5px; }
.page-intelligence .mil-row-scroll .mi-card-cta { font-size: 11.5px; margin-top: 2px; }
@media (max-width: 560px) { .page-intelligence .mil-row-scroll { grid-auto-columns: 82%; } }

/* Mover card: price sparkline replacing the 30d/90d/6mo/1yr grid */
.page-intelligence .mil-row-scroll .mi-mover-spark { margin: 12px 0 6px; height: 48px; }
.page-intelligence .mil-row-scroll .mi-mover-spark .mi-sparkline { width: 100%; height: 100%; }
.page-intelligence .mil-row-scroll .mi-mover-spark.mi-growth-up { color: #34d399; }
.page-intelligence .mil-row-scroll .mi-mover-spark.mi-growth-down { color: #f0687e; }

/* ============================================================
   HERO AI SEARCH — make the "Analyze any LEGO set" feature POP so
   users clearly see it's a headline capability (emerald-lit card,
   badge, larger heading, prominent input + gentle glow pulse).
============================================================ */
.mil-search { max-width: 740px; margin-top: 34px; }
.mil-search-card {
  position: relative; overflow: hidden;
  padding: 26px 26px 24px; border-radius: 22px;
  border: 1px solid transparent;
  background:
    linear-gradient(165deg, rgba(16,185,129,0.14), rgba(255,255,255,0.03) 60%) padding-box,
    linear-gradient(150deg, rgba(52,211,153,0.7), rgba(255,255,255,0.08) 50%, rgba(16,185,129,0.4)) border-box;
  box-shadow: 0 24px 60px -20px rgba(0,0,0,0.6), 0 0 46px -6px rgba(16,185,129,0.35), inset 0 1px 0 rgba(255,255,255,0.10);
  animation: milSearchPulse 3.4s ease-in-out infinite;
}
@keyframes milSearchPulse {
  0%,100% { box-shadow: 0 24px 60px -20px rgba(0,0,0,0.6), 0 0 42px -8px rgba(16,185,129,0.30), inset 0 1px 0 rgba(255,255,255,0.10); }
  50%     { box-shadow: 0 24px 60px -20px rgba(0,0,0,0.6), 0 0 64px -6px rgba(16,185,129,0.55), inset 0 1px 0 rgba(255,255,255,0.10); }
}
/* soft emerald aura bleeding out behind the card */
.mil-search::after {
  content: ""; position: absolute; inset: -30px -20px; z-index: -1; pointer-events: none;
  background: radial-gradient(60% 80% at 30% 30%, rgba(16,185,129,0.22), transparent 70%);
  filter: blur(24px);
}
.mil-search-badge {
  display: inline-flex; align-items: center; gap: 7px; margin-bottom: 12px;
  padding: 6px 13px; border-radius: 999px;
  font-family: var(--font-mono, monospace); font-size: 11px; font-weight: 800;
  letter-spacing: 0.1em; text-transform: uppercase; color: #04150f;
  background: linear-gradient(135deg, #6ee7b7, #34d399 55%, #10b981);
  box-shadow: 0 4px 16px -4px rgba(16,185,129,0.6), inset 0 1px 0 rgba(255,255,255,0.4);
}
.mil-search-badge .spark { font-size: 13px; color: #04150f; }
.mil-search-label {
  display: block; font-size: 24px; font-weight: 840; letter-spacing: -0.03em;
  line-height: 1.12; color: #fff; margin-bottom: 6px;
}
.mil-search-label em {
  font-style: normal;
  background: linear-gradient(118deg, #6ee7b7, #34d399 50%, #10b981);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: #34d399;
}
.mil-search-hint { font-size: 14px; color: var(--ink-soft); margin: 0 0 16px; line-height: 1.55; max-width: 620px; }
.mil-search .mi-ai-generate-form { gap: 12px; }
.mil-search .mi-ai-generate-form input { padding: 16px 18px; font-size: 15.5px; border-radius: 13px; }
.mil-search .mi-ai-generate-form input:focus { border-color: rgba(52,211,153,0.7); box-shadow: 0 0 0 3px rgba(16,185,129,0.22); }
.mil-search .mi-ai-generate-form .btn {
  padding: 16px 22px; font-size: 15px; font-weight: 750; border-radius: 13px;
  background: linear-gradient(135deg, #34d399, #10b981); color: #04150f; border: 0;
  box-shadow: 0 10px 24px -8px rgba(16,185,129,0.55), inset 0 1px 0 rgba(255,255,255,0.3);
}
.mil-search .mi-ai-generate-form .btn:hover { filter: brightness(1.06); }
@media (prefers-reduced-motion: reduce) { .mil-search-card { animation: none; } }
@media (max-width: 560px) { .mil-search-label { font-size: 21px; } .mil-search-card { padding: 20px 18px; } }

/* ============================================================
   MOBILE COMPRESSION PASS (≤560px, mobile only) — appended last
   so it wins on source order. Tightens the AI-generate module and
   the band directly beneath the "Generate analysis" button so
   results sit higher and the page scans faster. Desktop untouched.
============================================================ */
@media (max-width: 560px) {
  .mil-search { margin-top: 20px; }
  .mil-search-card { padding: 16px 15px 15px; }
  .mil-search-badge { margin-bottom: 9px; padding: 5px 11px; }
  .mil-search-label { font-size: 20px; margin-bottom: 4px; }
  .mil-search-hint { font-size: 13px; margin: 0 0 12px; line-height: 1.5; }
  .mil-search .mi-ai-generate-form { gap: 9px; }
  .mil-search .mi-ai-generate-form input { padding: 13px 15px; font-size: 15px; }
  .mil-search .mi-ai-generate-form .btn { padding: 13px 18px; }
  .mil-search .mi-ai-generate-status { margin-top: 6px; }
  /* The preview disclaimer directly under the button reads as a flex row,
     which collapses its icon + text + <b> into cramped columns on mobile.
     Reflow it as a clean, compact paragraph with an inline icon. Higher
     specificity so it wins over mi-enhance.css's base .mi-disclaimer. */
  .page-intelligence .mi-disclaimer {
    display: block;
    margin-top: 12px;
    padding-top: 11px;
    font-size: 11.5px;
    line-height: 1.5;
  }
  .page-intelligence .mi-disclaimer svg {
    display: inline; vertical-align: -2px; margin-right: 5px;
  }
  .page-intelligence .mi-usage-hint { margin-top: 8px; }
  /* the live ticker + first content rows pull up under the button */
  .page-intelligence .mi-ticker { margin: 14px 0 18px; }
  .page-intelligence .mil-section { margin-bottom: 26px; }
  .page-intelligence .mil-head { margin-bottom: 12px; }
  .page-intelligence .mil-head .sub { margin-top: 1px; }
  .page-intelligence .mi-zone-sub { margin-top: 4px; }
}
