@font-face{font-family:Cinzel;src:url('/assets/fonts/cinzel-latin.woff2') format('woff2');font-style:normal;font-weight:400 700;font-display:swap}
@font-face{font-family:Inter;src:url('/assets/fonts/inter-latin.woff2') format('woff2');font-style:normal;font-weight:400 700;font-display:swap}
:root {
  --bg-main:#161d1f;
  --bg-secondary:#202a2d;
  --bg-elevated:#283337;
  --surface-light:#d6ceb9;
  --text-primary:#e5e0d5;
  --text-secondary:#a9b2af;
  --text-dark:#252a29;
  --alliance-blue:#355d78;
  --alliance-blue-hover:#426f8d;
  --alliance-blue-dark:#263f50;
  --brass:#a88b54;
  --brass-light:#c2a86b;
  --stone:#737874;
  --forest:#465b50;
  --border-dark:#344044;
  --border-light:rgba(255,255,255,.08)
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth
}

body {
  margin:0;
  background:var(--bg-main);
  color:var(--text-primary);
  font:400 16px/1.7 Inter,Arial,sans-serif
}

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

button {
  font:inherit
}

a:focus-visible,button:focus-visible {
  outline:2px solid var(--brass-light);
  outline-offset:4px
}

.skip-link{position:fixed;z-index:1000;top:8px;left:8px;padding:10px 14px;background:#f0eadb;color:#1c2426;transform:translateY(-150%)}
.skip-link:focus{transform:translateY(0)}

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

h1,h2,h3,p {
  margin-top:0
}

h1,h2 {
  font-family:Cinzel,Georgia,serif;
  font-weight:500;
  line-height:1.15
}

h2 {
  font-size:clamp(2rem,3.5vw,2.8rem);
  letter-spacing:-.025em
}

h3 {
  line-height:1.3
}

.wrap {
  width:min(100% - 64px,1160px);
  margin:auto
}

.narrow {
  max-width:800px
}

.eyebrow {
  font-size:.76rem;
  font-weight:700;
  line-height:1.5;
  letter-spacing:.22em;
  color:var(--brass-light);
  text-transform:uppercase;
  margin-bottom:22px
}

.section {
  padding:110px 0
}

.section> .wrap>h2 {
  max-width:730px
}

.muted {
  background:var(--bg-secondary)
}

.fine-print {
  color:var(--text-secondary);
  font-size:.86rem;
  margin:20px 0 0
}

.center {
  text-align:center
}

.center p {
  max-width:640px;
  margin-left:auto;
  margin-right:auto
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  min-height:50px;
  padding:12px 20px;
  border-radius:6px;
  border:1px solid transparent;
  font-size:.87rem;
  font-weight:600;
  line-height:1.2;
  transition:background .2s,border .2s,transform .2s
}

.button:hover {
  transform:translateY(-1px)
}

.button span {
  font-size:1.15rem;
  font-weight:400
}

.button-primary {
  background:var(--alliance-blue);
  border-color:var(--alliance-blue-hover);
  color:#fff
}

.button-primary:hover {
  background:var(--alliance-blue-hover)
}

.button-secondary {
  border-color:rgba(229,224,213,.3);
  color:var(--text-primary)
}

.button-secondary:hover {
  background:rgba(255,255,255,.06)
}

.actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap
}

.site-header {
  position:fixed;
  z-index:20;
  top:0;
  left:0;
  right:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding:17px max(32px,calc((100vw - 1220px)/2));
  border-bottom:1px solid transparent;
  transition:background .25s,border .25s
}

.site-header.scrolled {
  background:rgba(22,29,31,.94);
  backdrop-filter:blur(12px);
  border-color:var(--border-light)
}

.brand {
  display:inline-flex;
  align-items:center;
  gap:13px;
  white-space:nowrap
}

.brand-icon {
  width:40px;
  height:40px;
  color:var(--brass-light)
}

.brand-icon svg {
  display:block;
  width:100%;
  height:100%
}

.brand strong {
  display:block;
  font:600 1.12rem/1.1 Cinzel,Georgia,serif;
  letter-spacing:.04em;
  text-transform:uppercase
}

.brand small {
  display:block;
  margin-top:5px;
  color:var(--text-secondary);
  font-size:.63rem;
  letter-spacing:.09em
}

.site-header nav {
  display:flex;
  align-items:center;
  gap:clamp(12px,1.9vw,27px)
}

.site-header nav>a:not(.button) {
  font-size:.82rem;
  color:#d1d5d0;
  transition:color .2s
}

.site-header nav>a:not(.button):hover,.site-header nav>a.active {
  color:var(--brass-light)
}

.nav-discord {
  margin-left:8px;
  min-height:39px;
  padding:9px 15px;
  gap:0
}

.menu-toggle {
  display:none
}

.hero {
  position:relative;
  min-height:max(700px,92vh);
  display:flex;
  align-items:center;
  overflow:hidden;
  background:#1a2529 url('/assets/images/hero.webp') center 43%/cover no-repeat
}

.hero:before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(13,22,25,.87) 0%,rgba(16,25,27,.68) 43%,rgba(16,25,27,.15) 100%),linear-gradient(0deg,#161d1f 0%,transparent 35%)
}

.hero-content {
  position:relative;
  z-index:2;
  padding-top:125px;
  padding-bottom:85px
}

.hero h1 {
  font-size:clamp(4.2rem,8vw,7.4rem);
  line-height:.98;
  letter-spacing:.055em;
  margin:0 0 29px;
  text-shadow:0 3px 24px rgba(0,0,0,.22)
}

.hero-rule,.short-rule {
  width:72px;
  height:2px;
  background:var(--brass);
  margin:0 0 26px
}

.hero h2 {
  font-family:Inter,Arial,sans-serif;
  font-size:clamp(1.3rem,2vw,1.75rem);
  font-weight:500;
  line-height:1.4;
  letter-spacing:0;
  margin-bottom:16px
}

.hero-content>p:not(.eyebrow) {
  max-width:570px;
  color:#d8ddda;
  font-size:1.03rem
}

.hero .actions {
  margin-top:30px
}

.hero-date {
  display:flex;
  gap:12px;
  align-items:center;
  margin-top:35px;
  color:var(--text-secondary);
  font-size:.78rem;
  letter-spacing:.05em;
  text-transform:uppercase
}

.hero-date:before {
  content:"";
  height:1px;
  width:28px;
  background:var(--brass)
}

.hero-date strong {
  color:var(--text-primary);
  font-weight:600
}

.hero-caption {
  position:absolute;
  z-index:2;
  right:4vw;
  bottom:35px;
  color:#d3d7d3;
  font-size:.7rem;
  letter-spacing:.15em;
  text-transform:uppercase
}

.fog {
  position:absolute;
  z-index:1;
  left:-20%;
  bottom:-12%;
  width:140%;
  height:48%;
  pointer-events:none;
  background:radial-gradient(ellipse at 40% 50%,rgba(216,225,219,.13),transparent 60%);
  filter:blur(28px);
  animation:fog 65s ease-in-out infinite alternate
}

.fog-two {
  bottom:8%;
  opacity:.5;
  animation-duration:88s;
  animation-direction:alternate-reverse
}

@keyframes fog {
  from {
    transform:translateX(-4%)
  }

  to {
    transform:translateX(5%)
  }

}

.light-section {
  background:var(--surface-light);
  color:var(--text-dark)
}

.intro {
  padding:110px 0
}

.intro-grid {
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:80px
}

.intro .eyebrow {
  color:#735a32
}

.intro h2 {
  font-size:clamp(3.4rem,6vw,5.5rem);
  margin-bottom:24px
}

.intro-copy {
  padding-top:5px;
  font-size:1.05rem
}

.intro-copy p {
  margin-bottom:17px
}

.principle-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
  margin-top:38px
}

.principle {
  background:var(--bg-secondary);
  border:1px solid var(--border-light);
  border-top:2px solid rgba(168,139,84,.7);
  border-radius:7px;
  padding:30px 29px 32px;
  min-height:246px;
  transition:transform .25s,border-color .25s
}

.principle:hover {
  transform:translateY(-3px);
  border-color:rgba(168,139,84,.35)
}

.number {
  color:var(--brass-light);
  font-size:.74rem;
  letter-spacing:.1em
}

.principle h3 {
  font:500 1.35rem/1.3 Cinzel,Georgia,serif;
  margin:28px 0 12px
}

.principle p {
  color:var(--text-secondary);
  font-size:.9rem;
  line-height:1.65;
  margin:0
}

.activities {
  background:var(--bg-secondary)
}

.activity-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  margin-top:42px;
  border-top:1px solid var(--border-light);
  border-left:1px solid var(--border-light)
}

.activity {
  padding:31px 30px 35px;
  border-right:1px solid var(--border-light);
  border-bottom:1px solid var(--border-light);
  min-height:225px
}

.activity-icon {
  display:block;
  color:var(--brass-light);
  font:400 1.8rem/1 Georgia,serif;
  margin-bottom:25px
}

.activity h3 {
  font-size:1.05rem;
  font-weight:600;
  margin-bottom:9px
}

.activity p {
  color:var(--text-secondary);
  font-size:.88rem;
  line-height:1.65;
  margin:0
}

.heritage-intro {
  max-width:750px
}

.heritage-intro p {
  color:var(--text-secondary);
  font-size:1.04rem
}

.heritage-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-top:38px
}

.heritage-card {
  min-height:350px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:34px;
  border:1px solid rgba(168,139,84,.25);
  border-radius:7px;
  background-size:cover;
  overflow:hidden
}

.heritage-card.human {
  background:linear-gradient(0deg,rgba(13,22,24,.94),rgba(21,34,38,.24)),url('/assets/images/hero.webp') 42% 55%/cover
}

.heritage-card.dwarf {
  background:linear-gradient(0deg,rgba(13,22,24,.94),rgba(27,36,37,.35)),url('/assets/images/inn.webp') 55% 50%/cover
}

.heritage-card>span {
  color:var(--brass-light);
  font-size:.7rem;
  letter-spacing:.15em
}

.heritage-card h3 {
  font:500 2.3rem/1.15 Cinzel,Georgia,serif;
  margin:12px 0 8px
}

.heritage-card p {
  margin:0;
  color:#d4d7d2;
  font-size:.85rem
}

.heritage-note {
  color:var(--text-secondary);
  max-width:720px;
  margin:25px auto 0;
  text-align:center;
  font-size:.87rem
}

.campfire {
  position:relative;
  padding:125px 0;
  background:#172023 url('/assets/images/inn.webp') center 56%/cover no-repeat
}

.campfire:before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(15,21,22,.94),rgba(15,21,22,.8) 48%,rgba(15,21,22,.4))
}

.campfire-content {
  position:relative
}

.campfire h2 {
  font-size:clamp(2.5rem,4vw,4rem)
}

.campfire p:not(.eyebrow) {
  max-width:590px;
  color:#d2d6d2;
  font-size:1rem
}

.campfire .actions {
  margin-top:28px
}

.section-top {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:30px
}

.text-link {
  color:var(--brass-light);
  font-size:.85rem;
  font-weight:600;
  border-bottom:1px solid rgba(194,168,107,.5);
  padding-bottom:5px;
  white-space:nowrap
}

.text-link span {
  margin-left:12px
}

.event-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
  margin-top:20px
}

.event-card {
  background:var(--bg-secondary);
  border:1px solid var(--border-light);
  border-radius:7px;
  padding:26px 30px 30px
}

.event-meta {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  color:var(--brass-light);
  font-size:.82rem
}

.badge {
  color:var(--text-secondary);
  border:1px solid var(--border-dark);
  padding:3px 8px;
  border-radius:3px;
  font-size:.7rem
}

.event-card h3 {
  font:500 1.4rem Cinzel,Georgia,serif;
  margin:24px 0 9px
}

.event-card p {
  color:var(--text-secondary);
  font-size:.9rem;
  margin:0
}

.chronicle-teaser {
  background:var(--bg-secondary)
}

.teaser-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px
}

.teaser-grid>div:first-child p:not(.eyebrow) {
  color:var(--text-secondary);
  margin-bottom:25px
}

.timeline {
  border-left:1px solid rgba(168,139,84,.45);
  padding-left:30px
}

.timeline-item {
  position:relative;
  display:grid;
  grid-template-columns:135px 1fr;
  gap:22px;
  padding:0 0 35px
}

.timeline-item:last-child {
  padding-bottom:0
}

.timeline-item:before {
  content:"";
  position:absolute;
  left:-35px;
  top:7px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--brass)
}

.timeline-item>span {
  color:var(--brass-light);
  font-size:.8rem;
  font-weight:600
}

.timeline-item h3 {
  font-size:1rem;
  margin-bottom:5px
}

.timeline-item p {
  color:var(--text-secondary);
  font-size:.85rem;
  margin:0
}

.timeline-item small {
  display:inline-block;
  color:var(--brass-light);
  font-size:.69rem;
  margin-top:8px
}

.page-hero {
  position:relative;
  overflow:hidden;
  padding:205px 0 95px;
  min-height:455px;
  background:linear-gradient(90deg,rgba(16,25,27,.94),rgba(16,25,27,.72)),url('/assets/images/hero.webp') center 46%/cover
}

.page-hero>.wrap{position:relative;z-index:2}
.page-fog{position:absolute;z-index:1;pointer-events:none;left:-45%;width:190%;height:58%;filter:blur(26px);mix-blend-mode:screen;will-change:transform,opacity;background:radial-gradient(ellipse at 18% 55%,rgba(219,229,224,.15),transparent 34%),radial-gradient(ellipse at 48% 42%,rgba(211,222,217,.13),transparent 38%),radial-gradient(ellipse at 76% 61%,rgba(225,233,229,.12),transparent 35%)}
.page-fog-one{bottom:-14%;animation:fog-drift-one 39s linear infinite,fog-breathe 12s ease-in-out infinite alternate}
.page-fog-two{bottom:24%;opacity:.32;filter:blur(34px);animation:fog-drift-two 55s linear infinite,fog-breathe 16s ease-in-out infinite alternate-reverse}

.page-hero h1 {
  font-size:clamp(2.7rem,5vw,4.6rem);
  max-width:950px;
  margin-bottom:20px
}

.page-hero .lead {
  font-size:1.06rem;
  max-width:690px;
  color:#d0d7d4
}

.prose h2 {
  margin-bottom:27px
}

.prose p {
  color:var(--text-secondary);
  font-size:1.05rem;
  margin-bottom:24px
}

.prose a {
  text-decoration:underline;
  color:var(--brass-light)
}

.empty-state {
  text-align:center;
  border:1px solid var(--border-light);
  padding:65px 40px;
  border-radius:7px;
  background:var(--bg-secondary)
}

.empty-mark {
  width:72px;
  height:72px;
  color:var(--brass-light);
  margin:0 auto 20px
}

.empty-mark svg {
  width:100%;
  height:100%
}

.empty-state p {
  max-width:560px;
  margin:0 auto 28px;
  color:var(--text-secondary)
}

.fit-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}

.fit-card {
  background:var(--bg-secondary);
  border:1px solid var(--border-light);
  border-top:2px solid var(--brass);
  border-radius:7px;
  padding:32px
}

.fit-sign {
  display:block;
  font:400 2.1rem/1 Georgia,serif;
  color:var(--brass-light);
  margin-bottom:20px
}

.fit-card h2 {
  font-size:1.55rem;
  line-height:1.35
}

.fit-card ul {
  margin:25px 0 0;
  padding-left:18px;
  color:var(--text-secondary)
}

.fit-card li {
  padding:6px 0
}

.rules .rule {
  display:grid;
  grid-template-columns:70px 1fr;
  gap:25px;
  padding:25px 0;
  border-bottom:1px solid var(--border-light)
}

.rule span {
  color:var(--brass-light);
  font:500 1.4rem Cinzel,Georgia,serif
}

.rule p {
  font-size:1.05rem;
  margin:0
}

.serious-note {
  border-left:2px solid var(--brass);
  padding:0 0 0 26px;
  margin-top:55px
}

.serious-note h2 {
  font-size:1.65rem
}

.serious-note p {
  color:var(--text-secondary)
}

.special-page {
  min-height:75vh;
  display:flex;
  align-items:center;
  padding:160px 0 80px;
  background:linear-gradient(90deg,rgba(16,25,27,.94),rgba(16,25,27,.68)),url('/assets/images/hero.webp') center/cover
}

.special-page h1 {
  font-size:clamp(3rem,6vw,5rem)
}

.special-page p:not(.eyebrow) {
  color:var(--text-secondary);
  max-width:540px;
  margin-bottom:28px
}

.footer {
  background:#111719;
  border-top:1px solid var(--border-light);
  padding:65px 0 25px
}

.footer-grid {
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:50px
}

.footer .brand-icon {
  width:45px;
  height:45px
}

.footer p,.footer a:not(.brand) {
  color:var(--text-secondary);
  font-size:.82rem
}

.footer-grid>div:first-child p {
  margin:25px 0 0
}

.footer h3 {
  font-size:.76rem;
  color:var(--brass-light);
  letter-spacing:.14em;
  text-transform:uppercase;
  margin-bottom:16px
}

.footer-grid>div>a:not(.brand) {
  display:block;
  margin:8px 0
}

.footer a:hover {
  color:var(--text-primary)
}

.footer-bottom {
  display:flex;
  justify-content:space-between;
  gap:30px;
  border-top:1px solid var(--border-light);
  margin-top:55px;
  padding-top:22px;
  align-items:end
}

.footer-bottom p {
  max-width:750px;
  margin:0;
  font-size:.7rem;
  color:#889491
}

.footer-bottom span {
  white-space:nowrap;
  font-size:.7rem;
  color:var(--brass-light)
}

.discord-notice {
  display:none;
  position:fixed;
  z-index:50;
  right:20px;
  bottom:20px;
  max-width:410px;
  gap:20px;
  padding:20px;
  background:#d6ceb9;
  color:#252a29;
  border:1px solid var(--brass);
  border-radius:7px;
  box-shadow:0 14px 40px rgba(0,0,0,.25)
}

.discord-notice:target {
  display:flex
}

.discord-notice strong {
  font-size:.95rem
}

.discord-notice p {
  font-size:.82rem;
  line-height:1.5;
  margin:6px 0
}

.discord-notice div a {
  text-decoration:underline;
  font-size:.82rem;
  font-weight:600
}

.discord-notice>a {
  font-size:1.5rem;
  line-height:1
}

@media(max-width:1050px) {
  .site-header {
    padding-left:28px;
    padding-right:28px
  }

  .site-header nav {
    gap:13px
  }

  .site-header nav>a:not(.button) {
    font-size:.74rem
  }

  .brand strong {
    font-size:.98rem
  }

  .brand small {
    font-size:.57rem
  }

  .principle {
    padding:25px
  }

  .principle h3 {
    font-size:1.18rem
  }

}

@media(max-width:760px) {
  .wrap {
    width:min(100% - 36px,1160px)
  }

  .section {
    padding:70px 0
  }

  .site-header {
    padding:13px 18px;
    background:rgba(22,29,31,.92)
  }

  .menu-toggle {
    display:flex;
    flex-direction:column;
    gap:5px;
    align-items:center;
    justify-content:center;
    background:none;
    border:1px solid var(--border-light);
    width:42px;
    height:42px;
    border-radius:4px
  }

  .menu-toggle span {
    display:block;
    width:19px;
    height:2px;
    background:var(--text-primary)
  }

  .site-header nav {
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:68px;
    background:rgba(22,29,31,.98);
    padding:20px 18px 25px;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    border-bottom:1px solid var(--border-dark);
    box-shadow:0 15px 30px rgba(0,0,0,.25)
  }

  .site-header nav.open {
    display:flex
  }

  .site-header nav>a:not(.button) {
    padding:10px 4px;
    font-size:.95rem
  }

  .nav-discord {
    margin:15px 0 0
  }

  .hero {
    min-height:700px;
    background-position:57% center
  }

  .hero:before {
    background:linear-gradient(90deg,rgba(13,22,25,.82),rgba(13,22,25,.42)),linear-gradient(0deg,#161d1f,transparent 45%)
  }

  .hero-content {
    padding-top:100px;
    padding-bottom:70px
  }

  .hero h1 {
    font-size:clamp(3.8rem,13vw,6rem)
  }

  .hero h2 br {
    display:none
  }

  .hero-caption {
    display:none
  }

  .intro {
    padding:75px 0
  }

  .intro-grid,.teaser-grid {
    grid-template-columns:1fr;
    gap:25px
  }

  .intro h2 {
    margin-bottom:15px
  }

  .principle-grid,.activity-grid {
    grid-template-columns:repeat(2,1fr)
  }

  .heritage-grid,.fit-grid,.event-grid {
    grid-template-columns:1fr
  }

  .heritage-card {
    min-height:315px
  }

  .campfire {
    padding:85px 0
  }

  .page-hero {
    padding:155px 0 70px;
    min-height:380px
  }

  .footer-grid {
    grid-template-columns:1fr 1fr;
    gap:30px
  }

  .footer-grid>div:first-child {
    grid-column:1/-1
  }

  .footer-bottom {
    display:block
  }

  .footer-bottom span {
    display:block;
    margin-top:15px
  }

  .timeline-item {
    grid-template-columns:105px 1fr
  }

  .section-top {
    align-items:start
  }

}

@media(max-width:520px) {
  .hero h1 {
    font-size:3.7rem
  }

  .hero .eyebrow {
    font-size:.65rem
  }

  .hero-date {
    font-size:.66rem;
    flex-wrap:wrap;
    gap:8px
  }

  .hero-date strong {
    width:100%;
    padding-left:40px
  }

  .button {
    gap:20px
  }

  .principle-grid,.activity-grid {
    grid-template-columns:1fr
  }

  .principle {
    min-height:auto
  }

  .activity {
    min-height:auto
  }

  .section-top {
    display:block
  }

  .section-top .text-link {
    display:inline-block;
    margin-bottom:20px
  }

  .heritage-card {
    min-height:270px
  }

  .timeline-item {
    grid-template-columns:1fr;
    gap:4px
  }

  .page-hero h1 {
    font-size:2.55rem
  }

  .empty-state {
    padding:45px 22px
  }

  .rules .rule {
    grid-template-columns:45px 1fr;
    gap:12px
  }

  .footer-grid {
    gap:18px
  }

  .brand strong {
    font-size:.91rem
  }

}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }

  .fog {
    animation:none
  }

  .button,.principle {
    transition:none
  }

}

.member-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px
}

.member-card {
  display:grid;
  grid-template-columns:140px 1fr;
  background:var(--bg-secondary);
  border:1px solid var(--border-light);
  border-radius:7px;
  overflow:hidden
}

.member-portrait {
  min-height:240px;
  background:var(--bg-elevated);
  display:flex;
  align-items:center;
  justify-content:center
}

.member-portrait img {
  width:100%;
  height:100%;
  object-fit:cover
}

.member-placeholder {
  width:72px;
  height:72px;
  color:var(--brass-light)
}

.member-placeholder svg {
  width:100%;
  height:100%
}

.member-details {
  padding:25px
}

.member-details h2 {
  font-size:1.5rem;
  margin:15px 0 8px
}

.member-details p {
  color:var(--text-secondary);
  font-size:.86rem;
  margin-bottom:8px
}

.member-details blockquote {
  color:var(--text-primary);
  font-size:.9rem;
  margin:18px 0 0;
  font-style:italic
}

@media(max-width:760px) {
  .member-grid {
    grid-template-columns:1fr
  }

}

@media(max-width:520px) {
  .member-card {
    grid-template-columns:1fr
  }

  .member-portrait {
    height:220px
  }

}


/* ==========================================================
   GUILD CHARACTER HUB · V3
   ========================================================== */

.sr-only {
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important
}

.guild-hub-section {
  padding-top:72px
}

.guild-hub-wrap {
  width:min(100% - 48px,1680px)
}

.guild-live-summary {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-bottom:24px;
  border:1px solid rgba(168,139,84,.38);
  background:rgba(168,139,84,.12)
}

.guild-live-stat {
  min-height:94px;
  padding:21px 24px;
  background:#121a1c;
  border-right:1px solid rgba(168,139,84,.22)
}

.guild-live-stat:last-child {
  border-right:0
}

.guild-live-stat span,
.panel-kicker {
  display:block;
  color:var(--brass-light);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.17em;
  text-transform:uppercase
}

.guild-live-stat strong {
  display:block;
  margin-top:7px;
  color:#f1ddaa;
  font:500 1.05rem/1.3 Cinzel,Georgia,serif
}

.guild-loading-panel {
  text-align:center;
  padding:70px 30px;
  border:1px solid var(--border-light);
  border-radius:8px;
  background:var(--bg-secondary)
}

.guild-loading-panel h2 {
  margin:10px 0 14px
}

.guild-loading-panel p {
  max-width:620px;
  margin:0 auto;
  color:var(--text-secondary)
}

.guild-character-hub {
  display:grid;
  grid-template-columns:minmax(250px,.72fr) minmax(600px,1.7fr) minmax(350px,1fr);
  gap:18px;
  align-items:start
}

.guild-roster-panel,
.character-viewer,
.character-data-panel {
  border:1px solid var(--border-light);
  border-radius:8px;
  background:var(--bg-secondary);
  overflow:hidden
}

.guild-roster-panel,
.character-data-panel {
  position:sticky;
  top:88px;
  max-height:calc(100vh - 112px)
}

.guild-roster-panel {
  display:flex;
  flex-direction:column
}

.panel-heading {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:22px 20px 17px;
  border-bottom:1px solid var(--border-light)
}

.panel-heading h2,
.character-data-head h2 {
  margin:4px 0 0;
  font-size:1.55rem
}

.live-pill {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 8px;
  border:1px solid rgba(111,177,129,.25);
  border-radius:999px;
  color:#b4cbbb;
  font-size:.63rem;
  white-space:nowrap
}

.live-pill i {
  width:7px;
  height:7px;
  border-radius:50%;
  background:#63c37c;
  box-shadow:0 0 0 4px rgba(99,195,124,.08)
}

.roster-search {
  display:block;
  padding:14px;
  border-bottom:1px solid var(--border-light)
}

.roster-search input {
  width:100%;
  padding:11px 12px;
  border:1px solid var(--border-dark);
  border-radius:5px;
  outline:0;
  background:#151e20;
  color:var(--text-primary);
  font:inherit;
  font-size:.84rem
}

.roster-search input:focus {
  border-color:rgba(194,168,107,.62);
  box-shadow:0 0 0 3px rgba(194,168,107,.07)
}

.guild-roster-list {
  overflow:auto;
  padding:7px
}

.roster-member {
  --class-color:#a88b54;
  appearance:none;
  width:100%;
  display:grid;
  grid-template-columns:48px 1fr 28px;
  gap:11px;
  align-items:center;
  padding:10px;
  border:1px solid transparent;
  border-left:2px solid transparent;
  border-radius:5px;
  background:transparent;
  color:var(--text-primary);
  text-align:left;
  cursor:pointer;
  transition:background .16s,border-color .16s,transform .16s
}

.roster-member:hover {
  background:rgba(255,255,255,.035)
}

.roster-member.active {
  background:linear-gradient(90deg,color-mix(in srgb,var(--class-color) 12%,transparent),rgba(255,255,255,.025));
  border-color:rgba(255,255,255,.055);
  border-left-color:var(--class-color)
}

.roster-avatar {
  width:48px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--class-color) 55%,#3b4548);
  border-radius:5px;
  background:#12191b
}

.roster-avatar img {
  width:100%;
  height:100%;
  object-fit:cover
}

.roster-fallback {
  width:28px;
  height:28px;
  color:var(--brass-light)
}

.roster-fallback svg {
  width:100%;
  height:100%
}

.roster-copy {
  min-width:0
}

.roster-copy strong {
  display:block;
  overflow:hidden;
  color:#ece7dc;
  font:500 .94rem/1.25 Cinzel,Georgia,serif;
  text-overflow:ellipsis;
  white-space:nowrap
}

.roster-copy small {
  display:block;
  overflow:hidden;
  margin-top:4px;
  color:var(--text-secondary);
  font-size:.7rem;
  text-overflow:ellipsis;
  white-space:nowrap
}

.roster-rank {
  display:grid;
  place-items:center;
  width:25px;
  height:25px;
  border:1px solid var(--border-dark);
  border-radius:4px;
  color:#8e9a97;
  font-size:.67rem
}

.roster-empty {
  padding:28px 18px;
  color:var(--text-secondary);
  text-align:center;
  font-size:.82rem
}

.class-1{--class-color:#c79c6e}.class-2{--class-color:#f58cba}.class-3{--class-color:#abd473}.class-4{--class-color:#fff569}.class-5{--class-color:#f2f2f2}.class-6{--class-color:#c41f3b}.class-7{--class-color:#0070de}.class-8{--class-color:#69ccf0}.class-9{--class-color:#9482c9}.class-10{--class-color:#00ff96}.class-11{--class-color:#ff7d0a}.class-12{--class-color:#a330c9}.class-13{--class-color:#33937f}

.character-viewer {
  min-height:860px;
  background:
    radial-gradient(circle at 50% 28%,rgba(87,122,130,.17),transparent 35%),
    linear-gradient(180deg,#202b2e 0%,#151d1f 72%,#101719 100%)
}

.character-stage {
  min-height:860px
}

.character-stage-empty,
.character-loading {
  min-height:860px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:40px;
  text-align:center
}

.character-stage-empty p,
.character-loading p {
  max-width:520px;
  color:var(--text-secondary)
}

.loading-rune {
  width:84px;
  height:84px;
  margin-bottom:25px;
  color:var(--brass-light);
  animation:pulseRune 1.6s ease-in-out infinite
}

.loading-rune svg {
  width:100%;
  height:100%
}

@keyframes pulseRune {
  50% {opacity:.45;transform:scale(.97)}
}

.character-stage-inner {
  --class-color:#a88b54;
  min-height:860px
}

.character-identity {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:25px;
  padding:26px 30px 22px;
  border-bottom:1px solid var(--border-light);
  background:linear-gradient(90deg,color-mix(in srgb,var(--class-color) 7%,transparent),transparent 55%)
}

.character-identity h2 {
  margin:5px 0 7px;
  font-size:clamp(1.8rem,2.8vw,2.7rem)
}

.character-identity p {
  margin:0;
  color:var(--text-secondary);
  font-size:.87rem
}

.character-level {
  min-width:74px;
  text-align:right
}

.character-level span {
  display:block;
  color:var(--text-secondary);
  font-size:.58rem;
  letter-spacing:.14em
}

.character-level strong {
  color:#f1ddaa;
  font:500 2.35rem/1 Cinzel,Georgia,serif
}

.paperdoll {
  display:grid;
  grid-template-columns:minmax(155px,210px) minmax(260px,1fr) minmax(155px,210px);
  grid-template-areas:
    "left render right"
    "weapons weapons weapons";
  gap:12px;
  padding:18px 18px 8px
}

.equipment-left {grid-area:left}
.equipment-right {grid-area:right}

.equipment-column {
  display:flex;
  flex-direction:column;
  gap:7px;
  padding-top:7px
}

.gear-slot {
  min-height:56px;
  display:grid;
  grid-template-columns:44px 1fr;
  align-items:center;
  gap:8px;
  padding:6px 8px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  border-radius:4px;
  background:rgba(9,14,15,.56)
}

.gear-slot:not(.gear-empty) {
  border-color:rgba(194,168,107,.17);
  cursor:help;
  transition:border-color .14s,background .14s,transform .14s
}

.gear-slot:not(.gear-empty):hover,
.gear-slot:not(.gear-empty):focus-visible {
  z-index:5;
  border-color:rgba(218,190,121,.58);
  background:rgba(24,31,31,.95);
  transform:translateY(-1px);
  outline:none
}

.gear-icon {
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid #495356;
  border-radius:3px;
  background:#11191b;
  color:#798581
}

.gear-icon img {
  width:100%;
  height:100%;
  object-fit:cover
}

.gear-icon small {
  font-size:.58rem;
  font-weight:700
}

.gear-copy {
  min-width:0
}

.gear-copy small,
.gear-copy strong {
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}

.gear-copy small {
  color:#83908c;
  font-size:.56rem;
  text-transform:uppercase;
  letter-spacing:.04em
}

.gear-copy strong {
  margin-top:3px;
  color:#d8d8d2;
  font-size:.66rem;
  font-weight:600
}

.gear-empty {
  opacity:.56
}

.character-render-frame {
  grid-area:render;
  position:relative;
  min-height:610px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:hidden;
  border:1px solid rgba(168,139,84,.22);
  border-radius:6px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.025),transparent 45%),
    radial-gradient(ellipse at center bottom,color-mix(in srgb,var(--class-color) 9%,transparent),transparent 58%)
}

.character-render-frame:before {
  content:"";
  position:absolute;
  inset:11px;
  pointer-events:none;
  border:1px solid rgba(168,139,84,.13);
  border-radius:4px
}

.render-halo {
  position:absolute;
  left:50%;
  bottom:65px;
  width:76%;
  height:62%;
  transform:translateX(-50%);
  border-radius:50%;
  background:radial-gradient(ellipse,color-mix(in srgb,var(--class-color) 13%,transparent),transparent 67%);
  filter:blur(10px)
}

.character-render-image {
  position:absolute;
  z-index:2;
  left:50%;
  bottom:38px;
  width:108%;
  height:108%;
  max-width:none;
  max-height:none;
  object-fit:contain;
  object-position:center bottom;
  transform:translateX(-50%);
  transform-origin:center bottom;
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.5));
  pointer-events:none
}

.character-render-image.character-render-standard {
  transform:translateX(-50%) scale(1.18)
}

.character-render-image.character-render-raw {
  transform:translateX(-50%) scale(2.15)
}

.character-render-image.character-render-crop {
  transform:translateX(-50%) scale(1.28)
}

.character-render-placeholder {
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
  color:var(--brass-light)
}

.character-render-placeholder svg {
  width:90px;
  height:90px
}

.character-render-placeholder span {
  color:var(--text-secondary);
  font-size:.78rem
}

.character-render-caption {
  position:absolute;
  z-index:4;
  left:18px;
  right:18px;
  bottom:16px;
  padding:12px 15px;
  border:1px solid rgba(168,139,84,.23);
  background:rgba(10,15,16,.75);
  backdrop-filter:blur(8px);
  text-align:center
}

.character-render-caption strong,
.character-render-caption span {
  display:block
}

.character-render-caption strong {
  font:500 1.15rem Cinzel,Georgia,serif
}

.character-render-caption span {
  margin-top:3px;
  color:var(--text-secondary);
  font-size:.67rem
}

.weapon-row {
  grid-area:weapons;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  max-width:620px;
  width:100%;
  margin:0 auto
}

.weapon-slot {
  min-height:62px
}

.character-quick-stats {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin:12px 18px 18px;
  border:1px solid var(--border-light)
}

.character-quick-stats>div {
  padding:14px 16px;
  border-right:1px solid var(--border-light);
  background:rgba(11,16,18,.5)
}

.character-quick-stats>div:last-child {
  border-right:0
}

.character-quick-stats span,
.character-quick-stats strong {
  display:block
}

.character-quick-stats span {
  color:#83908c;
  font-size:.58rem;
  letter-spacing:.08em;
  text-transform:uppercase
}

.character-quick-stats strong {
  margin-top:3px;
  color:#f0d89f;
  font:500 1.18rem Cinzel,Georgia,serif
}

.character-data-panel {
  overflow:auto
}

.character-data-shell {
  min-height:620px
}

.character-data-head {
  padding:22px 22px 18px;
  border-bottom:1px solid var(--border-light)
}

.character-data-head p {
  margin:6px 0 0;
  color:var(--text-secondary);
  font-size:.73rem
}

.data-empty {
  padding:28px 24px
}

.data-empty h2 {
  margin:7px 0 12px;
  font-size:1.55rem
}

.data-empty p {
  color:var(--text-secondary);
  font-size:.84rem
}

.character-tabs {
  display:flex;
  gap:0;
  overflow:auto;
  border-bottom:1px solid var(--border-light);
  background:#182124
}

.character-tabs button {
  appearance:none;
  flex:0 0 auto;
  padding:11px 13px;
  border:0;
  border-bottom:2px solid transparent;
  background:transparent;
  color:#8f9b98;
  cursor:pointer;
  font-size:.68rem
}

.character-tabs button:hover {
  color:#e0ded6
}

.character-tabs button.active {
  border-bottom-color:var(--brass-light);
  color:#f0d89f
}

.character-tab-panel {
  display:none;
  padding:18px
}

.character-tab-panel.active {
  display:block
}

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

.fact {
  min-height:66px;
  padding:11px 12px;
  border:1px solid var(--border-light);
  border-radius:4px;
  background:#192225
}

.fact span,
.fact strong {
  display:block
}

.fact span {
  color:#7f8d89;
  font-size:.57rem;
  letter-spacing:.05em;
  text-transform:uppercase
}

.fact strong {
  margin-top:4px;
  overflow-wrap:anywhere;
  color:#e4dfd3;
  font-size:.78rem
}

.api-availability {
  margin-top:22px
}

.api-availability h3,
.data-group h3 {
  margin:0 0 10px;
  color:#d9cfb3;
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.08em
}

.api-availability>div {
  display:flex;
  flex-wrap:wrap;
  gap:6px
}

.endpoint-pill {
  padding:5px 7px;
  border:1px solid var(--border-dark);
  border-radius:999px;
  color:#7e8a87;
  font-size:.62rem
}

.endpoint-pill.available {
  border-color:rgba(99,195,124,.2);
  color:#a8c7b0
}

.detail-list {
  display:flex;
  flex-direction:column;
  gap:7px
}

.detail-row {
  display:grid;
  grid-template-columns:42px 1fr;
  gap:10px;
  align-items:center;
  padding:8px;
  border:1px solid var(--border-light);
  border-radius:4px;
  background:#192225;
  cursor:help;
  transition:border-color .14s,background .14s
}

.detail-row:hover,
.detail-row:focus-visible {
  border-color:rgba(218,190,121,.42);
  background:#1c2729;
  outline:none
}

.detail-icon {
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid #485255;
  border-radius:3px;
  background:#111719;
  color:#8a9692;
  font-size:.6rem
}

.detail-icon img {
  width:100%;
  height:100%;
  object-fit:cover
}

.detail-row small,
.detail-row strong,
.detail-row div>span {
  display:block
}

.detail-row small {
  color:#7e8b87;
  font-size:.57rem
}

.detail-row strong {
  margin-top:2px;
  color:#e0ddd4;
  font-size:.72rem
}

.detail-row div>span {
  margin-top:2px;
  color:var(--brass-light);
  font-size:.58rem
}

.profession-card {
  margin-bottom:8px;
  padding:11px 12px;
  border:1px solid var(--border-light);
  border-radius:4px;
  background:#192225
}

.profession-card strong {
  color:#e1ddd2;
  font-size:.78rem
}

.profession-card ul {
  margin:8px 0 0;
  padding-left:18px;
  color:#95a19d;
  font-size:.68rem
}

.profession-card>span {
  display:block;
  margin-top:5px;
  color:#899591;
  font-size:.65rem
}

.reputation-list {
  display:flex;
  flex-direction:column;
  gap:6px
}

.reputation-list article {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 11px;
  border:1px solid var(--border-light);
  border-radius:4px;
  background:#192225
}

.reputation-list strong,
.reputation-list span {
  display:block
}

.reputation-list strong {
  font-size:.7rem
}

.reputation-list span {
  margin-top:2px;
  color:#7f8c88;
  font-size:.58rem
}

.reputation-list b {
  color:#d8c695;
  font-size:.62rem;
  white-space:nowrap
}

.achievement-summary {
  display:flex;
  align-items:end;
  justify-content:space-between;
  padding:14px;
  margin-bottom:12px;
  border:1px solid rgba(168,139,84,.25);
  background:rgba(168,139,84,.07)
}

.achievement-summary span {
  color:#9aa5a1;
  font-size:.65rem
}

.achievement-summary strong {
  color:#f1da9f;
  font:500 1.8rem Cinzel,Georgia,serif
}

.achievement-list {
  display:flex;
  flex-direction:column;
  gap:5px
}

.achievement-list article {
  padding:9px 10px;
  border-bottom:1px solid var(--border-light)
}

.achievement-list strong,
.achievement-list span {
  display:block
}

.achievement-list strong {
  font-size:.7rem
}

.achievement-list span {
  margin-top:3px;
  color:#7e8a87;
  font-size:.58rem
}

.generic-facts {
  display:flex;
  flex-direction:column
}

.generic-facts>div {
  display:grid;
  grid-template-columns:minmax(115px,.8fr) 1.2fr;
  gap:10px;
  padding:8px 3px;
  border-bottom:1px solid var(--border-light)
}

.generic-facts span {
  color:#82908c;
  font-size:.6rem
}

.generic-facts strong {
  overflow-wrap:anywhere;
  color:#d9d6cd;
  font-size:.65rem;
  font-weight:500
}

.data-note {
  color:var(--text-secondary);
  font-size:.75rem
}

.raw-api-list {
  display:flex;
  flex-direction:column;
  gap:7px
}

.raw-api-list details {
  border:1px solid var(--border-light);
  border-radius:4px;
  background:#151e20
}

.raw-api-list summary {
  display:flex;
  justify-content:space-between;
  gap:15px;
  padding:10px 12px;
  cursor:pointer;
  color:#ddd8cd;
  font-size:.7rem
}

.raw-api-list summary span {
  color:#778581;
  font-size:.6rem
}

.raw-api-list pre {
  max-height:390px;
  overflow:auto;
  margin:0;
  padding:12px;
  border-top:1px solid var(--border-light);
  background:#0f1517;
  color:#b8c0bd;
  font:400 .61rem/1.55 Consolas,"Courier New",monospace;
  white-space:pre-wrap;
  overflow-wrap:anywhere
}

.raw-api-list details>p {
  margin:0;
  padding:12px;
  color:#7e8b87;
  font-size:.65rem
}

@media(max-width:1450px) {
  .guild-character-hub {
    grid-template-columns:250px minmax(520px,1fr) 330px
  }

  .paperdoll {
    grid-template-columns:155px minmax(240px,1fr) 155px
  }

  .gear-copy strong {
    font-size:.6rem
  }
}

@media(max-width:1180px) {
  .guild-character-hub {
    grid-template-columns:240px 1fr;
    grid-template-areas:
      "roster viewer"
      "roster data"
  }

  .guild-roster-panel {grid-area:roster}
  .character-viewer {grid-area:viewer}
  .character-data-panel {grid-area:data}

  .character-data-panel {
    position:static;
    max-height:none
  }

  .paperdoll {
    grid-template-columns:150px minmax(230px,1fr) 150px
  }
}

@media(max-width:900px) {
  .guild-live-summary {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .guild-live-stat:nth-child(2) {
    border-right:0
  }

  .guild-live-stat:nth-child(-n+2) {
    border-bottom:1px solid rgba(168,139,84,.22)
  }

  .guild-character-hub {
    grid-template-columns:1fr;
    grid-template-areas:
      "roster"
      "viewer"
      "data"
  }

  .guild-roster-panel {
    position:static;
    max-height:none
  }

  .guild-roster-list {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    max-height:420px
  }
}

@media(max-width:700px) {
  .guild-hub-wrap {
    width:min(100% - 28px,1680px)
  }

  .guild-live-summary {
    grid-template-columns:1fr 1fr
  }

  .guild-live-stat {
    padding:17px
  }

  .guild-roster-list {
    grid-template-columns:1fr
  }

  .character-viewer,
  .character-stage,
  .character-stage-empty,
  .character-loading,
  .character-stage-inner {
    min-height:auto
  }

  .character-identity {
    padding:21px
  }

  .paperdoll {
    display:flex;
    flex-direction:column;
    padding:14px
  }

  .character-render-frame {
    order:-1;
    min-height:520px
  }

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

  .gear-slot {
    min-height:58px
  }

  .weapon-row {
    max-width:none
  }

  .character-quick-stats {
    margin:10px 14px 14px
  }
}

@media(max-width:520px) {
  .guild-live-summary {
    grid-template-columns:1fr
  }

  .guild-live-stat {
    border-right:0;
    border-bottom:1px solid rgba(168,139,84,.22)
  }

  .guild-live-stat:last-child {
    border-bottom:0
  }

  .panel-heading {
    padding:18px 16px
  }

  .character-identity h2 {
    font-size:1.65rem
  }

  .character-level strong {
    font-size:1.8rem
  }

  .character-render-frame {
    min-height:440px
  }

  .equipment-column,
  .weapon-row {
    grid-template-columns:1fr
  }

  .character-quick-stats {
    grid-template-columns:1fr
  }

  .character-quick-stats>div {
    border-right:0;
    border-bottom:1px solid var(--border-light)
  }

  .character-quick-stats>div:last-child {
    border-bottom:0
  }

  .fact-grid {
    grid-template-columns:1fr
  }
}


/* ==========================================================
   ITEM TOOLTIPS – V3.1
   ========================================================== */

.wow-item-tooltip {
  position:fixed;
  z-index:9999;
  box-sizing:border-box;
  padding:12px 14px 13px;
  border:1px solid rgba(215,187,117,.42);
  border-radius:5px;
  background:linear-gradient(180deg,rgba(11,16,18,.985),rgba(7,11,12,.985));
  box-shadow:0 18px 48px rgba(0,0,0,.62),0 0 0 1px rgba(0,0,0,.78) inset;
  color:#dedbd2;
  pointer-events:none;
  font-size:.72rem;
  line-height:1.42
}

.wow-item-tooltip[hidden] {display:none}

.item-tooltip-head {
  display:grid;
  grid-template-columns:46px 1fr;
  gap:10px;
  align-items:center;
  padding-bottom:9px;
  margin-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.08)
}

.item-tooltip-head img {
  width:46px;
  height:46px;
  border:1px solid #4c5557;
  border-radius:3px;
  object-fit:cover
}

.item-tooltip-head strong,
.item-tooltip-head span {
  display:block
}

.item-tooltip-head strong {
  color:#f0f0f0;
  font-size:.82rem;
  line-height:1.25
}

.item-tooltip-head span {
  margin-top:3px;
  color:#e6cb86;
  font-size:.65rem
}

.wow-item-tooltip[data-quality="uncommon"] .item-tooltip-head strong {color:#1eff00}
.wow-item-tooltip[data-quality="rare"] .item-tooltip-head strong {color:#4f94ff}
.wow-item-tooltip[data-quality="epic"] .item-tooltip-head strong {color:#b56cff}
.wow-item-tooltip[data-quality="legendary"] .item-tooltip-head strong {color:#ff9d00}
.wow-item-tooltip[data-quality="artifact"] .item-tooltip-head strong {color:#e6cc80}
.wow-item-tooltip[data-quality="heirloom"] .item-tooltip-head strong {color:#00ccff}
.wow-item-tooltip[data-quality="poor"] .item-tooltip-head strong {color:#9d9d9d}

.item-tooltip-body p {
  margin:3px 0
}

.item-type-line {
  color:#c9c7bf
}

.item-green-lines,
.item-enchant-lines,
.item-socket-lines,
.item-spell-lines {
  margin-top:7px
}

.item-green-lines p,
.item-enchant-lines p,
.item-spell-lines p {
  color:#62c86e
}

.item-socket-lines p {
  color:#9fc9d8
}

.item-requirement {
  margin-top:8px!important;
  color:#d6b879
}

.item-muted {
  color:#8d9995
}

.item-flavor {
  margin-top:8px!important;
  color:#d0bd8d;
  font-style:italic
}

.item-id {
  margin-top:8px!important;
  color:#687572;
  font-size:.58rem
}

@media(max-width:700px) {
  .character-render-image.character-render-raw {
    transform:translateX(-50%) scale(1.75)
  }

  .wow-item-tooltip {
    max-width:calc(100vw - 24px)
  }
}

/* V4.2 – lebende Chronik */
.live-chronicle{display:grid;gap:42px}.chronicle-entry{padding:0 0 42px;border-bottom:1px solid rgba(197,164,105,.28)}.chronicle-entry:last-child{border-bottom:0}.chronicle-entry-meta{display:flex;gap:18px;flex-wrap:wrap;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted,#7a746d);margin-bottom:12px}.chronicle-entry h2{font-family:var(--serif,serif);font-size:clamp(1.8rem,4vw,3rem);margin:0 0 18px}.chronicle-entry-body{font-size:1.06rem;line-height:1.8}.chronicle-entry-body p{margin:0 0 1.1em}.chronicle-loading,.chronicle-empty{padding:32px 0;color:var(--muted,#7a746d)}.chronicle-empty h2{color:inherit}.chronicle-empty.compact{padding:18px 0}.home-chronicle-card{padding:26px 0;border-top:1px solid rgba(197,164,105,.28);border-bottom:1px solid rgba(197,164,105,.28)}.home-chronicle-card>span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted,#7a746d)}.home-chronicle-card h3{font-family:var(--serif,serif);font-size:1.65rem;margin:.55rem 0}.home-chronicle-card p{line-height:1.65;margin:0 0 1rem}



/* V4.3.1 – deutlich sichtbarer, wandernder Nebel */
.hero{isolation:isolate}
.hero:before{z-index:0}
.hero .hero-content,.hero .hero-caption{z-index:4}

.hero .fog{
  position:absolute;
  pointer-events:none;
  z-index:2;
  left:-55%;
  width:210%;
  height:58%;
  opacity:.58;
  filter:blur(24px);
  mix-blend-mode:screen;
  will-change:transform,opacity;
  background:
    radial-gradient(ellipse at 8% 52%,rgba(224,233,229,.28) 0 8%,rgba(208,220,215,.15) 22%,transparent 48%),
    radial-gradient(ellipse at 28% 66%,rgba(231,237,233,.23) 0 10%,rgba(206,218,214,.12) 26%,transparent 51%),
    radial-gradient(ellipse at 51% 42%,rgba(218,229,224,.26) 0 9%,rgba(207,219,215,.13) 24%,transparent 49%),
    radial-gradient(ellipse at 73% 62%,rgba(232,238,235,.22) 0 8%,rgba(210,221,217,.12) 25%,transparent 50%),
    radial-gradient(ellipse at 94% 46%,rgba(219,229,225,.25) 0 8%,rgba(204,216,212,.12) 24%,transparent 49%);
}
.hero .fog-one{
  bottom:-6%;
  animation:nebelmark-fog-east 24s linear infinite,nebelmark-fog-breathe 9s ease-in-out infinite alternate;
}
.hero .fog-two{
  bottom:22%;
  opacity:.37;
  filter:blur(34px);
  transform:scaleY(.82);
  animation:nebelmark-fog-west 37s linear infinite,nebelmark-fog-breathe 13s ease-in-out infinite alternate-reverse;
}
.hero .fog-three{
  bottom:45%;
  opacity:.22;
  filter:blur(42px);
  transform:scaleY(.64);
  animation:nebelmark-fog-east-slow 52s linear infinite,nebelmark-fog-breathe 17s ease-in-out infinite alternate;
}

.page-hero{isolation:isolate;overflow:hidden}
.page-hero:before{z-index:0}
.page-hero>.wrap{position:relative;z-index:3}
.page-fog{
  z-index:2;
  left:-55%;
  width:210%;
  height:72%;
  opacity:.48;
  filter:blur(26px);
  mix-blend-mode:screen;
  background:
    radial-gradient(ellipse at 12% 54%,rgba(226,234,230,.24),transparent 36%),
    radial-gradient(ellipse at 42% 44%,rgba(212,224,219,.19),transparent 39%),
    radial-gradient(ellipse at 70% 61%,rgba(230,237,233,.21),transparent 36%),
    radial-gradient(ellipse at 93% 48%,rgba(213,224,220,.18),transparent 37%);
}
.page-fog-one{bottom:-18%;animation:nebelmark-fog-east 28s linear infinite,nebelmark-fog-breathe 11s ease-in-out infinite alternate}
.page-fog-two{bottom:29%;opacity:.25;filter:blur(38px);animation:nebelmark-fog-west 43s linear infinite,nebelmark-fog-breathe 15s ease-in-out infinite alternate-reverse}

@keyframes nebelmark-fog-east{
  0%{transform:translate3d(-14%,0,0) scale(1.02)}
  50%{transform:translate3d(2%,-2%,0) scale(1.08)}
  100%{transform:translate3d(18%,1%,0) scale(1.03)}
}
@keyframes nebelmark-fog-east-slow{
  0%{transform:translate3d(-9%,1%,0) scale(1.03,.68)}
  100%{transform:translate3d(14%,-2%,0) scale(1.1,.72)}
}
@keyframes nebelmark-fog-west{
  0%{transform:translate3d(14%,1%,0) scale(1.03,.84)}
  100%{transform:translate3d(-13%,-2%,0) scale(1.1,.88)}
}
@keyframes nebelmark-fog-breathe{
  from{opacity:.24}
  to{opacity:.66}
}


@media (prefers-reduced-motion: reduce){
  .fog,.page-fog{animation:none!important;transform:none!important}
}

/* ============================================================
   V5.0 · Living Fog Canvas
   Die Startseite bewegt den Nebel per Canvas und berücksichtigt
   die Systemeinstellung für reduzierte Bewegung.
   ============================================================ */
.hero,.page-hero{position:relative;overflow:hidden}
.fog-canvas{position:absolute;inset:0;z-index:2;width:100%;height:100%;pointer-events:none;opacity:1;mix-blend-mode:screen}
.hero .hero-content,.hero .hero-caption{position:relative;z-index:4}
.page-hero>.wrap{position:relative;z-index:4}

/* V5.0 · Öffentlicher Gildenkalender */
.event-public-section{padding-bottom:72px}.public-calendar-head{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:26px}.public-calendar-head h2{margin:.3rem 0 0}.public-calendar-nav{display:flex;gap:8px}.public-calendar-nav button{appearance:none;border:1px solid rgba(197,164,105,.38);background:transparent;color:inherit;padding:9px 13px;cursor:pointer;font:inherit}.public-calendar-nav button:hover{background:rgba(197,164,105,.1)}
.public-event-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-top:1px solid rgba(197,164,105,.24);border-left:1px solid rgba(197,164,105,.24)}.public-weekday{padding:11px 8px;text-align:center;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border-right:1px solid rgba(197,164,105,.24);border-bottom:1px solid rgba(197,164,105,.24)}.public-calendar-day{min-height:132px;padding:10px;border-right:1px solid rgba(197,164,105,.24);border-bottom:1px solid rgba(197,164,105,.24);background:rgba(255,255,255,.012)}.public-calendar-day.outside{opacity:.34}.public-calendar-day.today{box-shadow:inset 0 0 0 1px rgba(197,164,105,.72)}.public-day-number{font-size:.78rem;color:var(--muted);margin-bottom:8px}.public-calendar-day.today .public-day-number{color:var(--brass);font-weight:700}.public-day-events{display:grid;gap:6px}.public-calendar-event{padding:7px 8px;border-left:2px solid var(--brass);background:rgba(197,164,105,.08);min-width:0}.public-calendar-event small{display:block;font-size:.61rem;color:var(--muted);margin-bottom:2px}.public-calendar-event strong{display:block;font-size:.74rem;line-height:1.25;overflow:hidden;text-overflow:ellipsis}.public-more{font-size:.64rem;color:var(--muted)}
.upcoming-events-section{padding-top:86px}.public-event-list{display:grid;gap:0}.public-event-card{display:grid;grid-template-columns:minmax(180px,.35fr) minmax(0,1fr);gap:34px;padding:30px 0;border-top:1px solid rgba(45,54,56,.17)}.public-event-card:last-child{border-bottom:1px solid rgba(45,54,56,.17)}.public-event-date{display:grid;align-content:start;gap:5px}.public-event-date span{font-size:.8rem;text-transform:capitalize;color:#5e6462}.public-event-date strong{font-family:var(--serif,serif);font-size:1.35rem}.public-event-copy h3{font-family:var(--serif,serif);font-size:clamp(1.45rem,3vw,2.2rem);margin:.2rem 0 .7rem}.public-event-copy>p:not(.eyebrow){max-width:780px;line-height:1.7}.public-event-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:.78rem;color:#666e6b;margin-top:12px}.calendar-loading{padding:28px 0;color:var(--muted)}
@media(max-width:820px){.public-event-calendar{overflow-x:auto;grid-template-columns:repeat(7,minmax(112px,1fr))}.public-calendar-head{align-items:flex-start;flex-direction:column}.public-calendar-day{min-height:105px}.public-event-card{grid-template-columns:1fr;gap:12px}}

/* V5.0 public bootstrap fallback */
.public-boot-fallback{min-height:100vh;display:grid;place-items:center;color:var(--text-secondary);letter-spacing:.08em;text-transform:uppercase;font-size:.8rem}

/* Startseite: das Bild, der Nebel und ein kurzer Einstieg. */
.home-page .site-header:not(.scrolled){background:linear-gradient(180deg,rgba(11,18,20,.88),rgba(11,18,20,0))}
.home-hero{min-height:max(720px,100svh);background-position:center 45%}
.home-hero:before{
  background:linear-gradient(90deg,rgba(9,16,18,.87) 0%,rgba(11,19,21,.65) 37%,rgba(12,21,23,.10) 100%),
    linear-gradient(0deg,#161d1f 0%,transparent 23%)
}
.home-hero .hero-content{padding-top:130px;padding-bottom:145px}
.home-hero h1{font-size:clamp(4.4rem,8.7vw,8.5rem);margin-bottom:25px}
.home-hero .hero-rule{margin-bottom:27px}
.home-hero .hero-content > .home-hero-lead{
  max-width:620px;
  color:#f0eee7;
  font:500 clamp(1.27rem,2.1vw,1.82rem)/1.45 Inter,Arial,sans-serif;
  margin:0 0 12px;
  text-shadow:0 2px 18px rgba(0,0,0,.45)
}
.home-hero .hero-content > .home-hero-copy{
  max-width:520px;
  color:#c5d1ce;
  font-size:1rem;
  line-height:1.7;
  margin:0
}
.home-hero-actions{display:flex;align-items:center;gap:30px;flex-wrap:wrap;margin-top:36px}
.home-hero-actions a{display:inline-flex;align-items:center;gap:16px;font-size:.88rem;font-weight:600}
.home-main-link{color:#f2e9d5;padding:11px 0;border-bottom:1px solid var(--brass-light)}
.home-text-link{color:#d7dfdd;padding:11px 0}
.home-hero-actions a span{transition:transform .2s}
.home-hero-actions a:hover span{transform:translate(3px,-3px)}
.home-start-date{
  position:absolute;
  z-index:4;
  left:max(32px,calc((100vw - 1160px)/2));
  bottom:23px;
  display:flex;
  gap:12px;
  align-items:center;
  margin:0;
  color:#aebeba;
  font-size:.72rem;
  letter-spacing:.11em;
  text-transform:uppercase
}
.home-start-date:before{content:"";width:29px;height:1px;background:var(--brass)}
.home-start-date strong{color:#e8e1d2;font-weight:600}
.home-hero .fog-canvas{z-index:2;opacity:.95}
@media(max-width:760px){
  .home-hero{min-height:max(680px,100svh);background-position:58% center}
  .home-hero:before{background:linear-gradient(90deg,rgba(9,16,18,.86),rgba(9,16,18,.42)),linear-gradient(0deg,#161d1f,transparent 40%)}
  .home-hero .hero-content{padding-top:120px;padding-bottom:120px}
  .home-hero h1{font-size:clamp(2.4rem,10vw,6rem);letter-spacing:.025em}
  .home-start-date{left:18px;right:18px;bottom:18px;flex-wrap:wrap;gap:7px;font-size:.65rem}
}
@media(max-width:380px){
  .home-hero-actions{gap:8px 23px}
  .home-start-date strong{width:100%;padding-left:36px}
}
@media(prefers-reduced-motion:reduce){.home-hero-actions a span{transition:none}}

/* Datenschutz: gleichwertige Auswahl, ohne Vorauswahl optionaler Dienste. */
.footer-privacy{display:block;border:0;padding:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;line-height:1.7;margin:0 0 8px;text-decoration:underline;text-underline-offset:4px}
.privacy-media-notice{display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid var(--line,#41504e);padding:22px;margin-bottom:24px;background:#1a2529}
.privacy-media-notice p{max-width:70ch;margin:8px 0;color:#c2ceca}
.privacy-media-notice .button{flex-shrink:0}
.privacy-dialog{width:min(680px,calc(100% - 32px));max-height:calc(100dvh - 32px);overflow:auto;border:1px solid #697f76;background:#192327;color:#e8e1d2;padding:28px;box-shadow:0 24px 100px #0008}
.privacy-dialog::backdrop{background:#071011ce}
.privacy-dialog form{margin:0}
.privacy-dialog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.privacy-dialog h2{margin:0 0 20px;font-size:1.5rem}
.privacy-dialog p{line-height:1.65;color:#c2ceca}
.privacy-dialog a{color:#e4c58c;text-decoration:underline}
.privacy-close{border:1px solid #697f76;background:transparent;color:inherit;min-width:44px;min-height:44px;font-size:1.6rem;cursor:pointer}
.privacy-option{display:block;border:1px solid #465954;padding:18px;margin:18px 0}
.privacy-option p{margin-bottom:0}
.privacy-choice{display:flex;align-items:flex-start;gap:14px;cursor:pointer}
.privacy-choice input{width:22px;height:22px;flex-shrink:0;accent-color:#bbaa81;margin-top:2px}
.privacy-choice span span{display:block;line-height:1.6;color:#c2ceca;margin-top:9px}
.privacy-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.privacy-actions .button{flex:1;white-space:normal;text-align:center;justify-content:center}
.privacy-actions .button,.privacy-media-notice .button{background:#24343a;color:#f0eadf;border:1px solid #80948a;cursor:pointer;font:inherit}
.privacy-actions .button:hover,.privacy-media-notice .button:hover{background:#344a50;color:#fff}
.legal-settings-button .button{background:#24343a;color:#f0eadf;border:1px solid #80948a;cursor:pointer;font:inherit;white-space:normal;text-align:center}
.privacy-dialog :focus-visible,.footer-privacy:focus-visible{outline:2px solid #e4c58c;outline-offset:4px}
.character-render-image.privacy-media-blocked{object-fit:contain;max-height:230px;align-self:center;opacity:.5}
.legal-address{font-style:normal;line-height:1.8}
.legal-toc{display:flex;gap:12px 20px;flex-wrap:wrap;margin:24px 0}
.legal-table{width:100%;border-collapse:collapse;font-size:.9rem}
.legal-table th,.legal-table td{text-align:left;vertical-align:top;border-bottom:1px solid #465954;padding:12px 8px;overflow-wrap:anywhere}
@media(max-width:760px){.privacy-media-notice{align-items:stretch;flex-direction:column;gap:12px}.privacy-dialog{padding:20px}.privacy-actions{flex-direction:column}.legal-table{font-size:.8rem}}