.codex-wrap{max-width:1120px;margin:0 auto;padding:clamp(2.4rem,6vw,4.5rem) 1.1rem 6rem}.codex-kicker{font-family:var(--display);text-transform:uppercase;letter-spacing:.26em;color:var(--gold);margin:0;font-size:.7rem}.codex-title{font-family:var(--display);color:var(--parchment);letter-spacing:-.01em;margin:.4rem 0 0;font-size:clamp(2.4rem,7vw,4.2rem);line-height:1}.codex-lede{max-width:44rem;color:var(--parchment-dim);margin:1rem 0 0;font-size:1rem;line-height:1.6}.codex-section{margin-top:clamp(2.4rem,5vw,3.6rem)}.codex-section-head{border-bottom:1px solid var(--line-soft);flex-wrap:wrap;align-items:baseline;gap:.9rem;margin-bottom:1.1rem;padding-bottom:.6rem;display:flex}.codex-section-head h2{font-family:var(--display);color:var(--parchment);letter-spacing:.02em;margin:0;font-size:1.35rem}.codex-section-head p{color:var(--muted);margin:0;font-size:.8rem}.codex-grid{grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:14px;display:grid}.codex-card{aspect-ratio:3/4.1;border:1px solid var(--line-soft);isolation:isolate;background:#0b0813;border-radius:13px;transition:transform .25s cubic-bezier(.2,.8,.25,1),border-color .25s,box-shadow .25s;position:relative;overflow:hidden}.codex-card:hover{border-color:var(--gold-lo);transform:translateY(-4px);box-shadow:0 18px 40px -22px #000000e6}.codex-card img{object-fit:cover;z-index:0;width:100%;height:100%;position:absolute;inset:0}.codex-scrim{z-index:1;background:linear-gradient(#08060e26 28%,#08060e73 54%,#08060ef7 86%);position:absolute;inset:0}.codex-card:before{content:"";z-index:2;height:3px;position:absolute;inset:0 0 auto}.codex-card[data-side=good]:before{background:linear-gradient(90deg, transparent, var(--loyal), transparent)}.codex-card[data-side=evil]:before{background:linear-gradient(90deg, transparent, var(--evil), transparent)}.codex-side{z-index:3;font-family:var(--display);text-transform:uppercase;letter-spacing:.12em;background:#00000080;border-radius:5px;padding:3px 6px;font-size:.54rem;position:absolute;top:9px;left:10px}.codex-card[data-side=good] .codex-side{color:var(--loyal)}.codex-card[data-side=evil] .codex-side{color:var(--evil)}.codex-badge{z-index:3;font-family:var(--display);text-transform:uppercase;letter-spacing:.1em;border:1px solid var(--gold-lo);color:var(--gold-bright);background:#0000008c;border-radius:5px;padding:3px 6px;font-size:.54rem;position:absolute;top:9px;right:10px}.codex-body{z-index:3;padding:12px 13px 13px;position:absolute;inset:auto 0 0}.codex-name{font-family:var(--display);color:var(--parchment);margin:0;font-size:1.02rem;line-height:1.1}.codex-power{color:var(--parchment-dim);margin:5px 0 0;font-size:.72rem;line-height:1.36}.codex-foot{text-align:center;margin-top:3rem}.codex-back{color:var(--gold);font-family:var(--display);text-transform:uppercase;letter-spacing:.16em;border-bottom:1px solid var(--gold-lo);padding-bottom:2px;font-size:.74rem}.codex-back:hover{color:var(--gold-bright)}@media (prefers-reduced-motion:reduce){.codex-card,.codex-card:hover{transition:none;transform:none}}