* { box-sizing: border-box; }

:root {
  --bg: #02050d;
  --panel: rgba(4, 8, 20, .965);
  --text: #f8f9ff;
  --muted: #c1c8db;
  --line: rgba(255,255,255,.14);
  --glow: rgba(94, 197, 255, .86);
}

html, body {
  margin: 0;
  width: 100%;
  min-height: 100%;
  background: var(--bg);
  color: var(--text);
  font-family: Georgia, "Times New Roman", serif;
}

body {
  overflow: hidden;
  cursor: none;
}

button, a { cursor: none; }

.world {
  position: fixed;
  inset: 0;
  overflow: hidden;
  display: grid;
  place-items: center;
  background:
    radial-gradient(circle at 50% 42%, rgba(15, 35, 80, .18), transparent 48%),
    #000;
}

/* The stage exactly follows the source image's 1170:1780 aspect ratio.
   Hotspot percentages therefore stay attached to the figure instead of the viewport. */
.world-stage {
  position: relative;
  height: min(100dvh, calc(100vw * 1780 / 1170));
  width: min(100vw, calc(100dvh * 1170 / 1780));
  max-width: 100vw;
  max-height: 100dvh;
  transform-origin: center;
  transition: transform 780ms cubic-bezier(.2,.8,.2,1), filter 420ms ease;
}

.world-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}

.hotspot {
  position: absolute;
  border: 0;
  padding: 0;
  background: transparent;
  border-radius: 999px;
  outline: none;
  z-index: 5;
}

.hotspot span {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%) scale(.94);
  opacity: 0;
  pointer-events: none;
  color: #fff;
  text-shadow: 0 0 8px #000, 0 0 18px #000;
  font: 700 clamp(9px, 1vw, 13px)/1 system-ui, sans-serif;
  letter-spacing: .16em;
  transition: opacity 150ms ease, transform 150ms ease;
}

.hotspot::after {
  content: "";
  position: absolute;
  inset: 3%;
  border-radius: inherit;
  opacity: 0;
  border: 1px solid rgba(162, 227, 255, .55);
  box-shadow: 0 0 18px 5px rgba(75, 175, 255, .38), inset 0 0 16px rgba(97, 204, 255, .18);
  transition: opacity 150ms ease;
}

.hotspot:hover::after,
.hotspot:focus-visible::after,
.hotspot:hover span,
.hotspot:focus-visible span {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

/* Narrowed substantially from v1. These are selection zones, not wide discs. */
.wisdom       { left: 44.5%; top:  3.0%; width: 11%; height: 11%; }
.word         { left: 46.0%; top: 34.0%; width:  8%; height:  8%; }
.why          { left: 45.0%; top: 44.5%; width: 10%; height:  9%; }
.what-left    { left: 17.0%; top: 39.5%; width: 16%; height: 13%; }
.what-right   { left: 67.0%; top: 53.0%; width: 16%; height: 13%; }
.who          { left: 45.0%; top: 79.0%; width: 10%; height: 12%; }

.flame {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 1000;
  width: 58px;
  height: 58px;
  pointer-events: none;
  transform: translate(-50%, -50%);
  filter: drop-shadow(0 0 7px rgba(88,190,255,.95)) drop-shadow(0 0 18px rgba(42,104,255,.72));
  transition: width 120ms ease, height 120ms ease, filter 120ms ease;
}

.flame img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  border-radius: 50%;
}

body.over-hotspot .flame {
  width: 68px;
  height: 68px;
  filter: drop-shadow(0 0 10px rgba(145,224,255,1)) drop-shadow(0 0 28px rgba(42,104,255,.9));
}

.hover-label {
  position: fixed;
  z-index: 900;
  pointer-events: none;
  padding: .42rem .68rem;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.68);
  backdrop-filter: blur(8px);
  border-radius: 999px;
  font: 700 11px/1.1 system-ui, sans-serif;
  letter-spacing: .16em;
  text-transform: uppercase;
  opacity: 0;
  transform: translate(-50%, 18px);
  transition: opacity 120ms ease;
}

.hover-label.show { opacity: 1; }

.panel {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: grid;
  place-items: center;
  padding: clamp(14px, 4vw, 56px);
  background: rgba(0, 2, 10, .82);
  backdrop-filter: blur(16px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 360ms ease;
}

.panel.open {
  opacity: 1;
  pointer-events: auto;
}

.panel-content {
  width: min(1080px, 96vw);
  max-height: 88dvh;
  overflow: auto;
  padding: clamp(24px, 4vw, 58px);
  background: linear-gradient(180deg, rgba(10,17,35,.98), var(--panel));
  border: 1px solid var(--line);
  border-radius: 26px;
  box-shadow: 0 32px 100px rgba(0,0,0,.66);
  scrollbar-width: thin;
}

.panel-content h1 {
  margin: 0 0 .55rem;
  font-size: clamp(2.2rem, 6vw, 5rem);
  font-weight: 500;
  letter-spacing: .06em;
}

.panel-content h2 {
  margin: 1.9rem 0 .6rem;
  font-size: clamp(1.25rem, 2.5vw, 2rem);
  font-weight: 500;
}

.panel-content p,
.panel-content li {
  color: var(--muted);
  font: 400 clamp(.98rem, 1.65vw, 1.14rem)/1.72 system-ui, sans-serif;
}

.panel-content p { max-width: 74ch; }
.panel-content ul { padding-left: 1.25rem; }

.kicker {
  margin: 0 0 .6rem !important;
  color: #8bd8ff !important;
  text-transform: uppercase;
  font-size: .78rem !important;
  font-weight: 800 !important;
  letter-spacing: .22em;
}

.lead {
  color: #eef5ff !important;
  font-size: clamp(1.12rem, 2vw, 1.35rem) !important;
}

.work-grid,
.book-grid,
.object-grid,
.who-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 18px;
  margin-top: 26px;
}

.work-card,
.book-card,
.object-card,
.who-card {
  appearance: none;
  text-align: left;
  color: inherit;
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,.035);
  padding: 0;
}

.work-card:hover,
.work-card:focus-visible,
.book-card:hover,
.object-card:hover,
.who-card:hover {
  border-color: rgba(112,207,255,.56);
  box-shadow: 0 0 26px rgba(65,150,255,.16);
}

.work-card img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  background: #000;
}

.work-card.square img { aspect-ratio: 1; }

.card-copy { padding: 14px 15px 17px; }
.card-copy strong {
  display: block;
  font: 700 .93rem/1.25 system-ui, sans-serif;
  letter-spacing: .08em;
}
.card-copy small {
  display: block;
  margin-top: 5px;
  color: #aebad2;
  font: 500 .78rem/1.45 system-ui, sans-serif;
}

.book-card,
.object-card,
.who-card {
  padding: 18px;
}

.close-panel,
.lightbox-close {
  position: fixed;
  top: 16px;
  right: 22px;
  z-index: 720;
  border: 0;
  background: rgba(0,0,0,.35);
  color: white;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  font-size: 38px;
  line-height: 42px;
}

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 700;
  display: grid;
  place-items: center;
  padding: 28px;
  background: rgba(0,0,0,.94);
  opacity: 0;
  pointer-events: none;
  transition: opacity 220ms ease;
}
.lightbox.open { opacity: 1; pointer-events: auto; }
.lightbox img {
  max-width: min(94vw, 1100px);
  max-height: 82dvh;
  object-fit: contain;
  box-shadow: 0 20px 70px rgba(0,0,0,.75);
}
.lightbox-caption {
  position: fixed;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  color: #e6ecff;
  font: 600 .9rem/1.4 system-ui, sans-serif;
  letter-spacing: .06em;
  text-align: center;
}

@media (pointer: coarse) {
  body, button, a { cursor: auto; }
  .flame, .hover-label { display: none; }
  .hotspot span { opacity: .72; }
  .hotspot::after { opacity: .18; }
}

@media (max-width: 700px) {
  .world-stage {
    /* Keep the whole figure visible on phones; never crop the hands. */
    width: min(100vw, calc(100dvh * 1170 / 1780));
    height: min(100dvh, calc(100vw * 1780 / 1170));
  }
  .panel { padding: 8px; }
  .panel-content {
    width: 98vw;
    max-height: 92dvh;
    border-radius: 18px;
    padding: 24px 18px 40px;
  }
  .work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
  .card-copy { padding: 10px; }
  .close-panel, .lightbox-close { top: 9px; right: 9px; }
}

.sound-widget {
  position: fixed;
  left: 14px;
  bottom: 14px;
  z-index: 80;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 11px 8px 8px;
  border: 1px solid rgba(126, 199, 255, .22);
  background: rgba(0, 4, 18, .58);
  backdrop-filter: blur(10px);
  border-radius: 999px;
  color: white;
  max-width: min(82vw, 330px);
}
.sound-widget button {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border: 1px solid rgba(151, 220, 255, .5);
  border-radius: 50%;
  background: rgba(24, 83, 160, .28);
  color: white;
  font: 700 13px/1 system-ui, sans-serif;
}
.sound-widget strong,
.sound-widget small {
  display: block;
  font-family: system-ui, sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sound-widget strong { font-size: 9px; letter-spacing: .12em; }
.sound-widget small { margin-top: 2px; color: #9ec8e9; font-size: 9px; letter-spacing: .09em; }

.enter-link {
  display: inline-block;
  margin-top: 10px;
  padding: 9px 12px;
  border: 1px solid rgba(133, 211, 255, .35);
  border-radius: 999px;
  color: #dff6ff;
  text-decoration: none;
  font: 700 .72rem/1 system-ui, sans-serif;
  letter-spacing: .12em;
}

.lightbox-media {
  display: grid;
  place-items: center;
  width: min(94vw, 1100px);
  max-height: 82dvh;
}
.lightbox-media > img,
.lightbox-media > video {
  display: block;
  max-width: min(94vw, 1100px);
  max-height: 78dvh;
  object-fit: contain;
}
.audio-stage {
  display: grid;
  gap: 18px;
  width: min(520px, 90vw);
}
.audio-stage img { width: 100%; max-height: 62dvh; object-fit: contain; }
.audio-stage audio { width: 100%; }

/* v4: section pages use the user's exact images as full-screen backgrounds. */
.panel.has-section-bg {
  background-image: linear-gradient(rgba(0,0,0,.22), rgba(0,0,0,.46)), var(--section-bg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  backdrop-filter: none;
  place-items: end start;
}
.panel.has-section-bg .panel-content { margin: 0 0 clamp(18px, 4vh, 48px) clamp(12px, 4vw, 52px); }

/* Smaller destination box so the environment and flame remain visible. */
.panel-content {
  width: min(640px, 72vw);
  max-height: 58dvh;
  padding: clamp(16px, 2.2vw, 28px);
  border-radius: 18px;
  background: rgba(3,7,16,.78);
  backdrop-filter: blur(8px);
  box-shadow: 0 18px 55px rgba(0,0,0,.55);
}
.panel-content h1 { font-size: clamp(2rem, 4vw, 3.6rem); }
.panel-content h2 { margin: 1rem 0 .35rem; font-size: clamp(1.05rem, 1.8vw, 1.45rem); }
.panel-content p, .panel-content li { font-size: clamp(.88rem, 1.2vw, 1rem); line-height: 1.52; }
.panel-content .lead { font-size: clamp(1rem, 1.45vw, 1.16rem) !important; }
.compact-grid { grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap: 9px; margin-top: 14px; }
.compact-grid .book-card, .compact-grid .object-card, .compact-grid .who-card { padding: 11px 12px; border-radius: 12px; }
.compact-grid .book-card h2, .compact-grid .who-card h2 { margin: 0 0 4px; font-size: .96rem; }
.compact-grid .book-card p { margin: 4px 0 8px; font-size: .78rem; line-height: 1.35; }
.enter-link { font: 700 .72rem/1 system-ui,sans-serif; letter-spacing: .08em; color:#9fddff; }

/* Keep the blue flame strongly visible over every page. */
.flame { z-index: 2000; }
.close-panel { z-index: 2100; }
.sound-widget { z-index: 2050; }
body.section-audio .sound-widget strong { color: #9fddff; }

@media (max-width:700px) {
  .panel.has-section-bg { background-position:center; place-items:end center; }
  .panel.has-section-bg .panel-content { margin: 0 6px 12px; }
  .panel-content { width: 94vw; max-height: 54dvh; padding: 15px 14px 26px; }
  .compact-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
/* v7 chakra map */
.hotspot{display:none!important}
.chakra,.hand{position:absolute;z-index:30;border:1px solid rgba(255,230,150,.38);background:rgba(2,5,13,.32);color:#fff;backdrop-filter:blur(3px);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-shadow:0 0 10px #000;box-shadow:0 0 20px rgba(75,160,255,.18);transition:.2s transform,.2s box-shadow}
.chakra:hover,.hand:hover{transform:scale(1.09);box-shadow:0 0 28px rgba(135,210,255,.5)}
.chakra small,.hand small{font:700 9px/1 system-ui,sans-serif;letter-spacing:.12em}.chakra{width:58px;height:58px;border-radius:50%}.hand{width:82px;height:62px;border-radius:48%}
.crown{left:50%;top:10%;transform:translate(-50%,-50%)}.crown:hover{transform:translate(-50%,-50%) scale(1.09)}
.pineal{left:50%;top:22%;transform:translate(-50%,-50%)}.pineal:hover{transform:translate(-50%,-50%) scale(1.09)}
.eight-star{font-size:38px;line-height:.7;text-shadow:0 0 12px #a8dfff,0 0 22px #795cff}
.throat{left:50%;top:31%;transform:translate(-50%,-50%)}.throat:hover{transform:translate(-50%,-50%) scale(1.09)}
.heart{left:50%;top:42%;transform:translate(-50%,-50%)}.heart:hover{transform:translate(-50%,-50%) scale(1.09)}.spiral{font-size:28px}
.root{left:50%;top:67%;transform:translate(-50%,-50%)}.root:hover{transform:translate(-50%,-50%) scale(1.09)}
.hand-left{left:22%;top:47%;}.hand-right{right:22%;top:47%}.hand-left span,.hand-right span{font-size:30px}.hand-right{box-shadow:0 0 25px rgba(255,190,70,.3)}.hand-left{box-shadow:0 0 25px rgba(120,170,255,.3)}
.book-card{cursor:pointer;text-align:left;color:inherit;background:rgba(8,15,30,.68)}
.placeholder-art{aspect-ratio:3/4;display:grid;place-items:center;padding:14px;background:radial-gradient(circle at 50% 35%,#17305a,#030712 70%);font:700 1rem/1.2 system-ui,sans-serif;letter-spacing:.08em}
.lightbox-media iframe{width:min(92vw,1000px);height:82vh;border:0;background:#fff;border-radius:10px}.media-pending{min-width:min(82vw,600px);min-height:280px;display:grid;place-items:center;align-content:center;gap:12px;padding:30px;background:#070b16;border:1px solid rgba(255,255,255,.16);border-radius:16px;text-align:center}.media-pending strong{font-size:2rem}.media-pending span{opacity:.72}
@media(max-width:700px){.chakra{width:48px;height:48px}.hand{width:66px;height:52px}.hand-left{left:12%}.hand-right{right:12%}.chakra small,.hand small{font-size:7px}.eight-star{font-size:30px}}
/* Build 8: waist rainbow-triangle doorway */
.waist-symbol{position:absolute;left:50%;top:70%;transform:translate(-50%,-50%);z-index:8;width:68px;height:68px;border:0;background:transparent;cursor:pointer;filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 18px #7b5cff)}
.rainbow-triangle{display:block;font-size:66px;line-height:1;font-weight:800;background:conic-gradient(#ff3b30,#ffcc00,#34c759,#00c7ff,#5856d6,#ff2d55,#ff3b30);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 18px rgba(255,255,255,.35)}
.waist-symbol:hover,.waist-symbol:focus-visible{transform:translate(-50%,-50%) scale(1.12)}
.panel.has-section-bg::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(1,3,10,.58),rgba(1,3,10,.78)),var(--section-bg);background-size:cover;background-position:center;z-index:-1}

/* BUILD 9 CORRECTIONS — restore a clean symbolic home map. */
.chakra,.hand{border:0!important;background:transparent!important;backdrop-filter:none!important;box-shadow:none!important;width:58px;height:58px;color:#fff;padding:0;}
.chakra small,.hand small{display:none!important}
.chakra span,.hand span{filter:drop-shadow(0 0 7px #000) drop-shadow(0 0 10px rgba(120,205,255,.85));}
.symbol-only{font-size:30px}.eight-star{font-size:43px;line-height:1}.spiral{font-size:30px}.hand span{font-size:34px!important}
.root-vortex{display:block;width:38px;height:38px;border-radius:50%;background:url('assets/backgrounds/root.jpg') center/cover no-repeat;box-shadow:0 0 15px rgba(130,100,255,.8)}
/* no fake/drawn waist triangle in this build */
.waist-symbol{display:none!important}
/* Section pages: smaller, centered, and fully visible. */
.panel{padding:18px;overflow:auto;cursor:auto!important}
.panel-content{width:min(900px,88vw)!important;max-height:82dvh!important;margin:auto!important;padding:clamp(18px,3vw,38px)!important;border-radius:22px;cursor:auto!important}
.panel-content *, .close-panel, .lightbox, .lightbox *{cursor:auto!important}
/* Keep custom flame visible, but never force the user to rely on it inside pages. */
.flame{z-index:4000!important}
.close-panel,.lightbox-close{z-index:4100!important}
.sound-widget{z-index:4050!important}
/* Music library / record player */
.record-player{display:flex;align-items:center;gap:24px;margin:18px 0 24px;padding:18px;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:rgba(0,0,0,.35)}
.vinyl,.mini-record{border-radius:50%;background:repeating-radial-gradient(circle at center,#111 0 3px,#252525 4px 5px,#0a0a0a 6px 8px);box-shadow:0 0 20px rgba(0,0,0,.7)}
.vinyl{width:120px;height:120px;display:grid;place-items:center;flex:0 0 auto}.vinyl-label{width:44px;height:44px;border-radius:50%;background:#d8b04d;color:#111;display:grid;place-items:center;font:700 8px system-ui;text-align:center}
.vinyl.spinning{animation:spinRecord 2.4s linear infinite}@keyframes spinRecord{to{transform:rotate(360deg)}}
.now-playing{display:flex;flex-direction:column;gap:6px}.now-playing small{font:700 10px system-ui;letter-spacing:.18em;color:#8bd8ff}.now-playing strong{font-size:clamp(1.1rem,2vw,1.6rem)}
.track-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}.track-card{display:flex;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:11px;background:rgba(4,8,20,.72);color:#fff;text-align:left}.track-card:hover,.track-card.active{border-color:#8bd8ff;background:rgba(20,60,95,.55)}.mini-record{width:34px;height:34px;flex:0 0 auto}.track-card strong{font:700 11px/1.25 system-ui;letter-spacing:.06em}
@media(max-width:700px){.panel-content{width:94vw!important;max-height:84dvh!important}.record-player{gap:14px}.vinyl{width:82px;height:82px}.eight-star{font-size:36px}}
.book-preview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start;max-width:1100px;margin:auto}.book-preview figure{margin:0}.book-preview img{width:100%;height:auto;display:block;background:#fff}.book-preview figcaption,.preview-limit{text-align:center;margin-top:8px}.preview-limit{grid-column:1/-1;font-weight:700;letter-spacing:.08em}@media(max-width:760px){.book-preview{grid-template-columns:1fr}}
.preview-badge{display:inline-block;padding:.45rem .8rem;border:1px solid rgba(255,255,255,.55);border-radius:999px;letter-spacing:.14em;font-size:.75rem;background:rgba(0,0,0,.45);margin:.2rem 0 1rem}

/* Build 12 — precise centerline chakra placement */
.crown{left:50%!important;top:12.2%!important;transform:translate(-50%,-50%)!important}
.crown:hover{transform:translate(-50%,-50%) scale(1.09)!important}
.pineal{left:50%!important;top:20.0%!important;transform:translate(-50%,-50%)!important}
.pineal:hover{transform:translate(-50%,-50%) scale(1.09)!important}
.eight-star{display:block!important;transform:rotate(0deg)!important;transform-origin:50% 50%!important;text-align:center!important}
.throat{left:50%!important;top:29.5%!important;transform:translate(-50%,-50%)!important}
.throat:hover{transform:translate(-50%,-50%) scale(1.09)!important}
.heart{left:50%!important;top:43.5%!important;transform:translate(-50%,-50%)!important}
.heart:hover{transform:translate(-50%,-50%) scale(1.09)!important}
.root{left:50%!important;top:69%!important;transform:translate(-50%,-50%)!important}
.root:hover{transform:translate(-50%,-50%) scale(1.09)!important}

/* Build 12 — one-page-at-a-time book preview */
.flipbook{position:relative;width:min(92vw,760px);height:min(82vh,920px);margin:auto;display:grid;grid-template-columns:64px 1fr 64px;grid-template-rows:1fr auto;align-items:center;perspective:1800px}
.page-stage{height:100%;min-height:0;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.flip-page{position:absolute;inset:0;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;pointer-events:none;transform-origin:left center;transform:rotateY(-88deg);transition:transform .38s ease,opacity .25s ease}
.flip-page.active{opacity:1;pointer-events:auto;transform:rotateY(0)}
.flip-page.turn-next{transform:rotateY(-88deg);opacity:0}.flip-page.turn-prev{transform:rotateY(88deg);opacity:0}
.flip-page img{display:block;max-width:100%;max-height:calc(100% - 44px);width:auto;height:auto;object-fit:contain;background:#fff;box-shadow:0 16px 45px #000}
.flip-page figcaption{height:32px;padding-top:8px;font-weight:800;letter-spacing:.08em;text-align:center}
.page-arrow{width:52px;height:72px;border-radius:18px;border:1px solid rgba(255,255,255,.4);background:rgba(4,8,20,.76);color:#fff;font-size:48px;line-height:1;cursor:pointer;z-index:3}.page-arrow:disabled{opacity:.25;cursor:default}
.page-counter{grid-column:1/-1;text-align:center;font-weight:900;letter-spacing:.12em;padding-top:10px}

/* Build 12 — music room: each circle is a song */
.music-map{position:relative;width:min(82vw,760px);aspect-ratio:1/1;margin:8px auto 20px;border-radius:50%;overflow:hidden;box-shadow:0 0 50px rgba(120,80,255,.34)}
.music-map>img{width:100%;height:100%;object-fit:cover;display:block}
.music-orb{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);width:9.5%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(255,255,255,.72);background:rgba(0,0,0,.18);color:#fff;cursor:pointer;box-shadow:0 0 18px rgba(255,255,255,.38);display:grid;place-items:center;padding:0;transition:transform .18s,box-shadow .18s}
.music-orb:hover,.music-orb.active{transform:translate(-50%,-50%) scale(1.16);box-shadow:0 0 28px rgba(255,255,255,.8)}
.music-orb span{font:800 clamp(8px,1.3vw,12px)/1 system-ui,sans-serif;text-shadow:0 1px 5px #000}
.music-orb.center-orb{width:12%;border-width:2px}.music-orb.center-orb span{font-size:clamp(7px,1.2vw,11px)}
.music-map-now{text-align:center;margin-bottom:18px}
@media(max-width:700px){.flipbook{width:96vw;height:78vh;grid-template-columns:46px 1fr 46px}.page-arrow{width:40px;height:60px;font-size:40px}.music-map{width:92vw}}
/* Build 13 content refinement */
.music-orb span{display:block;max-width:92px;padding:4px 6px;border-radius:10px;background:rgba(0,0,0,.72);font-size:clamp(7px,.8vw,11px);line-height:1.05;text-align:center;color:#fff;text-shadow:0 1px 3px #000;white-space:normal}
.music-orb.center-orb span{font-size:clamp(9px,1vw,13px);font-weight:800}
.book-presentation{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.book-card.detailed{display:flex;flex-direction:column;justify-content:space-between;text-align:left;min-height:330px;padding:22px;background:rgba(3,7,18,.82);border:1px solid rgba(255,255,255,.18);border-radius:18px}
.book-card.detailed h2{margin:.3rem 0 .5rem}.book-card.detailed p{margin:.45rem 0}.book-theme{font-weight:700}.isbn{opacity:.72;font-size:.84rem!important}.preview-badge{display:inline-block;margin-top:8px;padding:5px 9px;border:1px solid rgba(255,255,255,.3);border-radius:999px;font-size:.72rem;letter-spacing:.08em}.enter-book{margin-top:18px;width:100%;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;font-weight:800;cursor:pointer}

/* Build 14 — corrected vertical alignment after removing screenshot header. */
.crown{left:50%!important;top:11.5%!important;transform:translate(-50%,-50%)!important}
.pineal{left:50%!important;top:20.5%!important;transform:translate(-50%,-50%)!important}
.eight-star{transform:rotate(0deg)!important;display:inline-block!important;line-height:1!important}
.throat{left:50%!important;top:31.0%!important;transform:translate(-50%,-50%)!important}
.heart{left:50%!important;top:46.5%!important;transform:translate(-50%,-50%)!important}
/* screen-right is the being's left/reaching hand: physical products / crystal dome */
.hand-right{right:18%!important;top:54%!important}
/* screen-left is the being's right hand: moon / consumables */
.hand-left{left:18%!important;top:50%!important}

/* Build 16 — user-directed chakra and music-circle corrections. */
.crown{left:50%!important;top:13.5%!important;transform:translate(-50%,-50%)!important}
.pineal{left:50%!important;top:23.0%!important;transform:translate(-50%,-50%)!important}
.eight-star{transform:rotate(22.5deg)!important;transform-origin:50% 50%!important}
.throat{left:50%!important;top:33.0%!important;transform:translate(-50%,-50%)!important}
.heart{left:50%!important;top:48.5%!important;transform:translate(-50%,-50%)!important}

/* Build 18: hands stay clickable with no sun/moon icons; glow only on hover/focus */
.hand{background:transparent!important;border:0!important;box-shadow:none!important;}
.hand:hover,.hand:focus-visible{box-shadow:0 0 18px 8px rgba(150,215,255,.65),0 0 42px 18px rgba(110,175,255,.35)!important;filter:drop-shadow(0 0 12px rgba(170,225,255,.85));}

/* Build 18 corrected — full-screen section presentation */
.panel { padding: 0 !important; place-items: stretch !important; }
.panel-content {
  width: 100vw !important;
  height: 100dvh !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: clamp(52px, 6vw, 88px) clamp(24px, 7vw, 110px) !important;
  background: linear-gradient(180deg, rgba(5,10,24,.88), rgba(2,5,14,.94));
}
.panel.has-section-bg .panel-content { margin: 0 !important; }

.products-coming { min-height: calc(100dvh - 120px); display:flex; flex-direction:column; justify-content:center; }
.products-coming h1 { text-align:center; margin-bottom:clamp(26px,5vh,58px); }
.product-preview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,2.5vw,34px); width:min(1500px,100%); margin:0 auto; }
.product-preview-card { overflow:hidden; border:1px solid var(--line); border-radius:22px; background:rgba(0,0,0,.48); box-shadow:0 18px 60px rgba(0,0,0,.38); }
.product-preview-card img { width:100%; aspect-ratio:1/1; object-fit:contain; display:block; background:#000; }
.product-preview-card strong { display:block; padding:18px 12px 20px; text-align:center; font:800 clamp(.95rem,1.5vw,1.3rem)/1.2 system-ui,sans-serif; letter-spacing:.12em; }

/* Music map can now use the screen instead of being constrained to a narrow card. */
.music-map { width:min(86dvh,88vw,980px); max-width:100%; }
@media(max-width:700px){
  .panel-content { padding:58px 14px 28px !important; }
  .product-preview-grid { grid-template-columns:1fr; }
  .products-coming { justify-content:flex-start; }
  .music-map { width:min(94vw,82dvh); }
}


/* CYMATICS PORTAL — small in the Star Path world, zooms in without removing the background. */
.cymatics-portal{position:absolute;left:8%;bottom:8%;z-index:35;width:66px;height:66px;border:0;background:transparent;cursor:pointer;padding:0;filter:drop-shadow(0 0 10px rgba(120,210,255,.75))}
.cymatics-mini{display:block;width:58px;height:58px;border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 6px,rgba(145,220,255,.62) 7px 8px),repeating-conic-gradient(rgba(150,95,255,.55) 0 8deg,rgba(35,205,255,.22) 9deg 17deg);box-shadow:inset 0 0 18px #020611,0 0 16px rgba(90,190,255,.7)}
.cymatics-panel{background-color:transparent!important;place-items:center!important}.cymatics-panel .panel-content{width:100vw!important;height:100dvh!important;max-height:none!important;margin:0!important;padding:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;overflow:hidden!important}.cymatics-panel::before{background-image:linear-gradient(rgba(1,3,10,.12),rgba(1,3,10,.24)),var(--section-bg)!important;background-size:cover!important;background-position:center!important}.cymatics-panel>.close-panel{display:none}
.cymatics-room{position:relative;width:100%;height:100%;display:grid;place-items:center;overflow:hidden}.cym-exit{position:absolute;right:22px;top:20px;z-index:30;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.6);background:rgba(0,0,0,.55);color:#fff;font-size:30px;cursor:pointer}
.cymatics-rig{position:relative;width:min(430px,55vw);aspect-ratio:1;transform:scale(.24);opacity:.88;transition:transform .72s cubic-bezier(.18,.82,.22,1),opacity .4s}.cymatics-rig.zoomed{transform:scale(1)}
.cym-sphere{position:absolute;inset:16%;width:68%;height:68%;z-index:5;border-radius:50%;filter:drop-shadow(0 0 22px rgba(90,205,255,.85));background:rgba(0,0,0,.28)}
.cym-arm{position:absolute;z-index:8;width:48%;height:52px;border:0;background:transparent;color:#fff;cursor:pointer;transition:transform .48s ease,opacity .3s;text-shadow:0 2px 5px #000}.cym-arm .forearm{position:absolute;left:0;right:0;top:12px;height:26px;border:1px solid rgba(205,230,255,.72);border-radius:15px 7px 7px 15px;background:linear-gradient(180deg,rgba(190,215,230,.94),rgba(44,61,78,.96) 48%,rgba(8,17,30,.98));box-shadow:0 0 14px rgba(90,190,255,.48),inset 0 0 0 2px rgba(0,0,0,.3)}.cym-arm .forearm:after{content:'';position:absolute;right:-15px;top:4px;width:22px;height:18px;border:2px solid rgba(210,235,250,.8);border-left:0;border-radius:0 11px 11px 0;background:rgba(10,20,34,.92)}.cym-arm .forearm i{position:absolute;top:3px;width:5px;height:18px;background:rgba(10,22,38,.75);border-radius:2px}.cym-arm .forearm i:nth-child(1){left:24%}.cym-arm .forearm i:nth-child(2){left:48%}.cym-arm .forearm i:nth-child(3){left:72%}.cym-arm b{position:absolute;white-space:nowrap;font:700 10px/1 system-ui,sans-serif;letter-spacing:.09em;background:rgba(0,0,0,.72);padding:5px 7px;border-radius:7px}
.arm-1{left:-27%;top:12%;transform:rotate(38deg)}.arm-1 b{left:0;top:-18px}.arm-2{right:-27%;top:12%;transform:rotate(142deg)}.arm-2 b{right:0;top:-18px;transform:rotate(180deg)}.arm-3{left:-27%;bottom:12%;transform:rotate(-38deg)}.arm-3 b{left:0;bottom:-18px}.arm-4{right:-27%;bottom:12%;transform:rotate(-142deg)}.arm-4 b{right:0;bottom:-18px;transform:rotate(180deg)}
.cymatics-rig.released .arm-1{transform:translate(-115px,-80px) rotate(38deg)}.cymatics-rig.released .arm-2{transform:translate(115px,-80px) rotate(142deg)}.cymatics-rig.released .arm-3{transform:translate(-115px,80px) rotate(-38deg)}.cymatics-rig.released .arm-4{transform:translate(115px,80px) rotate(-142deg)}
.cym-tray{position:absolute;left:108%;top:2%;width:min(350px,72vw);max-height:96%;overflow:auto;padding:14px;border-radius:14px;background:rgba(2,7,18,.93);border:1px solid rgba(180,225,255,.42);opacity:0;pointer-events:none;transform:translateX(36px);transition:.35s;z-index:20}.cym-tray.open{opacity:1;pointer-events:auto;transform:translateX(0)}.cym-tray>strong{display:block;margin-bottom:8px;letter-spacing:.12em}.cym-track{display:block;width:100%;margin:6px 0;padding:10px;border:1px solid rgba(255,255,255,.2);border-radius:9px;background:rgba(255,255,255,.07);color:#fff;text-align:left;cursor:pointer}.cym-track:hover{background:rgba(120,205,255,.16)}
@media(max-width:700px){.cymatics-portal{left:4%;bottom:5%;width:58px;height:58px}.cymatics-mini{width:50px;height:50px}.cymatics-rig{width:min(310px,64vw)}.cym-tray{left:50%;top:106%;transform:translate(-50%,25px);max-height:36vh}.cym-tray.open{transform:translate(-50%,0)}}

/* BUILD 39 PATH — final wide homepage art; clickable regions only, no replacement artwork. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.world-stage{width:min(100vw,calc(100dvh * 1648 / 924))!important;height:min(100dvh,calc(100vw * 924 / 1648))!important;aspect-ratio:1648/924!important}
.world-image{object-fit:contain!important;width:100%!important;height:100%!important}
.world-stage .chakra,.world-stage .hand,.cymatics-portal,.inner-g-portal{background:transparent!important;border:0!important;box-shadow:none!important;color:transparent!important;opacity:1!important;position:absolute;z-index:12;cursor:pointer}
.world-stage .chakra span,.cymatics-portal span,.inner-g-portal span{display:none!important}
.crown{left:47%!important;top:5%!important;width:7%!important;height:13%!important}
.pineal{left:47%!important;top:15%!important;width:7%!important;height:10%!important}
.throat{left:47%!important;top:29%!important;width:7%!important;height:12%!important}
.heart{left:46%!important;top:43%!important;width:9%!important;height:13%!important}
.root{left:45%!important;top:61%!important;width:11%!important;height:15%!important}
.hand-left{left:23%!important;top:46%!important;width:15%!important;height:18%!important}
.hand-right{left:62%!important;top:46%!important;width:15%!important;height:18%!important}
.cymatics-portal{left:1.8%!important;bottom:3.3%!important;width:11.5%!important;height:16%!important;transform:none!important}
.inner-g-portal{right:1.8%!important;bottom:3.3%!important;width:11.5%!important;height:16%!important}
.feature-room-image{display:block;width:min(100%,1400px);height:auto;margin:1rem auto;border-radius:18px;box-shadow:0 24px 80px rgba(0,0,0,.45)}
@media(max-width:700px){.world-stage{width:100vw!important;height:auto!important;aspect-ratio:1648/924!important}.sound-widget{transform:scale(.82);transform-origin:bottom right}}