:root{
  --cream:#f7f1e6;--paper:#fffaf2;--sage:#a8b29a;--olive:#68755d;--forest:#274733;--deep:#183526;--tan:#c8ad87;--gold:#b99554;--ink:#233127;--muted:#6f756e;--line:#e4ddcf;--shadow:0 10px 35px rgba(55,66,54,.10);--radius:22px
}
*{box-sizing:border-box} body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:linear-gradient(#efe7da,#f8f3ea);color:var(--ink)} button,input{font:inherit}.app-shell{width:min(100%,760px);min-height:100vh;margin:auto;background:var(--cream);position:relative;padding-bottom:92px}.topbar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:rgba(247,241,230,.94);backdrop-filter:blur(12px);border-bottom:1px solid rgba(39,71,51,.08)}.brand{font-family:Georgia,serif;font-size:30px;letter-spacing:.06em;color:var(--forest)}.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:10px;font-weight:700;color:var(--olive)}.icon-btn{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--paper)}.view{padding:18px 16px 28px}.card{background:rgba(255,250,242,.94);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.hero-card{min-height:360px;position:relative;overflow:hidden;background:linear-gradient(135deg,#e8dfce 0 54%,#334f3d 54%)}.hero-copy{width:65%;padding:34px 24px;position:relative;z-index:2}.hero-copy h1,.page-intro h1,.profile-head h1{font-family:Georgia,serif;font-weight:500;color:var(--deep)}.hero-copy h1{font-size:46px;line-height:.98;margin:16px 0}.hero-copy p{line-height:1.5;color:#4d584f}.hero-art{position:absolute;right:0;top:0;width:48%;height:100%;overflow:hidden}.sun{position:absolute;width:180px;height:180px;border-radius:50%;background:#c2ae78;right:-30px;top:30px;opacity:.7}.arch{position:absolute;width:160px;height:280px;border-radius:100px 100px 0 0;background:linear-gradient(180deg,#59725f,#203b2c);bottom:-20px;right:18px;border:1px solid rgba(255,255,255,.3)}button{cursor:pointer}.primary,.secondary{border:none;border-radius:999px;padding:12px 17px;font-weight:700}.primary{background:var(--forest);color:white}.secondary{background:#e5e8de;color:var(--forest)}.text-link{border:0;background:none;color:var(--forest);font-weight:700;padding:0}.pill{display:inline-block;background:rgba(255,255,255,.65);padding:7px 10px;border-radius:999px;font-size:12px;font-weight:700}.section-heading{display:flex;justify-content:space-between;align-items:end;margin:28px 4px 12px}.section-heading h2{font-family:Georgia,serif;margin:3px 0 0;font-size:25px;font-weight:500}.feed-card{padding:18px;margin-bottom:14px}.person-row{display:flex;gap:11px;align-items:center}.person-row small{display:block;color:var(--muted);margin-top:3px}.avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:var(--sage);color:var(--deep);font-weight:800}.avatar.dark{background:var(--forest);color:white}.avatar.group{background:var(--tan)}.avatar.xl{width:78px;height:78px;font-size:26px;background:linear-gradient(145deg,var(--tan),var(--sage))}.feed-card h3{margin:16px 0 8px}.feed-card p{color:#505850;line-height:1.5}.soft-photo,.class-img{background:linear-gradient(145deg,#d7c7aa,#6f806c);border-radius:16px;min-height:180px;display:flex;align-items:flex-end;padding:14px;color:white;font-family:Georgia,serif;font-size:22px}.actions{display:flex;gap:8px;border-top:1px solid var(--line);padding-top:12px;margin-top:12px}.actions button{border:0;background:none;color:#596259}.page-intro{padding:8px 4px 12px}.page-intro h1{font-size:40px;margin:6px 0}.page-intro p{color:var(--muted);margin-top:0}.chips{display:flex;gap:8px;overflow:auto;padding:4px 0 14px}.chip{white-space:nowrap;border:1px solid var(--line);background:var(--paper);border-radius:999px;padding:9px 12px;color:var(--ink)}.chip.active{background:var(--forest);color:white}.levels{display:grid;gap:10px}.level-card{width:100%;display:flex;justify-content:space-between;text-align:left;border:1px solid var(--line);border-radius:18px;padding:18px;background:var(--paper);color:var(--ink)}.level-card div{display:grid;gap:4px}.level-card span{font-size:13px;color:var(--muted)}.level-card.l2{background:var(--forest);color:white}.level-card.l2 span{color:#e9efe8}.class-grid{display:grid;gap:14px}.class-card{overflow:hidden}.class-img{border-radius:0;min-height:160px;justify-content:flex-end}.class-img.restore{background:linear-gradient(145deg,#d3c3a3,#88927a)}.class-img.slow{background:linear-gradient(145deg,#b7ad8c,#63765f)}.class-img.power{background:linear-gradient(145deg,#8d9a7a,#274733)}.class-img span{font-family:Inter,sans-serif;font-size:12px;background:rgba(0,0,0,.35);padding:6px 8px;border-radius:999px}.pad{padding:16px}.pad small{color:var(--olive);font-weight:800;letter-spacing:.1em}.pad h3{font-family:Georgia,serif;margin:6px 0}.pad p{color:var(--muted)}.segmented{display:grid;grid-template-columns:repeat(3,1fr);padding:4px;background:#e9e3d8;border-radius:14px;margin-bottom:12px}.segmented button{border:0;background:none;padding:10px;border-radius:10px}.segmented button.active{background:var(--paper);box-shadow:0 3px 10px rgba(0,0,0,.06)}.badge{background:var(--forest);color:white;border-radius:999px;padding:2px 6px;font-size:10px}.search{display:flex;gap:8px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:12px}.search input{width:100%;border:0;outline:0;background:none}.member-list{display:grid;gap:9px}.member-row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px;background:var(--paper);border:1px solid var(--line);border-radius:16px}.member-row span,.message-row span,.event-row span,.event-row small{display:block;color:var(--muted);font-size:13px;margin-top:2px}.add-friend{border:0;border-radius:999px;padding:9px 12px;background:var(--forest);color:white;font-weight:700}.add-friend.added{background:#d8ded3;color:var(--deep)}.message-list{display:grid;margin-top:15px}.message-row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;text-align:left;padding:14px 4px;border:0;border-bottom:1px solid var(--line);background:transparent}.message-row small{color:var(--muted)}.profile-head{display:flex;gap:16px;align-items:center;padding:8px 4px 18px}.profile-head h1{font-size:34px;margin:3px 0}.profile-head p{color:var(--muted);margin:0}.stats{display:grid;grid-template-columns:repeat(3,1fr);padding:20px 8px;text-align:center}.stats div+div{border-left:1px solid var(--line)}.stats strong{font-family:Georgia,serif;font-size:30px;display:block}.stats span{font-size:12px;color:var(--muted)}.milestones{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.milestones div{aspect-ratio:1;border-radius:50%;display:grid;place-content:center;text-align:center;background:#d9c08a;border:1px solid #bd9b5e}.milestones .muted{background:#ece7dc;border-color:var(--line)}.milestones b{font-family:Georgia,serif;font-size:24px}.milestones span{font-size:9px}.event-row{display:grid;grid-template-columns:66px 1fr auto;align-items:center;gap:12px;padding:10px;margin-bottom:10px}.mini-art{height:58px;border-radius:13px;background:linear-gradient(145deg,#d3c3a3,#859179)}.dark-art{background:linear-gradient(145deg,#859179,#274733)}.settings-card{padding:18px;margin-top:26px}.settings-card label{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:13px 0;border-top:1px solid var(--line)}.settings-card input{accent-color:var(--forest);width:20px;height:20px}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,760px);z-index:30;display:grid;grid-template-columns:repeat(5,1fr);background:rgba(255,250,242,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:8px 8px 12px}.nav-item{border:0;background:none;color:#778077;padding:7px 2px;display:grid;place-items:center;gap:3px}.nav-item span{font-size:19px}.nav-item small{font-size:10px}.nav-item.active{color:var(--forest);font-weight:800}.modal{width:min(92%,520px);border:0;border-radius:24px;background:var(--paper);color:var(--ink);padding:24px;box-shadow:0 30px 80px rgba(0,0,0,.25)}.modal::backdrop{background:rgba(23,34,27,.48);backdrop-filter:blur(3px)}.modal-close{position:absolute;right:13px;top:10px;border:0;background:none;font-size:26px}.modal textarea{width:100%;min-height:120px;border:1px solid var(--line);border-radius:14px;background:var(--cream);padding:12px;resize:vertical}.modal h2{font-family:Georgia,serif}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.chat-box{display:grid;gap:10px;margin:16px 0}.bubble{max-width:80%;padding:10px 12px;border-radius:16px;background:#e9e3d8}.bubble.mine{justify-self:end;background:var(--forest);color:white}.toast{position:fixed;left:50%;bottom:102px;transform:translateX(-50%);background:var(--deep);color:white;padding:10px 14px;border-radius:999px;z-index:50;box-shadow:var(--shadow);font-size:13px}
@media(min-width:700px){.view{padding:24px}.class-grid{grid-template-columns:repeat(3,1fr)}.hero-card{min-height:390px}.hero-copy{padding:52px 38px}.hero-copy h1{font-size:58px}.bottom-nav{border-radius:20px 20px 0 0}}


/* BLYS brand pass v0.2 */
:root{
  --cream:#f6efe3;
  --paper:#fffaf2;
  --sage:#8f9a7c;
  --olive:#65715b;
  --forest:#243f32;
  --deep:#173229;
  --tan:#c8aa84;
  --gold:#c39958;
  --ink:#203126;
  --muted:#73766f;
  --line:#e5dccd;
}
body{background:linear-gradient(180deg,#efe6d8 0%,#f8f3ea 100%);}
.app-shell{background:var(--cream);}
.topbar{
  min-height:82px;
  padding:10px 18px;
  background:rgba(246,239,227,.96);
  border-bottom:1px solid rgba(36,63,50,.09);
}
.brand-lockup{display:flex;align-items:center;gap:12px;min-width:0}
.brand-mark{width:76px;height:54px;flex:0 0 auto}
.sun-ring,.sun-ray{stroke:var(--gold);stroke-width:2.1}
.mountain-line{stroke:var(--forest);stroke-width:2.4}
.mountain-line.secondary{stroke-width:1.65;opacity:.78}
.brand-copy{display:grid;gap:1px;min-width:0}
.brand{font-family:Georgia,"Times New Roman",serif;font-size:32px;line-height:.92;letter-spacing:.12em;color:var(--forest)}
.brand-subtitle{text-transform:uppercase;letter-spacing:.18em;font-size:8px;font-weight:700;color:var(--olive);white-space:nowrap}
.icon-btn{color:var(--forest);font-size:18px;border-color:rgba(36,63,50,.16);background:rgba(255,250,242,.74)}
.card{border-color:rgba(36,63,50,.10);box-shadow:0 12px 32px rgba(36,63,50,.08)}
.hero-card{
  min-height:390px;
  background:linear-gradient(140deg,#ece1d1 0 58%,#2b4a3a 58% 100%);
}
.hero-copy{width:66%;padding:42px 24px}
.hero-copy h1{letter-spacing:-.02em}
.hero-art{width:48%;display:grid;place-items:center;padding:12px}
.hero-mark{width:115%;max-width:330px;height:auto;transform:translate(6%,3%)}
.hero-sun-ring,.hero-sun-ray{stroke:#d8b06e;stroke-width:3.1}
.hero-mountain-line{stroke:#f7f0e4;stroke-width:4}
.hero-mountain-line.secondary{stroke-width:2.4;opacity:.85}
.primary{background:var(--forest);box-shadow:0 7px 18px rgba(36,63,50,.16)}
.primary:hover{background:var(--deep)}
.secondary{background:#e2e7dc;color:var(--forest)}
.pill{background:rgba(255,250,242,.72);color:var(--forest);border:1px solid rgba(36,63,50,.08)}
.level-card{box-shadow:0 7px 20px rgba(36,63,50,.05)}
.level-card.l2{background:linear-gradient(145deg,#2b4a3a,#1f392d)}
.soft-photo,.class-img.restore{background:linear-gradient(145deg,#dfcfb5,#8c9a7c)}
.class-img.slow{background:linear-gradient(145deg,#b8ae91,#647760)}
.class-img.power{background:linear-gradient(145deg,#7f9070,#274733)}
.bottom-nav{background:rgba(255,250,242,.97)}
.nav-item.active{color:var(--forest)}
@media(max-width:520px){
  .topbar{min-height:76px;padding:9px 14px}
  .brand-mark{width:66px;height:48px}
  .brand{font-size:28px}
  .brand-subtitle{font-size:7px;letter-spacing:.13em}
  .hero-card{min-height:400px;background:linear-gradient(155deg,#ece1d1 0 64%,#2b4a3a 64% 100%)}
  .hero-copy{width:76%;padding:34px 20px}
  .hero-copy h1{font-size:42px}
  .hero-art{width:48%;opacity:.98}
}


/* v0.3 — one canonical BLYS mark everywhere */
.brand-mark{width:58px;height:42px}
.brand{font-size:27px}
.brand-subtitle{font-size:6.8px;letter-spacing:.16em}
.blys-mark .mark-sun,
.blys-mark .mark-ray{stroke:var(--gold)}
.blys-mark .mark-mountain{stroke:var(--forest)}
.blys-mark .mark-mountain.inner{opacity:.95}
.brand-mark .mark-sun{stroke-width:2.2}
.brand-mark .mark-ray{stroke-width:1.8}
.brand-mark .mark-mountain{stroke-width:2.25}
.brand-mark .mark-mountain.inner{stroke-width:1.85}

/* Hero uses exact same silhouette, only recolored/scaled */
.hero-art{width:44%;display:flex;align-items:center;justify-content:center;padding:18px}
.hero-mark{width:108%;max-width:360px;height:auto;transform:none}
.hero-mark .mark-sun{stroke:#d8b06e;stroke-width:2.2}
.hero-mark .mark-ray{stroke:#d8b06e;stroke-width:1.8}
.hero-mark .mark-mountain{stroke:#f7f0e4;stroke-width:2.25}
.hero-mark .mark-mountain.inner{stroke:#f7f0e4;stroke-width:1.85}

.hero-card{min-height:330px}
.hero-copy{width:62%;padding:34px 24px}
.hero-copy h1{font-size:38px;line-height:1.02;margin:12px 0 14px}
.hero-copy p{font-size:15px;max-width:420px}

@media(max-width:520px){
  .brand-mark{width:52px;height:38px}
  .brand{font-size:25px}
  .brand-subtitle{font-size:6.2px}
  .hero-card{min-height:350px}
  .hero-copy{width:68%;padding:30px 18px}
  .hero-copy h1{font-size:34px}
  .hero-copy p{font-size:14px}
  .hero-art{width:42%;padding:10px}
}


/* v0.4 — simplified single BLYS mark */
.brand-mark{width:54px;height:38px}
.brand{font-size:25px}
.brand-subtitle{font-size:6.2px;letter-spacing:.15em}

.blys-mark .mark-sun,.blys-mark .mark-ray{stroke:var(--gold)}
.blys-mark .mark-mountain{stroke:var(--forest)}
.brand-mark .mark-sun{stroke-width:2}
.brand-mark .mark-ray{stroke-width:1.65}
.brand-mark .mark-mountain{stroke-width:2.2}

.hero-art{width:40%;padding:16px}
.hero-mark{width:105%;max-width:300px;height:auto;transform:none}
.hero-mark .mark-sun{stroke:#d8b06e;stroke-width:2}
.hero-mark .mark-ray{stroke:#d8b06e;stroke-width:1.65}
.hero-mark .mark-mountain{stroke:#f7f0e4;stroke-width:2.2}

.hero-card{min-height:310px}
.hero-copy{width:66%;padding:30px 24px}
.hero-copy h1{font-size:34px;line-height:1.02;margin:0 0 14px}
.hero-copy p{font-size:14px;line-height:1.45}
.pill{display:none!important}

@media(max-width:520px){
  .brand-mark{width:48px;height:34px}
  .brand{font-size:23px}
  .brand-subtitle{font-size:5.8px}
  .hero-card{min-height:330px}
  .hero-copy{width:70%;padding:26px 18px}
  .hero-copy h1{font-size:31px}
  .hero-copy p{font-size:13.5px}
  .hero-art{width:38%;padding:8px}
}

/* v0.5 — strengthen BLYS wordmark hierarchy */
.brand{font-size:29px}
@media(max-width:520px){
  .brand{font-size:27px}
}


/* v0.6 — master BLYS logo from approved reference */
.brand-lockup{display:block}
.logo-stack{
  display:grid;
  justify-items:center;
  align-items:center;
  gap:0;
  width:max-content;
}
.brand-mark{
  width:74px;
  height:38px;
  display:block;
  margin-bottom:-1px;
}
.blys-mark .mark-sun,
.blys-mark .mark-ray{
  stroke:var(--gold);
}
.blys-mark .mark-mountain{
  stroke:var(--forest);
}
.brand-mark .mark-sun{stroke-width:2.1}
.brand-mark .mark-ray{stroke-width:1.8}
.brand-mark .mark-mountain{stroke-width:2.2}
.brand{
  font-family:Georgia,"Times New Roman",serif;
  font-size:28px;
  line-height:.92;
  letter-spacing:.18em;
  color:var(--forest);
  margin-left:.18em;
}
.brand-subtitle{
  margin-top:5px;
  font-size:6px;
  line-height:1;
  letter-spacing:.27em;
  text-transform:uppercase;
  font-weight:600;
  color:var(--forest);
  white-space:nowrap;
}
.topbar{
  min-height:92px;
  padding:10px 18px 8px;
}

/* Exact same logo lockup in hero; only colors invert on dark */
.hero-art{
  width:42%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px 18px 14px;
}
.hero-logo-stack{
  display:grid;
  justify-items:center;
  text-align:center;
  width:100%;
  transform:translateY(-2px);
}
.hero-logo-stack .hero-mark{
  width:min(100%,220px);
  height:auto;
  margin:0 0 8px;
}
.hero-logo-stack .mark-sun,
.hero-logo-stack .mark-ray{
  stroke:#d8b06e;
}
.hero-logo-stack .mark-mountain{
  stroke:#f7f0e4;
}
.hero-logo-stack .mark-sun{stroke-width:2.1}
.hero-logo-stack .mark-ray{stroke-width:1.8}
.hero-logo-stack .mark-mountain{stroke-width:2.2}
.hero-brand{
  font-family:Georgia,"Times New Roman",serif;
  font-size:46px;
  line-height:.9;
  letter-spacing:.18em;
  margin-left:.18em;
  color:#fffaf2;
}
.hero-brand-subtitle{
  margin-top:10px;
  font-size:8px;
  letter-spacing:.26em;
  text-transform:uppercase;
  font-weight:600;
  color:#fffaf2;
  white-space:nowrap;
}
.hero-card{
  min-height:300px;
}
.hero-copy{
  width:62%;
  padding:28px 24px;
}
.hero-copy h1{
  font-size:32px;
  line-height:1.05;
  margin:0 0 12px;
}
.hero-copy p{
  font-size:14px;
  line-height:1.45;
}

@media(max-width:520px){
  .topbar{min-height:84px;padding:8px 14px 7px}
  .brand-mark{width:66px;height:34px}
  .brand{font-size:25px}
  .brand-subtitle{font-size:5.4px;letter-spacing:.22em}
  .hero-card{min-height:315px}
  .hero-copy{width:64%;padding:24px 17px}
  .hero-copy h1{font-size:29px}
  .hero-copy p{font-size:13px}
  .hero-art{width:40%;padding:12px 10px}
  .hero-logo-stack .hero-mark{width:150px;margin-bottom:6px}
  .hero-brand{font-size:32px}
  .hero-brand-subtitle{font-size:5.6px;letter-spacing:.18em}
}


/* v0.7 — reset to approved reference direction */
body{font-family:"Montserrat",ui-sans-serif,system-ui,sans-serif}
.brand-lockup{display:block}
.logo-stack{
  display:grid;
  justify-items:center;
  align-items:center;
  width:max-content;
  gap:0;
}
.brand-mark{
  width:104px;
  height:48px;
  display:block;
  margin:0 0 2px;
}
.logo-sun,.logo-ray{stroke:var(--gold)}
.logo-mountain{stroke:var(--forest)}
.logo-sun{stroke-width:2.2}
.logo-ray{stroke-width:1.8}
.logo-mountain{stroke-width:2.35}
.brand{
  font-family:"Bodoni Moda","Didot","Bodoni 72","Times New Roman",serif;
  font-weight:400;
  font-size:37px;
  line-height:.86;
  letter-spacing:.16em;
  margin-left:.16em;
  color:var(--forest);
}
.brand-subtitle{
  font-family:"Montserrat",sans-serif;
  text-transform:uppercase;
  font-size:6.5px;
  font-weight:500;
  letter-spacing:.28em;
  margin-top:8px;
  color:var(--forest);
  white-space:nowrap;
}
.logo-rule{
  width:38px;
  height:1.5px;
  background:var(--gold);
  margin-top:10px;
}
.topbar{
  min-height:128px;
  padding:13px 18px 11px;
  align-items:center;
}

/* no second logo in hero until master mark is finalized */
.hero-card{
  min-height:285px;
  background:linear-gradient(140deg,#ede4d6 0 66%,#294838 66% 100%);
}
.hero-copy{
  width:68%;
  padding:34px 26px;
}
.hero-copy h1{
  font-family:"Bodoni Moda","Didot","Bodoni 72",serif;
  font-weight:400;
  font-size:31px;
  line-height:1.04;
  margin:0 0 12px;
  letter-spacing:-.025em;
}
.hero-copy p{
  font-size:13.5px;
  line-height:1.55;
}
.hero-art.hero-texture{
  width:34%;
  height:100%;
  right:0;
  top:0;
  padding:0;
  background:
    radial-gradient(circle at 62% 28%,rgba(195,153,88,.18),transparent 24%),
    linear-gradient(155deg,rgba(255,255,255,.04),transparent 46%);
}

@media(max-width:520px){
  .topbar{min-height:112px;padding:10px 14px 9px}
  .brand-mark{width:92px;height:43px}
  .brand{font-size:33px}
  .brand-subtitle{font-size:5.8px;letter-spacing:.24em}
  .logo-rule{width:33px;margin-top:8px}
  .hero-card{min-height:295px}
  .hero-copy{width:72%;padding:28px 18px}
  .hero-copy h1{font-size:28px}
  .hero-copy p{font-size:12.8px}
  .hero-art.hero-texture{width:30%}
}


/* v0.8 — use uploaded approved logo artwork */
.brand-lockup{
  display:flex;
  align-items:center;
}
.brand-logo-img{
  display:block;
  width:178px;
  height:auto;
  object-fit:contain;
}
.topbar{
  min-height:92px;
  padding:10px 18px;
}
.hero-art.hero-texture{
  width:38%;
  height:100%;
  right:0;
  top:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px 16px;
  background:#294838;
}
.hero-logo-img{
  display:block;
  width:min(100%,240px);
  height:auto;
  object-fit:contain;
  border-radius:0;
}
.hero-card{
  min-height:300px;
  background:linear-gradient(140deg,#ede4d6 0 62%,#294838 62% 100%);
}
.hero-copy{
  width:64%;
  padding:30px 24px;
}
.hero-copy h1{
  font-size:30px;
  line-height:1.04;
}
@media(max-width:520px){
  .brand-logo-img{width:150px}
  .topbar{min-height:82px;padding:8px 14px}
  .hero-card{min-height:300px;background:linear-gradient(150deg,#ede4d6 0 64%,#294838 64% 100%)}
  .hero-copy{width:66%;padding:26px 17px}
  .hero-copy h1{font-size:27px}
  .hero-art.hero-texture{width:36%;padding:10px 8px}
  .hero-logo-img{width:140px}
}


/* v0.9 — match site backgrounds to uploaded logo artwork */
:root{
  --logo-dark:#2a3a2f;
  --logo-light:#f5f1e6;
}
.app-shell{background:var(--logo-light)}
.topbar{background:rgba(245,241,230,.97)}
.hero-card{
  background:linear-gradient(140deg,var(--logo-light) 0 62%,var(--logo-dark) 62% 100%);
}
.hero-art.hero-texture{
  background:var(--logo-dark);
}
@media(max-width:520px){
  .hero-card{
    background:linear-gradient(150deg,var(--logo-light) 0 64%,var(--logo-dark) 64% 100%);
  }
}


/* v1.2 — Nevada state silhouette based on the public-domain outline */
.hero-card{
  --nevada-outline:polygon(
    0 0,94% 0,100% 82.8%,98.4% 85.2%,97.1% 85.4%,
    94.1% 83.6%,88% 84.5%,88.4% 86.6%,89.7% 87.6%,
    88.8% 88.5%,89.9% 91.4%,89.6% 92.9%,91.6% 97.4%,
    90.3% 98.5%,91.1% 99.1%,90.6% 100%,0 42.8%
  );
  min-height:390px;
  background:var(--logo-light);
  isolation:isolate;
}
.hero-card::before{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width:263px;
  height:390px;
  background:var(--logo-dark);
  clip-path:var(--nevada-outline);
}
.hero-copy{
  width:58%;
  height:390px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  position:relative;
  z-index:2;
}
.hero-art.hero-texture{
  width:263px;
  height:390px;
  right:0;
  top:auto;
  bottom:0;
  z-index:1;
  padding:12px;
  background:transparent;
  clip-path:var(--nevada-outline);
}
.hero-logo-img{
  width:min(100%,190px);
  max-width:none;
  transform:translateY(-50%);
}
@media(max-width:520px){
  .hero-card{
    min-height:560px;
    background:var(--logo-light);
  }
  .hero-copy{
    width:100%;
    height:auto;
    padding:62px 20px 25px;
  }
  .hero-copy h1{font-size:29px;line-height:1.04}
  .hero-copy p{font-size:13.5px;max-width:300px}
  .hero-copy .primary{font-size:14px;padding:10px 14px}
  .hero-card::before{
    width:205px;
    height:300px;
  }
  .hero-art.hero-texture{
    width:205px;
    height:300px;
    padding:4px;
  }
  .hero-logo-img{
    width:min(100%,150px);
    transform:translateY(-55%);
  }
}

/* Larger circular brand mark for mobile readability */
.brand-logo-img{width:150px}
.topbar{min-height:164px}
@media(max-width:520px){
  .brand-logo-img{width:152px}
  .topbar{min-height:160px;padding:4px 14px}
}

/* Display the supplied circular and green logo artwork */
.brand-logo-img{width:166px}
.topbar{min-height:180px}
.hero-logo-img{width:min(100%,220px)}
@media(max-width:520px){
  .brand-logo-img{width:166px}
  .topbar{min-height:174px;padding:4px 14px}
  .hero-logo-img{width:min(100%,180px)}
}

/* Classes: on-demand levels and confirmed pop-up calendar */
.class-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:16px;background:#e9e3d8;margin:4px 0 18px}
.class-tab{min-height:48px;border:0;border-radius:12px;background:transparent;color:var(--forest);font-weight:700}
.class-tab.active{background:var(--paper);box-shadow:0 3px 10px rgba(0,0,0,.07)}
.class-note{margin:0 4px 14px;color:var(--muted);font-size:13px}
.vod-levels{display:grid;gap:12px}
.level-section{display:grid;grid-template-columns:88px 1fr;align-items:center;gap:14px;padding:14px}
.level-art{height:98px;display:grid;place-items:center;border-radius:16px;font-family:Georgia,serif;font-size:52px;color:var(--forest);background:linear-gradient(145deg,#e3d4b9,#c1cdbb)}
.level-art.l1{background:linear-gradient(145deg,#c9b990,#869e84)}
.level-art.l2{background:linear-gradient(145deg,#718e76,#284936);color:white}
.level-section h2{font-family:Georgia,serif;font-size:23px;font-weight:500;margin:4px 0}
.level-section p{font-size:13px;line-height:1.4;color:var(--muted);margin:0 0 7px}
.level-section small{font-size:11px;color:var(--olive);font-weight:700}
.popup-calendar{padding:18px 14px}
.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.calendar-header h2{font-family:Georgia,serif;font-size:24px;font-weight:500;margin:0}
.calendar-arrow{height:38px;width:38px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--forest);font-size:24px;line-height:1}
.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;text-align:center}
.calendar-grid.weekdays{color:var(--muted);font-size:12px;margin-bottom:6px}
.calendar-grid.weekdays span{padding:7px 0}
.calendar-day,.calendar-blank{min-height:42px;display:grid;place-items:center;position:relative;border:0;background:transparent;color:var(--ink);font-size:14px}
.calendar-day.today{font-weight:800;background:#e7eddf;border-radius:50%}
.calendar-day.has-popup{background:var(--forest);color:white;border-radius:50%;font-weight:800;cursor:pointer}
.calendar-day.has-popup:after{content:'';position:absolute;bottom:4px;width:3px;height:3px;border-radius:50%;background:var(--gold)}
.calendar-key{display:flex;align-items:center;gap:8px;margin:13px 2px 0;color:var(--muted);font-size:12px}
.calendar-dot{width:11px;height:11px;border-radius:50%;background:var(--forest)}
.popup-empty,.popup-event{padding:22px;margin-bottom:12px}
.popup-empty h3,.popup-event h3{font-family:Georgia,serif;font-size:22px;font-weight:500;margin:0 0 6px}
.popup-empty p,.popup-event p{color:var(--muted);font-size:13px;line-height:1.5;margin:0}
@media(max-width:370px){.level-section{grid-template-columns:68px 1fr}.level-art{height:88px}.level-section h2{font-size:20px}}

[hidden]{display:none!important}

/* Consistent outline icons; fill only the current destination */
.nav-item{min-height:59px;gap:4px;color:#6f786e}
.nav-item svg{display:block;width:25px;height:25px;overflow:visible;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.nav-item .icon-fill{fill:none}
.nav-item .icon-detail{fill:none}
.nav-item.active{color:var(--forest)}
.nav-item.active .icon-fill{fill:var(--forest)}
.nav-item.active .icon-detail{stroke:var(--paper)}
.nav-item small{font-size:10px;line-height:1.2}

/* Original playful symbols at a consistent optical size */
.nav-item svg{width:24px;height:24px;stroke-width:1.7}
.nav-item .dotted-ring{stroke-dasharray:1 2.9;stroke-linecap:round;stroke-width:2.3}
.nav-item.active .dotted-ring{stroke-dasharray:none;stroke-width:1.7}


/* Membership pricing */
.membership-card{margin-top:16px;padding:22px;text-align:left}
.membership-card h2{font-family:"Bodoni Moda","Didot","Bodoni 72",serif;font-size:28px;font-weight:400;line-height:1.08;margin:7px 0 8px;color:var(--deep)}
.membership-copy{margin:0 0 18px;color:var(--muted);font-size:13px;line-height:1.55}
.pricing-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.price-option{position:relative;min-height:92px;border:1px solid var(--line);border-radius:17px;background:var(--paper);color:var(--ink);padding:14px;text-align:left}
.price-option strong{font-family:"Bodoni Moda","Didot","Bodoni 72",serif;font-size:30px;font-weight:500;color:var(--deep)}
.price-option span{font-size:12px;color:var(--muted);margin-left:3px}
.price-option small{display:block;margin-top:5px;color:var(--olive);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.price-option.selected{border-color:var(--forest);box-shadow:0 0 0 1px var(--forest)}
.price-option.annual:after{content:"Best value";position:absolute;top:9px;right:9px;background:#e5e8de;color:var(--forest);border-radius:999px;padding:4px 7px;font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.membership-join{width:100%}
.plan-picker{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
.plan-picker button{border:1px solid var(--line);border-radius:16px;background:var(--paper);padding:16px;text-align:left;color:var(--ink)}
.plan-picker button strong{font-family:"Bodoni Moda","Didot","Bodoni 72",serif;font-size:27px;color:var(--deep)}
.plan-picker button span,.plan-picker button small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.plan-picker button small{color:var(--olive);font-weight:700}
@media(max-width:380px){.pricing-options,.plan-picker{grid-template-columns:1fr}}


/* Public/member access prototype */
.header-login{
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--paper);
  color:var(--forest);
  padding:10px 14px;
  font-weight:700;
  font-size:12px;
}
.header-login.member{
  background:var(--forest);
  color:white;
  border-color:var(--forest);
}
.public-benefits{padding:28px 4px 8px}
.public-benefits h2,.public-classes h2,.locked-card h2{
  font-family:"Bodoni Moda","Didot","Bodoni 72",serif;
  font-weight:400;
  color:var(--deep);
}
.public-benefits h2{font-size:26px;margin:6px 0 14px}
.benefit-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.benefit-pill{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px 12px;
  font-size:12px;
  font-weight:600;
  color:var(--forest);
}
.nav-item.locked{opacity:.48}
.nav-item.locked:after{content:"";display:none}
.public-classes{display:grid;gap:14px}
.public-class-levels{display:grid;gap:10px}
.public-level{
  display:grid;
  grid-template-columns:58px 1fr;
  gap:12px;
  align-items:center;
  padding:14px;
}
.public-level b{
  width:58px;height:58px;border-radius:15px;
  display:grid;place-items:center;
  background:#e7e1d5;
  font-family:"Bodoni Moda",serif;
  font-size:28px;color:var(--forest);
}
.public-level h3{margin:0 0 4px;font-family:"Bodoni Moda",serif;font-size:20px;font-weight:400}
.public-level p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.locked-card{
  padding:24px;
  text-align:center;
  background:linear-gradient(145deg,#f4eee3,#e5e9df);
}
.locked-symbol{
  width:48px;height:48px;border-radius:50%;
  display:grid;place-items:center;margin:0 auto 12px;
  background:var(--forest);color:white;font-size:18px;
}
.locked-card h2{font-size:26px;margin:0 0 8px}
.locked-card p{color:var(--muted);font-size:13px;line-height:1.5;margin:0 auto 16px;max-width:390px}
.login-form{display:grid;gap:10px;margin:16px 0}
.login-form input{
  width:100%;border:1px solid var(--line);border-radius:13px;
  background:var(--cream);padding:12px;outline:none
}
.demo-note{font-size:11px;color:var(--muted);line-height:1.45;margin-top:10px}
@media(max-width:380px){.benefit-grid{grid-template-columns:1fr}}


/* Mobile hero spacing fix — keep CTA clear of Nevada artwork */
@media(max-width:520px){
  .hero-card{
    min-height:620px;
  }
  .hero-copy{
    width:100%;
    max-width:100%;
    padding:54px 22px 0;
    position:relative;
    z-index:3;
  }
  .hero-copy p{
    max-width:320px;
    margin-bottom:20px;
  }
  .hero-copy .primary{
    position:relative;
    z-index:4;
  }
  .hero-card::before{
    width:205px;
    height:300px;
    right:0;
    bottom:0;
  }
  .hero-art.hero-texture{
    width:205px;
    height:300px;
    right:0;
    bottom:0;
    top:auto;
    z-index:1;
  }
}


/* Profile avatar + challenges */
.profile-head .avatar.xl{
  width:78px;
  min-width:78px;
  height:78px;
  min-height:78px;
  aspect-ratio:1 / 1;
  flex:0 0 78px;
  border-radius:50%;
}

.friend-challenge{padding:18px}
.challenge-people{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;text-align:center}
.challenge-people>div{display:grid;justify-items:center;gap:6px}
.challenge-avatar{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--sage);color:var(--deep);font-weight:800}
.challenge-avatar.alt{background:var(--tan)}
.challenge-vs{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.challenge-title{text-align:center;margin:16px 0 12px}
.challenge-title strong{display:block;font-family:"Bodoni Moda",serif;font-size:22px;font-weight:500;color:var(--deep)}
.challenge-title span{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.challenge-score{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:15px;overflow:hidden;background:var(--paper)}
.challenge-score span{padding:12px;text-align:center;color:var(--muted);font-size:11px}
.challenge-score span+span{border-left:1px solid var(--line)}
.challenge-score b{display:block;font-family:"Bodoni Moda",serif;font-size:28px;color:var(--deep)}
.challenge-record{text-align:center;margin-top:12px;color:var(--muted);font-size:12px}
.challenge-record strong{color:var(--forest)}

.studio-badges{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.studio-badge{min-height:150px;padding:14px;border:1px solid var(--line);border-radius:18px;background:#ece7dc;display:grid;align-content:center;justify-items:center;text-align:center;gap:5px}
.studio-badge.earned{background:linear-gradient(145deg,#e5cf99,#c8ad72);border-color:#bd9b5e}
.badge-mark{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;border:1px solid currentColor;font-family:"Bodoni Moda",serif;font-size:25px;color:var(--forest);background:rgba(255,250,242,.35)}
.studio-badge strong{font-size:12px;line-height:1.25}
.studio-badge span{font-size:10px;color:var(--muted)}
.studio-badge.earned span{color:var(--deep)}


/* Scenic studio challenge badges */
.badge-mark.landscape{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(39,71,51,.18);
  background:#e8e0d1;
}
.badge-mark.landscape:before,
.badge-mark.landscape:after{
  content:"";
  position:absolute;
  inset:auto;
}
.badge-mark.sunrise{
  background:
    radial-gradient(circle at 68% 34%,rgba(185,149,84,.48) 0 13%,transparent 14%),
    linear-gradient(160deg,transparent 0 52%,rgba(104,117,93,.55) 53% 68%,rgba(168,178,154,.62) 69% 100%),
    #efe7d8;
}
.badge-mark.moon{
  background:
    radial-gradient(circle at 66% 31%,rgba(247,241,230,.92) 0 11%,transparent 12%),
    radial-gradient(ellipse at 40% 78%,rgba(104,117,93,.62) 0 38%,transparent 39%),
    linear-gradient(160deg,#d8d6cb,#9aa58f);
}
.badge-mark.flow{
  background:
    radial-gradient(circle at 35% 35%,rgba(185,149,84,.35) 0 9%,transparent 10%),
    repeating-radial-gradient(ellipse at 50% 90%,transparent 0 13px,rgba(104,117,93,.28) 14px 16px,transparent 17px 25px),
    #e8e0d1;
}
.badge-mark.peaks{
  background:
    linear-gradient(135deg,transparent 0 48%,rgba(39,71,51,.55) 49% 62%,transparent 63%),
    linear-gradient(45deg,transparent 0 54%,rgba(168,178,154,.75) 55% 72%,transparent 73%),
    linear-gradient(#eee7da,#d8c9ae);
}
.badge-count{
  position:absolute;
  right:4px;
  bottom:4px;
  min-width:24px;
  height:24px;
  padding:0 6px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:var(--forest);
  color:white;
  font-family:"Montserrat",sans-serif;
  font-size:10px;
  font-weight:700;
  line-height:1;
  box-shadow:0 2px 6px rgba(24,53,38,.18);
}


/* Member class library */
.class-library{display:grid;gap:12px}
.member-class-card{
  width:100%;
  display:grid;
  grid-template-columns:112px 1fr auto;
  gap:13px;
  align-items:center;
  padding:0;
  overflow:hidden;
  text-align:left;
  color:var(--ink);
}
.member-class-art{
  align-self:stretch;
  min-height:116px;
  position:relative;
  overflow:hidden;
  background:#d9d0bf;
}
.member-class-art:before,
.member-class-art:after,
.class-detail-art:before,
.class-detail-art:after{
  content:"";
  position:absolute;
}
.member-class-art.restore,.class-detail-art.restore{
  background:
    radial-gradient(circle at 72% 28%,rgba(247,241,230,.82) 0 10%,transparent 11%),
    linear-gradient(155deg,transparent 0 48%,rgba(104,117,93,.58) 49% 67%,rgba(168,178,154,.72) 68% 100%),
    #d7d2c5;
}
.member-class-art.slow,.class-detail-art.slow{
  background:
    radial-gradient(circle at 68% 28%,rgba(185,149,84,.42) 0 11%,transparent 12%),
    repeating-radial-gradient(ellipse at 45% 100%,transparent 0 19px,rgba(104,117,93,.23) 20px 23px,transparent 24px 34px),
    #e5dccb;
}
.member-class-art.power,.class-detail-art.power{
  background:
    linear-gradient(135deg,transparent 0 45%,rgba(39,71,51,.68) 46% 65%,transparent 66%),
    linear-gradient(45deg,transparent 0 52%,rgba(168,178,154,.78) 53% 72%,transparent 73%),
    #d8c7a9;
}
.member-class-art.mobility,.class-detail-art.mobility{
  background:
    repeating-radial-gradient(ellipse at 50% 95%,transparent 0 15px,rgba(104,117,93,.27) 16px 18px,transparent 19px 28px),
    #e5ded2;
}
.member-class-art.morning,.class-detail-art.morning{
  background:
    radial-gradient(circle at 68% 34%,rgba(185,149,84,.52) 0 12%,transparent 13%),
    linear-gradient(160deg,transparent 0 56%,rgba(168,178,154,.7) 57% 75%,rgba(200,173,135,.52) 76% 100%),
    #eee6d8;
}
.class-level-badge,.completed-badge{
  position:absolute;
  top:9px;
  left:9px;
  border-radius:999px;
  padding:5px 7px;
  background:rgba(255,250,242,.88);
  color:var(--forest);
  font-size:9px;
  font-weight:800;
}
.completed-badge{top:auto;bottom:9px;background:var(--forest);color:white}
.member-class-copy{padding:14px 0}
.class-meta{display:flex;gap:8px;flex-wrap:wrap;color:var(--olive);font-size:9px;text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.member-class-copy h3{font-family:"Bodoni Moda",serif;font-weight:500;font-size:21px;line-height:1.05;margin:7px 0 4px;color:var(--deep)}
.member-class-copy p{margin:0;color:var(--muted);font-size:12px}
.class-arrow{padding-right:14px;color:var(--forest);font-size:26px}
.class-detail-art{height:190px;border-radius:18px;margin-bottom:18px;position:relative;overflow:hidden}
.video-play{position:absolute;inset:0;margin:auto;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:rgba(255,250,242,.9);color:var(--forest);font-size:18px;padding-left:3px}
.detail-meta{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 14px}
.detail-meta span{border:1px solid var(--line);border-radius:999px;padding:6px 8px;font-size:10px;color:var(--olive);font-weight:700}
.equipment-card{display:grid;gap:4px;background:var(--cream);border:1px solid var(--line);border-radius:14px;padding:13px;margin:15px 0}
.equipment-card strong{font-size:13px}
@media(max-width:390px){
  .member-class-card{grid-template-columns:94px 1fr auto}
  .member-class-art{min-height:108px}
  .member-class-copy h3{font-size:19px}
}


/* Keep class visuals simple and distinct from challenge badges */
.member-class-art.simple-level,
.class-detail-art.simple-level{
  background:#e7e1d5 !important;
}
.member-class-art.simple-level.level-1,
.class-detail-art.simple-level.level-1{
  background:#cbd3c3 !important;
}
.member-class-art.simple-level.level-2,
.class-detail-art.simple-level.level-2{
  background:#6f836f !important;
}
.big-level{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-family:"Bodoni Moda",serif;
  font-size:52px;
  font-weight:500;
  color:var(--forest);
}
.level-2 .big-level{color:white}
.detail-level{
  position:absolute;
  top:14px;
  left:14px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--forest);
}
.class-detail-art.level-2 .detail-level{color:white}
.member-class-art.simple-level:before,
.member-class-art.simple-level:after,
.class-detail-art.simple-level:before,
.class-detail-art.simple-level:after{
  display:none !important;
}


/* Super-simple class rows: level number + video thumbnail + title */
.member-class-card{
  grid-template-columns:34px 112px 1fr auto !important;
  gap:10px !important;
  padding:10px !important;
}
.level-number{
  width:30px;
  text-align:center;
  font-family:"Bodoni Moda",serif;
  font-size:24px;
  line-height:1;
  color:var(--forest);
}
.video-thumb{
  height:76px;
  border-radius:12px;
  position:relative;
  overflow:hidden;
  background:#d8d3c8;
  border:1px solid var(--line);
}
.video-thumb:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(145deg,#ddd4c6,#98a38f);
}
.thumb-play{
  position:absolute;
  inset:0;
  margin:auto;
  width:30px;
  height:30px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,250,242,.9);
  color:var(--forest);
  font-size:11px;
  padding-left:2px;
}
.member-class-copy{
  padding:0 !important;
}
.member-class-copy h3{
  margin:0 0 5px !important;
  font-size:18px !important;
}
.member-class-copy p{
  font-size:11px !important;
}
.video-thumb .completed-badge{
  left:6px;
  bottom:6px;
  padding:4px 6px;
  font-size:8px;
}
@media(max-width:390px){
  .member-class-card{grid-template-columns:28px 92px 1fr auto !important}
  .level-number{width:24px;font-size:22px}
  .video-thumb{height:68px}
  .member-class-copy h3{font-size:16px !important}
}


/* Large library preview */
.library-level-group{margin:4px 0 28px}
.library-level-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 3px 10px;
}
.library-level-heading>div{display:flex;align-items:center;gap:10px}
.level-heading-number{
  width:31px;
  height:31px;
  border:1px solid var(--line);
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--paper);
  color:var(--forest);
  font-family:"Bodoni Moda",serif;
  font-size:18px;
}
.library-level-heading strong{
  display:block;
  font-family:"Bodoni Moda",serif;
  font-size:19px;
  font-weight:500;
  color:var(--deep);
}
.library-level-heading small{
  display:block;
  color:var(--muted);
  font-size:10px;
  margin-top:1px;
}
.library-level-heading>span{
  color:var(--muted);
  font-size:10px;
}
.library-level-list{display:grid;gap:9px}


/* Pop-Up member experience */
.popup-event{
  width:100%;
  display:grid;
  grid-template-columns:54px 1fr auto;
  align-items:center;
  gap:12px;
  padding:13px;
  margin-bottom:10px;
  text-align:left;
  color:var(--ink);
}
.popup-date{
  width:50px;
  height:58px;
  border-radius:14px;
  background:#e6e9df;
  display:grid;
  place-content:center;
  text-align:center;
  color:var(--forest);
}
.popup-date strong{
  font-family:"Bodoni Moda",serif;
  font-size:23px;
  line-height:1;
}
.popup-date span{
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-top:3px;
}
.popup-summary h3{
  font-family:"Bodoni Moda",serif;
  font-size:20px;
  font-weight:500;
  margin:3px 0 4px;
}
.popup-summary p,.popup-summary small{
  display:block;
  margin:0;
  color:var(--muted);
  font-size:11px;
  line-height:1.4;
}
.popup-summary small{margin-top:3px}
.popup-rsvp-state{
  color:var(--forest);
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
}
.popup-detail-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:14px 0;
}
.popup-detail-meta div{
  border:1px solid var(--line);
  border-radius:13px;
  padding:10px;
  background:var(--cream);
}
.popup-detail-meta span{
  display:block;
  color:var(--muted);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:3px;
}
.popup-detail-meta strong{
  font-size:12px;
  line-height:1.35;
}
.popup-spots{
  text-align:center;
  color:var(--muted);
  font-size:11px;
  margin:12px 0;
}
.profile-popup{
  width:100%;
  text-align:left;
  color:var(--ink);
  border-style:solid;
}


/* Friend challenge builder */
.challenge-private{
  margin-top:12px;
  padding-top:10px;
  border-top:1px solid var(--line);
  text-align:center;
  color:var(--muted);
  font-size:10px;
}
.challenge-field{
  display:grid;
  gap:6px;
  margin:16px 0 12px;
}
.challenge-field>span{
  color:var(--olive);
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.1em;
}
.challenge-field select{
  width:100%;
  border:1px solid var(--line);
  border-radius:13px;
  padding:12px;
  background:var(--cream);
  color:var(--ink);
  font:inherit;
}
.challenge-presets{
  display:grid;
  gap:8px;
  margin:12px 0;
}
.challenge-preset{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px 14px;
  background:var(--paper);
  text-align:left;
  color:var(--ink);
}
.challenge-preset strong{
  display:block;
  font-size:13px;
}
.challenge-preset span{
  display:block;
  color:var(--muted);
  font-size:10px;
  margin-top:3px;
}
.challenge-preset.selected{
  border-color:var(--forest);
  box-shadow:0 0 0 1px var(--forest);
  background:#eef0e8;
}
.challenge-lock-note{
  text-align:center;
  color:var(--muted);
  font-size:10px;
  margin:13px 0;
}
.empty-challenge{
  padding:18px;
}
.empty-challenge span{
  display:block;
  color:var(--muted);
  font-size:12px;
  margin-top:4px;
}


/* Horizontal friend challenge carousel */
.friend-challenge-scroll{
  display:flex;
  gap:12px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  padding:2px 4px 10px;
  margin:0 -4px;
  scrollbar-width:none;
}
.friend-challenge-scroll::-webkit-scrollbar{display:none}
.friend-challenge-scroll .friend-challenge{
  flex:0 0 88%;
  min-width:88%;
  scroll-snap-align:start;
  margin:0;
}
@media(max-width:420px){
  .friend-challenge-scroll .friend-challenge{
    flex-basis:90%;
    min-width:90%;
  }
}


/* Community safety controls */
.actions .report-post{
  margin-left:auto;
  font-size:11px;
  color:var(--muted);
}
.post-safety-note{
  margin:8px 0 0;
  font-size:10px;
  color:var(--muted);
}


/* Profile + account settings */
.profile-settings{margin-top:0}
.settings-card+.settings-card{margin-top:10px}
.settings-row{
  width:100%;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:12px;
  border:0;
  border-top:1px solid var(--line);
  background:transparent;
  padding:13px 0;
  text-align:left;
  color:var(--ink);
}
.settings-card .settings-row:first-of-type{margin-top:6px}
.settings-row span{display:block}
.settings-row strong{display:block;font-size:12px}
.settings-row small{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.settings-row b{font-size:20px;color:var(--forest);font-weight:400}
.account-card{margin-bottom:8px}



/* Mobile pricing badge spacing */
@media(max-width:520px){
  .price-option.annual{position:relative;padding-top:28px}
  .price-option.annual::before{
    top:8px;
    right:12px;
  }
}


/* Authentication */
.auth-links{
  display:flex;
  justify-content:space-between;
  gap:14px;
  margin-top:14px;
}


/* Desktop website layout */
.desktop-nav{display:none}

@media(min-width:900px){
  body{background:#eee6d8}
  .app-shell{
    width:min(100%,1180px);
    min-height:100vh;
    padding-bottom:0;
    box-shadow:0 0 50px rgba(36,63,50,.08);
  }

  .topbar{
    position:sticky;
    top:0;
    min-height:96px;
    padding:10px 34px;
    gap:28px;
  }

  .brand-logo-img{width:112px}

  .desktop-nav{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    margin-left:auto;
  }

  .desktop-nav button{
    border:0;
    background:transparent;
    color:var(--muted);
    padding:10px 12px;
    border-radius:999px;
    font-size:13px;
    font-weight:600;
  }

  .desktop-nav button:hover,
  .desktop-nav button.active{
    color:var(--forest);
    background:#e7eadf;
  }

  .header-login{
    flex:0 0 auto;
    padding:10px 16px;
  }

  .view{
    padding:38px 42px 64px;
  }

  .bottom-nav{display:none}

  .hero-card{
    min-height:470px;
    border-radius:30px;
    background:linear-gradient(110deg,var(--logo-light) 0 57%,var(--logo-dark) 57% 100%);
  }

  .hero-copy{
    width:58%;
    padding:78px 54px;
  }

  .hero-copy h1{
    font-size:68px;
    line-height:.96;
    margin:16px 0 22px;
  }

  .hero-copy p{
    max-width:510px;
    font-size:17px;
    line-height:1.65;
  }

  .hero-copy .primary{
    margin-top:12px;
    padding:14px 20px;
    font-size:14px;
  }

  .hero-art.hero-texture{
    width:43%;
    height:100%;
    right:0;
    bottom:0;
  }

  .hero-logo-img{
    width:min(100%,300px);
  }

  .membership-card{
    padding:34px;
    margin-top:24px;
  }

  .membership-card h2{font-size:36px}

  .pricing-options{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    max-width:640px;
  }

  .public-benefits{padding:34px 8px}
  .benefit-grid{grid-template-columns:repeat(4,1fr)}

  .page-intro{
    max-width:760px;
    padding-top:18px;
  }

  .page-intro h1{font-size:52px}

  .class-library{gap:18px}
  .class-library .class-level-group{margin-top:28px}

  .studio-badges{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .profile-head{padding-top:20px}

  .settings-card{max-width:820px}
}