/* V1 editorial system — bespoke pieces for the Noveris worldbuilding guide.
   Structural chrome lives in v1-tools.css/v1-families.css. This layer keeps
   the world archive editorial: figures/table are documentary, while the
   glossary is rendered as a lexicon ledger rather than a grid of cards. */
html.v1 [data-family="lore"]{overflow-wrap:anywhere}

/* Local text-resilience for the Samuel companion surfaces. The shared shell
   intentionally uses width:max-content on .brand; at 200% text that intrinsic
   width can exceed the mobile two-column header. These pages allow the brand
   to reflow without changing the global shell contract. */
html.v1 .site-header__inner>*{min-width:0}
html.v1 .brand{width:auto;max-width:100%}
html.v1 .brand__name,html.v1 .explore-trigger{overflow-wrap:anywhere}

html.v1 .lore-figure{margin:2.5rem 0;border:1px solid var(--color-border)}
html.v1 .lore-figure img{display:block;width:100%;height:auto}
html.v1 .lore-figure__copy{padding:1.5rem;min-width:0}
html.v1 .lore-figure__copy h3{font:400 var(--text-lg)/1.2 var(--font-display);margin:.4rem 0 .6rem;overflow-wrap:anywhere}
html.v1 .lore-figure__copy p{margin:0;color:var(--color-muted);font-family:var(--font-reading);overflow-wrap:anywhere}
html.v1 .lore-figure figcaption{padding:1rem 1.5rem;border-top:1px solid var(--color-border);font:400 .85rem/1.5 var(--font-ui);color:var(--color-muted);overflow-wrap:anywhere}

html.v1 .lore-bento-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--color-border);border:1px solid var(--color-border);margin:2.5rem 0 0}
/* The grid paints --color-border and relies on its 1px gaps to draw the
   hairlines, so each cell has to paint the page surface back over itself.
   Without it the border tone showed through the whole card and muted text
   sat at 3.51:1, under the 4.5:1 AA minimum. */
html.v1 .lore-bento-grid .id-card{border:0;min-width:0;background:var(--surface-page)}
html.v1 .lore-bento-card--large{grid-column:span 2;grid-row:span 2}
html.v1 .lore-bento-card--wide{grid-column:1/-1}

html.v1 .lore-table-wrap{overflow-x:auto;margin:2.5rem 0 0;max-width:100%}
html.v1 .lore-table{width:100%;border-collapse:collapse;min-width:46rem;font:400 .92rem/1.5 var(--font-ui)}
html.v1 .lore-table caption{text-align:left;font:600 .7rem/1.4 var(--font-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--color-muted);margin-bottom:.75rem}
html.v1 .lore-table th,html.v1 .lore-table td{text-align:left;padding:.75rem 1rem;border-bottom:1px solid var(--color-border);vertical-align:middle;overflow-wrap:anywhere}
html.v1 .lore-table thead th{font:600 .68rem/1.3 var(--font-ui);letter-spacing:.05em;text-transform:uppercase;color:var(--color-muted);border-bottom:1px solid var(--color-text)}
html.v1 .lore-table tbody th{font-family:var(--font-display);font-weight:400;font-size:1.05rem}
html.v1 .lore-table-img{width:4.5rem;height:auto;display:block}

html.v1 .lore-prose{max-width:var(--reading-max);font-family:var(--font-reading);font-size:1.05rem;line-height:1.7;min-width:0;overflow-wrap:anywhere}
html.v1 .lore-prose p{margin:0 0 1.3em}

/* Lexicón: preserve every canonical definition, remove the card rhythm. */
html.v1 #glosario .id-cards{display:block;margin-top:2rem;border-top:1px solid var(--color-text)}
html.v1 #glosario .id-card{display:grid;grid-template-columns:minmax(8rem,1fr) minmax(0,3fr);gap:clamp(1rem,3vw,3rem);padding:1.15rem 0;border:0;border-bottom:1px solid var(--color-border);background:transparent;min-width:0}
html.v1 #glosario .id-card h3{margin:0;font:400 clamp(1.15rem,2vw,1.45rem)/1.2 var(--font-display);overflow-wrap:anywhere}
html.v1 #glosario .id-card p{margin:0;max-width:70ch;font-family:var(--font-reading);line-height:1.6;overflow-wrap:anywhere}

/* Existing cards outside the lexicon stay intact; long lore strings must reflow. */
html.v1 [data-family="lore"] .id-card,html.v1 [data-family="lore"] .identity-faq,html.v1 [data-family="lore"] .tool-actions{min-width:0}
html.v1 [data-family="lore"] .id-card h3,html.v1 [data-family="lore"] .id-card p,html.v1 [data-family="lore"] summary,html.v1 [data-family="lore"] a{overflow-wrap:anywhere}

@media(max-width:900px){
  html.v1 .lore-bento-grid{grid-template-columns:1fr}
  html.v1 .lore-bento-card--large,html.v1 .lore-bento-card--wide{grid-column:auto;grid-row:auto}
}
@media(max-width:640px){
  html.v1 #glosario .id-card{grid-template-columns:1fr;gap:.45rem;padding:1rem 0}
  html.v1 .lore-table{min-width:42rem}
}

@media print{
  html.v1 .lore-table-wrap{overflow:visible}
  html.v1 #glosario .id-card{break-inside:avoid;page-break-inside:avoid}
}