.hero-mosaic { overflow: hidden; }
.image-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr)); gap: 1rem; }
.image-card { position: relative; overflow: hidden; border: 1px solid var(--line); background: linear-gradient(145deg, #0c1b2b, #040a11); }
.image-card .card-image { display: block; aspect-ratio: 1; overflow: hidden; }
.image-card img { width: 100%; height: 100%; object-fit: cover; }
.image-card > div { padding: 1rem; }
.image-card h3 { margin: .45rem 0; line-height: 1.2; }
.image-card p { color: var(--muted); font-size: .84rem; }
.tier { display: inline-block; color: var(--cyan); font: 800 .65rem ui-monospace, monospace; letter-spacing: .1em; text-transform: uppercase; }
.detail-image { overflow: hidden; border: 1px solid var(--line); background: var(--panel); }
.detail-image img { width: 100%; height: auto; object-fit: contain; }
.detail > article { padding: 1.5rem; border: 1px solid var(--line); background: var(--panel); }
.specs > div { display: flex; justify-content: space-between; gap: 1rem; padding: .65rem 0; border-bottom: 1px solid var(--line); }
.editorial-head, .question-list, .article, .spelling-grid, .spelling-answer { width: min(64rem, calc(100% - 2.5rem)); margin-inline: auto; }
.editorial-head { padding: clamp(4rem, 8vw, 8rem) 0 2rem; }
.editorial-head h1, .article h1, .spelling-answer h1 { font-size: clamp(2.5rem, 6vw, 5.5rem); line-height: .95; }
.question-list, .spelling-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; padding-bottom: 7rem; }
.question-list > a, .spelling-grid > a { display: grid; gap: .65rem; min-width: 0; padding: 1.4rem; border: 1px solid var(--line); background: linear-gradient(145deg, #0c1b2b, #050b12); text-decoration: none; box-shadow: 0 18px 48px rgb(0 0 0 / 22%); }
.question-list > a:hover { border-color: var(--cyan); transform: translateY(-2px); }
.question-list span, .spelling-grid span { color: var(--cyan); font: 800 .65rem ui-monospace, monospace; letter-spacing: .12em; }
.question-list strong { font-size: 1.1rem; line-height: 1.25; }
.question-list p { margin: 0; color: var(--muted); font-size: .88rem; }
.article, .spelling-answer { padding: 5rem 0 7rem; color: #bdcedc; }
.related-words { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 3rem; }
.related-words a { padding: .55rem .75rem; border: 1px solid var(--line); }
.section > .pager { display: flex; width: 100%; justify-content: center; flex-wrap: wrap; gap: .65rem; margin: 3rem auto 0; padding-top: 2rem; border-top: 1px solid var(--line); }
.section > .pager a { display: grid; min-width: 2.75rem; min-height: 2.75rem; place-items: center; padding: .55rem .8rem; border: 1px solid var(--line); background: linear-gradient(145deg, #0c1b2b, #050b12); color: var(--muted); font: 850 .82rem/1 ui-monospace, monospace; text-decoration: none; }
.section > .pager a:hover { border-color: var(--cyan); color: var(--cyan); transform: translateY(-2px); }
.section > .pager a[aria-current="page"] { border-color: var(--cyan); background: linear-gradient(135deg, #a1e8ff, #218cf5 58%, #0b4e8d); color: #001523; box-shadow: 0 12px 34px rgb(22 135 255 / 30%); }
@media (min-width: 2200px) { .image-grid { grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr)); } }
@media (min-width: 3800px) { .image-grid { grid-template-columns: repeat(auto-fill, minmax(28rem, 1fr)); } }
@media (max-width: 720px) { .question-list, .spelling-grid { grid-template-columns: 1fr; } }

.purchase-trust-club {
  position: relative;
  display: grid;
  gap: 1rem;
  width: min(64rem, calc(100% - 2.5rem));
  margin: 1.5rem auto 2.5rem;
  padding: 1.25rem;
  overflow: hidden;
  border: 1px solid rgb(133 215 255 / 45%);
  background: radial-gradient(circle at 100% 0, rgb(22 135 255 / 22%), transparent 38%), linear-gradient(145deg, #0c1d30, #050b13);
  box-shadow: inset 0 1px rgb(255 255 255 / 8%), 0 24px 70px rgb(0 0 0 / 36%);
}
.purchase-trust-club::after { content: "MEMBER ACCESS"; position: absolute; right: -1rem; bottom: 1rem; color: rgb(133 215 255 / 7%); font: 900 clamp(2.2rem, 6vw, 5rem)/1 ui-monospace, monospace; letter-spacing: -.08em; transform: rotate(-90deg) translateX(25%); pointer-events: none; }
.purchase-trust-club .purchase-trust-badge { position: relative; z-index: 1; display: flex; align-items: center; gap: .8rem; }
.purchase-trust-club .purchase-trust-badge svg { width: 2.45rem; height: 2.45rem; flex: 0 0 auto; padding: .55rem; border: 1px solid var(--cyan); fill: #001523; background: linear-gradient(135deg, #b8f0ff, #218cf5); box-shadow: 0 0 32px rgb(22 135 255 / 28%); }
.purchase-trust-club .purchase-trust-badge span { display: grid; }
.purchase-trust-club .purchase-trust-badge strong { color: #c9f2ff; font: 850 .92rem/1.2 ui-monospace, monospace; text-transform: uppercase; }
.purchase-trust-club .purchase-trust-badge small { color: var(--muted); font: .66rem/1.4 ui-monospace, monospace; letter-spacing: .1em; text-transform: uppercase; }
.purchase-trust-club > p, .plan-security { position: relative; z-index: 1; margin: 0; color: var(--muted); font-size: .78rem; }
.purchase-trust-club > ul { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.purchase-trust-club > ul li { padding: .4rem .65rem; border: 1px solid var(--line); color: #c9f2ff; background: rgb(5 15 25 / 75%); font-size: .7rem; }
.club-trust-plans { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--line); }
.club-trust-plans span { display: grid; gap: .12rem; padding: .75rem; border-right: 1px solid var(--line); color: var(--muted); font-size: .7rem; text-transform: uppercase; }
.club-trust-plans span:last-child { border-right: 0; }
.club-trust-plans b { color: var(--cyan); font: 900 1rem/1 ui-monospace, monospace; }
.detail-access.purchase-trust-club { width: 100%; margin: 1.2rem 0 0; padding: 1rem; }
.detail-access.purchase-trust-club .button { position: relative; z-index: 1; width: 100%; text-align: center; }
.plan-security { min-height: 2.6rem; margin-top: .7rem; padding: .55rem; border: 1px solid var(--line); background: #06111d; text-align: center; }
@media (max-width: 720px) { .purchase-trust-club { padding: 1rem; } .club-trust-plans { grid-template-columns: 1fr; } .club-trust-plans span { border-right: 0; border-bottom: 1px solid var(--line); } .club-trust-plans span:last-child { border-bottom: 0; } .purchase-trust-club > ul { display: grid; grid-template-columns: 1fr; } }

/* --- stock port --- */
img { max-width: 100%; height: auto; }
.image-card .card-image { aspect-ratio: 4 / 3; }
.image-card img { width: 100%; height: 100%; object-fit: cover; }
.tag-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .6rem 0 0; padding: 0; list-style: none; }
.tag-chips a { display: inline-block; padding: .3rem .55rem; border: 1px solid var(--line); color: var(--cyan); font: 700 .66rem ui-monospace, monospace; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; }
.tag-chips a:hover { border-color: var(--cyan); }
.tag-chips-wide { margin-top: .4rem; }
.detail-tags h2 { margin: 1.4rem 0 .2rem; font-size: 1rem; }
.detail-frame { margin: 0; }
.detail-frame img { width: 100%; height: auto; object-fit: contain; }
.detail-frame-caption { padding: .6rem .2rem; color: var(--muted); font-size: .78rem; }
.full-res-link { color: var(--cyan); }
.card-pack { margin: .5rem 0 0; font-size: .8rem; }
.card-pack a { color: var(--cyan); }
.spelling-letters { color: var(--cyan); font: 800 1.15rem ui-monospace, monospace; letter-spacing: .12em; }
.spelling-grid > a p { margin: 0; color: var(--muted); font-size: .78rem; }
.misspellings { padding-left: 1.2rem; }
.article aside { display: grid; gap: .45rem; margin: 2.5rem 0; padding: 1.2rem; border: 1px solid var(--line); }
.article aside h2 { margin: 0 0 .3rem; font-size: 1rem; }
.article ul, .article ol { padding-left: 1.3rem; }
.faq-toc { margin: 1rem 0 2rem; padding: 1rem 1.2rem; border: 1px solid var(--line); background: var(--panel); }
.faq-toc ol { margin: .4rem 0 0; padding-left: 1.2rem; }
.hero-mosaic img { width: 100%; height: 100%; object-fit: cover; }