/* TAVORYN — Eclipse Dominion Store */
:root {
  --store-bg: #050711;
  --store-panel: rgba(10, 14, 27, 0.92);
  --store-line: rgba(255, 255, 255, 0.12);
  --store-text: #f6f7ff;
  --store-muted: #9aa7c5;
  --store-gold: #e9c66d;
  --store-violet: #9d5cff;
  --store-blue: #65c9ff;
}
* { box-sizing: border-box; }
body.store-page {
  min-height: 100vh;
  margin: 0;
  color: var(--store-text);
  background:
    radial-gradient(circle at 16% 10%, rgba(39,168,255,.18), transparent 28%),
    radial-gradient(circle at 82% 10%, rgba(157,78,221,.2), transparent 31%),
    #050711;
}
.store-page button,.store-page a { font: inherit; }
.store-header {
  position: sticky; top: 0; z-index: 50;
  min-height: 72px; padding: 10px 28px;
  display: grid; grid-template-columns: auto 1fr auto;
  gap: 24px; align-items: center;
  border-bottom: 1px solid var(--store-line);
  background: rgba(3,6,14,.9); backdrop-filter: blur(18px);
}
.store-brand { display: inline-flex; align-items:center; gap:10px; color:white; text-decoration:none; font-weight:1000; letter-spacing:.2em; }
.store-brand-mark { color: var(--store-blue); }
.store-nav { display:flex; justify-content:center; gap:8px; }
.store-nav a { padding:9px 14px; border-radius:999px; color:var(--store-muted); text-decoration:none; }
.store-nav a:hover,.store-nav a.active { color:white; background:rgba(255,255,255,.07); }
.wallet { display:flex; gap:9px; }
.wallet-item {
  min-width:112px; padding:8px 13px; display:flex; align-items:center; justify-content:space-between; gap:12px;
  border:1px solid var(--store-line); border-radius:14px; background:rgba(255,255,255,.045);
}
.wallet-item span { color:var(--store-muted); font-size:.7rem; }
.wallet-item strong { color:var(--store-gold); font-size:1.05rem; }
.wallet-item.essence strong { color:#d99aff; }

.store-shell { width:min(1480px,calc(100% - 28px)); margin:0 auto; padding:34px 0 54px; }
.store-hero {
  min-height:390px; padding:38px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:30px;
  overflow:hidden; border:1px solid var(--store-line); border-radius:32px;
  background:
    linear-gradient(120deg,rgba(255,255,255,.06),transparent 40%),
    radial-gradient(circle at 72% 50%,rgba(157,92,255,.2),transparent 36%),
    rgba(6,10,20,.84);
  box-shadow:0 30px 90px rgba(0,0,0,.38);
}
.store-kicker { margin:0 0 8px; color:var(--store-blue); font-size:.76rem; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.store-copy h1 { margin:0; font-size:clamp(3.4rem,7vw,7rem); line-height:.92; letter-spacing:-.045em; }
.store-copy h1 span {
  display:block; color:transparent;
  background:linear-gradient(120deg,#f8d98b,#ff77da,#74d9ff);
  background-clip:text; -webkit-background-clip:text;
}
.store-copy>p:not(.store-kicker) { max-width:690px; margin:24px 0; color:#c7d0e8; font-size:1.02rem; line-height:1.9; }
.store-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.store-facts article { padding:16px; border:1px solid var(--store-line); border-radius:18px; background:rgba(255,255,255,.035); }
.store-facts strong { display:block; margin-bottom:5px; color:var(--store-gold); font-size:1.65rem; }
.store-facts span { color:var(--store-muted); font-size:.78rem; }

.chest-stage { position:relative; min-height:310px; display:grid; place-items:center; perspective:900px; }
.chest-aura {
  position:absolute; width:310px; height:310px; border-radius:50%;
  background:radial-gradient(circle,rgba(255,79,195,.34),rgba(122,107,255,.16) 42%,transparent 70%);
  animation:auraPulse 2.8s ease-in-out infinite;
}
.css-chest {
  position:relative; z-index:2; width:270px; height:190px;
  transform:rotateX(4deg) rotateY(-8deg);
  filter:drop-shadow(0 35px 32px rgba(0,0,0,.48));
  animation:chestFloat 3.4s ease-in-out infinite;
}
.chest-lid,.chest-body {
  position:absolute; left:0; width:100%; border:3px solid #f0ce76;
  background:
    linear-gradient(90deg,rgba(255,255,255,.09),transparent 20% 80%,rgba(255,255,255,.08)),
    linear-gradient(145deg,#2a1350,#120d2e 44%,#3d155e);
  box-shadow:inset 0 0 24px rgba(122,207,255,.1),0 0 30px rgba(183,91,255,.18);
}
.chest-lid { top:0; height:78px; border-radius:54px 54px 14px 14px; }
.chest-band { position:absolute; inset:-3px 44%; width:12%; background:linear-gradient(#ffeba9,#9a6b1e); border-inline:2px solid #ffe79a; }
.chest-body { bottom:0; height:120px; border-radius:14px 14px 22px 22px; }
.chest-lock {
  position:absolute; top:24px; left:50%; width:66px; height:74px; transform:translateX(-50%);
  display:grid; place-items:center; border-radius:14px 14px 20px 20px;
  color:#11101d; font-size:2rem; font-weight:1000;
  background:radial-gradient(circle at 50% 38%,#d9f1ff,#5fbef6 28%,#d6a542 31%,#f5d57e 64%,#8c5913);
  box-shadow:0 0 36px rgba(101,201,255,.48);
}
.chest-shadow { position:absolute; bottom:24px; width:270px; height:44px; border-radius:50%; background:rgba(0,0,0,.45); filter:blur(12px); }
@keyframes chestFloat { 0%,100%{transform:translateY(0) rotateX(4deg) rotateY(-8deg)} 50%{transform:translateY(-12px) rotateX(4deg) rotateY(-4deg)} }
@keyframes auraPulse { 0%,100%{transform:scale(.94);opacity:.72} 50%{transform:scale(1.08);opacity:1} }

.shop-grid { margin-top:18px; display:grid; grid-template-columns:420px minmax(0,1fr); gap:18px; }
.product-panel,.set-panel { border:1px solid var(--store-line); border-radius:26px; background:var(--store-panel); box-shadow:0 24px 70px rgba(0,0,0,.28); }
.product-panel,.set-panel { padding:24px; }
.product-head,.set-panel-head,.reveal-head { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; }
.product-head h2,.set-panel-head h2,.reveal-head h2 { margin:0; }
.price-tag { min-width:96px; padding:10px 12px; text-align:center; border:1px solid rgba(233,198,109,.35); border-radius:15px; background:rgba(233,198,109,.08); }
.price-tag strong { display:block; color:var(--store-gold); font-size:1.35rem; }
.price-tag span { color:var(--store-muted); font-size:.68rem; }

.drop-rates { margin:22px 0; display:grid; gap:9px; }
.drop-rates div { padding:11px 13px; display:flex; justify-content:space-between; border:1px solid rgba(255,255,255,.085); border-radius:13px; background:rgba(255,255,255,.03); }
.drop-rates span { color:var(--store-muted); }
.drop-rates strong { color:#d9e4ff; }

.pity-panel { margin-bottom:18px; padding:14px; border:1px solid rgba(157,92,255,.26); border-radius:16px; background:rgba(157,92,255,.07); }
.pity-copy { margin-bottom:10px; display:flex; justify-content:space-between; }
.pity-copy span { color:var(--store-muted); }
.pity-copy strong { color:#e0b5ff; }
.pity-track { height:9px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.08); }
.pity-fill { width:0%; height:100%; border-radius:inherit; background:linear-gradient(90deg,#7347ff,#ff4fc3,#f1d172); transition:width .25s ease; }

.open-chest-btn,.secondary-store-btn { border:0; cursor:pointer; }
.open-chest-btn {
  width:100%; min-height:56px; padding:10px 20px; display:grid; place-items:center; border-radius:17px;
  color:#130f08; font-weight:1000; background:linear-gradient(135deg,#fff0af,#e4b54a 56%,#b7781e);
}
.open-chest-btn small { opacity:.72; font-size:.68rem; }
.open-chest-btn:disabled { opacity:.45; cursor:not-allowed; }
.open-chest-btn.compact { width:auto; min-width:220px; }
.secondary-store-btn { min-height:48px; padding:10px 20px; border:1px solid var(--store-line); border-radius:15px; color:white; background:rgba(255,255,255,.06); }
.store-status { min-height:42px; margin:14px 0 0; color:var(--store-muted); font-size:.78rem; line-height:1.7; }

.set-panel-head a { color:var(--store-blue); text-decoration:none; font-size:.8rem; }
.set-cards { margin-top:20px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:11px; }
.mini-card { position:relative; min-width:0; overflow:hidden; border:1px solid var(--store-line); border-radius:16px; background:#090d18; }
.mini-card img { width:100%; aspect-ratio:4/3; display:block; object-fit:cover; }
.mini-card-copy { padding:9px; }
.mini-card h3 { margin:0; overflow:hidden; color:white; font-size:.7rem; text-overflow:ellipsis; white-space:nowrap; }
.mini-card p { margin:4px 0 0; color:var(--store-muted); font-size:.58rem; }
.mini-card-rarity { position:absolute; top:7px; left:7px; padding:4px 7px; border-radius:999px; font-size:.52rem; background:rgba(4,7,14,.82); }

.reveal-overlay[hidden] { display:none!important; }
.reveal-overlay { position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:18px; }
.reveal-backdrop { position:absolute; inset:0; background:rgba(1,3,9,.84); backdrop-filter:blur(16px); }
.reveal-dialog {
  position:relative; z-index:1; width:min(1320px,100%); max-height:calc(100vh - 36px); overflow:auto; padding:26px;
  border:1px solid var(--store-line); border-radius:28px;
  background:radial-gradient(circle at 50% 0%,rgba(157,92,255,.13),transparent 32%),#070b15;
}
.reveal-summary { text-align:left; }
.reveal-summary span,.reveal-summary strong { display:block; }
.reveal-summary span { color:var(--store-muted); font-size:.75rem; }
.reveal-summary strong { margin-top:5px; color:#d99aff; }
.reveal-grid { margin:24px 0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.reveal-card {
  position:relative; min-height:310px; padding:0; overflow:hidden; border:1px solid var(--store-line); border-radius:20px;
  color:white; background:#0b1020; cursor:pointer; transition:transform .38s ease,box-shadow .25s ease;
}
.reveal-card.is-hidden { background:radial-gradient(circle at 50% 42%,rgba(101,201,255,.24),transparent 30%),conic-gradient(from 40deg,#16132d,#39185e,#071625,#16132d); }
.reveal-card.is-hidden>* { visibility:hidden; }
.reveal-card.is-hidden::after { content:"N"; position:absolute; inset:0; display:grid; place-items:center; color:var(--store-gold); font-size:4.6rem; font-weight:1000; }
.reveal-card:not(.is-hidden) { transform:rotateY(360deg); }
.reveal-card img { width:100%; height:190px; display:block; object-fit:cover; }
.reveal-card-copy { padding:14px; text-align:right; }
.reveal-card-copy h3 { margin:0; font-size:.94rem; }
.reveal-card-copy p { margin:6px 0 0; color:var(--store-muted); font-size:.68rem; }
.reveal-card-copy strong { display:block; margin-top:10px; }
.reveal-card[data-rarity="Uncommon"] { border-color:rgba(101,201,255,.48); }
.reveal-card[data-rarity="Rare"] { border-color:rgba(157,92,255,.6); box-shadow:0 0 34px rgba(157,92,255,.16); }
.reveal-card[data-rarity="Super Rare"] { border-color:rgba(233,198,109,.7); box-shadow:0 0 40px rgba(233,198,109,.2); }
.reveal-card[data-rarity="Legendary"] { border-color:#ffd86b; box-shadow:0 0 52px rgba(255,79,195,.28); animation:legendaryGlow 1.6s ease-in-out infinite alternate; }
@keyframes legendaryGlow { from{filter:brightness(1)} to{filter:brightness(1.2)} }
.reveal-actions { display:flex; justify-content:flex-end; gap:10px; }

@media (max-width:1100px) {
  .store-header { grid-template-columns:1fr; }
  .store-nav,.wallet { justify-content:center; }
  .store-hero,.shop-grid { grid-template-columns:1fr; }
  .set-cards,.reveal-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:640px) {
  .store-shell { width:min(100% - 16px,1480px); }
  .store-header { padding:10px; }
  .store-nav,.wallet { flex-wrap:wrap; }
  .store-hero { padding:24px 18px; }
  .store-facts,.set-cards,.reveal-grid { grid-template-columns:1fr; }
  .reveal-actions { flex-direction:column; }
  .open-chest-btn.compact { width:100%; }
}


/* TAVORYN_PLAYER_PROGRESSION_V1 */
.wallet-item.free-chests strong { color: #66efaa; }

/* TAVORYN_EMBERS_STORE_SELECTOR_V1 */
.set-switcher-panel{
  max-width:1180px;margin:0 auto 22px;padding:16px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  border:1px solid rgba(237,164,57,.32);border-radius:18px;
  background:linear-gradient(135deg,rgba(34,14,9,.92),rgba(10,14,27,.92));
}
.set-switcher-panel label{display:flex;align-items:center;gap:12px;font-weight:800;color:#f5d58c}
.set-switcher-panel select{
  min-width:260px;padding:11px 42px 11px 14px;border-radius:12px;
  border:1px solid rgba(255,188,67,.55);background:#101322;color:#fff4cf;
  font:inherit;cursor:pointer;
}
.set-switcher-panel p{margin:0;color:#bfb8a3;font-size:.9rem}
@media(max-width:720px){
  .set-switcher-panel{align-items:stretch;flex-direction:column}
  .set-switcher-panel label{justify-content:space-between}
  .set-switcher-panel select{min-width:0;width:65%}
}

.vault-shortcut{display:block;width:min(1180px,calc(100% - 32px));margin:18px auto 0;padding:13px 18px;border:1px solid rgba(245,199,106,.28);border-radius:14px;background:rgba(245,199,106,.07);color:#f5c76a;text-align:center;text-decoration:none;font-weight:800}.vault-shortcut:hover{background:rgba(245,199,106,.13)}