:root{
  --retreat-pink:#ff2f87;
  --retreat-pink-soft:#ffd9ea;
  --retreat-aqua:#25c7d4;
  --retreat-aqua-soft:#d9f8fa;
  --retreat-lime:#99dc00;
  --retreat-lime-soft:#efffc9;
  --retreat-purple:#b05bd7;
  --retreat-ink:#17343a;
}

html,body{min-height:100%;}
body{
  position:relative;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 8% 8%,rgba(255,47,135,.17),transparent 24rem),
    radial-gradient(circle at 92% 14%,rgba(37,199,212,.18),transparent 27rem),
    radial-gradient(circle at 10% 88%,rgba(153,220,0,.14),transparent 24rem),
    radial-gradient(circle at 92% 88%,rgba(176,91,215,.12),transparent 25rem),
    linear-gradient(145deg,#fff8fc 0%,#f5fffe 48%,#fbfff2 100%) !important;
}

body::before,
body::after{
  content:"";
  position:fixed;
  z-index:0;
  pointer-events:none;
  border-radius:50%;
  filter:blur(1px);
  opacity:.72;
}
body::before{
  width:260px;height:260px;left:-120px;top:28%;
  background:
    radial-gradient(circle at 40% 40%,rgba(255,255,255,.92) 0 9%,transparent 10%),
    radial-gradient(circle,rgba(255,47,135,.16) 0 2px,transparent 3px) 0 0/22px 22px,
    linear-gradient(135deg,rgba(255,47,135,.18),rgba(37,199,212,.11));
}
body::after{
  width:300px;height:300px;right:-155px;bottom:8%;
  background:
    radial-gradient(circle,rgba(153,220,0,.20) 0 2px,transparent 3px) 0 0/24px 24px,
    linear-gradient(135deg,rgba(37,199,212,.15),rgba(153,220,0,.17));
}

#app,#friday-app,#saturday-app,#sunday-app{position:relative;z-index:1;}

/* Give the retreat palette presence without sacrificing readability. */
.shell{position:relative;}
.shell::before{
  content:"INFECT ME!";
  position:absolute;
  z-index:-1;
  top:72px;
  right:-18px;
  font-family:"DM Sans",sans-serif;
  font-size:clamp(42px,13vw,76px);
  font-weight:800;
  letter-spacing:-.055em;
  color:rgba(255,47,135,.055);
  transform:rotate(-4deg);
  white-space:nowrap;
  pointer-events:none;
}

/* Thursday / intake */
body:has(#app){
  --teal:#159ca6;
  --teal-dark:#087984;
  --teal-pale:#e5fbfb;
  --mint:#6bd9d3;
  --background:#fff9fc;
  --line:#d9eceb;
}
body:has(#app) .ambient-one{
  width:260px;height:260px;right:-150px;top:9%;
  background:linear-gradient(145deg,rgba(255,47,135,.20),rgba(37,199,212,.17));
}
body:has(#app) .ambient-two{
  width:220px;height:220px;left:-125px;bottom:8%;
  background:linear-gradient(145deg,rgba(153,220,0,.18),rgba(37,199,212,.15));
}
body:has(#app) .brand-icon,
body:has(#app) .back-button{
  border-color:rgba(255,47,135,.18);
  box-shadow:0 8px 22px rgba(255,47,135,.08);
}
body:has(#app) .progress-bar{
  background:linear-gradient(90deg,var(--retreat-pink),var(--retreat-aqua),var(--retreat-lime));
}
body:has(#app) .primary-button{
  background:linear-gradient(135deg,var(--retreat-pink),#f21873);
  box-shadow:0 12px 28px rgba(255,47,135,.22);
}
body:has(#app) .primary-button:hover{box-shadow:0 14px 31px rgba(255,47,135,.28);}
body:has(#app) .option.selected,
body:has(#app) .complete-icon{
  background:linear-gradient(135deg,#fff5fa,#edffff);
  border-color:rgba(37,199,212,.48);
}
body:has(#app) .chart-id{
  background:linear-gradient(135deg,#159ca6,#087984 62%,#176b70);
  border-color:rgba(255,255,255,.26);
  box-shadow:0 18px 38px rgba(21,156,166,.22);
}

/* Friday through Sunday share the compact care-card UI. */
body:has(#friday-app),body:has(#saturday-app),body:has(#sunday-app){
  --teal:#159ca6;
  --teal-dark:#087984;
  --line:#d9e9e8;
  --green:var(--retreat-lime);
  --shadow:0 18px 48px rgba(31,103,108,.13);
}
body:has(#friday-app) .content,
body:has(#saturday-app) .content,
body:has(#sunday-app) .content{
  background:rgba(255,255,255,.94);
  border-color:rgba(255,255,255,.92);
  box-shadow:0 18px 50px rgba(34,92,97,.13),0 0 0 1px rgba(37,199,212,.10);
  backdrop-filter:blur(7px);
}
body:has(#friday-app) .topbar,
body:has(#saturday-app) .topbar,
body:has(#sunday-app) .topbar{
  border-radius:18px;
  padding:10px 12px 18px;
  background:rgba(255,255,255,.58);
  backdrop-filter:blur(6px);
}
.cross{
  color:#fff;
  border:0 !important;
  background:linear-gradient(145deg,var(--retreat-pink),#ff5aa0) !important;
  box-shadow:0 6px 18px rgba(255,47,135,.23) !important;
}
.day-pill{
  border-width:1px !important;
  font-weight:800;
  background:#fff !important;
}
body:has(#friday-app) .day-pill{color:#078b99;border-color:rgba(37,199,212,.45)!important;background:#eaffff!important;}
body:has(#saturday-app) .day-pill{color:#638f00;border-color:rgba(153,220,0,.55)!important;background:#f5ffd9!important;}
body:has(#sunday-app) .day-pill{color:#8c3bad;border-color:rgba(176,91,215,.38)!important;background:#fbf0ff!important;}

body:has(#friday-app) .eyebrow{color:#078b99;}
body:has(#saturday-app) .eyebrow{color:#6f9e00;}
body:has(#sunday-app) .eyebrow{color:#9a43bb;}

body:has(#friday-app) .primary{background:linear-gradient(135deg,var(--retreat-aqua),#0799a7);box-shadow:0 11px 28px rgba(37,199,212,.24);}
body:has(#saturday-app) .primary{background:linear-gradient(135deg,#9ddd00,#6bbd00);box-shadow:0 11px 28px rgba(126,190,0,.23);}
body:has(#sunday-app) .primary{background:linear-gradient(135deg,var(--retreat-pink),#ec1872);box-shadow:0 11px 28px rgba(255,47,135,.23);}

body:has(#friday-app) .scripture-card{border-left-color:var(--retreat-aqua);background:linear-gradient(135deg,#fff,#effdff);}
body:has(#saturday-app) .scripture-card{border-left-color:var(--retreat-lime);background:linear-gradient(135deg,#fff,#f8ffe9);}
body:has(#sunday-app) .scripture-card{border-left-color:var(--retreat-pink);background:linear-gradient(135deg,#fff,#fff3f9);}

body:has(#friday-app) .option.selected{border-color:var(--retreat-aqua);background:#effdff;box-shadow:0 0 0 2px rgba(37,199,212,.09);}
body:has(#saturday-app) .option.selected{border-color:#96cf16;background:#f8ffe9;box-shadow:0 0 0 2px rgba(153,220,0,.10);}
body:has(#sunday-app) .option.selected{border-color:var(--retreat-pink);background:#fff3f9;box-shadow:0 0 0 2px rgba(255,47,135,.08);}
body:has(#friday-app) .option.selected .choice-dot{border-color:var(--retreat-aqua);}
body:has(#saturday-app) .option.selected .choice-dot{border-color:#82bd00;}
body:has(#sunday-app) .option.selected .choice-dot{border-color:var(--retreat-pink);}

.status-card{box-shadow:0 8px 22px rgba(30,80,84,.055);}
.pulse-dot{background:var(--retreat-lime)!important;box-shadow:0 0 0 6px rgba(153,220,0,.16)!important;}

/* Small watercolor-style splashes at page edges, safely behind content. */
body:has(#friday-app) .shell::after,
body:has(#saturday-app) .shell::after,
body:has(#sunday-app) .shell::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:150px;height:210px;
  right:-42px;top:150px;
  border-radius:45% 55% 62% 38%;
  filter:blur(10px);
  opacity:.34;
  pointer-events:none;
}
body:has(#friday-app) .shell::after{background:linear-gradient(155deg,var(--retreat-aqua),#8aeaf0 55%,transparent 75%);}
body:has(#saturday-app) .shell::after{background:linear-gradient(155deg,var(--retreat-lime),#d4ff70 55%,transparent 75%);}
body:has(#sunday-app) .shell::after{background:linear-gradient(155deg,var(--retreat-pink),#dc9af4 58%,transparent 76%);}

/* Preserve high contrast and comfortable mobile reading. */
h1,h2,.lead,.intro,.reflection-copy,.quiet-note,.option,.chart-row{position:relative;z-index:1;}
@media(max-width:420px){
  body::before{width:190px;height:190px;left:-115px;}
  body::after{width:210px;height:210px;right:-135px;}
  .shell::before{font-size:44px;right:-8px;top:68px;}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important;}
}
