reading-codex{color:var(--ink);display:block;container-type:inline-size}.codex-frame>.frame-surface{padding:0}.codex-parchment{background:var(--surface-parchment);border:2px solid var(--parchment-edge);box-shadow:inset 0 0 0 4px #f9e5b180, inset 0 0 20px #b5824260, 0 0 0 2px var(--wood-dark)}.codex-banner{text-align:center;margin-bottom:12px;padding:8px 20px}.codex-title{justify-content:center;align-items:center;gap:24px;display:flex}.codex-title :is(h1,h2){font:700 clamp(34px, 4.5cqi, 48px)/1 var(--font-heading);text-transform:uppercase;margin:0}.codex-subtitle{color:var(--ink-soft);font:700 24px/1.1 var(--font-heading);text-transform:uppercase;letter-spacing:3px;justify-content:center;align-items:center;gap:16px;display:flex}.codex-subtitle:before,.codex-subtitle:after{content:"";background:var(--ornament);width:64px;height:2px}.codex-body{grid-template-columns:3fr 2fr;gap:12px;min-height:530px;display:grid}.codex-library{padding:28px 24px}.codex-shelf-title{text-transform:uppercase;margin:0 0 16px;font-size:28px}reading-codex[data-enhanced] .codex-shelf-title{display:none}.codex-grid{grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:16px 12px;margin:0;padding:0;list-style:none;display:grid}.codex-grid li{min-width:0}.codex-details{min-width:0;padding:28px 28px 24px}.codex-detail{scroll-margin-top:20px}.codex-detail:focus-visible{outline:3px solid var(--ink-soft);outline-offset:8px}.codex-detail__cover .codex-cover-missing{text-align:center;border:2px dashed var(--parchment-edge);padding:8px;font-size:18px}.codex-detail__cover{width:164px;height:232px;margin:0 auto 20px;display:block}.codex-detail__cover img{object-fit:contain;filter:drop-shadow(6px 7px #49271940);width:100%;height:100%;display:block}.codex-detail h2{font:700 30px/1 var(--font-heading);text-transform:uppercase;text-align:center;overflow-wrap:anywhere;margin:0}.codex-author{color:var(--ink-soft);text-align:center;margin:4px 0 0;font-size:28px}.codex-detail .ornament--divider{height:16px;margin:10px 0}.codex-detail .ornament--divider:before,.codex-detail .ornament--divider:after{flex:1;height:2px}.codex-facts{gap:12px;display:grid}.codex-facts>div{grid-template-columns:88px minmax(0,1fr);align-items:center;gap:12px;display:grid}.codex-facts dt{font:700 22px/1 var(--font-heading);text-transform:uppercase;color:var(--ink-soft);letter-spacing:1px}.codex-facts dd{min-width:0}.codex-status{border:2px solid var(--green-dark);background:var(--green-light);min-width:144px;box-shadow:inset 2px 2px var(--parchment-light), 2px 2px var(--wood-shadow);text-align:center;text-transform:capitalize;padding:2px 12px;font-size:26px;line-height:1;display:inline-block}.codex-review{color:var(--green-dark);text-underline-offset:4px;font-size:24px;display:block}.codex-tabs{justify-content:center;gap:36px;padding:24px 20px 4px;display:flex}.codex-tab{width:200px;min-height:46px;color:var(--green-dark);text-shadow:none;padding:8px 12px;font-size:24px;text-decoration:none}.codex-tab[aria-selected=true]{border-color:var(--gold);outline:2px solid var(--wood-dark);background:linear-gradient(var(--green-light), var(--green))}.codex-tab[aria-selected=true]:after{background:var(--gold);border:1px solid var(--ink);width:10px;height:10px;top:calc(50% - 5px);right:-20px;transform:rotate(45deg)}.codex-empty,.codex-detail-empty{color:var(--ink-soft);margin:16px 0;font-size:24px}reading-codex [hidden]{display:none}reading-codex:not([data-enhanced]) .codex-shelf+.codex-shelf,reading-codex:not([data-enhanced]) .codex-detail+.codex-detail{margin-top:28px}@container (width<=850px){.codex-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.codex-body{grid-template-columns:1fr 1fr}.codex-library,.codex-details{padding:24px 16px}.codex-facts>div{grid-template-columns:68px minmax(0,1fr);gap:8px}.codex-facts dt{font-size:19px}.codex-status{width:100%;min-width:0}}@container (width<=650px){.codex-body{grid-template-columns:1fr;min-height:0}.codex-banner{padding-inline:8px}.codex-title{gap:12px}.codex-library{padding:24px 12px 16px}.codex-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}.codex-details{padding:24px 16px}.codex-detail__cover{width:120px;height:180px}.codex-detail h2{font-size:28px}.codex-tabs{gap:12px;padding:16px 0 0}.codex-tab{flex:1;width:auto;min-width:0;padding:8px 4px;font-size:18px}.codex-tab[aria-selected=true]:after{top:-8px;right:calc(50% - 5px)}}
