/* LUMINDEX STUDIO v2 — editorial media, diagrams and progressive render texture. */
.render-background{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
:root[data-effects=off] .render-background{display:none}
.pipeline .step-number{display:inline-grid;place-items:center;flex:0 0 auto;line-height:1;font-family:var(--sans);font-weight:500;font-variant-numeric:tabular-nums;vertical-align:middle;padding:0;letter-spacing:0}
.pipeline a{align-items:center}
.article-body{font-size:17px;line-height:1.78}
.article-body p{margin:0 0 1.25em;max-width:76ch}
.article-body section{margin-bottom:44px}
.article-body h2{margin:0 0 22px;letter-spacing:-.025em}
.article-body h3{margin-top:30px}
.article-body li{margin-bottom:12px}
.article-body li::marker{color:var(--accent);font-weight:600}
.article-body ol:not([class]){list-style:none;counter-reset:step;padding:0;margin:20px 0 28px}
.article-body ol:not([class])>li{counter-increment:step;position:relative;padding:4px 0 15px 46px;margin:0;min-height:43px}
.article-body ol:not([class])>li::before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:4px;font:500 13px/28px var(--sans);color:var(--accent);border:1px solid var(--line);width:30px;height:30px;text-align:center;border-radius:50%;box-sizing:border-box}
.article-body ol:not([class])>li:not(:last-child)::after{content:"";position:absolute;left:15px;top:39px;bottom:6px;border-left:1px solid var(--line)}
.article-body code{font-size:.84em;background:var(--surface)}
.article-body th,.article-body td{padding:14px 16px}
.article-body table{font-size:14px;line-height:1.65}
.article-body th{font-size:12px;letter-spacing:.015em;color:var(--accent)}
.article-body tbody tr:nth-child(even){background:color-mix(in srgb,var(--surface) 48%,transparent)}
.article-body tbody td:first-child{font-weight:500}
.callout{border-radius:0 5px 5px 0;padding:18px 22px}
.callout.notice{background:color-mix(in srgb,var(--warm) 5%,transparent);font-size:13px;color:var(--muted)}
.article-cover{overflow:hidden}
.article-cover.visual-cover img{height:auto;max-height:none;aspect-ratio:5/3;object-fit:contain;background:#171c19}
.article-cover.photo-cover img{height:auto;max-height:315px;aspect-ratio:2.55/1}
.catalog-card .thumb{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#171c19}
.catalog-card .thumb>a{display:block}
.catalog-card .thumb img{aspect-ratio:3/2;height:auto!important;border-radius:0;object-fit:cover;transition:transform .45s ease}
.catalog-card:hover .thumb img{transform:scale(1.018)}
.catalog-card h2{margin:16px 0 10px;line-height:1.25}
.catalog-card p{line-height:1.7}
.thumb-topic{position:absolute;left:12px;bottom:10px;background:#141b17e8;border:1px solid #adc7b83b;color:#dbe8dd;padding:3px 7px;border-radius:3px;font-size:10px;line-height:1.3;pointer-events:none;max-width:calc(100% - 24px)}
.catalog-card.is-read .thumb-topic{display:none}
.visual-note{border-top:1px solid var(--line);padding-top:27px}
.visual-note .visual-figure{margin:0}
.visual-note .visual-figure>img{width:100%;height:auto;max-width:720px;display:block;margin:0 auto;border:1px solid var(--line);background:#181b1a}
.figure-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:12px;border-top:1px solid var(--line);padding-top:10px;font-size:11px;color:var(--muted)}
.figure-tools a{font-size:11px}
.figure-tools button{font-size:11px;color:var(--accent);padding:4px 0}
.official-media{border-top:1px solid var(--line);padding-top:27px}
.official-media figure{margin:0 0 32px}
.official-media .official-image-wrap{background:#e6e6e6;border:1px solid var(--line);border-radius:5px;padding:14px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.official-media .official-image-wrap img{display:block;width:auto;height:auto;max-width:100%;max-height:620px;object-fit:contain;border-radius:0}
.official-media figcaption{border-left:2px solid var(--accent);padding-left:13px;font-size:12px;line-height:1.7}
.official-media figcaption strong{display:block;font-size:14px;margin-bottom:4px;color:var(--text)}
.official-media figcaption .source-credit{display:block;margin-top:6px;font-size:11px;color:var(--muted)}
.tech-strip{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;padding:20px 0;border-bottom:1px solid var(--line);margin-bottom:26px}
.tech-strip a,.article-tech a{display:flex;align-items:center;gap:9px;color:var(--muted);font:12px/1.4 var(--sans)}
.tech-strip img{max-width:125px;max-height:30px;width:auto;object-fit:contain}
.article-tech{display:flex;gap:16px;flex-wrap:wrap;align-items:center;margin:18px 0 0}
.article-tech img{width:auto;max-width:94px;height:22px;object-fit:contain}
.article-tech .tech-name{border-left:1px solid var(--line);padding-left:12px;font-size:11px;color:var(--muted)}
.tech-logo-surface{display:inline-flex;padding:7px 10px;background:#fff;border-radius:3px;align-items:center;justify-content:center}
.tech-logo-surface.tech-logo-dark{background:#181b1a;border:1px solid #3a433d}
.media-register{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.media-register figure{border-bottom:1px solid var(--line);padding-bottom:18px;margin:0}
.media-register img{width:auto;height:auto;max-width:100%;max-height:200px;object-fit:contain}
.media-register figcaption{font-size:12px;line-height:1.7;margin-top:12px}
.graph-scroll{overflow:auto;scrollbar-width:thin}
.graph-scroll svg{min-width:0;width:100%;height:auto}
.graph-scroll .graph-svg[data-layout=dag]{min-width:570px}
.graph-controls button{font-size:12px;padding:7px 10px;line-height:1.4}
.graph-detail{border-top:1px solid var(--line);margin-top:14px;padding:14px 0 9px;line-height:1.75}
.graph-scroll:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.graph-scroll-hint{display:none}
@media(max-width:760px){.article-body .graph-scroll-hint{display:block;font-size:11px;line-height:1.55;color:var(--muted);margin:0 0 13px}}
.graph-widget .graph-footer{align-items:center}
.graph-widget .graph-footer button{color:var(--accent)}
.media-error{display:flex;flex-direction:column;gap:8px;padding:20px;border:1px solid var(--line);background:var(--surface);font:14px/1.6 var(--sans);color:var(--muted)}
.media-error a{color:var(--accent);text-decoration:underline}
.image-actions{display:flex;gap:18px;align-items:center}.lightbox .image-actions [data-image-fit]{font-size:12px;border:1px solid var(--line);border-radius:4px;padding:7px 10px;color:var(--accent)}
.lightbox figure{margin:0}
.lightbox figcaption strong{display:block;margin-bottom:7px}.lightbox figcaption a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.lightbox figcaption .source-credit{display:block;margin-top:8px}
@media(min-width:1650px){.article-layout{grid-template-columns:minmax(0,880px) 210px}}
@media(max-width:1040px){.article-body{font-size:16px}.article-tech{margin-top:16px}.official-media .official-image-wrap img{max-height:560px}}
@media(max-width:760px){.article-body{font-size:16px;line-height:1.8}.article-body section{margin-bottom:34px}.article-body h2{margin-bottom:19px}.article-body th,.article-body td{padding:11px 12px}.article-body table{font-size:13px}.article-body ol:not([class])>li{padding-left:41px}.article-cover.visual-cover img{max-height:none;aspect-ratio:5/3}.article-cover.photo-cover img{max-height:none;aspect-ratio:1.65/1}.official-media .official-image-wrap{padding:8px}.official-media .official-image-wrap img{max-height:550px}.visual-note,.official-media{padding-top:22px}.figure-tools{gap:12px;flex-wrap:wrap}.tech-strip{gap:15px}.tech-strip img{max-width:95px;max-height:24px}.tech-strip a{font-size:11px}.media-register{grid-template-columns:1fr}.graph-widget .graph-footer{align-items:flex-start}.graph-controls button{font-size:11px}.callout{padding:16px 17px}.pipeline .step-number{line-height:1}.thumb-topic{font-size:10px}.article-tech img{height:20px}}
@media(prefers-reduced-motion:reduce){.render-background{display:none}.catalog-card .thumb img{transition:none}}
@media print{.render-background,.figure-tools button,.tech-strip,.article-tech{display:none!important}.official-media .official-image-wrap{background:#eee}.visual-note img{max-width:500px!important}.graph-scroll .graph-svg{min-width:0!important}}

/* v3: one generated artwork for each article, reused consistently in every card. */
.article-cover.generated-cover img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:3/2;object-fit:cover;background:var(--surface)}
.article-cover.generated-cover figcaption{line-height:1.65}
.learning-row img{object-fit:cover}