/* Phoenix Core v1.0 — Global Design System for mineailuc.net
   Safe rule: everything is scoped to body.px-core-ready or .px-* classes. */

:root {
  --px-bg: #050505;
  --px-bg-2: #0c0b09;
  --px-panel: rgba(255,255,255,.075);
  --px-panel-2: rgba(255,255,255,.115);
  --px-border: rgba(255,183,57,.22);
  --px-border-soft: rgba(255,255,255,.12);
  --px-gold: #ffb739;
  --px-orange: #ff7a18;
  --px-red: #e42020;
  --px-green: #0ba95b;
  --px-blue: #0878d8;
  --px-text: #ffffff;
  --px-muted: rgba(255,255,255,.70);
  --px-muted-2: rgba(255,255,255,.52);
  --px-shadow: 0 28px 80px rgba(0,0,0,.38);
  --px-radius: 24px;
  --px-radius-lg: 34px;
  --px-max: 1180px;
  --px-safe-bottom: max(18px, env(safe-area-inset-bottom));
}

body.px-core-ready {
  background:
    radial-gradient(circle at 15% 3%, rgba(255,122,24,.09), transparent 28%),
    radial-gradient(circle at 82% 0%, rgba(255,183,57,.10), transparent 30%),
    var(--px-bg);
}

body.px-core-ready .sqs-block-button-element,
body.px-core-ready .sqs-button-element--primary,
body.px-core-ready .sqs-button-element--secondary {
  border-radius: 999px !important;
  font-weight: 850 !important;
  letter-spacing: .01em;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important;
}

body.px-core-ready .sqs-block-button-element:hover,
body.px-core-ready .sqs-button-element--primary:hover,
body.px-core-ready .sqs-button-element--secondary:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 42px rgba(255,122,24,.20) !important;
}

/* Header polish — additive only, keeps native Squarespace header/account/cart/language switcher alive. */
body.px-core-ready header,
body.px-core-ready .header {
  --px-header-bg: rgba(0,0,0,.74);
}

body.px-core-ready .header-announcement-bar-wrapper,
body.px-core-ready .header {
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

body.px-core-ready.px-scrolled .header,
body.px-core-ready.px-scrolled .header-announcement-bar-wrapper {
  box-shadow: 0 18px 42px rgba(0,0,0,.28);
  border-bottom: 1px solid rgba(255,183,57,.16);
}

body.px-core-ready .header-nav-folder-content,
body.px-core-ready .header-menu-nav-folder-content {
  border-radius: 20px !important;
  overflow: hidden;
  border: 1px solid rgba(255,183,57,.18) !important;
  box-shadow: 0 20px 70px rgba(0,0,0,.34) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

body.px-core-ready .header-nav-item a,
body.px-core-ready .header-menu-nav-item a,
body.px-core-ready .header-actions-action a {
  transition: color .2s ease, background .2s ease, transform .2s ease, border-color .2s ease;
}

body.px-core-ready .header-actions-action--cart a,
body.px-core-ready a[href*="/cart"] {
  position: relative;
}

body.px-core-ready .px-shell {
  color: var(--px-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.px-wrap {
  width: min(var(--px-max), calc(100% - 34px));
  margin: 0 auto;
}

.px-section {
  position: relative;
  padding: clamp(58px, 8vw, 112px) 0;
}

.px-grid-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(24px, 5vw, 66px);
  align-items: center;
}

.px-card,
.px-glass {
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.055));
  border: 1px solid var(--px-border-soft);
  border-radius: var(--px-radius-lg);
  box-shadow: var(--px-shadow);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.px-card {
  padding: clamp(22px, 3vw, 36px);
}

.px-title {
  margin: 0;
  color: var(--px-text);
  font-size: clamp(42px, 6.2vw, 92px);
  line-height: .92;
  font-weight: 1000;
  letter-spacing: -3.2px;
}

.px-title .px-hot,
.px-hot { color: var(--px-gold); }
.px-title .px-orange,
.px-orange { color: var(--px-orange); }
.px-title .px-green,
.px-green { color: var(--px-green); }
.px-title .px-blue,
.px-blue { color: var(--px-blue); }

.px-lead {
  margin: 18px 0 0;
  color: var(--px-muted);
  font-size: clamp(17px, 2vw, 23px);
  line-height: 1.55;
  font-weight: 650;
}

.px-copy {
  color: var(--px-muted);
  line-height: 1.75;
  font-size: 16px;
}

.px-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 13px;
  border-radius: 999px;
  border: 1px solid rgba(255,183,57,.20);
  background: rgba(255,255,255,.07);
  color: var(--px-gold);
  font-size: 13px;
  font-weight: 900;
  box-shadow: 0 12px 30px rgba(0,0,0,.20);
}

.px-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--px-gold), var(--px-orange));
  box-shadow: 0 0 0 5px rgba(255,183,57,.12);
}

.px-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  gap: 10px;
  padding: 13px 22px;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
  font-weight: 900;
  text-decoration: none !important;
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease;
  white-space: nowrap;
}

.px-btn-primary {
  color: #0b0803 !important;
  background: linear-gradient(135deg, var(--px-gold), var(--px-orange));
  box-shadow: 0 16px 40px rgba(255,122,24,.20);
}

.px-btn-dark {
  color: #fff !important;
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.14);
}

.px-btn-green {
  color: #fff !important;
  background: linear-gradient(135deg, var(--px-green), #086b3b);
}

.px-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 20px 48px rgba(0,0,0,.28);
}

.px-pill-row,
.px-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
}

.px-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.12);
  color: var(--px-muted);
  font-size: 13px;
  font-weight: 850;
}

.px-reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .65s ease, transform .65s ease;
}

.px-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.px-legal-strip {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(255,183,57,.18);
  background: rgba(255,183,57,.07);
  color: rgba(255,255,255,.72);
  font-size: 13.5px;
  line-height: 1.55;
}

/* Universal Phoenix Player */
.px-player {
  position: fixed;
  left: 50%;
  bottom: calc(var(--px-safe-bottom) + 8px);
  transform: translateX(-50%);
  z-index: 99999;
  width: min(760px, calc(100% - 26px));
  color: #fff;
  background: rgba(8, 8, 8, .88);
  border: 1px solid rgba(255,183,57,.22);
  border-radius: 999px;
  box-shadow: 0 22px 70px rgba(0,0,0,.46);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  padding: 10px 12px;
  display: none;
  align-items: center;
  gap: 12px;
}

.px-player.is-ready { display: flex; }
.px-player.is-minimized { width: auto; }
.px-player.is-minimized .px-player-main,
.px-player.is-minimized .px-player-extra { display: none; }

.px-player-btn {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(135deg, var(--px-gold), var(--px-orange));
  color: #050505;
  font-weight: 1000;
  cursor: pointer;
}

.px-player-main {
  flex: 1;
  min-width: 0;
}

.px-player-title {
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.px-player-meta {
  color: var(--px-muted-2);
  font-size: 11px;
  margin-top: 2px;
}

.px-player-progress {
  appearance: none;
  width: 100%;
  height: 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  outline: none;
  cursor: pointer;
}

.px-player-progress::-webkit-slider-thumb {
  appearance: none;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--px-gold);
}

.px-player-extra {
  display: flex;
  align-items: center;
  gap: 8px;
}

.px-player-mini {
  background: rgba(255,255,255,.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  min-width: 36px;
  height: 36px;
  cursor: pointer;
}

/* Video modal */
.px-video-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: none;
  place-items: center;
  background: rgba(0,0,0,.82);
  padding: 22px;
}

.px-video-modal.is-open { display: grid; }

.px-video-shell {
  width: min(1080px, 100%);
  aspect-ratio: 16 / 9;
  border-radius: 24px;
  overflow: hidden;
  background: #000;
  box-shadow: 0 30px 100px rgba(0,0,0,.60);
  border: 1px solid rgba(255,255,255,.14);
  position: relative;
}

.px-video-shell iframe,
.px-video-shell video {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}

.px-video-close {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 100001;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  color: #fff;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  cursor: pointer;
}

.px-cart-assist {
  position: fixed;
  right: 18px;
  bottom: calc(var(--px-safe-bottom) + 86px);
  z-index: 99990;
  display: none;
}

.px-cart-assist.is-visible { display: block; }

.px-cart-assist a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 14px;
  border-radius: 999px;
  text-decoration: none !important;
  color: #0b0803 !important;
  background: linear-gradient(135deg, var(--px-gold), var(--px-orange));
  font-weight: 950;
  box-shadow: 0 18px 44px rgba(0,0,0,.30);
}

@media (max-width: 760px) {
  .px-grid-2 { grid-template-columns: 1fr; }
  .px-title { letter-spacing: -2px; }
  .px-player {
    border-radius: 22px;
    align-items: flex-start;
  }
  .px-player-extra { display: none; }
  .px-cart-assist { right: 12px; bottom: calc(var(--px-safe-bottom) + 112px); }
}

@media (prefers-reduced-motion: reduce) {
  .px-reveal,
  .px-btn,
  body.px-core-ready .sqs-block-button-element { transition: none !important; }
}
