:root {
    --font-title: "Gameback";
    --font-display: "Gameback";
    --font-body: "West Postage";
}

@font-face {
    font-family: "Gameback";
    src: url("../fonts/Gameback.ttf") format("truetype");
    font-weight: 400 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "West Postage";
    src: url("../fonts/West Postage Regular.otf") format("opentype");
    font-weight: 400 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "West Postage";
    src: url("../fonts/West Postage Italic.otf") format("opentype");
    font-weight: 400 900;
    font-style: italic;
    font-display: swap;
}

:root {
    --ink: #090b0c;
    --night: #111719;
    --forest: #182729;
    --teal: #273f41;
    --teal-hi: #528278;
    --wine: #482e38;
    --copper: #cc8074;
    --copper-soft: #f0a79d;
    --parchment: #f6eee8;
    --muted: #d8c7be;
    --line: rgba(204, 128, 116, .26);
    --shadow: 0 24px 70px rgba(0, 0, 0, .44);
    --radius: 8px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--parchment);
    background:
        linear-gradient(180deg, rgba(9, 11, 12, .82), rgba(9, 11, 12, .94)),
        linear-gradient(135deg, #273f41 0%, #090b0c 36%, #482e38 74%, #111719 100%);
    font-family: var(--font-body);
    font-weight: 800;
    line-height: 1.6;
    letter-spacing: 0;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .12;
    background-image:
        linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 18px 18px;
    mix-blend-mode: screen;
    z-index: -1;
}

img {
    max-width: 100%;
    display: block;
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover {
    color: var(--copper-soft);
}

button,
input,
select,
textarea {
    font: inherit;
}

input,
select,
textarea {
    width: 100%;
    color: var(--parchment);
    background: rgba(9, 11, 12, .72);
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: .82rem .9rem;
    outline: none;
}

select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 2.75rem;
    cursor: pointer;
    background:
        linear-gradient(45deg, transparent 50%, #f0a79d 50%) right 1.1rem center / .42rem .42rem no-repeat,
        linear-gradient(135deg, #f0a79d 50%, transparent 50%) right .82rem center / .42rem .42rem no-repeat,
        radial-gradient(circle at 12% 0%, rgba(240, 167, 157, .11), transparent 12rem),
        linear-gradient(145deg, rgba(16, 17, 18, .96), rgba(9, 11, 12, .98));
    box-shadow:
        inset 0 0 18px rgba(204, 128, 116, .08),
        0 8px 22px rgba(0, 0, 0, .16);
}

select:hover {
    border-color: rgba(240, 167, 157, .72);
}

select option {
    color: #f6eee8;
    background: #12090d;
}

input[type="file"] {
    min-height: 54px;
    padding: .42rem;
    cursor: pointer;
    color: #efd9cf;
    background:
        radial-gradient(circle at 12% 0%, rgba(82, 130, 120, .14), transparent 11rem),
        linear-gradient(145deg, rgba(16, 17, 18, .96), rgba(9, 11, 12, .98));
}

input[type="file"]::file-selector-button {
    min-height: 40px;
    margin-right: .82rem;
    padding: .54rem .86rem;
    border: 1px solid rgba(241, 161, 144, .46);
    border-radius: 7px;
    color: #180d10;
    background:
        linear-gradient(180deg, #f0a79d, #cc8074),
        radial-gradient(circle at 28% 0%, rgba(255, 255, 255, .42), transparent 55%);
    box-shadow:
        inset 0 0 14px rgba(255, 232, 218, .2),
        0 8px 18px rgba(0, 0, 0, .22);
    font-family: var(--font-body);
    font-weight: 900;
    cursor: pointer;
}

input[type="file"]::-webkit-file-upload-button {
    min-height: 40px;
    margin-right: .82rem;
    padding: .54rem .86rem;
    border: 1px solid rgba(241, 161, 144, .46);
    border-radius: 7px;
    color: #180d10;
    background: linear-gradient(180deg, #f0a79d, #cc8074);
    font-family: var(--font-body);
    font-weight: 900;
    cursor: pointer;
}

textarea {
    resize: vertical;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--copper);
    box-shadow: 0 0 0 3px rgba(204, 128, 116, .18);
}

label {
    display: grid;
    gap: .45rem;
    color: var(--muted);
    font-size: .92rem;
}

h1,
h2,
h3 {
    font-family: var(--font-title);
    line-height: 1.05;
    margin: 0 0 .75rem;
    font-weight: 700;
}

h1 {
    font-size: clamp(2.55rem, 7vw, 6.2rem);
}

h2 {
    font-size: clamp(1.7rem, 3.2vw, 3rem);
}

h3 {
    font-size: 1.24rem;
}

p {
    margin: 0 0 1rem;
    color: #d9cabb;
}

main {
    min-height: 60vh;
}

.sr-only,
.skip-link {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

.skip-link:focus {
    width: auto;
    height: auto;
    clip: auto;
    z-index: 1000;
    left: 1rem;
    top: 1rem;
    padding: .7rem 1rem;
    background: var(--copper);
    color: #160d10;
}

.btn,
button,
.link-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    border: 1px solid rgba(239, 227, 210, .2);
    border-radius: 6px;
    padding: .72rem 1rem;
    color: var(--parchment);
    background: rgba(39, 63, 65, .9);
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, background .18s ease;
}

.btn:hover,
button:hover,
.link-button:hover {
    transform: translateY(-1px);
    border-color: var(--copper);
}

.btn-primary {
    color: #160d10;
    background: linear-gradient(180deg, #efaa9e, var(--copper));
    border-color: #ffd1c9;
    font-weight: 800;
}

.btn-ghost {
    background: rgba(9, 11, 12, .35);
}

.btn-small {
    min-height: 34px;
    padding: .45rem .7rem;
    font-size: .86rem;
}

.btn.full {
    width: 100%;
}

.link-button {
    background: none;
    border: 0;
    color: var(--copper-soft);
    padding: 0;
    min-height: auto;
}

.eyebrow {
    color: var(--copper-soft);
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .78rem;
    font-weight: 800;
    margin-bottom: .55rem;
	font-family: var(--font-body);
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: linear-gradient(90deg, rgba(9, 11, 12, .96), rgba(39, 63, 65, .9), rgba(72, 46, 56, .92));
    border-bottom: 1px solid rgba(204, 128, 116, .42);
    backdrop-filter: blur(18px);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .32);
}

.nav-shell {
    width: min(1240px, calc(100% - 2rem));
    margin: 0 auto;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 1rem;
    align-items: center;
    min-height: 78px;
}

.brand,
.admin-brand {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    font-family: var(--font-title);
    font-weight: 800;
}

.brand img,
.admin-brand img {
    width: 48px;
    aspect-ratio: 1;
    object-fit: contain;
}

.brand > img:first-child {
    width: 58px;
    filter: drop-shadow(0 0 12px rgba(82, 130, 120, .55));
}

.brand {
    min-height: 46px;
    min-width: 132px;
    padding: .38rem .74rem .38rem .42rem;
    border: 1px solid rgba(241, 161, 144, .28);
    border-radius: 8px;
    background: rgba(255, 232, 218, .04);
    white-space: nowrap;
    gap: .55rem;
    flex-shrink: 0;
}

.brand-text {
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
    color: #ffe0d8;
    font-family: var(--font-body);
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0;
}

.nav-links,
.nav-actions {
    display: flex;
    gap: .85rem;
    align-items: center;
}

.nav-links {
    justify-content: center;
}

.nav-links a,
.icon-link,
.cart-pill {
    color: #e9dbc9;
    font-size: .93rem;
}

.nav-links a[aria-current="page"] {
    color: var(--copper-soft);
}

.cart-pill {
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: .45rem .72rem;
    background: rgba(72, 46, 56, .46);
}

.cart-pill strong {
    margin-left: .35rem;
    color: var(--copper-soft);
}

.nav-toggle {
    display: none;
    width: 44px;
    padding: 0;
    background: rgba(39, 63, 65, .75);
}

.nav-toggle span:not(.sr-only) {
    width: 20px;
    height: 2px;
    background: var(--parchment);
    display: block;
    margin: 3px 0;
}

.flash {
    width: min(980px, calc(100% - 2rem));
    margin: 1rem auto;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: .8rem 1rem;
    background: rgba(39, 63, 65, .82);
}

.flash-success {
    border-color: rgba(82, 130, 120, .8);
}

.flash-error {
    border-color: rgba(204, 128, 116, .9);
}

.entry-veil {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: grid;
    place-items: center;
    gap: 1rem;
    text-align: center;
    padding: 2rem;
    background: #050707;
    transition: opacity .45s ease, visibility .45s ease;
}

.entry-veil.is-hidden {
    opacity: 0;
    visibility: hidden;
}

.entry-veil__mist {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(82, 130, 120, .18), transparent 30%, rgba(204, 128, 116, .14)),
        url("../img/Fond.png") center 23% / min(620px, 80vw) auto no-repeat;
    opacity: .36;
}

.entry-veil__logo {
    position: relative;
    width: min(210px, 45vw);
    image-rendering: pixelated;
}

.entry-veil p,
.entry-veil button {
    position: relative;
}

.hero {
    width: min(1440px, calc(100% - 1.5rem));
    min-height: min(860px, 84vh);
    margin: 1rem auto 0;
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, .55fr);
    gap: 2rem;
    align-items: center;
    padding: clamp(2rem, 6vw, 5rem);
    overflow: hidden;
    border: 1px solid rgba(204, 128, 116, .42);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    background: #090b0c;
}

.hero__bg {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(9, 11, 12, .94) 0%, rgba(9, 11, 12, .76) 42%, rgba(9, 11, 12, .26) 100%),
        linear-gradient(180deg, rgba(39, 63, 65, .18), rgba(72, 46, 56, .24)),
        url("../../uploads/products/bloodroot-table.jpg") center / cover no-repeat;
    opacity: 1;
}

.hero__bg::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        url("../img/Fond.png") right 8% top 10% / min(460px, 44vw) auto no-repeat,
        linear-gradient(180deg, transparent 68%, rgba(9, 11, 12, .94));
    opacity: .42;
}

.hero::after,
.page-hero::after,
.collection-detail-hero::after {
    content: "";
    position: absolute;
    inset: 10px;
    pointer-events: none;
    border: 1px solid rgba(204, 128, 116, .28);
    clip-path: polygon(0 12px, 12px 12px, 12px 0, calc(100% - 12px) 0, calc(100% - 12px) 12px, 100% 12px, 100% calc(100% - 12px), calc(100% - 12px) calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%, 12px calc(100% - 12px), 0 calc(100% - 12px));
}

.hero__content,
.hero__relic {
    position: relative;
}

.hero-wordmark {
    width: min(520px, 92%);
    margin-bottom: 1.2rem;
    image-rendering: pixelated;
}

.hero h1 {
    color: #fff7f0;
    text-shadow: 0 4px 26px rgba(0, 0, 0, .55);
}

.hero__lead {
    color: #f3e2da;
    background: linear-gradient(90deg, rgba(39, 63, 65, .62), rgba(72, 46, 56, .35), transparent);
    border-left: 3px solid var(--copper);
    padding: 1rem 1rem 1rem 1.1rem;
}

.hero__lead {
    max-width: 710px;
    font-size: clamp(1rem, 2vw, 1.22rem);
}

.hero__actions {
    display: flex;
    gap: .8rem;
    flex-wrap: wrap;
    margin-top: 1.4rem;
}

.hero__relic {
    justify-self: center;
    text-align: center;
    max-width: 380px;
    padding: 1.1rem;
    border: 1px solid rgba(82, 130, 120, .62);
    border-radius: var(--radius);
    background:
        linear-gradient(180deg, rgba(39, 63, 65, .58), rgba(72, 46, 56, .5)),
        rgba(9, 11, 12, .42);
    box-shadow: 0 24px 65px rgba(0, 0, 0, .42), inset 0 0 40px rgba(82, 130, 120, .18);
}

.hero__relic img {
    filter: drop-shadow(0 18px 28px rgba(0,0,0,.45)) drop-shadow(0 0 24px rgba(82,130,120,.42));
    image-rendering: pixelated;
}

.section,
.catalog-layout,
.cart-layout,
.checkout-layout,
.account-grid,
.product-detail,
.product-lore,
.article-page,
.collection-detail-hero,
.legend-hero {
    width: min(1240px, calc(100% - 2rem));
    margin: 4rem auto;
}

.section:has(.product-grid),
.catalog-layout {
    width: min(1440px, calc(100% - 2rem));
}

.section-heading,
.catalog-topline,
.admin-heading {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: end;
    margin-bottom: 1.4rem;
}

.intro-grid,
.section-split,
.craft-band,
.legend-hero,
.product-lore {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    align-items: center;
}

.rune-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
}

.rune-list span,
.badge-row span,
.product-meta-line span {
    border: 1px solid var(--line);
    background: rgba(39, 63, 65, .55);
    border-radius: 6px;
    padding: .55rem .7rem;
    color: #f2dfd9;
}

.collection-grid,
.product-grid,
.testimonial-grid,
.blog-grid,
.guide-grid,
.metric-grid,
.admin-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.collection-grid.large {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.collection-card,
.product-card,
.blog-card,
.guide-grid article,
.testimonial-grid blockquote,
.account-panel,
.admin-panel,
.metric-grid article,
.order-summary,
.filter-panel,
.panel-form,
.admin-form,
.prose-panel,
.empty-state,
.cart-table {
    position: relative;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: linear-gradient(180deg, rgba(24, 39, 41, .86), rgba(15, 17, 18, .9));
    box-shadow: 0 12px 30px rgba(0, 0, 0, .24);
}

.collection-card {
    min-height: 310px;
    padding: 1rem;
    overflow: hidden;
}

.collection-card::before {
    content: "";
    position: absolute;
    inset: 0;
    border-top: 4px solid var(--accent);
    opacity: .75;
    pointer-events: none;
}

.collection-card img {
    aspect-ratio: 1.18;
    width: 100%;
    object-fit: cover;
    border-radius: 6px;
    background: #080a0b;
}

.collection-card span {
    display: block;
    margin: .9rem 0 .35rem;
    font-family: var(--font-body);
    font-size: 1.3rem;
    color: #fff0e9;
}

.product-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 18.75rem), 1fr));
    align-items: stretch;
    gap: 1.2rem;
}

.product-grid.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.featured-product-grid {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 19.5rem), 21rem));
    justify-content: start;
}

.product-card {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.product-card__media {
    display: block;
    position: relative;
    background: #080b0c;
}

.product-card__media img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
}

.product-card__body {
    padding: 1rem;
    display: flex;
    flex: 1;
    flex-direction: column;
}

.product-card__collection {
    color: var(--copper-soft);
    font-size: 1.08rem;
    font-weight: 900;
    margin: .4rem 0;
    min-height: 1.45em;
}

.product-card__body h3 {
    min-height: 3.25em;
    font-size: clamp(1.45rem, 2.1vw, 1.9rem);
    line-height: 1.08;
    margin-bottom: .55rem;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.product-card__body p {
    font-size: 1.05rem;
    line-height: 1.42;
    color: #f0d8cc;
}

.product-card__body > p:not(.product-card__collection) {
    min-height: 7.1em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
}

.product-card__bottom strong,
.product-card__price {
    font-size: 1.18rem;
    line-height: 1.25;
}

.product-card__bottom,
.summary-item,
.order-line,
.admin-list-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.product-card__bottom {
    display: grid;
    grid-template-columns: minmax(72px, 1fr) minmax(124px, 142px);
    align-items: center;
    column-gap: .8rem;
    margin-top: auto;
    padding: .75rem 1.15rem .45rem .1rem;
    box-sizing: border-box;
}

.product-card__price {
    justify-self: start;
    align-self: center;
}

.product-card__actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    justify-content: stretch;
    gap: .45rem;
    width: 100%;
    max-width: 142px;
    justify-self: end;
    margin-right: .35rem;
    flex: none;
}

.product-card__actions form {
    width: 100%;
}

.product-card__actions .btn-small {
    width: 100%;
    min-height: 42px;
    padding: .35rem .6rem;
}

.wishlist-form {
    margin: 0;
}

.wishlist-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    width: 100%;
    min-height: 42px;
    padding: .35rem .6rem .35rem .38rem;
    border: 1px solid rgba(240, 167, 157, .34);
    border-radius: 7px;
    color: #f6d9d0;
    background:
        radial-gradient(circle at 20% 10%, rgba(255, 230, 185, .18), transparent 2.8rem),
        linear-gradient(145deg, rgba(70, 34, 44, .9), rgba(13, 11, 13, .78));
    box-shadow:
        inset 0 0 13px rgba(240, 167, 157, .08),
        0 8px 18px rgba(0, 0, 0, .2);
}

.wishlist-toggle .rpg-icon {
    width: 28px;
    height: 28px;
}

.wishlist-toggle span {
    white-space: nowrap;
    font-size: .86rem;
    font-weight: 900;
}

.wishlist-toggle.is-active {
    color: #fff2dc;
    border-color: rgba(255, 208, 137, .68);
    background:
        radial-gradient(circle at 22% 18%, rgba(255, 232, 170, .42), transparent 3rem),
        linear-gradient(145deg, rgba(130, 62, 66, .95), rgba(70, 36, 46, .92));
    box-shadow:
        inset 0 0 16px rgba(255, 228, 180, .18),
        0 0 22px rgba(204, 128, 116, .22);
}

.wishlist-form-detail {
    margin-top: .7rem;
}

.wishlist-form-detail .wishlist-toggle {
    width: 100%;
    min-height: 46px;
}

.wishlist-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .5rem 0;
    border-bottom: 1px solid rgba(240, 167, 157, .14);
}

.wishlist-line:last-child {
    border-bottom: 0;
}

.wishlist-line__product {
    display: flex;
    align-items: center;
    gap: .7rem;
    min-width: 0;
    color: #fff0e8;
}

.wishlist-line__product img {
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    object-fit: cover;
    border: 1px solid rgba(240, 167, 157, .34);
    border-radius: 7px;
    background: rgba(8, 7, 8, .7);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .2);
}

.wishlist-line__product span {
    overflow: hidden;
    text-overflow: ellipsis;
}

.badge-row {
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
    align-content: flex-start;
    min-height: 60px;
}

.badge-row span {
    padding: .2rem .42rem;
    font-size: .72rem;
}

.rarity-badge {
    display: inline-flex;
    border-radius: 999px;
    padding: .28rem .58rem;
    border: 1px solid currentColor;
    background: rgba(0,0,0,.48);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.product-card__media .rarity-badge {
    position: absolute;
    left: .75rem;
    top: .75rem;
}

.rarity-common { color: #d7d2c8; }
.rarity-rare { color: #8fc6ff; }
.rarity-epic { color: #d7a8ff; }
.rarity-legendary { color: #ffd089; }

.craft-band {
    padding: 2rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: linear-gradient(135deg, rgba(72, 46, 56, .66), rgba(39, 63, 65, .58));
}

.craft-band img {
    max-height: 360px;
    margin-left: auto;
    object-fit: contain;
}

.testimonial-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.testimonial-grid blockquote {
    margin: 0;
    padding: 1.2rem;
}

.testimonial-slider {
    position: relative;
}

.testimonial-page {
    display: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.testimonial-page.is-active {
    display: grid;
}

.testimonial-page blockquote {
    margin: 0;
    padding: 1.25rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background:
        linear-gradient(180deg, rgba(72, 46, 56, .5), rgba(15, 17, 18, .9)),
        radial-gradient(circle at 85% 10%, rgba(82, 130, 120, .18), transparent 12rem);
}

.testimonial-rune {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 32px;
    margin-bottom: .8rem;
    border: 1px solid rgba(241, 161, 144, .38);
    border-radius: 7px;
    color: #ffd4ca;
    background: rgba(59, 18, 28, .78);
    font-family: var(--font-title);
    font-size: .72rem;
}

.testimonial-author {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: .7rem;
    margin: 0 0 .85rem;
}

.testimonial-author .testimonial-rune {
    flex: 0 0 auto;
    margin: 0;
}

.testimonial-author cite {
    display: block;
    min-width: 0;
    color: #fff0e9;
    font-family: var(--font-title);
    font-size: clamp(1.45rem, 2vw, 2rem);
    font-style: normal;
    line-height: .92;
    text-align: center;
    overflow-wrap: anywhere;
    text-shadow: 0 0 18px rgba(82, 130, 120, .34);
}

.review-media {
    display: block;
    width: 100%;
    max-height: 190px;
    margin: 0 0 .85rem;
    object-fit: cover;
    border: 1px solid rgba(240, 167, 157, .32);
    border-radius: 8px;
    background: rgba(8, 7, 8, .62);
    box-shadow: inset 0 0 18px rgba(82, 130, 120, .12);
}

.admin-thumb {
    display: block;
    width: 88px;
    height: 64px;
    margin: 0 0 .35rem;
    object-fit: cover;
    border: 1px solid rgba(240, 167, 157, .35);
    border-radius: 7px;
    background: rgba(8, 7, 8, .7);
}

.slider-actions {
    display: inline-flex;
    gap: .5rem;
    align-items: center;
}

.traveler-actions {
    display: inline-flex;
    gap: .55rem;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.testimonial-form {
    margin: 0;
    width: min(560px, calc(100vw - 2rem));
    padding: 1.1rem;
}

.testimonial-modal {
    position: fixed;
    inset: 0;
    z-index: 150;
    display: none;
    place-items: center;
    padding: 1rem;
}

.testimonial-modal.is-open {
    display: grid;
}

.testimonial-modal__backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 0;
    background: rgba(4, 3, 4, .78);
    backdrop-filter: blur(8px);
    cursor: pointer;
}

.testimonial-modal__backdrop:hover {
    transform: none;
    border-color: transparent;
}

.testimonial-modal__dialog {
    position: relative;
    z-index: 1;
}

.modal-close {
    position: absolute;
    top: .75rem;
    right: .75rem;
    z-index: 2;
    width: 34px;
    min-height: 34px;
    padding: 0;
    border-radius: 7px;
    font-family: var(--font-title);
}

body.modal-open {
    overflow: hidden;
}

.stars {
    color: var(--copper-soft);
    letter-spacing: .08em;
}

.page-hero {
    width: min(1240px, calc(100% - 2rem));
    margin: 1rem auto 2rem;
    position: relative;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: clamp(2rem, 6vw, 4.2rem);
    background:
        linear-gradient(90deg, rgba(9,11,12,.86), rgba(9,11,12,.5)),
        url("../img/Fond.png") right 8% center / min(420px, 55vw) auto no-repeat,
        rgba(39,63,65,.62);
}

.page-hero.small h1 {
    font-size: clamp(2.2rem, 5vw, 4.4rem);
}

.catalog-layout {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.filter-panel,
.order-summary,
.panel-form,
.admin-form {
    padding: 1rem;
}

.filter-panel {
    position: sticky;
    top: 96px;
    display: grid;
    gap: .85rem;
}

.range-row,
.two-cols,
.four-cols {
    display: grid;
    gap: .85rem;
}

.range-row,
.two-cols {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.four-cols {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.product-detail {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: 2rem;
    align-items: start;
}

.product-gallery__main {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: #090b0c;
}

.product-gallery__thumbs {
    display: flex;
    gap: .7rem;
    margin-top: .8rem;
    flex-wrap: wrap;
}

.product-gallery__thumbs button {
    width: 72px;
    height: 72px;
    padding: 0;
    overflow: hidden;
}

.product-gallery__thumbs img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-info h1 {
    font-size: clamp(2.2rem, 5vw, 4.8rem);
}

.product-meta-line {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 1rem 0;
}

.artifact-story {
    font-family: var(--font-body);
    font-size: 1.22rem;
    color: #f2ddce;
}

.buy-box {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 1rem;
    background: rgba(72, 46, 56, .42);
    margin: 1.2rem 0;
}

.price {
    display: block;
    font-size: 2rem;
    color: #fff2ea;
    margin-bottom: .35rem;
}

.add-form {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: .8rem;
    align-items: end;
}

.variation-note,
.tiny {
    color: var(--muted);
    font-size: .9rem;
}

.spec-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .8rem;
    margin: 0;
}

.spec-grid div {
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: .85rem;
}

.spec-grid dt {
    color: var(--copper-soft);
    font-size: .78rem;
    text-transform: uppercase;
}

.spec-grid dd {
    margin: .25rem 0 0;
}

.cart-layout,
.checkout-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 1.3rem;
    align-items: start;
}

.cart-table {
    display: grid;
    gap: .8rem;
    padding: 1rem;
}

.cart-row {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) 110px 110px 70px;
    gap: 1rem;
    align-items: center;
    padding-bottom: .8rem;
    border-bottom: 1px solid var(--line);
}

.cart-row img {
    width: 96px;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 6px;
}

.order-summary {
    position: sticky;
    top: 96px;
}

.order-summary dl {
    display: grid;
    gap: .6rem;
}

.order-summary dl div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.order-summary .total {
    border-top: 1px solid var(--line);
    padding-top: .8rem;
    font-size: 1.2rem;
}

.coupon-form {
    display: grid;
    gap: .7rem;
    margin: 1rem 0;
}

.auth-shell {
    width: min(520px, calc(100% - 2rem));
    margin: 4rem auto;
}

.auth-form h1 {
    font-size: clamp(2rem, 5vw, 3.4rem);
}

.panel-form,
.admin-form {
    display: grid;
    gap: 1rem;
}

.form-section {
    width: min(760px, calc(100% - 2rem));
}

.account-hero {
    width: min(1240px, calc(100% - 2rem));
    margin: 2rem auto;
    padding: 2rem;
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    gap: 1.5rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: linear-gradient(135deg, rgba(72,46,56,.72), rgba(39,63,65,.68));
}

.account-hero dl {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .8rem;
    margin: 0;
}

.account-hero dl div,
.metric-grid article {
    padding: 1rem;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: rgba(9,11,12,.35);
}

.account-hero dt,
.metric-grid span {
    color: var(--muted);
    font-size: .76rem;
    text-transform: uppercase;
}

.account-hero dd,
.metric-grid strong {
    margin: .35rem 0 0;
    font-size: 1.45rem;
    color: #fff0e7;
}

.account-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.account-panel {
    padding: 1rem;
}

.order-line {
    border-bottom: 1px solid var(--line);
    padding: .65rem 0;
}

.order-line-link {
    border-radius: 6px;
    padding-inline: .55rem;
    color: #f7e8dc;
    transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.order-line-link:hover {
    color: #fff6ee;
    background: rgba(240, 167, 157, .09);
    transform: translateX(2px);
}

.order-line span {
    min-width: 0;
}

.order-line small {
    display: block;
    margin-top: .15rem;
    color: var(--muted);
    font-size: .82rem;
}

.blog-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.blog-card {
    overflow: hidden;
}

.blog-card img {
    width: 100%;
    aspect-ratio: 1.35;
    object-fit: cover;
}

.blog-card > div {
    padding: 1rem;
}

.article-page {
    max-width: 860px;
}

.article-page > img {
    width: 100%;
    max-height: 420px;
    object-fit: cover;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    margin-bottom: 1.5rem;
}

.article-content {
    color: #e8dacb;
    font-size: 1.06rem;
}

.text-flow {
    color: #e8dacb;
}

.text-flow p {
    margin: 0 0 .9rem;
    color: inherit;
    line-height: 1.55;
}

.text-flow p:last-child {
    margin-bottom: 0;
}

.tiny-flow p {
    font-size: .9rem;
    line-height: 1.35;
}

.article-content a {
    color: var(--copper-soft);
    text-decoration: underline;
}

.guide-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.guide-grid article,
.prose-panel,
.empty-state {
    padding: 1.2rem;
}

.content-section__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.section-heading--runed {
    justify-content: flex-start;
    align-items: center;
}

.section-rune {
    display: inline-grid;
    place-items: center;
    width: 56px;
    min-width: 56px;
    height: 56px;
    border-radius: 10px;
    transform: translateY(-.08rem);
}

.legend-rune {
    margin-bottom: 1rem;
}

.content-block,
.atelier-advice article {
    display: grid;
    gap: 1rem;
    overflow: hidden;
}

.content-block.has-media,
.atelier-advice article.has-media,
.faq-answer.has-media {
    grid-template-columns: minmax(140px, .38fr) minmax(0, 1fr);
    align-items: start;
}

.content-entry-media {
    display: block;
    width: 100%;
    max-height: 240px;
    aspect-ratio: 1.35;
    object-fit: cover;
    border: 1px solid rgba(240, 167, 157, .32);
    border-radius: 8px;
    background: rgba(8, 7, 8, .7);
    box-shadow:
        inset 0 0 22px rgba(82, 130, 120, .12),
        0 18px 38px rgba(0, 0, 0, .22);
}

.guide-grid .content-entry-media {
    margin-bottom: .9rem;
}

.content-block__head {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin-bottom: .55rem;
}

.content-block__head h2,
.content-block__head h3 {
    margin: 0;
}

.content-rune,
.faq-rune {
    display: inline-grid;
    place-items: center;
    width: 38px;
    min-width: 38px;
    height: 38px;
    border-radius: 8px;
}

.faq-list {
    display: grid;
    gap: .85rem;
}

.faq-list details {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 6% 0, rgba(240, 167, 157, .18), transparent 12rem),
        radial-gradient(circle at 92% 28%, rgba(82, 130, 120, .18), transparent 11rem),
        linear-gradient(145deg, rgba(72, 46, 56, .78), rgba(13, 12, 14, .9));
    box-shadow: inset 0 1px 0 rgba(255, 238, 228, .08), 0 18px 42px rgba(0, 0, 0, .2);
}

.faq-list details[open] {
    border-color: rgba(240, 167, 157, .58);
    background:
        radial-gradient(circle at 6% 0, rgba(240, 167, 157, .24), transparent 12rem),
        radial-gradient(circle at 92% 28%, rgba(82, 130, 120, .24), transparent 11rem),
        linear-gradient(145deg, rgba(83, 48, 60, .84), rgba(14, 12, 14, .93));
}

.faq-list summary {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .9rem;
    cursor: pointer;
    list-style: none;
    padding: 1rem 1.1rem;
    color: #fff0e7;
    font-weight: 800;
}

.faq-question {
    min-width: 0;
    font-size: 1.15rem;
    line-height: 1.12;
}

.faq-list summary::-webkit-details-marker {
    display: none;
}

.faq-list summary::after {
    content: "+";
    display: inline-grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    border: 1px solid rgba(240, 167, 157, .34);
    border-radius: 7px;
    color: #f0a79d;
    background: rgba(13, 10, 12, .62);
}

.faq-list details[open] summary::after {
    content: "-";
}

.faq-answer {
    display: grid;
    gap: 1rem;
    padding: 0 1.1rem 1.15rem 4.65rem;
    color: #f0d8cc;
}

.faq-answer.has-media {
    padding-left: 1.1rem;
}

.faq-answer .content-entry-media {
    max-height: 180px;
}

.faq-answer p {
    max-width: 82ch;
    line-height: 1.55;
}

.collection-detail-hero,
.legend-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
    gap: clamp(1rem, 3vw, 2rem);
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 2rem;
    background: linear-gradient(135deg, rgba(9,11,12,.92), rgba(39,63,65,.56));
}

.collection-detail-hero img,
.legend-hero img {
    width: 100%;
    max-width: 320px;
    aspect-ratio: 1.12;
    object-fit: cover;
    border-radius: var(--radius);
}

.collection-detail-hero img {
    justify-self: start;
}

.legend-hero--text-only {
    grid-template-columns: 1fr;
}

.legend-timeline article.has-media {
    display: grid;
    gap: .8rem;
}

.legend-timeline .content-entry-media {
    max-height: 170px;
    aspect-ratio: 1.4;
}

.timeline {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.timeline article {
    border-top: 2px solid var(--copper);
    padding-top: 1rem;
}

.timeline span {
    color: var(--teal-hi);
    font-weight: 900;
}

.newsletter-band {
    width: min(1240px, calc(100% - 2rem));
    margin: 4rem auto 0;
    display: grid;
    grid-template-columns: 1fr minmax(280px, 420px);
    gap: 1.5rem;
    align-items: center;
    padding: 2rem;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: linear-gradient(135deg, rgba(72,46,56,.78), rgba(39,63,65,.74));
}

.newsletter-form {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .7rem;
}

.site-footer {
    margin-top: 4rem;
    border-top: 1px solid var(--line);
    background: rgba(5, 7, 7, .78);
}

.footer-grid {
    width: min(1240px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0;
    display: grid;
    grid-template-columns: 1.4fr repeat(3, 1fr);
    gap: 2rem;
}

.footer-logo {
    width: 92px;
    margin-bottom: .8rem;
}

.site-footer h3 {
    font-size: 1.05rem;
}

.site-footer a {
    display: block;
    margin: .35rem 0;
    color: #dccfc0;
}

.footer-bottom {
    width: min(1240px, calc(100% - 2rem));
    margin: 0 auto;
    border-top: 1px solid var(--line);
    padding: 1rem 0 1.4rem;
    color: var(--muted);
}

.admin-body {
    display: grid;
    grid-template-columns: 260px 1fr;
    min-height: 100vh;
}

.admin-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    padding: 1rem;
    border-right: 1px solid var(--line);
    background: rgba(5, 7, 7, .86);
}

.admin-sidebar nav {
    display: grid;
    gap: .35rem;
    margin-top: 1rem;
}

.admin-sidebar nav a {
    padding: .65rem .75rem;
    border-radius: 6px;
    color: #e8dacb;
}

.admin-sidebar nav a:hover {
    background: rgba(204, 128, 116, .12);
}

.admin-main {
    width: min(1180px, calc(100% - 2rem));
    margin: 0 auto;
    padding: 2rem 0 4rem;
}

.metric-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.admin-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-panel {
    padding: 1rem;
}

.admin-gallery-editor {
    display: grid;
    gap: 1rem;
    margin: 1rem 0;
}

.admin-gallery-editor__heading {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid rgba(241, 161, 144, .18);
    padding-bottom: .75rem;
}

.admin-gallery-editor__heading p:last-child {
    max-width: 420px;
    margin: 0;
    color: var(--muted);
}

.admin-gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: .85rem;
}

.admin-gallery-card {
    display: grid;
    gap: .65rem;
    padding: .72rem;
    border: 1px solid rgba(241, 161, 144, .22);
    border-radius: 8px;
    background:
        radial-gradient(circle at 16% 0%, rgba(82, 130, 120, .15), transparent 9rem),
        linear-gradient(145deg, rgba(9, 11, 12, .5), rgba(72, 46, 56, .24));
}

.admin-gallery-card img {
    width: 100%;
    aspect-ratio: 1.18;
    object-fit: cover;
    border: 1px solid rgba(241, 161, 144, .22);
    border-radius: 7px;
    background: #090b0c;
}

.admin-gallery-card small {
    color: var(--muted);
    overflow-wrap: anywhere;
}

.admin-gallery-card__delete {
    min-height: 42px;
    padding: .55rem .65rem;
    border: 1px solid rgba(241, 161, 144, .2);
    border-radius: 7px;
    background: rgba(9, 11, 12, .36);
}

.admin-detail-section {
    margin: 1.2rem 0;
}

.admin-detail-section > h2 {
    margin-bottom: .8rem;
}

.admin-list-line {
    border-bottom: 1px solid var(--line);
    padding: .65rem 0;
}

.order-items-cell {
    min-width: 280px;
}

.order-item-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .18rem 0;
}

.order-item-line strong {
    white-space: nowrap;
}

.order-total-breakdown {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .7rem;
    margin-top: .45rem;
    padding-top: .45rem;
    border-top: 1px solid rgba(241, 161, 144, .18);
}

.order-total-breakdown span {
    color: var(--muted);
    font-size: .88rem;
    white-space: nowrap;
}

.admin-table {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: rgba(15, 17, 18, .86);
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: .82rem;
    border-bottom: 1px solid var(--line);
    text-align: left;
    vertical-align: middle;
}

th {
    color: var(--copper-soft);
    font-size: .78rem;
    text-transform: uppercase;
}

td small {
    display: block;
    color: var(--muted);
}

td img {
    width: 56px;
    height: 56px;
    object-fit: cover;
    border-radius: 6px;
}

.table-actions {
    display: flex;
    gap: .5rem;
    align-items: center;
}

.table-actions form {
    display: inline-flex;
    gap: .35rem;
}

.admin-filter {
    display: flex;
    gap: .8rem;
    align-items: end;
    margin-bottom: 1rem;
}

.checkbox-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .5rem;
}

.checkbox-grid label,
.admin-form label:has(input[type="checkbox"]) {
    display: flex;
    align-items: center;
    gap: .45rem;
}

input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    display: inline-grid;
    place-items: center;
    width: 1.28rem;
    min-width: 1.28rem;
    height: 1.28rem;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(241, 161, 144, .52);
    border-radius: 5px;
    background:
        radial-gradient(circle at 34% 18%, rgba(255, 232, 218, .18), transparent 48%),
        linear-gradient(145deg, rgba(72, 46, 56, .9), rgba(9, 11, 12, .95));
    box-shadow:
        inset 0 0 12px rgba(204, 128, 116, .14),
        0 7px 18px rgba(0, 0, 0, .24);
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

input[type="checkbox"]::before {
    content: "";
    width: .66rem;
    height: .66rem;
    border-radius: 3px;
    background:
        linear-gradient(135deg, #f6eee8, #f0a79d 62%, #528278);
    box-shadow:
        0 0 12px rgba(240, 167, 157, .58),
        0 0 18px rgba(82, 130, 120, .28);
    transform: scale(0) rotate(-12deg);
    transition: transform .16s ease;
}

input[type="checkbox"]:checked {
    border-color: rgba(240, 167, 157, .9);
    background:
        radial-gradient(circle at 30% 18%, rgba(255, 232, 218, .28), transparent 44%),
        linear-gradient(145deg, rgba(204, 128, 116, .72), rgba(72, 46, 56, .92));
}

input[type="checkbox"]:checked::before {
    transform: scale(1) rotate(-12deg);
}

input[type="checkbox"]:hover {
    transform: translateY(-1px);
    border-color: rgba(246, 238, 232, .8);
}

input[type="checkbox"]:focus-visible {
    outline: 0;
    box-shadow:
        inset 0 0 12px rgba(204, 128, 116, .18),
        0 0 0 3px rgba(204, 128, 116, .22),
        0 7px 18px rgba(0, 0, 0, .24);
}

.compact-form {
    align-self: start;
}

.admin-collection-grid {
    margin-top: 1rem;
}

.warning-text {
    color: var(--copper-soft);
}

/* Blackthorn premium pass */
body {
    background:
        radial-gradient(circle at 16% 6%, rgba(204, 128, 116, .2), transparent 24rem),
        radial-gradient(circle at 84% 12%, rgba(82, 130, 120, .22), transparent 28rem),
        linear-gradient(145deg, #273f41 0%, #182729 30%, #482e38 72%, #273f41 100%);
}

body::after {
    content: "";
    position: fixed;
    inset: auto 0 0;
    height: 48vh;
    pointer-events: none;
    background: url("../img/blackthorn-thorn-vine.svg") right center / contain repeat-y;
    opacity: .24;
    z-index: -1;
}

.site-header {
    background: rgba(39, 63, 65, .94);
}

.brand > img:first-child {
    width: 62px;
}

.hero {
    background:
        linear-gradient(135deg, rgba(39, 63, 65, .92), rgba(72, 46, 56, .82)),
        #273f41;
}

.hero__bg {
    background:
        linear-gradient(110deg, rgba(39, 63, 65, .98) 0%, rgba(39, 63, 65, .88) 48%, rgba(72, 46, 56, .78) 100%);
}

.hero__bg::after {
    background:
        url("../img/blackthorn-thorn-vine.svg") right 5% center / min(130px, 16vw) auto repeat-y,
        radial-gradient(circle at 76% 32%, rgba(204, 128, 116, .12), transparent 18rem);
    opacity: .58;
}

.hero__content {
    max-width: 820px;
}

.hero-wordmark {
    width: min(620px, 96%);
    margin-bottom: 1rem;
}

.hero h1,
.page-hero h1,
.product-info h1 {
    color: #fff8f2;
}

.hero__lead {
    max-width: 760px;
    background: rgba(246, 238, 232, .08);
    border: 1px solid rgba(204, 128, 116, .36);
    border-left: 5px solid var(--copper);
    border-radius: var(--radius);
    box-shadow: inset 0 0 35px rgba(82, 130, 120, .16);
}

.hero__relic {
    background:
        linear-gradient(180deg, rgba(246, 238, 232, .11), rgba(9, 11, 12, .18)),
        rgba(72, 46, 56, .44);
}

.section,
.catalog-layout,
.product-detail,
.cart-layout,
.checkout-layout,
.account-grid {
    position: relative;
}

.section::before {
    content: "";
    position: absolute;
    inset: -1.2rem auto auto -2rem;
    width: 210px;
    height: 80px;
    background: url("../img/blackthorn-thorn-vine.svg") center / contain no-repeat;
    opacity: .2;
    pointer-events: none;
}

.collection-card,
.product-card,
.blog-card,
.guide-grid article,
.testimonial-grid blockquote,
.account-panel,
.admin-panel,
.metric-grid article,
.order-summary,
.filter-panel,
.panel-form,
.admin-form,
.prose-panel,
.empty-state,
.cart-table {
    background:
        linear-gradient(180deg, rgba(246, 238, 232, .1), rgba(246, 238, 232, .035)),
        linear-gradient(145deg, rgba(39, 63, 65, .86), rgba(72, 46, 56, .54));
    border-color: rgba(204, 128, 116, .32);
}

.product-card {
    transform: translateZ(0);
}

.product-card:hover,
.collection-card:hover,
.blog-card:hover {
    border-color: rgba(204, 128, 116, .74);
    box-shadow: 0 26px 70px rgba(9, 11, 12, .42);
}

.product-card__media img,
.collection-card img,
.blog-card img,
.product-gallery__main {
    filter: saturate(1.08) contrast(1.05);
}

.product-card__media::after,
.collection-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 46%, rgba(9, 11, 12, .36));
    pointer-events: none;
}

.craft-band {
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(72, 46, 56, .92), rgba(39, 63, 65, .88));
    min-height: 380px;
}

.craft-band > div:first-child {
    max-width: 680px;
    position: relative;
    z-index: 1;
}

.craft-sigil {
    justify-self: end;
    width: min(360px, 70vw);
    aspect-ratio: 1;
    position: relative;
    display: grid;
    place-items: center;
}

.craft-ornament {
    justify-self: end;
    width: min(480px, 72vw);
    min-height: 300px;
    align-self: stretch;
    background: none;
    opacity: .78;
    filter: drop-shadow(0 24px 30px rgba(0, 0, 0, .24));
}

.craft-sigil img {
    width: 72%;
    filter: drop-shadow(0 18px 30px rgba(0, 0, 0, .42)) drop-shadow(0 0 30px rgba(82, 130, 120, .42));
}

.craft-sigil span {
    position: absolute;
    inset: 8%;
    border: 1px solid rgba(204, 128, 116, .5);
    box-shadow: inset 0 0 55px rgba(82, 130, 120, .2), 0 0 38px rgba(204, 128, 116, .2);
    transform: rotate(45deg);
}

.page-hero {
    background:
        linear-gradient(90deg, rgba(39, 63, 65, .94), rgba(72, 46, 56, .62)),
        url("../img/blackthorn-thorn-vine.svg") right 5% center / min(120px, 18vw) auto repeat-y;
}

.comments-layout {
    display: grid;
    grid-template-columns: minmax(280px, 420px) minmax(0, 1fr);
    gap: 1rem;
}

.comment-list {
    display: grid;
    gap: .8rem;
}

.comment-card,
.moderation-card,
.payment-panel {
    border: 1px solid rgba(204, 128, 116, .28);
    border-radius: var(--radius);
    background: rgba(246, 238, 232, .08);
    padding: 1rem;
}

.comment-card time,
.moderation-card small {
    display: block;
    color: var(--muted);
    font-size: .82rem;
}

.moderation-card {
    margin-bottom: .8rem;
}

.payment-panel strong {
    color: #fff8f2;
}

@media (max-width: 860px) {
    .comments-layout {
        grid-template-columns: 1fr;
    }

    .brand > img:first-child {
        width: 54px;
    }
}

/* Final layout correction: consistent home cards, readable craft band, section identity and grid FAQ. */
.home-collection-section,
.featured-relics-section,
.popular-relics-section {
    width: min(1440px, calc(100% - 2rem)) !important;
}

.home-collection-section .collection-grid,
.featured-relics-section .featured-product-grid,
.popular-relics-section .product-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
    align-items: stretch !important;
    gap: 1.35rem !important;
}

.home-collection-section .collection-card,
.featured-relics-section .product-card,
.popular-relics-section .product-card {
    width: auto !important;
    max-width: none !important;
    min-height: 100%;
}

.home-collection-section .collection-card {
    display: flex;
    flex-direction: column;
}

.home-collection-section .collection-card img {
    aspect-ratio: 1;
}

.home-collection-section .collection-card p {
    flex: 1;
}

.home-heading-rpg {
    justify-content: space-between !important;
    align-items: center !important;
}

.home-heading-rpg > div {
    min-width: 0;
    margin-right: auto;
}

.home-heading-rpg > a {
    margin-left: auto;
}

.craft-band {
    display: block !important;
    min-height: 0 !important;
    padding: clamp(2rem, 4vw, 3.5rem) !important;
}

.craft-band > div:first-child {
    max-width: 820px !important;
}

.craft-band h2 {
    max-width: 12ch;
    line-height: .98;
}

.craft-band p {
    max-width: 68ch;
    line-height: 1.55;
}

.content-section {
    position: relative;
    padding: clamp(1.35rem, 2.5vw, 2.2rem);
    border: 1px solid rgba(204, 128, 116, .28);
    border-radius: var(--radius);
    background:
        radial-gradient(circle at 8% 0, rgba(240, 167, 157, .13), transparent 18rem),
        linear-gradient(145deg, rgba(45, 24, 31, .72), rgba(9, 7, 9, .76));
    box-shadow: inset 0 1px 0 rgba(255, 239, 229, .06), 0 22px 58px rgba(0, 0, 0, .22);
}

.content-section::before {
    content: "";
    position: absolute;
    inset: .75rem;
    border: 1px solid rgba(240, 167, 157, .09);
    border-radius: calc(var(--radius) - 2px);
    pointer-events: none;
}

.content-section + .content-section {
    margin-top: 5.2rem;
}

.content-section-legend_timeline,
.content-section-dice_guide {
    background:
        radial-gradient(circle at 10% 0, rgba(82, 130, 120, .18), transparent 19rem),
        linear-gradient(145deg, rgba(29, 42, 43, .76), rgba(9, 7, 9, .78));
}

.content-section-about,
.content-section-dice_guide_advice {
    background:
        radial-gradient(circle at 86% 8%, rgba(240, 167, 157, .17), transparent 18rem),
        linear-gradient(145deg, rgba(66, 38, 48, .78), rgba(9, 7, 9, .78));
}

.content-section-craft_process {
    background:
        radial-gradient(circle at 8% 0, rgba(214, 156, 92, .16), transparent 18rem),
        radial-gradient(circle at 92% 14%, rgba(82, 130, 120, .17), transparent 18rem),
        linear-gradient(145deg, rgba(58, 35, 34, .8), rgba(9, 7, 9, .8));
}

.content-section-faq {
    background:
        radial-gradient(circle at 10% 0, rgba(184, 231, 255, .12), transparent 18rem),
        linear-gradient(145deg, rgba(35, 28, 46, .78), rgba(9, 7, 9, .8));
}

.content-section .section-heading {
    position: relative;
    z-index: 1;
    padding-bottom: 1rem;
    margin-bottom: 1.35rem;
    border-bottom: 1px solid rgba(240, 167, 157, .18);
}

.content-section .section-heading::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: min(240px, 52%);
    height: 3px;
    background: linear-gradient(90deg, rgba(240, 167, 157, .72), rgba(82, 130, 120, .2), transparent);
}

.content-section-legend_timeline .section-rune,
.content-section-dice_guide .section-rune {
    box-shadow: 0 0 24px rgba(82, 130, 120, .24), inset 0 0 16px rgba(82, 130, 120, .12);
}

.content-section-about .section-rune,
.content-section-faq .section-rune {
    box-shadow: 0 0 24px rgba(240, 167, 157, .22), inset 0 0 16px rgba(240, 167, 157, .1);
}

.content-section__grid,
.timeline.legend-timeline,
.guide-grid,
.prose-panel.atelier-advice,
.faq-list {
    position: relative;
    z-index: 1;
}

.faq-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 1rem;
}

.faq-list details {
    height: fit-content;
}

.faq-list summary {
    min-height: 74px;
}

.legend-route-section {
    width: min(1440px, calc(100% - 2rem)) !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.legend-route-section::before {
    display: none !important;
    content: none !important;
}

.legend-route-section .section-heading {
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(240, 167, 157, .22);
}

.legend-route-section .timeline {
    margin-top: 1rem;
}

.legend-route-section .timeline article {
    background:
        radial-gradient(circle at 12% 0, rgba(240, 167, 157, .12), transparent 9rem),
        linear-gradient(145deg, rgba(55, 30, 38, .62), rgba(10, 8, 10, .72));
    border: 1px solid rgba(204, 128, 116, .26);
    border-radius: var(--radius);
    padding: 1rem;
    border-top: 2px solid rgba(240, 167, 157, .7);
}

@media (max-width: 1100px) {
    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 620px) {
    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid,
    .faq-list {
        grid-template-columns: 1fr !important;
    }

    .content-section {
        padding: 1rem;
    }

    .craft-band {
        padding: 1.4rem !important;
    }

    .craft-band h2 {
        max-width: 100%;
    }
}

/* Final polish: collection wording, detail hero scale and aligned legend route cards. */
.collection-detail-hero {
    display: grid !important;
    grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
    align-items: center;
    gap: clamp(1rem, 3vw, 2rem);
}

.collection-detail-hero > img {
    width: 100% !important;
    max-width: 320px !important;
    aspect-ratio: 1.12;
    object-fit: cover;
    justify-self: start;
}

.legend-route-section .timeline article {
    display: grid;
    grid-template-rows: auto auto minmax(4.75rem, auto) 1fr;
    align-content: start;
}

.legend-route-section .content-block__head {
    align-items: flex-start;
    min-height: 4.75rem;
}

.legend-route-section .content-block__head h2 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

@media (max-width: 760px) {
    .collection-detail-hero {
        grid-template-columns: 1fr;
    }

    .collection-detail-hero > img {
        max-width: 100% !important;
    }

    .legend-route-section .timeline article,
    .legend-route-section .content-block__head {
        min-height: 0;
    }
}

/* Collections.php alignment reference: editorial rooms stay compact, product showcases stay wide. */
:root {
    --blackthorn-editorial-width: min(1240px, calc(100% - 2rem));
    --blackthorn-showcase-width: min(1440px, calc(100% - 2rem));
}

.legend-hero.legend-hero--text-only,
.legend-route-section,
.content-section,
.craft-band,
.traveler-words,
.newsletter-band,
.home-collection-section {
    width: var(--blackthorn-editorial-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.featured-relics-section,
.popular-relics-section {
    width: var(--blackthorn-showcase-width) !important;
}

.legend-hero.legend-hero--text-only {
    display: block !important;
    position: relative;
    overflow: hidden;
    padding: clamp(1.5rem, 3vw, 2.35rem) !important;
    border: 1px solid rgba(204, 128, 116, .28) !important;
    border-radius: var(--radius) !important;
    background:
        radial-gradient(circle at 82% 12%, rgba(240, 167, 157, .16), transparent 17rem),
        radial-gradient(circle at 8% 0, rgba(82, 130, 120, .13), transparent 18rem),
        linear-gradient(145deg, rgba(66, 38, 48, .78), rgba(9, 7, 9, .78)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 229, .06),
        0 22px 58px rgba(0, 0, 0, .22) !important;
}

.legend-hero.legend-hero--text-only::before,
.traveler-words::before,
.newsletter-band::before {
    content: "";
    position: absolute;
    inset: .75rem;
    border: 1px solid rgba(240, 167, 157, .09);
    border-radius: calc(var(--radius) - 2px);
    pointer-events: none;
    background: none !important;
}

.legend-hero.legend-hero--text-only > div,
.traveler-words > *,
.newsletter-band > * {
    position: relative;
    z-index: 1;
}

.legend-hero.legend-hero--text-only > div {
    max-width: 920px;
}

.traveler-words,
.newsletter-band {
    position: relative;
    overflow: hidden;
    padding: clamp(1.35rem, 2.6vw, 2.25rem) !important;
    border: 1px solid rgba(204, 128, 116, .28) !important;
    border-radius: var(--radius) !important;
    background:
        radial-gradient(circle at 10% 0, rgba(82, 130, 120, .15), transparent 17rem),
        radial-gradient(circle at 88% 20%, rgba(240, 167, 157, .14), transparent 16rem),
        linear-gradient(145deg, rgba(45, 24, 31, .72), rgba(9, 7, 9, .78)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 229, .06),
        0 22px 58px rgba(0, 0, 0, .22) !important;
}

.craft-band {
    position: relative;
    overflow: hidden;
    border-color: rgba(204, 128, 116, .28) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 229, .06),
        0 22px 58px rgba(0, 0, 0, .22) !important;
}

.home-collection-section .section-rune.icon-inventory {
    transform: translateY(-.08rem) scale(1.02);
}

.section-rune.has-rpg-icon,
.content-rune.has-rpg-icon,
.faq-rune.has-rpg-icon {
    flex: 0 0 auto;
    overflow: hidden;
}

.section-rune.has-rpg-icon .rpg-svg {
    width: 78% !important;
    height: 78% !important;
}

.content-rune.has-rpg-icon .rpg-svg,
.faq-rune.has-rpg-icon .rpg-svg {
    width: 76% !important;
    height: 76% !important;
}

.section-rune.has-rpg-icon .rpg-svg *,
.content-rune.has-rpg-icon .rpg-svg *,
.faq-rune.has-rpg-icon .rpg-svg * {
    vector-effect: non-scaling-stroke;
}

.admin-table td.table-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: .55rem !important;
    min-height: 92px;
}

.admin-table td.table-actions form {
    display: inline-flex !important;
    margin: 0 !important;
}

.admin-table td.table-actions > a,
.admin-table td.table-actions button {
    display: inline-grid !important;
    place-items: center;
    min-height: 48px;
    padding: .6rem .88rem;
    border: 1px solid rgba(240, 167, 157, .36);
    border-radius: 8px;
    background:
        radial-gradient(circle at 18% 0, rgba(240, 167, 157, .18), transparent 5rem),
        linear-gradient(145deg, rgba(72, 46, 56, .76), rgba(11, 7, 9, .86));
    color: #ffd3c9;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.admin-table td.table-actions button {
    background:
        radial-gradient(circle at 18% 0, rgba(82, 130, 120, .18), transparent 5rem),
        linear-gradient(145deg, rgba(39, 63, 65, .82), rgba(11, 7, 9, .86));
}

@media (max-width: 760px) {
    .legend-hero.legend-hero--text-only,
    .legend-route-section,
    .content-section,
    .craft-band,
    .traveler-words,
    .newsletter-band,
    .home-collection-section,
    .featured-relics-section,
    .popular-relics-section {
        width: min(100% - 1rem, 1440px) !important;
    }

    .legend-hero.legend-hero--text-only::before,
    .traveler-words::before,
    .newsletter-band::before {
        inset: .45rem;
    }

    .newsletter-band {
        grid-template-columns: 1fr !important;
    }
}

/* Layout harmony pass: shared RPG rooms for legend, home bands and newsletter. */
:root {
    --blackthorn-room-width: min(1440px, calc(100% - 2rem));
}

.legend-hero.legend-hero--text-only,
.legend-route-section,
.content-section,
.craft-band,
.traveler-words,
.newsletter-band {
    width: var(--blackthorn-room-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.legend-hero.legend-hero--text-only {
    display: block !important;
    position: relative;
    overflow: hidden;
    padding: clamp(1.5rem, 3vw, 2.6rem) !important;
    border: 1px solid rgba(204, 128, 116, .28) !important;
    border-radius: var(--radius) !important;
    background:
        radial-gradient(circle at 82% 12%, rgba(240, 167, 157, .16), transparent 18rem),
        radial-gradient(circle at 8% 0, rgba(82, 130, 120, .14), transparent 20rem),
        linear-gradient(145deg, rgba(66, 38, 48, .78), rgba(9, 7, 9, .78)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 229, .06),
        0 22px 58px rgba(0, 0, 0, .22) !important;
}

.legend-hero.legend-hero--text-only::before,
.traveler-words::before,
.newsletter-band::before {
    content: "";
    position: absolute;
    inset: .75rem;
    border: 1px solid rgba(240, 167, 157, .09);
    border-radius: calc(var(--radius) - 2px);
    pointer-events: none;
    background: none !important;
}

.legend-hero.legend-hero--text-only > div,
.traveler-words > *,
.newsletter-band > * {
    position: relative;
    z-index: 1;
}

.legend-hero.legend-hero--text-only > div {
    max-width: 980px;
}

.legend-route-section {
    max-width: none !important;
}

.traveler-words,
.newsletter-band {
    position: relative;
    overflow: hidden;
    padding: clamp(1.35rem, 2.6vw, 2.25rem) !important;
    border: 1px solid rgba(204, 128, 116, .28) !important;
    border-radius: var(--radius) !important;
    background:
        radial-gradient(circle at 10% 0, rgba(82, 130, 120, .15), transparent 18rem),
        radial-gradient(circle at 88% 20%, rgba(240, 167, 157, .14), transparent 17rem),
        linear-gradient(145deg, rgba(45, 24, 31, .72), rgba(9, 7, 9, .78)) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 229, .06),
        0 22px 58px rgba(0, 0, 0, .22) !important;
}

.traveler-words .section-heading,
.newsletter-band {
    gap: 1.2rem;
}

.craft-band {
    position: relative;
    overflow: hidden;
    border-color: rgba(204, 128, 116, .28) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 229, .06),
        0 22px 58px rgba(0, 0, 0, .22) !important;
}

.home-collection-section .section-rune.icon-inventory {
    transform: translateY(-.08rem) scale(1.02);
}

@media (max-width: 760px) {
    .legend-hero.legend-hero--text-only,
    .legend-route-section,
    .content-section,
    .craft-band,
    .traveler-words,
    .newsletter-band {
        width: min(100% - 1rem, 1440px) !important;
    }

    .legend-hero.legend-hero--text-only::before,
    .traveler-words::before,
    .newsletter-band::before {
        inset: .45rem;
    }

    .newsletter-band {
        grid-template-columns: 1fr !important;
    }
}

/* Index restore: keep the old large card rhythm, only add RPG section icons. */
.home-collection-section,
.featured-relics-section,
.popular-relics-section {
    width: min(1440px, calc(100% - 2rem)) !important;
}

.home-collection-section .collection-grid,
.featured-relics-section .featured-product-grid,
.popular-relics-section .product-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.35rem !important;
    justify-content: stretch !important;
    align-items: stretch !important;
}

.home-collection-section .collection-card,
.featured-relics-section .product-card,
.popular-relics-section .product-card {
    width: auto !important;
    max-width: none !important;
}

.home-heading-rpg {
    justify-content: space-between !important;
    align-items: center !important;
}

.home-heading-rpg > div {
    min-width: 0;
    margin-right: auto;
}

.home-heading-rpg > a {
    margin-left: auto;
}

/* Content rooms keep their frame, but never repeat thorn vines behind text. */
.content-section::before {
    background: none !important;
    background-image: none !important;
}

.content-section {
    background:
        radial-gradient(circle at 8% 0, rgba(240, 167, 157, .13), transparent 18rem),
        linear-gradient(145deg, rgba(45, 24, 31, .72), rgba(9, 7, 9, .76)) !important;
}

/* Restore the Legend route as an airy timeline instead of a boxed room. */
.legend-route-section {
    width: min(1440px, calc(100% - 2rem)) !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

.legend-route-section::before {
    display: none !important;
    content: none !important;
}

.legend-route-section .section-heading {
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(240, 167, 157, .22);
}

.legend-route-section .timeline {
    margin-top: 1rem;
}

.legend-route-section .timeline article {
    background:
        radial-gradient(circle at 12% 0, rgba(240, 167, 157, .12), transparent 9rem),
        linear-gradient(145deg, rgba(55, 30, 38, .62), rgba(10, 8, 10, .72));
    border: 1px solid rgba(204, 128, 116, .26);
    border-radius: var(--radius);
    padding: 1rem;
    border-top: 2px solid rgba(240, 167, 157, .7);
}

@media (max-width: 1100px) {
    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 620px) {
    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid {
        grid-template-columns: 1fr !important;
    }

    .home-heading-rpg {
        align-items: flex-start !important;
    }
}

/* Last visual correction requested: restore home grid scale and keep lore route airy. */
.home-collection-section,
.featured-relics-section,
.popular-relics-section {
    width: min(1440px, calc(100% - 2rem)) !important;
}

.home-collection-section .collection-grid,
.featured-relics-section .featured-product-grid,
.popular-relics-section .product-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.35rem !important;
    justify-content: stretch !important;
    align-items: stretch !important;
}

.home-collection-section .collection-card,
.featured-relics-section .product-card,
.popular-relics-section .product-card {
    width: auto !important;
    max-width: none !important;
}

.home-heading-rpg {
    justify-content: space-between;
    align-items: center;
}

.home-heading-rpg > div {
    min-width: 0;
    margin-right: auto;
}

.home-heading-rpg > a {
    margin-left: auto;
}

.content-section::before {
    background: none !important;
    background-image: none !important;
}

.legend-route-section {
    width: min(1440px, calc(100% - 2rem)) !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.legend-route-section::before {
    display: none !important;
    content: none !important;
}

.legend-route-section .section-heading {
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(240, 167, 157, .22);
}

.legend-route-section .timeline {
    margin-top: 1rem;
}

.legend-route-section .timeline article {
    background:
        radial-gradient(circle at 12% 0, rgba(240, 167, 157, .12), transparent 9rem),
        linear-gradient(145deg, rgba(55, 30, 38, .62), rgba(10, 8, 10, .72));
    border: 1px solid rgba(204, 128, 116, .26);
    border-radius: var(--radius);
    padding: 1rem;
    border-top: 2px solid rgba(240, 167, 157, .7);
}

@media (max-width: 1100px) {
    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 620px) {
    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid {
        grid-template-columns: 1fr !important;
    }

    .home-heading-rpg {
        align-items: flex-start;
    }
}

/* Black thorn art direction v3 */
body::after {
    top: 86px;
    right: 0;
    bottom: 0;
    left: auto;
    width: min(160px, 18vw);
    height: auto;
    background: url("../img/blackthorn-thorn-vine.svg") center top / contain repeat-y;
    opacity: .32;
}

.hero__bg {
    background:
        linear-gradient(115deg, rgba(39, 63, 65, .98) 0%, rgba(39, 63, 65, .9) 42%, rgba(72, 46, 56, .84) 100%);
}

.hero__bg::after {
    background:
        url("../img/blackthorn-thorn-vine.svg") right 4% center / min(130px, 16vw) auto repeat-y,
        radial-gradient(circle at 78% 30%, rgba(204, 128, 116, .12), transparent 18rem);
    opacity: .58;
}

.hero__relic {
    background:
        linear-gradient(180deg, rgba(246, 238, 232, .11), rgba(9, 11, 12, .12)),
        rgba(72, 46, 56, .34);
}

.section::before {
    inset: -1rem auto auto -1.2rem;
    width: 84px;
    height: 310px;
    background: url("../img/blackthorn-thorn-vine.svg") center / contain no-repeat;
    opacity: .18;
}

.craft-band {
    background:
        linear-gradient(135deg, rgba(72, 46, 56, .9), rgba(39, 63, 65, .9));
}

.craft-band::after {
    content: "";
    position: absolute;
    inset: 0;
    background: url("../img/blackthorn-thorn-vine.svg") right 8% center / min(160px, 18vw) auto repeat-y;
    opacity: .36;
    pointer-events: none;
}

.craft-band > div:first-child,
.craft-ornament {
    position: relative;
    z-index: 1;
}

.craft-ornament {
    background: none;
    min-height: 280px;
}

.craft-ornament::before {
    content: "";
    position: absolute;
    inset: 5% 0 5% auto;
    width: min(430px, 72vw);
    border-left: 1px solid rgba(204, 128, 116, .34);
    border-right: 1px solid rgba(82, 130, 120, .28);
    border-radius: 0;
    transform: none;
    background:
        url("../img/blackthorn-thorn-vine.svg") center / auto 100% no-repeat,
        linear-gradient(135deg, rgba(246, 238, 232, .04), rgba(9, 11, 12, .02));
    opacity: .72;
}

.page-hero {
    background:
        linear-gradient(90deg, rgba(39, 63, 65, .94), rgba(72, 46, 56, .62)),
        url("../img/blackthorn-thorn-vine.svg") right 5% center / min(120px, 18vw) auto repeat-y;
}

.language-switcher {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .22rem;
    border: 1px solid rgba(204, 128, 116, .38);
    border-radius: 999px;
    background: rgba(9, 11, 12, .26);
    box-shadow: inset 0 0 18px rgba(82, 130, 120, .14);
}

.language-switcher > span {
    padding: 0 .35rem 0 .55rem;
    color: #f2ded8;
    font-size: .74rem;
    font-weight: 800;
    text-transform: uppercase;
}

.language-switcher a {
    display: inline-flex;
    align-items: center;
    gap: .32rem;
    min-height: 32px;
    padding: .28rem .52rem;
    border-radius: 999px;
    color: #efe3d8;
    font-size: .82rem;
    font-weight: 900;
    border: 1px solid transparent;
}

.language-switcher a img {
    width: 22px;
    height: 15px;
    object-fit: cover;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(246, 238, 232, .36);
}

.language-switcher a.is-active {
    color: #160d10;
    background: linear-gradient(180deg, #f4b0a5, #cc8074);
    border-color: rgba(255, 233, 227, .75);
}

@media (max-width: 860px) {
    .language-switcher {
        justify-content: center;
    }

    .craft-band::after {
        background-size: 140% auto;
        opacity: .32;
    }

    .craft-ornament {
        display: none;
    }
}

/* Final dark fantasy pass: aggressive blackthorn, no blue wash */
body {
    background:
        radial-gradient(circle at 18% 8%, rgba(72, 46, 56, .58), transparent 28rem),
        radial-gradient(circle at 78% 18%, rgba(204, 128, 116, .12), transparent 18rem),
        radial-gradient(circle at 70% 86%, rgba(39, 63, 65, .18), transparent 28rem),
        linear-gradient(145deg, #070607 0%, #130b0f 30%, #21141a 58%, #482e38 100%);
}

body::before {
    opacity: .08;
    background-image:
        linear-gradient(90deg, rgba(204, 128, 116, .08) 1px, transparent 1px),
        linear-gradient(rgba(82, 130, 120, .07) 1px, transparent 1px);
    background-size: 22px 22px;
}

body::after {
    top: 82px;
    right: 0;
    bottom: 0;
    left: auto;
    width: clamp(96px, 13vw, 170px);
    height: auto;
    background: url("../img/blackthorn-thorn-vine.svg") center top / 100% auto repeat-y;
    opacity: .72;
    filter: drop-shadow(-10px 0 20px rgba(0, 0, 0, .5));
}

.site-header {
    background:
        linear-gradient(90deg, rgba(7, 6, 7, .96), rgba(72, 46, 56, .84) 54%, rgba(39, 63, 65, .74));
}

.hero,
.page-hero,
.craft-band,
.newsletter-band {
    background:
        radial-gradient(circle at 18% 20%, rgba(204, 128, 116, .16), transparent 22rem),
        linear-gradient(135deg, rgba(72, 46, 56, .9), rgba(15, 9, 12, .92) 52%, rgba(39, 63, 65, .72));
}

.hero__bg {
    background:
        linear-gradient(115deg, rgba(12, 8, 10, .9), rgba(72, 46, 56, .8) 48%, rgba(39, 63, 65, .45)),
        radial-gradient(circle at 68% 24%, rgba(204, 128, 116, .13), transparent 20rem);
}

.hero__bg::after {
    background: url("../img/blackthorn-thorn-vine.svg") right 3% center / clamp(90px, 12vw, 150px) auto repeat-y;
    opacity: .88;
}

.hero-wordmark {
    width: min(620px, 95%);
    filter: drop-shadow(0 10px 26px rgba(0, 0, 0, .52));
}

.hero__lead,
.product-card,
.collection-card,
.blog-card,
.panel-form,
.order-summary,
.filter-panel,
.admin-form,
.admin-panel,
.account-panel,
.testimonial-grid blockquote,
.prose-panel,
.empty-state,
.cart-table {
    background:
        linear-gradient(180deg, rgba(246, 238, 232, .105), rgba(246, 238, 232, .035)),
        linear-gradient(145deg, rgba(72, 46, 56, .72), rgba(13, 8, 10, .76) 58%, rgba(39, 63, 65, .38));
}

.section::before {
    width: clamp(60px, 8vw, 92px);
    height: 380px;
    background: url("../img/blackthorn-thorn-vine.svg") center / contain no-repeat;
    opacity: .38;
    filter: drop-shadow(6px 8px 14px rgba(0,0,0,.4));
}

.craft-band {
    min-height: 340px;
}

.craft-band::after {
    background: url("../img/blackthorn-thorn-vine.svg") right 8% center / clamp(100px, 13vw, 160px) auto repeat-y;
    opacity: .7;
}

.craft-ornament::before {
    border: 0;
    width: clamp(110px, 13vw, 170px);
    background: url("../img/blackthorn-thorn-vine.svg") center / contain no-repeat;
    opacity: .85;
    filter: drop-shadow(8px 14px 20px rgba(0,0,0,.5));
}

.page-hero {
    background:
        linear-gradient(90deg, rgba(72, 46, 56, .9), rgba(13, 8, 10, .86)),
        url("../img/blackthorn-thorn-vine.svg") right 5% center / clamp(88px, 12vw, 140px) auto repeat-y;
}

@media (max-width: 860px) {
    body::after {
        width: 76px;
        opacity: .34;
    }

    .hero__bg::after,
    .craft-band::after,
    .page-hero {
        background-size: 76px auto;
    }
}

@media (max-width: 1100px) {
    .product-grid,
    .collection-grid,
    .blog-grid,
    .guide-grid,
    .metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .footer-grid,
    .timeline,
    .testimonial-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .metric-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .four-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .nav-shell {
        grid-template-columns: auto auto;
    }

    .nav-toggle {
        display: inline-grid;
        place-items: center;
        justify-self: end;
    }

    .nav-links,
    .nav-actions {
        grid-column: 1 / -1;
        display: none;
        flex-direction: column;
        align-items: stretch;
        padding-bottom: 1rem;
    }

    .nav-links.is-open,
    .nav-actions.is-open {
        display: flex;
    }

    .hero,
    .intro-grid,
    .section-split,
    .craft-band,
    .product-detail,
    .product-lore,
    .cart-layout,
    .checkout-layout,
    .catalog-layout,
    .legend-hero,
    .collection-detail-hero,
    .account-hero,
    .newsletter-band {
        grid-template-columns: 1fr;
    }

    .filter-panel,
    .order-summary {
        position: static;
    }

    .hero__bg {
        background:
            linear-gradient(180deg, rgba(39, 63, 65, .96), rgba(72, 46, 56, .84)),
            url("../img/blackthorn-thorn-vine.svg") right center / min(96px, 24vw) auto repeat-y;
    }

    .hero__relic {
        max-width: 210px;
    }

    .cart-row {
        grid-template-columns: 72px 1fr;
    }

    .cart-row label,
    .cart-row strong,
    .cart-row button {
        grid-column: 2;
    }

    .account-hero dl,
    .account-grid,
    .admin-grid,
    .newsletter-form {
        grid-template-columns: 1fr;
    }

    .admin-body {
        grid-template-columns: 1fr;
    }

    .admin-sidebar {
        position: static;
        height: auto;
    }

    .admin-sidebar nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .section,
    .catalog-layout,
    .cart-layout,
    .checkout-layout,
    .account-grid,
    .product-detail,
    .product-lore,
    .article-page,
    .collection-detail-hero,
    .legend-hero {
        margin: 2.5rem auto;
    }

    .product-grid,
    .product-grid.compact,
    .collection-grid,
    .collection-grid.large,
    .blog-grid,
    .guide-grid,
    .content-section__grid,
    .testimonial-grid,
    .footer-grid,
    .timeline,
    .metric-grid,
    .spec-grid,
    .two-cols,
    .four-cols,
    .range-row,
    .checkbox-grid {
        grid-template-columns: 1fr;
    }

    .content-block.has-media,
    .atelier-advice article.has-media,
    .faq-answer.has-media {
        grid-template-columns: 1fr;
    }

    .section-heading--runed {
        align-items: flex-start;
    }

    .section-rune {
        width: 46px;
        min-width: 46px;
        height: 46px;
    }

    .faq-list summary {
        grid-template-columns: auto minmax(0, 1fr) auto;
        padding: .9rem;
    }

    .faq-answer {
        padding: 0 .9rem 1rem;
    }

    .hero {
        padding: 1.4rem;
        min-height: 72vh;
    }

    .hero__actions,
    .section-heading,
    .catalog-topline,
    .admin-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .add-form {
        grid-template-columns: 1fr;
    }

    .account-hero dl {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Absolute final override: dark fantasy background + sharp blackthorn only */
body {
    background:
        radial-gradient(circle at 18% 8%, rgba(72, 46, 56, .58), transparent 28rem),
        radial-gradient(circle at 78% 18%, rgba(204, 128, 116, .11), transparent 18rem),
        radial-gradient(circle at 74% 88%, rgba(39, 63, 65, .12), transparent 26rem),
        linear-gradient(145deg, #060506 0%, #12090d 34%, #23141b 66%, #482e38 100%) !important;
}

body::after {
    background: url("../img/blackthorn-thorn-vine.svg") center top / 100% auto repeat-y !important;
    opacity: .74 !important;
}

.hero,
.page-hero,
.craft-band,
.newsletter-band {
    background:
        radial-gradient(circle at 18% 20%, rgba(204, 128, 116, .14), transparent 22rem),
        linear-gradient(135deg, rgba(72, 46, 56, .92), rgba(12, 7, 10, .94) 55%, rgba(39, 63, 65, .46)) !important;
}

.hero__bg {
    background:
        linear-gradient(115deg, rgba(12, 7, 10, .9), rgba(72, 46, 56, .82) 50%, rgba(39, 63, 65, .36)) !important;
}

.hero__bg::after,
.craft-band::after {
    background: url("../img/blackthorn-thorn-vine.svg") right 3% center / clamp(92px, 12vw, 155px) auto repeat-y !important;
    opacity: .9 !important;
}

.page-hero {
    background:
        linear-gradient(90deg, rgba(72, 46, 56, .94), rgba(12, 7, 10, .9)),
        url("../img/blackthorn-thorn-vine.svg") right 5% center / clamp(88px, 12vw, 140px) auto repeat-y !important;
}

.craft-ornament::before,
.section::before {
    background-image: url("../img/blackthorn-thorn-vine.svg") !important;
}

@media (max-width: 860px) {
    .hero__bg {
        background:
            linear-gradient(140deg, rgba(12, 7, 10, .92), rgba(72, 46, 56, .86)) !important;
    }

    .hero__bg::after,
    .craft-band::after,
    body::after {
        background-size: 74px auto !important;
        opacity: .44 !important;
    }
}

/* Production polish: sharper Blackthorn fantasy, no duplicate craft vine */
body {
    background:
        radial-gradient(circle at 16% 10%, rgba(118, 32, 45, .34), transparent 25rem),
        radial-gradient(circle at 84% 18%, rgba(144, 92, 64, .16), transparent 21rem),
        radial-gradient(circle at 50% 105%, rgba(68, 14, 24, .34), transparent 32rem),
        linear-gradient(145deg, #050405 0%, #10080b 34%, #1c1013 68%, #2b1119 100%) !important;
}

.hero,
.page-hero,
.craft-band,
.newsletter-band {
    background:
        linear-gradient(135deg, rgba(42, 15, 23, .96), rgba(8, 6, 7, .94) 58%, rgba(52, 21, 25, .88)),
        url("../img/blackthorn-thorn-vine.svg") right 4% center / clamp(112px, 13vw, 184px) auto repeat-y !important;
}

.hero__bg {
    background:
        linear-gradient(118deg, rgba(7, 5, 6, .94), rgba(55, 20, 28, .9) 52%, rgba(20, 10, 12, .78)),
        url("../img/blackthorn-thorn-vine.svg") right 4% center / clamp(116px, 14vw, 190px) auto repeat-y !important;
}

.hero__bg::after,
.craft-band::after {
    background: url("../img/blackthorn-thorn-vine.svg") right 3% center / clamp(128px, 16vw, 230px) auto repeat-y !important;
    opacity: .86 !important;
}

.craft-band {
    grid-template-columns: minmax(0, 1fr) minmax(120px, 22vw);
    min-height: 360px;
}

.craft-ornament,
.craft-ornament::before {
    display: none !important;
    content: none !important;
    background: none !important;
}

.rpg-icon {
    display: inline-grid;
    place-items: center;
    width: 1.2em;
    min-width: 1.2em;
    color: #f1a190;
    filter: drop-shadow(0 0 7px rgba(204, 128, 116, .32));
}

.icon-link,
.cart-pill,
.language-switcher a {
    gap: .42rem;
}

.cart-pill {
    box-shadow: inset 0 0 0 1px rgba(255, 232, 218, .08), 0 10px 24px rgba(0, 0, 0, .22);
}

.logout-link {
    color: #f1c7bc;
}

.admin-page-link {
    border-color: rgba(255, 212, 202, .42);
    background: rgba(204, 128, 116, .16);
    color: #ffe3dd;
}

.hp-line,
.loyalty-meter {
    color: #ffd7d0;
}

.hp-badge {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
    min-height: 32px;
    padding: .35rem .58rem;
    border: 1px solid rgba(241, 161, 144, .34);
    border-radius: 999px;
    background: rgba(70, 20, 31, .5);
    color: #ffe2dc;
    font-weight: 800;
}

.loyalty-meter {
    position: relative;
    overflow: hidden;
    height: 10px;
    margin: .9rem 0 .55rem;
    border: 1px solid rgba(241, 161, 144, .28);
    border-radius: 999px;
    background: rgba(10, 7, 8, .72);
}

.loyalty-meter span {
    display: block;
    width: var(--progress, 0%);
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #cc8074, #ffd2c8);
    box-shadow: 0 0 14px rgba(204, 128, 116, .45);
}

.settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.settings-form .admin-panel {
    display: grid;
    gap: .8rem;
}

.check-row {
    display: flex !important;
    align-items: center;
    flex-direction: row !important;
    gap: .55rem;
}

.check-row input {
    width: 1.28rem;
}

.admin-language {
    margin-top: 1rem;
    width: 100%;
    justify-content: center;
}

.journal-hero {
    min-height: 320px;
}

.journal-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.journal-card {
    position: relative;
    overflow: hidden;
    min-height: 320px;
    border: 1px solid rgba(241, 161, 144, .26);
    border-radius: 8px;
    background:
        linear-gradient(150deg, rgba(15, 8, 11, .92), rgba(46, 17, 25, .88)),
        url("../img/Fond.png") center 18% / 145% auto no-repeat;
    box-shadow: 0 22px 70px rgba(0, 0, 0, .28);
}

.journal-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        url("../img/blackthorn-thorn-vine.svg") right -12px center / 112px auto repeat-y,
        linear-gradient(180deg, transparent, rgba(4, 3, 4, .76));
    opacity: .72;
    pointer-events: none;
}

.journal-card__sigil {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    min-height: 138px;
    text-decoration: none;
}

.journal-card__sigil span {
    display: grid;
    place-items: center;
    width: 74px;
    aspect-ratio: 1;
    border: 1px solid rgba(255, 226, 218, .28);
    border-radius: 50%;
    background: rgba(7, 5, 6, .72);
    color: #ffd4ca;
    font-family: var(--font-display);
    font-size: 2.4rem;
    box-shadow: 0 0 30px rgba(204, 128, 116, .18), inset 0 0 22px rgba(204, 128, 116, .16);
}

.journal-card > div:not(.journal-card__sigil) {
    position: relative;
    z-index: 1;
    padding: 1rem;
}

.journal-card time {
    color: #f0b8ad;
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.journal-card h2 {
    margin: .45rem 0;
    font-size: 1.35rem;
}

.journal-card p {
    color: #dfc8bb;
}

.read-link {
    display: inline-flex;
    align-items: center;
    margin-top: .75rem;
    color: #ffd4ca;
    font-weight: 800;
}

.article-sigil {
    display: grid;
    place-items: center;
    min-height: 260px;
    margin-bottom: 1.2rem;
    border: 1px solid rgba(241, 161, 144, .28);
    border-radius: 8px;
    background:
        url("../img/blackthorn-thorn-vine.svg") right 5% center / 140px auto repeat-y,
        linear-gradient(135deg, rgba(42, 15, 23, .95), rgba(7, 5, 6, .92)),
        url("../img/Fond.png") center / min(620px, 92vw) auto no-repeat;
    color: #ffd4ca;
    font-family: var(--font-display);
    font-size: 4rem;
    box-shadow: inset 0 0 80px rgba(0, 0, 0, .38);
}

@media (max-width: 860px) {
    .craft-band {
        grid-template-columns: 1fr;
    }

    .settings-grid {
        grid-template-columns: 1fr;
    }

    .journal-grid {
        grid-template-columns: 1fr;
    }

    .hero,
    .page-hero,
    .craft-band,
    .newsletter-band,
    .hero__bg {
        background-size: 86px auto !important;
    }
}

/* Admin RPG production pass: real-data workshop, sharper inventory feel */
body.admin-body {
    color: #fff3eb;
    background:
        radial-gradient(circle at 22% 8%, rgba(121, 39, 48, .28), transparent 26rem),
        radial-gradient(circle at 82% 18%, rgba(205, 128, 104, .11), transparent 24rem),
        linear-gradient(145deg, #050405 0%, #10070a 42%, #211018 100%) !important;
}

body.admin-body::before {
    opacity: .06;
    background-image:
        linear-gradient(90deg, rgba(241, 161, 144, .1) 1px, transparent 1px),
        linear-gradient(rgba(241, 161, 144, .08) 1px, transparent 1px);
}

body.admin-body::after {
    width: clamp(90px, 10vw, 150px);
    background: url("../img/blackthorn-thorn-vine.svg") center top / 100% auto repeat-y !important;
    opacity: .62 !important;
}

.admin-sidebar {
    background:
        linear-gradient(180deg, rgba(7, 5, 6, .96), rgba(19, 8, 12, .94)),
        url("../img/Fond.png") center top 1rem / 150px auto no-repeat;
    box-shadow: 16px 0 46px rgba(0, 0, 0, .34);
}

.admin-brand {
    min-height: 70px;
    padding: .55rem;
    border: 1px solid rgba(241, 161, 144, .24);
    border-radius: 8px;
    background: rgba(255, 232, 218, .045);
}

.admin-brand img {
    width: 54px;
    filter: drop-shadow(0 0 14px rgba(204, 128, 116, .4));
}

.admin-nav a {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: .65rem;
    border: 1px solid transparent;
    background: rgba(255, 232, 218, .035);
}

.admin-nav a:hover {
    border-color: rgba(241, 161, 144, .32);
    background: linear-gradient(90deg, rgba(204, 128, 116, .18), rgba(255, 232, 218, .04));
    color: #fff2ed;
}

.nav-rune,
.metric-rune {
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(241, 161, 144, .42);
    background:
        radial-gradient(circle at 35% 20%, rgba(255, 220, 208, .2), transparent 52%),
        linear-gradient(145deg, rgba(62, 18, 28, .9), rgba(8, 5, 7, .9));
    color: #ffd3c9;
    font-family: var(--font-display);
    font-weight: 900;
    box-shadow: inset 0 0 16px rgba(204, 128, 116, .14), 0 9px 24px rgba(0, 0, 0, .24);
}

.nav-rune {
    width: 34px;
    height: 34px;
    border-radius: 7px;
    font-size: .72rem;
}

.admin-main {
    width: min(1280px, calc(100% - 2rem));
}

.admin-heading {
    position: relative;
    padding: 1.2rem 0 1.6rem;
}

.admin-heading::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: .55rem;
    height: 1px;
    background: linear-gradient(90deg, rgba(241, 161, 144, .55), transparent 72%);
}

.admin-heading h1 {
    font-size: clamp(2.6rem, 8vw, 6.4rem);
    text-shadow: 0 18px 44px rgba(0, 0, 0, .45);
}

.admin-heading__actions {
    display: flex;
    gap: .7rem;
    flex-wrap: wrap;
}

.metric-grid {
    align-items: stretch;
}

.metric-grid article {
    min-height: 150px;
    display: grid;
    align-content: space-between;
    gap: .7rem;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(255, 232, 218, .11), rgba(255, 232, 218, .035)),
        linear-gradient(145deg, rgba(55, 19, 28, .86), rgba(8, 5, 7, .88) 60%, rgba(54, 29, 25, .62));
}

.metric-grid article::after {
    content: "";
    position: absolute;
    inset: auto -18px -28px auto;
    width: 92px;
    height: 160px;
    background: url("../img/blackthorn-thorn-vine.svg") center / contain no-repeat;
    opacity: .18;
    pointer-events: none;
}

.metric-rune {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    font-size: .82rem;
}

.metric-grid span:not(.metric-rune) {
    letter-spacing: .08em;
}

.metric-grid strong {
    font-family: var(--font-display);
    font-size: clamp(1.45rem, 2.3vw, 2.1rem);
}

.admin-panel,
.admin-table,
.admin-form {
    background:
        linear-gradient(180deg, rgba(255, 232, 218, .09), rgba(255, 232, 218, .028)),
        linear-gradient(145deg, rgba(45, 16, 24, .86), rgba(7, 5, 6, .9) 62%, rgba(50, 22, 22, .62));
    border-color: rgba(241, 161, 144, .26);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .3);
}

.admin-panel h2 {
    font-size: clamp(1.55rem, 3vw, 2.6rem);
}

.admin-list-line {
    min-height: 56px;
}

.admin-list-line em {
    color: #f2c2b8;
}

.admin-new-items {
    width: min(1280px, calc(100% - 2rem));
    margin: 0 auto 1.4rem;
}

.admin-alert-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .75rem;
}

.admin-alert-grid a {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .7rem;
    min-height: 58px;
    padding: .75rem;
    border: 1px solid rgba(241, 161, 144, .22);
    border-radius: 8px;
    background: rgba(255, 232, 218, .035);
}

.admin-alert-grid a.has-new {
    border-color: rgba(240, 167, 157, .62);
    box-shadow: inset 0 0 24px rgba(204, 128, 116, .1);
}

.new-badge {
    display: inline-grid;
    place-items: center;
    min-width: 30px;
    height: 30px;
    padding: 0 .45rem;
    border-radius: 999px;
    background: #f0a79d;
    color: #170b0e;
    font-family: var(--font-title);
}

@media (max-width: 1100px) {
    .admin-alert-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 620px) {
    .admin-alert-grid {
        grid-template-columns: 1fr;
    }
}

.admin-table table {
    background: rgba(7, 5, 6, .34);
}

.admin-table tr:hover td {
    background: rgba(204, 128, 116, .055);
}

.admin-table a,
.table-actions button {
    color: #ffd3c9;
    font-weight: 800;
}

@media (max-width: 860px) {
    .admin-heading h1 {
        font-size: clamp(2.25rem, 16vw, 4.2rem);
    }

    .admin-nav a {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .nav-rune {
        width: 30px;
        height: 30px;
    }
}

/* RPG header + requested typography */
.nav-links,
.nav-actions {
    gap: .5rem;
}

.nav-item,
.icon-link,
.cart-pill {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    min-width: 0;
    gap: .42rem;
    font-weight: 900;
}

.nav-item {
    min-height: 42px;
    padding: .38rem .54rem;
    border: 1px solid rgba(241, 161, 144, .18);
    border-radius: 7px;
    background: rgba(255, 232, 218, .035);
}

.nav-item:hover,
.nav-links a[aria-current="page"] {
    background: linear-gradient(180deg, rgba(204, 128, 116, .22), rgba(8, 5, 7, .18));
    border-color: rgba(241, 161, 144, .42);
}

.nav-glyph,
.rpg-icon {
    display: inline-grid;
    place-items: center;
    width: 30px;
    min-width: 30px;
    height: 30px;
    border: 1px solid rgba(241, 161, 144, .38);
    border-radius: 7px;
    background:
        radial-gradient(circle at 35% 18%, rgba(255, 222, 214, .22), transparent 45%),
        linear-gradient(145deg, rgba(59, 18, 28, .92), rgba(7, 5, 6, .92));
    color: #ffd4ca;
    font-family: var(--font-title);
    font-size: .72rem;
    line-height: 1;
    text-align: center;
    box-shadow: inset 0 0 14px rgba(204, 128, 116, .15), 0 8px 20px rgba(0,0,0,.24);
}

.cart-pill,
.icon-link {
    min-height: 42px;
    padding: .38rem .58rem;
}

.language-switcher {
    white-space: nowrap;
    flex-shrink: 0;
}

.hero {
    grid-template-columns: minmax(0, 1.1fr) minmax(260px, .48fr);
}

.hero__sigil {
    position: relative;
    justify-self: center;
    display: grid;
    place-items: center;
    gap: .6rem;
    width: min(360px, 80vw);
    isolation: isolate;
    text-align: center;
}

.hero__sigil-glow {
    position: absolute;
    inset: 12%;
    z-index: -1;
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(204, 128, 116, .16), transparent 58%),
        radial-gradient(circle, rgba(39, 63, 65, .18), transparent 70%);
    filter: blur(8px);
}

.hero__sigil img {
    width: min(310px, 70vw);
    image-rendering: pixelated;
    filter:
        drop-shadow(0 22px 34px rgba(0, 0, 0, .5))
        drop-shadow(0 0 24px rgba(39, 63, 65, .46));
}

.hero__sigil p {
    max-width: 24ch;
    color: #f5d6cf;
    text-shadow: 0 3px 18px rgba(0,0,0,.62);
}

.hero__relic {
    display: none;
}

p,
li,
dt,
dd,
input,
select,
textarea,
button,
.btn,
.nav-links a,
.icon-link,
.cart-pill,
label,
td,
th {
    font-family: var(--font-body);
    font-weight: 800;
}

h1,
h2,
h3,
.brand,
.price,
.metric-grid strong {
    font-family: var(--font-title);
}

@media (max-width: 1180px) {
    .nav-shell {
        grid-template-columns: auto auto;
    }

    .nav-links,
    .nav-actions {
        grid-column: 1 / -1;
        justify-content: center;
        flex-wrap: wrap;
    }
}

/* Header compact: Accueil uses the same RPG tile rhythm as the other links. */
.brand {
    min-height: 42px;
    min-width: 0;
    width: auto;
    padding: .38rem .56rem;
    border-radius: 7px;
    gap: .46rem;
    align-self: center;
    font-family: var(--font-body);
    background: rgba(255, 232, 218, .035);
    border-color: rgba(241, 161, 144, .18);
}

.brand > img:first-child {
    width: 30px;
    min-width: 30px;
    height: 30px;
    padding: 2px;
    border: 1px solid rgba(241, 161, 144, .38);
    border-radius: 7px;
    background:
        radial-gradient(circle at 35% 18%, rgba(255, 222, 214, .18), transparent 45%),
        linear-gradient(145deg, rgba(59, 18, 28, .92), rgba(7, 5, 6, .92));
    object-fit: contain;
    filter: drop-shadow(0 0 8px rgba(82, 130, 120, .55));
}

.brand-text {
    display: inline-block;
    min-width: 0;
    color: #f7e6dc;
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1.1;
    white-space: nowrap;
}

/* Header reset: readable RPG navigation, with the logo separated from menu labels. */
.site-header .nav-shell {
    width: min(1760px, calc(100% - 2rem));
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-areas:
        "brand actions"
        "links links";
    gap: .52rem .85rem;
    align-items: center;
    min-height: 0;
    padding: .56rem 0 .68rem;
}

.site-header .brand {
    grid-area: brand;
    width: auto;
    min-width: 0;
    min-height: 48px;
    padding: .32rem .58rem .32rem .38rem;
    gap: .52rem;
    overflow: visible;
}

.site-header .brand > img:first-child {
    width: 42px;
    min-width: 42px;
    height: 42px;
    padding: 3px;
}

.site-header .brand-text {
    position: static;
    width: auto;
    height: auto;
    clip: auto;
    overflow: visible;
    font-family: var(--font-title);
    font-size: 1.08rem;
    color: #f5d7d0;
    text-shadow: 0 0 14px rgba(204, 128, 116, .18);
}

.site-header .nav-links {
    grid-area: links;
    justify-content: center;
    gap: .62rem;
    min-width: 0;
}

.site-header .nav-actions {
    grid-area: actions;
    justify-content: flex-end;
    gap: .48rem;
    min-width: 0;
}

.site-header .nav-item,
.site-header .icon-link,
.site-header .cart-pill {
    min-height: 46px;
    padding: .42rem .72rem;
    gap: .5rem;
    flex: 0 0 auto;
    overflow: visible;
    font-size: 1.04rem;
    line-height: 1;
}

.site-header .nav-item > span:last-child,
.site-header .icon-link > span:last-child,
.site-header .cart-pill > span:not(.rpg-icon) {
    display: inline-block;
    white-space: nowrap;
    min-width: max-content;
}

.site-header .nav-glyph,
.site-header .rpg-icon {
    width: 32px;
    min-width: 32px;
    height: 32px;
    font-size: .74rem;
    line-height: 1;
}

.site-header .language-switcher {
    min-height: 46px;
    flex: 0 0 auto;
}

body,
p,
li,
dt,
dd,
input,
select,
textarea,
button,
.btn,
.nav-links a,
.icon-link,
.cart-pill,
label,
td,
th,
.intro-grid p,
.section p,
.rich-text,
.artifact-story {
    font-family: var(--font-body);
    font-weight: 900;
}

@media (max-width: 1180px) {
    .site-header .nav-shell {
        grid-template-columns: auto auto;
        grid-template-areas:
            "brand toggle"
            "links links"
            "actions actions";
    }

    .site-header .nav-toggle {
        grid-area: toggle;
    }

    .site-header .nav-links,
    .site-header .nav-actions {
        justify-content: center;
        flex-wrap: wrap;
    }
}

@media (max-width: 720px) {
    .site-header .brand-text {
        display: none;
    }

    .site-header .nav-item,
    .site-header .icon-link,
    .site-header .cart-pill {
        width: 100%;
        justify-content: flex-start;
    }
}

/* Final pass: one-line desktop menu and only the two requested fonts. */
body,
body * {
    font-family: var(--font-body);
    font-weight: 900;
}

h1,
h2,
h3,
.brand-text,
.price,
.metric-grid strong,
.product-card__body h3,
.hero h1,
.page-hero h1,
.product-info h1,
.admin-heading h1,
.admin-panel h2 {
    font-family: var(--font-title);
}

.nav-glyph,
.rpg-icon,
.nav-rune,
.metric-rune {
    font-family: var(--font-body) !important;
    font-weight: 900;
}

.site-header .nav-shell {
    width: min(1880px, calc(100% - 1.2rem));
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas: "brand links actions";
    gap: .45rem;
    min-height: 62px;
    padding: .42rem 0;
}

.site-header .brand {
    min-height: 44px;
    padding: .28rem .36rem;
}

.site-header .brand > img:first-child {
    width: 38px;
    min-width: 38px;
    height: 38px;
}

.site-header .brand-text {
    display: none;
}

.site-header .nav-links {
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: .42rem;
    overflow: visible;
}

.site-header .nav-actions {
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: .38rem;
}

.site-header .nav-item,
.site-header .icon-link,
.site-header .cart-pill {
    min-height: 42px;
    padding: .34rem .5rem;
    gap: .38rem;
    font-size: .95rem;
}

.site-header .nav-glyph,
.site-header .rpg-icon {
    width: 30px;
    min-width: 30px;
    height: 30px;
    font-size: .68rem;
}

.site-header .language-switcher {
    min-height: 42px;
    padding: .14rem;
}

.site-header .language-switcher > span {
    display: none;
}

.site-header .language-switcher a {
    min-height: 32px;
    padding: .22rem .44rem;
    font-size: .88rem;
}

@media (max-width: 1480px) {
    .site-header .nav-shell {
        grid-template-columns: auto auto;
        grid-template-areas:
            "brand toggle"
            "links links"
            "actions actions";
    }

    .site-header .nav-toggle {
        grid-area: toggle;
        display: inline-grid;
        place-items: center;
        justify-self: end;
    }

    .site-header .nav-links,
    .site-header .nav-actions {
        display: none;
        flex-wrap: wrap;
        justify-content: center;
    }

    .site-header .nav-links.is-open,
    .site-header .nav-actions.is-open {
        display: flex;
    }
}

@media (max-width: 860px) {
    .testimonial-page {
        grid-template-columns: 1fr;
    }
}

/* Final responsive/admin polish */
.admin-new-items {
    width: 100%;
    margin: 0 0 1.4rem;
}

.site-header .nav-glyph,
.site-header .rpg-icon,
.nav-rune {
    width: 36px;
    min-width: 36px;
    height: 36px;
    font-size: 1.24rem;
    letter-spacing: 0;
    line-height: 1;
}

.site-header .nav-glyph.is-long,
.site-header .rpg-icon.is-long,
.nav-rune.is-long {
    width: 42px;
    min-width: 42px;
    height: 42px;
    font-size: 1.08rem;
    letter-spacing: -.08em;
    transform: none;
}

.site-header .nav-item,
.site-header .icon-link,
.site-header .cart-pill {
    gap: .46rem;
}

.site-header .icon-link,
.site-header .cart-pill {
    border: 1px solid rgba(241, 161, 144, .2);
    border-radius: 7px;
    background: rgba(255, 232, 218, .035);
    box-shadow: inset 0 0 18px rgba(204, 128, 116, .06);
}

.site-header .icon-link:hover,
.site-header .cart-pill:hover {
    background: linear-gradient(180deg, rgba(204, 128, 116, .22), rgba(8, 5, 7, .18));
    border-color: rgba(241, 161, 144, .42);
}

.status-marker {
    display: inline-flex;
    align-items: center;
    gap: .36rem;
    width: max-content;
    min-height: 26px;
    padding: .18rem .52rem;
    margin-left: .35rem;
    border: 1px solid rgba(241, 161, 144, .3);
    border-radius: 999px;
    background: rgba(255, 232, 218, .055);
    color: #f8dfd8;
    font-family: var(--font-body);
    font-size: .86rem;
    font-weight: 900;
    white-space: nowrap;
}

.status-marker::before {
    content: "";
    width: .58rem;
    height: .58rem;
    border-radius: 999px;
    box-shadow: 0 0 12px currentColor;
}

.status-marker.is-approved {
    color: #b9f2d0;
    border-color: rgba(119, 224, 161, .42);
    background: rgba(54, 142, 91, .12);
}

.status-marker.is-pending {
    color: #ffd4ca;
    border-color: rgba(240, 167, 157, .56);
    background: rgba(204, 128, 116, .14);
}

.status-marker.is-approved::before {
    background: #79e6a4;
}

.status-marker.is-pending::before {
    background: #f0a79d;
}

.admin-list-line small {
    color: #f0bdb3;
}

@media (max-width: 860px) {
    .hero {
        width: min(100% - .7rem, 720px);
        grid-template-columns: 1fr;
        min-height: auto;
        gap: 1.15rem;
        padding: clamp(1.05rem, 5vw, 1.7rem);
        margin-top: .5rem;
    }

    .hero__content {
        text-align: center;
    }

    .hero-wordmark {
        width: min(360px, 88vw);
        margin-inline: auto;
        margin-bottom: .75rem;
    }

    .hero h1 {
        max-width: 9ch;
        margin-inline: auto;
        font-size: clamp(2.35rem, 13vw, 4.6rem);
        line-height: .92;
        text-wrap: balance;
    }

    .hero__lead {
        max-width: 100%;
        padding: .82rem .9rem;
        font-size: clamp(.92rem, 4.2vw, 1.05rem);
        line-height: 1.35;
        background:
            linear-gradient(180deg, rgba(39, 63, 65, .72), rgba(72, 46, 56, .42));
        border-left: 0;
        border-top: 3px solid var(--copper);
    }

    .hero__actions {
        justify-content: center;
        gap: .62rem;
    }

    .hero__actions .btn {
        min-width: min(100%, 240px);
        justify-content: center;
    }

    .hero__sigil {
        width: min(230px, 58vw);
        margin-inline: auto;
    }

    .hero__sigil img {
        width: min(190px, 52vw);
    }

    .hero__sigil p {
        font-size: .95rem;
    }

    .hero__bg::after {
        background-size: 68px auto;
        opacity: .48;
    }
}

@media (max-width: 480px) {
    .site-header .nav-glyph,
    .site-header .rpg-icon,
    .nav-rune {
        width: 34px;
        min-width: 34px;
        height: 34px;
        font-size: 1.1rem;
    }

    .site-header .nav-glyph.is-long,
    .site-header .rpg-icon.is-long,
    .nav-rune.is-long {
        width: 38px;
        min-width: 38px;
        height: 38px;
        font-size: .98rem;
        letter-spacing: -.08em;
    }

    .hero h1 {
        font-size: clamp(2.1rem, 14vw, 3.4rem);
    }

    .hero__sigil {
        width: min(190px, 54vw);
    }
}

.security-field {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.address-autocomplete-wrap {
    position: relative;
}

.address-suggestions {
    position: absolute;
    z-index: 50;
    right: 0;
    left: 0;
    top: calc(100% + .35rem);
    display: grid;
    gap: .25rem;
    padding: .35rem;
    border: 1px solid rgba(220, 142, 132, .46);
    border-radius: 8px;
    background: rgba(18, 10, 13, .98);
    box-shadow: 0 18px 42px rgba(0, 0, 0, .36);
}

.address-suggestions[hidden],
.address-suggestions:empty {
    display: none !important;
    padding: 0;
    border: 0;
    box-shadow: none;
}

.address-suggestion {
    width: 100%;
    padding: .65rem .75rem;
    border: 1px solid rgba(239, 227, 210, .12);
    border-radius: 6px;
    color: var(--parchment);
    background: rgba(255, 255, 255, .04);
    font: 800 .95rem/1.2 var(--font-body);
    text-align: left;
    cursor: pointer;
}

.address-suggestion:hover,
.address-suggestion:focus-visible {
    border-color: rgba(220, 142, 132, .75);
    background: rgba(220, 142, 132, .16);
}

.two-factor-setup {
    display: grid;
    grid-template-columns: minmax(8.5rem, 11rem) 1fr;
    gap: 1rem;
    align-items: stretch;
    margin: 1rem 0;
}

.two-factor-qr {
    display: grid;
    place-items: center;
    gap: .55rem;
    padding: .75rem;
    border: 1px solid rgba(240, 167, 157, .38);
    border-radius: 8px;
    background:
        radial-gradient(circle at 50% 20%, rgba(240, 167, 157, .18), transparent 7rem),
        linear-gradient(145deg, rgba(16, 10, 12, .94), rgba(56, 32, 42, .86));
}

.two-factor-qr span {
    color: #f0d4c8;
    font-size: .86rem;
    text-align: center;
}

.two-factor-qr-svg {
    width: min(100%, 9.5rem);
    height: auto;
    border-radius: 7px;
    box-shadow:
        0 0 0 1px rgba(255, 231, 211, .2),
        0 12px 26px rgba(0, 0, 0, .28);
}

.two-factor-qr-svg .qr-bg {
    fill: #fff7ee;
}

.two-factor-qr-svg .qr-pixels {
    fill: #16090d;
}

.two-factor-qr-fallback {
    color: #f0a79d;
    text-align: center;
}

.two-factor-secret {
    display: grid;
    gap: .35rem;
    margin: .9rem 0;
    padding: .9rem;
    border: 1px solid rgba(240, 167, 157, .36);
    border-radius: 8px;
    background:
        radial-gradient(circle at 12% 0%, rgba(82, 130, 120, .18), transparent 10rem),
        linear-gradient(145deg, rgba(72, 46, 56, .62), rgba(9, 11, 12, .82));
}

.two-factor-secret span {
    color: #f0a79d;
    text-transform: uppercase;
    font-size: .78rem;
    letter-spacing: .08em;
}

.two-factor-secret strong {
    color: #fff4ee;
    word-break: break-word;
    font-size: clamp(1.1rem, 2vw, 1.35rem);
}

.two-factor-uri {
    margin: .7rem 0 1rem;
    color: #e8d4ca;
}

.two-factor-uri summary {
    cursor: pointer;
    color: #f0a79d;
}

.two-factor-uri code {
    display: block;
    max-width: 100%;
    overflow-wrap: anywhere;
    margin-top: .45rem;
    padding: .65rem;
    border: 1px solid rgba(240, 167, 157, .22);
    border-radius: 7px;
    background: rgba(9, 11, 12, .72);
}

@media (max-width: 640px) {
    .two-factor-setup {
        grid-template-columns: 1fr;
    }
}

/* RPG icon mode: SVG pictos with hidden text fallback for quick A/B testing. */
.has-rpg-icon {
    position: relative;
    overflow: hidden;
}

.has-rpg-icon .rpg-svg {
    width: 72%;
    height: 72%;
    display: block;
    color: #ffd7ce;
    filter:
        drop-shadow(0 0 8px rgba(255, 230, 185, .28))
        drop-shadow(0 0 4px color-mix(in srgb, currentColor 50%, transparent));
    stroke-width: 2.05;
}

.has-rpg-icon .rpg-svg .icon-fill {
    fill: color-mix(in srgb, currentColor 28%, transparent);
    stroke: none;
}

.has-rpg-icon .rpg-svg .icon-shine {
    color: #fff7db;
    stroke-width: 1.5;
}

.has-rpg-icon .glyph-fallback {
    display: none;
    font-family: var(--font-body);
    font-weight: 900;
    line-height: 1;
}

body.icon-mode-classic .has-rpg-icon .rpg-svg {
    display: none;
}

body.icon-mode-classic .has-rpg-icon .glyph-fallback {
    display: inline-grid;
    place-items: center;
}

.site-header .has-rpg-icon,
.admin-nav .has-rpg-icon {
    flex: 0 0 auto;
    background:
        radial-gradient(circle at 35% 18%, rgba(255, 248, 216, .46), transparent 43%),
        radial-gradient(circle at 70% 78%, rgba(240, 167, 157, .28), transparent 50%),
        linear-gradient(145deg, rgba(143, 68, 74, .96), rgba(66, 29, 39, .96));
    border-color: rgba(255, 205, 187, .62);
    box-shadow:
        inset 0 0 14px rgba(255, 231, 211, .16),
        inset 0 -10px 22px rgba(32, 9, 13, .2),
        0 8px 18px rgba(0, 0, 0, .22);
}

.site-header .has-rpg-icon::after,
.admin-nav .has-rpg-icon::after {
    content: "";
    position: absolute;
    inset: 5px;
    border-radius: 5px;
    border: 1px solid rgba(255, 239, 223, .18);
    pointer-events: none;
}

.cart-pill .has-rpg-icon .rpg-svg {
    width: 80%;
    height: 80%;
}

.has-rpg-icon.icon-home .rpg-svg,
.has-rpg-icon.icon-portal .rpg-svg { color: #f0a79d; }

.has-rpg-icon.icon-d20 .rpg-svg,
.has-rpg-icon.icon-dashboard .rpg-svg { color: #91f0cf; }

.has-rpg-icon.icon-lineage .rpg-svg { color: #8fd2c8; }
.has-rpg-icon.icon-codex .rpg-svg,
.has-rpg-icon.icon-journal .rpg-svg { color: #f0d28a; }
.has-rpg-icon.icon-sword .rpg-svg,
.has-rpg-icon.icon-quill .rpg-svg,
.has-rpg-icon.icon-anvil .rpg-svg { color: #f2aaa2; }
.has-rpg-icon.icon-grimoire .rpg-svg { color: #d8b6ff; }
.has-rpg-icon.icon-exit .rpg-svg { color: #ff8f86; }
.has-rpg-icon.icon-inventory .rpg-svg,
.has-rpg-icon.icon-bag .rpg-svg,
.has-rpg-icon.icon-chest .rpg-svg { color: #ffd36f; }
.has-rpg-icon.icon-gem .rpg-svg { color: #9df5ea; }
.has-rpg-icon.icon-wagon .rpg-svg { color: #cfec96; }
.has-rpg-icon.icon-party .rpg-svg { color: #b9d2ff; }
.has-rpg-icon.icon-ticket .rpg-svg { color: #f2bd7a; }
.has-rpg-icon.icon-star .rpg-svg { color: #ffe78a; }
.has-rpg-icon.icon-comment .rpg-svg,
.has-rpg-icon.icon-envelope .rpg-svg { color: #b8e7ff; }
.has-rpg-icon.icon-heart .rpg-svg { color: #ff9fb3; }

.has-rpg-icon.icon-bag {
    border-color: rgba(255, 226, 143, .78);
}

.has-rpg-icon.icon-bag .rpg-svg {
    color: #ffe28f;
    stroke-width: 1.95;
}

.has-rpg-icon.icon-inventory {
    border-color: rgba(255, 219, 112, .86);}

.has-rpg-icon.icon-inventory .rpg-svg {
    width: 88%;
    height: 88%;
    color: #173e68;
    stroke-width: 1.45;
    filter:
        drop-shadow(0 1px 0 rgba(255, 247, 213, .42))
        drop-shadow(0 0 8px rgba(255, 207, 91, .34));
}

.has-rpg-icon.icon-inventory .inventory-red {
    fill: #ff6f63;
}

.has-rpg-icon.icon-inventory .inventory-gold {
    fill: #ffd966;
}

.has-rpg-icon.icon-inventory .inventory-lock {
    fill: #ffe777;
}

.has-rpg-icon.icon-inventory .icon-shine {
    color: #fff8dd;
}

.site-header .nav-item:hover .has-rpg-icon,
.site-header .icon-link:hover .has-rpg-icon,
.site-header .cart-pill:hover .has-rpg-icon,
.site-header .nav-links a[aria-current="page"] .has-rpg-icon {
    filter: saturate(1.16) brightness(1.08);
    box-shadow:
        inset 0 0 16px rgba(255, 244, 222, .22),
        0 0 18px color-mix(in srgb, currentColor 24%, transparent),
        0 9px 20px rgba(0, 0, 0, .24);
}

/* Polished RPG glyphs: each icon gets a gemmed plate, facets and stronger colors. */
.has-rpg-icon {
    --glyph-core: #cc8074;
    --glyph-deep: #482e38;
    --glyph-edge: #ffd8c9;
    --glyph-facet-a: #f0a79d;
    --glyph-facet-b: #7d3347;
    --glyph-symbol: #fff0df;
    --glyph-fill: rgba(255, 229, 197, .32);
    --glyph-glow: rgba(240, 167, 157, .45);
}

.site-header .nav-shell {
    width: 100%;
    padding-left: .38rem;
    padding-right: .7rem;
}

.site-header .brand {
    justify-self: start;
    min-width: 0;
    min-height: 52px;
    padding: .12rem .24rem;
    border-color: rgba(82, 130, 120, .42);
    background:
        radial-gradient(circle at 50% 50%, rgba(82, 130, 120, .22), transparent 64%),
        rgba(255, 232, 218, .025);
}

.site-header .brand > img:first-child {
    width: 50px;
    min-width: 50px;
    height: 50px;
    padding: 4px;
    border: 1px solid rgba(82, 130, 120, .64);
    border-radius: 9px;
    background:
        radial-gradient(circle at 50% 34%, rgba(240, 167, 157, .18), transparent 56%),
        linear-gradient(145deg, rgba(18, 34, 35, .95), rgba(63, 31, 43, .92));
    box-shadow:
        inset 0 0 16px rgba(82, 130, 120, .28),
        0 0 18px rgba(82, 130, 120, .34),
        0 8px 20px rgba(0, 0, 0, .28);
    filter: drop-shadow(0 0 10px rgba(240, 167, 157, .24));
}

.site-header .brand:hover > img:first-child {
    border-color: rgba(240, 167, 157, .82);
    box-shadow:
        inset 0 0 18px rgba(240, 167, 157, .22),
        0 0 22px rgba(82, 130, 120, .45),
        0 8px 20px rgba(0, 0, 0, .28);
}

.site-header .has-rpg-icon:not(.icon-inventory),
.admin-nav .has-rpg-icon:not(.icon-inventory) {
    border-color: color-mix(in srgb, var(--glyph-edge) 70%, transparent);
    background:
        radial-gradient(circle at 28% 18%, rgba(255, 255, 237, .58), transparent 28%),
        radial-gradient(circle at 74% 78%, var(--glyph-glow), transparent 58%),
        linear-gradient(145deg, var(--glyph-facet-a) 0%, var(--glyph-core) 48%, var(--glyph-deep) 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 248, 222, .35),
        inset 0 -12px 22px rgba(21, 8, 13, .34),
        0 0 12px color-mix(in srgb, var(--glyph-glow) 72%, transparent),
        0 8px 18px rgba(0, 0, 0, .26);
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg {
    width: 90%;
    height: 90%;
    color: var(--glyph-symbol);
    stroke-width: 1.72;
    filter:
        drop-shadow(0 1px 0 rgba(12, 6, 10, .62))
        drop-shadow(0 0 7px color-mix(in srgb, var(--glyph-glow) 78%, transparent));
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg > path {
    vector-effect: non-scaling-stroke;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg > path:not([class]) {
    stroke: var(--glyph-symbol);
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-cast-shadow {
    fill: rgba(13, 6, 10, .5);
    stroke: none;
    transform: translateY(.7px);
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-plate {
    fill: color-mix(in srgb, var(--glyph-core) 72%, var(--glyph-deep));
    stroke: var(--glyph-edge);
    stroke-width: .82;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-facet {
    stroke: none;
    opacity: .8;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-facet-left {
    fill: color-mix(in srgb, var(--glyph-facet-a) 72%, white 8%);
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-facet-right {
    fill: color-mix(in srgb, var(--glyph-deep) 82%, black 6%);
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-inner-glow {
    fill: color-mix(in srgb, var(--glyph-facet-a) 26%, transparent);
    stroke: color-mix(in srgb, var(--glyph-edge) 42%, transparent);
    stroke-width: .55;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-top-sheen,
.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-bottom-sheen {
    fill: none;
    stroke: rgba(255, 248, 220, .8);
    stroke-width: 1.05;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-fill {
    fill: var(--glyph-fill);
    stroke: color-mix(in srgb, var(--glyph-symbol) 82%, transparent);
    stroke-width: .45;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-shine {
    stroke: rgba(255, 248, 220, .86);
}

.has-rpg-icon.icon-home,
.has-rpg-icon.icon-portal {
    --glyph-core: #d76a5e;
    --glyph-deep: #5c263a;
    --glyph-edge: #ffd4bf;
    --glyph-facet-a: #ff9f86;
    --glyph-facet-b: #8f3b54;
    --glyph-symbol: #fff2df;
    --glyph-fill: rgba(255, 206, 176, .42);
    --glyph-glow: rgba(255, 145, 113, .52);
}

.has-rpg-icon.icon-d20,
.has-rpg-icon.icon-dashboard,
.has-rpg-icon.icon-gem {
    --glyph-core: #2fae98;
    --glyph-deep: #153f47;
    --glyph-edge: #b8fff0;
    --glyph-facet-a: #73efd0;
    --glyph-facet-b: #1b6e70;
    --glyph-symbol: #ecfff8;
    --glyph-fill: rgba(145, 255, 223, .38);
    --glyph-glow: rgba(93, 241, 206, .55);
}

.has-rpg-icon.icon-lineage {
    --glyph-core: #ba726f;
    --glyph-deep: #53263d;
    --glyph-edge: #ffd0c1;
    --glyph-facet-a: #ef998d;
    --glyph-facet-b: #7d3c55;
    --glyph-symbol: #d9fff7;
    --glyph-fill: rgba(123, 226, 207, .38);
    --glyph-glow: rgba(239, 153, 141, .48);
}

.has-rpg-icon.icon-codex,
.has-rpg-icon.icon-journal {
    --glyph-core: #8e62c8;
    --glyph-deep: #3e2a67;
    --glyph-edge: #f1dbff;
    --glyph-facet-a: #b48aff;
    --glyph-facet-b: #61458e;
    --glyph-symbol: #fff3bd;
    --glyph-fill: rgba(255, 225, 129, .38);
    --glyph-glow: rgba(181, 138, 255, .5);
}

.has-rpg-icon.icon-sword,
.has-rpg-icon.icon-quill,
.has-rpg-icon.icon-anvil {
    --glyph-core: #c45f5b;
    --glyph-deep: #4f2632;
    --glyph-edge: #ffd2ca;
    --glyph-facet-a: #ff9b8e;
    --glyph-facet-b: #843548;
    --glyph-symbol: #fff0df;
    --glyph-fill: rgba(255, 187, 158, .36);
    --glyph-glow: rgba(255, 139, 124, .5);
}

.has-rpg-icon.icon-grimoire {
    --glyph-core: #8f6fdd;
    --glyph-deep: #3b2b68;
    --glyph-edge: #f4dcff;
    --glyph-facet-a: #b694ff;
    --glyph-facet-b: #604695;
    --glyph-symbol: #fff0f5;
    --glyph-fill: rgba(222, 195, 255, .38);
    --glyph-glow: rgba(179, 146, 255, .52);
}

.has-rpg-icon.icon-exit {
    --glyph-core: #d45a54;
    --glyph-deep: #5b1e2c;
    --glyph-edge: #ffc8be;
    --glyph-facet-a: #ff8e80;
    --glyph-facet-b: #8f2c3a;
    --glyph-symbol: #fff3e8;
    --glyph-fill: rgba(255, 176, 160, .36);
    --glyph-glow: rgba(255, 111, 99, .5);
}

.has-rpg-icon.icon-bag,
.has-rpg-icon.icon-chest,
.has-rpg-icon.icon-ticket {
    --glyph-core: #d08a33;
    --glyph-deep: #6a3a1f;
    --glyph-edge: #ffe5a7;
    --glyph-facet-a: #ffc45f;
    --glyph-facet-b: #9e5828;
    --glyph-symbol: #fff5d8;
    --glyph-fill: rgba(255, 219, 120, .4);
    --glyph-glow: rgba(255, 194, 83, .52);
}

.has-rpg-icon.icon-wagon {
    --glyph-core: #7eaf49;
    --glyph-deep: #394b27;
    --glyph-edge: #e5ffc4;
    --glyph-facet-a: #b7df6c;
    --glyph-facet-b: #5d7f34;
    --glyph-symbol: #f8ffe8;
    --glyph-fill: rgba(213, 255, 142, .36);
    --glyph-glow: rgba(193, 235, 109, .5);
}

.has-rpg-icon.icon-party {
    --glyph-core: #5e8dd6;
    --glyph-deep: #283963;
    --glyph-edge: #d5e4ff;
    --glyph-facet-a: #88b8ff;
    --glyph-facet-b: #3f639c;
    --glyph-symbol: #f2f7ff;
    --glyph-fill: rgba(185, 210, 255, .38);
    --glyph-glow: rgba(136, 184, 255, .52);
}

.has-rpg-icon.icon-star {
    --glyph-core: #d6a942;
    --glyph-deep: #684021;
    --glyph-edge: #fff0a8;
    --glyph-facet-a: #ffe078;
    --glyph-facet-b: #a6672c;
    --glyph-symbol: #fffbe0;
    --glyph-fill: rgba(255, 232, 138, .46);
    --glyph-glow: rgba(255, 214, 92, .55);
}

.has-rpg-icon.icon-comment,
.has-rpg-icon.icon-envelope {
    --glyph-core: #4b9cc6;
    --glyph-deep: #24425c;
    --glyph-edge: #cfefff;
    --glyph-facet-a: #7bd3ff;
    --glyph-facet-b: #36729a;
    --glyph-symbol: #f1fbff;
    --glyph-fill: rgba(184, 231, 255, .4);
    --glyph-glow: rgba(111, 202, 255, .5);
}

.has-rpg-icon.icon-heart {
    --glyph-core: #d76482;
    --glyph-deep: #5d253d;
    --glyph-edge: #ffd3df;
    --glyph-facet-a: #ff9bb1;
    --glyph-facet-b: #973c5d;
    --glyph-symbol: #fff0f5;
    --glyph-fill: rgba(255, 184, 202, .4);
    --glyph-glow: rgba(255, 141, 169, .52);
}

.site-header .nav-item:hover .has-rpg-icon:not(.icon-inventory),
.site-header .icon-link:hover .has-rpg-icon:not(.icon-inventory),
.site-header .cart-pill:hover .has-rpg-icon:not(.icon-inventory),
.admin-nav a:hover .has-rpg-icon:not(.icon-inventory),
.site-header .nav-links a[aria-current="page"] .has-rpg-icon:not(.icon-inventory) {
    filter: saturate(1.24) brightness(1.08);
    box-shadow:
        inset 0 1px 0 rgba(255, 248, 222, .42),
        inset 0 -12px 22px rgba(21, 8, 13, .28),
        0 0 18px color-mix(in srgb, var(--glyph-glow) 92%, transparent),
        0 9px 20px rgba(0, 0, 0, .27);
}

/* RPG 2000s pass: visible crest on the left, centered menu, object-like glyphs. */
@media (min-width: 1481px) {
    .site-header .nav-shell {
        width: 100%;
        grid-template-columns: 78px minmax(720px, 1fr) auto;
        grid-template-areas: "brand links actions";
        padding: .36rem .7rem .36rem .28rem;
        gap: .55rem;
    }

    .site-header .nav-links {
        justify-content: center;
        padding-inline: .8rem;
    }

    .site-header .nav-actions {
        justify-content: flex-end;
    }
}

.site-header .brand {
    width: 68px;
    min-width: 68px;
    min-height: 60px;
    padding: 0;
    justify-content: center;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.site-header .brand > img:first-child {
    width: 62px;
    min-width: 62px;
    height: 62px;
    padding: 5px;
    border: 1px solid rgba(111, 231, 203, .56);
    border-radius: 10px;
    background:
        radial-gradient(circle at 50% 48%, rgba(111, 231, 203, .3), transparent 64%),
        radial-gradient(circle at 50% 52%, rgba(240, 167, 157, .18), transparent 76%),
        linear-gradient(145deg, rgba(10, 17, 18, .96), rgba(45, 23, 35, .94));
    box-shadow:
        inset 0 1px 0 rgba(255, 236, 218, .26),
        inset 0 0 18px rgba(111, 231, 203, .28),
        0 0 18px rgba(111, 231, 203, .34),
        0 0 30px rgba(240, 167, 157, .16),
        0 10px 24px rgba(0, 0, 0, .38);
    filter:
        saturate(1.22)
        contrast(1.08)
        drop-shadow(0 0 8px rgba(111, 231, 203, .3));
}

.site-header .brand:hover > img:first-child {
    transform: translateY(-1px);
    border-color: rgba(255, 214, 170, .82);
    box-shadow:
        inset 0 1px 0 rgba(255, 236, 218, .36),
        inset 0 0 20px rgba(240, 167, 157, .28),
        0 0 22px rgba(111, 231, 203, .42),
        0 0 34px rgba(240, 167, 157, .22),
        0 10px 24px rgba(0, 0, 0, .38);
}

.site-header .has-rpg-icon:not(.icon-inventory),
.admin-nav .has-rpg-icon:not(.icon-inventory) {
    background:
        radial-gradient(circle at 24% 16%, rgba(255, 246, 218, .7), transparent 24%),
        linear-gradient(135deg, color-mix(in srgb, var(--glyph-facet-a) 86%, white 4%) 0%, var(--glyph-core) 48%, var(--glyph-deep) 100%);
    border-color: color-mix(in srgb, var(--glyph-edge) 82%, transparent);
    box-shadow:
        inset 1px 1px 0 rgba(255, 248, 226, .38),
        inset -1px -1px 0 rgba(17, 6, 11, .46),
        inset 0 -10px 18px rgba(10, 4, 8, .28),
        0 0 13px color-mix(in srgb, var(--glyph-glow) 78%, transparent),
        0 7px 18px rgba(0, 0, 0, .3);
}

.site-header .has-rpg-icon:not(.icon-inventory)::before,
.admin-nav .has-rpg-icon:not(.icon-inventory)::before {
    content: "";
    position: absolute;
    inset: 3px 4px auto 4px;
    height: 34%;
    border-radius: 5px 5px 12px 12px;
    background: linear-gradient(180deg, rgba(255, 255, 236, .34), transparent);
    pointer-events: none;
    z-index: 1;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg {
    position: relative;
    z-index: 2;
    width: 92%;
    height: 92%;
    color: var(--glyph-symbol);
    stroke-width: 1.55;
    filter:
        drop-shadow(0 1px 0 rgba(7, 3, 6, .82))
        drop-shadow(0 0 6px color-mix(in srgb, var(--glyph-glow) 86%, transparent));
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-main {
    fill: var(--glyph-main, var(--glyph-core));
    stroke: rgba(32, 12, 20, .92);
    stroke-width: .9;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-accent {
    fill: var(--glyph-accent, var(--glyph-facet-a));
    stroke: rgba(43, 17, 23, .72);
    stroke-width: .72;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-secondary {
    fill: var(--glyph-secondary, var(--glyph-deep));
    stroke: rgba(30, 12, 18, .78);
    stroke-width: .72;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-light-fill {
    fill: var(--glyph-light, color-mix(in srgb, var(--glyph-facet-a) 70%, white 12%));
    stroke: rgba(30, 12, 18, .72);
    stroke-width: .65;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-badge {
    fill: rgba(20, 10, 17, .72);
    stroke: var(--glyph-edge);
    stroke-width: .82;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-number {
    fill: #fff8d8;
    stroke: rgba(31, 12, 20, .9);
    stroke-width: .42;
    paint-order: stroke fill;
    font-family: var(--font-body);
    font-size: 6.1px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-outline {
    fill: none;
    stroke: rgba(25, 10, 17, .9);
    stroke-width: 1.15;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-detail {
    fill: none;
    stroke: rgba(255, 246, 220, .94);
    stroke-width: 1.05;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .strong-stem {
    stroke: rgba(255, 246, 220, .88);
    stroke-width: 1.45;
}

.has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-shine {
    fill: none;
    stroke: rgba(255, 255, 240, .96);
    stroke-width: .95;
}

.has-rpg-icon.icon-home,
.has-rpg-icon.icon-portal {
    --glyph-main: #ff9d74;
    --glyph-accent: #ffd0a4;
    --glyph-secondary: #8a3b55;
    --glyph-light: #ffe1b8;
}

.has-rpg-icon.icon-d20,
.has-rpg-icon.icon-gem {
    --glyph-main: #54f0d1;
    --glyph-accent: #b5ffe8;
    --glyph-secondary: #187f7b;
    --glyph-light: #7fffe2;
}

.has-rpg-icon.icon-dashboard {
    --glyph-core: #3f8ed6;
    --glyph-deep: #25325f;
    --glyph-edge: #dbeaff;
    --glyph-facet-a: #83bcff;
    --glyph-symbol: #f4fbff;
    --glyph-fill: rgba(155, 196, 255, .4);
    --glyph-glow: rgba(114, 177, 255, .56);
    --glyph-main: #5fa8ff;
    --glyph-accent: #d7ebff;
    --glyph-secondary: #7561d7;
    --glyph-light: #ffe36f;
}

.has-rpg-icon.icon-lineage {
    --glyph-main: #80dfd0;
    --glyph-accent: #ffb4a5;
    --glyph-secondary: #4d8c86;
    --glyph-light: #cffff6;
}

.has-rpg-icon.icon-codex,
.has-rpg-icon.icon-journal {
    --glyph-main: #ffe08b;
    --glyph-accent: #fff3bf;
    --glyph-secondary: #8f66d8;
    --glyph-light: #fff8d5;
}

.has-rpg-icon.icon-sword,
.has-rpg-icon.icon-quill,
.has-rpg-icon.icon-anvil {
    --glyph-main: #f8ded1;
    --glyph-accent: #ff8f78;
    --glyph-secondary: #b94a4a;
    --glyph-light: #fff3e4;
}

.has-rpg-icon.icon-grimoire {
    --glyph-main: #caa8ff;
    --glyph-accent: #f1dcff;
    --glyph-secondary: #7651c1;
    --glyph-light: #fff0ff;
}

.has-rpg-icon.icon-exit {
    --glyph-main: #ff8b76;
    --glyph-accent: #ffe0c9;
    --glyph-secondary: #9f2f3b;
    --glyph-light: #fff1df;
}

.has-rpg-icon.icon-bag,
.has-rpg-icon.icon-chest,
.has-rpg-icon.icon-ticket {
    --glyph-main: #ffd365;
    --glyph-accent: #fff0a8;
    --glyph-secondary: #b86a2f;
    --glyph-light: #fff8d0;
}

.has-rpg-icon.icon-wagon {
    --glyph-main: #bce873;
    --glyph-accent: #f0ffb8;
    --glyph-secondary: #638b3d;
    --glyph-light: #f8ffd4;
}

.has-rpg-icon.icon-party {
    --glyph-main: #9bc4ff;
    --glyph-accent: #e1edff;
    --glyph-secondary: #5076bd;
    --glyph-light: #f5fbff;
}

.has-rpg-icon.icon-star {
    --glyph-main: #ffe36f;
    --glyph-accent: #fff7bd;
    --glyph-secondary: #c47a30;
    --glyph-light: #fffbd8;
}

.has-rpg-icon.icon-comment,
.has-rpg-icon.icon-envelope {
    --glyph-main: #88d9ff;
    --glyph-accent: #def6ff;
    --glyph-secondary: #3d86af;
    --glyph-light: #f3fdff;
}

.has-rpg-icon.icon-heart {
    --glyph-main: #ff91ad;
    --glyph-accent: #ffd8e2;
    --glyph-secondary: #b33f68;
    --glyph-light: #fff1f6;
}

/* Header atmosphere pass: warmer RPG menu, less empty and less sad. */
.site-header {
    position: sticky;
    overflow: visible;
    background:
        radial-gradient(circle at 4.5rem 50%, rgba(91, 238, 205, .22), transparent 7.5rem),
        radial-gradient(circle at 50% -6rem, rgba(240, 167, 157, .36), transparent 28rem),
        radial-gradient(circle at 83% 50%, rgba(255, 199, 92, .12), transparent 16rem),
        linear-gradient(90deg, rgba(7, 7, 8, .98) 0%, rgba(35, 16, 24, .98) 36%, rgba(72, 35, 48, .96) 64%, rgba(24, 43, 43, .96) 100%);
    border-bottom: 1px solid rgba(255, 180, 139, .48);
    box-shadow:
        inset 0 -1px 0 rgba(255, 236, 205, .12),
        inset 0 -18px 34px rgba(0, 0, 0, .26),
        0 16px 38px rgba(0, 0, 0, .42);
}

.site-header::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, transparent 0 2%, rgba(255, 219, 166, .14) 10%, transparent 18% 82%, rgba(111, 231, 203, .14) 90%, transparent 98%),
        repeating-linear-gradient(90deg, rgba(255, 231, 199, .08) 0 1px, transparent 1px 46px);
    opacity: .42;
    mix-blend-mode: screen;
}

.site-header::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 2px;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(111, 231, 203, .7), rgba(255, 180, 139, .82), rgba(156, 123, 255, .5), rgba(111, 231, 203, .35));
    box-shadow: 0 0 16px rgba(240, 167, 157, .42);
}

@media (min-width: 1481px) {
    .site-header .nav-shell {
        grid-template-columns: 96px minmax(820px, 1fr) auto;
        min-height: 76px;
        padding: .5rem .9rem .5rem .36rem;
        gap: .9rem;
    }
}

.site-header .brand {
    width: 86px;
    min-width: 86px;
    min-height: 70px;
}

.site-header .brand > img:first-child {
    width: 70px;
    min-width: 70px;
    height: 70px;
    padding: 6px;
    border-color: rgba(111, 231, 203, .7);
    background:
        radial-gradient(circle at 50% 46%, rgba(111, 231, 203, .34), transparent 58%),
        radial-gradient(circle at 50% 50%, rgba(255, 179, 140, .22), transparent 74%),
        linear-gradient(145deg, rgba(9, 18, 18, .98), rgba(58, 28, 42, .95));
    box-shadow:
        inset 0 1px 0 rgba(255, 240, 214, .34),
        inset 0 0 22px rgba(111, 231, 203, .34),
        0 0 20px rgba(111, 231, 203, .45),
        0 0 42px rgba(240, 167, 157, .2),
        0 12px 26px rgba(0, 0, 0, .46);
}

.site-header .nav-links,
.site-header .nav-actions {
    position: relative;
    align-items: center;
    padding: .34rem .42rem;
    border: 1px solid rgba(255, 188, 151, .24);
    border-radius: 10px;
    background:
        radial-gradient(circle at 12% 0%, rgba(255, 213, 159, .13), transparent 52%),
        radial-gradient(circle at 86% 100%, rgba(111, 231, 203, .1), transparent 50%),
        linear-gradient(180deg, rgba(69, 39, 49, .84), rgba(23, 14, 19, .74));
    box-shadow:
        inset 0 1px 0 rgba(255, 236, 213, .16),
        inset 0 -12px 24px rgba(0, 0, 0, .2),
        0 10px 24px rgba(0, 0, 0, .22);
}

.site-header .nav-links {
    gap: .38rem;
}

.site-header .nav-actions {
    gap: .42rem;
}

.site-header .nav-item,
.site-header .icon-link,
.site-header .cart-pill {
    min-height: 50px;
    padding: .4rem .62rem;
    border: 1px solid rgba(255, 196, 163, .24);
    border-radius: 8px;
    color: #ffe9d8;
    background:
        linear-gradient(180deg, rgba(255, 210, 181, .08), transparent 42%),
        linear-gradient(145deg, rgba(87, 46, 57, .78), rgba(34, 18, 25, .82));
    box-shadow:
        inset 0 1px 0 rgba(255, 240, 220, .17),
        inset 0 -10px 18px rgba(0, 0, 0, .16);
    text-shadow: 0 1px 0 rgba(0, 0, 0, .66), 0 0 10px rgba(255, 190, 153, .14);
}

.site-header .nav-item:hover,
.site-header .icon-link:hover,
.site-header .cart-pill:hover,
.site-header .nav-links a[aria-current="page"] {
    color: #fff6e8;
    border-color: rgba(255, 207, 174, .55);
    background:
        radial-gradient(circle at 18% 15%, rgba(255, 241, 210, .18), transparent 42%),
        linear-gradient(145deg, rgba(126, 61, 62, .86), rgba(51, 25, 34, .86));
    box-shadow:
        inset 0 1px 0 rgba(255, 244, 224, .22),
        inset 0 -10px 18px rgba(0, 0, 0, .12),
        0 0 18px rgba(240, 167, 157, .24);
}

.site-header .nav-glyph,
.site-header .rpg-icon {
    width: 40px;
    min-width: 40px;
    height: 40px;
}

.site-header .nav-glyph.is-long,
.site-header .rpg-icon.is-long {
    width: 44px;
    min-width: 44px;
    height: 44px;
}

.site-header .has-rpg-icon:not(.icon-inventory) {
    border-color: color-mix(in srgb, var(--glyph-edge) 88%, transparent);
    box-shadow:
        inset 1px 1px 0 rgba(255, 248, 226, .44),
        inset -1px -1px 0 rgba(17, 6, 11, .42),
        inset 0 -9px 16px rgba(10, 4, 8, .24),
        0 0 15px color-mix(in srgb, var(--glyph-glow) 88%, transparent),
        0 8px 18px rgba(0, 0, 0, .34);
}

.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg {
    width: 94%;
    height: 94%;
    filter:
        drop-shadow(0 1px 0 rgba(7, 3, 6, .82))
        drop-shadow(0 0 8px color-mix(in srgb, var(--glyph-glow) 96%, transparent));
}

.site-header .language-switcher {
    min-height: 50px;
    padding: .22rem .34rem;
    border-color: rgba(255, 196, 163, .24);
    background:
        linear-gradient(180deg, rgba(255, 210, 181, .08), transparent 42%),
        linear-gradient(145deg, rgba(50, 28, 38, .78), rgba(22, 14, 19, .82));
}

.site-header .language-switcher a {
    min-height: 34px;
    color: #ffe9d8;
}

.site-header .language-switcher a.is-active {
    background: linear-gradient(180deg, #f6b1a4, #cc8074);
    color: #1d0d12;
}

.site-header .cart-pill {
    border-color: rgba(255, 198, 108, .32);
}

.site-header .cart-pill strong {
    color: #ffd77a;
    text-shadow: 0 0 10px rgba(255, 215, 122, .35);
}

/* Final RPG HUD pass: game-like menu slots instead of a classic website navbar. */
.site-header {
    background:
        linear-gradient(180deg, rgba(8, 7, 8, .98) 0%, rgba(33, 20, 26, .98) 46%, rgba(12, 11, 12, .98) 100%);
    border-bottom: 0;
    box-shadow:
        inset 0 -2px 0 rgba(20, 10, 12, .9),
        inset 0 -6px 0 rgba(151, 91, 54, .22),
        0 18px 40px rgba(0, 0, 0, .5);
}

.site-header::before {
    background:
        linear-gradient(90deg, rgba(83, 220, 190, .28), transparent 9rem),
        linear-gradient(270deg, rgba(255, 189, 97, .2), transparent 13rem),
        repeating-linear-gradient(90deg, transparent 0 25px, rgba(255, 231, 184, .055) 25px 26px);
    opacity: .74;
    mix-blend-mode: screen;
}

.site-header::after {
    height: 5px;
    background:
        linear-gradient(90deg, #58e5c4, #d89b5f 16%, #ffcf79 50%, #b98cff 78%, #58e5c4);
    box-shadow:
        0 0 14px rgba(255, 207, 121, .55),
        0 -6px 18px rgba(88, 229, 196, .18);
}

@media (min-width: 1481px) {
    .site-header .nav-shell {
        grid-template-columns: 104px minmax(820px, 1fr) auto;
        min-height: 86px;
        padding: .58rem 1rem .7rem .48rem;
        gap: .95rem;
    }
}

.site-header .brand {
    width: 94px;
    min-width: 94px;
    min-height: 78px;
}

.site-header .brand > img:first-child {
    width: 78px;
    min-width: 78px;
    height: 78px;
    padding: 7px;
    border: 2px solid rgba(219, 155, 84, .68);
    border-radius: 12px;
    background:
        radial-gradient(circle at 50% 46%, rgba(88, 229, 196, .34), transparent 58%),
        linear-gradient(135deg, rgba(51, 31, 21, .92), rgba(18, 23, 23, .96));
    box-shadow:
        inset 0 0 0 1px rgba(255, 232, 191, .18),
        inset 0 0 22px rgba(88, 229, 196, .28),
        0 0 0 1px rgba(16, 8, 10, .9),
        0 0 24px rgba(88, 229, 196, .45),
        0 0 42px rgba(219, 155, 84, .25),
        0 14px 28px rgba(0, 0, 0, .52);
    clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px);
}

.site-header .nav-links,
.site-header .nav-actions {
    gap: .5rem;
    padding: .5rem .58rem;
    border: 2px solid rgba(185, 116, 66, .72);
    border-radius: 0;
    background:
        radial-gradient(circle at 50% 0%, rgba(255, 210, 143, .16), transparent 58%),
        linear-gradient(180deg, rgba(72, 45, 38, .98), rgba(28, 18, 21, .98) 52%, rgba(12, 11, 12, .98));
    box-shadow:
        inset 0 0 0 1px rgba(255, 226, 182, .16),
        inset 0 10px 18px rgba(255, 221, 166, .06),
        inset 0 -16px 24px rgba(0, 0, 0, .3),
        0 0 0 1px rgba(10, 5, 6, .9),
        0 14px 28px rgba(0, 0, 0, .42);
    clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 12px, 100% calc(100% - 12px), calc(100% - 12px) 100%, 12px 100%, 0 calc(100% - 12px), 0 12px);
}

.site-header .nav-item,
.site-header .icon-link,
.site-header .cart-pill {
    position: relative;
    min-height: 54px;
    padding: .44rem .72rem .44rem .5rem;
    gap: .54rem;
    border: 1px solid rgba(255, 198, 129, .42);
    border-radius: 0;
    color: #fff0dc;
    background:
        linear-gradient(180deg, rgba(255, 232, 188, .12), rgba(255, 232, 188, .02) 40%, rgba(0, 0, 0, .16)),
        linear-gradient(135deg, rgba(91, 47, 45, .92), rgba(35, 20, 25, .94));
    box-shadow:
        inset 0 1px 0 rgba(255, 240, 210, .25),
        inset 0 -10px 18px rgba(0, 0, 0, .22),
        0 4px 0 rgba(0, 0, 0, .24);
    clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
    text-shadow: 0 2px 0 rgba(0, 0, 0, .72), 0 0 9px rgba(255, 205, 154, .2);
}

.site-header .nav-item::before,
.site-header .icon-link::before,
.site-header .cart-pill::before {
    content: "";
    position: absolute;
    inset: 3px;
    border: 1px solid rgba(255, 226, 178, .12);
    clip-path: inherit;
    pointer-events: none;
}

.site-header .nav-item:hover,
.site-header .icon-link:hover,
.site-header .cart-pill:hover,
.site-header .nav-links a[aria-current="page"] {
    transform: translateY(-1px);
    border-color: rgba(255, 221, 139, .78);
    color: #fff8e8;
    background:
        radial-gradient(circle at 25% 20%, rgba(255, 231, 173, .24), transparent 44%),
        linear-gradient(135deg, rgba(133, 64, 55, .98), rgba(49, 25, 31, .98));
    box-shadow:
        inset 0 1px 0 rgba(255, 246, 222, .36),
        inset 0 -10px 18px rgba(0, 0, 0, .18),
        0 0 18px rgba(255, 193, 108, .3),
        0 6px 0 rgba(0, 0, 0, .22);
}

.site-header .nav-glyph,
.site-header .rpg-icon {
    width: 42px;
    min-width: 42px;
    height: 42px;
    border-width: 2px;
    border-radius: 9px;
}

.site-header .nav-glyph.is-long,
.site-header .rpg-icon.is-long {
    width: 46px;
    min-width: 46px;
    height: 46px;
}

.site-header .has-rpg-icon:not(.icon-inventory) {
    background:
        radial-gradient(circle at 28% 20%, rgba(255, 248, 220, .62), transparent 24%),
        radial-gradient(circle at 72% 78%, var(--glyph-glow), transparent 56%),
        linear-gradient(145deg, var(--glyph-facet-a) 0%, var(--glyph-core) 48%, var(--glyph-deep) 100%);
    box-shadow:
        inset 0 0 0 1px rgba(255, 239, 200, .18),
        inset 0 -11px 16px rgba(0, 0, 0, .24),
        0 0 14px color-mix(in srgb, var(--glyph-glow) 88%, transparent),
        0 7px 14px rgba(0, 0, 0, .36);
}

.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg {
    width: 91%;
    height: 91%;
    filter:
        drop-shadow(0 1px 0 rgba(8, 3, 5, .88))
        drop-shadow(0 0 7px color-mix(in srgb, var(--glyph-glow) 90%, transparent));
}

.site-header .language-switcher {
    min-height: 54px;
    border: 1px solid rgba(255, 198, 129, .42);
    border-radius: 0;
    background:
        linear-gradient(180deg, rgba(255, 232, 188, .1), rgba(255, 232, 188, .02) 42%, rgba(0, 0, 0, .12)),
        linear-gradient(135deg, rgba(48, 29, 37, .94), rgba(20, 15, 18, .96));
    clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
}

.site-header .language-switcher a.is-active {
    background: linear-gradient(180deg, #ffc59c, #d98769);
    color: #1b0d10;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 0 12px rgba(255, 197, 156, .32);
}

/* Icon polish pass: make every nav logo feel like a crafted RPG item. */
.site-header .brand {
    position: relative;
    isolation: isolate;
}

.site-header .brand::before {
    content: "";
    position: absolute;
    inset: 1px 8px;
    z-index: -1;
    background:
        radial-gradient(circle, rgba(88, 229, 196, .34), transparent 62%),
        conic-gradient(from 45deg, rgba(255, 207, 121, .72), rgba(88, 229, 196, .6), rgba(185, 140, 255, .45), rgba(255, 207, 121, .72));
    filter: blur(8px);
    opacity: .85;
}

.site-header .brand > img:first-child {
    outline: 1px solid rgba(255, 231, 181, .22);
    outline-offset: -7px;
    filter:
        saturate(1.28)
        contrast(1.12)
        drop-shadow(0 0 10px rgba(88, 229, 196, .48))
        drop-shadow(0 0 12px rgba(255, 189, 97, .22));
}

.site-header .has-rpg-icon {
    isolation: isolate;
    overflow: hidden;
    border-radius: 0;
    clip-path: polygon(7px 0, calc(100% - 7px) 0, 100% 7px, 100% calc(100% - 7px), calc(100% - 7px) 100%, 7px 100%, 0 calc(100% - 7px), 0 7px);
}

.site-header .has-rpg-icon::before {
    content: "";
    position: absolute;
    inset: 2px 3px auto 3px;
    z-index: 1;
    height: 45%;
    border-radius: 0;
    background:
        linear-gradient(180deg, rgba(255, 255, 231, .52), rgba(255, 255, 231, .12) 42%, transparent);
    clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% 100%, 0 100%, 0 5px);
    pointer-events: none;
    mix-blend-mode: screen;
}

.site-header .has-rpg-icon::after {
    content: "";
    position: absolute;
    inset: 4px;
    z-index: 3;
    border: 1px solid rgba(255, 239, 198, .2);
    border-radius: 0;
    clip-path: polygon(5px 0, calc(100% - 5px) 0, 100% 5px, 100% calc(100% - 5px), calc(100% - 5px) 100%, 5px 100%, 0 calc(100% - 5px), 0 5px);
    pointer-events: none;
}

.site-header .has-rpg-icon:not(.icon-inventory) {
    background:
        radial-gradient(circle at 25% 18%, rgba(255, 255, 235, .74), transparent 20%),
        radial-gradient(circle at 75% 80%, color-mix(in srgb, var(--glyph-glow) 86%, transparent), transparent 58%),
        linear-gradient(145deg, color-mix(in srgb, var(--glyph-facet-a) 92%, white 4%) 0%, var(--glyph-core) 46%, var(--glyph-deep) 100%);
    border-color: color-mix(in srgb, var(--glyph-edge) 96%, transparent);
    box-shadow:
        inset 0 0 0 1px rgba(255, 246, 214, .24),
        inset 2px 2px 0 rgba(255, 255, 235, .16),
        inset -2px -2px 0 rgba(8, 3, 5, .38),
        inset 0 -12px 18px rgba(0, 0, 0, .28),
        0 0 16px color-mix(in srgb, var(--glyph-glow) 92%, transparent),
        0 7px 14px rgba(0, 0, 0, .38);
}

.site-header .has-rpg-icon .rpg-svg {
    position: relative;
    z-index: 2;
    width: 96%;
    height: 96%;
    overflow: visible;
}

.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg {
    filter:
        drop-shadow(0 1px 0 rgba(5, 2, 4, .92))
        drop-shadow(0 0 8px color-mix(in srgb, var(--glyph-glow) 96%, transparent))
        drop-shadow(0 0 2px rgba(255, 248, 219, .25));
}

.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-main {
    stroke: rgba(22, 8, 14, .96);
    stroke-width: 1.05;
}

.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-accent,
.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-secondary,
.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-light-fill {
    stroke: rgba(24, 8, 14, .8);
    stroke-width: .8;
}

.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-outline {
    stroke: rgba(18, 7, 12, .98);
    stroke-width: 1.24;
}

.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-detail {
    stroke: rgba(255, 249, 221, .98);
    stroke-width: 1.16;
    filter: drop-shadow(0 0 2px rgba(255, 230, 177, .32));
}

.site-header .has-rpg-icon:not(.icon-inventory) .rpg-svg .icon-shine {
    stroke: rgba(255, 255, 245, .98);
    stroke-width: 1.05;
}

.site-header .has-rpg-icon.icon-home,
.site-header .has-rpg-icon.icon-portal {
    --glyph-core: #d75146;
    --glyph-deep: #672341;
    --glyph-edge: #ffd6a7;
    --glyph-facet-a: #ffb45f;
    --glyph-glow: rgba(255, 154, 101, .58);
}

.site-header .has-rpg-icon.icon-d20,
.site-header .has-rpg-icon.icon-gem {
    --glyph-core: #1eb99f;
    --glyph-deep: #124f59;
    --glyph-edge: #b9fff0;
    --glyph-facet-a: #79f7d7;
    --glyph-glow: rgba(95, 255, 216, .62);
}

.site-header .has-rpg-icon.icon-lineage {
    --glyph-core: #b96866;
    --glyph-deep: #52253c;
    --glyph-edge: #ffd1bf;
    --glyph-facet-a: #ffa195;
    --glyph-glow: rgba(255, 149, 131, .56);
}

.site-header .has-rpg-icon.icon-codex,
.site-header .has-rpg-icon.icon-journal {
    --glyph-core: #7d54c9;
    --glyph-deep: #33225d;
    --glyph-edge: #ffe9a8;
    --glyph-facet-a: #b991ff;
    --glyph-glow: rgba(186, 145, 255, .58);
}

.site-header .has-rpg-icon.icon-quill,
.site-header .has-rpg-icon.icon-sword,
.site-header .has-rpg-icon.icon-anvil {
    --glyph-core: #b74d4d;
    --glyph-deep: #4f2430;
    --glyph-edge: #ffd6c4;
    --glyph-facet-a: #ff9a84;
    --glyph-glow: rgba(255, 135, 113, .58);
}

.site-header .has-rpg-icon.icon-grimoire {
    --glyph-core: #7e58c9;
    --glyph-deep: #30245c;
    --glyph-edge: #ead4ff;
    --glyph-facet-a: #b897ff;
    --glyph-glow: rgba(188, 151, 255, .6);
}

.site-header .has-rpg-icon.icon-inventory {
    box-shadow:
        inset 0 0 0 1px rgba(255, 248, 215, .25),
        inset 2px 2px 0 rgba(255, 255, 235, .16),
        inset -2px -2px 0 rgba(8, 3, 5, .36),
        0 0 18px rgba(255, 198, 80, .46),
        0 7px 14px rgba(0, 0, 0, .38);
}

/* Blackthorn palette pass: keep the RPG HUD, remove the RGB arcade feeling. */
.site-header::before {
    background:
        linear-gradient(90deg, rgba(82, 130, 120, .2), transparent 9rem),
        linear-gradient(270deg, rgba(204, 128, 116, .16), transparent 13rem),
        repeating-linear-gradient(90deg, transparent 0 25px, rgba(216, 199, 190, .045) 25px 26px);
    opacity: .7;
}

.site-header::after {
    bottom: -24px;
    height: 58px;
    background-color: transparent;
    background-image: url("../img/header-thorn-border-transparent.png");
    background-position: center 0;
    background-size: 100% 58px;
    background-repeat: no-repeat;
    box-shadow: none;
    filter:
        drop-shadow(0 0 8px rgba(82, 130, 120, .28))
        drop-shadow(0 -2px 7px rgba(204, 128, 116, .16));
    opacity: .98;
}

.site-header .nav-shell {
    position: relative;
}

.site-header .nav-shell::before,
.site-header .nav-shell::after {
    content: none;
}

.site-header .nav-shell::before {
    top: .12rem;
    background-position: center 18%;
}

.site-header .nav-shell::after {
    bottom: .1rem;
    background-position: center 82%;
    transform: scaleY(-1);
}

.site-header .brand::before {
    background:
        radial-gradient(circle, rgba(82, 130, 120, .42), transparent 62%),
        conic-gradient(from 45deg, rgba(204, 128, 116, .68), rgba(82, 130, 120, .58), rgba(72, 46, 56, .62), rgba(240, 167, 157, .54), rgba(204, 128, 116, .68));
}

.site-header .brand > img:first-child {
    border-color: rgba(204, 128, 116, .72);
    background:
        radial-gradient(circle at 50% 46%, rgba(82, 130, 120, .32), transparent 58%),
        linear-gradient(135deg, rgba(72, 46, 56, .92), rgba(14, 18, 18, .96));
    box-shadow:
        inset 0 0 0 1px rgba(240, 167, 157, .2),
        inset 0 0 22px rgba(82, 130, 120, .24),
        0 0 0 1px rgba(16, 8, 10, .9),
        0 0 22px rgba(82, 130, 120, .38),
        0 0 34px rgba(204, 128, 116, .22),
        0 14px 28px rgba(0, 0, 0, .52);
    filter:
        saturate(1.18)
        contrast(1.12)
        drop-shadow(0 0 10px rgba(82, 130, 120, .44))
        drop-shadow(0 0 10px rgba(204, 128, 116, .18));
}

.site-header .has-rpg-icon.icon-scroll {
    --glyph-core: #805143;
    --glyph-deep: #3f2530;
    --glyph-edge: #f0a79d;
    --glyph-facet-a: #cc8074;
    --glyph-glow: rgba(204, 128, 116, .48);
}

.site-header .has-rpg-icon.icon-sigil {
    --glyph-core: #528278;
    --glyph-deep: #273f41;
    --glyph-edge: #f0a79d;
    --glyph-facet-a: #6f9c91;
    --glyph-glow: rgba(82, 130, 120, .54);
}

.site-header .has-rpg-icon.icon-key {
    --glyph-core: #cc8074;
    --glyph-deep: #482e38;
    --glyph-edge: #f6eee8;
    --glyph-facet-a: #f0a79d;
    --glyph-glow: rgba(204, 128, 116, .5);
}

.site-header .has-rpg-icon.icon-codex,
.site-header .has-rpg-icon.icon-journal,
.site-header .has-rpg-icon.icon-grimoire {
    --glyph-core: #6a4355;
    --glyph-deep: #271a22;
    --glyph-edge: #f0a79d;
    --glyph-facet-a: #805143;
    --glyph-glow: rgba(204, 128, 116, .38);
}

@media (max-width: 980px) {
    .site-header::after {
        content: none;
    }

    .site-header .nav-shell::before,
    .site-header .nav-shell::after {
        left: .9rem;
        right: .9rem;
        opacity: .1;
    }
}

.invoice-document {
    width: min(100% - 2rem, 1040px);
    margin: 4rem auto;
    padding: 3rem;
    color: #1a1113;
    background: #fffaf4;
    border: 1px solid #d6c8bf;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .34);
}

.invoice-document,
.invoice-document p,
.invoice-document address,
.invoice-document pre,
.invoice-document td,
.invoice-document th,
.invoice-document dt,
.invoice-document dd,
.invoice-document small,
.invoice-document span {
    color: #1a1113;
    font-family: var(--font-body);
    font-weight: 900;
    letter-spacing: 0;
}

.invoice-document__top,
.invoice-parties,
.invoice-meta {
    display: grid;
    gap: 1.4rem;
}

.invoice-document__top {
    grid-template-columns: 1.4fr .8fr;
    align-items: start;
    padding-bottom: 1.6rem;
    border-bottom: 2px solid #1a1113;
}

.invoice-brand {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.invoice-logo {
    width: 25%;
    height: 25%;
    object-fit: contain;
    padding: .35rem;
}

.invoice-brand h2,
.invoice-title-block strong {
    margin: 0;
    color: #1a1113;
    font-family: var(--font-title);
    font-weight: 900;
    line-height: 1;
}

.invoice-brand h2 {
    font-size: clamp(2.1rem, 4vw, 3.4rem);
}

.invoice-brand p,
.invoice-title-block small,
.invoice-note {
    margin: .35rem 0 0;
    color: #4b3734;
}

.invoice-title-block {
    text-align: right;
}

.invoice-title-block span {
    display: block;
    color: #8e564e;
    text-transform: uppercase;
}

.invoice-title-block strong {
    display: block;
    margin-top: .35rem;
    font-size: clamp(1.7rem, 3.2vw, 2.8rem);
}

.invoice-parties {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 2rem;
}

.invoice-parties article {
    min-height: 190px;
    padding: 1.25rem;
    border: 1px solid #d6c8bf;
    background: #fff;
}

.invoice-parties strong,
.invoice-meta span {
    display: block;
    color: #8e564e;
    text-transform: uppercase;
}

.invoice-parties address,
.invoice-parties p,
.invoice-parties pre {
    margin: .7rem 0 0;
    font-style: normal;
    white-space: pre-wrap;
}

.invoice-meta {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 1.4rem 0 2rem;
}

.invoice-meta div {
    padding: 1rem;
    border: 1px solid #d6c8bf;
    background: #f7eee7;
}

.invoice-meta strong {
    display: block;
    margin-top: .35rem;
    color: #1a1113;
}

.invoice-table {
    overflow-x: auto;
    border: 1px solid #1a1113;
}

.invoice-table table {
    width: 100%;
    border-collapse: collapse;
}

.invoice-table th,
.invoice-table td {
    padding: 1rem;
    text-align: left;
    border-bottom: 1px solid #d6c8bf;
}

.invoice-table th {
    color: #fffaf4;
    background: #1a1113;
    text-transform: uppercase;
}

.invoice-table td:nth-child(3),
.invoice-table td:nth-child(4),
.invoice-table td:nth-child(5),
.invoice-table th:nth-child(3),
.invoice-table th:nth-child(4),
.invoice-table th:nth-child(5) {
    text-align: right;
}

.invoice-table td:first-child,
.invoice-table th:first-child {
    width: 76px;
}

.invoice-product-thumb {
    width: 58px;
    height: 58px;
    object-fit: cover;
    border-radius: 7px;
}

.invoice-totals {
    width: min(100%, 420px);
    margin: 2rem 0 0 auto;
}

.invoice-totals div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .65rem 0;
    border-bottom: 1px solid #d6c8bf;
}

.invoice-totals .total {
    font-size: 1.4rem;
    border-bottom: 2px solid #1a1113;
}

.invoice-totals .total dt,
.invoice-totals .total dd {
    font-family: var(--font-title);
}

.invoice-note {
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid #d6c8bf;
}

@media (max-width: 760px) {
    .invoice-document {
        width: min(100% - 1rem, 1040px);
        margin: 2rem auto;
        padding: 1.25rem;
    }

    .invoice-document__top,
    .invoice-parties,
    .invoice-meta {
        grid-template-columns: 1fr;
    }

    .invoice-title-block {
        text-align: left;
    }

    .invoice-brand {
        align-items: flex-start;
    }

    .invoice-logo {
        width: 74px;
        height: 74px;
    }
}

@page {
    size: A4;
    margin: 12mm;
}

@media print {
    .site-header,
    .site-footer,
    .newsletter-band,
    .entry-veil,
    .invoice-hero,
    .flash-stack {
        display: none !important;
    }

    html,
    body {
        width: 210mm;
        min-height: 297mm;
        background: #fff !important;
        color: #111 !important;
    }

    body::before {
        display: none !important;
    }

    .invoice-document {
        width: 100%;
        margin: 0;
        padding: 0;
        color: #111;
        background: #fff !important;
        border: 0;
        box-shadow: none;
    }

    .invoice-logo {
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .invoice-table,
    .invoice-table tr,
    .invoice-parties article,
    .invoice-meta div,
    .invoice-totals div {
        break-inside: avoid;
    }
}

/* Admin sidebar scroll fix: the menu can grow without blocking dashboard access. */
body.admin-body {
    min-height: 100vh;
    overflow-x: hidden;
}

body.admin-body .admin-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    max-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

body.admin-body .admin-brand,
body.admin-body .admin-language {
    flex: 0 0 auto;
}

body.admin-body .admin-nav {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: .25rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(204, 128, 116, .72) rgba(8, 5, 7, .42);
}

body.admin-body .admin-nav::-webkit-scrollbar {
    width: 8px;
}

body.admin-body .admin-nav::-webkit-scrollbar-track {
    background: rgba(8, 5, 7, .42);
}

body.admin-body .admin-nav::-webkit-scrollbar-thumb {
    background: rgba(204, 128, 116, .72);
    border-radius: 999px;
}

/* Checkout addresses: saved grimoires, separate billing, clean autocomplete. */
.saved-addresses {
    display: grid;
    gap: .5rem;
    margin: .2rem 0 .8rem;
}

.saved-addresses.compact {
    margin-bottom: .4rem;
}

.saved-address-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
}

.saved-address-card {
    min-height: 104px;
    display: grid;
    justify-items: start;
    align-content: start;
    gap: .18rem;
    padding: .78rem;
    text-align: left;
    color: #f7e9df;
    background:
        radial-gradient(circle at 12% 10%, rgba(240, 167, 157, .18), transparent 5rem),
        linear-gradient(145deg, rgba(72, 46, 56, .82), rgba(11, 7, 9, .86));
    border-color: rgba(240, 167, 157, .32);
    box-shadow: inset 0 0 18px rgba(204, 128, 116, .1);
}

.saved-address-card span {
    color: #f0a79d;
    font-size: .72rem;
    text-transform: uppercase;
}

.saved-address-card strong,
.saved-address-card small {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.saved-address-card small {
    color: #d8c7be;
}

.saved-address-card.is-selected {
    border-color: rgba(255, 219, 178, .78);
    box-shadow:
        inset 0 0 0 1px rgba(255, 219, 178, .2),
        inset 0 0 24px rgba(204, 128, 116, .16),
        0 0 18px rgba(204, 128, 116, .18);
}

.saved-address-card--new {
    border-style: dashed;
    background:
        radial-gradient(circle at 12% 10%, rgba(82, 130, 120, .18), transparent 5rem),
        linear-gradient(145deg, rgba(39, 63, 65, .58), rgba(11, 7, 9, .84));
}

.address-fields[hidden] {
    display: none !important;
}

.billing-toggle {
    margin: .95rem 0 .25rem;
    padding: .75rem .85rem;
    border: 1px solid rgba(240, 167, 157, .28);
    border-radius: 8px;
    background: rgba(255, 232, 218, .04);
}

.billing-fields {
    display: grid;
    gap: .85rem;
    margin: .5rem 0 1rem;
    padding: 1rem;
    border: 1px solid rgba(82, 130, 120, .38);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(246, 238, 232, .07), rgba(246, 238, 232, .025)),
        rgba(8, 6, 8, .38);
}

.billing-fields[hidden],
.address-suggestions[hidden],
.address-suggestions:empty {
    display: none !important;
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

.address-autocomplete-wrap {
    position: relative;
}

.admin-grid.compact {
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: .75rem;
}

@media (max-width: 860px) {
    body.admin-body {
        display: block;
    }

    body.admin-body .admin-sidebar {
        position: relative;
        height: auto;
        max-height: none;
        overflow: visible;
    }

    body.admin-body .admin-nav {
        max-height: 52vh;
        overflow-y: auto;
    }

    .admin-grid.compact {
        grid-template-columns: 1fr;
    }

    .saved-address-grid {
        grid-template-columns: 1fr;
    }
}

/* True final layout pass: restored home rhythm, separated lore/codex rooms and FAQ cards. */
.hero,
.intro-grid,
.home-collection-section,
.featured-relics-section,
.popular-relics-section,
.craft-band,
.traveler-words,
.newsletter-band,
.legend-hero.legend-hero--text-only,
.content-section {
    width: min(1240px, calc(100% - 2rem)) !important;
}

.section-rune.has-rpg-icon,
.content-rune.has-rpg-icon,
.faq-rune.has-rpg-icon {
    flex: 0 0 auto;
    overflow: hidden;
}

.section-rune.has-rpg-icon .rpg-svg {
    display: block;
    width: 78% !important;
    height: 78% !important;
    margin: auto;
}

.content-rune.has-rpg-icon .rpg-svg,
.faq-rune.has-rpg-icon .rpg-svg {
    display: block;
    width: 76% !important;
    height: 76% !important;
    margin: auto;
}

.section-rune.has-rpg-icon .rpg-svg *,
.content-rune.has-rpg-icon .rpg-svg *,
.faq-rune.has-rpg-icon .rpg-svg * {
    vector-effect: non-scaling-stroke;
}

.admin-table td.table-actions {
    display: table-cell !important;
    min-height: 0;
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

.admin-table td.table-actions > a,
.admin-table td.table-actions > form {
    display: inline-flex !important;
    vertical-align: middle;
    margin: .2rem 0 .2rem .55rem !important;
}

.admin-table td.table-actions form {
    gap: 0 !important;
}

.admin-table td.table-actions > a,
.admin-table td.table-actions button {
    display: inline-grid !important;
    place-items: center;
    min-height: 48px;
    padding: .6rem .88rem;
    border: 1px solid rgba(240, 167, 157, .36);
    border-radius: 8px;
    background:
        radial-gradient(circle at 18% 0, rgba(240, 167, 157, .18), transparent 5rem),
        linear-gradient(145deg, rgba(72, 46, 56, .76), rgba(11, 7, 9, .86));
    color: #ffd3c9;
    line-height: 1;
    text-decoration: none;
}

.admin-table td.table-actions button {
    background:
        radial-gradient(circle at 18% 0, rgba(82, 130, 120, .18), transparent 5rem),
        linear-gradient(145deg, rgba(39, 63, 65, .82), rgba(11, 7, 9, .86));
}

.legend-route-section {
    width: min(1240px, calc(100% - 2rem)) !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.legend-route-section::before {
    display: none !important;
    content: none !important;
}

.legend-route-section .section-heading {
    padding-bottom: 1rem;
    border-bottom: 1px solid rgba(240, 167, 157, .22);
}

.legend-route-section .timeline {
    margin-top: 1rem;
}

.legend-route-section .timeline article {
    background:
        radial-gradient(circle at 12% 0, rgba(240, 167, 157, .12), transparent 9rem),
        linear-gradient(145deg, rgba(55, 30, 38, .62), rgba(10, 8, 10, .72));
    border: 1px solid rgba(204, 128, 116, .26);
    border-radius: var(--radius);
    padding: 1rem;
    border-top: 2px solid rgba(240, 167, 157, .7);
}

.home-collection-section .collection-grid,
.featured-relics-section .featured-product-grid,
.popular-relics-section .product-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    justify-content: stretch !important;
    align-items: stretch !important;
    gap: 1.35rem !important;
}

.home-collection-section .collection-card,
.featured-relics-section .product-card,
.popular-relics-section .product-card {
    width: auto !important;
    max-width: none !important;
    min-height: 100%;
}

.home-collection-section .collection-card {
    display: flex;
    flex-direction: column;
}

.home-collection-section .collection-card img {
    aspect-ratio: 1;
}

.home-collection-section .collection-card p {
    flex: 1;
}

.craft-band {
    display: block !important;
    min-height: 0 !important;
    padding: clamp(2rem, 4vw, 3.5rem) !important;
}

.craft-band > div:first-child {
    max-width: 820px !important;
}

.craft-band h2 {
    max-width: 12ch;
    line-height: .98;
}

.craft-band p {
    max-width: 68ch;
    line-height: 1.55;
}

.content-section {
    position: relative;
    padding: clamp(1.35rem, 2.5vw, 2.2rem) !important;
    border: 1px solid rgba(204, 128, 116, .28);
    border-radius: var(--radius);
    background:
        radial-gradient(circle at 8% 0, rgba(240, 167, 157, .13), transparent 18rem),
        linear-gradient(145deg, rgba(45, 24, 31, .72), rgba(9, 7, 9, .76));
    box-shadow: inset 0 1px 0 rgba(255, 239, 229, .06), 0 22px 58px rgba(0, 0, 0, .22);
}

.content-section::before {
    content: "";
    position: absolute;
    inset: .75rem;
    border: 1px solid rgba(240, 167, 157, .09);
    border-radius: calc(var(--radius) - 2px);
    pointer-events: none;
    background: none !important;
    background-image: none !important;
    width: auto;
    height: auto;
    opacity: 1;
}

.content-section + .content-section {
    margin-top: 5.2rem;
}

.content-section-legend_timeline,
.content-section-dice_guide {
    background:
        radial-gradient(circle at 10% 0, rgba(82, 130, 120, .18), transparent 19rem),
        linear-gradient(145deg, rgba(29, 42, 43, .76), rgba(9, 7, 9, .78));
}

.content-section-about,
.content-section-dice_guide_advice {
    background:
        radial-gradient(circle at 86% 8%, rgba(240, 167, 157, .17), transparent 18rem),
        linear-gradient(145deg, rgba(66, 38, 48, .78), rgba(9, 7, 9, .78));
}

.content-section-craft_process {
    background:
        radial-gradient(circle at 8% 0, rgba(214, 156, 92, .16), transparent 18rem),
        radial-gradient(circle at 92% 14%, rgba(82, 130, 120, .17), transparent 18rem),
        linear-gradient(145deg, rgba(58, 35, 34, .8), rgba(9, 7, 9, .8));
}

.content-section-faq {
    background:
        radial-gradient(circle at 10% 0, rgba(184, 231, 255, .12), transparent 18rem),
        linear-gradient(145deg, rgba(35, 28, 46, .78), rgba(9, 7, 9, .8));
}

.content-section .section-heading {
    position: relative;
    z-index: 1;
    padding-bottom: 1rem;
    margin-bottom: 1.35rem;
    border-bottom: 1px solid rgba(240, 167, 157, .18);
}

.content-section .section-heading::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: min(240px, 52%);
    height: 3px;
    background: linear-gradient(90deg, rgba(240, 167, 157, .72), rgba(82, 130, 120, .2), transparent);
}

.content-section__grid,
.timeline.legend-timeline,
.guide-grid,
.prose-panel.atelier-advice,
.faq-list {
    position: relative;
    z-index: 1;
}

.faq-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: start;
    gap: 1rem;
}

.faq-list details {
    height: fit-content;
}

.faq-list summary {
    min-height: 74px;
}

@media (max-width: 1100px) {
    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 620px) {
    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid,
    .faq-list {
        grid-template-columns: 1fr !important;
    }

    .content-section {
        padding: 1rem !important;
    }

    .craft-band {
        padding: 1.4rem !important;
    }

    .craft-band h2 {
        max-width: 100%;
    }
}

/* Final override: collection detail products must never stretch into oversized cards. */
.collection-products-section {
    width: min(1240px, calc(100% - 2rem)) !important;
}

.collection-products-section .collection-product-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 18.5rem), 20.75rem)) !important;
    justify-content: start !important;
    align-items: stretch !important;
    gap: 1.35rem !important;
}

.collection-products-section .collection-product-grid .product-card {
    width: 100% !important;
    max-width: 20.75rem !important;
    min-height: 100%;
}

.has-rpg-icon.icon-collection .rpg-svg {
    width: 80%;
    height: 80%;
    color: #9df5ea;
    stroke-width: 1.9;
    filter:
        drop-shadow(0 1px 0 rgba(255, 247, 213, .28))
        drop-shadow(0 0 9px rgba(117, 236, 212, .34));
}

.site-header .has-rpg-icon.icon-collection,
.admin-nav .has-rpg-icon.icon-collection {
    border-color: rgba(143, 240, 207, .72);
    background:
        radial-gradient(circle at 32% 18%, rgba(255, 248, 216, .42), transparent 43%),
        radial-gradient(circle at 68% 76%, rgba(117, 236, 212, .3), transparent 50%),
        linear-gradient(145deg, rgba(67, 124, 112, .96), rgba(43, 37, 54, .96));
}

@media (max-width: 620px) {
    .collection-products-section .collection-product-grid {
        grid-template-columns: 1fr !important;
    }

    .collection-products-section .collection-product-grid .product-card {
        max-width: none !important;
    }
}

/* Large desktop scale: keep 24" / 1920px untouched, then let the whole site breathe. */
@media (min-width: 2000px) {
    body {
        font-size: 1.015rem;
    }

    .site-header .nav-shell {
        width: min(1560px, calc(100% - 4rem)) !important;
    }

    .site-header .nav-links {
        justify-content: center;
    }

    .hero,
    .page-hero,
    .section,
    .intro-grid,
    .section-split,
    .craft-band,
    .traveler-words,
    .newsletter-band,
    .legend-hero,
    .legend-hero.legend-hero--text-only,
    .legend-route-section,
    .content-section,
    .collection-detail-hero,
    .product-lore,
    .article-page,
    .cart-layout,
    .checkout-layout,
    .account-grid,
    .prose-panel {
        width: min(1560px, calc(100% - 4rem)) !important;
    }

    .catalog-layout,
    .product-detail,
    .section:has(.product-grid),
    .home-collection-section,
    .featured-relics-section,
    .popular-relics-section,
    .collection-products-section {
        width: min(1840px, calc(100% - 4rem)) !important;
    }

    .admin-main,
    body.admin-body .admin-main {
        width: min(1560px, calc(100% - 3rem)) !important;
    }

    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid,
    .collection-products-section .collection-product-grid {
        gap: 1.65rem !important;
    }

    .collection-products-section .collection-product-grid {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 23.5rem)) !important;
    }

    .collection-products-section .collection-product-grid .product-card {
        max-width: 23.5rem !important;
    }

    .hero {
        min-height: min(920px, 82vh);
        padding: clamp(4rem, 5vw, 6.4rem) !important;
    }

    .content-section {
        padding: clamp(1.8rem, 2.2vw, 2.9rem) !important;
    }

    .craft-band > div:first-child {
        max-width: 980px !important;
    }

    .craft-band p {
        max-width: 78ch;
    }
}

@media (min-width: 2800px) {
    body {
        font-size: 1.045rem;
    }

    .site-header .nav-shell {
        width: min(1760px, calc(100% - 5rem)) !important;
    }

    .hero,
    .page-hero,
    .section,
    .intro-grid,
    .section-split,
    .craft-band,
    .traveler-words,
    .newsletter-band,
    .legend-hero,
    .legend-hero.legend-hero--text-only,
    .legend-route-section,
    .content-section,
    .collection-detail-hero,
    .product-lore,
    .article-page,
    .cart-layout,
    .checkout-layout,
    .account-grid,
    .prose-panel {
        width: min(1760px, calc(100% - 5rem)) !important;
    }

    .catalog-layout,
    .product-detail,
    .section:has(.product-grid),
    .home-collection-section,
    .featured-relics-section,
    .popular-relics-section,
    .collection-products-section {
        width: min(2200px, calc(100% - 5rem)) !important;
    }

    .admin-main,
    body.admin-body .admin-main {
        width: min(1760px, calc(100% - 4rem)) !important;
    }

    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid,
    .collection-products-section .collection-product-grid {
        gap: 2rem !important;
    }

    .collection-products-section .collection-product-grid {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 26.5rem)) !important;
    }

    .collection-products-section .collection-product-grid .product-card {
        max-width: 26.5rem !important;
    }
}

/* Home page: every main block uses the same showcase width as product sections. */
.hero,
.home-collection-section,
.featured-relics-section,
.popular-relics-section,
.craft-band,
.traveler-words,
.newsletter-band {
    width: min(1440px, calc(100% - 2rem)) !important;
}

@media (min-width: 2000px) {
    .hero,
    .home-collection-section,
    .featured-relics-section,
    .popular-relics-section,
    .craft-band,
    .traveler-words,
    .newsletter-band {
        width: min(1840px, calc(100% - 4rem)) !important;
    }
}

@media (min-width: 2800px) {
    .hero,
    .home-collection-section,
    .featured-relics-section,
    .popular-relics-section,
    .craft-band,
    .traveler-words,
    .newsletter-band {
        width: min(2200px, calc(100% - 5rem)) !important;
    }
}

/* Header final layout: compact HUD groups, not stretched content columns. */
@media (min-width: 1481px) {
    .site-header .nav-shell {
        width: min(1880px, calc(100% - 1.2rem)) !important;
        grid-template-columns: auto auto auto !important;
        grid-template-areas: "brand links actions" !important;
        justify-content: center !important;
        align-items: center !important;
        column-gap: .72rem !important;
    }

    .site-header .brand,
    .site-header .nav-links,
    .site-header .nav-actions {
        width: max-content !important;
        min-width: 0;
    }

    .site-header .brand {
        justify-self: end;
    }

    .site-header .nav-links {
        justify-content: center !important;
    }

    .site-header .nav-actions {
        justify-content: center !important;
    }
}

/* Public pages: use the newsletter/showcase width everywhere, not only on home. */
.page-hero,
.section,
.catalog-layout,
.cart-layout,
.checkout-layout,
.account-grid,
.product-detail,
.product-lore,
.article-page,
.collection-detail-hero,
.legend-hero,
.legend-hero.legend-hero--text-only,
.legend-route-section,
.content-section,
.prose-panel {
    width: min(1440px, calc(100% - 2rem)) !important;
}

@media (min-width: 2000px) {
    .page-hero,
    .section,
    .catalog-layout,
    .cart-layout,
    .checkout-layout,
    .account-grid,
    .product-detail,
    .product-lore,
    .article-page,
    .collection-detail-hero,
    .legend-hero,
    .legend-hero.legend-hero--text-only,
    .legend-route-section,
    .content-section,
    .prose-panel {
        width: min(1840px, calc(100% - 4rem)) !important;
    }
}

@media (min-width: 2800px) {
    .page-hero,
    .section,
    .catalog-layout,
    .cart-layout,
    .checkout-layout,
    .account-grid,
    .product-detail,
    .product-lore,
    .article-page,
    .collection-detail-hero,
    .legend-hero,
    .legend-hero.legend-hero--text-only,
    .legend-route-section,
    .content-section,
    .prose-panel {
        width: min(2200px, calc(100% - 5rem)) !important;
    }
}

/* Page title panels: same width as the site, with enough height to feel intentional. */
.page-hero {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    min-height: clamp(260px, 17vw, 390px);
    padding: clamp(3rem, 4.8vw, 5.5rem) !important;
}

.page-hero.small h1,
.page-hero h1 {
    font-size: clamp(3.1rem, 4.8vw, 6rem);
    line-height: .98;
}

.page-hero p:not(.eyebrow) {
    max-width: 74ch;
    font-size: clamp(1.08rem, 1.05vw, 1.28rem);
    line-height: 1.55;
}

.page-hero .eyebrow {
    font-size: clamp(.86rem, .78vw, 1rem);
}

@media (min-width: 2000px) {
    .page-hero {
        min-height: clamp(320px, 15vw, 460px);
        padding: clamp(4rem, 4.4vw, 6.5rem) !important;
    }
}

@media (max-width: 760px) {
    .page-hero {
        min-height: 0;
        padding: 2rem 1.35rem !important;
    }

    .page-hero.small h1,
    .page-hero h1 {
        font-size: clamp(2.3rem, 12vw, 3.6rem);
    }
}

/* Collections glyph: keep the relic-stack icon, but bring it back into the Blackthorn palette. */
.site-header .has-rpg-icon.icon-collection,
.admin-nav .has-rpg-icon.icon-collection,
.has-rpg-icon.icon-collection {
    --glyph-core: #ba6864;
    --glyph-deep: #4b2635;
    --glyph-edge: #ffd3c7;
    --glyph-facet-a: #f0a79d;
    --glyph-facet-b: #7d3c55;
    --glyph-symbol: #fff1e8;
    --glyph-fill: rgba(255, 202, 182, .38);
    --glyph-glow: rgba(240, 167, 157, .52);
    --glyph-main: #f0a79d;
    --glyph-accent: #ffd4c8;
    --glyph-secondary: #7b3a4d;
    --glyph-light: #fff0df;
}

.site-header .has-rpg-icon.icon-collection,
.admin-nav .has-rpg-icon.icon-collection {
    border-color: rgba(240, 167, 157, .74) !important;
    background:
        radial-gradient(circle at 32% 18%, rgba(255, 248, 216, .42), transparent 43%),
        radial-gradient(circle at 68% 76%, rgba(204, 128, 116, .28), transparent 50%),
        linear-gradient(145deg, rgba(143, 68, 74, .96), rgba(66, 29, 39, .96)) !important;
}

.has-rpg-icon.icon-collection .rpg-svg {
    color: #fff1e8 !important;
    filter:
        drop-shadow(0 1px 0 rgba(30, 8, 13, .48))
        drop-shadow(0 0 8px rgba(240, 167, 157, .34)) !important;
}

/* Reliquary glyph: less neon, more dark resin and Blackthorn green. */
.site-header .has-rpg-icon.icon-d20,
.admin-nav .has-rpg-icon.icon-d20,
.has-rpg-icon.icon-d20 {
    --glyph-core: #528278;
    --glyph-deep: #263a3c;
    --glyph-edge: #d7eee6;
    --glyph-facet-a: #86b6a9;
    --glyph-facet-b: #385f5d;
    --glyph-symbol: #f2fff9;
    --glyph-fill: rgba(134, 182, 169, .32);
    --glyph-glow: rgba(82, 130, 120, .44);
    --glyph-main: #86b6a9;
    --glyph-accent: #d6f1e8;
    --glyph-secondary: #345757;
    --glyph-light: #effff9;
}

.site-header .has-rpg-icon.icon-d20,
.admin-nav .has-rpg-icon.icon-d20 {
    border-color: rgba(174, 217, 204, .6) !important;
    background:
        radial-gradient(circle at 32% 18%, rgba(246, 238, 232, .36), transparent 43%),
        radial-gradient(circle at 68% 76%, rgba(82, 130, 120, .28), transparent 50%),
        linear-gradient(145deg, rgba(82, 130, 120, .88), rgba(47, 42, 52, .96)) !important;
}

.has-rpg-icon.icon-d20 .rpg-svg {
    color: #f2fff9 !important;
    filter:
        drop-shadow(0 1px 0 rgba(10, 24, 25, .52))
        drop-shadow(0 0 7px rgba(82, 130, 120, .34)) !important;
}

/* Keep the rooms clean: no miniature thorn vine tucked inside each section. */
.section::before {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* Remove the stray vertical background marks that were crossing section titles. */
body::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* Hero relic showcase: DB-driven product images, layered like RPG loot cards. */
.hero {
    grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr) !important;
}

.hero__sigil {
    width: min(560px, 40vw) !important;
    min-height: clamp(430px, 40vw, 620px);
    align-content: center;
}

.hero__sigil > img,
.hero__sigil > p {
    position: relative;
    z-index: 4;
}

.hero__sigil > img {
    width: min(260px, 46%) !important;
}

.hero__latest-relics {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
}

.hero__latest-label {
    position: absolute;
    left: 8%;
    top: 9%;
    padding: .35rem .65rem;
    border: 1px solid rgba(240, 167, 157, .44);
    border-radius: 999px;
    background:
        radial-gradient(circle at 22% 0, rgba(255, 218, 181, .24), transparent 4rem),
        linear-gradient(145deg, rgba(72, 46, 56, .82), rgba(12, 7, 10, .82));
    color: #ffd4c8;
    font-family: var(--font-body);
    font-size: .82rem;
    font-weight: 900;
    text-transform: uppercase;
    transform: rotate(-5deg);
    box-shadow: 0 12px 24px rgba(0, 0, 0, .28);
}

.hero__latest-card {
    position: absolute;
    display: block;
    width: clamp(118px, 10.5vw, 184px);
    aspect-ratio: .82;
    overflow: hidden;
    border: 1px solid rgba(240, 167, 157, .38);
    border-radius: 12px;
    background: rgba(10, 7, 9, .82);
    color: #fff2ec;
    text-decoration: none;
    pointer-events: auto;
    box-shadow:
        0 24px 44px rgba(0, 0, 0, .42),
        inset 0 0 0 1px rgba(255, 240, 226, .07);
}

.hero__latest-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, transparent 42%, rgba(9, 6, 8, .88)),
        radial-gradient(circle at 18% 0, rgba(255, 214, 181, .18), transparent 52%);
    pointer-events: none;
}

.hero__latest-card img {
    display: block;
    width: 100% !important;
    height: 100%;
    object-fit: cover;
    image-rendering: auto !important;
    filter: saturate(.98) contrast(1.05) !important;
}

.hero__latest-card span {
    position: absolute;
    left: .55rem;
    right: .55rem;
    bottom: .55rem;
    z-index: 1;
    overflow: hidden;
    padding: .34rem .48rem;
    border: 1px solid rgba(240, 167, 157, .28);
    border-radius: 7px;
    background: rgba(25, 13, 18, .76);
    color: #fff1e9;
    font-size: clamp(.72rem, .8vw, .88rem);
    line-height: 1.08;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .62);
}

.hero__latest-card--1 {
    left: 2%;
    top: 15%;
    transform: rotate(-8deg);
}

.hero__latest-card--2 {
    right: 1%;
    top: 18%;
    transform: rotate(7deg);
}

.hero__latest-card--3 {
    left: 14%;
    bottom: 7%;
    transform: rotate(5deg);
}

@media (max-width: 1100px) {
    .hero {
        grid-template-columns: minmax(0, 1fr) minmax(300px, .58fr) !important;
    }

    .hero__sigil {
        width: min(430px, 38vw) !important;
    }

    .hero__latest-card {
        width: clamp(96px, 10vw, 140px);
    }
}

@media (max-width: 860px) {
    .hero {
        grid-template-columns: 1fr !important;
    }

    .hero__sigil {
        width: min(100%, 420px) !important;
        min-height: 260px;
    }

    .hero__sigil > img {
        width: min(150px, 42vw) !important;
    }

    .hero__latest-label {
        display: none;
    }

    .hero__latest-card {
        width: clamp(86px, 24vw, 118px);
    }

    .hero__latest-card span {
        display: none;
    }

    .hero__latest-card--1 {
        left: 6%;
        top: 12%;
    }

    .hero__latest-card--2 {
        right: 7%;
        top: 10%;
    }

    .hero__latest-card--3 {
        left: 34%;
        bottom: 2%;
    }
}

/* Home hero/cards final pass: more air around the logo, no label, up to five relics. */
.hero__latest-label {
    display: none !important;
}

.hero__latest-card {
    width: clamp(96px, 8.1vw, 152px) !important;
}

.hero__latest-card--1 {
    left: -2% !important;
    top: 7% !important;
    transform: rotate(-8deg) !important;
}

.hero__latest-card--2 {
    right: -2% !important;
    top: 10% !important;
    transform: rotate(7deg) !important;
}

.hero__latest-card--3 {
    left: 4% !important;
    bottom: 3% !important;
    transform: rotate(5deg) !important;
}

.hero__latest-card--4 {
    right: 7% !important;
    bottom: 4% !important;
    transform: rotate(-5deg) !important;
}

.hero__latest-card--5 {
    left: 34% !important;
    top: -1% !important;
    width: clamp(82px, 7vw, 128px) !important;
    transform: rotate(3deg) !important;
}

/* Home craft band: fill the right side with a workshop preview instead of dead space. */
.craft-band {
    display: grid !important;
    grid-template-columns: minmax(0, .9fr) minmax(340px, .7fr) !important;
    align-items: center !important;
    gap: clamp(1.6rem, 4vw, 4.8rem) !important;
}

.craft-band > div:first-child {
    max-width: 760px !important;
}

.craft-workbench {
    position: relative;
    z-index: 1;
    min-height: clamp(300px, 28vw, 430px);
    border: 1px solid rgba(240, 167, 157, .26);
    border-radius: 14px;
    overflow: hidden;
    background:
        radial-gradient(circle at 75% 15%, rgba(82, 130, 120, .22), transparent 12rem),
        radial-gradient(circle at 18% 88%, rgba(240, 167, 157, .18), transparent 12rem),
        linear-gradient(145deg, rgba(24, 14, 17, .82), rgba(9, 7, 9, .9));
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 229, .07),
        0 28px 70px rgba(0, 0, 0, .3);
}

.craft-workbench::before {
    content: "";
    position: absolute;
    inset: 1rem;
    border: 1px solid rgba(240, 167, 157, .08);
    border-radius: 10px;
    pointer-events: none;
}

.craft-workbench__relic {
    position: absolute;
    display: block;
    width: clamp(116px, 12vw, 210px);
    aspect-ratio: 1.08;
    overflow: hidden;
    border: 1px solid rgba(240, 167, 157, .3);
    border-radius: 12px;
    background: rgba(9, 7, 9, .78);
    box-shadow: 0 22px 48px rgba(0, 0, 0, .34);
}

.craft-workbench__relic img {
    display: block;
    width: 100% !important;
    height: 100%;
    object-fit: cover;
}

.craft-workbench__relic--1 {
    left: 7%;
    top: 12%;
    transform: rotate(-7deg);
}

.craft-workbench__relic--2 {
    right: 8%;
    top: 18%;
    transform: rotate(5deg);
}

.craft-workbench__relic--3 {
    left: 25%;
    bottom: 10%;
    transform: rotate(4deg);
}

.craft-workbench__notes {
    position: absolute;
    right: clamp(.9rem, 2.2vw, 1.5rem);
    bottom: clamp(.9rem, 2.2vw, 1.5rem);
    display: grid;
    gap: .55rem;
    width: min(250px, 58%);
}

.craft-workbench__notes span {
    display: flex;
    align-items: center;
    gap: .58rem;
    min-height: 42px;
    padding: .42rem .62rem;
    border: 1px solid rgba(240, 167, 157, .24);
    border-radius: 10px;
    background:
        radial-gradient(circle at 10% 0, rgba(240, 167, 157, .18), transparent 4rem),
        rgba(18, 10, 13, .8);
    color: #f7e4dc;
    font-size: clamp(.82rem, .88vw, .98rem);
    font-weight: 900;
    line-height: 1.05;
}

.craft-workbench__icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
}

@media (max-width: 1100px) {
    .hero__latest-card {
        width: clamp(88px, 10vw, 126px) !important;
    }

    .hero__latest-card--4,
    .hero__latest-card--5 {
        display: none !important;
    }

    .craft-band {
        grid-template-columns: 1fr !important;
    }

    .craft-workbench {
        min-height: 320px;
    }
}

@media (max-width: 860px) {
    .hero__latest-card {
        width: clamp(82px, 22vw, 112px) !important;
    }

    .hero__latest-card--1 {
        left: 4% !important;
        top: 8% !important;
    }

    .hero__latest-card--2 {
        right: 4% !important;
        top: 8% !important;
    }

    .hero__latest-card--3 {
        left: 33% !important;
        bottom: 0 !important;
    }

    .craft-workbench {
        min-height: 290px;
    }

    .craft-workbench__notes {
        position: relative;
        right: auto;
        bottom: auto;
        width: auto;
        margin: 10.5rem 1rem 1rem;
    }
}

/* Hero relic fan: keep cards away from the sigil text and remove name ellipses. */
.hero__sigil {
    width: min(720px, 44vw) !important;
}

.hero__sigil > p {
    position: relative;
    z-index: 8;
    margin-top: .95rem;
}

.hero__latest-relics {
    inset: 1.1rem 0 .2rem !important;
}

.hero__latest-card,
.hero__latest-card--5 {
    width: clamp(126px, 8.4vw, 174px) !important;
    aspect-ratio: .78 !important;
}

.hero__latest-card span {
    display: flex !important;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    padding: .36rem .42rem !important;
    overflow: hidden !important;
    color: #fff4ef;
    font-size: clamp(.72rem, .72vw, .86rem) !important;
    line-height: 1.06 !important;
    text-align: center;
    text-overflow: clip !important;
    white-space: normal !important;
}

.hero__latest-card--1 {
    left: -5.5% !important;
    top: 13% !important;
    transform: rotate(-8deg) !important;
}

.hero__latest-card--2 {
    right: -5.5% !important;
    top: 15% !important;
    transform: rotate(7deg) !important;
}

.hero__latest-card--3 {
    left: -6.5% !important;
    bottom: 2% !important;
    transform: rotate(4deg) !important;
}

.hero__latest-card--4 {
    right: -6.5% !important;
    bottom: 2% !important;
    transform: rotate(-4deg) !important;
}

.hero__latest-card--5 {
    left: 39% !important;
    top: -4% !important;
    transform: rotate(2deg) !important;
}

@media (max-width: 1280px) {
    .hero__sigil {
        width: min(560px, 42vw) !important;
    }

    .hero__latest-card,
    .hero__latest-card--5 {
        width: clamp(104px, 9vw, 140px) !important;
    }
}

@media (max-width: 1100px) {
    .hero__sigil {
        width: min(430px, 40vw) !important;
    }

    .hero__latest-card,
    .hero__latest-card--5 {
        width: clamp(92px, 10vw, 124px) !important;
    }

    .hero__latest-card--4,
    .hero__latest-card--5 {
        display: none !important;
    }
}

@media (max-width: 860px) {
    .hero__sigil {
        width: min(100%, 420px) !important;
    }

    .hero__latest-card {
        width: clamp(90px, 24vw, 118px) !important;
    }

    .hero__latest-card span {
        min-height: 0;
        font-size: .68rem !important;
    }

    .hero__latest-card--1 {
        left: 2% !important;
        top: 10% !important;
    }

    .hero__latest-card--2 {
        right: 2% !important;
        top: 11% !important;
    }

    .hero__latest-card--3 {
        left: 35% !important;
        bottom: -2% !important;
    }
}

/* Hero/craft cleanup: no card inside the sigil, no messy workshop collage. */
.hero__latest-card,
.hero__latest-card--5 {
    width: clamp(118px, 7.6vw, 158px) !important;
}

.hero__latest-card--1 {
    left: -7% !important;
    top: 15% !important;
}

.hero__latest-card--2 {
    right: -7% !important;
    top: 15% !important;
}

.hero__latest-card--3 {
    left: -5.5% !important;
    bottom: 8% !important;
}

.hero__latest-card--4 {
    right: -5.5% !important;
    bottom: 8% !important;
}

.hero__latest-card--5 {
    left: 50% !important;
    top: -13% !important;
    transform: translateX(-50%) rotate(2deg) !important;
}

.craft-workbench {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    align-items: start !important;
    gap: clamp(.8rem, 1.5vw, 1.15rem) !important;
    min-height: 0 !important;
    padding: clamp(1rem, 1.8vw, 1.35rem) !important;
    overflow: hidden !important;
}

.craft-workbench::before {
    inset: .85rem !important;
}

.craft-workbench__relic,
.craft-workbench__relic--1,
.craft-workbench__relic--2,
.craft-workbench__relic--3 {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    width: 100% !important;
    aspect-ratio: 1.1 !important;
    transform: none !important;
}

.craft-workbench__relic img {
    object-fit: cover !important;
}

.craft-workbench__notes {
    position: relative !important;
    right: auto !important;
    bottom: auto !important;
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    width: auto !important;
    margin: .2rem 0 0 !important;
}

.craft-workbench__notes span {
    min-height: 54px !important;
    justify-content: flex-start !important;
    padding: .5rem .6rem !important;
    background:
        radial-gradient(circle at 14% 0, rgba(240, 167, 157, .18), transparent 4rem),
        linear-gradient(145deg, rgba(65, 34, 42, .88), rgba(13, 8, 11, .9)) !important;
}

@media (max-width: 1280px) {
    .hero__latest-card--5 {
        top: -15% !important;
    }
}

@media (max-width: 1100px) {
    .craft-workbench {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .craft-workbench__notes {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 860px) {
    .hero__latest-card--5 {
        display: none !important;
    }

    .craft-workbench {
        grid-template-columns: 1fr !important;
    }

    .craft-workbench__relic {
        aspect-ratio: 1.65 !important;
    }
}

/* Final craft mark: subtle ornament, no product links in the premium craft band. */
.hero__latest-card--5 {
    top: -22% !important;
}

.craft-band {
    grid-template-columns: minmax(0, 1fr) auto !important;
}

.craft-mark {
    position: relative;
    z-index: 1;
    display: grid;
    gap: .65rem;
    width: min(310px, 28vw);
    padding: 1.1rem;
    border: 1px solid rgba(240, 167, 157, .24);
    border-radius: 14px;
    background:
        radial-gradient(circle at 50% 0, rgba(82, 130, 120, .2), transparent 7rem),
        linear-gradient(145deg, rgba(47, 28, 35, .72), rgba(11, 7, 9, .78));
    box-shadow:
        inset 0 1px 0 rgba(255, 239, 229, .07),
        0 24px 54px rgba(0, 0, 0, .24);
}

.craft-mark__sigil {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    margin-bottom: .2rem;
    border: 1px solid rgba(240, 167, 157, .3);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(91, 46, 54, .85), rgba(20, 11, 14, .88));
}

.craft-mark__icon {
    width: 42px;
    height: 42px;
}

.craft-mark > span:not(.craft-mark__sigil) {
    display: block;
    padding: .42rem .58rem;
    border-left: 2px solid rgba(240, 167, 157, .55);
    color: #f5ded6;
    font-size: clamp(.86rem, .88vw, 1rem);
    font-weight: 900;
    line-height: 1.1;
}

@media (max-width: 1280px) {
    .hero__latest-card--5 {
        top: -24% !important;
    }
}

@media (max-width: 1100px) {
    .craft-band {
        grid-template-columns: 1fr !important;
    }

    .craft-mark {
        width: min(100%, 520px);
    }
}

@media (max-width: 860px) {
    .craft-mark {
        width: 100%;
    }
}

/* Craft mark placement: right side, but visually centered in its own space. */
.craft-band {
    grid-template-columns: minmax(0, 1fr) minmax(360px, .6fr) !important;
}

.craft-mark {
    justify-self: center !important;
    margin-right: clamp(1.5rem, 4vw, 5rem);
}

@media (max-width: 1100px) {
    .craft-mark {
        justify-self: start !important;
        margin-right: 0;
    }
}

/* Mobile/readability final pass: no hero photo fan, no ellipses, calmer DB content. */
.product-card__body h3,
.product-card__body > p:not(.product-card__collection) {
    overflow: visible !important;
    display: block !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
}

.product-card__body h3 {
    min-height: 0 !important;
}

.product-card__body > p:not(.product-card__collection) {
    min-height: 0 !important;
}

.product-card__body p,
.product-card__body h3,
.product-card__body h3 a {
    text-overflow: clip !important;
}

@media (max-width: 860px) {
    .hero__latest-relics,
    .hero__latest-card,
    .hero__latest-card--1,
    .hero__latest-card--2,
    .hero__latest-card--3,
    .hero__latest-card--4,
    .hero__latest-card--5 {
        display: none !important;
    }

    .hero__sigil {
        min-height: 0 !important;
    }

    .hero__bg::after,
    .hero::after {
        display: none !important;
        content: none !important;
        background: none !important;
    }
}

@media (max-width: 720px) {
    .legend-hero,
    .legend-hero.legend-hero--text-only,
    .legend-route-section,
    .content-section {
        width: min(100% - 1rem, 720px) !important;
        padding: 1rem !important;
    }

    .legend-hero {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }

    .legend-hero img,
    .collection-detail-hero img,
    .content-entry-media,
    .legend-timeline .content-entry-media,
    .guide-grid .content-entry-media {
        width: 100% !important;
        max-width: none !important;
        max-height: 240px !important;
        aspect-ratio: 1.45 !important;
        object-fit: contain !important;
        object-position: center !important;
        background:
            radial-gradient(circle at 50% 22%, rgba(240, 167, 157, .08), transparent 8rem),
            rgba(8, 7, 8, .72) !important;
    }

    .content-block.has-media,
    .atelier-advice article.has-media,
    .faq-answer.has-media,
    .legend-timeline article.has-media {
        grid-template-columns: 1fr !important;
    }

    .content-section__grid,
    .timeline.legend-timeline,
    .guide-grid,
    .faq-list {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }

    .content-block,
    .timeline article,
    .guide-grid article,
    .faq-list details {
        padding: 1rem !important;
    }

    .content-block__head,
    .section-heading--runed,
    .legend-route-section .section-heading {
        align-items: flex-start !important;
        gap: .65rem !important;
    }

    .content-block__head h2,
    .content-block__head h3,
    .guide-grid article h2,
    .guide-grid article h3,
    .timeline article h2,
    .timeline article h3 {
        line-height: 1.12 !important;
        overflow-wrap: anywhere;
    }

    .content-block .text-flow,
    .timeline article .text-flow,
    .guide-grid article .text-flow,
    .faq-answer .text-flow,
    .legend-hero .text-flow {
        font-size: 1.02rem !important;
        line-height: 1.5 !important;
        max-width: none !important;
    }

    .content-block .text-flow p,
    .timeline article .text-flow p,
    .guide-grid article .text-flow p,
    .faq-answer .text-flow p,
    .legend-hero .text-flow p {
        margin: 0 0 .85rem !important;
    }
}

/* Mobile craft band: keep only the text. Desktop keeps the workshop marker. */
@media (max-width: 860px) {
    .craft-band {
        display: block !important;
        grid-template-columns: 1fr !important;
        width: min(100% - 1rem, 720px) !important;
        padding: 1.2rem !important;
        overflow: hidden !important;
        background:
            radial-gradient(circle at 8% 0, rgba(240, 167, 157, .12), transparent 12rem),
            linear-gradient(145deg, rgba(45, 24, 31, .78), rgba(9, 7, 9, .86)) !important;
    }

    .craft-band::after,
    .craft-ornament,
    .craft-ornament::before,
    .craft-mark {
        display: none !important;
        content: none !important;
        background: none !important;
    }

    .craft-band > div:first-child {
        width: 100% !important;
        max-width: none !important;
    }

    .craft-band h2,
    .craft-band p {
        width: 100% !important;
        max-width: none !important;
    }

    .craft-band h2 {
        font-size: clamp(2rem, 12vw, 3.2rem) !important;
        line-height: 1 !important;
    }

    .craft-band p {
        font-size: 1.02rem !important;
        line-height: 1.5 !important;
    }
}

/* Desktop only: restore the right-side blackthorn vine. Tablet and mobile keep it hidden. */
@media (min-width: 1101px) {
    body::after {
        display: block !important;
        content: "" !important;
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: clamp(92px, 8vw, 160px) !important;
        height: auto !important;
        pointer-events: none !important;
        background: url("../img/blackthorn-thorn-vine.svg") center / auto 100% repeat-y !important;
        opacity: .74 !important;
        z-index: 0 !important;
    }

    .site-header,
    main,
    footer,
    .hero,
    .section,
    .page-hero {
        position: relative;
        z-index: 1;
    }

    .hero__bg::after,
    .craft-band::after {
        display: block !important;
        content: "" !important;
        opacity: .9 !important;
    }
}

/* Mobile hero vine: visible, aligned, not crushed into the border. */
@media (max-width: 860px) {
    .hero,
    .page-hero {
        background:
            radial-gradient(circle at 14% 0, rgba(240, 167, 157, .12), transparent 12rem),
            linear-gradient(145deg, rgba(55, 20, 28, .92), rgba(8, 6, 7, .96)) !important;
    }

    .hero__bg {
        background: linear-gradient(140deg, rgba(12, 7, 10, .94), rgba(72, 46, 56, .84)) !important;
    }

    .hero__bg::after {
        display: block !important;
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;
        background: url("../img/blackthorn-thorn-vine.svg") right .85rem center / 112px auto no-repeat !important;
        opacity: .82 !important;
        pointer-events: none !important;
    }

    .page-hero::after {
        display: block !important;
        content: "" !important;
        position: absolute !important;
        top: .5rem !important;
        right: .65rem !important;
        bottom: .5rem !important;
        width: 92px !important;
        background: url("../img/blackthorn-thorn-vine.svg") center / auto 100% no-repeat !important;
        opacity: .82 !important;
        pointer-events: none !important;
    }
}

/* Mobile vines must never tile: one continuous thorn per block, no broken repeats. */
@media (max-width: 860px) {
    body::after {
        display: none !important;
        content: none !important;
        background: none !important;
    }

    .hero,
    .page-hero,
    .legend-hero,
    .legend-hero.legend-hero--text-only,
    .legend-route-section,
    .content-section,
    .craft-band,
    .newsletter-band {
        background-image:
            radial-gradient(circle at 14% 0, rgba(240, 167, 157, .12), transparent 12rem),
            linear-gradient(145deg, rgba(55, 20, 28, .92), rgba(8, 6, 7, .96)) !important;
        background-repeat: no-repeat !important;
    }

    .hero__bg {
        background-image: linear-gradient(140deg, rgba(12, 7, 10, .94), rgba(72, 46, 56, .84)) !important;
        background-repeat: no-repeat !important;
    }

    .hero__bg::after,
    .page-hero::after,
    .legend-hero::after {
        display: block !important;
        content: "" !important;
        position: absolute !important;
        top: .65rem !important;
        right: .7rem !important;
        bottom: .65rem !important;
        left: auto !important;
        width: 88px !important;
        height: auto !important;
        background-image: url("../img/blackthorn-thorn-vine.svg") !important;
        background-position: center !important;
        background-size: auto 100% !important;
        background-repeat: no-repeat !important;
        opacity: .86 !important;
        pointer-events: none !important;
    }

    .craft-band::after,
    .newsletter-band::after,
    .content-section::after,
    .legend-route-section::after {
        display: none !important;
        content: none !important;
        background: none !important;
    }
}

/* Mobile header: one canonical block, no inherited hamburger spans. */
@media (max-width: 860px) {
    .site-header {
        padding: .26rem 0 .16rem !important;
    }

    .site-header .nav-shell {
        width: calc(100% - .7rem) !important;
        max-width: 720px !important;
        grid-template-columns: 56px minmax(0, 1fr) 48px !important;
        grid-template-areas:
            "brand mobile-title toggle"
            "links links links"
            "actions actions actions" !important;
        align-items: center !important;
        gap: .34rem !important;
        min-height: 58px !important;
        padding: .18rem .42rem .22rem !important;
    }

    .site-header .nav-shell::before {
        content: "Blackthorn Dice" !important;
        grid-area: mobile-title !important;
        display: block !important;
        justify-self: center !important;
        opacity: .42 !important;
        color: rgba(240, 167, 157, .72) !important;
        font-family: var(--font-title) !important;
        font-size: clamp(1.55rem, 9.2vw, 2.45rem) !important;
        line-height: .9 !important;
        text-align: center !important;
        text-shadow:
            0 1px 0 rgba(0, 0, 0, .7),
            0 0 6px rgba(240, 167, 157, .12) !important;
        pointer-events: none !important;
    }

    .site-header .nav-shell::after {
        content: none !important;
    }

    .site-header .brand {
        grid-area: brand !important;
        display: grid !important;
        place-items: center !important;
        justify-self: start !important;
        align-self: center !important;
        width: 52px !important;
        min-width: 52px !important;
        min-height: 52px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .site-header .brand > img:first-child {
        display: block !important;
        width: 48px !important;
        min-width: 48px !important;
        height: 48px !important;
        padding: 4px !important;
        object-fit: contain !important;
    }

    .site-header .brand-text {
        display: none !important;
    }

    .site-header .nav-toggle {
        grid-area: toggle !important;
        position: relative !important;
        display: inline-grid !important;
        place-items: center !important;
        justify-self: end !important;
        align-self: center !important;
        width: 44px !important;
        height: 44px !important;
        padding: 0 !important;
        border: 2px solid rgba(224, 145, 130, .68) !important;
        border-radius: 0 !important;
        background:
            radial-gradient(circle at 28% 18%, rgba(255, 236, 198, .34), transparent 35%),
            radial-gradient(circle at 78% 82%, rgba(82, 130, 120, .36), transparent 54%),
            linear-gradient(145deg, rgba(79, 119, 110, .9), rgba(35, 57, 58, .98) 46%, rgba(78, 43, 55, .92)) !important;
        box-shadow:
            inset 0 0 0 1px rgba(255, 238, 210, .16),
            inset 0 -10px 16px rgba(0, 0, 0, .28),
            0 0 14px rgba(82, 130, 120, .28),
            0 7px 16px rgba(0, 0, 0, .42) !important;
        clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
        overflow: visible !important;
    }

    .site-header .nav-toggle span:not(.sr-only):not(.nav-toggle-icon) {
        display: none !important;
    }

    .site-header .nav-toggle .nav-toggle-icon {
        display: inline-grid !important;
        place-items: center !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        margin: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        overflow: visible !important;
        opacity: 1 !important;
        color: #fff0c7 !important;
        filter:
            drop-shadow(0 1px 0 rgba(0, 0, 0, .82))
            drop-shadow(0 0 8px rgba(240, 167, 157, .34)) !important;
    }

    .site-header .nav-toggle .nav-toggle-icon::before,
    .site-header .nav-toggle .nav-toggle-icon::after,
    .site-header .nav-toggle::before,
    .site-header .nav-toggle::after {
        display: none !important;
        content: none !important;
    }

    .site-header .nav-toggle .nav-toggle-icon .rpg-svg {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
    }

    .site-header .nav-toggle .nav-toggle-icon .glyph-fallback {
        display: none !important;
    }

    .site-header .nav-links,
    .site-header .nav-actions {
        grid-column: 1 / -1 !important;
    }

    .craft-band {
        position: relative !important;
    }

    .craft-band::after {
        display: block !important;
        content: "" !important;
        position: absolute !important;
        top: .7rem !important;
        right: .65rem !important;
        bottom: .7rem !important;
        left: auto !important;
        width: 86px !important;
        height: auto !important;
        background-image: url("../img/blackthorn-thorn-vine.svg") !important;
        background-position: center !important;
        background-size: auto 100% !important;
        background-repeat: no-repeat !important;
        opacity: .86 !important;
        pointer-events: none !important;
        z-index: 0 !important;
    }

    .craft-band > div:first-child {
        position: relative !important;
        z-index: 1 !important;
    }
}

@media (max-width: 420px) {
    .site-header .nav-shell {
        width: calc(100% - .64rem) !important;
        grid-template-columns: 52px minmax(0, 1fr) 46px !important;
        min-height: 54px !important;
        padding: .16rem .38rem .2rem !important;
    }

    .site-header .nav-shell::before {
        opacity: .38 !important;
        font-size: clamp(1.35rem, 9.2vw, 2.05rem) !important;
    }

    .site-header .brand {
        width: 48px !important;
        min-width: 48px !important;
        min-height: 48px !important;
    }

    .site-header .brand > img:first-child {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
    }

    .site-header .nav-toggle {
        width: 42px !important;
        height: 42px !important;
    }

    .site-header .nav-toggle .nav-toggle-icon {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
    }
}

/* Tablet/Fold header: avoid the awkward half-desktop state between desktop and phone. */
@media (min-width: 861px) and (max-width: 1100px) {
    .site-header {
        padding: .28rem 0 .18rem !important;
    }

    .site-header .nav-shell {
        width: calc(100% - 1rem) !important;
        max-width: 1360px !important;
        grid-template-columns: 76px minmax(0, 1fr) 58px !important;
        grid-template-areas:
            "brand compact-title toggle"
            "links links links"
            "actions actions actions" !important;
        align-items: center !important;
        gap: .42rem .62rem !important;
        min-height: 72px !important;
        padding: .28rem .58rem .36rem !important;
    }

    .site-header .nav-shell::before {
        content: "Blackthorn Dice" !important;
        grid-area: compact-title !important;
        display: block !important;
        justify-self: center !important;
        opacity: .24 !important;
        color: rgba(240, 167, 157, .58) !important;
        font-family: var(--font-title) !important;
        font-size: clamp(1.55rem, 4vw, 3rem) !important;
        line-height: .9 !important;
        text-align: center !important;
        text-shadow:
            0 1px 0 rgba(0, 0, 0, .74),
            0 0 10px rgba(240, 167, 157, .13) !important;
        pointer-events: none !important;
    }

    .site-header .nav-shell::after {
        content: none !important;
    }

    .site-header .brand {
        grid-area: brand !important;
        display: grid !important;
        place-items: center !important;
        width: 68px !important;
        min-width: 68px !important;
        min-height: 68px !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .site-header .brand > img:first-child {
        width: 62px !important;
        min-width: 62px !important;
        height: 62px !important;
        padding: 5px !important;
    }

    .site-header .brand-text {
        display: none !important;
    }

    .site-header .nav-toggle {
        grid-area: toggle !important;
        display: inline-grid !important;
        place-items: center !important;
        justify-self: end !important;
        width: 52px !important;
        height: 52px !important;
        padding: 0 !important;
        border: 2px solid rgba(224, 145, 130, .66) !important;
        border-radius: 0 !important;
        background:
            radial-gradient(circle at 28% 18%, rgba(255, 236, 198, .3), transparent 35%),
            radial-gradient(circle at 76% 82%, rgba(82, 130, 120, .32), transparent 54%),
            linear-gradient(145deg, rgba(75, 114, 106, .88), rgba(35, 57, 58, .98) 46%, rgba(78, 43, 55, .9)) !important;
        box-shadow:
            inset 0 0 0 1px rgba(255, 238, 210, .16),
            inset 0 -10px 16px rgba(0, 0, 0, .28),
            0 0 14px rgba(82, 130, 120, .28),
            0 7px 16px rgba(0, 0, 0, .42) !important;
        clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
    }

    .site-header .nav-toggle span:not(.sr-only):not(.nav-toggle-icon) {
        display: none !important;
    }

    .site-header .nav-toggle::before,
    .site-header .nav-toggle::after,
    .site-header .nav-toggle .nav-toggle-icon::before,
    .site-header .nav-toggle .nav-toggle-icon::after {
        display: none !important;
        content: none !important;
    }

    .site-header .nav-toggle .nav-toggle-icon {
        display: inline-grid !important;
        place-items: center !important;
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        color: #fff0c7 !important;
        filter:
            drop-shadow(0 1px 0 rgba(0, 0, 0, .82))
            drop-shadow(0 0 8px rgba(240, 167, 157, .34)) !important;
    }

    .site-header .nav-toggle .nav-toggle-icon .rpg-svg {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
    }

    .site-header .nav-toggle .nav-toggle-icon .glyph-fallback {
        display: none !important;
    }

    .site-header .nav-links,
    .site-header .nav-actions {
        grid-column: 1 / -1 !important;
        justify-content: center !important;
    }

    .site-header .nav-links.is-open,
    .site-header .nav-actions.is-open {
        display: flex !important;
    }
}

/* Tablet/Fold layout: compact devices around 884px must not inherit desktop ornaments. */
@media (min-width: 861px) and (max-width: 1100px) {
    body::after {
        display: none !important;
        content: none !important;
        background: none !important;
    }

    .hero__bg::after,
    .hero::after,
    .page-hero::after,
    .legend-hero::after,
    .craft-band::after,
    .newsletter-band::after,
    .content-section::after,
    .legend-route-section::after {
        display: none !important;
        content: none !important;
        background: none !important;
    }

    .hero,
    .page-hero,
    .section,
    .home-collection-section,
    .featured-relics-section,
    .popular-relics-section,
    .craft-band,
    .traveler-words,
    .newsletter-band,
    .legend-hero,
    .legend-route-section,
    .content-section,
    .catalog-layout,
    .product-detail,
    .product-lore,
    .article-page,
    .cart-layout,
    .checkout-layout,
    .account-grid,
    .prose-panel {
        width: min(100% - 1.25rem, 920px) !important;
    }

    .hero {
        grid-template-columns: 1fr !important;
        min-height: auto !important;
        margin-top: .75rem !important;
        padding: clamp(2rem, 5vw, 3.25rem) !important;
    }

    .hero__content {
        max-width: 780px !important;
    }

    .hero__sigil,
    .hero__latest-relics,
    .hero__latest-card,
    .hero__latest-card--1,
    .hero__latest-card--2,
    .hero__latest-card--3,
    .hero__latest-card--4,
    .hero__latest-card--5 {
        display: none !important;
    }

    .intro-grid,
    .section-split,
    .craft-band,
    .legend-hero,
    .product-lore {
        grid-template-columns: 1fr !important;
    }

    .home-collection-section .collection-grid,
    .featured-relics-section .featured-product-grid,
    .popular-relics-section .product-grid,
    .collection-products-section .collection-product-grid,
    .collection-grid,
    .product-grid,
    .collection-grid.large {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        justify-content: stretch !important;
    }

    .content-section__grid,
    .guide-grid,
    .faq-list {
        grid-template-columns: 1fr !important;
    }

    .legend-route-section .timeline {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .page-hero,
    .content-section,
    .legend-route-section,
    .craft-band,
    .newsletter-band {
        overflow: hidden !important;
    }
}

/* Mobile legend route: give the title a real RPG panel instead of a floating label. */
@media (max-width: 900px) {
    .legend-route-section {
        width: min(100% - 1rem, 720px) !important;
    }

    .legend-route-section .section-heading.section-heading--runed {
        display: grid !important;
        grid-template-columns: 46px minmax(0, 1fr) !important;
        align-items: center !important;
        gap: .78rem !important;
        margin: 0 0 1rem !important;
        padding: .9rem 1rem !important;
        border: 1px solid rgba(204, 128, 116, .38) !important;
        border-top: 2px solid rgba(240, 167, 157, .72) !important;
        border-radius: 10px !important;
        background:
            radial-gradient(circle at 8% 0, rgba(240, 167, 157, .16), transparent 8rem),
            radial-gradient(circle at 96% 40%, rgba(82, 130, 120, .12), transparent 8rem),
            linear-gradient(145deg, rgba(55, 25, 34, .8), rgba(10, 7, 9, .88)) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 238, 228, .08),
            0 14px 34px rgba(0, 0, 0, .22) !important;
    }

    .legend-route-section .section-heading.section-heading--runed::after {
        display: none !important;
        content: none !important;
    }

    .legend-route-section .section-heading .section-rune {
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        transform: none !important;
        justify-self: center !important;
    }

    .legend-route-section .section-heading > div {
        min-width: 0 !important;
    }

    .legend-route-section .section-heading .eyebrow {
        margin: 0 0 .28rem !important;
        font-size: .72rem !important;
        letter-spacing: .14em !important;
    }

    .legend-route-section .section-heading h2 {
        margin: 0 !important;
        font-size: clamp(1.75rem, 8vw, 2.55rem) !important;
        line-height: .95 !important;
        overflow-wrap: anywhere !important;
    }

    .legend-route-section .timeline {
        margin-top: 0 !important;
    }
}

/* Device layout normalization: phone, tablet/Fold, laptop, desktop. */
@media (max-width: 1480px) {
    .site-header .nav-toggle {
        border: 2px solid rgba(224, 145, 130, .7) !important;
        border-radius: 0 !important;
        background:
            radial-gradient(circle at 26% 18%, rgba(255, 236, 198, .26), transparent 34%),
            radial-gradient(circle at 78% 84%, rgba(82, 130, 120, .34), transparent 52%),
            linear-gradient(145deg, rgba(78, 116, 108, .9), rgba(34, 54, 56, .98) 48%, rgba(78, 43, 55, .94)) !important;
        box-shadow:
            inset 0 0 0 1px rgba(255, 238, 210, .18),
            inset 0 -10px 16px rgba(0, 0, 0, .28),
            0 0 14px rgba(82, 130, 120, .28),
            0 7px 16px rgba(0, 0, 0, .42) !important;
        clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
    }

    .site-header .nav-toggle span.nav-toggle-bars:not(.sr-only) {
        display: grid !important;
        place-items: center !important;
        gap: 5px !important;
        width: 28px !important;
        min-width: 28px !important;
        height: 24px !important;
        margin: 0 !important;
        opacity: 1 !important;
        transform: none !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i {
        display: block !important;
        width: 25px !important;
        height: 3px !important;
        border-radius: 999px !important;
        background:
            linear-gradient(90deg, transparent 0 8%, #ffe2c9 8% 92%, transparent 92% 100%) !important;
        box-shadow:
            0 1px 0 rgba(0, 0, 0, .82),
            0 0 8px rgba(240, 167, 157, .42) !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(2) {
        width: 30px !important;
        background:
            linear-gradient(90deg, transparent 0 5%, #f0a79d 5% 95%, transparent 95% 100%) !important;
    }

    .site-header .nav-toggle .nav-toggle-icon,
    .site-header .nav-toggle .rpg-svg,
    .site-header .nav-toggle .glyph-fallback,
    .site-header .nav-toggle::before,
    .site-header .nav-toggle::after {
        display: none !important;
        content: none !important;
    }
}

@media (max-width: 860px) {
    .site-header .nav-toggle span.nav-toggle-bars:not(.sr-only) {
        width: 26px !important;
        min-width: 26px !important;
        height: 22px !important;
        gap: 4px !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i {
        width: 23px !important;
        height: 3px !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(2) {
        width: 28px !important;
    }
}

/* Tablet and Fold layouts use the same centered hero. Product cards stay off the hero here. */
@media (min-width: 861px) and (max-width: 1100px) {
    body::after {
        display: none !important;
        content: none !important;
        background: none !important;
    }

    .hero {
        display: grid !important;
        grid-template-columns: 1fr !important;
        justify-items: center !important;
        text-align: center !important;
        width: min(100% - 1.25rem, 920px) !important;
        min-height: auto !important;
        margin: .75rem auto 0 !important;
        padding: clamp(2.35rem, 6vw, 4rem) clamp(1.1rem, 4vw, 2rem) !important;
    }

    .hero__bg::after {
        display: block !important;
        content: "" !important;
        position: absolute !important;
        inset: 0 !important;
        background:
            url("../img/blackthorn-thorn-vine.svg") right .8rem center / auto 92% no-repeat,
            linear-gradient(180deg, transparent 70%, rgba(9, 7, 8, .8)) !important;
        opacity: .86 !important;
        pointer-events: none !important;
    }

    .hero__content {
        display: grid !important;
        justify-items: center !important;
        max-width: 760px !important;
        margin: 0 auto !important;
        text-align: center !important;
        z-index: 1 !important;
    }

    .hero-wordmark {
        width: min(430px, 70vw) !important;
        margin-inline: auto !important;
    }

    .hero h1 {
        max-width: 10ch !important;
        margin-inline: auto !important;
        text-align: center !important;
        font-size: clamp(3rem, 8.4vw, 5.1rem) !important;
        line-height: .92 !important;
    }

    .hero__lead {
        width: min(100%, 720px) !important;
        max-width: 720px !important;
        margin-inline: auto !important;
        text-align: center !important;
        background:
            linear-gradient(180deg, rgba(39, 63, 65, .58), rgba(72, 46, 56, .34)) !important;
        border-left: 0 !important;
        border-top: 3px solid var(--copper) !important;
    }

    .hero__actions {
        justify-content: center !important;
    }

    .hero__sigil {
        position: relative !important;
        display: grid !important;
        justify-items: center !important;
        grid-column: auto !important;
        margin: clamp(1.5rem, 4vw, 2.4rem) auto 0 !important;
        max-width: 260px !important;
        text-align: center !important;
        z-index: 1 !important;
    }

    .hero__sigil > img {
        width: min(168px, 24vw) !important;
        margin-inline: auto !important;
    }

    .hero__sigil > p {
        text-align: center !important;
    }

    .hero__latest-relics,
    .hero__latest-card,
    .hero__latest-card--1,
    .hero__latest-card--2,
    .hero__latest-card--3,
    .hero__latest-card--4,
    .hero__latest-card--5 {
        display: none !important;
    }
}

/* Laptop: keep the desktop vine, but reserve space so links never sit on top of it. */
@media (min-width: 1101px) and (max-width: 1599px) {
    body {
        --bt-vine-safe: clamp(96px, 7vw, 132px);
        --bt-laptop-gutter: clamp(1rem, 2.2vw, 2.25rem);
    }

    body::after {
        width: var(--bt-vine-safe) !important;
        opacity: .72 !important;
    }

    .hero,
    .page-hero,
    .section,
    .home-collection-section,
    .featured-relics-section,
    .popular-relics-section,
    .craft-band,
    .traveler-words,
    .newsletter-band,
    .legend-hero,
    .legend-route-section,
    .content-section,
    .catalog-layout,
    .product-detail,
    .product-lore,
    .article-page,
    .cart-layout,
    .checkout-layout,
    .account-grid,
    .prose-panel {
        width: auto !important;
        max-width: 1440px !important;
        margin-left: var(--bt-laptop-gutter) !important;
        margin-right: calc(var(--bt-vine-safe) + var(--bt-laptop-gutter)) !important;
    }

    .section:has(.product-grid),
    .catalog-layout {
        max-width: 1440px !important;
    }

    .section-heading,
    .catalog-topline {
        min-width: 0 !important;
        padding-right: .25rem !important;
    }

    .section-heading > a,
    .catalog-topline > a {
        margin-left: auto !important;
        white-space: nowrap !important;
    }
}

/* Large desktop keeps the wide, centered layout. */
@media (min-width: 1600px) {
    .hero {
        width: min(1440px, calc(100% - 1.5rem)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .section:has(.product-grid),
    .catalog-layout {
        width: min(1440px, calc(100% - 2rem)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .section,
    .cart-layout,
    .checkout-layout,
    .account-grid,
    .product-detail,
    .product-lore,
    .article-page,
    .collection-detail-hero,
    .legend-hero,
    .legend-route-section,
    .content-section,
    .craft-band,
    .traveler-words,
    .newsletter-band {
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* Laptop correction: never use the folded tablet menu on real portable widths. */
@media (min-width: 1101px) and (max-width: 1599px) {
    .site-header .nav-shell {
        display: grid !important;
        grid-template-columns: 62px minmax(0, 1fr) auto !important;
        grid-template-areas: "brand links actions" !important;
        align-items: center !important;
        gap: .48rem !important;
        width: min(calc(100% - 1rem), 1480px) !important;
        max-width: 1480px !important;
        min-height: 62px !important;
        padding: .3rem .5rem !important;
    }

    .site-header .nav-shell::before,
    .site-header .nav-shell::after {
        content: none !important;
        display: none !important;
    }

    .site-header .brand {
        grid-area: brand !important;
        width: 56px !important;
        min-width: 56px !important;
        min-height: 56px !important;
        padding: 0 !important;
    }

    .site-header .brand > img:first-child {
        width: 52px !important;
        min-width: 52px !important;
        height: 52px !important;
        padding: 4px !important;
    }

    .site-header .brand-text,
    .site-header .nav-toggle {
        display: none !important;
    }

    .site-header .nav-links,
    .site-header .nav-actions {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        min-width: 0 !important;
        padding: .18rem .24rem !important;
        gap: .18rem !important;
    }

    .site-header .nav-links {
        grid-area: links !important;
        justify-content: center !important;
    }

    .site-header .nav-actions {
        grid-area: actions !important;
        justify-content: end !important;
    }

    .site-header .nav-item,
    .site-header .icon-link,
    .site-header .cart-pill {
        min-height: 40px !important;
        padding: .22rem .36rem !important;
        gap: .22rem !important;
        white-space: nowrap !important;
        font-size: clamp(.72rem, .78vw, .9rem) !important;
    }

    .site-header .nav-glyph,
    .site-header .rpg-icon {
        width: 28px !important;
        min-width: 28px !important;
        height: 28px !important;
    }

    .site-header .language-switcher {
        min-height: 38px !important;
        padding: .1rem !important;
        gap: .08rem !important;
    }

    .site-header .language-switcher a {
        min-height: 30px !important;
        padding: .16rem .3rem !important;
        font-size: .78rem !important;
    }

    .hero {
        grid-template-columns: minmax(0, .96fr) minmax(220px, .44fr) !important;
        min-height: min(720px, calc(100vh - 6.5rem)) !important;
        padding: clamp(2rem, 4.2vw, 3.6rem) !important;
    }

    .hero-wordmark {
        width: min(420px, 36vw) !important;
    }

    .hero h1 {
        max-width: 12ch !important;
        font-size: clamp(3.2rem, 5.2vw, 5.2rem) !important;
        line-height: .94 !important;
    }

    .hero__lead {
        max-width: 640px !important;
    }

    .hero__latest-relics,
    .hero__latest-card,
    .hero__latest-card--1,
    .hero__latest-card--2,
    .hero__latest-card--3,
    .hero__latest-card--4,
    .hero__latest-card--5 {
        display: none !important;
    }

    .hero__sigil {
        display: grid !important;
        justify-self: center !important;
        align-self: center !important;
        max-width: 260px !important;
        margin: 0 auto !important;
    }

    .hero__sigil > img {
        width: min(230px, 18vw) !important;
    }
}

/* Cleaner menu rune on phone/tablet: three readable strokes, not a block. */
@media (max-width: 1100px) {
    .site-header .nav-toggle span.nav-toggle-bars:not(.sr-only) {
        gap: 6px !important;
        width: 30px !important;
        min-width: 30px !important;
        height: 24px !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i {
        height: 2px !important;
        width: 23px !important;
        border-radius: 999px !important;
        background:
            linear-gradient(90deg, transparent 0 9%, #ffe6cf 9% 91%, transparent 91% 100%) !important;
        box-shadow:
            0 1px 0 rgba(0, 0, 0, .85),
            0 0 5px rgba(240, 167, 157, .46) !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(2) {
        width: 28px !important;
        height: 2px !important;
        background:
            linear-gradient(90deg, transparent 0 6%, #f0a79d 6% 94%, transparent 94% 100%) !important;
    }
}

/* Final mobile/tablet menu mark: clear three-stroke RPG seal. */
@media (max-width: 1100px) {
    .site-header .nav-toggle {
        width: 50px !important;
        height: 50px !important;
        overflow: visible !important;
        border-color: rgba(240, 167, 157, .82) !important;
        background:
            radial-gradient(circle at 26% 18%, rgba(255, 232, 196, .28), transparent 35%),
            radial-gradient(circle at 78% 86%, rgba(82, 130, 120, .44), transparent 54%),
            linear-gradient(145deg, rgba(89, 131, 121, .94), rgba(31, 49, 51, .98) 48%, rgba(86, 47, 58, .96)) !important;
        box-shadow:
            inset 0 0 0 1px rgba(255, 238, 210, .2),
            inset 0 -10px 16px rgba(0, 0, 0, .32),
            0 0 16px rgba(82, 130, 120, .34),
            0 0 12px rgba(240, 167, 157, .16),
            0 8px 18px rgba(0, 0, 0, .48) !important;
    }

    .site-header .nav-toggle span.nav-toggle-bars:not(.sr-only) {
        position: relative !important;
        display: grid !important;
        place-items: center !important;
        gap: 5px !important;
        width: 36px !important;
        min-width: 36px !important;
        height: 30px !important;
        isolation: isolate !important;
    }

    .site-header .nav-toggle .nav-toggle-bars::before {
        content: "" !important;
        position: absolute !important;
        inset: -4px -3px !important;
        z-index: -1 !important;
        border: 1px solid rgba(255, 226, 201, .16) !important;
        border-radius: 4px !important;
        background:
            linear-gradient(180deg, rgba(255, 226, 201, .07), rgba(0, 0, 0, .16)) !important;
        box-shadow:
            inset 0 0 10px rgba(0, 0, 0, .28),
            0 0 10px rgba(240, 167, 157, .16) !important;
        clip-path: polygon(6px 0, calc(100% - 6px) 0, 100% 6px, 100% calc(100% - 6px), calc(100% - 6px) 100%, 6px 100%, 0 calc(100% - 6px), 0 6px);
    }

    .site-header .nav-toggle .nav-toggle-bars i {
        position: relative !important;
        display: block !important;
        width: 31px !important;
        height: 4px !important;
        border: 1px solid rgba(255, 236, 207, .54) !important;
        border-radius: 999px !important;
        background:
            linear-gradient(180deg, #fff1d6 0%, #f0a79d 42%, #9c5d58 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 245, .58),
            inset 0 -1px 0 rgba(42, 16, 22, .74),
            0 1px 0 rgba(0, 0, 0, .86),
            0 0 8px rgba(240, 167, 157, .42) !important;
        clip-path: polygon(0 50%, 8% 0, 92% 0, 100% 50%, 92% 100%, 8% 100%);
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(1) {
        transform: translateX(-1px) !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(2) {
        width: 36px !important;
        height: 4px !important;
        background:
            linear-gradient(180deg, #fff5df 0%, #ffc0ad 38%, #b86d62 100%) !important;
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 245, .7),
            inset 0 -1px 0 rgba(42, 16, 22, .82),
            0 1px 0 rgba(0, 0, 0, .88),
            0 0 10px rgba(240, 167, 157, .52) !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(3) {
        transform: translateX(1px) !important;
    }
}

@media (max-width: 420px) {
    .site-header .nav-toggle {
        width: 46px !important;
        height: 46px !important;
    }

    .site-header .nav-toggle span.nav-toggle-bars:not(.sr-only) {
        width: 32px !important;
        min-width: 32px !important;
        height: 27px !important;
        gap: 4px !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i {
        width: 28px !important;
        height: 4px !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(2) {
        width: 32px !important;
    }
}

/* Final-final menu glyph: no parchment block, just three sharp RPG strokes. */
@media (max-width: 1100px) {
    .site-header .nav-toggle span.nav-toggle-bars:not(.sr-only) {
        width: 34px !important;
        min-width: 34px !important;
        height: 28px !important;
        gap: 5px !important;
        filter: drop-shadow(0 0 7px rgba(240, 167, 157, .34)) !important;
    }

    .site-header .nav-toggle .nav-toggle-bars::before {
        display: none !important;
        content: none !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i {
        position: relative !important;
        display: block !important;
        width: 30px !important;
        height: 3px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background:
            linear-gradient(90deg,
                transparent 0 6%,
                #528278 6% 10%,
                #fff0d4 10% 28%,
                #f0a79d 28% 72%,
                #cc8074 72% 90%,
                #528278 90% 94%,
                transparent 94% 100%) !important;
        box-shadow:
            0 1px 0 rgba(0, 0, 0, .9),
            0 0 7px rgba(240, 167, 157, .42),
            0 0 11px rgba(82, 130, 120, .2) !important;
        clip-path: polygon(8% 0, 92% 0, 100% 50%, 92% 100%, 8% 100%, 0 50%) !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i::before,
    .site-header .nav-toggle .nav-toggle-bars i::after {
        content: "" !important;
        position: absolute !important;
        top: 50% !important;
        width: 4px !important;
        height: 4px !important;
        border: 1px solid rgba(255, 232, 210, .45) !important;
        background: #273f41 !important;
        transform: translateY(-50%) rotate(45deg) !important;
        box-shadow: 0 0 5px rgba(82, 130, 120, .34) !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i::before {
        left: -1px !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i::after {
        right: -1px !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(1) {
        width: 27px !important;
        transform: translateX(-1px) !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(2) {
        width: 34px !important;
        height: 3px !important;
        transform: none !important;
        background:
            linear-gradient(90deg,
                transparent 0 5%,
                #528278 5% 9%,
                #fff4df 9% 26%,
                #ffc0ad 26% 74%,
                #d68b7e 74% 91%,
                #528278 91% 95%,
                transparent 95% 100%) !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(3) {
        width: 27px !important;
        transform: translateX(1px) !important;
    }
}

@media (max-width: 420px) {
    .site-header .nav-toggle span.nav-toggle-bars:not(.sr-only) {
        width: 31px !important;
        min-width: 31px !important;
        height: 25px !important;
        gap: 4px !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i {
        width: 27px !important;
    }

    .site-header .nav-toggle .nav-toggle-bars i:nth-child(2) {
        width: 31px !important;
    }
}

/* Real dagger menu icon: transparent asset, no fake parchment block. */
@media (max-width: 1100px) {
    .site-header .nav-toggle {
        width: 54px !important;
        height: 54px !important;
        background:
            radial-gradient(circle at 26% 18%, rgba(255, 232, 196, .16), transparent 35%),
            linear-gradient(145deg, rgba(39, 63, 65, .28), rgba(10, 7, 9, .22)) !important;
        border: 2px solid rgba(224, 145, 130, .74) !important;
        box-shadow:
            inset 0 0 0 1px rgba(255, 238, 210, .12),
            0 0 15px rgba(82, 130, 120, .26),
            0 0 12px rgba(240, 167, 157, .14),
            0 7px 16px rgba(0, 0, 0, .44) !important;
    }

    .site-header .nav-toggle span:not(.sr-only):not(.nav-toggle-daggers),
    .site-header .nav-toggle .nav-toggle-bars,
    .site-header .nav-toggle .nav-toggle-bars *,
    .site-header .nav-toggle .nav-toggle-icon,
    .site-header .nav-toggle .rpg-svg,
    .site-header .nav-toggle .glyph-fallback,
    .site-header .nav-toggle::before,
    .site-header .nav-toggle::after {
        display: none !important;
        content: none !important;
    }

    .site-header .nav-toggle .nav-toggle-daggers {
        display: block !important;
        width: 43px !important;
        min-width: 43px !important;
        height: 43px !important;
        margin: 0 !important;
        background: none !important;
        filter:
            drop-shadow(0 1px 0 rgba(0, 0, 0, .9))
            drop-shadow(0 0 6px rgba(240, 167, 157, .32))
            drop-shadow(0 0 5px rgba(82, 130, 120, .24)) !important;
        opacity: 1 !important;
    }

    .site-header .brand {
        width: 64px !important;
        min-width: 64px !important;
        min-height: 64px !important;
    }

    .site-header .brand > img:first-child {
        width: 60px !important;
        min-width: 60px !important;
        height: 60px !important;
    }
}

@media (max-width: 420px) {
    .site-header .nav-shell {
        grid-template-columns: 64px minmax(0, 1fr) 52px !important;
    }

    .site-header .nav-toggle {
        width: 50px !important;
        height: 50px !important;
    }

    .site-header .nav-toggle .nav-toggle-daggers {
        width: 39px !important;
        min-width: 39px !important;
        height: 39px !important;
    }

    .site-header .brand {
        width: 60px !important;
        min-width: 60px !important;
        min-height: 60px !important;
    }

    .site-header .brand > img:first-child {
        width: 56px !important;
        min-width: 56px !important;
        height: 56px !important;
    }
}

/* True image menu: three real dagger sprites, transparent, no square fill. */
@media (max-width: 1100px) {
    .site-header .nav-toggle {
        width: 68px !important;
        height: 60px !important;
        border: 2px solid rgba(224, 145, 130, .78) !important;
        border-radius: 0 !important;
        background:
            radial-gradient(circle at 50% 42%, rgba(82, 130, 120, .18), transparent 58%),
            linear-gradient(135deg, rgba(72, 46, 56, .72), rgba(14, 18, 18, .88)) !important;
        box-shadow:
            inset 0 0 0 1px rgba(240, 167, 157, .18),
            inset 0 0 18px rgba(82, 130, 120, .16),
            0 0 0 1px rgba(16, 8, 10, .9),
            0 0 16px rgba(82, 130, 120, .28),
            0 0 22px rgba(204, 128, 116, .18),
            0 10px 20px rgba(0, 0, 0, .44) !important;
        clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px) !important;
        overflow: visible !important;
    }

    body .site-header .nav-toggle > span.nav-toggle-daggers:not(.sr-only) {
        display: block !important;
        width: 64px !important;
        min-width: 64px !important;
        height: 48px !important;
        margin: 0 !important;
        background-image:
            url("../img/menu-dagger-real.png"),
            url("../img/menu-dagger-real.png"),
            url("../img/menu-dagger-real.png") !important;
        background-repeat: no-repeat !important;
        background-size: 48px 48px, 48px 48px, 48px 48px !important;
        background-position: center -12px, center center, center calc(100% + 12px) !important;
        filter:
            drop-shadow(0 2px 1px rgba(0, 0, 0, .9))
            drop-shadow(0 0 7px rgba(240, 167, 157, .34))
            drop-shadow(0 0 8px rgba(82, 130, 120, .24)) !important;
        opacity: 1 !important;
    }
}

@media (max-width: 420px) {
    .site-header .nav-toggle {
        width: 62px !important;
        height: 56px !important;
    }

    body .site-header .nav-toggle > span.nav-toggle-daggers:not(.sr-only) {
        width: 56px !important;
        min-width: 56px !important;
        height: 42px !important;
        background-size: 44px 44px, 44px 44px, 44px 44px !important;
        background-position: center -11px, center center, center calc(100% + 11px) !important;
    }
}

/* Tablet width harmonization: craft, testimonials and sections share one frame size. */
@media (min-width: 721px) and (max-width: 1100px) {
    .hero,
    .page-hero,
    .section,
    .home-collection-section,
    .featured-relics-section,
    .popular-relics-section,
    .craft-band,
    .traveler-words,
    .newsletter-band,
    .legend-hero,
    .legend-hero.legend-hero--text-only,
    .legend-route-section,
    .content-section,
    .catalog-layout,
    .cart-layout,
    .checkout-layout,
    .account-grid,
    .product-detail,
    .product-lore,
    .article-page,
    .collection-detail-hero,
    .prose-panel {
        width: min(100% - 2rem, 1040px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .craft-band {
        padding: clamp(2rem, 4vw, 3rem) !important;
    }

    .craft-band > div:first-child,
    .craft-band h2,
    .craft-band p {
        max-width: none !important;
    }
}

/* Index canonical frames: every home block keeps the same readable width. */
main > .hero,
main > .featured-relics-section,
main > .home-collection-section,
main > .popular-relics-section,
main > .craft-band,
main > .traveler-words,
main > .newsletter-band {
    box-sizing: border-box !important;
    width: min(1440px, calc(100% - 2rem)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

main > .featured-relics-section .section-heading,
main > .home-collection-section .section-heading,
main > .popular-relics-section .section-heading,
main > .traveler-words .section-heading,
main > .newsletter-band .section-heading {
    width: 100% !important;
    box-sizing: border-box !important;
}

@media (min-width: 2000px) {
    main > .hero,
    main > .featured-relics-section,
    main > .home-collection-section,
    main > .popular-relics-section,
    main > .craft-band,
    main > .traveler-words,
    main > .newsletter-band {
        width: min(1840px, calc(100% - 4rem)) !important;
    }
}

@media (min-width: 2800px) {
    main > .hero,
    main > .featured-relics-section,
    main > .home-collection-section,
    main > .popular-relics-section,
    main > .craft-band,
    main > .traveler-words,
    main > .newsletter-band {
        width: min(2200px, calc(100% - 5rem)) !important;
    }
}

@media (min-width: 1101px) and (max-width: 1599px) {
    main > .hero,
    main > .featured-relics-section,
    main > .home-collection-section,
    main > .popular-relics-section,
    main > .craft-band,
    main > .traveler-words,
    main > .newsletter-band {
        width: auto !important;
        max-width: 1440px !important;
        margin-left: var(--bt-laptop-gutter, 1.5rem) !important;
        margin-right: calc(var(--bt-vine-safe, 120px) + var(--bt-laptop-gutter, 1.5rem)) !important;
    }
}

@media (min-width: 721px) and (max-width: 1100px) {
    main > .hero,
    main > .featured-relics-section,
    main > .home-collection-section,
    main > .popular-relics-section,
    main > .craft-band,
    main > .traveler-words,
    main > .newsletter-band {
        width: min(100% - 2rem, 1040px) !important;
    }
}

@media (max-width: 720px) {
    main > .hero,
    main > .featured-relics-section,
    main > .home-collection-section,
    main > .popular-relics-section,
    main > .craft-band,
    main > .traveler-words,
    main > .newsletter-band {
        width: min(100% - 1rem, 720px) !important;
    }
}

/* Index hero: decorative product cards must stay inside the sigil area. */
@media (min-width: 1600px) {
    main > .hero {
        grid-template-columns: minmax(0, 1fr) minmax(420px, .72fr) !important;
    }

    main > .hero .hero__content {
        position: relative !important;
        z-index: 6 !important;
    }

    main > .hero .hero__sigil {
        width: min(620px, 38vw) !important;
        max-width: 100% !important;
        z-index: 5 !important;
    }

    main > .hero .hero__latest-relics {
        inset: .75rem 1.35rem .75rem 1.35rem !important;
        overflow: visible !important;
    }

    main > .hero .hero__latest-card,
    main > .hero .hero__latest-card--5 {
        width: clamp(112px, 7vw, 152px) !important;
    }

    main > .hero .hero__latest-card--1 {
        left: 6% !important;
        top: 22% !important;
        transform: rotate(-8deg) !important;
    }

    main > .hero .hero__latest-card--2 {
        right: 6% !important;
        top: 20% !important;
        transform: rotate(7deg) !important;
    }

    main > .hero .hero__latest-card--3 {
        left: 8% !important;
        bottom: 8% !important;
        transform: rotate(4deg) !important;
    }

    main > .hero .hero__latest-card--4 {
        right: 8% !important;
        bottom: 8% !important;
        transform: rotate(-4deg) !important;
    }

    main > .hero .hero__latest-card--5 {
        left: 50% !important;
        top: 1% !important;
        transform: translateX(-50%) rotate(2deg) !important;
    }
}

/* Index final alignment: featured, collections and popular keep one shared frame. */
main > section.hero,
main > section.section.featured-relics-section,
main > section.section.home-collection-section,
main > section.section.popular-relics-section,
main > section.section.craft-band,
main > section.section.traveler-words,
main > section.section.newsletter-band {
    box-sizing: border-box !important;
    width: min(1440px, calc(100% - 2rem)) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

main > .featured-relics-section,
main > .home-collection-section,
main > .popular-relics-section {
    display: block !important;
    box-sizing: border-box !important;
}

main > .featured-relics-section .home-heading-rpg,
main > .home-collection-section .home-heading-rpg,
main > .popular-relics-section .home-heading-rpg {
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) max-content !important;
    align-items: center !important;
    gap: 1.1rem !important;
    width: 100% !important;
    min-height: 116px !important;
    margin: 0 0 1.35rem !important;
}

main > .featured-relics-section .home-heading-rpg > div,
main > .home-collection-section .home-heading-rpg > div,
main > .popular-relics-section .home-heading-rpg > div {
    min-width: 0 !important;
    width: 100% !important;
    margin: 0 !important;
}

main > .featured-relics-section .home-heading-rpg .eyebrow,
main > .home-collection-section .home-heading-rpg .eyebrow,
main > .popular-relics-section .home-heading-rpg .eyebrow {
    margin: 0 0 .3rem !important;
}

main > .featured-relics-section .home-heading-rpg h2,
main > .home-collection-section .home-heading-rpg h2,
main > .popular-relics-section .home-heading-rpg h2 {
    margin: 0 !important;
    font-size: clamp(2rem, 3vw, 3.15rem) !important;
    line-height: 1 !important;
}

main > .featured-relics-section .home-heading-rpg h2 + p,
main > .home-collection-section .home-heading-rpg h2 + p,
main > .popular-relics-section .home-heading-rpg h2 + p {
    max-width: 56rem !important;
    margin: .45rem 0 0 !important;
}

main > .featured-relics-section .home-heading-rpg > a,
main > .home-collection-section .home-heading-rpg > a,
main > .popular-relics-section .home-heading-rpg > a {
    justify-self: end !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

main > .featured-relics-section .featured-product-grid,
main > .home-collection-section .collection-grid,
main > .popular-relics-section .product-grid {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 1.35rem !important;
}

main > .featured-relics-section .product-card,
main > .home-collection-section .collection-card,
main > .popular-relics-section .product-card {
    width: 100% !important;
    max-width: none !important;
}

@media (min-width: 1101px) and (max-width: 1599px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: auto !important;
        max-width: 1440px !important;
        margin-left: var(--bt-laptop-gutter, 1.5rem) !important;
        margin-right: calc(var(--bt-vine-safe, 120px) + var(--bt-laptop-gutter, 1.5rem)) !important;
    }

    main > .featured-relics-section .home-heading-rpg,
    main > .home-collection-section .home-heading-rpg,
    main > .popular-relics-section .home-heading-rpg {
        min-height: 106px !important;
    }

    main > .featured-relics-section .home-heading-rpg h2,
    main > .home-collection-section .home-heading-rpg h2,
    main > .popular-relics-section .home-heading-rpg h2 {
        font-size: clamp(1.9rem, 3.2vw, 2.75rem) !important;
    }
}

@media (min-width: 721px) and (max-width: 1100px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(100% - 2rem, 1040px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    main > .featured-relics-section .home-heading-rpg,
    main > .home-collection-section .home-heading-rpg,
    main > .popular-relics-section .home-heading-rpg {
        grid-template-columns: 54px minmax(0, 1fr) max-content !important;
        min-height: 102px !important;
    }

    main > .featured-relics-section .featured-product-grid,
    main > .home-collection-section .collection-grid,
    main > .popular-relics-section .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(100% - 1rem, 720px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    main > .featured-relics-section .home-heading-rpg,
    main > .home-collection-section .home-heading-rpg,
    main > .popular-relics-section .home-heading-rpg {
        grid-template-columns: 42px minmax(0, 1fr) !important;
        min-height: 0 !important;
        align-items: start !important;
        gap: .75rem !important;
    }

    main > .featured-relics-section .home-heading-rpg > a,
    main > .home-collection-section .home-heading-rpg > a,
    main > .popular-relics-section .home-heading-rpg > a {
        grid-column: 1 / -1 !important;
        justify-self: start !important;
        white-space: normal !important;
    }

    main > .featured-relics-section .featured-product-grid,
    main > .home-collection-section .collection-grid,
    main > .popular-relics-section .product-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (min-width: 2000px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(1840px, calc(100% - 4rem)) !important;
    }
}

@media (min-width: 2800px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(2200px, calc(100% - 5rem)) !important;
    }
}

/* Index hero final spacing: keep the center size, but give each relic more air. */
@media (min-width: 1600px) {
    main > .hero .hero__sigil {
        width: min(640px, 38vw) !important;
    }

    main > .hero .hero__sigil > img {
        width: min(250px, 40%) !important;
    }

    main > .hero .hero__latest-relics {
        inset: .1rem -1.25rem 1.7rem !important;
        overflow: visible !important;
    }

    main > .hero .hero__latest-card,
    main > .hero .hero__latest-card--5 {
        width: clamp(106px, 5.8vw, 128px) !important;
        aspect-ratio: .8 !important;
    }

    main > .hero .hero__latest-card--1 {
        left: -2% !important;
        top: 29% !important;
        transform: rotate(-8deg) !important;
    }

    main > .hero .hero__latest-card--2 {
        right: -2% !important;
        top: 28% !important;
        transform: rotate(7deg) !important;
    }

    main > .hero .hero__latest-card--3 {
        left: 2% !important;
        bottom: 4% !important;
        transform: rotate(4deg) !important;
    }

    main > .hero .hero__latest-card--4 {
        right: 2% !important;
        bottom: 4% !important;
        transform: rotate(-4deg) !important;
    }

    main > .hero .hero__latest-card--5 {
        left: 50% !important;
        top: -2% !important;
        transform: translateX(-50%) rotate(2deg) !important;
    }
}

/* Canonical cleanup: Codex merge, catalogue filters and device frames. */
.language-switcher {
    gap: .22rem !important;
    padding: .2rem !important;
}

.language-switcher > span {
    display: none !important;
}

.language-switcher a {
    width: 2.25rem !important;
    min-width: 2.25rem !important;
    min-height: 2rem !important;
    justify-content: center !important;
    padding: .22rem !important;
}

.language-switcher a img {
    width: 1.42rem !important;
    height: .98rem !important;
}

.catalog-layout {
    grid-template-columns: minmax(13rem, 16rem) minmax(0, 1fr) !important;
    gap: clamp(1rem, 2vw, 1.5rem) !important;
}

.filter-panel {
    max-height: calc(100dvh - 7rem) !important;
    overflow: auto !important;
    overscroll-behavior: contain !important;
    scrollbar-gutter: stable !important;
}

.catalog-results {
    min-width: 0 !important;
}

.catalog-results .product-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 18.25rem)) !important;
    justify-content: start !important;
    align-items: stretch !important;
}

.catalog-results .product-card {
    width: 100% !important;
    max-width: 18.25rem !important;
}

.catalog-topline {
    align-items: center !important;
    min-width: 0 !important;
}

.catalog-topline p {
    margin: 0 !important;
}

.product-card__body h3,
.product-card__body > p:not(.product-card__collection) {
    overflow: visible !important;
    display: block !important;
    min-height: 0 !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    text-overflow: clip !important;
}

.codex-category {
    position: relative;
    z-index: 1;
}

.codex-category > summary {
    list-style: none;
    cursor: pointer;
    grid-template-columns: 64px minmax(0, 1fr) 2.4rem !important;
    align-items: center !important;
}

.codex-category > summary::-webkit-details-marker {
    display: none;
}

.codex-category__marker {
    display: inline-grid;
    place-items: center;
    width: 2.35rem;
    height: 2.35rem;
    border: 1px solid rgba(240, 167, 157, .42);
    border-radius: 7px;
    background:
        radial-gradient(circle at 30% 20%, rgba(255, 230, 205, .14), transparent 50%),
        rgba(10, 7, 9, .56);
    box-shadow: inset 0 0 12px rgba(82, 130, 120, .12), 0 0 14px rgba(240, 167, 157, .12);
}

.codex-category__marker::before {
    content: "+";
    color: #f0a79d;
    font-family: var(--font-body);
    font-size: 1.25rem;
    line-height: 1;
}

.codex-category[open] .codex-category__marker::before {
    content: "-";
}

.codex-category__body {
    position: relative;
    z-index: 1;
}

.codex-section--section_collapsed .codex-category__body {
    padding-top: .35rem;
}

.codex-section--section_collapsed .section-heading {
    margin-bottom: 0 !important;
}

.codex-section--section_collapsed .codex-category[open] .section-heading {
    margin-bottom: 1.35rem !important;
}

.rarity-guide-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.rarity-guide-card {
    min-height: 100%;
}

.content-section-rarity_guide {
    background:
        radial-gradient(circle at 12% 0, rgba(240, 167, 157, .14), transparent 18rem),
        radial-gradient(circle at 88% 12%, rgba(82, 130, 120, .16), transparent 18rem),
        linear-gradient(145deg, rgba(46, 26, 37, .78), rgba(9, 7, 9, .82)) !important;
}

.hero__latest-card span {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    min-height: 2.45em !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
}

main > section.hero,
main > section.section.featured-relics-section,
main > section.section.home-collection-section,
main > section.section.popular-relics-section,
main > section.section.craft-band,
main > section.section.traveler-words,
main > section.section.newsletter-band {
    box-sizing: border-box !important;
}

@media (min-width: 1600px) {
    main > .hero {
        grid-template-columns: minmax(0, 1fr) minmax(620px, .76fr) !important;
    }

    main > .hero .hero__sigil {
        width: min(760px, 42vw) !important;
    }

    main > .hero .hero__sigil > img {
        width: min(245px, 34%) !important;
    }

    main > .hero .hero__latest-relics {
        inset: -.3rem .4rem 1.25rem !important;
        overflow: visible !important;
    }

    main > .hero .hero__latest-card,
    main > .hero .hero__latest-card--5 {
        width: clamp(110px, 5.5vw, 136px) !important;
        aspect-ratio: .8 !important;
    }

    main > .hero .hero__latest-card--1 {
        left: 3% !important;
        top: 32% !important;
        transform: rotate(-8deg) !important;
    }

    main > .hero .hero__latest-card--2 {
        right: 3% !important;
        top: 31% !important;
        transform: rotate(7deg) !important;
    }

    main > .hero .hero__latest-card--3 {
        left: 5% !important;
        bottom: 3% !important;
        transform: rotate(4deg) !important;
    }

    main > .hero .hero__latest-card--4 {
        right: 5% !important;
        bottom: 3% !important;
        transform: rotate(-4deg) !important;
    }

    main > .hero .hero__latest-card--5 {
        left: 50% !important;
        top: -4% !important;
        transform: translateX(-50%) rotate(2deg) !important;
    }
}

@media (min-width: 1101px) and (max-width: 1599px) {
    body {
        --bt-vine-safe: clamp(140px, 10vw, 176px);
        --bt-laptop-gutter: clamp(1rem, 2vw, 1.75rem);
    }

    .hero__latest-relics,
    .hero__latest-card,
    .hero__latest-card--1,
    .hero__latest-card--2,
    .hero__latest-card--3,
    .hero__latest-card--4,
    .hero__latest-card--5 {
        display: none !important;
    }

    main > .hero {
        grid-template-columns: minmax(0, 1fr) minmax(240px, .42fr) !important;
        min-height: auto !important;
    }

    main > .hero .hero__sigil {
        width: min(320px, 24vw) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    main > .hero .hero__sigil > img {
        width: min(210px, 72%) !important;
    }
}

@media (min-width: 721px) and (max-width: 1100px) {
    body::after {
        display: none !important;
        content: none !important;
    }

    main > .hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band,
    .page-hero,
    .content-section,
    .catalog-layout {
        width: min(100% - 2rem, 1040px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .catalog-layout {
        grid-template-columns: 1fr !important;
    }

    .filter-panel {
        position: static !important;
        max-height: none !important;
        overflow: visible !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .filter-panel h2,
    .filter-panel .btn {
        grid-column: 1 / -1 !important;
    }

    .catalog-results .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .catalog-results .product-card {
        max-width: none !important;
    }

    .rarity-guide-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    .catalog-layout {
        width: min(100% - 1rem, 720px) !important;
        grid-template-columns: 1fr !important;
    }

    .filter-panel {
        position: static !important;
        max-height: none !important;
        overflow: visible !important;
        grid-template-columns: 1fr !important;
    }

    .catalog-results .product-grid {
        grid-template-columns: 1fr !important;
    }

    .catalog-results .product-card {
        max-width: none !important;
    }

    .rarity-guide-grid {
        grid-template-columns: 1fr !important;
    }

    .codex-category > summary {
        grid-template-columns: 42px minmax(0, 1fr) 2.15rem !important;
        gap: .75rem !important;
    }

    .codex-category__marker {
        width: 2.1rem;
        height: 2.1rem;
    }
}

@media (max-width: 1100px) {
    .site-header .nav-toggle {
        position: relative !important;
        width: 68px !important;
        height: 60px !important;
        border: 0 !important;
        background:
            radial-gradient(circle at 38% 20%, rgba(255, 232, 196, .12), transparent 42%),
            linear-gradient(145deg, rgba(33, 48, 49, .9), rgba(10, 7, 9, .94) 56%, rgba(70, 38, 48, .88)) !important;
        clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 10px, 100% calc(100% - 10px), calc(100% - 10px) 100%, 10px 100%, 0 calc(100% - 10px), 0 10px) !important;
        box-shadow:
            0 0 0 1px rgba(14, 8, 10, .96),
            0 0 18px rgba(82, 130, 120, .25),
            0 0 20px rgba(204, 128, 116, .18),
            0 10px 18px rgba(0, 0, 0, .46) !important;
        overflow: visible !important;
    }

    .site-header .nav-toggle::before,
    .site-header .nav-toggle::after {
        content: "" !important;
        display: block !important;
        position: absolute !important;
        pointer-events: none !important;
    }

    .site-header .nav-toggle::before {
        inset: 0 !important;
        border: 2px solid rgba(224, 145, 130, .84) !important;
        clip-path: inherit !important;
        box-shadow: inset 0 0 0 1px rgba(255, 232, 210, .12) !important;
    }

    .site-header .nav-toggle::after {
        inset: 7px !important;
        border: 1px solid rgba(240, 167, 157, .28) !important;
        border-radius: 7px !important;
        box-shadow: inset 0 0 16px rgba(82, 130, 120, .16) !important;
    }

    body .site-header .nav-toggle > span.nav-toggle-daggers:not(.sr-only) {
        display: block !important;
        position: relative !important;
        z-index: 1 !important;
        width: 62px !important;
        min-width: 62px !important;
        height: 46px !important;
        margin: 0 !important;
        background-image:
            url("../img/menu-dagger-real.png"),
            url("../img/menu-dagger-real.png"),
            url("../img/menu-dagger-real.png") !important;
        background-repeat: no-repeat !important;
        background-size: 46px 46px, 46px 46px, 46px 46px !important;
        background-position: center -11px, center center, center calc(100% + 11px) !important;
        background-color: transparent !important;
        filter:
            drop-shadow(0 2px 1px rgba(0, 0, 0, .9))
            drop-shadow(0 0 7px rgba(240, 167, 157, .34))
            drop-shadow(0 0 8px rgba(82, 130, 120, .24)) !important;
        opacity: 1 !important;
    }
}

@media (max-width: 420px) {
    .site-header .nav-toggle {
        width: 62px !important;
        height: 56px !important;
    }

    body .site-header .nav-toggle > span.nav-toggle-daggers:not(.sr-only) {
        width: 56px !important;
        min-width: 56px !important;
        height: 42px !important;
        background-size: 43px 43px, 43px 43px, 43px 43px !important;
        background-position: center -10px, center center, center calc(100% + 10px) !important;
    }
}

/* Final index contract: one frame for every home block. */
main > section.hero,
main > section.section.featured-relics-section,
main > section.section.home-collection-section,
main > section.section.popular-relics-section,
main > section.section.craft-band,
main > section.section.traveler-words,
main > section.section.newsletter-band {
    box-sizing: border-box !important;
    width: min(1440px, calc(100% - 2rem)) !important;
    max-width: none !important;
    margin-inline: auto !important;
}

main > section.hero .hero__bg {
    inset: 0 !important;
    width: 100% !important;
    max-width: none !important;
}

main > section.section.featured-relics-section > .home-heading-rpg,
main > section.section.home-collection-section > .home-heading-rpg,
main > section.section.popular-relics-section > .home-heading-rpg {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 116px !important;
    margin: 0 0 1.35rem !important;
    display: grid !important;
    grid-template-columns: 64px minmax(0, 1fr) max-content !important;
    align-items: center !important;
    gap: 1.1rem !important;
}

main > section.section.featured-relics-section > .home-heading-rpg h2,
main > section.section.home-collection-section > .home-heading-rpg h2,
main > section.section.popular-relics-section > .home-heading-rpg h2 {
    font-size: clamp(2rem, 3vw, 3.15rem) !important;
    line-height: 1 !important;
}

main > section.section.featured-relics-section > .product-grid,
main > section.section.home-collection-section > .collection-grid,
main > section.section.popular-relics-section > .product-grid {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
}

@media (min-width: 1600px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(1840px, calc(100% - 3rem)) !important;
    }

    main > section.hero {
        grid-template-columns: minmax(0, 1fr) minmax(720px, .8fr) !important;
    }

    main > section.hero .hero__sigil {
        width: min(780px, 43vw) !important;
    }

    main > section.hero .hero__latest-relics {
        inset: -.45rem -1.1rem 1.1rem !important;
        overflow: visible !important;
    }

    main > section.hero .hero__latest-card,
    main > section.hero .hero__latest-card--5 {
        width: clamp(112px, 5.4vw, 136px) !important;
    }

    main > section.hero .hero__latest-card--1 {
        left: -3% !important;
        top: 34% !important;
    }

    main > section.hero .hero__latest-card--2 {
        right: -3% !important;
        top: 33% !important;
    }

    main > section.hero .hero__latest-card--3 {
        left: -1% !important;
        bottom: 2% !important;
    }

    main > section.hero .hero__latest-card--4 {
        right: -1% !important;
        bottom: 2% !important;
    }

    main > section.hero .hero__latest-card--5 {
        top: -5% !important;
    }
}

@media (min-width: 1101px) and (max-width: 1599px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: auto !important;
        max-width: 1440px !important;
        margin-left: var(--bt-laptop-gutter, 1.5rem) !important;
        margin-right: calc(var(--bt-vine-safe, 140px) + var(--bt-laptop-gutter, 1.5rem)) !important;
    }
}

@media (min-width: 721px) and (max-width: 1100px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(100% - 2rem, 1040px) !important;
        margin-inline: auto !important;
    }

    main > section.section.featured-relics-section > .home-heading-rpg,
    main > section.section.home-collection-section > .home-heading-rpg,
    main > section.section.popular-relics-section > .home-heading-rpg {
        grid-template-columns: 54px minmax(0, 1fr) max-content !important;
        min-height: 104px !important;
    }
}

@media (max-width: 720px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(100% - 1rem, 720px) !important;
        margin-inline: auto !important;
    }

    main > section.section.featured-relics-section > .home-heading-rpg,
    main > section.section.home-collection-section > .home-heading-rpg,
    main > section.section.popular-relics-section > .home-heading-rpg {
        grid-template-columns: 42px minmax(0, 1fr) !important;
        min-height: 0 !important;
        align-items: start !important;
    }
}

main > section.hero .hero__latest-card > span {
    display: grid !important;
    place-items: center !important;
    min-height: 2.45em !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    text-align: center !important;
}

main > section.hero .hero__latest-card > img {
    aspect-ratio: auto !important;
}

/* Final mobile/tablet header contract. */
@media (max-width: 1100px) {
    .site-header .nav-shell {
        min-height: 86px !important;
        grid-template-columns: 82px minmax(0, 1fr) 76px !important;
        align-items: center !important;
        padding: .65rem clamp(.85rem, 2.4vw, 1.3rem) !important;
    }

    .site-header .nav-shell::before {
        font-size: clamp(1.55rem, 9.2vw, 2.65rem) !important;
        line-height: 1 !important;
    }

    .site-header .brand {
        width: 74px !important;
        min-width: 74px !important;
        min-height: 74px !important;
        justify-self: start !important;
    }

    .site-header .brand > img:first-child {
        width: 70px !important;
        min-width: 70px !important;
        height: 70px !important;
    }

    .site-header .nav-toggle {
        width: 68px !important;
        height: 60px !important;
        justify-self: end !important;
    }
}

@media (max-width: 420px) {
    .site-header .nav-shell {
        min-height: 80px !important;
        grid-template-columns: 70px minmax(0, 1fr) 66px !important;
        padding: .55rem .72rem !important;
    }

    .site-header .brand {
        width: 64px !important;
        min-width: 64px !important;
        min-height: 64px !important;
    }

    .site-header .brand > img:first-child {
        width: 60px !important;
        min-width: 60px !important;
        height: 60px !important;
    }

    .site-header .nav-toggle {
        width: 62px !important;
        height: 56px !important;
    }
}

/* Catalogue rarity note: RPG sheet, not a separate guide page. */
.catalog-rarity-note {
    box-sizing: border-box !important;
    width: min(1440px, calc(100% - 2rem)) !important;
    margin: 0 auto clamp(1rem, 2vw, 1.45rem) !important;
    padding: clamp(.9rem, 1.8vw, 1.25rem) !important;
    border: 1px solid rgba(240, 167, 157, .28) !important;
    border-radius: 8px !important;
    background:
        radial-gradient(circle at 7% 0, rgba(240, 167, 157, .18), transparent 15rem),
        radial-gradient(circle at 88% 15%, rgba(82, 130, 120, .18), transparent 14rem),
        linear-gradient(145deg, rgba(46, 26, 37, .82), rgba(10, 7, 9, .88)) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 235, 220, .035),
        inset 0 0 42px rgba(82, 130, 120, .08),
        0 18px 44px rgba(0, 0, 0, .28) !important;
}

.catalog-rarity-note__intro {
    display: grid !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    gap: .95rem !important;
    align-items: center !important;
    margin-bottom: .85rem !important;
}

.catalog-rarity-note__rune {
    width: 50px !important;
    height: 50px !important;
}

.catalog-rarity-note h2 {
    margin: 0 !important;
    font-family: var(--font-heading) !important;
    font-size: clamp(1.75rem, 2.5vw, 2.6rem) !important;
    line-height: 1 !important;
}

.catalog-rarity-note p {
    margin: .25rem 0 0 !important;
}

.catalog-rarity-note__grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: .65rem !important;
}

.catalog-rarity-note__grid article {
    padding: .78rem .85rem !important;
    border: 1px solid rgba(240, 167, 157, .22) !important;
    border-radius: 7px !important;
    background:
        linear-gradient(180deg, rgba(255, 235, 220, .045), transparent 42%),
        rgba(11, 7, 9, .46) !important;
}

.catalog-rarity-note__grid strong {
    display: block !important;
    color: #fff1e9 !important;
    font-family: var(--font-heading) !important;
    font-size: clamp(1.3rem, 1.8vw, 1.75rem) !important;
    line-height: 1 !important;
    margin-bottom: .25rem !important;
}

.catalog-rarity-note__grid .text-flow,
.catalog-rarity-note__grid .text-flow p {
    color: #ead4ca !important;
    font-size: .98rem !important;
    line-height: 1.35 !important;
}

/* Catalogue compact filter for laptop-sized screens. */
.catalog-layout {
    grid-template-columns: minmax(10.5rem, 13.25rem) minmax(0, 1fr) !important;
}

.filter-panel {
    padding: .9rem !important;
    gap: .68rem !important;
}

.filter-panel h2 {
    margin-bottom: .05rem !important;
    font-size: clamp(1.55rem, 1.9vw, 2rem) !important;
}

.filter-panel label {
    gap: .24rem !important;
    font-size: .9rem !important;
    line-height: 1.15 !important;
}

.filter-panel input,
.filter-panel select {
    min-height: 2.45rem !important;
    padding: .55rem .65rem !important;
    font-size: .92rem !important;
}

.filter-panel .btn {
    min-height: 2.55rem !important;
    padding: .55rem .75rem !important;
}

.catalog-results .product-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 17.5rem)) !important;
}

.catalog-results .product-card {
    max-width: 17.5rem !important;
}

/* Codex legend and craft panels. */
.content-section-legend_hero {
    background:
        radial-gradient(circle at 12% 0, rgba(82, 130, 120, .14), transparent 18rem),
        linear-gradient(145deg, rgba(30, 17, 24, .84), rgba(8, 6, 8, .9)) !important;
}

.content-section-legend_hero .codex-prose-panel {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.content-section-legend_hero .codex-prose-panel article {
    padding: clamp(1rem, 2vw, 1.35rem) !important;
    border: 1px solid rgba(240, 167, 157, .24) !important;
    border-radius: 8px !important;
    background:
        radial-gradient(circle at 0 0, rgba(240, 167, 157, .12), transparent 14rem),
        linear-gradient(145deg, rgba(58, 31, 43, .62), rgba(11, 7, 9, .72)) !important;
}

.content-section-craft_process.codex-section--section_collapsed {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.content-section-craft_process .codex-category {
    border: 1px solid rgba(240, 167, 157, .3) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background:
        radial-gradient(circle at 10% 0, rgba(240, 167, 157, .16), transparent 16rem),
        linear-gradient(145deg, rgba(45, 24, 35, .86), rgba(8, 6, 8, .9)) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 235, 220, .035),
        0 18px 46px rgba(0, 0, 0, .28) !important;
}

.content-section-craft_process .codex-category > summary.section-heading {
    margin: 0 !important;
    padding: clamp(1rem, 2.1vw, 1.45rem) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(240, 167, 157, .18) !important;
    border-radius: 0 !important;
    background:
        radial-gradient(circle at 92% 0, rgba(82, 130, 120, .16), transparent 13rem),
        linear-gradient(180deg, rgba(255, 235, 220, .04), rgba(11, 7, 9, .1)) !important;
}

.content-section-craft_process .codex-category__body {
    padding: clamp(.9rem, 2vw, 1.25rem) !important;
    background:
        linear-gradient(180deg, rgba(82, 130, 120, .08), transparent 36%),
        rgba(7, 5, 7, .3) !important;
}

.content-section-craft_process .content-section__grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)) !important;
    gap: .85rem !important;
}

.content-section-craft_process .content-block {
    border-color: rgba(240, 167, 157, .22) !important;
    background:
        linear-gradient(180deg, rgba(255, 235, 220, .045), transparent 44%),
        linear-gradient(145deg, rgba(44, 25, 35, .58), rgba(9, 6, 8, .72)) !important;
}

@media (min-width: 1101px) and (max-width: 1599px) {
    .catalog-rarity-note {
        width: auto !important;
        max-width: 1440px !important;
        margin-left: var(--bt-laptop-gutter, 1.5rem) !important;
        margin-right: calc(var(--bt-vine-safe, 140px) + var(--bt-laptop-gutter, 1.5rem)) !important;
        padding: .95rem !important;
    }

    .catalog-rarity-note__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .catalog-layout {
        grid-template-columns: minmax(10rem, 12.25rem) minmax(0, 1fr) !important;
        gap: 1rem !important;
    }

    .filter-panel {
        max-height: calc(100dvh - 5.25rem) !important;
        padding: .75rem !important;
        gap: .52rem !important;
    }

    .filter-panel h2 {
        font-size: 1.55rem !important;
    }

    .filter-panel input,
    .filter-panel select {
        min-height: 2.2rem !important;
        padding: .45rem .55rem !important;
    }
}

@media (min-width: 721px) and (max-width: 1100px) {
    .catalog-rarity-note {
        width: min(100% - 2rem, 1040px) !important;
    }

    .catalog-rarity-note__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 720px) {
    .catalog-rarity-note {
        width: min(100% - 1rem, 720px) !important;
        padding: .85rem !important;
    }

    .catalog-rarity-note__intro {
        grid-template-columns: 44px minmax(0, 1fr) !important;
    }

    .catalog-rarity-note__rune {
        width: 40px !important;
        height: 40px !important;
    }

    .catalog-rarity-note__grid {
        grid-template-columns: 1fr !important;
    }
}

/* Final responsive pass: index, reliquary side note and codex collapsibles. */
main > section.hero,
main > section.section.featured-relics-section,
main > section.section.home-collection-section,
main > section.section.popular-relics-section,
main > section.section.craft-band,
main > section.section.traveler-words,
main > section.section.newsletter-band {
    box-sizing: border-box !important;
}

@media (min-width: 1600px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(1440px, calc(100% - 2rem)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

@media (min-width: 1101px) and (max-width: 1599px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: auto !important;
        max-width: 1440px !important;
        margin-left: var(--bt-laptop-gutter, 1.5rem) !important;
        margin-right: calc(var(--bt-vine-safe, 140px) + var(--bt-laptop-gutter, 1.5rem)) !important;
    }

    main > section.hero {
        grid-template-columns: minmax(0, .95fr) minmax(330px, .7fr) !important;
        min-height: clamp(610px, 78vh, 760px) !important;
        padding: clamp(1.65rem, 3.8vw, 3.4rem) !important;
    }

    main > section.hero h1 {
        font-size: clamp(4.4rem, 5.2vw, 6.2rem) !important;
    }
}

@media (min-width: 721px) and (max-width: 1100px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(100% - 2rem, 1040px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

@media (max-width: 720px) {
    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(100% - 1rem, 720px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

main > section.section.featured-relics-section > .home-heading-rpg,
main > section.section.home-collection-section > .home-heading-rpg,
main > section.section.popular-relics-section > .home-heading-rpg {
    width: 100% !important;
    min-width: 0 !important;
}

@media (min-width: 1101px) {
    main > section.hero .hero__sigil {
        width: min(700px, 38vw) !important;
    }

    main > section.hero .hero__latest-relics {
        inset: -1.15rem -2.5rem .75rem -2.5rem !important;
        overflow: visible !important;
    }

    main > section.hero .hero__latest-card,
    main > section.hero .hero__latest-card--5 {
        width: clamp(116px, 6.1vw, 148px) !important;
    }

    main > section.hero .hero__latest-card--1 {
        left: -9% !important;
        top: 31% !important;
    }

    main > section.hero .hero__latest-card--2 {
        right: -9% !important;
        top: 31% !important;
    }

    main > section.hero .hero__latest-card--3 {
        left: -8% !important;
        bottom: 4% !important;
    }

    main > section.hero .hero__latest-card--4 {
        right: -8% !important;
        bottom: 4% !important;
    }

    main > section.hero .hero__latest-card--5 {
        top: -9% !important;
    }
}

@media (min-width: 1101px) and (max-width: 1599px) {
    main > section.hero .hero__sigil {
        width: min(520px, 34vw) !important;
    }

    main > section.hero .hero__latest-relics {
        inset: -.55rem -1.6rem .45rem -1.6rem !important;
    }

    main > section.hero .hero__latest-card,
    main > section.hero .hero__latest-card--5 {
        width: clamp(104px, 7.1vw, 130px) !important;
    }

    main > section.hero .hero__latest-card--1 {
        left: -7% !important;
        top: 33% !important;
    }

    main > section.hero .hero__latest-card--2 {
        right: -7% !important;
        top: 33% !important;
    }

    main > section.hero .hero__latest-card--3 {
        left: -5% !important;
        bottom: 4% !important;
    }

    main > section.hero .hero__latest-card--4 {
        right: -5% !important;
        bottom: 4% !important;
    }

    main > section.hero .hero__latest-card--5 {
        top: -7% !important;
    }
}

.catalog-layout {
    align-items: start !important;
    grid-template-columns: minmax(15rem, 19rem) minmax(0, 1fr) !important;
    gap: clamp(1.1rem, 2vw, 1.75rem) !important;
}

.catalog-sidebar {
    display: grid !important;
    gap: 1rem !important;
    min-width: 0 !important;
    align-self: start !important;
}

.catalog-sidebar .filter-panel {
    width: 100% !important;
}

.catalog-sidebar .catalog-rarity-note {
    width: 100% !important;
    margin: 0 !important;
}

.catalog-rarity-note {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
    padding: clamp(1rem, 1.7vw, 1.25rem) !important;
    border: 1px solid rgba(80, 48, 38, .7) !important;
    border-radius: 4px !important;
    color: #392128 !important;
    background:
        linear-gradient(135deg, rgba(255, 244, 213, .36), transparent 30%),
        linear-gradient(315deg, rgba(86, 49, 40, .16), transparent 34%),
        repeating-linear-gradient(0deg, rgba(74, 43, 34, .05) 0 1px, transparent 1px 5px),
        #b89072 !important;
    box-shadow:
        0 16px 34px rgba(0, 0, 0, .3),
        inset 0 0 0 1px rgba(255, 238, 198, .34),
        inset 0 0 42px rgba(78, 40, 32, .2) !important;
    transform: rotate(-.45deg);
}

.catalog-rarity-note::before {
    content: "" !important;
    position: absolute !important;
    inset: .55rem !important;
    border: 1px solid rgba(76, 45, 36, .36) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

.catalog-rarity-note::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(65, 38, 31, .1), transparent 12%, transparent 88%, rgba(65, 38, 31, .12)),
        linear-gradient(180deg, rgba(255, 245, 216, .15), transparent 22%, rgba(72, 38, 31, .13)) !important;
    mix-blend-mode: multiply !important;
    z-index: 0 !important;
}

.catalog-rarity-note > * {
    position: relative !important;
    z-index: 1 !important;
}

.catalog-rarity-note__intro {
    grid-template-columns: 44px minmax(0, 1fr) !important;
    gap: .7rem !important;
    margin-bottom: .8rem !important;
}

.catalog-rarity-note__rune {
    width: 38px !important;
    height: 38px !important;
    filter: sepia(.28) saturate(.9) contrast(.9) !important;
}

.catalog-rarity-note .eyebrow,
.catalog-rarity-note h2,
.catalog-rarity-note p,
.catalog-rarity-note__grid strong,
.catalog-rarity-note__grid .text-flow,
.catalog-rarity-note__grid .text-flow p {
    color: #3c2229 !important;
    text-shadow: none !important;
}

.catalog-rarity-note h2 {
    font-size: clamp(1.55rem, 1.9vw, 2rem) !important;
    line-height: 1 !important;
}

.catalog-rarity-note p {
    font-size: .98rem !important;
    line-height: 1.35 !important;
}

.catalog-rarity-note__grid {
    grid-template-columns: 1fr !important;
    gap: .5rem !important;
}

.catalog-rarity-note__grid article {
    padding: .6rem .65rem !important;
    border: 1px solid rgba(77, 45, 35, .38) !important;
    border-radius: 3px !important;
    background: rgba(255, 231, 187, .16) !important;
    box-shadow: inset 0 0 18px rgba(72, 37, 30, .08) !important;
}

.catalog-rarity-note__grid strong {
    font-size: clamp(1.22rem, 1.55vw, 1.55rem) !important;
}

.catalog-rarity-note__grid .text-flow,
.catalog-rarity-note__grid .text-flow p {
    font-size: .94rem !important;
    line-height: 1.32 !important;
}

.filter-panel {
    max-height: none !important;
    overflow: visible !important;
}

.catalog-results .product-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16.75rem), 19.5rem)) !important;
    justify-content: start !important;
    align-items: stretch !important;
}

.catalog-results .product-card {
    max-width: 19.5rem !important;
}

.product-card__body h3,
.product-card__body > p:not(.product-card__collection) {
    display: block !important;
    min-height: 0 !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: unset !important;
    text-overflow: clip !important;
}

@media (min-width: 1600px) {
    .catalog-layout {
        width: min(1600px, calc(100% - 3rem)) !important;
        grid-template-columns: minmax(17rem, 22rem) minmax(0, 1fr) !important;
    }

    .catalog-results .product-grid {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 22rem)) !important;
    }

    .catalog-results .product-card {
        max-width: 22rem !important;
    }

    .filter-panel {
        padding: 1.15rem !important;
        gap: .85rem !important;
    }

    .filter-panel h2 {
        font-size: clamp(1.9rem, 1.8vw, 2.45rem) !important;
    }

    .filter-panel label {
        font-size: .98rem !important;
    }

    .filter-panel input,
    .filter-panel select {
        min-height: 2.75rem !important;
        font-size: 1rem !important;
    }
}

@media (min-width: 1101px) and (max-width: 1599px) {
    .catalog-layout {
        grid-template-columns: minmax(10.8rem, 12.8rem) minmax(0, 1fr) !important;
        gap: 1rem !important;
    }

    .catalog-sidebar {
        gap: .75rem !important;
    }

    .filter-panel {
        max-height: calc(100dvh - 5.25rem) !important;
        overflow: auto !important;
        padding: .75rem !important;
        gap: .52rem !important;
    }

    .filter-panel h2 {
        font-size: 1.55rem !important;
    }

    .filter-panel label {
        font-size: .86rem !important;
    }

    .filter-panel input,
    .filter-panel select {
        min-height: 2.2rem !important;
        padding: .45rem .55rem !important;
        font-size: .88rem !important;
    }

    .catalog-rarity-note {
        padding: .8rem !important;
    }

    .catalog-rarity-note h2 {
        font-size: 1.42rem !important;
    }

    .catalog-rarity-note__grid .text-flow,
    .catalog-rarity-note__grid .text-flow p {
        font-size: .86rem !important;
    }

    .catalog-results .product-grid {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 15.25rem), 17.5rem)) !important;
    }

    .catalog-results .product-card {
        max-width: 17.5rem !important;
    }
}

@media (min-width: 721px) and (max-width: 1100px) {
    .catalog-layout {
        grid-template-columns: 1fr !important;
    }

    .catalog-sidebar {
        gap: 1rem !important;
    }

    .filter-panel {
        position: static !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .filter-panel h2,
    .filter-panel .btn {
        grid-column: 1 / -1 !important;
    }

    .catalog-rarity-note {
        transform: none !important;
    }

    .catalog-rarity-note__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .catalog-results .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .catalog-results .product-card {
        max-width: none !important;
    }
}

@media (max-width: 720px) {
    .catalog-layout {
        grid-template-columns: 1fr !important;
    }

    .catalog-sidebar {
        gap: .85rem !important;
    }

    .filter-panel {
        position: static !important;
        grid-template-columns: 1fr !important;
        max-height: none !important;
        overflow: visible !important;
    }

    .catalog-rarity-note {
        transform: none !important;
    }

    .catalog-rarity-note__grid {
        grid-template-columns: 1fr !important;
    }

    .catalog-results .product-grid {
        grid-template-columns: 1fr !important;
    }

    .catalog-results .product-card {
        max-width: none !important;
    }
}

details.codex-category > summary.codex-category__summary {
    display: grid !important;
    grid-template-columns: 56px minmax(0, 1fr) 2.35rem !important;
    align-items: center !important;
    gap: 1rem !important;
    min-width: 0 !important;
    list-style: none !important;
    cursor: pointer !important;
}

section.codex-section > .codex-category__summary:not(summary) {
    display: grid !important;
    grid-template-columns: 56px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 1rem !important;
    min-width: 0 !important;
}

details.codex-category > summary.codex-category__summary::-webkit-details-marker {
    display: none !important;
}

.codex-category__summary > div,
.codex-category__body,
.codex-category__body > * {
    min-width: 0 !important;
}

.codex-category__marker {
    justify-self: end !important;
    margin-left: auto !important;
}

.codex-category__body {
    display: block !important;
    clear: both !important;
}

.content-section-legend_hero {
    overflow: hidden !important;
    padding: clamp(1.25rem, 2.6vw, 2rem) !important;
    border: 1px solid rgba(204, 128, 116, .34) !important;
    border-radius: var(--radius) !important;
    background:
        radial-gradient(circle at 8% 0, rgba(240, 167, 157, .14), transparent 17rem),
        radial-gradient(circle at 92% 8%, rgba(82, 130, 120, .17), transparent 18rem),
        linear-gradient(145deg, rgba(59, 31, 42, .82), rgba(9, 7, 9, .9)) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 235, 220, .035),
        0 18px 48px rgba(0, 0, 0, .24) !important;
}

.content-section-legend_hero > .codex-category__summary:not(summary) {
    margin: 0 0 1.2rem !important;
    padding: 0 0 1.05rem !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(240, 167, 157, .24) !important;
    background: transparent !important;
}

.content-section-legend_hero > .codex-category__summary:not(summary)::after {
    content: none !important;
    display: none !important;
}

.content-section-legend_hero .codex-prose-panel {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.content-section-legend_hero .codex-prose-panel article {
    display: block !important;
    padding: clamp(1rem, 2.3vw, 1.55rem) !important;
    border: 1px solid rgba(240, 167, 157, .3) !important;
    border-left: 3px solid rgba(240, 167, 157, .72) !important;
    border-radius: 7px !important;
    background:
        radial-gradient(circle at 0 0, rgba(240, 167, 157, .16), transparent 14rem),
        linear-gradient(145deg, rgba(68, 38, 48, .66), rgba(10, 7, 9, .78)) !important;
}

.content-section-legend_hero .content-block__head h3 {
    font-size: clamp(2rem, 3vw, 3.2rem) !important;
    line-height: 1 !important;
}

.content-section-legend_hero .text-flow {
    max-width: 78ch !important;
    font-size: clamp(1.05rem, 1.2vw, 1.22rem) !important;
}

.content-section-craft_process.codex-section--section_collapsed {
    padding: clamp(1.25rem, 2.6vw, 2rem) !important;
    border: 1px solid rgba(204, 128, 116, .32) !important;
    border-radius: var(--radius) !important;
    background:
        radial-gradient(circle at 8% 0, rgba(240, 167, 157, .15), transparent 18rem),
        radial-gradient(circle at 94% 12%, rgba(82, 130, 120, .17), transparent 18rem),
        linear-gradient(145deg, rgba(54, 30, 39, .82), rgba(9, 7, 9, .9)) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 235, 220, .035),
        0 18px 48px rgba(0, 0, 0, .24) !important;
}

.content-section-craft_process .codex-category {
    border: 0 !important;
    border-radius: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
}

.content-section-craft_process .codex-category > summary.codex-category__summary {
    margin: 0 !important;
    padding: 0 0 1.05rem !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(240, 167, 157, .24) !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.content-section-craft_process .codex-category[open] > summary.codex-category__summary {
    margin-bottom: 1.2rem !important;
}

.content-section-craft_process .codex-category__body {
    padding: 0 !important;
    background: transparent !important;
}

.content-section-craft_process .content-section__grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem !important;
}

.content-section-craft_process .content-block {
    display: grid !important;
    gap: 1rem !important;
    min-width: 0 !important;
    padding: 1rem !important;
    overflow: hidden !important;
    border: 1px solid rgba(240, 167, 157, .24) !important;
    border-radius: 8px !important;
    background:
        radial-gradient(circle at 0 0, rgba(240, 167, 157, .12), transparent 11rem),
        linear-gradient(145deg, rgba(49, 28, 38, .64), rgba(10, 7, 9, .76)) !important;
}

.content-section-craft_process .content-block.has-media {
    grid-template-columns: minmax(140px, .38fr) minmax(0, 1fr) !important;
    align-items: start !important;
}

.content-section-craft_process .content-block > *,
.content-section-craft_process .content-block__head,
.content-section-craft_process .text-flow {
    min-width: 0 !important;
}

.content-section-craft_process .content-entry-media {
    width: 100% !important;
    max-height: 220px !important;
    aspect-ratio: 1.35 !important;
    object-fit: cover !important;
}

.content-section-craft_process .text-flow {
    font-size: clamp(.98rem, 1vw, 1.08rem) !important;
    line-height: 1.5 !important;
}

@media (max-width: 980px) {
    .content-section-craft_process .content-section__grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 720px) {
    details.codex-category > summary.codex-category__summary {
        grid-template-columns: 44px minmax(0, 1fr) 2.15rem !important;
        gap: .75rem !important;
    }

    section.codex-section > .codex-category__summary:not(summary) {
        grid-template-columns: 44px minmax(0, 1fr) !important;
        gap: .75rem !important;
    }

    .content-section-legend_hero,
    .content-section-craft_process.codex-section--section_collapsed {
        padding: 1rem !important;
    }

    .content-section-legend_hero .content-block__head h3 {
        font-size: clamp(1.75rem, 8vw, 2.5rem) !important;
    }

    .content-section-craft_process .content-block.has-media {
        grid-template-columns: 1fr !important;
    }

    .content-section-craft_process .content-entry-media {
        max-height: 220px !important;
        aspect-ratio: 1.45 !important;
        object-fit: contain !important;
    }
}

/* Catalogue hero rarity note: visible near the collection title, not mixed into filters. */
.page-hero.small.catalog-hero {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 31rem) !important;
    align-items: center !important;
    gap: clamp(1.3rem, 3vw, 3.4rem) !important;
    min-height: clamp(300px, 22vw, 430px) !important;
    padding: clamp(1.35rem, 3.2vw, 3rem) !important;
    overflow: hidden !important;
}

.catalog-hero__copy {
    position: relative !important;
    z-index: 1 !important;
    min-width: 0 !important;
}

.catalog-hero__copy h1 {
    max-width: 10ch !important;
}

.catalog-hero__copy > p:not(.eyebrow) {
    max-width: 58ch !important;
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero {
    justify-self: end !important;
    align-self: center !important;
    width: min(100%, 30.5rem) !important;
    margin: 0 !important;
    padding: clamp(1rem, 1.65vw, 1.3rem) !important;
    position: relative !important;
    z-index: 2 !important;
    overflow: hidden !important;
    isolation: isolate !important;
    transform: rotate(-1deg) !important;
    border: 1px solid rgba(74, 32, 22, .78) !important;
    border-radius: 3px 6px 4px 7px !important;
    clip-path: polygon(2% 0, 98% 1%, 100% 8%, 98.5% 99%, 4% 100%, 0 92%, 1% 7%) !important;
    color: #34201a !important;
    background:
        radial-gradient(ellipse at 0 0, rgba(45, 17, 11, .5), transparent 28%),
        radial-gradient(ellipse at 100% 0, rgba(53, 21, 12, .48), transparent 27%),
        radial-gradient(ellipse at 0 100%, rgba(53, 20, 12, .42), transparent 24%),
        radial-gradient(ellipse at 100% 100%, rgba(38, 13, 8, .5), transparent 28%),
        linear-gradient(135deg, rgba(255, 232, 177, .95), rgba(205, 145, 91, .96) 46%, rgba(146, 83, 52, .98)) !important;
    box-shadow:
        0 20px 42px rgba(0, 0, 0, .38),
        0 0 0 1px rgba(245, 192, 144, .18),
        inset 0 0 0 1px rgba(255, 244, 208, .42),
        inset 0 0 44px rgba(65, 24, 15, .3) !important;
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero::before {
    content: "" !important;
    position: absolute !important;
    inset: .68rem !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border: 1px solid rgba(82, 36, 24, .34) !important;
    border-radius: 2px 5px 3px 6px !important;
    clip-path: polygon(1.4% 0, 98% 1%, 100% 9%, 98.5% 99%, 4% 100%, 0 91%, 1% 7%) !important;
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(90deg, rgba(43, 15, 9, .5), transparent 7%, transparent 92%, rgba(38, 13, 8, .52)),
        linear-gradient(180deg, rgba(45, 16, 10, .48), transparent 8%, transparent 90%, rgba(36, 12, 8, .5)),
        repeating-linear-gradient(86deg, rgba(77, 39, 24, .12) 0 1px, transparent 1px 7px),
        radial-gradient(circle at 20% 28%, rgba(98, 45, 23, .18), transparent 7rem),
        radial-gradient(circle at 78% 70%, rgba(63, 26, 13, .2), transparent 8rem) !important;
    mix-blend-mode: multiply !important;
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero > * {
    position: relative !important;
    z-index: 1 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__intro {
    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: .75rem !important;
    margin: 0 0 .8rem !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__rune {
    width: 40px !important;
    height: 40px !important;
    filter: sepia(.45) saturate(.9) contrast(.9) drop-shadow(0 2px 2px rgba(60, 23, 15, .28)) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow {
    margin: 0 0 .15rem !important;
    color: #6d2c24 !important;
    letter-spacing: .18em !important;
    text-shadow: 0 1px rgba(255, 235, 187, .45) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero h2 {
    margin: 0 !important;
    color: #321817 !important;
    font-size: clamp(1.7rem, 2.1vw, 2.35rem) !important;
    line-height: .98 !important;
    text-shadow: 0 1px rgba(255, 236, 191, .35) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero p {
    margin: .2rem 0 0 !important;
    color: #44271f !important;
    font-size: clamp(.95rem, .95vw, 1.05rem) !important;
    line-height: 1.35 !important;
    text-shadow: none !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .55rem !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid article {
    padding: .55rem .6rem !important;
    border: 1px solid rgba(80, 35, 23, .24) !important;
    border-radius: 3px !important;
    background:
        linear-gradient(180deg, rgba(255, 244, 203, .24), rgba(105, 48, 28, .08)) !important;
    box-shadow: inset 0 0 18px rgba(56, 20, 12, .08) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
    display: block !important;
    margin: 0 0 .12rem !important;
    color: #2d1715 !important;
    font-family: var(--font-heading) !important;
    font-size: clamp(1.15rem, 1.35vw, 1.45rem) !important;
    line-height: 1 !important;
    text-shadow: 0 1px rgba(255, 235, 187, .35) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #44271f !important;
    font-size: clamp(.9rem, .82vw, .98rem) !important;
    line-height: 1.28 !important;
}

.catalog-layout {
    position: relative !important;
    z-index: 1 !important;
}

.catalog-sidebar {
    position: relative !important;
    z-index: 3 !important;
}

@media (min-width: 1101px) and (max-width: 1599px) {
    .page-hero.small.catalog-hero {
        grid-template-columns: minmax(0, 1fr) minmax(17rem, 25rem) !important;
        min-height: clamp(280px, 24vw, 390px) !important;
        gap: clamp(1rem, 2.2vw, 2rem) !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__grid {
        grid-template-columns: 1fr !important;
    }
}

@media (min-width: 721px) and (max-width: 1100px) {
    .page-hero.small.catalog-hero {
        grid-template-columns: 1fr !important;
        justify-items: center !important;
        text-align: center !important;
        gap: 1.25rem !important;
    }

    .catalog-hero__copy h1 {
        max-width: 12ch !important;
    }

    .catalog-hero__copy > p:not(.eyebrow) {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        justify-self: center !important;
        width: min(100%, 42rem) !important;
        transform: rotate(-.45deg) !important;
        text-align: left !important;
    }
}

@media (max-width: 720px) {
    .page-hero.small.catalog-hero {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
        min-height: 0 !important;
        text-align: left !important;
    }

    .catalog-hero__copy h1 {
        max-width: none !important;
    }

    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        width: 100% !important;
        transform: none !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__intro,
    .page-hero.small.catalog-hero .catalog-rarity-note__grid {
        grid-template-columns: 1fr !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__rune {
        display: none !important;
    }
}

/* Treasure-map parchment version for the reliquary rarity note. */
.page-hero.small.catalog-hero > .catalog-rarity-note--hero {
    width: min(100%, 34rem) !important;
    padding: clamp(1.35rem, 2vw, 1.75rem) !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #2e180e !important;
    transform: rotate(-1.35deg) !important;
    clip-path: polygon(
        4% 6%, 8% 2%, 13% 4%, 18% 1%, 24% 4%, 31% 2%,
        38% 4%, 45% 1%, 52% 4%, 60% 2%, 67% 4%, 75% 1%,
        82% 4%, 90% 2%, 96% 7%, 98% 15%, 96% 23%, 99% 31%,
        97% 39%, 100% 48%, 97% 56%, 99% 65%, 96% 73%, 98% 82%,
        94% 94%, 87% 98%, 78% 96%, 70% 99%, 61% 96%, 53% 99%,
        45% 96%, 36% 98%, 28% 96%, 20% 99%, 12% 96%, 5% 93%,
        2% 84%, 4% 75%, 1% 66%, 3% 57%, 0 49%, 3% 40%,
        1% 31%, 4% 22%, 2% 13%
    ) !important;
    background:
        radial-gradient(ellipse at 50% 45%, rgba(255, 226, 171, .98) 0 50%, rgba(218, 158, 88, .9) 69%, rgba(100, 48, 18, .86) 86%, rgba(24, 9, 3, .98) 100%),
        linear-gradient(135deg, #e5ad6f, #b66f38) !important;
    box-shadow:
        0 22px 36px rgba(0, 0, 0, .48),
        0 0 30px rgba(0, 0, 0, .22),
        inset 0 0 34px rgba(59, 25, 10, .32) !important;
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero::before {
    inset: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    clip-path: inherit !important;
    background:
        linear-gradient(90deg, transparent 48%, rgba(93, 52, 25, .17) 49%, rgba(93, 52, 25, .11) 51%, transparent 53%),
        linear-gradient(180deg, transparent 47%, rgba(93, 52, 25, .12) 49%, rgba(93, 52, 25, .08) 51%, transparent 53%),
        repeating-linear-gradient(84deg, rgba(81, 45, 23, .14) 0 1px, transparent 1px 7px),
        repeating-linear-gradient(2deg, rgba(255, 236, 186, .12) 0 1px, transparent 1px 10px),
        radial-gradient(circle at 20% 24%, rgba(89, 47, 20, .18), transparent 4.5rem),
        radial-gradient(circle at 75% 58%, rgba(92, 46, 18, .18), transparent 5rem) !important;
    opacity: .72 !important;
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero::after {
    inset: 0 !important;
    clip-path: inherit !important;
    background:
        radial-gradient(ellipse at 10% 0, rgba(10, 4, 1, .95), transparent 19%),
        radial-gradient(ellipse at 90% 0, rgba(11, 4, 1, .94), transparent 18%),
        radial-gradient(ellipse at 0 18%, rgba(13, 5, 1, .95), transparent 18%),
        radial-gradient(ellipse at 100% 46%, rgba(13, 5, 1, .94), transparent 18%),
        radial-gradient(ellipse at 8% 100%, rgba(10, 4, 1, .96), transparent 20%),
        radial-gradient(ellipse at 92% 100%, rgba(10, 4, 1, .95), transparent 20%),
        linear-gradient(90deg, rgba(12, 5, 1, .92), rgba(95, 42, 15, .58) 7%, transparent 18%, transparent 82%, rgba(95, 42, 15, .58) 93%, rgba(12, 5, 1, .92)),
        linear-gradient(180deg, rgba(12, 5, 1, .9), rgba(105, 46, 16, .52) 9%, transparent 20%, transparent 80%, rgba(105, 46, 16, .52) 91%, rgba(12, 5, 1, .9)) !important;
    mix-blend-mode: multiply !important;
    opacity: .86 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow {
    color: #6b2b13 !important;
    text-shadow: 0 1px rgba(255, 230, 171, .5) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero h2 {
    color: #2b130b !important;
    font-size: clamp(1.9rem, 2.25vw, 2.65rem) !important;
    text-shadow: 0 1px rgba(255, 230, 171, .42) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero p,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #3a1f12 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid {
    gap: .42rem .55rem !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid article {
    padding: .5rem .55rem !important;
    border: 1px solid rgba(77, 37, 16, .16) !important;
    border-radius: 0 !important;
    background: rgba(255, 230, 173, .16) !important;
    box-shadow:
        inset 0 1px rgba(255, 242, 197, .14),
        inset 0 -1px rgba(74, 31, 12, .08) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
    color: #2a130b !important;
    text-shadow: 0 1px rgba(255, 230, 171, .38) !important;
}

@media (min-width: 721px) and (max-width: 1100px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        width: min(100%, 40rem) !important;
        transform: rotate(-.8deg) !important;
    }
}

@media (max-width: 720px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        padding: 1.2rem !important;
        transform: rotate(-.45deg) !important;
    }
}

/* Final reliquary parchment: old treasure-map sheet, without shifting the hero title. */
.page-hero.small.catalog-hero {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 0 !important;
    min-height: clamp(300px, 20vw, 420px) !important;
    padding: clamp(3rem, 4.8vw, 5.5rem) !important;
}

.catalog-hero__copy {
    width: min(74ch, calc(100% - clamp(27rem, 35vw, 42rem))) !important;
    max-width: 74ch !important;
    min-width: 0 !important;
}

.catalog-hero__copy h1 {
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.catalog-hero__copy > p:not(.eyebrow) {
    max-width: 66ch !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero {
    position: absolute !important;
    top: 50% !important;
    right: clamp(2.4rem, 6vw, 7rem) !important;
    z-index: 2 !important;
    width: clamp(25rem, 28vw, 35rem) !important;
    margin: 0 !important;
    padding: clamp(2rem, 2.35vw, 2.7rem) clamp(2rem, 2.5vw, 2.9rem) !important;
    transform: translateY(-50%) rotate(-1.2deg) !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: #2d160b !important;
    overflow: hidden !important;
    isolation: isolate !important;
    clip-path: polygon(
        4% 9%, 7% 5%, 10% 7%, 13% 3%, 17% 5%, 20% 3%,
        25% 5%, 29% 2%, 34% 4%, 39% 3%, 45% 5%, 51% 2%,
        57% 4%, 63% 2%, 68% 5%, 74% 3%, 79% 6%, 84% 3%,
        89% 5%, 94% 4%, 97% 9%, 95% 15%, 98% 21%, 96% 27%,
        99% 34%, 96% 40%, 98% 47%, 95% 54%, 99% 62%, 96% 69%,
        98% 76%, 95% 83%, 97% 91%, 93% 96%, 88% 94%, 83% 98%,
        78% 95%, 72% 97%, 66% 94%, 60% 97%, 54% 95%, 48% 98%,
        42% 95%, 36% 97%, 31% 94%, 25% 97%, 20% 94%, 15% 98%,
        10% 95%, 5% 93%, 3% 86%, 5% 79%, 2% 72%, 4% 65%,
        1% 58%, 4% 51%, 2% 45%, 5% 38%, 2% 31%, 5% 24%,
        3% 17%
    ) !important;
    background:
        radial-gradient(ellipse at 50% 47%, rgba(251, 220, 166, .98) 0 48%, rgba(221, 162, 92, .94) 66%, rgba(126, 58, 23, .9) 83%, rgba(21, 8, 2, .98) 100%),
        #d29a61 !important;
    box-shadow:
        0 22px 34px rgba(0, 0, 0, .5),
        0 7px 16px rgba(0, 0, 0, .34),
        inset 0 0 24px rgba(95, 43, 16, .18) !important;
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    clip-path: inherit !important;
    background:
        radial-gradient(ellipse at 24% 18%, rgba(103, 55, 26, .17), transparent 6rem),
        radial-gradient(ellipse at 78% 26%, rgba(120, 65, 30, .14), transparent 5.5rem),
        radial-gradient(ellipse at 36% 72%, rgba(85, 43, 19, .16), transparent 6.5rem),
        radial-gradient(ellipse at 70% 82%, rgba(116, 62, 30, .13), transparent 5rem),
        radial-gradient(circle at 18% 45%, rgba(40, 18, 8, .18) 0 .08rem, transparent .11rem),
        radial-gradient(circle at 62% 34%, rgba(40, 18, 8, .13) 0 .07rem, transparent .1rem),
        radial-gradient(circle at 85% 61%, rgba(40, 18, 8, .15) 0 .075rem, transparent .105rem),
        linear-gradient(115deg, rgba(255, 240, 191, .18), transparent 36%, rgba(83, 38, 16, .12)) !important;
    opacity: .88 !important;
    mix-blend-mode: multiply !important;
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 0 !important;
    pointer-events: none !important;
    clip-path: inherit !important;
    background:
        radial-gradient(ellipse at 50% -5%, rgba(8, 3, 0, .98), rgba(51, 19, 4, .7) 9%, transparent 27%),
        radial-gradient(ellipse at 50% 105%, rgba(8, 3, 0, .98), rgba(51, 19, 4, .68) 9%, transparent 27%),
        radial-gradient(ellipse at -4% 50%, rgba(8, 3, 0, .98), rgba(51, 19, 4, .7) 10%, transparent 30%),
        radial-gradient(ellipse at 104% 50%, rgba(8, 3, 0, .98), rgba(51, 19, 4, .7) 10%, transparent 30%),
        radial-gradient(ellipse at 4% 8%, rgba(3, 1, 0, .98), rgba(56, 19, 3, .7) 10%, transparent 24%),
        radial-gradient(ellipse at 96% 10%, rgba(3, 1, 0, .98), rgba(56, 19, 3, .68) 10%, transparent 24%),
        radial-gradient(ellipse at 5% 94%, rgba(3, 1, 0, .98), rgba(56, 19, 3, .68) 10%, transparent 24%),
        radial-gradient(ellipse at 95% 93%, rgba(3, 1, 0, .98), rgba(56, 19, 3, .68) 10%, transparent 24%) !important;
    opacity: .72 !important;
    mix-blend-mode: multiply !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__intro {
    display: block !important;
    margin: 0 0 .9rem !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__rune {
    display: none !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow {
    margin: 0 0 .2rem !important;
    color: #744021 !important;
    letter-spacing: .22em !important;
    opacity: .95 !important;
    text-shadow: 0 1px rgba(255, 231, 174, .36) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero h2 {
    margin: 0 !important;
    color: #2c1308 !important;
    font-size: clamp(2rem, 2.35vw, 2.75rem) !important;
    line-height: .95 !important;
    text-shadow: 0 1px rgba(255, 231, 174, .35) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero p,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    margin-top: .28rem !important;
    color: #3a1d0e !important;
    font-size: clamp(.96rem, .92vw, 1.04rem) !important;
    line-height: 1.34 !important;
    text-shadow: 0 1px rgba(255, 232, 177, .2) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: .5rem 1rem !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid article {
    display: block !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
    display: block !important;
    margin: 0 !important;
    color: #2a1309 !important;
    font-family: var(--font-heading) !important;
    font-size: clamp(1.22rem, 1.35vw, 1.55rem) !important;
    line-height: 1 !important;
    text-shadow: 0 1px rgba(255, 231, 174, .35) !important;
}

@media (min-width: 1101px) and (max-width: 1599px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        right: clamp(1.5rem, 4vw, 4rem) !important;
        width: clamp(22rem, 29vw, 29rem) !important;
        padding: 1.85rem 2rem !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__grid {
        grid-template-columns: 1fr 1fr !important;
    }

    .catalog-hero__copy {
        width: min(66ch, calc(100% - clamp(24rem, 34vw, 32rem))) !important;
    }
}

@media (max-width: 1100px) {
    .page-hero.small.catalog-hero {
        align-items: center !important;
        text-align: center !important;
        gap: 1.35rem !important;
    }

    .catalog-hero__copy {
        width: min(100%, 66ch) !important;
        max-width: 66ch !important;
    }

    .catalog-hero__copy > p:not(.eyebrow) {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        width: min(100%, 42rem) !important;
        transform: rotate(-.7deg) !important;
        text-align: left !important;
    }
}

@media (max-width: 720px) {
    .page-hero.small.catalog-hero {
        align-items: stretch !important;
        text-align: left !important;
        padding: 2rem 1.35rem !important;
    }

    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        width: 100% !important;
        padding: 1.7rem 1.5rem !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__grid {
        grid-template-columns: 1fr !important;
        gap: .45rem !important;
    }
}

/* Asset-backed parchment: closer to a burned treasure map, no inner UI lines. */
.page-hero.small.catalog-hero > .catalog-rarity-note--hero {
    width: clamp(25rem, 29vw, 36rem) !important;
    min-height: clamp(17rem, 18vw, 23rem) !important;
    padding: clamp(3rem, 3vw, 4rem) clamp(3rem, 3.2vw, 4.15rem) !important;
    clip-path: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: url("../img/parchment-treasure-map.svg?v=3") center / 100% 100% no-repeat !important;
    box-shadow: none !important;
}

/* Keep the parchment text inside the pale center at every compact width. */
.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow,
.page-hero.small.catalog-hero .catalog-rarity-note--hero h2,
.page-hero.small.catalog-hero .catalog-rarity-note__grid strong,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #170701 !important;
    opacity: 1 !important;
    text-shadow:
        0 1px rgba(255, 238, 190, .42),
        0 0 2px rgba(255, 231, 170, .24) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    font-weight: 750 !important;
}

@media (min-width: 521px) and (max-width: 720px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        padding: 2.45rem 3.45rem 2.55rem !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .5rem 1rem !important;
    }
}

@media (max-width: 520px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        padding: 2.6rem 2.65rem 2.75rem !important;
    }
}

.page-hero.small.catalog-hero > .catalog-rarity-note--hero::before,
.page-hero.small.catalog-hero > .catalog-rarity-note--hero::after {
    content: none !important;
    display: none !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow {
    color: #6d3519 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero h2 {
    color: #2d1408 !important;
    font-size: clamp(1.9rem, 2.2vw, 2.55rem) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero p,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #3b1f0f !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid article {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

@media (min-width: 1101px) and (max-width: 1599px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        width: clamp(23rem, 29vw, 30rem) !important;
        min-height: clamp(16rem, 20vw, 21rem) !important;
        padding: 2.7rem 3rem !important;
    }
}

@media (max-width: 1100px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        width: min(100%, 42rem) !important;
        min-height: 0 !important;
        padding: clamp(2.5rem, 6vw, 3.6rem) clamp(2.35rem, 6vw, 3.6rem) !important;
    }
}

/* Rarity parchment readability pass: no subtitle, no low text lost in burned edges. */
.page-hero.small.catalog-hero > .catalog-rarity-note--hero {
    min-height: clamp(15.5rem, 16.5vw, 20rem) !important;
    padding: clamp(2.35rem, 2.35vw, 3.1rem) clamp(2.75rem, 3vw, 3.85rem) clamp(2.5rem, 2.5vw, 3.25rem) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__intro {
    margin-bottom: .55rem !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero h2 {
    font-size: clamp(1.85rem, 2.05vw, 2.45rem) !important;
    line-height: .92 !important;
    color: #1b0802 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow {
    color: #4f210d !important;
    opacity: 1 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid {
    gap: .42rem .9rem !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
    color: #1d0902 !important;
    font-size: clamp(1.2rem, 1.28vw, 1.48rem) !important;
    text-shadow: 0 1px rgba(255, 236, 186, .42) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #261006 !important;
    font-size: clamp(.98rem, .9vw, 1.06rem) !important;
    line-height: 1.2 !important;
    font-weight: 650 !important;
    text-shadow: 0 1px rgba(255, 235, 184, .25) !important;
}

@media (min-width: 1101px) and (max-width: 1599px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        min-height: 15.5rem !important;
        padding: 2.3rem 2.85rem 2.5rem !important;
    }
}

@media (max-width: 720px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        padding: 2.35rem 2rem 2.45rem !important;
    }
}

/* Final compact parchment lock: keep all rarity text away from burned edges. */
@media (min-width: 521px) and (max-width: 720px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        min-height: 18rem !important;
        padding: 2.45rem 4.05rem 2.85rem !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__intro {
        margin-bottom: .45rem !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: .55rem 1rem !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note--hero h2 {
        font-size: clamp(1.65rem, 6.2vw, 2.2rem) !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
        font-size: clamp(1.08rem, 4.2vw, 1.32rem) !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
    .page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
        font-size: clamp(.88rem, 3.2vw, .98rem) !important;
        line-height: 1.14 !important;
    }
}

@media (max-width: 520px) {
    .page-hero.small.catalog-hero > .catalog-rarity-note--hero {
        min-height: 23rem !important;
        padding: 2.7rem 3.05rem 3.1rem !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__grid {
        grid-template-columns: 1fr !important;
        gap: .38rem !important;
    }
}

/* Final ink contrast on the rarity parchment. */
.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow,
.page-hero.small.catalog-hero .catalog-rarity-note--hero h2,
.page-hero.small.catalog-hero .catalog-rarity-note__grid strong,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #100300 !important;
    opacity: 1 !important;
    -webkit-font-smoothing: auto !important;
    text-shadow:
        0 1px 0 rgba(255, 232, 177, .42),
        0 0 1px rgba(16, 3, 0, .38) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow {
    color: #371302 !important;
    font-weight: 900 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero h2 {
    color: #0d0200 !important;
    font-weight: 900 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
    color: #0d0200 !important;
    font-weight: 900 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #140500 !important;
    font-size: clamp(1.04rem, .98vw, 1.14rem) !important;
    line-height: 1.22 !important;
    font-weight: 850 !important;
}

/* True final parchment legibility: strong dark ink on a brighter safe area. */
.page-hero.small.catalog-hero > .catalog-rarity-note--hero {
    background-image: url("../img/parchment-treasure-map.svg?v=4") !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow,
.page-hero.small.catalog-hero .catalog-rarity-note--hero h2,
.page-hero.small.catalog-hero .catalog-rarity-note__grid strong,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #070100 !important;
    opacity: 1 !important;
    font-weight: 900 !important;
    text-shadow:
        0 1px 0 rgba(255, 243, 208, .78),
        0 0 3px rgba(255, 232, 176, .48),
        .35px .35px 0 rgba(0, 0, 0, .22) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow {
    color: #2a0d00 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero h2 {
    color: #050100 !important;
    font-size: clamp(2.05rem, 2.28vw, 2.72rem) !important;
    line-height: .95 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
    color: #050100 !important;
    font-size: clamp(1.32rem, 1.5vw, 1.72rem) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #080200 !important;
    font-size: clamp(1.13rem, 1.06vw, 1.28rem) !important;
    line-height: 1.17 !important;
}

/* Parchment typography polish: readable, but no heavy black block. */
.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow,
.page-hero.small.catalog-hero .catalog-rarity-note--hero h2,
.page-hero.small.catalog-hero .catalog-rarity-note__grid strong,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #241006 !important;
    opacity: 1 !important;
    -webkit-font-smoothing: antialiased !important;
    text-shadow:
        0 1px 0 rgba(255, 239, 196, .55),
        0 0 1px rgba(36, 16, 6, .18) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow {
    color: #5a2a13 !important;
    font-weight: 700 !important;
    letter-spacing: .18em !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note--hero h2 {
    color: #1a0902 !important;
    font-weight: 750 !important;
    font-size: clamp(2rem, 2.22vw, 2.62rem) !important;
    line-height: .96 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
    color: #1b0a03 !important;
    font-weight: 750 !important;
    font-size: clamp(1.28rem, 1.42vw, 1.62rem) !important;
    line-height: 1 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    color: #2a1308 !important;
    font-weight: 700 !important;
    font-size: clamp(1.08rem, 1vw, 1.2rem) !important;
    line-height: 1.18 !important;
}

/* Rarity note hierarchy: each description clearly belongs to its rarity. */
.page-hero.small.catalog-hero > .catalog-rarity-note--hero {
    min-height: clamp(16.6rem, 17.4vw, 21rem) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__intro {
    margin-bottom: clamp(.75rem, .9vw, 1rem) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid {
    grid-template-columns: minmax(0, .92fr) minmax(0, 1fr) !important;
    gap: clamp(.9rem, 1vw, 1.15rem) clamp(1.75rem, 2.5vw, 2.75rem) !important;
    align-items: start !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid article {
    display: grid !important;
    align-content: start !important;
    gap: .18rem !important;
    min-height: 4.25rem !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
    margin: 0 !important;
    color: #160600 !important;
    font-weight: 820 !important;
    line-height: .95 !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    margin: 0 !important;
    color: #2f1609 !important;
    font-weight: 620 !important;
    line-height: 1.22 !important;
}

/* Rarity parchment uses the same type system as the rest of Blackthorn. */
.page-hero.small.catalog-hero .catalog-rarity-note--hero .eyebrow,
.page-hero.small.catalog-hero .catalog-rarity-note--hero h2,
.page-hero.small.catalog-hero .catalog-rarity-note__grid strong {
    font-family: var(--font-title) !important;
}

.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow,
.page-hero.small.catalog-hero .catalog-rarity-note__grid .text-flow p {
    font-family: var(--font-body) !important;
}

@media (max-width: 520px) {
    .page-hero.small.catalog-hero .catalog-rarity-note__grid {
        grid-template-columns: 1fr !important;
        gap: .7rem !important;
    }

    .page-hero.small.catalog-hero .catalog-rarity-note__grid article {
        min-height: 0 !important;
    }
}

/* Index hero image safety: product cards stay in the visual column, never under the intro copy. */
main > section.hero {
    grid-template-columns: minmax(0, 1fr) minmax(420px, .7fr) !important;
    gap: clamp(2rem, 4vw, 4.75rem) !important;
}

main > section.hero .hero__content {
    position: relative !important;
    z-index: 10 !important;
    max-width: 760px !important;
}

main > section.hero .hero__sigil {
    position: relative !important;
    z-index: 4 !important;
    align-self: center !important;
    justify-self: end !important;
    width: min(660px, 36vw) !important;
    max-width: 100% !important;
    min-height: clamp(500px, 38vw, 660px) !important;
    overflow: visible !important;
}

main > section.hero .hero__latest-relics {
    display: block !important;
    inset: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

main > section.hero .hero__latest-card,
main > section.hero .hero__latest-card--5 {
    display: block !important;
    width: clamp(112px, 5.6vw, 138px) !important;
    aspect-ratio: .8 !important;
    pointer-events: auto !important;
}

main > section.hero .hero__latest-card--1 {
    left: 9% !important;
    top: 22% !important;
    transform: rotate(-8deg) !important;
}

main > section.hero .hero__latest-card--2 {
    right: 8% !important;
    top: 24% !important;
    transform: rotate(7deg) !important;
}

main > section.hero .hero__latest-card--3 {
    left: 10% !important;
    bottom: 10% !important;
    transform: rotate(4deg) !important;
}

main > section.hero .hero__latest-card--4 {
    right: 9% !important;
    bottom: 10% !important;
    transform: rotate(-4deg) !important;
}

main > section.hero .hero__latest-card--5 {
    left: 50% !important;
    top: 3% !important;
    transform: translateX(-50%) rotate(2deg) !important;
}

@media (min-width: 1600px) {
    main > section.hero {
        grid-template-columns: minmax(0, 1fr) minmax(600px, .72fr) !important;
    }

    main > section.hero .hero__sigil {
        width: min(700px, 34vw) !important;
        min-height: clamp(560px, 36vw, 700px) !important;
    }

    main > section.hero .hero__latest-card,
    main > section.hero .hero__latest-card--5 {
        width: clamp(116px, 5vw, 146px) !important;
    }
}

@media (min-width: 1201px) and (max-width: 1599px) {
    main > section.hero {
        grid-template-columns: minmax(0, 1fr) minmax(360px, .56fr) !important;
        gap: clamp(1.5rem, 3vw, 3rem) !important;
    }

    main > section.hero .hero__sigil {
        width: min(480px, 32vw) !important;
        min-height: clamp(420px, 35vw, 560px) !important;
    }

    main > section.hero .hero__latest-card,
    main > section.hero .hero__latest-card--5 {
        width: clamp(92px, 6.2vw, 118px) !important;
    }

    main > section.hero .hero__latest-card--4,
    main > section.hero .hero__latest-card--5 {
        display: none !important;
    }

    main > section.hero .hero__latest-card--1 {
        left: 8% !important;
        top: 20% !important;
    }

    main > section.hero .hero__latest-card--2 {
        right: 8% !important;
        top: 22% !important;
    }

    main > section.hero .hero__latest-card--3 {
        left: 34% !important;
        bottom: 4% !important;
    }
}

@media (max-width: 1200px) {
    main > section.hero {
        grid-template-columns: 1fr !important;
    }

    main > section.hero .hero__content {
        max-width: 760px !important;
        margin-inline: auto !important;
        text-align: center !important;
    }

    main > section.hero .hero__latest-relics,
    main > section.hero .hero__latest-card,
    main > section.hero .hero__latest-card--1,
    main > section.hero .hero__latest-card--2,
    main > section.hero .hero__latest-card--3,
    main > section.hero .hero__latest-card--4,
    main > section.hero .hero__latest-card--5 {
        display: none !important;
    }

    main > section.hero .hero__sigil {
        justify-self: center !important;
        width: min(260px, 52vw) !important;
        min-height: 0 !important;
        margin-top: clamp(1rem, 4vw, 2rem) !important;
    }
}

/* Admin simplification: daily work first, technical controls tucked away. */
body.admin-body .admin-sidebar {
    width: 280px !important;
}

body.admin-body {
    grid-template-columns: 280px minmax(0, 1fr) !important;
}

.admin-nav {
    display: grid !important;
    align-content: start !important;
    gap: .85rem !important;
}

.admin-nav-group {
    border: 1px solid rgba(241, 161, 144, .16);
    border-radius: 8px;
    background: rgba(255, 232, 218, .025);
    overflow: hidden;
}

.admin-nav-group > summary {
    list-style: none;
    cursor: pointer;
    padding: .72rem .85rem;
    color: #ffd4c9;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.admin-nav-group > summary::-webkit-details-marker {
    display: none;
}

.admin-nav-group > summary::after {
    content: "+";
    float: right;
    color: #f0a79d;
}

.admin-nav-group[open] > summary::after {
    content: "-";
}

.admin-nav-group__links,
.admin-nav-utility {
    display: grid;
    gap: .42rem;
    padding: 0 .52rem .62rem;
}

.admin-nav-utility {
    padding-top: .55rem;
    border-top: 1px solid rgba(241, 161, 144, .16);
}

.admin-nav a {
    min-height: 58px;
    padding: .56rem .62rem !important;
}

.admin-nav a.is-active {
    border-color: rgba(240, 167, 157, .68) !important;
    background:
        radial-gradient(circle at 12% 0, rgba(240, 167, 157, .18), transparent 5rem),
        linear-gradient(90deg, rgba(204, 128, 116, .22), rgba(255, 232, 218, .06)) !important;
}

.admin-nav__text {
    min-width: 0;
    display: grid;
    gap: .08rem;
}

.admin-nav__text strong,
.admin-nav__text small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-nav__text strong {
    color: #fff3eb;
    font-size: .94rem;
    line-height: 1.1;
}

.admin-nav__text small {
    color: #d8c7be;
    font-size: .74rem;
    font-weight: 800;
}

.admin-panel-heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 1rem;
    margin-bottom: 1rem;
}

.admin-panel-heading h2 {
    margin-bottom: 0;
}

.admin-simple-form {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.admin-panel--focus {
    padding: clamp(1rem, 2vw, 1.35rem) !important;
    border-color: rgba(240, 167, 157, .4) !important;
}

.codex-primary-fields {
    display: grid;
    gap: .95rem;
}

.codex-editor-form textarea[name="body"] {
    min-height: 15rem;
}

.codex-parent-field small,
.codex-parent-label {
    display: block;
    margin-top: .32rem;
    color: #caaea6;
    font-size: .82rem;
}

.codex-language-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .95rem;
}

.codex-language-grid label {
    min-width: 0;
}

.codex-language-grid textarea {
    min-height: 15rem;
}

.admin-advanced-panel {
    margin-top: 1rem;
    border: 1px solid rgba(241, 161, 144, .18);
    border-radius: 8px;
    background: rgba(7, 5, 6, .32);
}

.admin-advanced-panel > summary {
    list-style: none;
    cursor: pointer;
    padding: .8rem .95rem;
    color: #f0c9c0;
    font-weight: 900;
}

.admin-advanced-panel > summary::-webkit-details-marker {
    display: none;
}

.admin-advanced-panel > summary::after {
    content: "+";
    float: right;
    color: #f0a79d;
}

.admin-advanced-panel[open] > summary::after {
    content: "-";
}

.admin-advanced-panel > label,
.admin-advanced-panel > .two-cols,
.admin-advanced-panel > .settings-grid,
.admin-advanced-panel > .admin-form {
    margin: 0 .95rem .95rem;
}

.codex-display-settings {
    margin: 1rem 0;
}

.codex-display-settings .admin-form {
    padding: 0 0 .1rem !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.admin-hidden-form {
    display: none;
}

.codex-order-board {
    margin-top: 1rem;
    padding: clamp(1rem, 2vw, 1.35rem) !important;
}

.codex-section-stack {
    display: grid;
    gap: .9rem;
}

.codex-section-sortable {
    border: 1px solid rgba(240, 167, 157, .22);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 232, 218, .06), rgba(255, 232, 218, .025)),
        rgba(7, 5, 6, .34);
    overflow: hidden;
}

.codex-section-sortable.is-empty {
    opacity: .72;
}

.codex-section-sortable__header {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 28px;
    align-items: center;
    gap: .75rem;
    padding: .82rem .95rem;
    border-bottom: 1px solid rgba(240, 167, 157, .16);
    background: rgba(255, 232, 218, .035);
    cursor: pointer;
    list-style: none;
}

.codex-section-sortable__header::-webkit-details-marker {
    display: none;
}

.codex-section-sortable__header::after {
    content: "+";
    justify-self: end;
    color: #f0a79d;
    font-family: var(--font-title);
    font-size: 1.6rem;
    line-height: 1;
}

.codex-section-sortable[open] > .codex-section-sortable__header::after {
    content: "-";
}

.codex-section-sortable__header h3 {
    margin: 0;
    font-size: clamp(1.25rem, 2vw, 1.7rem);
}

.codex-section-sortable__header > div {
    min-width: 0;
}

.codex-section-sortable__header small,
.codex-sortable-row__content small,
.codex-empty-group {
    color: #d8c7be;
}

.codex-entry-stack {
    display: grid;
    gap: .62rem;
    padding: .75rem;
}

.codex-sortable-row {
    display: grid;
    grid-template-columns: 42px auto minmax(0, 1fr) max-content;
    align-items: center;
    gap: .75rem;
    padding: .72rem;
    border: 1px solid rgba(240, 167, 157, .16);
    border-radius: 8px;
    background:
        radial-gradient(circle at 12% 0, rgba(82, 130, 120, .1), transparent 8rem),
        rgba(15, 10, 13, .72);
}

.codex-sortable-row.is-muted {
    opacity: .62;
}

.codex-sortable-row.is-child {
    margin-left: clamp(1rem, 4vw, 2.8rem);
    border-left: 4px solid rgba(82, 130, 120, .62);
}

.codex-sortable-row.is-dragging,
.codex-section-sortable.is-dragging {
    opacity: .58;
    border-color: rgba(240, 167, 157, .78);
}

.drag-handle {
    display: inline-grid;
    place-items: center;
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    padding: 0;
    border: 1px solid rgba(239, 227, 210, .2);
    border-radius: 8px;
    cursor: grab;
    background:
        radial-gradient(circle at 30% 18%, rgba(255, 232, 218, .16), transparent 55%),
        linear-gradient(145deg, rgba(72, 46, 56, .82), rgba(11, 7, 9, .9));
    user-select: none;
}

.drag-handle:active {
    cursor: grabbing;
}

.drag-handle span,
.drag-handle span::before,
.drag-handle span::after {
    display: block;
    width: 18px;
    height: 2px;
    margin: 0 auto;
    border-radius: 999px;
    background: #f0a79d;
}

.drag-handle span {
    position: relative;
}

.drag-handle span::before,
.drag-handle span::after {
    content: "";
    position: absolute;
    left: 0;
}

.drag-handle span::before {
    top: -6px;
}

.drag-handle span::after {
    top: 6px;
}

.codex-sortable-row .admin-thumb {
    width: 58px;
    height: 58px;
    border-radius: 8px;
    object-fit: cover;
}

.codex-sortable-row__content {
    min-width: 0;
}

.codex-sortable-row__content strong,
.codex-sortable-row__content p,
.codex-sortable-row__content small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.codex-sortable-row__content strong,
.codex-sortable-row__content small {
    white-space: nowrap;
}

.codex-sortable-row__content p {
    margin: .15rem 0 .05rem;
    color: #ecd8cf;
    font-size: .92rem;
    line-height: 1.35;
}

.status-pill {
    display: inline-grid;
    place-items: center;
    min-height: 30px;
    padding: .28rem .6rem;
    border: 1px solid rgba(240, 167, 157, .22);
    border-radius: 999px;
    color: #d8c7be;
    background: rgba(9, 7, 8, .48);
    font-size: .78rem;
    font-weight: 900;
    white-space: nowrap;
}

.status-pill.is-live {
    color: #dff1e8;
    border-color: rgba(82, 130, 120, .58);
    background: rgba(39, 63, 65, .58);
}

.codex-sortable-row__actions {
    display: flex;
    gap: .45rem;
    align-items: center;
    justify-content: end;
    flex-wrap: wrap;
}

.codex-sortable-row__actions form {
    margin: 0;
}

.codex-sortable-row__actions a,
.codex-sortable-row__actions button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: .45rem .65rem;
    border-radius: 7px;
    color: #ffd3c9;
    line-height: 1;
    white-space: nowrap;
}

.codex-sortable-row__actions .visibility-toggle {
    min-width: 82px;
    border-color: rgba(240, 167, 157, .26);
    color: #f1d4ca;
    background: rgba(9, 7, 8, .5);
}

.codex-sortable-row__actions .visibility-toggle.is-live {
    color: #dff1e8;
    border-color: rgba(82, 130, 120, .58);
    background: rgba(39, 63, 65, .78);
}

.codex-sortable-row__actions .visibility-toggle.is-hidden {
    color: #ffc6bd;
    border-color: rgba(204, 128, 116, .5);
    background: rgba(72, 46, 56, .7);
}

.codex-empty-group {
    margin: 0;
    padding: .75rem;
}

.codex-subentries {
    display: grid;
    gap: .7rem;
    margin-top: 1rem;
    padding-left: clamp(.85rem, 2vw, 1.35rem);
    border-left: 2px solid rgba(82, 130, 120, .42);
}

.codex-subentry {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .75rem;
    padding: .9rem;
    border: 1px solid rgba(240, 167, 157, .18);
    border-radius: 8px;
    background: rgba(8, 7, 8, .32);
}

.codex-subentry.has-media {
    grid-template-columns: minmax(110px, .28fr) minmax(0, 1fr);
    align-items: start;
}

.codex-subentry .content-entry-media {
    width: 100%;
    max-height: 160px;
    object-fit: cover;
}

.codex-subentry__head h4 {
    margin: 0;
    font-family: var(--font-title);
    font-size: clamp(1.25rem, 2vw, 1.8rem);
    line-height: .95;
}

@media (max-width: 1100px) {
    body.admin-body,
    body.admin-body .admin-sidebar {
        width: auto !important;
    }

    body.admin-body {
        grid-template-columns: 1fr !important;
    }

    .codex-sortable-row {
        grid-template-columns: 42px auto minmax(0, 1fr);
    }

    .codex-sortable-row__actions {
        grid-column: 3;
    }

    .codex-sortable-row__actions {
        justify-content: start;
    }

    .codex-sortable-row.is-child {
        margin-left: .8rem;
    }
}

@media (max-width: 620px) {
    .admin-panel-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .codex-section-sortable__header,
    .codex-sortable-row {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .codex-section-sortable__header {
        grid-template-columns: 38px minmax(0, 1fr) 24px;
    }

    .codex-sortable-row .admin-thumb {
        grid-column: 2;
    }

    .codex-sortable-row__content,
    .codex-sortable-row__actions {
        grid-column: 2;
    }

    .codex-sortable-row__actions {
        flex-wrap: wrap;
    }

    .codex-sortable-row.is-child {
        margin-left: 0;
        border-left-width: 3px;
    }

    .codex-subentry.has-media {
        grid-template-columns: 1fr;
    }
}

/* Codex/admin responsive hardening */
.admin-nav-group {
    overflow: visible !important;
}

body.admin-body .admin-nav {
    padding-bottom: 1rem;
}

.codex-sortable-row {
    grid-template-columns: 42px 58px minmax(12rem, 1fr) max-content;
    align-items: start;
}

.codex-sortable-row .admin-thumb--empty {
    opacity: .18;
    background:
        linear-gradient(145deg, rgba(72, 46, 56, .7), rgba(9, 7, 8, .78));
}

.codex-sortable-row__actions {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    justify-content: end;
    align-items: start;
    gap: .45rem;
    min-width: max-content;
}

.codex-sortable-row__actions form {
    display: inline-flex;
}

@media (max-width: 1380px) {
    .codex-sortable-row {
        grid-template-columns: 42px 58px minmax(0, 1fr);
    }

    .codex-sortable-row__actions {
        grid-column: 3;
        grid-auto-flow: row;
        grid-template-columns: repeat(4, max-content);
        justify-content: start;
        min-width: 0;
    }
}

@media (max-width: 980px) {
    body.admin-body .admin-sidebar {
        position: relative !important;
        height: auto !important;
        max-height: none !important;
        width: auto !important;
        overflow: visible !important;
    }

    body.admin-body .admin-nav {
        max-height: none !important;
        overflow: visible !important;
    }

    .admin-nav-group {
        overflow: visible;
    }

    .codex-language-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-height: 760px) and (min-width: 981px) {
    body.admin-body .admin-sidebar {
        padding: .72rem;
    }

    .admin-nav {
        gap: .5rem !important;
    }

    .admin-nav-group > summary {
        padding: .58rem .72rem;
    }

    .admin-nav a {
        min-height: 50px;
        padding: .44rem .52rem !important;
    }

    .site-header .nav-glyph,
    .site-header .rpg-icon,
    .nav-rune {
        width: 32px;
        min-width: 32px;
        height: 32px;
    }
}

@media (max-height: 640px) and (min-width: 981px) {
    .admin-brand {
        min-height: 54px;
    }

    .admin-brand img {
        width: 42px;
    }

    .admin-nav__text small {
        display: none;
    }

    .admin-nav a {
        min-height: 44px;
    }
}

@media (max-width: 720px) {
    .codex-sortable-row {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .codex-sortable-row .admin-thumb {
        grid-column: 2;
        width: 100%;
        max-width: 180px;
    }

    .codex-sortable-row .admin-thumb--empty {
        display: none;
    }

    .codex-sortable-row__content,
    .codex-sortable-row__actions {
        grid-column: 2;
    }

    .codex-sortable-row__actions {
        grid-template-columns: repeat(2, minmax(0, max-content));
    }
}

@media (max-width: 430px) {
    .codex-sortable-row__actions {
        grid-template-columns: 1fr;
        width: 100%;
    }

    .codex-sortable-row__actions a,
    .codex-sortable-row__actions button,
    .codex-sortable-row__actions form {
        width: 100%;
    }
}

.testimonial-author {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    align-items: center;
    justify-content: stretch;
    gap: .65rem;
}

.testimonial-author .testimonial-rune {
    margin: 0;
}

.testimonial-author .testimonial-rune--left {
    grid-column: 1;
    justify-self: start;
}

.testimonial-author .testimonial-rune--right {
    grid-column: 3;
    justify-self: end;
}

.testimonial-author cite {
    grid-column: 2;
    justify-self: center;
}

@media (max-width: 430px) {
    .testimonial-author {
        grid-template-columns: 34px minmax(0, 1fr) 34px;
        gap: .45rem;
    }

    .testimonial-author .testimonial-rune {
        width: 34px;
        height: 28px;
    }
}

/* Production pass: home frame and Codex category management. */
main > section.section.featured-relics-section,
main > section.section.home-collection-section,
main > section.section.popular-relics-section,
main > section.section.craft-band,
main > section.section.traveler-words,
main > section.section.newsletter-band {
    width: min(1840px, calc(100% - 3rem)) !important;
    max-width: 1840px !important;
    min-height: clamp(520px, 42vw, 700px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: clamp(2rem, 3vw, 3.25rem) !important;
}

main > section.section.newsletter-band {
    min-height: clamp(300px, 22vw, 390px) !important;
}

main > section.section.featured-relics-section > .product-grid,
main > section.section.home-collection-section > .collection-grid,
main > section.section.popular-relics-section > .product-grid {
    width: 100% !important;
    max-width: none !important;
    align-items: stretch !important;
}

main > section.section.featured-relics-section .product-card,
main > section.section.home-collection-section .collection-card,
main > section.section.popular-relics-section .product-card {
    min-height: clamp(410px, 29vw, 540px) !important;
}

main > section.section.craft-band,
main > section.section.traveler-words {
    align-content: stretch !important;
}

.codex-category-manager {
    margin-bottom: 1rem;
}

.codex-category-manager__grid {
    display: grid;
    grid-template-columns: minmax(280px, .9fr) minmax(340px, 1.1fr);
    gap: 1rem;
    align-items: start;
}

.codex-category-form {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.codex-category-form label {
    min-width: 0;
}

.codex-category-list {
    display: grid;
    gap: .65rem;
}

.codex-category-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    gap: .75rem;
    align-items: center;
    padding: .75rem;
    border: 1px solid rgba(240, 167, 157, .18);
    border-radius: 8px;
    background: rgba(12, 8, 10, .58);
}

.codex-category-row.is-muted {
    opacity: .72;
}

.codex-category-row strong,
.codex-category-row small {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.codex-category-row small {
    color: #d8c7be;
    font-size: .84rem;
}

.codex-category-row__actions {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: max-content;
    gap: .45rem;
    align-items: center;
}

.codex-category-row__actions form {
    margin: 0;
}

.codex-category-row__actions a,
.codex-category-row__actions button,
.codex-category-row > form button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: .45rem .65rem;
    border-radius: 7px;
    line-height: 1;
    white-space: nowrap;
}

.admin-collapsible-panel.admin-panel,
.admin-collapsible-panel.admin-panel--focus,
.admin-collapsible-panel.codex-order-board {
    padding: 0 !important;
    overflow: hidden;
}

.admin-collapsible-summary.admin-panel-heading {
    margin: 0;
    padding: clamp(1rem, 2vw, 1.35rem);
    align-items: center;
    cursor: pointer;
    list-style: none;
}

.admin-collapsible-summary::-webkit-details-marker {
    display: none;
}

.admin-collapsible-summary::after {
    content: "+";
    color: #f0a79d;
    font-family: var(--font-title);
    font-size: 1.8rem;
    line-height: 1;
}

.admin-collapsible-panel[open] > .admin-collapsible-summary::after {
    content: "-";
}

.admin-collapsible-summary > .btn,
.admin-collapsible-summary > button {
    margin-left: auto;
}

.admin-collapsible-body {
    padding: 0 clamp(1rem, 2vw, 1.35rem) clamp(1rem, 2vw, 1.35rem);
}

.form-actions--start {
    justify-content: flex-start;
    margin-bottom: 1rem;
}

.danger-link {
    border-color: rgba(204, 128, 116, .5) !important;
    color: #ffc6bd !important;
    background: rgba(72, 46, 56, .64) !important;
}

.upload-overview {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1rem;
}

.upload-overview .admin-panel {
    min-height: 112px;
    display: grid;
    align-content: center;
    gap: .2rem;
}

.upload-overview span {
    color: #fff3eb;
    font-family: var(--font-title);
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: .9;
}

.upload-overview p {
    margin: 0;
    color: #d8c7be;
}

.upload-filter-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin: 0 0 1rem;
}

.upload-filter-tabs a {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: .55rem .8rem;
    border: 1px solid rgba(240, 167, 157, .22);
    border-radius: 8px;
    color: #f1d4ca;
    background: rgba(9, 7, 8, .48);
}

.upload-filter-tabs a.is-active {
    color: #dff1e8;
    border-color: rgba(82, 130, 120, .58);
    background: rgba(39, 63, 65, .72);
}

.upload-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
    gap: 1rem;
}

.upload-card {
    display: grid;
    grid-template-columns: minmax(150px, .38fr) minmax(0, 1fr);
    gap: .95rem;
    padding: .9rem;
    border: 1px solid rgba(240, 167, 157, .18);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 232, 218, .055), rgba(255, 232, 218, .02)),
        rgba(10, 7, 8, .74);
}

.upload-card.is-unused {
    border-color: rgba(240, 167, 157, .32);
}

.upload-card__preview {
    display: grid;
    place-items: center;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border: 1px solid rgba(239, 227, 210, .16);
    border-radius: 8px;
    color: #f0c9c0;
    background: rgba(4, 3, 4, .62);
}

.upload-card__preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.upload-card__preview span {
    font-family: var(--font-title);
    font-size: clamp(1.2rem, 2vw, 1.7rem);
}

.upload-card__body {
    min-width: 0;
}

.upload-card__title {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: .65rem;
}

.upload-card__title h2 {
    margin: 0;
    font-size: clamp(1.2rem, 2vw, 1.65rem);
    overflow-wrap: anywhere;
}

.upload-card__path {
    display: block;
    margin-top: .35rem;
    color: #d8c7be;
    overflow-wrap: anywhere;
}

.upload-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-top: .65rem;
}

.upload-card__meta span {
    display: inline-flex;
    min-height: 28px;
    align-items: center;
    padding: .22rem .5rem;
    border: 1px solid rgba(240, 167, 157, .16);
    border-radius: 7px;
    color: #d8c7be;
    background: rgba(9, 7, 8, .46);
    font-size: .82rem;
}

.upload-usage-list {
    display: grid;
    gap: .35rem;
    margin-top: .8rem;
}

.upload-usage-list strong {
    color: #fff3eb;
}

.upload-usage-list a,
.upload-usage-list span {
    display: block;
    padding: .42rem .55rem;
    border: 1px solid rgba(240, 167, 157, .14);
    border-radius: 7px;
    color: #ecd8cf;
    background: rgba(5, 4, 5, .42);
    overflow-wrap: anywhere;
}

.upload-card__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
    margin-top: .95rem;
}

.upload-card__actions label {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    color: #ffc6bd;
}

.upload-card__actions button {
    margin-left: auto;
}

@media (max-width: 1100px) {
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(100% - 1.5rem, 1040px) !important;
        min-height: auto !important;
        padding: clamp(1.35rem, 4vw, 2rem) !important;
    }

    main > section.section.featured-relics-section .product-card,
    main > section.section.home-collection-section .collection-card,
    main > section.section.popular-relics-section .product-card {
        min-height: 380px !important;
    }

    .codex-category-manager__grid {
        grid-template-columns: 1fr;
    }

    .upload-card {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.section.newsletter-band {
        width: min(100% - 1rem, 720px) !important;
        padding: 1rem !important;
    }

    main > section.section.featured-relics-section .product-card,
    main > section.section.home-collection-section .collection-card,
    main > section.section.popular-relics-section .product-card {
        min-height: 0 !important;
    }

    .codex-category-row,
    .codex-category-row__actions {
        grid-template-columns: 1fr;
        grid-auto-flow: row;
        justify-items: stretch;
    }

    .codex-category-row__actions a,
    .codex-category-row__actions button,
    .codex-category-row__actions form,
    .codex-category-row > form button {
        width: 100%;
    }

    .upload-overview {
        grid-template-columns: 1fr;
    }

    .upload-card__title,
    .upload-card__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .upload-card__actions button {
        width: 100%;
        margin-left: 0;
    }
}

/* Production home frame: shared width without inflated heights. */
@media (min-width: 1101px) {
    main > section.hero,
    main > section.featured-relics-section,
    main > section.home-collection-section,
    main > section.popular-relics-section,
    main > section.craft-band,
    main > section.traveler-words,
    main > section.newsletter-band {
        box-sizing: border-box !important;
        width: min(1440px, calc(100% - 2rem)) !important;
        max-width: 1440px !important;
        min-height: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: clamp(1.5rem, 2.5vw, 2.5rem) !important;
    }

    main > section.featured-relics-section > .product-grid,
    main > section.home-collection-section > .collection-grid,
    main > section.popular-relics-section > .product-grid {
        width: 100% !important;
        max-width: none !important;
        align-items: stretch !important;
        grid-auto-rows: auto !important;
    }

    main > section.featured-relics-section .product-card,
    main > section.home-collection-section .collection-card,
    main > section.popular-relics-section .product-card {
        min-height: auto !important;
        height: auto !important;
    }

    main > section.newsletter-band {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr) !important;
        align-items: center !important;
        gap: clamp(1.25rem, 3vw, 3rem) !important;
        padding-block: clamp(1.35rem, 2.4vw, 2.2rem) !important;
    }
}

@media (min-width: 1101px) and (max-width: 1599px) {
    main > section.hero,
    main > section.featured-relics-section,
    main > section.home-collection-section,
    main > section.popular-relics-section,
    main > section.craft-band,
    main > section.traveler-words,
    main > section.newsletter-band {
        width: auto !important;
        max-width: 1440px !important;
        margin-left: var(--bt-laptop-gutter, 1.5rem) !important;
        margin-right: calc(var(--bt-vine-safe, 140px) + var(--bt-laptop-gutter, 1.5rem)) !important;
    }
}

@media (max-width: 1100px) {
    main > section.hero,
    main > section.featured-relics-section,
    main > section.home-collection-section,
    main > section.popular-relics-section,
    main > section.craft-band,
    main > section.traveler-words,
    main > section.newsletter-band {
        width: min(100% - 1.5rem, 1040px) !important;
        min-height: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: clamp(1.25rem, 4vw, 2rem) !important;
    }
}

@media (max-width: 720px) {
    main > section.hero,
    main > section.featured-relics-section,
    main > section.home-collection-section,
    main > section.popular-relics-section,
    main > section.craft-band,
    main > section.traveler-words,
    main > section.newsletter-band {
        width: min(100% - 1rem, 720px) !important;
        padding: 1rem !important;
    }
}

/* Production index alignment lock: same horizontal frame, natural heights. */
:root {
    --bt-home-frame: min(1840px, calc(100% - 3rem));
}

main > section.hero,
main > section.section.featured-relics-section,
main > section.section.home-collection-section,
main > section.section.popular-relics-section,
main > section.section.craft-band,
main > section.section.traveler-words,
main > section.newsletter-band {
    box-sizing: border-box !important;
    width: var(--bt-home-frame) !important;
    max-width: none !important;
    min-height: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

main > section.section.featured-relics-section,
main > section.section.home-collection-section,
main > section.section.popular-relics-section,
main > section.section.craft-band,
main > section.section.traveler-words {
    padding: clamp(1.6rem, 3vw, 2.5rem) !important;
}

main > section.section.featured-relics-section > .product-grid,
main > section.section.home-collection-section > .collection-grid,
main > section.section.popular-relics-section > .product-grid,
main > section.section.traveler-words .testimonial-page.is-active {
    width: 100% !important;
    max-width: none !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: clamp(.9rem, 1.6vw, 1.2rem) !important;
    justify-content: stretch !important;
    align-items: stretch !important;
}

main > section.section.traveler-words .testimonial-page.is-active {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

main > section.section.featured-relics-section .product-card,
main > section.section.home-collection-section .collection-card,
main > section.section.popular-relics-section .product-card {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
}

main > section.section.craft-band {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 320px) !important;
    align-items: center !important;
    gap: clamp(1.25rem, 3vw, 2.5rem) !important;
    padding-block: clamp(1.25rem, 2.2vw, 2rem) !important;
}

main > section.section.craft-band > div:first-child {
    width: 100% !important;
    max-width: none !important;
}

main > section.section.craft-band h2 {
    max-width: 18ch !important;
    font-size: clamp(1.7rem, 3.2vw, 3rem) !important;
    line-height: 1.05 !important;
}

main > section.section.craft-band p {
    max-width: 68ch !important;
    font-size: clamp(1rem, 1.05vw, 1.12rem) !important;
}

main > section.section.craft-band .craft-mark {
    width: min(100%, 320px) !important;
    justify-self: end !important;
}

main > section.newsletter-band {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 520px) !important;
    padding: clamp(1.6rem, 3vw, 2.5rem) !important;
}

@media (max-width: 1280px) {
    main > section.section.featured-relics-section > .product-grid,
    main > section.section.home-collection-section > .collection-grid,
    main > section.section.popular-relics-section > .product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    main > section.section.traveler-words .testimonial-page.is-active {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 860px) {
    :root {
        --bt-home-frame: min(100% - 1rem, 1840px);
    }

    main > section.hero,
    main > section.section.featured-relics-section,
    main > section.section.home-collection-section,
    main > section.section.popular-relics-section,
    main > section.section.craft-band,
    main > section.section.traveler-words,
    main > section.newsletter-band {
        width: var(--bt-home-frame) !important;
    }

    main > section.section.craft-band,
    main > section.newsletter-band {
        grid-template-columns: 1fr !important;
    }

    main > section.section.craft-band .craft-mark {
        justify-self: stretch !important;
    }
}

@media (max-width: 640px) {
    main > section.section.featured-relics-section > .product-grid,
    main > section.section.home-collection-section > .collection-grid,
    main > section.section.popular-relics-section > .product-grid,
    main > section.section.traveler-words .testimonial-page.is-active {
        grid-template-columns: 1fr !important;
    }
}

@media (min-width: 2800px) {
    :root {
        --bt-home-frame: min(2200px, calc(100% - 5rem));
    }
}

/* Codex intro media: keep oversized uploaded images elegant and readable. */
.content-section-legend_hero .codex-prose-panel article.has-media {
    display: grid !important;
    grid-template-columns: minmax(16rem, .42fr) minmax(0, 1fr) !important;
    align-items: stretch !important;
    gap: clamp(1rem, 2.4vw, 2rem) !important;
    padding: clamp(1rem, 2vw, 1.45rem) !important;
    background:
        radial-gradient(circle at 0 10%, rgba(240, 167, 157, .18), transparent 18rem),
        radial-gradient(circle at 82% 50%, rgba(82, 130, 120, .1), transparent 22rem),
        linear-gradient(145deg, rgba(52, 26, 38, .78), rgba(8, 5, 8, .9)) !important;
}

.content-section-legend_hero .codex-prose-panel article.has-media > .content-entry-media {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
    object-position: center !important;
}

.content-section-legend_hero .codex-prose-panel article.has-media > div {
    position: relative !important;
    display: grid !important;
    align-content: center !important;
    gap: .8rem !important;
    min-width: 0 !important;
    padding: clamp(.4rem, 1.4vw, 1rem) clamp(.2rem, 1vw, .75rem) !important;
    border: 0 !important;
    border-radius: 0 !important;
    background:
        linear-gradient(90deg, rgba(240, 167, 157, .08), transparent 36%) !important;
    box-shadow: none !important;
}

.content-section-legend_hero .codex-prose-panel article.has-media > div::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 auto 0 0 !important;
    width: 3px !important;
    height: auto !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(240, 167, 157, .82), rgba(240, 167, 157, .16)) !important;
    opacity: .72 !important;
    pointer-events: none !important;
}

.content-section-legend_hero .codex-prose-panel article.has-media > div::after {
    content: "" !important;
    display: block !important;
    width: min(100%, 42rem) !important;
    height: 1px !important;
    margin-top: -.15rem !important;
    background: linear-gradient(90deg, rgba(240, 167, 157, .44), transparent) !important;
    order: 2 !important;
    pointer-events: none !important;
}

.content-section-legend_hero .codex-prose-panel article.has-media .content-block__head {
    align-items: center !important;
    gap: .8rem !important;
    margin: 0 !important;
    padding: 0 0 .35rem clamp(.75rem, 1.5vw, 1.15rem) !important;
    border-bottom: 0 !important;
    order: 1 !important;
}

.content-section-legend_hero .codex-prose-panel article.has-media .content-rune {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    box-shadow: 0 0 18px rgba(240, 167, 157, .15) !important;
}

.content-section-legend_hero .codex-prose-panel article.has-media .content-block__head h3 {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: none !important;
    text-wrap: normal !important;
    text-shadow: 0 2px 16px rgba(240, 167, 157, .24) !important;
}

.content-section-legend_hero .codex-prose-panel article.has-media .text-flow {
    max-width: 74ch !important;
    padding-left: clamp(.75rem, 1.5vw, 1.15rem) !important;
    color: #ead8cf !important;
    order: 3 !important;
}

@media (max-width: 900px) {
    .content-section-legend_hero .codex-prose-panel article.has-media {
        grid-template-columns: 1fr !important;
        align-items: start !important;
    }

    .content-section-legend_hero .codex-prose-panel article.has-media > .content-entry-media {
        max-height: 300px !important;
        aspect-ratio: 16 / 9 !important;
    }

    .content-section-legend_hero .codex-prose-panel article.has-media > div {
        align-content: start !important;
    }
}

@media (max-width: 560px) {
    .content-section-legend_hero .codex-prose-panel article.has-media > .content-entry-media {
        max-height: 230px !important;
        aspect-ratio: 1.35 !important;
    }
}

/* Database maintenance state */
.notice-panel {
    width: min(760px, 100%);
    margin: clamp(3rem, 10vh, 7rem) auto;
    padding: clamp(1.4rem, 4vw, 2.5rem);
    border: 1px solid var(--line);
    border-left: 4px solid var(--copper);
    border-radius: var(--radius);
    background: rgba(12, 8, 10, .88);
    box-shadow: var(--shadow);
}

.notice-panel h1 {
    font-size: clamp(2rem, 5vw, 3.6rem);
}

.notice-panel p:last-child {
    margin-bottom: 0;
    color: var(--muted);
}