.armory-page {
  background:
    radial-gradient(circle at 50% 16%, rgba(214,174,88,.10), transparent 34rem),
    repeating-linear-gradient(90deg, transparent 0 79px, rgba(255,255,255,.012) 80px),
    #090c0c;
}

.armory-workspace {
  width: min(94vw, 1320px);
  min-height: 82vh;
  margin: 0 auto;
  padding: 118px 0 90px;
}

.armory-search-panel {
  position: relative;
  z-index: 5;
  max-width: 940px;
  margin: 0 auto;
  border: 1px solid var(--line-gold);
  border-top: 3px solid var(--gold);
  background: linear-gradient(145deg, rgba(19,24,22,.98), rgba(8,11,10,.98));
  box-shadow: 0 28px 90px rgba(0,0,0,.48), inset 0 0 70px rgba(214,174,88,.025);
  padding: clamp(28px,5vw,58px);
  animation: armory-rise 600ms cubic-bezier(.2,.75,.2,1) both;
}

.armory-search-panel::before,
.armory-search-panel::after {
  content: "";
  position: absolute;
  top: 15px;
  width: 76px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold));
}
.armory-search-panel::before { left: 18px; }
.armory-search-panel::after { right: 18px; transform: scaleX(-1); }

.armory-heading-row,
.character-banner {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
}

.armory-heading-row h1,
.character-banner h2 {
  margin: 0;
  color: #f3eee3;
  font: 650 clamp(42px,6vw,76px)/.96 var(--display);
}

.armory-intro {
  max-width: 670px;
  margin: 20px 0 28px;
  color: var(--paper-dim);
}

.snapshot-seal {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 8px;
  color: #969d98;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  white-space: nowrap;
}
.snapshot-seal span { width: 7px; height: 7px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 13px rgba(240,209,132,.6); }

.armory-search { display: grid; grid-template-columns: 1fr auto; border: 1px solid var(--line-gold); background: #070909; }
.armory-search input { min-width: 0; height: 58px; border: 0; outline: 0; background: transparent; color: var(--paper); padding: 0 20px; }
.armory-search input:focus { box-shadow: inset 0 0 0 1px var(--gold-bright); }
.armory-search button { border: 0; border-left: 1px solid var(--line-gold); background: var(--gold); color: var(--ink); padding: 0 24px; cursor: pointer; font-size: 11px; font-weight: 900; text-transform: uppercase; transition: filter 160ms ease, background 160ms ease; }
.armory-search button:hover,.armory-search button:focus-visible { background: var(--gold-bright); filter: brightness(1.05); }

.armory-status { min-height: 24px; margin: 14px 0 0; color: #7f8782; font-size: 12px; }
.armory-status.is-error { color: var(--error); }
.armory-results { position: absolute; right: clamp(28px,5vw,58px); left: clamp(28px,5vw,58px); z-index: 30; border: 1px solid var(--line-gold); border-top: 0; background: #0b0f0e; box-shadow: 0 22px 46px rgba(0,0,0,.55); }
.armory-result { width: 100%; display: grid; grid-template-columns: 1fr auto; gap: 16px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--paper); padding: 13px 18px; text-align: left; cursor: pointer; }
.armory-result:last-child { border-bottom: 0; }
.armory-result:hover,.armory-result:focus-visible { background: rgba(214,174,88,.1); outline: 0; }
.armory-result.is-pending { border-left: 2px solid rgba(214,174,88,.42); }
.armory-result.is-pending strong { color: #b8b3a8; }
.armory-result strong { font-family: var(--display); font-size: 17px; }
.armory-result span { color: #8d948f; font-size: 11px; }

.character-record { margin-top: 34px; border: 1px solid var(--line); background: rgba(12,16,15,.96); box-shadow: 0 36px 110px rgba(0,0,0,.38); animation: armory-rise 480ms cubic-bezier(.2,.75,.2,1) both; }
.character-banner { position: relative; justify-content: flex-start; align-items: center; border-bottom: 1px solid var(--line-gold); padding: 30px clamp(24px,4vw,48px); overflow: hidden; }
.character-banner::after { content:""; position:absolute; right:-5%; bottom:-44px; width:42%; height:90px; border:1px solid rgba(214,174,88,.14); transform:skewX(-28deg); }
.class-sigil { width: 76px; height: 76px; flex: 0 0 auto; display:grid; place-items:center; border: 1px solid var(--line-gold); border-radius: 50%; background: radial-gradient(circle, rgba(214,174,88,.16), rgba(5,7,7,.9) 68%); color:var(--gold-bright); font:700 30px/1 var(--display); box-shadow:0 0 0 7px rgba(214,174,88,.035), 0 0 28px rgba(214,174,88,.12); }
.character-banner h2 { font-size: clamp(38px,5vw,62px); }
.character-banner p { margin: 5px 0 0; color: #9ca39f; }
.record-stamp { margin-left: auto; position: relative; z-index:1; text-align:right; }
.record-stamp span { display:block; color:#737b76; font-size:9px; font-weight:800; text-transform:uppercase; }
.record-stamp strong { color:var(--gold-bright); font:600 16px/1.3 var(--display); }

.armory-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr); }
.equipment-vault,.character-ledger { padding: clamp(26px,4vw,48px); }
.character-ledger { border-left:1px solid var(--line); }
.section-heading { display:flex; align-items:end; justify-content:space-between; gap:16px; margin-bottom:24px; }
.section-heading .eyebrow { margin:0; }
.section-heading h3 { margin:0; color:var(--paper); font:600 clamp(25px,3vw,36px)/1 var(--display); }

.equipment-board { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; position:relative; }
.equipment-board::before { content:"GH"; position:absolute; inset:11% 34%; display:grid; place-items:center; border:1px solid rgba(214,174,88,.14); border-radius:50%; color:rgba(214,174,88,.1); font:700 55px/1 var(--display); pointer-events:none; }
.gear-slot { position:relative; min-height:76px; display:grid; grid-template-columns:46px 1fr; align-items:center; gap:11px; border:1px solid var(--line); background:rgba(4,7,6,.72); color:var(--paper); padding:9px; text-align:left; animation:slot-in 420ms cubic-bezier(.2,.75,.2,1) both; }
.gear-slot:nth-child(3n+2) { transform:translateY(10px); }
.gear-slot.is-empty { opacity:.38; }
.gear-slot:focus-visible,.gear-slot:hover { z-index:8; outline:1px solid var(--gold); background:#101513; }
.gear-gem { width:44px; height:44px; display:grid; place-items:center; border:2px solid #6e6e6e; background:radial-gradient(circle at 35% 30%,#242b28,#090b0a 68%); color:#aaa; font:800 10px/1 var(--sans); }
.quality-2 .gear-gem { border-color:#43a047; color:#8ed291; }
.quality-3 .gear-gem { border-color:#3878d8; color:#83aef1; }
.quality-4 .gear-gem { border-color:#8a4ed1; color:#c29bf1; }
.quality-5 .gear-gem { border-color:#d8892f; color:#f2b66d; }
.gear-copy { min-width:0; }
.gear-copy strong,.gear-copy span { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gear-copy strong { font:600 13px/1.25 var(--display); }
.gear-copy span { margin-top:4px; color:#777f7a; font-size:9px; text-transform:uppercase; }
.item-tooltip { display:none; position:absolute; z-index:50; left:18px; top:calc(100% + 7px); width:min(320px,75vw); border:1px solid rgba(214,174,88,.55); background:rgba(3,5,5,.985); box-shadow:0 18px 48px rgba(0,0,0,.72); padding:16px; color:#d7d4cc; font-size:12px; line-height:1.55; pointer-events:none; white-space:normal; }
.gear-slot:nth-child(3n) .item-tooltip { right:18px; left:auto; }
.gear-slot:hover .item-tooltip,.gear-slot:focus-visible .item-tooltip { display:block; animation:tooltip-in 150ms ease both; }
.tooltip-name { display:block; margin-bottom:5px; color:var(--paper); font:600 16px/1.2 var(--display); }
.quality-2 .tooltip-name { color:#55c75a; }.quality-3 .tooltip-name { color:#5d99f2; }.quality-4 .tooltip-name { color:#ac75ed; }.quality-5 .tooltip-name { color:#e9a14c; }
.tooltip-line { display:block; }.tooltip-muted { color:#7f8782; }.tooltip-gold { color:var(--gold-bright); }.tooltip-flavor { display:block; margin-top:8px; color:#c2a26b; font-style:italic; }
.tooltip-hint { margin:20px 0 0; color:#737b76; font-size:10px; }

.stat-grid { display:grid; grid-template-columns:1fr 1fr; margin:0; border-top:1px solid var(--line); }
.stat-grid div { padding:12px 10px 12px 0; border-bottom:1px solid var(--line); }
.stat-grid div:nth-child(even) { border-left:1px solid var(--line); padding-left:14px; }
.stat-grid dt { color:#747c77; font-size:9px; font-weight:800; text-transform:uppercase; }
.stat-grid dd { margin:2px 0 0; color:var(--paper); font:600 19px/1.2 var(--display); }
.profession-section { margin-top:42px; }
.armory-professions { display:grid; gap:9px; }
.profession-row { display:grid; grid-template-columns:1fr auto; gap:20px; border-left:2px solid var(--gold); background:rgba(214,174,88,.055); padding:12px 14px; }
.profession-row strong { font:600 15px/1.2 var(--display); }.profession-row span { color:var(--gold-bright); font-size:11px; font-weight:800; }
.profession-empty { color:#747c77; font-size:12px; }
.privacy-ribbon { border-top:1px solid var(--line); background:#080b0a; color:#737b76; padding:14px 28px; font-size:10px; text-align:center; }

@keyframes armory-rise { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
@keyframes slot-in { from { opacity:0; transform:translateY(8px); } to { opacity:1; } }
@keyframes tooltip-in { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:translateY(0); } }

@media (prefers-reduced-motion:reduce) { .armory-search-panel,.character-record,.gear-slot,.item-tooltip { animation:none !important; } }
@media (max-width:900px) { .armory-grid { grid-template-columns:1fr; }.character-ledger { border-left:0; border-top:1px solid var(--line); }.equipment-board { grid-template-columns:repeat(2,minmax(0,1fr)); }.gear-slot:nth-child(3n+2) { transform:none; }.gear-slot:nth-child(2n) .item-tooltip { right:10px; left:auto; } }
@media (max-width:650px) { .armory-workspace { width:100%; padding-top:90px; }.armory-search-panel,.character-record { border-right:0; border-left:0; }.armory-heading-row { align-items:flex-start; flex-direction:column; gap:8px; }.armory-search { grid-template-columns:1fr; }.armory-search button { min-height:48px; border-top:1px solid var(--line-gold); border-left:0; }.armory-results { right:0; left:0; }.character-banner { align-items:flex-start; flex-wrap:wrap; }.record-stamp { width:100%; margin-left:0; text-align:left; }.equipment-board { grid-template-columns:1fr; }.equipment-board::before { display:none; }.gear-slot { min-height:66px; }.item-tooltip,.gear-slot:nth-child(n) .item-tooltip { position:fixed; right:12px; bottom:12px; left:12px; top:auto; width:auto; }.stat-grid { grid-template-columns:1fr; }.stat-grid div:nth-child(even) { border-left:0; padding-left:0; } }

/* Character-paper-doll Armory */
.character-record { --class-color:#d6ae58; overflow:visible; border-color:rgba(214,174,88,.32); background:linear-gradient(145deg,#101514 0%,#080b0b 72%); }
.character-record[data-class="warrior"] { --class-color:#c79c6e; }
.character-record[data-class="paladin"] { --class-color:#f58cba; }
.character-record[data-class="hunter"] { --class-color:#abd473; }
.character-record[data-class="rogue"] { --class-color:#fff569; }
.character-record[data-class="priest"] { --class-color:#f1f1f1; }
.character-record[data-class="shaman"] { --class-color:#4f78ff; }
.character-record[data-class="mage"] { --class-color:#69ccf0; }
.character-record[data-class="warlock"] { --class-color:#9482c9; }
.character-record[data-class="druid"] { --class-color:#ff7d0a; }
.character-record .character-banner { border-top:3px solid var(--class-color); background:linear-gradient(90deg,rgba(255,255,255,.035),transparent 55%),#0c100f; }
.character-record .class-sigil { border-color:var(--class-color); color:var(--class-color); box-shadow:0 0 0 7px color-mix(in srgb,var(--class-color) 8%,transparent),0 0 30px color-mix(in srgb,var(--class-color) 22%,transparent); }

.armory-grid-v2 { grid-template-columns:minmax(0,2fr) minmax(320px,.72fr); }
.paperdoll-vault { position:relative; overflow:hidden; background:radial-gradient(ellipse at 50% 38%,rgba(214,174,88,.11),transparent 52%); }
.paperdoll-vault::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(214,174,88,.035) 1px,transparent 1px),linear-gradient(rgba(214,174,88,.025) 1px,transparent 1px); background-size:44px 44px; mask-image:linear-gradient(to bottom,black,transparent 80%); }
.paperdoll-heading { position:relative; z-index:2; align-items:flex-end; }
.paperdoll-heading > div .eyebrow { margin:0 0 7px; }
.paperdoll-heading > p { margin:0; color:#737d77; font-size:.75rem; text-transform:uppercase; letter-spacing:.08em; }

.paperdoll-grid { position:relative; z-index:2; display:grid; grid-template-columns:minmax(145px,190px) minmax(260px,1fr) minmax(145px,190px); gap:14px; align-items:stretch; min-height:560px; }
.slot-rail { display:grid; grid-template-rows:repeat(8,1fr); gap:8px; padding:8px 0; }
.gear-slot.paperdoll-slot { min-height:0; height:auto; grid-template-columns:46px minmax(0,1fr); border-color:rgba(214,174,88,.19); border-radius:3px; background:linear-gradient(100deg,rgba(3,6,5,.98),rgba(18,23,21,.94)); box-shadow:0 8px 24px rgba(0,0,0,.24); padding:7px; transform:none; transition:transform 160ms ease,border-color 160ms ease,box-shadow 160ms ease; }
.slot-rail-right .gear-slot { grid-template-columns:minmax(0,1fr) 46px; text-align:right; }
.slot-rail-right .gear-gem { grid-column:2; grid-row:1; }
.slot-rail-right .gear-copy { grid-column:1; grid-row:1; }
.gear-slot.paperdoll-slot:hover,.gear-slot.paperdoll-slot:focus-visible { transform:translateY(-2px) scale(1.015); border-color:var(--class-color); box-shadow:0 10px 30px color-mix(in srgb,var(--class-color) 12%,rgba(0,0,0,.5)); }
.gear-slot.paperdoll-slot .gear-gem { position:relative; overflow:hidden; border-radius:4px; background:radial-gradient(circle at 35% 30%,#27302c,#080a09 68%); box-shadow:inset 0 0 14px rgba(255,255,255,.045),0 0 12px rgba(0,0,0,.4); }
.gear-slot.paperdoll-slot .gear-gem img { width:100%; height:100%; display:block; object-fit:cover; image-rendering:auto; }
.gear-slot.paperdoll-slot .gear-gem > span { width:100%; height:100%; display:grid; place-items:center; }
.gear-slot.paperdoll-slot .gear-gem::after { content:""; position:absolute; inset:3px; border:1px solid rgba(255,255,255,.08); pointer-events:none; }
.paperdoll-slot .gear-copy strong { font-size:.78rem; }
.paperdoll-slot .gear-copy span { font-size:.65rem; letter-spacing:.08em; }
.paperdoll-slot .item-tooltip { top:50%; left:calc(100% + 8px); transform:translateY(-50%); }
.slot-rail-right .paperdoll-slot .item-tooltip { right:calc(100% + 8px); left:auto; }
.paperdoll-slot:hover .item-tooltip,.paperdoll-slot:focus-visible .item-tooltip { animation:none; }

.character-stage { position:relative; min-width:0; overflow:hidden; border:1px solid rgba(214,174,88,.26); border-radius:220px 220px 10px 10px / 120px 120px 10px 10px; background:linear-gradient(180deg,rgba(6,9,8,.18),rgba(3,5,5,.88)),url("/assets/greyhaven-journey.webp") center 40% / cover; box-shadow:inset 0 0 90px rgba(0,0,0,.72),0 22px 55px rgba(0,0,0,.35); isolation:isolate; }
.character-stage::before { content:""; position:absolute; inset:18px; z-index:-1; border:1px solid rgba(240,209,132,.14); border-radius:inherit; }
.character-stage::after { content:""; position:absolute; right:18%; bottom:7%; left:18%; height:8%; z-index:-1; border-radius:50%; background:rgba(0,0,0,.68); filter:blur(12px); }
.character-stage-glow { position:absolute; top:12%; left:50%; width:70%; aspect-ratio:1; z-index:-1; border-radius:50%; background:radial-gradient(circle,color-mix(in srgb,var(--class-color) 25%,transparent),transparent 68%); transform:translateX(-50%); animation:stage-breathe 5s ease-in-out infinite; }
.character-model { position:absolute; inset:4% 0 0; z-index:2; }
.character-model > div,.character-model canvas { width:100%!important; height:100%!important; }
.character-fallback { position:absolute; inset:0; z-index:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; color:var(--class-color); text-align:center; }
.character-fallback[hidden] { display:none; }
.character-fallback span { width:145px; height:145px; display:grid; place-items:center; border:1px solid color-mix(in srgb,var(--class-color) 58%,transparent); border-radius:50%; background:rgba(2,4,4,.78); box-shadow:0 0 0 14px color-mix(in srgb,var(--class-color) 5%,transparent),0 0 70px color-mix(in srgb,var(--class-color) 18%,transparent); font:700 4.5rem/1 var(--display); }
.character-fallback strong { color:#e7e3da; font:600 1.15rem/1 var(--display); }
.model-status { position:absolute; right:0; bottom:14px; left:0; z-index:3; margin:0; color:rgba(238,233,222,.62); font-size:.68rem; font-weight:700; text-align:center; text-shadow:0 1px 5px #000; text-transform:uppercase; letter-spacing:.08em; pointer-events:none; }

.weapon-dock { position:relative; z-index:8; display:grid; grid-template-columns:repeat(3,minmax(0,180px)); justify-content:center; gap:9px; margin:20px auto 0; padding:14px 20px 0; border-top:1px solid rgba(214,174,88,.16); }
.weapon-dock .gear-slot { min-height:66px; }
.weapon-dock .item-tooltip { top:auto; bottom:calc(100% + 8px); left:50%; transform:translateX(-50%); }

.vitality-bars { position:relative; z-index:3; display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:22px; }
.vital-bar { position:relative; min-height:48px; overflow:hidden; border:1px solid rgba(255,255,255,.22); border-radius:5px; background:#050706; box-shadow:inset 0 2px 12px rgba(0,0,0,.42),0 8px 24px rgba(0,0,0,.2); }
.vital-bar i { position:absolute; inset:0 auto 0 0; width:100%; background:linear-gradient(180deg,rgba(255,255,255,.22),transparent 46%),linear-gradient(90deg,#087332,#18ad59); box-shadow:inset 0 0 15px rgba(255,255,255,.12),0 0 18px rgba(24,173,89,.22); }
.vital-bar div { position:relative; z-index:2; min-height:46px; display:flex; align-items:center; justify-content:center; gap:8px; color:white; font-size:.82rem; text-shadow:0 1px 3px #000; }
.vital-bar span { font-weight:800; text-transform:uppercase; }.vital-bar strong { font-size:1rem; }
.health-bar { border-color:rgba(74,222,128,.52); }
.mana-bar { border-color:rgba(72,137,255,.56); }
.mana-bar i { background:linear-gradient(180deg,rgba(255,255,255,.22),transparent 46%),linear-gradient(90deg,#174db5,#347df2); box-shadow:inset 0 0 15px rgba(255,255,255,.12),0 0 18px rgba(52,125,242,.24); }
.rage-bar { border-color:rgba(230,69,69,.55); }
.rage-bar i { background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 46%),linear-gradient(90deg,#761d1d,#c23b3b); }
.energy-bar { border-color:rgba(245,203,62,.56); }
.energy-bar i { background:linear-gradient(180deg,rgba(255,255,255,.22),transparent 46%),linear-gradient(90deg,#a67b00,#e6bb27); }

.armory-grid-v2 .character-ledger { position:relative; background:linear-gradient(180deg,rgba(255,255,255,.025),transparent 44%); }
.armory-grid-v2 .stat-grid { grid-template-columns:1fr; border-top-color:rgba(214,174,88,.3); }
.armory-grid-v2 .stat-grid div,.armory-grid-v2 .stat-grid div:nth-child(even) { display:flex; align-items:center; justify-content:space-between; min-height:54px; border-left:0; padding:12px 3px; }
.armory-grid-v2 .stat-grid dt { color:#a9aea9; font-size:.82rem; letter-spacing:.03em; text-transform:none; }
.armory-grid-v2 .stat-grid dd { color:var(--class-color); font-size:1.28rem; text-shadow:0 0 20px color-mix(in srgb,var(--class-color) 28%,transparent); }
.armory-grid-v2 .profession-row { border-left-color:var(--class-color); border-radius:2px; }

@keyframes stage-breathe { 0%,100% { opacity:.65; transform:translateX(-50%) scale(.96); } 50% { opacity:1; transform:translateX(-50%) scale(1.04); } }
@media (prefers-reduced-motion:reduce) { .character-stage-glow { animation:none; } }
@media (max-width:1080px) { .armory-grid-v2 { grid-template-columns:1fr; }.armory-grid-v2 .character-ledger { border-left:0; border-top:1px solid var(--line); }.paperdoll-grid { min-height:600px; }.armory-grid-v2 .stat-grid { grid-template-columns:repeat(2,1fr); }.armory-grid-v2 .stat-grid div:nth-child(even) { border-left:1px solid var(--line); padding-left:16px; } }
@media (max-width:760px) { .paperdoll-vault { padding-right:12px; padding-left:12px; }.paperdoll-grid { grid-template-columns:68px minmax(0,1fr) 68px; gap:7px; min-height:520px; }.slot-rail { gap:5px; }.gear-slot.paperdoll-slot { display:grid; grid-template-columns:1fr!important; place-items:center; padding:4px; }.paperdoll-slot .gear-gem,.slot-rail-right .gear-gem { grid-column:1; grid-row:1; width:48px; height:48px; }.paperdoll-slot .gear-copy { display:none; }.paperdoll-slot .item-tooltip,.slot-rail-right .paperdoll-slot .item-tooltip { position:fixed; right:12px; bottom:12px; left:12px; top:auto; width:auto; transform:none; }.character-stage { border-radius:120px 120px 8px 8px / 80px 80px 8px 8px; }.weapon-dock { grid-template-columns:repeat(3,64px); margin-top:14px; padding-top:12px; }.weapon-dock .gear-slot { min-height:60px; }.weapon-dock .gear-copy { display:none; }.vitality-bars { gap:7px; }.vital-bar div { flex-direction:column; gap:0; line-height:1.1; }.paperdoll-heading > p { display:none; } }
@media (max-width:480px) { .paperdoll-grid { grid-template-columns:54px minmax(0,1fr) 54px; min-height:440px; }.paperdoll-slot .gear-gem,.slot-rail-right .gear-gem { width:42px; height:42px; }.character-fallback span { width:105px; height:105px; font-size:3.2rem; }.armory-grid-v2 .stat-grid { grid-template-columns:1fr; }.armory-grid-v2 .stat-grid div:nth-child(even) { border-left:0; padding-left:3px; } }