/* Ember hallway-mirror layer · 2026-11-14b
   Palette and motion lifted from jt-living-aura.js / themes.json (Aura Ember).
   Designed sacred geometry (Flower of Life + Metatron’s Cube), not random.
   Rollback: ~/maint/site-20261114b/ROLLBACK.md */

:root{
  --ember-void:#12060f;
  --ember-ink:#f6f0f4;
  --ember-dim:#b9a8b4;
  --ember-mute:#7a6a74;
  --ember-dot:#FF3B5C;
  --ember-hot:#ff3a3d;
  --ember-pink:#ff5a8f;
  --ember-violet:#8f78f2;
  --ember-cyan:#5ec8f0;
  --ember-deep:#3e0b26;
  --ember-card:rgba(10,2,8,.72);
  --ember-line:rgba(94,200,240,.32);
  --ember-glow:rgba(255,90,143,.22);
  --tide-dot:#3FD0C0;
  --coral-dot:#FF7A50;
  --ember-breath:8.6s;
}

html{background:#000}
body{background:#000;color:var(--ember-ink);position:relative}

/* ---- fixed Ember field (behind all content) ---- */
.ember-field{
  position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  background:#000;
}
.ember-field .ember-glow{
  position:absolute;left:5%;right:5%;top:4%;bottom:4%;
  border-radius:28% / 18%;
  background:
    radial-gradient(ellipse 52% 52% at 50% 50%,
      #12060f 0%,
      #1d0815 16%,
      #3e0b26 28%,
      #9c1734 40%,
      #ff3a3d 52%,
      #ff5a8f 64%,
      #e95bd0 74%,
      #8f78f2 86%,
      #5ec8f0 96%,
      #3aa8e0 100%);
  opacity:.52;
  filter:blur(10px) saturate(1.15);
  transform:scale(.97);
  animation:ember-breath var(--ember-breath) ease-in-out infinite,
             ember-hue 53s ease-in-out infinite;
}
.ember-field[data-theme="tide"] .ember-glow{
  background:radial-gradient(ellipse 52% 52% at 50% 50%,
    #03060f 0%,#050d22 18%,#0a2f48 30%,#14a17e 42%,#1cc0b0 52%,
    #2a74e6 64%,#4d63ee 76%,#8578f0 88%,#a596f6 96%,#9486ee 100%);
}
.ember-field[data-theme="coral"] .ember-glow{
  background:radial-gradient(ellipse 52% 52% at 50% 50%,
    #0e050a 0%,#170710 18%,#3a0e1e 30%,#9a2a18 42%,#f0581c 54%,
    #ff7a2e 66%,#ff6f61 80%,#ff8a7a 92%,#ff9686 100%);
}
@keyframes ember-breath{
  0%,100%{transform:scale(.97);opacity:.48}
  50%{transform:scale(1.02);opacity:.62}
}
@keyframes ember-hue{
  0%,100%{filter:blur(10px) saturate(1.15) hue-rotate(0deg)}
  50%{filter:blur(10px) saturate(1.2) hue-rotate(8deg)}
}
.ember-field .ember-geo{
  position:absolute;left:50%;top:50%;
  width:min(78vw,78vh);height:min(78vw,78vh);
  transform:translate(-50%,-50%) scale(.97);
  transform-origin:center;
  animation:ember-geo-breath var(--ember-breath) ease-in-out infinite,
             ember-geo-spin 720s linear infinite;
  opacity:.9;
  filter:drop-shadow(0 0 18px rgba(255,58,61,.35)) drop-shadow(0 0 28px rgba(143,120,242,.25));
}
@keyframes ember-geo-breath{
  0%,100%{transform:translate(-50%,-50%) scale(.97)}
  50%{transform:translate(-50%,-50%) scale(1.02)}
}
@keyframes ember-geo-spin{
  from{transform:translate(-50%,-50%) scale(.97) rotate(0deg)}
  to{transform:translate(-50%,-50%) scale(.97) rotate(360deg)}
}
/* combine spin + breath via wrapper */
.ember-field .ember-geo-spin{
  position:absolute;left:50%;top:50%;
  width:min(78vw,78vh);height:min(78vw,78vh);
  margin:0;
  transform:translate(-50%,-50%);
  animation:ember-spin 720s linear infinite;
}
.ember-field .ember-geo-spin .ember-geo{
  position:absolute;inset:0;width:100%;height:100%;
  transform:none;
  animation:ember-geo-scale var(--ember-breath) ease-in-out infinite;
  filter:drop-shadow(0 0 18px rgba(255,58,61,.35)) drop-shadow(0 0 28px rgba(143,120,242,.25));
}
@keyframes ember-spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes ember-geo-scale{
  0%,100%{transform:scale(.97)}
  50%{transform:scale(1.02)}
}
.ember-field svg{width:100%;height:100%;display:block;overflow:visible}
.ember-field .fol{fill:none;stroke:#ff5a8f;stroke-width:.55;opacity:.55}
.ember-field .fol-inner{fill:none;stroke:#ff3a3d;stroke-width:.7;opacity:.8}
.ember-field .meta{stroke:#e95bd0;stroke-width:.28;opacity:.42}
.ember-field .star{fill:none;stroke:#8f78f2;stroke-width:.6;opacity:.7}
.ember-field .bound{fill:none;stroke:#5ec8f0;stroke-width:.45;opacity:.55}

header.nav,main,footer,.foot,body > .skip{position:relative;z-index:1}
header.nav{z-index:50}

/* Hero: let the Ember field show; hide the competing orb/starfield (Ember is orb-free). */
.sl-hero{background:transparent}
.sl-hero #sl-orb,.sl-hero .sl-stars{opacity:0!important;visibility:hidden}
.sl-hero .sl-copy{
  text-shadow:0 0 40px rgba(0,0,0,.65),0 2px 16px rgba(18,6,15,.8);
}
.sl-hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 70% 60% at 50% 45%,transparent 30%,rgba(0,0,0,.45) 100%);
}

/* Recolour the existing theme toward Ember (overrides polymind cream / as.css white) */
html:not(.pm-theme-off){
  --blue:#ff5a8f;
  --blue2:#5ec8f0;
  --red:#ff3a3d;
  --ink:var(--ember-ink);
  --dim:var(--ember-dim);
  --mute:var(--ember-mute);
  --sl-ink:var(--ember-ink);
  --sl-dim:var(--ember-dim);
  --sl-mute:var(--ember-mute);
  --sl-acc:#ff5a8f;
  --sl-acc2:#5ec8f0;
  --sl-glow:rgba(255,90,143,.28);
  --live-hue:340;
  --live-hue2:190;
}
html:not(.pm-theme-off) .tick{background:#ff5a8f!important;box-shadow:0 0 10px rgba(255,90,143,.45)}
html:not(.pm-theme-off) .btn-primary{
  background:linear-gradient(180deg,#ff5a8f,#ff3a3d);
  color:#fff;box-shadow:0 0 24px rgba(255,58,61,.35);
}
html:not(.pm-theme-off) .btn-primary:hover{background:linear-gradient(180deg,#ff7aa8,#ff5a4a);color:#fff}
html:not(.pm-theme-off) .btn-ghost{
  border-color:rgba(94,200,240,.42);
  background:rgba(18,6,15,.4);
  color:var(--ember-ink);
}
html:not(.pm-theme-off) .nav{
  background:rgba(8,2,10,.62);
  border-bottom-color:rgba(94,200,240,.14);
}
html:not(.pm-theme-off) .nav-links .nav-cta{
  background:linear-gradient(180deg,#ff5a8f,#ff3a3d);color:#fff;
}

/* Glass cards in the Ember / Super Jarvis style */
html:not(.pm-theme-off) .tile,
html:not(.pm-theme-off) .xcard,
html:not(.pm-theme-off) .promise div,
html:not(.pm-theme-off) .chat,
html:not(.pm-theme-off) .buy-card,
html:not(.pm-theme-off) .care-card,
html:not(.pm-theme-off) .sl-pillar,
html:not(.pm-theme-off) .sl-card,
html:not(.pm-theme-off) .for-you-card,
html:not(.pm-theme-off) .nf-card,
.ember-card,
.ember-widget{
  border-radius:16px;
  border:1px solid var(--ember-line);
  background:linear-gradient(180deg,rgba(28,8,20,.62),rgba(8,2,10,.82));
  box-shadow:0 0 0 1px rgba(255,58,61,.08),0 8px 32px rgba(18,6,15,.45),0 0 24px rgba(143,120,242,.08);
  backdrop-filter:blur(16px) saturate(140%);
  -webkit-backdrop-filter:blur(16px) saturate(140%);
}

/* ---- Ember intro + theme chips ---- */
.ember-sec{position:relative;padding:72px 0 40px}
.ember-themes{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin:28px 0 0}
.ember-chip{
  appearance:none;border:1px solid var(--ember-line);background:rgba(8,2,10,.6);
  color:var(--ember-ink);border-radius:999px;padding:8px 16px;cursor:pointer;
  font:inherit;font-size:13px;letter-spacing:.08em;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:8px;
}
.ember-chip .dot{width:10px;height:10px;border-radius:50%;display:block;box-shadow:0 0 10px currentColor}
.ember-chip[data-theme="ember"] .dot{background:#FF3B5C;color:#FF3B5C}
.ember-chip[data-theme="tide"] .dot{background:#3FD0C0;color:#3FD0C0}
.ember-chip[data-theme="coral"] .dot{background:#FF7A50;color:#FF7A50}
.ember-chip[aria-pressed="true"]{border-color:#5ec8f0;box-shadow:0 0 0 1px rgba(94,200,240,.45),0 0 18px rgba(255,90,143,.25)}
.ember-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:40px}
@media (max-width:860px){.ember-facts{grid-template-columns:1fr}}
.ember-card{padding:22px 22px 20px}
.ember-card h3{margin:10px 0 8px;font-weight:400;font-size:20px;letter-spacing:-.015em}
.ember-card p{margin:0;color:#d5c6ce;font-size:15px;line-height:1.6}
.ember-kicker{margin:0;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ember-cyan)}

/* ---- Widget wall ---- */
.ember-widgets{position:relative;padding:48px 0 80px}
.ember-widgets .wrap{max-width:1180px}
.ember-wg-note{max-width:42em}
.ember-wg-group{margin-top:36px}
.ember-wg-group h3{
  margin:0 0 14px;font-weight:400;font-size:13px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--ember-cyan);
}
.ember-wg-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:14px;
}
.ember-widget{position:relative;padding:16px 16px 14px;min-height:132px;overflow:hidden}
.ember-widget h4{margin:22px 0 6px;font-weight:400;font-size:16px;letter-spacing:-.01em}
.ember-widget .ember-widget-mod{
  position:absolute;top:12px;left:16px;margin:0;
  font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ember-mute);
}
.ember-widget p{margin:0;color:#cbb8c2;font-size:13.5px;line-height:1.5}
.ember-widget .sample-body{
  margin-top:10px;padding:8px 10px;border-radius:10px;
  border:1px dashed rgba(94,200,240,.28);
  color:#e6d4dc;font-size:13px;
}
.ember-badge{
  position:absolute;top:10px;right:10px;
  display:inline-flex;align-items:center;gap:5px;
  font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  padding:3px 8px;border-radius:999px;
  border:1px solid rgba(94,200,240,.3);
  color:#d7eef7;background:rgba(0,0,0,.35);
}
.ember-widget.is-locked{
  border-color:rgba(255,90,143,.28);
}
.ember-widget.is-locked .ember-badge{
  border-color:rgba(255,90,143,.45);color:#ffd0dc;
  background:rgba(62,11,38,.55);
}
.ember-widget .ember-clock-time{
  font-size:34px;font-weight:300;letter-spacing:-.03em;line-height:1;margin:8px 0 4px;
}
.ember-widget .ember-clock-date{color:var(--ember-dim);font-size:13px;margin:0}
.ember-tess{
  height:72px;margin:8px 0 4px;display:block;
  filter:drop-shadow(0 0 8px rgba(94,200,240,.45));
}
.ember-tess-spin{transform-origin:60px 40px;animation:ember-tess 18s linear infinite}
@keyframes ember-tess{to{transform:rotate(360deg)}}

.sl-status.today,.sl-status.working{/* keep existing */ }

@media (prefers-reduced-motion:reduce){
  .ember-field .ember-glow,
  .ember-field .ember-geo,
  .ember-field .ember-geo-spin,
  .ember-field .ember-geo-spin .ember-geo,
  .ember-tess-spin{
    animation:none!important;
    filter:blur(10px) saturate(1.15);
  }
  .ember-field .ember-glow{opacity:.52;transform:none}
  .ember-field .ember-geo-spin{transform:translate(-50%,-50%)}
  .ember-field .ember-geo-spin .ember-geo{transform:none}
  html{scroll-behavior:auto}
}