/* Bloodlines 1.1.0: compact editorial additions and feature pages. */
@font-face { font-family: 'Marck Script'; src: url('../fonts/MarckScript-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 500; left: 1rem; top: -8rem; padding: .8rem 1.2rem; background: #eee9e2; color: #181112; }
.skip-link:focus { top: 1rem; }
:is(.page-clans,.page-vip,.page-darkspawn) main { overflow: clip; padding-bottom: 0; }
:is(.page-clans,.page-vip,.page-darkspawn) h1,
:is(.page-clans,.page-vip,.page-darkspawn) h2,
:is(.page-clans,.page-vip,.page-darkspawn) h3 { font-family: var(--font-display); font-weight: 500; letter-spacing: -.035em; text-wrap: balance; }
.exp-wrap { width: min(calc(100% - 5rem),1200px); margin-inline: auto; }
.exp-section { padding-block: clamp(2.5rem,5vw,4.5rem); border-bottom: 1px solid var(--line); }
:is(.page-clans,.page-vip,.page-darkspawn) main > .exp-section:last-child { border-bottom: 0; padding-bottom: 1.5rem; }
:is(.page-clans,.page-vip,.page-darkspawn) .site-footer { border-top: 0; padding-top: 2.5rem; }
.page-gameplay .site-footer { border-top: 0; }
.plans-section { border-bottom: 0; padding-bottom: 1.5rem; }
.court-benefits { padding-top: 2rem; }
.plans-section .exp-disclosure,.competition-section .exp-disclosure { border-bottom: 0; }
.exp-section p { color: var(--muted-strong); line-height: 1.65; }
.exp-section h2 { font-size: clamp(2.1rem,4vw,3.6rem); line-height: 1.06; margin: .5rem 0 1rem; }
.exp-section h3 { font-size: clamp(1.7rem,2.6vw,2.5rem); line-height: 1.1; margin: .5rem 0 .8rem; }
.exp-section-heading { max-width: 760px; margin-bottom: 1.75rem; }
.exp-section-heading p { margin-block: .5rem; }
.exp-section .eyebrow, .exp-hero .eyebrow { color: var(--accent-soft); font-size: .7rem; letter-spacing: .16em; line-height: 1.5; }
.exp-actions { display: flex; flex-wrap: wrap; gap: 1.4rem; align-items: center; margin-top: 1.7rem; }
.exp-fine { font-size: .85rem; color: var(--muted) !important; line-height: 1.6; }
.exp-fine a { text-decoration: underline; text-underline-offset: .2em; }
.exp-hero { padding-block: clamp(3rem,6vw,5rem); }
.exp-hero h1 { font-size: clamp(3rem,5.4vw,5rem); line-height: .98; margin: 1rem 0 1.4rem; }
.exp-lede { max-width: 48ch; font-size: clamp(1.05rem,1.4vw,1.25rem); line-height: 1.65; color: var(--muted-strong); }
.hero-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: 3rem; align-items: center; }
.clans-hero { background: radial-gradient(ellipse at 83% 36%,#301d142e,transparent 60%); }
.sanctuary-art { margin: 0; position: relative; }
.sanctuary-art img { display: block; width: 100%; height: 450px; object-fit: cover; object-position: center; border: 1px solid #5a3e2d; }
.sanctuary-art figcaption { font-family: var(--font-display); font-style: italic; color: var(--muted); text-align: center; margin-top: .9rem; font-size: 1.05rem; }
.clan-form-tabs { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); border-bottom: 1px solid var(--line); gap: .5rem; }
.clan-form-tabs button { position: relative; display: grid; place-items: center; gap: .6rem; padding: .8rem .3rem 1rem; border: 1px solid transparent; background: none; color: var(--muted); cursor: pointer; font: 700 .75rem/1.2 ui-sans-serif,system-ui,sans-serif; letter-spacing: .05em; }
.clan-form-tabs img { width: 64px; height: 64px; object-fit: contain; transition: transform .2s ease; }
.clan-form-tabs button:hover { color: var(--text); background: #bd82540b; }
.clan-form-tabs button[aria-selected="true"] { color: #eddbb8; border-color: #82603d; border-top-color: #c1a474; background: radial-gradient(ellipse at 50% 25%,#a8814238,transparent 75%),linear-gradient(145deg,#29231b,#100e0c 60%,#211a12); box-shadow: inset 0 0 0 3px #0b0a08,0 8px 25px #0008; }
.clan-form-tabs button[aria-selected="true"]::before { content: ''; position: absolute; inset: 5px; border: 1px solid #b88b5136; pointer-events: none; }
.clan-form-tabs button[aria-selected="true"]::after { content: ''; position: absolute; bottom: -4px; left: calc(50% - 3px); width: 6px; height: 6px; background: #c2a16a; border: 1px solid #efdbac; transform: rotate(45deg); }
.clan-form-tabs button[aria-selected="true"] img { transform: scale(1.08); filter: drop-shadow(0 3px 10px #d7a65b45); }
.clan-form-tabs button:focus-visible,.milestone-pager button:focus-visible,.milestone-control select:focus-visible,.exp-disclosure summary:focus-visible { outline: 2px solid #cda774; outline-offset: 3px; }
.clan-forms { padding-bottom: 1.5rem; }
.clan-form-panel { display: grid; grid-template-columns: 1fr 1.1fr; min-height: 250px; gap: 2rem; align-items: center; padding: 1.5rem 0; }
.clan-identity { display: flex; gap: 1.4rem; align-items: center; }
.clan-selected-emblem { width: clamp(100px,12vw,165px); height: 180px; object-fit: contain; flex-shrink: 0; }
.clan-identity h3 { margin: .3rem 0 .6rem; font-size: 2.7rem; }
.clan-identity p { margin: 0; font-size: .95rem; }
.clan-ranks { border-left: 1px solid var(--line); padding-left: 2rem; }
.clan-ranks > p { text-align: center; }
.clan-ranks ol { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem .7rem; text-align: center; }
.clan-ranks li { display: grid; align-content: start; gap: .35rem; min-width: 0; }
.clan-ranks li span { font: 600 .65rem/1.2 ui-sans-serif,system-ui,sans-serif; text-transform: uppercase; color: var(--muted); letter-spacing: .08em; }
.clan-ranks li strong { font-family: var(--font-display); font-size: 1.1rem; font-weight: 500; overflow-wrap: anywhere; }
.clan-ranks .leader { grid-column: 1/-1; padding-bottom: 1rem; }
.clan-ranks .leader strong { font-size: 2rem; color: #d1af7b; }
.social-strip { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; }
.social-strip h3 { max-width: 22ch; }
.social-strip p { margin-block: .5rem; }
.competition-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
.competition-grid article { border-top: 1px solid var(--line); padding-top: .7rem; }
.reward-illustration { display: flex; height: 120px; align-items: center; gap: 1.5rem; }
.reward-illustration img { width: 95px; height: 105px; object-fit: contain; }
.competition-clan .reward-illustration img { width: 150px; }
.exp-disclosure { margin-top: 1.5rem; border-block: 1px solid var(--line); padding-block: 1rem; }
.exp-disclosure summary { color: var(--text); font-size: .95rem; font-weight: 600; cursor: pointer; padding: .25rem 0; }
.exp-disclosure p { font-size: .93rem; max-width: 88ch; }
.exp-notes { margin-top: 1.5rem; border-top: 1px solid var(--line); padding-top: 1.1rem; }
.exp-notes h3 { margin: 0 0 .7rem; font-family: inherit; font-size: .95rem; font-weight: 600; letter-spacing: normal; line-height: 1.4; text-wrap: initial; }
.exp-notes p { font-size: .93rem; max-width: 100ch; }
.exp-end { display: flex; align-items: center; justify-content: space-between; gap: 2rem; border: 0; }
.exp-end h2 { margin-bottom: 0; }
.vip-hero { display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: 3rem; }
.vip-hero-emblem { width: 100%; max-width: 340px; height: 320px; object-fit: contain; justify-self: center; }
.plan-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.plan-table th,.plan-table td { padding: 1.1rem; border-bottom: 1px solid var(--line); text-align: center; font-size: 1rem; }
.plan-table th:first-child { width: 38%; text-align: left; font-weight: 500; color: var(--muted-strong); }
.plan-table thead td { width: 38%; }
.plan-table thead th { width: 31%; padding-top: .5rem; vertical-align: top; }
.plan-heading { position: relative; padding-top: 1.8rem; }
.plan-price { position: absolute; top: 0; right: 0; color: #e9dbc6; font: 600 1rem/1.2 ui-sans-serif,system-ui,sans-serif; white-space: nowrap; }
.patron-column .plan-price { color: #e7c38e; text-shadow: 0 0 16px #d4a25c55; }
.plan-table thead img { width: 90px; height: 90px; object-fit: contain; margin-inline: auto; }
.plan-table thead span { display: block; font: 500 2.3rem/1.2 var(--font-display); margin: .5rem 0; }
.plan-table thead small { display: block; color: var(--muted); font-weight: 400; line-height: 1.4; }
.plan-table td strong { font: 500 1.8rem/1.2 var(--font-display); }
.plan-table td:nth-child(3),.plan-table th:nth-child(3) { background: #bd82540c; }
.plan-table th.patron-column,.court-benefits .tribute-benefit { background: radial-gradient(ellipse at 70% 0,#bd825425,transparent 75%),#bd82540c; }
.plan-table th:nth-child(3) span,.plan-table td:nth-child(3) strong { color: #d4b486; }
.plan-foot { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-top: 1rem; }
.plan-foot p { font-size: .85rem; max-width: 75ch; margin: 0; }
.plan-foot a { flex-shrink: 0; }
.installment-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.court-benefits { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; }
.court-benefits article { display: grid; grid-template-columns: 140px 1fr; align-items: center; gap: 1.5rem; }
.court-benefits article h3 { font-size: 1.9rem; }
.court-benefits article p { font-size: .95rem; }
.court-benefits .tribute-benefit { padding: 1.2rem; border: 1px solid #bd82542e; box-shadow: inset 0 1px 0 #dfb97b19,0 0 25px #bd825408; }
.portrait-pair { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; align-items: center; }
.portrait-pair img { width: 100%; height: 130px; object-fit: contain; }
.portrait-pair img:last-child { margin-top: 50px; }
.tribute-benefit > img { width: 100%; height: 170px; object-fit: contain; }
.milestone-viewer { border: 1px solid #bd825452; background: linear-gradient(100deg,#bd82540c,transparent 60%); }
.milestone-control { display: flex; align-items: center; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--line); padding: 1rem 1.5rem; }
.milestone-control label { font-size: .85rem; color: var(--muted-strong); }
.milestone-caveat { color: var(--muted); font-size: .78rem; display: inline-block; margin-left: .3rem; }
.milestone-control select { background: #141115; color: var(--text); border: 1px solid #655346; padding: .65rem; font: inherit; font-size: .85rem; max-width: 100%; }
.milestone-stage { display: grid; grid-template-columns: 180px 150px 1fr; align-items: center; gap: 2rem; min-height: 210px; padding: 1.5rem 2rem; }
.milestone-point { text-align: center; border-right: 1px solid var(--line); padding-right: 2rem; }
.milestone-point strong { display: block; font: 500 4.5rem/1 var(--font-display); color: #d4b486; }
.milestone-point span { display: block; margin-top: .65rem; color: var(--muted); font-size: .8rem; }
.milestone-stage > img { width: 145px; height: 145px; object-fit: contain; }
.milestone-reward h3 { font-size: 2.2rem; }
.milestone-reward p:last-child { font-size: .8rem; color: var(--muted); }
.milestone-pager { display: flex; justify-content: space-between; align-items: center; gap: 1rem; border-top: 1px solid var(--line); padding: .7rem 1rem; }
.milestone-pager span { font-size: .8rem; color: var(--muted); text-align: center; }
.milestone-pager button { padding: .65rem 1rem; border: 1px solid #695142; background: transparent; color: var(--text); cursor: pointer; min-height: 44px; }
.milestone-pager button:disabled { opacity: .35; cursor: default; }
.sealed-hero { text-align: center; padding: 2.5rem 0 3rem; border-bottom: 1px solid var(--line); background: radial-gradient(ellipse at 50% 45%,#3c111e60,transparent 65%),#050506; }
.sealed-lock { display: block; width: 90px; height: 90px; object-fit: contain; margin: 0 auto .8rem; }
.sealed-hero .eyebrow { color: #c2444b; margin: .6rem 0; }
.coming-soon { text-transform: uppercase; letter-spacing: .3em; font-size: .65rem; font-weight: 700; }
.sealed-hero h1 { font-size: clamp(4rem,9vw,7rem); line-height: 1; text-transform: uppercase; margin: .5rem 0 1rem; }
.sealed-hero .exp-lede { margin: 0 auto 1.25rem; font-size: 1.05rem; }
.page-darkspawn #spoils { padding-bottom: 1.5rem; }
.darkspawn-path { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1.5rem; list-style: none; margin: 0; padding: 0; text-align: left; }
.darkspawn-path li { display: grid; grid-template-columns: 72px minmax(0,1fr); grid-template-rows: 88px auto; column-gap: .8rem; align-items: center; border-top: 1px solid #bd82544d; position: relative; padding-top: .8rem; }
.path-number { color: var(--accent-soft); font: 500 .85rem/1 var(--font-display); position: absolute; top: 1rem; right: 0; }
.darkspawn-path img { display: block; width: 72px; height: 88px; object-fit: contain; margin: 0; }
.darkspawn-path li:nth-child(3) img { object-fit: cover; object-position: 65% center; }
.darkspawn-path h3 { margin: 0; padding-right: 1rem; font-size: 1.65rem; text-wrap: initial; }
.darkspawn-path p { grid-column: 1 / -1; align-self: start; font-size: .9rem; margin: .65rem 0 0; }
.merchant-section { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 3rem; padding-top: 2rem; }
.merchant-section figure { margin: 0; }
.merchant-section figure img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border: 1px solid #bd825438; }
.mansion-room { min-width: 0; margin: 0; }
.mansion-room h4 { margin: 0 0 .75rem; color: #d4b486; font: 500 clamp(1.1rem,1.8vw,1.45rem)/1.25 var(--font-display); letter-spacing: .01em; }
.mansion-gallery .mansion-room img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; transform: none; }
.mansion-room figcaption { margin-top: .75rem; color: var(--muted-strong); font-size: .9rem; line-height: 1.5; }
.sigil-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.sigil-card { display: grid; grid-template-columns: 130px 1fr; align-items: center; gap: 1.5rem; padding: 1.5rem; border-top: 1px solid #7d2c34; background: linear-gradient(130deg,#6a152d23,transparent 70%); }
.sigil-card > img { width: 130px; height: 230px; object-fit: contain; }
.sigil-card h3 { font-size: 2rem; }
.sigil-card p { font-size: .9rem; }
.sigil-card ul { padding-left: 1.1rem; font-size: .85rem; line-height: 1.7; color: var(--muted-strong); }
.sigil-frost { border-color: #335f88; background: linear-gradient(130deg,#1f6b9b1a,transparent 70%); }
.sigil-frost .eyebrow { color: #79abd2; }
.sigil-balance { border-color: #4f853d; background: linear-gradient(130deg,#4f853d23,transparent 70%); }
.sigil-balance .eyebrow { color: #8dca70; }
.sigil-control { border-color: #79509b; background: linear-gradient(130deg,#79509b23,transparent 70%); }
.sigil-control .eyebrow { color: #bb8cde; }
.workshop-mini { display: grid; grid-template-columns: .9fr 1.1fr; gap: 2.5rem; align-items: center; border-top: 1px solid var(--line); padding: 2.5rem 0; }
.workshop-mini figure { margin: 0; }
.workshop-recipe { min-width: 0; display: grid; grid-template-columns: minmax(0,1.55fr) 45px minmax(0,1fr); align-items: center; gap: .8rem; padding: 1.4rem 1.1rem; min-height: 230px; border: 1px solid #76523966; background: linear-gradient(90deg,#09080bf2,#09080bd9),url('../img/workshop.webp') center/cover; }
.recipe-input,.recipe-result { min-width: 0; text-align: center; }
.recipe-trio { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .25rem; align-items: center; }
.recipe-trio img { display: block; width: 100%; height: auto; }
.recipe-result > img { display: block; width: min(118px,100%); height: auto; margin: auto; filter: drop-shadow(0 0 16px #d75d1926); }
.recipe-input-label,.recipe-result-label { margin-top: .8rem; color: var(--muted-strong); font-size: .78rem; line-height: 1.5; }
.recipe-input-label > span,.recipe-result-label > span { display: block; font-size: .64rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #c3a0df; }
.recipe-result-label > span { color: #e6ad71; }
.recipe-exchange { align-self: center; text-align: center; margin-bottom: 2.5rem; }
.recipe-arrow { color: #cead7e; font-size: 2rem; line-height: 1; }
.recipe-cost { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .15rem; margin-top: .5rem; color: var(--muted); font-size: .7rem; }
.recipe-cost img { width: 24px; height: 20px; object-fit: contain; }
.recipe-cost > span { flex-basis: 100%; }
.workshop-mini h3 { font-family: var(--font-display); font-size: clamp(2rem,3vw,3rem); line-height: 1.03; font-weight: 500; margin: .7rem 0 1rem; }
.workshop-mini p { color: var(--muted-strong); line-height: 1.65; margin: .65rem 0; }
.workshop-mini .eyebrow { color: var(--accent-soft); }
.gameplay-chapter-missions .apothecary-note { display: flex; align-items: center; gap: 1.5rem; padding-top: .8rem; margin-top: .6rem; border-top: 1px solid var(--line); max-width: 930px; }
.tonic-pair { display: flex; align-items: center; width: 155px; flex: 0 0 155px; height: 120px; }
.tonic-pair img { width: 88px; height: 105px; object-fit: contain; transform: rotate(-13deg); }
.tonic-pair img+img { transform: rotate(13deg); margin-left: -22px; margin-top: 10px; }
.apothecary-note p { font-family: 'Marck Script',cursive; font-style: normal; font-weight: 400; font-size: 1.45rem; line-height: 1.45; }
.apothecary-note small { display: block; color: var(--muted); margin-top: .5rem; font-size: .73rem; }
.scout-note { display: flex; align-items: center; gap: .8rem; border-top: 1px solid var(--line); padding-top: 1rem; font-size: .9rem; }
.scout-note img { width: 45px; height: 45px; object-fit: contain; flex-shrink: 0; }
.home-gateways .class-tease-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.page-home .section.home-leaderboard { padding-top: clamp(2rem,3.5vw,3rem); }
.update-highlights .update-preview p { max-width: none; }
.site-nav { gap: 1rem; }
.site-nav > a { font-size: .67rem; }
@media (max-width:1180px) {
  .darkspawn-path { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .topbar { flex-wrap: nowrap; justify-content: space-between; }
  .nav-toggle { display: grid; }
  .site-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #0b0a0d; padding: 1rem 2rem; border-bottom: 1px solid var(--line); flex-wrap: nowrap; gap: .35rem; z-index: 99; }
  .site-nav.is-open { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); }
  .site-nav > a { display: block; padding: .8rem .7rem; font-size: .75rem; }
  .site-nav .discord-nav-link { margin: 0; }
}
@media (max-width:900px) {
  .exp-wrap { width: min(calc(100% - 3rem),1200px); }
  .hero-grid { gap: 1.5rem; }
  .sanctuary-art img { height: 370px; }
  .clan-form-panel { grid-template-columns: 1fr; gap: 1.5rem; }
  .clan-identity { max-width: 600px; margin: auto; }
  .clan-selected-emblem { height: 130px; }
  .clan-ranks { border: 0; border-top: 1px solid var(--line); padding: 1.25rem 0 0; }
  .clan-ranks ol { grid-template-columns: repeat(5,minmax(0,1fr)); }
  .clan-ranks .leader { grid-column: auto; padding: 0; }
  .clan-ranks .leader strong { font-size: 1.25rem; }
  .court-benefits { gap: 2rem; }
  .court-benefits article { grid-template-columns: 1fr; gap: .3rem; }
  .portrait-pair { width: 160px; }
  .tribute-benefit > img { width: 160px; }
  .sigil-card { grid-template-columns: 85px 1fr; padding: 1.2rem .8rem; gap: .9rem; }
  .sigil-card > img { width: 85px; height: 190px; }
  .sigil-card h3 { font-size: 1.7rem; }
}
@media (max-width:680px) {
  .exp-wrap { width: calc(100% - 2.25rem); }
  .exp-hero { padding-block: 2.5rem; }
  .hero-grid,.vip-hero,.social-strip,.competition-grid,.merchant-section,.sigil-grid,.workshop-mini { grid-template-columns: 1fr; gap: 1.75rem; }
  .exp-hero h1 { font-size: clamp(3rem,11vw,4rem); }
  .sanctuary-art img { height: 260px; }
  .clan-form-tabs { grid-template-columns: repeat(3,minmax(0,1fr)); gap: .2rem; }
  .clan-form-tabs img { width: 48px; height: 48px; }
  .clan-form-tabs button { padding: .6rem .2rem; font-size: .7rem; }
  .clan-identity { gap: 1rem; }
  .clan-selected-emblem { width: 90px; height: 120px; }
  .clan-identity h3 { font-size: 2.2rem; }
  .clan-identity p { font-size: .87rem; }
  .clan-ranks ol { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .clan-ranks .leader { grid-column: 1/-1; padding-bottom: .8rem; }
  .clan-ranks .leader strong { font-size: 1.7rem; }
  .clan-ranks li strong { font-size: .95rem; }
  .clan-form-panel { min-height: 360px; padding-block: 1.3rem; }
  .exp-end,.plan-foot { flex-direction: column; align-items: flex-start; gap: 1rem; }
  .vip-hero { grid-template-columns: 1fr 100px; gap: .6rem; }
  .vip-hero h1 { font-size: 2.9rem; }
  .vip-hero .exp-lede { font-size: .97rem; }
  .vip-hero-emblem { width: 100px; height: 130px; align-self: start; margin-top: 3rem; }
  .plan-table th,.plan-table td { padding: .8rem .4rem; font-size: .82rem; }
  .plan-table th:first-child,.plan-table thead td { width: 36%; }
  .plan-table thead th { width: 32%; }
  .plan-table thead img { width: 58px; height: 62px; }
  .plan-table thead span { font-size: clamp(1.2rem,6vw,1.6rem); }
  .plan-table thead small { font-size: .7rem; }
  .plan-price { font-size: .82rem; }
  .plan-heading { padding-top: 1.7rem; }
  .plan-table td strong { font-size: 1.6rem; }
  .installment-grid { grid-template-columns: 1fr; gap: .2rem; }
  .court-benefits { grid-template-columns: 1fr; gap: 1.5rem; }
  .court-benefits article { grid-template-columns: 100px 1fr; gap: 1rem; }
  .court-benefits .tribute-benefit { display: flow-root; padding: .9rem; }
  .court-benefits h3 { font-size: 1.6rem !important; }
  .portrait-pair { width: 100px; }
  .portrait-pair img { height: 90px; }
  .tribute-benefit > img { width: 100px; height: 130px; }
  .court-benefits .tribute-benefit > img { float: left; width: 80px; height: 110px; margin: 0 .8rem .5rem 0; }
  .court-benefits .tribute-benefit > div > p:last-child { clear: both; }
  .milestone-control { flex-direction: column; align-items: stretch; padding: 1rem; }
  .milestone-control select { width: 100%; font-size: .8rem; }
  .milestone-stage { grid-template-columns: 90px 1fr; gap: .6rem 1rem; padding: 1rem; min-height: 185px; }
  .milestone-point { padding-right: .7rem; }
  .milestone-point strong { font-size: 3rem; }
  .milestone-point span { font-size: .65rem; }
  .milestone-stage > img { width: 100px; height: 95px; justify-self: center; }
  .milestone-reward { grid-column: 1/-1; text-align: center; min-width: 0; }
  .milestone-reward p { margin-block: .4rem; }
  .milestone-reward h3 { font-size: 1.5rem; }
  .milestone-reward .eyebrow { font-size: .58rem; }
  .milestone-pager { gap: .5rem; padding: .6rem; }
  .milestone-pager span { font-size: .65rem; }
  .milestone-pager button { padding: .55rem .6rem; }
  .sealed-hero { padding-block: 2.5rem; }
  .sealed-hero h1 { font-size: clamp(2.8rem,12vw,5rem); }
  .darkspawn-path { grid-template-columns: 1fr; gap: 1.25rem; }
  .darkspawn-path li { grid-template-columns: 64px minmax(0,1fr); grid-template-rows: auto auto; row-gap: .35rem; }
  .darkspawn-path img { grid-row: 1 / 3; width: 64px; height: 78px; }
  .darkspawn-path h3 { font-size: 1.35rem; }
  .darkspawn-path p { grid-column: 2; margin: 0; font-size: .84rem; }
  .sigil-card { grid-template-columns: 105px 1fr; padding: 1rem .7rem; }
  .sigil-card > img { width: 105px; }
  .workshop-recipe { grid-template-columns: minmax(0,1.55fr) 28px minmax(0,1fr); gap: .4rem; padding: 1rem .6rem; min-height: 175px; }
  .recipe-input-label,.recipe-result-label { font-size: .7rem; margin-top: .6rem; }
  .recipe-input-label > span,.recipe-result-label > span { font-size: .57rem; letter-spacing: .035em; }
  .recipe-arrow { font-size: 1.65rem; }
  .recipe-cost { font-size: .65rem; }
  .recipe-cost img { width: 18px; height: 16px; }
  .gameplay-chapter-missions .apothecary-note { gap: .8rem; }
  .tonic-pair { width: 92px; flex-basis: 92px; height: 120px; }
  .tonic-pair img { width: 59px; height: 85px; }
  .tonic-pair img+img { margin-left: -25px; }
  .apothecary-note p { font-size: 1.28rem; }
  .home-gateways .class-tease-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .site-nav.is-open { grid-template-columns: 1fr 1fr; }
  .site-nav { padding: 1rem; }
}
@media (max-width:360px) {
  .vip-hero { grid-template-columns: 1fr; }
  .vip-hero-emblem { display: none; }
  .milestone-stage { grid-template-columns: 85px 1fr; gap: .5rem; padding: .8rem; }
  .milestone-stage > img { width: 90px; }
  .milestone-reward h3 { font-size: 1.3rem; }
  .sigil-card { grid-template-columns: 80px 1fr; }
  .sigil-card > img { width: 80px; }
  .home-gateways .class-tease-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .clan-form-tabs img { transition: none; }
  .exp-animate { animation: none !important; }
}
@keyframes exp-reveal { from { opacity:.45; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
.exp-animate { animation: exp-reveal .25s ease-out; }