/* ============================================================
   AuraPulse 靈境閣 — Shared Stylesheet
   Design tokens carried over from the Step 1 core framework.
   ============================================================ */
:root{
  --void:#020617;
  --nebula-1:#4c1d95;
  --nebula-2:#312e81;
  --accent-iris:#a78bfa;
  --accent-gold:#f6c453;
  --glass-border:rgba(167,139,250,0.18);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--void);
  font-family:'Inter',system-ui,sans-serif;
  color:#e2e8f0;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
.font-serif-tc{font-family:'Noto Serif TC','Inter',serif;}
::selection{background:var(--accent-iris);color:#0a0616;}
::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-track{background:#020617;}
::-webkit-scrollbar-thumb{background:#4c1d95;border-radius:8px;}

#starfield{position:fixed;inset:0;z-index:0;pointer-events:none;}
.glow-orb{position:fixed;border-radius:9999px;filter:blur(90px);opacity:.35;pointer-events:none;z-index:0;}
.glow-a{width:38rem;height:38rem;background:var(--nebula-1);top:-14rem;left:-10rem;}
.glow-b{width:32rem;height:32rem;background:#0e7490;top:20rem;right:-12rem;opacity:.22;}
.glow-c{width:30rem;height:30rem;background:var(--nebula-2);bottom:-14rem;left:20%;opacity:.28;}

.glass{
  background:linear-gradient(155deg, rgba(255,255,255,0.055), rgba(255,255,255,0.015));
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border:1px solid var(--glass-border);
}
.glass-strong{
  background:linear-gradient(155deg, rgba(255,255,255,0.08), rgba(255,255,255,0.02));
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border:1px solid rgba(167,139,250,0.28);
}
.card-hover{transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s, border-color .35s;}
.card-hover:hover{transform:translateY(-6px);box-shadow:0 20px 45px -20px rgba(124,58,237,0.55);border-color:rgba(167,139,250,0.55);}

.text-gradient{
  background:linear-gradient(100deg,#c4b5fd 0%,#f6c453 45%,#f0abfc 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.btn-primary{background:linear-gradient(100deg,#7c3aed,#a78bfa);box-shadow:0 8px 22px -8px rgba(124,58,237,.65);}
.btn-primary:hover{filter:brightness(1.1);}
.btn-gold{background:linear-gradient(100deg,#d19a2a,#f6c453);color:#241505;}
.ad-slot{
  border:1.5px dashed rgba(167,139,250,0.35);
  background:repeating-linear-gradient(135deg, rgba(255,255,255,0.02) 0px, rgba(255,255,255,0.02) 10px, rgba(255,255,255,0.005) 10px, rgba(255,255,255,0.005) 20px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  border-radius:1rem;color:#94a3b8;
}
/* Tarot 3D flip card (used by tarot-daily.html and tarot-three-card.html) */
.tarot-flip-wrap{perspective:1200px;width:150px;height:225px;margin:0 auto;}
.tarot-flip-wrap.small{width:104px;height:156px;}
.tarot-flip-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.4,.2,.2,1);}
.tarot-flip-inner.flipped{transform:rotateY(180deg);}
.tarot-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:10px;overflow:hidden;box-shadow:0 10px 30px -8px rgba(0,0,0,.6);}
.tarot-face.back{cursor:pointer;}
.tarot-face.front{transform:rotateY(180deg);}
.tarot-glow{animation:tarot-glow 1.8s ease-in-out infinite;}
@keyframes tarot-glow{0%,100%{filter:drop-shadow(0 0 6px rgba(246,196,83,.35));}50%{filter:drop-shadow(0 0 18px rgba(246,196,83,.75));}}

.modal-backdrop{background:rgba(2,6,23,0.82);backdrop-filter:blur(6px);}
.modal-panel{animation:pop-in .35s cubic-bezier(.2,.8,.2,1);}
@keyframes pop-in{from{opacity:0;transform:translateY(24px) scale(.97);}to{opacity:1;transform:translateY(0) scale(1);}}
@keyframes fade-in{from{opacity:0;}to{opacity:1;}}
.fade-in{animation:fade-in .4s ease both;}
.tab-pill{transition:all .25s;}
.tab-pill.active{background:linear-gradient(100deg,#7c3aed,#a78bfa);color:#fff;box-shadow:0 6px 16px -6px rgba(124,58,237,.7);}
input[type=range]{-webkit-appearance:none;appearance:none;height:6px;border-radius:9999px;background:rgba(255,255,255,.1);}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:9999px;background:linear-gradient(100deg,#7c3aed,#a78bfa);cursor:pointer;box-shadow:0 2px 8px rgba(124,58,237,.6);}
input[type=range]::-moz-range-thumb{width:16px;height:16px;border:none;border-radius:9999px;background:linear-gradient(100deg,#7c3aed,#a78bfa);cursor:pointer;}
.float-plus{position:absolute;pointer-events:none;font-weight:800;color:var(--accent-gold);animation:float-up 1.1s ease-out forwards;white-space:nowrap;}
@keyframes float-up{0%{opacity:1;transform:translateY(0) scale(.8);}100%{opacity:0;transform:translateY(-70px) scale(1.3);}}
.crystal-3d{animation:crystal-spin 7s linear infinite;transform-style:preserve-3d;}
@keyframes crystal-spin{from{transform:rotateY(0deg) rotateX(8deg);}to{transform:rotateY(360deg) rotateX(8deg);}}
.pulse-ring{position:absolute;inset:0;border-radius:9999px;border:2px solid rgba(167,139,250,.55);animation:pulse-ring 1.8s ease-out infinite;}
@keyframes pulse-ring{0%{transform:scale(0.75);opacity:.9;}100%{transform:scale(1.9);opacity:0;}}
.rarity-badge{display:inline-block;padding:2px 10px;border-radius:9999px;font-size:10px;font-weight:800;letter-spacing:.05em;}
input[type=text],input[type=search],input[type=date]{background:rgba(255,255,255,.04);border:1px solid rgba(167,139,250,.25);color-scheme:dark;}
input:focus,button:focus-visible,a:focus-visible{outline:2px solid var(--accent-iris);outline-offset:2px;}
@media (prefers-reduced-motion: reduce){ *{animation-duration:0.01ms !important; transition-duration:0.01ms !important;} }

/* ---------- Tool card grid (homepage) ---------- */
.category-eyebrow{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:13.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;
  color:var(--accent-gold);
}
.tool-card{
  position:relative;overflow:hidden;border-radius:1.1rem;padding:1.25rem;
  display:flex;flex-direction:column;gap:.6rem;height:100%;
}
.tool-card .tool-icon{
  width:2.75rem;height:2.75rem;border-radius:.85rem;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, rgba(124,58,237,.35), rgba(167,139,250,.12));
  border:1px solid rgba(167,139,250,.3);
}
.tool-card h3{font-weight:700;color:#f1f5f9;line-height:1.35;}
.tool-card p{font-size:12.5px;color:#94a3b8;line-height:1.6;}
.status-pill{
  position:absolute;top:.85rem;right:.85rem;
  font-size:9.5px;font-weight:800;letter-spacing:.04em;
  padding:3px 9px;border-radius:9999px;
  background:rgba(15,23,42,.65);border:1px solid rgba(148,163,184,.3);color:#cbd5e1;
}
.status-pill.live{background:rgba(16,185,129,.15);border-color:rgba(52,211,153,.4);color:#6ee7b7;}

/* ---------- Breadcrumb ---------- */
.breadcrumb{font-size:12.5px;color:#94a3b8;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;}
.breadcrumb a{color:#c4b5fd;}
.breadcrumb a:hover{color:var(--accent-gold);}

/* ---------- Tool placeholder stage ---------- */
.stage-frame{
  border-radius:1.5rem;padding:2.5rem 1.5rem;text-align:center;
  min-height:320px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;
}
.stage-icon-orb{
  width:5rem;height:5rem;border-radius:9999px;position:relative;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 35% 30%, rgba(167,139,250,.5), rgba(76,29,149,.15) 70%);
  border:1px solid rgba(167,139,250,.4);
}

/* ---------- Footer ---------- */
footer a:hover{color:var(--accent-gold);}
.footer-col h4{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#c4b5fd;margin-bottom:.65rem;}
.footer-col a{display:block;font-size:13px;color:#94a3b8;margin-bottom:.45rem;}

/* ---------- Legal / prose pages ---------- */
.prose-mystic h2{font-family:'Noto Serif TC','Inter',serif;font-weight:700;font-size:1.15rem;color:#f1f5f9;margin-top:1.75rem;margin-bottom:.5rem;}
.prose-mystic p{font-size:14px;line-height:1.9;color:#94a3b8;margin-bottom:.85rem;}
.prose-mystic ul{margin:.5rem 0 1rem 1.25rem;list-style:disc;color:#94a3b8;font-size:14px;line-height:1.9;}

/* ---------- Mobile nav ---------- */
#mobileMenu{display:none;}
#mobileMenu.open{display:block;}

/* ---------- Language dropdown ---------- */
.lang-dropdown{position:relative;}
.lang-dropdown-menu{
  position:absolute;top:calc(100% + 8px);right:0;min-width:150px;
  border-radius:.85rem;overflow:hidden;z-index:50;display:none;
  background:linear-gradient(155deg, rgba(20,14,40,0.98), rgba(10,8,25,0.98));
  backdrop-filter:blur(20px);border:1px solid rgba(167,139,250,0.28);
  box-shadow:0 20px 45px -12px rgba(0,0,0,0.6);
}
.lang-dropdown-menu.open{display:block;}
.lang-dropdown-menu a{display:flex;align-items:center;gap:.55rem;padding:.65rem .95rem;font-size:12.5px;color:#cbd5e1;white-space:nowrap;}
.lang-dropdown-menu a:hover{background:rgba(167,139,250,.14);color:#fff;}
.lang-dropdown-menu a.current{color:var(--accent-gold);font-weight:700;}