/* DNEG AI Roadmap: css/views/platform.css
   The By platform lens (.lens-platform): the platform header, module cards with compact repo cards, the departments-reached chips
   and the "In depth" page. Shared kit styles (lk-*) live in department.css, the brief and the folded blocks in site.css. Tokens only. */

.lens-platform .lk-tiles { margin-top: 1.4rem; }
.lens-platform .lk-desc { max-width: 78ch; margin-top: .9rem; color: var(--muted); font-size: .95rem; }
.lens-platform .lk-mix { margin-top: .9rem; padding: 10px 16px 12px; }
.lens-platform .lk-mix .bars.compact { margin-top: 0; padding-top: 0; }

/* the executive pass: tidy spacing around the shared brief and folded blocks */
.lens-platform .lk-mbody > .lk-tiles { margin-top: .6rem; }        /* the tiles sit under their note inside the open block */
.lens-platform .lk-mbody > .lk-mix { margin-top: 0; }              /* the maturity mix opens the Modules block */
.lens-platform .lk-mbody > .lk-mix + .lk-sec { margin-top: 1.6rem; }

/* modules */
.lens-platform .lk-mods { grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); }
.lens-platform .lk-mod { display: flex; flex-direction: column; gap: .5rem; }
.lens-platform .lk-mod .top h3 { font-size: 1.08rem; }
.lens-platform .lk-modsum { font-size: .88rem; }
.lens-platform .lk-modcaps { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 6px; }
.lens-platform .lk-modrepos { display: grid; gap: 8px; margin-top: .3rem; }
.lens-platform .lk-none { color: var(--muted); font-size: .85rem; }
.lens-platform .lk-mod.quiet { border-style: dashed; }
.lens-platform .lk-mod.quiet h3, .lens-platform .lk-mod.quiet .lk-modsum { opacity: .75; }

/* the repo cards inside a module card: same component, tighter */
.lens-platform .repo-card.compact { gap: .25rem; padding: 10px 12px; background: color-mix(in srgb, var(--panel2) 55%, transparent); }
.lens-platform .repo-card.compact h3 { margin-bottom: 0; font-size: .96rem; }
.lens-platform .repo-card.compact p { font-size: .84rem; }
.lens-platform .repo-card.compact .meta { display: none; }
.lens-platform .repo-card.compact .foot { font-size: .75rem; }

/* departments reached */
.lens-platform .lk-reach { display: grid; gap: 12px; }
.lens-platform .lk-reachrow { display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: 6px 16px; align-items: baseline; }
.lens-platform .lk-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.lens-platform .lk-chip { gap: .55em; padding: 2px 10px; font-size: .82rem; }
.lens-platform .lk-chip b { color: var(--accent2); font-family: var(--mono); font-size: .85em; font-weight: 500; }
.lens-platform .lk-chip.planned { border-style: dashed; }

/* in depth */
.lens-platform .lk-prov { max-width: 78ch; margin-bottom: 1.2rem; color: var(--muted); font-size: .85rem; }
.lens-platform .lk-md { max-width: 78ch; }
.lens-platform .lk-md > :first-child { margin-top: 0; }
.lens-platform .lk-md h2 { margin: 1.9rem 0 .5rem; font-size: 1.25rem; }
.lens-platform .lk-md h3 { margin: 1.5rem 0 .4rem; font-size: 1.05rem; }
.lens-platform .lk-md h4 { margin: 1.2rem 0 .3rem; font-size: .95rem; color: var(--muted); }
.lens-platform .lk-md p, .lens-platform .lk-md li { color: var(--fg); }
.lens-platform .lk-md p { margin: 0 0 .85em; }
.lens-platform .lk-md ul, .lens-platform .lk-md ol { margin: 0 0 .9em; padding-left: 1.3rem; }
.lens-platform .lk-md li { margin-bottom: .25em; }
.lens-platform .lk-md code { padding: 1px 5px; border-radius: 4px; background: var(--panel2); }
.lens-platform .lk-md pre { overflow-x: auto; margin: 0 0 1em; padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.lens-platform .lk-md pre code { padding: 0; background: none; }
.lens-platform .lk-md blockquote { margin: 1rem 0; padding: .1rem 1rem; border-left: 3px solid var(--line); color: var(--muted); }
.lens-platform .lk-md hr { margin: 1.5rem 0; border: 0; border-top: 1px solid var(--line); }
.lens-platform .lk-md img { max-width: 100%; height: auto; border-radius: 8px; }
.lens-platform .lk-md .md-table { overflow-x: auto; margin: 0 0 1em; }
.lens-platform .lk-md table { border-collapse: collapse; font-size: .9rem; }
.lens-platform .lk-md th, .lens-platform .lk-md td { padding: 6px 12px; border: 1px solid var(--line); text-align: left; }
.lens-platform .lk-md th { background: var(--panel2); }
.lens-platform .lk-sources { margin-top: 1.6rem; max-width: 78ch; }
.lens-platform .lk-sources ul { margin: .4rem 0 0; padding-left: 1.2rem; color: var(--muted); font-size: .85rem; overflow-wrap: anywhere; }

@media (max-width: 700px) {
  .lens-platform .lk-reachrow { grid-template-columns: minmax(0, 1fr); }
  .lens-platform .lk-mods { grid-template-columns: minmax(0, 1fr); }
}
@media print {
  .lens-platform .lk-mod, .lens-platform .repo-card { break-inside: avoid; }
}
