/* ===== Toast ===== */
.toast{
  position:fixed;bottom:80px;left:50%;transform:translateX(-50%);
  background:#2C2416;color:#fff;padding:12px 24px;
  border-radius:30px;font-size:0.9rem;font-weight:600;
  z-index:300;animation:toastIn 0.4s ease;
  box-shadow:0 8px 24px rgba(0,0,0,0.2);
}
@keyframes toastIn{from{transform:translateX(-50%) translateY(20px);opacity:0}to{transform:translateX(-50%) translateY(0);opacity:1}}

/* ===== XP Animation ===== */
.xp-pop{
  position:fixed;z-index:400;pointer-events:none;
  font-weight:700;color:var(--accent);font-size:1.1rem;
  animation:xpFly 1.2s ease forwards;
}
@keyframes xpFly{0%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-60px)}}

/* ===== Responsive ===== */
@media(max-width:600px){
  .header-inner{padding:0 8px}
  .section-hero h1{font-size:1.6rem}
  .modal{border-radius:20px 20px 0 0;max-height:95vh}
  .path-node{padding:6px 0;gap:12px}
  .path-node-number{width:36px;height:36px;font-size:0.8rem}
  .path::before{left:39px}
  .path-node-content{padding:14px 16px}
  .section-divider{padding-left:36px}
  .stats{gap:8px}
  .stat-item{font-size:0.78rem}
}