:root{
  --exact-pink:#ff2f87;
  --exact-pink-deep:#ed136e;
  --exact-aqua:#22c6d3;
  --exact-aqua-deep:#0c98a7;
  --exact-lime:#99dc00;
  --exact-lime-deep:#72b900;
  --exact-purple:#b45ad8;
  --exact-navy:#123b56;
  --exact-ink:#162d37;
  --exact-line:#d9e9eb;
  --exact-paper:#fff;
}

html{background:#fffafc!important;}
body{
  color:var(--exact-ink)!important;
  background:
    radial-gradient(circle at 4% 7%,rgba(255,47,135,.19),transparent 20rem),
    radial-gradient(circle at 96% 8%,rgba(34,198,211,.17),transparent 22rem),
    radial-gradient(circle at 6% 94%,rgba(34,198,211,.13),transparent 22rem),
    radial-gradient(circle at 94% 94%,rgba(255,47,135,.14),transparent 24rem),
    #fffdfd!important;
}

.retreat-masthead{
  width:min(100% - 28px,1220px);
  margin:18px auto 6px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:24px;
  color:var(--exact-navy);
  position:relative;
  z-index:3;
}
.retreat-logo{display:flex;flex-direction:column;align-items:flex-start;line-height:1;}
.retreat-logo strong{font-family:"DM Sans",sans-serif;font-size:clamp(30px,4.3vw,58px);font-weight:800;letter-spacing:-.06em;font-style:italic;white-space:nowrap;}
.retreat-logo strong span{color:var(--exact-pink);text-shadow:0 3px 0 rgba(255,47,135,.08);}
.retreat-logo strong em{color:var(--exact-lime);font-style:italic;}
.retreat-logo small{margin-top:8px;padding-left:6px;font-size:clamp(8px,1vw,13px);font-weight:800;letter-spacing:.28em;color:#0c6078;white-space:nowrap;}
.retreat-heartline{width:190px;max-width:22vw;color:var(--exact-pink);}
.retreat-heartline svg{display:block;width:100%;height:auto;}
.retreat-tagline{text-align:right;line-height:1.05;}
.retreat-tagline .main{font-family:"Newsreader",Georgia,serif;font-size:clamp(19px,2.1vw,34px);white-space:nowrap;color:#17344c;}
.retreat-tagline .main span{font-family:"Segoe Script","Brush Script MT",cursive;font-size:1.12em;color:var(--exact-pink);}
.retreat-tagline small{display:block;margin-top:8px;font-size:clamp(7px,.8vw,11px);font-weight:800;letter-spacing:.24em;color:#315e71;white-space:nowrap;}

/* Each live day is presented as one panel from the approved 4-panel mockup. */
.shell{
  width:min(100% - 24px,760px)!important;
  min-height:auto!important;
  margin:10px auto 30px!important;
  padding:0 0 24px!important;
  border:1px solid rgba(182,215,221,.76)!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:0 15px 35px rgba(44,87,99,.11)!important;
  position:relative!important;
  isolation:isolate;
}
.shell::before{
  content:""!important;
  position:absolute!important;
  inset:72px 0 0!important;
  z-index:-2!important;
  border-radius:0 0 24px 24px!important;
  transform:none!important;
  opacity:1!important;
  filter:none!important;
  pointer-events:none!important;
}

/* approved top strip */
.topbar{
  min-height:72px!important;
  margin:0!important;
  padding:0 26px!important;
  border:0!important;
  border-bottom:1px solid #e7eff0!important;
  border-radius:0!important;
  background:rgba(255,255,255,.97)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.brand-mark,.brand{color:var(--exact-navy)!important;font-size:13px!important;font-weight:800!important;letter-spacing:.12em!important;text-transform:uppercase!important;}
.brand-icon,.cross{
  width:34px!important;height:34px!important;
  border:0!important;border-radius:8px!important;
  color:#fff!important;background:linear-gradient(145deg,var(--exact-pink),#ff5ca2)!important;
  box-shadow:0 5px 15px rgba(255,47,135,.22)!important;
}
.brand-icon svg{width:18px!important;}
.day-pill{
  padding:7px 15px!important;
  border-radius:999px!important;
  font-size:10px!important;font-weight:800!important;letter-spacing:.16em!important;
  background:#fff!important;
}
body:has(#app) .topbar{grid-template-columns:48px 1fr auto!important;}
body:has(#app) .brand-mark{grid-column:2!important;justify-self:start!important;}
body:has(#app) .topbar::after{
  content:"THURSDAY";
  grid-column:3;grid-row:1;
  justify-self:end;
  padding:7px 15px;
  border:1px solid rgba(255,47,135,.35);
  border-radius:999px;
  color:#a93265;
  background:#fff4f9;
  font-size:10px;font-weight:800;letter-spacing:.16em;
}

/* panel watercolor fields */
body:has(#app) .shell::before{
  background:
    radial-gradient(ellipse at 0% 22%,rgba(255,47,135,.42) 0 12%,rgba(245,144,205,.26) 23%,transparent 42%),
    radial-gradient(ellipse at 4% 80%,rgba(184,105,219,.21) 0 13%,transparent 36%),
    radial-gradient(ellipse at 98% 14%,rgba(34,198,211,.12) 0 12%,transparent 36%),
    linear-gradient(90deg,#fff8fc 0 15%,#fff 32% 100%);
}
body:has(#friday-app) .shell::before{
  background:
    radial-gradient(ellipse at 0% 25%,rgba(34,198,211,.46) 0 13%,rgba(111,222,231,.27) 24%,transparent 43%),
    radial-gradient(ellipse at 7% 82%,rgba(34,198,211,.17) 0 14%,transparent 37%),
    linear-gradient(90deg,#f0feff 0 15%,#fff 32% 100%);
}
body:has(#saturday-app) .shell::before{
  background:
    radial-gradient(ellipse at 0% 28%,rgba(153,220,0,.44) 0 13%,rgba(190,236,91,.27) 24%,transparent 43%),
    radial-gradient(ellipse at 4% 88%,rgba(34,198,211,.25) 0 13%,transparent 38%),
    linear-gradient(90deg,#fbffe9 0 15%,#fff 32% 100%);
}
body:has(#sunday-app) .shell::before{
  background:
    radial-gradient(ellipse at 100% 24%,rgba(176,91,215,.42) 0 13%,rgba(255,47,135,.26) 24%,transparent 44%),
    radial-gradient(ellipse at 98% 86%,rgba(255,47,135,.32) 0 15%,transparent 40%),
    linear-gradient(270deg,#fff0fb 0 16%,#fff 34% 100%);
}

/* crisp white care content from mockup */
body:has(#app) .content,
body:has(#friday-app) .content,
body:has(#saturday-app) .content,
body:has(#sunday-app) .content{
  position:relative!important;
  z-index:1!important;
  overflow:visible!important;
  margin:28px 62px 8px!important;
  padding:30px 32px!important;
  border:0!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.965)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
body:has(#app) .content::before,
body:has(#app) .content::after,
body:has(#friday-app) .content::before,
body:has(#saturday-app) .content::before,
body:has(#sunday-app) .content::before{display:none!important;}

/* deliberate decorative symbols from approved preview */
body:has(#app) .shell::after,
body:has(#friday-app) .shell::after,
body:has(#saturday-app) .shell::after,
body:has(#sunday-app) .shell::after{
  content:"+"!important;
  position:absolute!important;
  z-index:0!important;
  width:auto!important;height:auto!important;
  border-radius:0!important;filter:none!important;
  font-family:"DM Sans",sans-serif!important;font-weight:300!important;font-size:78px!important;line-height:1!important;
  opacity:.14!important;pointer-events:none!important;
}
body:has(#app) .shell::after{right:32px!important;top:138px!important;color:var(--exact-aqua)!important;left:auto!important;}
body:has(#friday-app) .shell::after{left:38px!important;top:165px!important;color:var(--exact-aqua-deep)!important;}
body:has(#saturday-app) .shell::after{left:38px!important;top:170px!important;color:var(--exact-lime-deep)!important;}
body:has(#sunday-app) .shell::after{right:38px!important;left:auto!important;top:165px!important;color:var(--exact-pink)!important;}

/* typography like approved cards */
.eyebrow,.welcome-kicker,.assessment-count,.review-label,.status-label{font-size:10px!important;font-weight:800!important;letter-spacing:.15em!important;text-transform:uppercase!important;}
body:has(#app) .eyebrow,body:has(#app) .welcome-kicker{color:#aa356b!important;}
body:has(#friday-app) .eyebrow{color:#0a92a0!important;}
body:has(#saturday-app) .eyebrow{color:#6b9800!important;}
body:has(#sunday-app) .eyebrow{color:#9a3dbb!important;}
h1,h2{color:#152930!important;font-family:"Newsreader",Georgia,serif!important;font-weight:500!important;letter-spacing:-.025em!important;}
body:has(#friday-app) h1,body:has(#friday-app) h2{color:#16353d!important;}
body:has(#saturday-app) h1,body:has(#saturday-app) h2{color:#18382e!important;}
body:has(#sunday-app) h1,body:has(#sunday-app) h2{color:#38263e!important;}
.intro,.lead,.welcome-copy,.reflection-copy,.quiet-note{color:#395a6a!important;}

/* progress and form pieces */
.progress-wrap{margin:18px 44px 0!important;}
.progress-track{height:4px!important;background:#e4ecee!important;}
.progress-bar{background:linear-gradient(90deg,var(--exact-pink),var(--exact-aqua),var(--exact-lime))!important;}
.option,.scale,.review-card,.status-card,.chart-card,.scripture-card,.chart-status{
  border-color:#dbe8ea!important;
  background:#fff!important;
  box-shadow:0 3px 12px rgba(35,75,84,.025)!important;
}
.option{border-radius:13px!important;}
body:has(#app) .option.selected{border-color:var(--exact-pink)!important;background:#fff4f9!important;}
body:has(#friday-app) .option.selected{border-color:var(--exact-aqua)!important;background:#effeff!important;}
body:has(#saturday-app) .option.selected{border-color:var(--exact-lime)!important;background:#fbffe9!important;}
body:has(#sunday-app) .option.selected{border-color:var(--exact-purple)!important;background:#fdf5ff!important;}

/* mockup button identity per day */
.primary-button,.primary{min-height:54px!important;border-radius:10px!important;font-size:12px!important;font-weight:800!important;letter-spacing:.05em!important;}
body:has(#app) .primary-button{background:linear-gradient(90deg,var(--exact-pink),#f31676)!important;box-shadow:0 8px 18px rgba(255,47,135,.20)!important;}
body:has(#friday-app) .primary{background:linear-gradient(90deg,#16becb,var(--exact-aqua-deep))!important;box-shadow:0 8px 18px rgba(34,198,211,.18)!important;}
body:has(#saturday-app) .primary{background:linear-gradient(90deg,#9cde00,#73c000)!important;box-shadow:0 8px 18px rgba(153,220,0,.19)!important;}
body:has(#sunday-app) .primary{background:linear-gradient(90deg,#c45bdb,#a94bd1)!important;box-shadow:0 8px 18px rgba(176,91,215,.18)!important;}
.pulse-dot{background:var(--exact-lime)!important;box-shadow:0 0 0 5px rgba(153,220,0,.14)!important;}

/* bottom approved retreat mantra */
body::after{display:none!important;}
.exact-footer{
  width:min(100% - 40px,760px);
  margin:0 auto 24px;
  display:flex;align-items:center;justify-content:center;gap:16px;
  color:#325b6c;font-size:9px;font-weight:800;letter-spacing:.24em;text-align:center;
  position:relative;z-index:2;
}
.exact-footer::before,.exact-footer::after{content:"♡";color:var(--exact-pink);font-size:22px;letter-spacing:0;}

@media(max-width:760px){
  .retreat-masthead{grid-template-columns:1fr auto;margin-top:12px;gap:10px;}
  .retreat-heartline{display:none;}
  .retreat-tagline{display:none;}
  .retreat-logo{align-items:center;grid-column:1/-1;}
  .retreat-logo small{padding-left:0;}
  .shell{width:min(100% - 18px,620px)!important;margin-top:8px!important;}
  body:has(#app) .content,
  body:has(#friday-app) .content,
  body:has(#saturday-app) .content,
  body:has(#sunday-app) .content{margin:24px 28px 6px!important;padding:26px 20px!important;}
  .progress-wrap{margin:16px 28px 0!important;}
  .topbar{min-height:64px!important;padding:0 18px!important;}
}

@media(max-width:430px){
  .retreat-logo strong{font-size:38px;}
  .retreat-logo small{font-size:8px;}
  body:has(#app) .content,
  body:has(#friday-app) .content,
  body:has(#saturday-app) .content,
  body:has(#sunday-app) .content{margin-left:18px!important;margin-right:18px!important;}
  h1{font-size:43px!important;}
  h2{font-size:34px!important;}
  .brand-mark,.brand{font-size:11px!important;}
  .day-pill,body:has(#app) .topbar::after{font-size:8px!important;padding:6px 10px!important;}
  .exact-footer{font-size:7px;letter-spacing:.18em;gap:8px;}
}
