/* ============================================================
   The Padel Academy · MEMBER PORTAL — shared UI
   Native to the marketing site: same fonts, tokens, buttons,
   nav and footer as index.html. Loaded on every /portal page.
   Mobile-first; the report must read in <60s on a phone.
   ============================================================ */

/* ---- FONTS (verbatim from index.html) ---- */
@font-face{font-family:'Beautique';src:url('fonts/BeautiqueDisplay-Black.otf') format('opentype');font-weight:900;font-style:normal;font-display:swap}
@font-face{font-family:'Beautique';src:url('fonts/BeautiqueDisplay-Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Beautique';src:url('fonts/BeautiqueDisplay-Medium.otf') format('opentype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Beautique';src:url('fonts/BeautiqueDisplay-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Beautique';src:url('fonts/BeautiqueDisplay-Italic.otf') format('opentype');font-weight:400;font-style:italic;font-display:swap}

/* ---- TOKENS (verbatim from index.html) ---- */
:root{
  --trinidad:#E34703;
  --srobus:#F78309;
  --ember:#7D2E0F;
  --gable:#1F2528;
  --gable-2:#171b1d;
  --gable-3:#262d30;
  --oldlace:#FDF6EE;
  --cream-dim:#e6dccd;
  --cream-soft:#c3bbb0;
  --line:rgba(253,246,238,.12);
  --grad:linear-gradient(100deg,var(--trinidad) 0%,var(--srobus) 100%);
  --shadow:0 24px 60px -20px rgba(0,0,0,.65);
  --maxw:1180px;
  --portal-maxw:820px;
  --warm-red:#ff7a55;
  --ok:#7fd6a0;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Averia Serif Libre',Georgia,serif;
  background:var(--gable);
  color:var(--oldlace);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  min-height:100vh;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}

/* subtle sun glow, kept light (matches auth.html) */
.sun{
  position:fixed;top:-10%;left:50%;transform:translateX(-50%);
  width:min(720px,120vw);height:min(720px,120vw);border-radius:50%;z-index:0;pointer-events:none;
  background:radial-gradient(circle at 50% 50%,rgba(247,131,9,.24) 0%,rgba(227,71,3,.12) 34%,transparent 66%);
  filter:blur(60px);opacity:.55;
}
/* film grain */
body::after{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}

/* ---- TYPE (verbatim) ---- */
.display{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;line-height:.92;letter-spacing:.01em}
.script{font-family:'Pinyon Script',cursive;text-transform:none;font-weight:400;color:var(--srobus);letter-spacing:.01em;line-height:1}
.eyebrow{font-family:'Beautique',serif;font-weight:500;text-transform:uppercase;letter-spacing:.34em;font-size:.72rem;color:var(--srobus)}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.wrap{max-width:var(--portal-maxw);margin:0 auto;padding:0 20px}

/* ---- BUTTONS (verbatim) ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  font-size:.95rem;padding:1.05rem 2rem;border-radius:999px;border:0;cursor:pointer;
  background:var(--grad);color:#fff;box-shadow:0 12px 30px -8px rgba(227,71,3,.6);
  transition:transform .25s ease,box-shadow .25s ease,filter .25s ease;white-space:nowrap;
}
.btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 18px 40px -10px rgba(227,71,3,.75);filter:brightness(1.05)}
.btn:disabled{opacity:.6;cursor:wait}
.btn-ghost{background:transparent;border:1.5px solid var(--line);color:var(--oldlace);box-shadow:none}
.btn-ghost:hover:not(:disabled){border-color:var(--srobus);background:rgba(247,131,9,.08)}
.btn-sm{font-size:.78rem;padding:.65rem 1.15rem}
.btn-block{width:100%}

/* ---- NAV (portal variant of index nav) ---- */
.p-nav{position:sticky;top:0;left:0;right:0;z-index:50;background:rgba(23,27,29,.82);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.p-nav-inner{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;max-width:var(--portal-maxw);margin:0 auto;gap:12px}
.p-nav-logo{height:36px;width:auto}
.p-nav-links{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.p-nav-links a{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem;color:var(--cream-soft);padding:.5rem .7rem;border-radius:999px;transition:color .2s,background .2s}
.p-nav-links a:hover{color:var(--oldlace)}
.p-nav-links a.on{color:#fff;background:rgba(247,131,9,.14)}
.p-nav-links a.signout{color:var(--cream-soft);border:1px solid var(--line)}
.p-nav-links a.signout:hover{border-color:var(--warm-red);color:var(--warm-red)}
@media(max-width:520px){.p-nav-logo{height:30px}.p-nav-links a{font-size:.66rem;padding:.45rem .55rem}}

/* ---- PAGE SCAFFOLD ---- */
.p-main{position:relative;z-index:2;padding:34px 0 80px}
.p-head{margin-bottom:26px}
.p-head .script{font-size:clamp(1.6rem,5vw,2.4rem);display:block;margin-bottom:-.2em;transform:rotate(-3deg)}
.p-head h1{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;line-height:1;font-size:clamp(1.9rem,7vw,2.9rem);color:var(--oldlace);margin:.35rem 0 .3rem}
.p-head p{color:var(--cream-dim);font-weight:300}
.p-head p b{color:var(--srobus);font-weight:700}

/* ---- CARDS ---- */
.card{
  position:relative;
  background:linear-gradient(160deg,rgba(38,45,48,.92) 0%,rgba(23,27,29,.92) 100%);
  border:1px solid var(--line);border-radius:22px;padding:1.6rem;
  box-shadow:var(--shadow);margin-bottom:16px;
}
.card-hd{display:flex;align-items:center;gap:.65rem;margin-bottom:1rem}
.card-hd .k{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:.68rem;color:var(--srobus)}
.card h2{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;font-size:1.25rem;color:var(--oldlace);line-height:1.05}
.card h3{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;font-size:.95rem;color:var(--oldlace);letter-spacing:.02em}
.muted{color:var(--cream-soft);font-weight:300;font-size:.92rem}
.card-link{display:inline-flex;align-items:center;gap:.4rem;margin-top:1rem;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;color:var(--srobus)}
.card-link:hover{color:var(--oldlace)}
.card-link::after{content:"→"}

/* ---- SIGN-IN CARD (signed-out hub) ---- */
.auth-card{max-width:440px;margin:6vh auto 0;text-align:center}
.auth-card .script{font-size:2rem;display:block;margin-bottom:-.1em;transform:rotate(-3deg)}
.auth-card h1{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;line-height:1;font-size:clamp(1.9rem,7vw,2.6rem);color:var(--oldlace);margin:.4rem 0 .6rem}
.auth-card .lead{color:var(--cream-dim);font-weight:300;margin-bottom:1.5rem}
.field{margin-bottom:.8rem;text-align:left}
.field label{display:block;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.66rem;color:var(--cream-soft);margin:0 0 .4rem .2rem}
.field input,.field select,.field textarea{
  width:100%;font-family:'Averia Serif Libre',serif;font-size:1rem;
  padding:1rem 1.1rem;border-radius:12px;border:1px solid var(--line);
  background:rgba(253,246,238,.04);color:var(--oldlace);
}
.field textarea{min-height:84px;resize:vertical;line-height:1.5}
.field input::placeholder,.field textarea::placeholder{color:var(--cream-soft)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--srobus);background:rgba(253,246,238,.07)}
.field select{-webkit-appearance:none;appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c3bbb0' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;background-size:11px;padding-right:2.1rem}
.field select option{color:#1F2528;background:#FDF6EE}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* status / notices */
.status{display:none;margin-top:1rem;font-size:.92rem;color:var(--warm-red)}
.status.show{display:block}
.status.ok{color:var(--ok)}
.notice{border:1px solid var(--line);border-radius:14px;padding:1rem 1.1rem;background:rgba(247,131,9,.06);color:var(--cream-dim);font-size:.9rem;font-weight:300}
.notice b{color:var(--oldlace);font-weight:700}
.back{display:inline-block;margin-top:1.6rem;font-size:.86rem;color:var(--cream-soft);font-weight:300}
.back:hover{color:var(--srobus)}

/* ---- DEMO RIBBON ---- */
.demo-ribbon{
  position:fixed;top:0;left:0;right:0;z-index:200;
  background:var(--grad);color:#fff;text-align:center;
  font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.14em;
  font-size:.62rem;padding:.4rem 1rem;box-shadow:0 6px 18px -6px rgba(0,0,0,.6);
}
body.is-demo .p-nav{top:22px}

/* ---- CHIPS / BANDS ---- */
.chip{display:inline-flex;align-items:center;gap:.4rem;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.64rem;padding:.4rem .75rem;border-radius:999px;border:1px solid var(--line);color:var(--cream-dim);background:rgba(253,246,238,.04)}
.chip.band{border-color:rgba(247,131,9,.5);color:var(--srobus);background:rgba(247,131,9,.08)}
.chip.ok{border-color:rgba(127,214,160,.4);color:var(--ok)}
/* session-kind chips (calendar) */
.chip.kind{font-size:.6rem;padding:.3rem .6rem}
.chip.kind-training{border-color:rgba(253,246,238,.22);color:var(--cream-dim);background:rgba(253,246,238,.05)}
.chip.kind-americana{border-color:rgba(247,131,9,.5);color:var(--srobus);background:rgba(247,131,9,.1)}
.chip.kind-event{border-color:rgba(227,71,3,.6);color:var(--oldlace);background:var(--grad);border:0}

/* dashboard grid */
.dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dash-grid .full{grid-column:1 / -1}
@media(max-width:640px){.dash-grid{grid-template-columns:1fr}}

/* ---- REPORT BLOCKS ---- */
.report{max-width:640px;margin:0 auto}
.blk{margin-bottom:14px}
.blk-headline{text-align:center;padding:2rem 1.6rem}
.blk-headline .big{font-family:'Beautique',serif;font-weight:900;font-size:clamp(3.4rem,20vw,6rem);line-height:.9;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:inline-block}
.blk-headline .lbl{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.82rem;color:var(--cream-dim);margin-top:.4rem}
.blk-insight{color:var(--cream-dim);font-weight:300;font-size:1.02rem;margin-top:.5rem}
.mix-bar{display:flex;height:16px;border-radius:999px;overflow:hidden;margin:1rem 0 .6rem;border:1px solid var(--line);background:rgba(253,246,238,.04)}
.mix-bar .fh{background:var(--grad)}
.mix-bar .bh{background:rgba(253,246,238,.18)}
.mix-legend{display:flex;gap:1.4rem;font-size:.8rem;color:var(--cream-soft);font-weight:300}
.mix-legend .sw{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:.4rem;vertical-align:middle}
.mix-legend .sw.fh{background:var(--srobus)}
.mix-legend .sw.bh{background:rgba(253,246,238,.4)}
.gotoshot{margin-top:.6rem;font-size:.92rem;color:var(--cream-dim)}
.gotoshot b{color:var(--oldlace)}

/* conversion block — visually emphasised */
.blk-weakness{border:1.5px solid rgba(247,131,9,.55);background:linear-gradient(160deg,rgba(227,71,3,.14),rgba(23,27,29,.95))}
.blk-weakness::before{content:"";position:absolute;inset:0;border-radius:22px;padding:1.5px;background:var(--grad);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.5;pointer-events:none}
.blk-weakness .card-hd .k{color:var(--warm-red)}
.blk-weakness h2{font-size:1.35rem}
.blk-weakness .detail{color:var(--cream-dim);font-weight:300;margin-top:.6rem}

/* CTA block */
.blk-cta{text-align:center;background:linear-gradient(160deg,var(--gable-3),var(--gable-2))}
.blk-cta h2{margin-bottom:1.1rem}
.blk-cta .fineprint{color:var(--cream-soft);font-size:.82rem;font-weight:300;margin-top:.9rem}

/* ============ PROSPECT MODULE (non-members) ============ */
/* Landing-copy CTA module shown to prospects, reordered to the top of the
   dashboard. Members never see it (hidden via JS). No pricing here. */
.pa-prospect{background:linear-gradient(160deg,var(--gable-3),var(--gable-2))}
.pa-prospect .script{font-size:1.5rem;display:block;color:var(--srobus)}
.pa-prospect-h{margin:.15rem 0 .35rem}
.pa-prospect-lead{max-width:560px;margin:0 0 1.2rem;font-size:1rem}
/* The one action: a dark inner card with an srobus hairline on top. */
.pa-firstsession{
  position:relative;border:1px solid var(--line);border-radius:16px;
  background:var(--gable);padding:1.15rem;margin-bottom:1.1rem;overflow:hidden;
}
.pa-firstsession::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad)}
.pa-firstsession p{margin:.5rem 0 1rem;color:var(--cream-soft)}
.pa-cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:.9rem}
.pa-cta-row .btn{margin:0}
.pa-cta-row .card-link{margin-top:0}
/* Pillar strip — the 4 landing pillars, light. */
.pa-pillars-hd{margin-bottom:.6rem}
.pa-pillar-list{list-style:none;margin:0 0 1rem;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.5rem .9rem}
.pa-pillar-list li{display:flex;align-items:center;gap:.5rem;color:var(--oldlace);font-size:.94rem}
.pa-pillar-list .ic{color:var(--srobus);font-weight:900}
/* Reorder: for a prospect the module leads (report card is empty pre-play). */
body.is-prospect #academy-cta{order:-1}
@media(max-width:520px){.pa-pillar-list{grid-template-columns:1fr}}

/* --- session header: title + date pill --- */
.pa-fs-hd{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.5rem}
.pa-date-pill{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.03em;
  font-size:.64rem;color:var(--oldlace);border:1px solid var(--line);background:rgba(247,131,9,.1);
  border-radius:999px;padding:.3rem .7rem;white-space:nowrap}
.pa-group-line{margin:0 0 .6rem;color:var(--cream-soft);font-size:.94rem}
.pa-group-line b{color:var(--srobus)}
/* --- social proof under the CTA --- */
.pa-social{display:flex;align-items:center;gap:.6rem;margin-top:.9rem}
.pa-avs{display:inline-flex;flex:none}
.pa-av{width:26px;height:26px;border-radius:50%;margin-left:-8px;display:inline-flex;align-items:center;justify-content:center;
  font-family:'Beautique',serif;font-weight:800;font-size:.72rem;color:#fff;background:var(--grad);
  border:2px solid var(--gable);box-shadow:0 1px 4px rgba(0,0,0,.4)}
.pa-av:first-child{margin-left:0}
.pa-social-txt{font-size:.86rem;color:var(--cream-soft);line-height:1.3}
.pa-social-txt b{color:var(--oldlace);font-weight:700}
/* --- courts preview --- */
.pa-courts-wrap{margin-top:1.1rem}
.pa-courts-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:.55rem}
.pa-courts-sub{font-family:'Beautique',serif;font-weight:700;font-size:.66rem;color:var(--cream-soft)}
.pa-courts{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem}
.pa-court{border-radius:12px;overflow:hidden;border:1px solid var(--line);
  background:linear-gradient(160deg,#1b3a4a,#12252f);padding:.5rem .45rem;position:relative}
.pa-court-side{display:flex;gap:.35rem}
.pa-net{height:2px;background:rgba(253,246,238,.28);margin:.4rem -0.1rem}
.pa-seat{flex:1 1 0;text-align:center;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;
  letter-spacing:.02em;font-size:.52rem;padding:.32rem .15rem;border-radius:7px;
  background:rgba(253,246,238,.06);border:1px solid rgba(253,246,238,.18);color:var(--cream-soft);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pa-seat.filled{background:rgba(247,131,9,.22);border-color:var(--srobus);color:var(--oldlace)}
@media(max-width:600px){.pa-courts{grid-template-columns:1fr;gap:.5rem}.pa-court{padding:.55rem}}
/* booked confirmation state */
.pa-booked{display:flex;align-items:center;gap:.5rem;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.5);
  border-radius:12px;padding:.7rem .9rem;color:var(--oldlace);font-size:.95rem;margin-bottom:.4rem}
.pa-booked b{color:var(--srobus)}
.pa-booked-tick{width:22px;height:22px;flex:none;border-radius:50%;background:#22c55e;color:#0b2a16;
  display:inline-flex;align-items:center;justify-content:center;font-weight:900;font-size:.8rem}
.pa-sim-link{display:inline-block;margin-top:.7rem;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;font-size:.66rem;color:var(--cream-soft);text-decoration:none;border:1px dashed var(--line);
  border-radius:999px;padding:.35rem .8rem}

/* ============ ADMIN · AMERICANA panel ============ */
.amer-funnel{display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem}
.amer-fstat{text-align:center;border:1px solid var(--line);border-radius:12px;padding:.7rem .3rem;background:var(--gable)}
.amer-fn{font-family:'Beautique',serif;font-weight:900;font-size:1.5rem;color:var(--srobus);line-height:1}
.amer-fl{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:.55rem;color:var(--cream-soft);margin-top:.35rem}
.amer-groups{display:flex;flex-wrap:wrap;gap:.5rem}
.amer-groups .chip b{color:var(--srobus)}
.amer-roster{display:flex;flex-wrap:wrap;gap:.5rem}
.amer-player{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--line);border-radius:999px;padding:.28rem .7rem .28rem .3rem;font-size:.85rem;color:var(--oldlace)}
.amer-av{width:22px;height:22px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:'Beautique',serif;font-weight:800;font-size:.66rem;color:#fff;background:var(--grad)}
.amer-via{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;font-size:.56rem;letter-spacing:.04em;color:var(--cream-soft);border:1px solid var(--line);border-radius:999px;padding:.05rem .4rem}
@media(max-width:600px){.amer-funnel{grid-template-columns:repeat(2,1fr)}}

/* locked / padlocked tier */
.locked-wrap{margin-top:30px}
.locked-wrap .lead{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;color:var(--cream-soft);text-align:center;margin-bottom:14px}
.locked-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.locked-grid{grid-template-columns:1fr}}
.locked{
  position:relative;border:1px dashed rgba(253,246,238,.18);border-radius:16px;padding:1.2rem 1.1rem;
  background:rgba(23,27,29,.7);overflow:hidden;
}
.locked .blurred{filter:blur(6px);opacity:.5;user-select:none;pointer-events:none}
.locked .blurred .fake{height:10px;border-radius:6px;background:linear-gradient(90deg,rgba(253,246,238,.25),rgba(253,246,238,.08));margin:.55rem 0}
.locked .blurred .fake.w70{width:70%}.locked .blurred .fake.w50{width:50%}.locked .blurred .fake.w90{width:90%}
.locked .lockbar{display:flex;align-items:center;gap:.55rem;margin-bottom:.6rem}
.locked .lockicon{flex:none;width:26px;height:26px;border-radius:50%;background:rgba(247,131,9,.14);display:grid;place-items:center;color:var(--srobus)}
.locked .lockicon svg{width:13px;height:13px;fill:currentColor}
.locked .lbl{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:.74rem;color:var(--oldlace);line-height:1.2}
.locked .unlock{position:relative;z-index:1;display:inline-flex;align-items:center;gap:.35rem;margin-top:.4rem;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.62rem;color:var(--srobus)}
.locked .unlock:hover{color:var(--oldlace)}

/* ---- COACH BOT ---- */
.coach{margin-top:30px}
.coach-log{display:flex;flex-direction:column;gap:10px;margin:1rem 0;max-height:340px;overflow-y:auto;padding-right:4px}
.msg{max-width:86%;padding:.7rem .95rem;border-radius:16px;font-size:.94rem;line-height:1.45;white-space:pre-wrap}
.msg.bot{align-self:flex-start;background:rgba(253,246,238,.06);border:1px solid var(--line);border-bottom-left-radius:5px;color:var(--cream-dim)}
.msg.me{align-self:flex-end;background:var(--grad);color:#fff;border-bottom-right-radius:5px}
.coach-quick{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:.9rem}
.coach-form{display:flex;gap:8px}
.coach-form input{flex:1;min-width:0;font-family:'Averia Serif Libre',serif;font-size:.95rem;padding:.85rem 1rem;border-radius:12px;border:1px solid var(--line);background:rgba(253,246,238,.04);color:var(--oldlace)}
.coach-form input:focus{outline:none;border-color:var(--srobus)}
.coach-form input::placeholder{color:var(--cream-soft)}

/* ---- CALENDAR / SESSIONS ---- */
.sess{display:flex;align-items:center;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.sess:last-child{border-bottom:0}
.sess .date{flex:none;width:58px;text-align:center}
.sess .date .d{font-family:'Beautique',serif;font-weight:900;font-size:1.6rem;line-height:1;color:var(--oldlace)}
.sess .date .m{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.6rem;color:var(--srobus);margin-top:.2rem}
.sess .info{flex:1;min-width:0}
.sess .info .t{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;font-size:.92rem;color:var(--oldlace);letter-spacing:.02em}
.sess .info .meta{color:var(--cream-soft);font-size:.82rem;font-weight:300;margin-top:.15rem}
.sess .act{flex:none}
.sess.is-full .act .full-tag{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.66rem;color:var(--warm-red)}
.cap{font-size:.78rem;color:var(--cream-soft);font-weight:300}
/* date-TBD placeholder in the date column (null starts_at) */
.sess .date.tbd .d{font-size:1.05rem;line-height:1.05;color:var(--srobus)}
.sess .date.tbd .m{color:var(--cream-soft)}
/* kind badge row above the meta line */
.sess .info .kinds{margin-bottom:.35rem;display:flex;gap:.4rem;flex-wrap:wrap}
/* "save the date" info state for community events (no booking action) */
.sess .act .save-date{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.64rem;color:var(--srobus)}
.sess.is-tbd .meta .tbd-note{color:var(--cream-dim)}
/* per-session credit cost line */
.sess .info .cost-1{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.66rem;color:var(--srobus);margin-top:.3rem}
/* out-of-credits: a persistent disabled Book button (not the loading state) */
.sess .act .btn:disabled{opacity:.45;cursor:not-allowed}
.notice.out-of-credits{border-color:rgba(227,71,3,.35);color:var(--oldlace)}

/* profile grid */
.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.profile-grid .full{grid-column:1 / -1}
@media(max-width:560px){.profile-grid{grid-template-columns:1fr}}

/* footer (verbatim look) */
footer{background:var(--gable-2);border-top:1px solid var(--line);padding:44px 0 34px;text-align:center;position:relative;z-index:2;margin-top:40px}
.foot-logo{height:44px;width:auto;margin:0 auto 1rem;opacity:.95}
.foot-claim{font-family:'Beautique';font-weight:400;font-style:italic;color:var(--cream-dim);font-size:.98rem;margin-bottom:1.1rem}
.foot-meta{display:flex;align-items:center;justify-content:center;gap:1.4rem;flex-wrap:wrap;color:var(--cream-soft);font-size:.84rem;letter-spacing:.06em}
.foot-meta a:hover{color:var(--srobus)}
.foot-fine{margin-top:1.4rem;font-size:.74rem;color:#5e6669}

.spinner{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:pa-spin .7s linear infinite;vertical-align:-3px}
@keyframes pa-spin{to{transform:rotate(360deg)}}
.center-note{text-align:center;color:var(--cream-soft);font-weight:300;padding:2rem 0}

/* ============================================================
   CHECKOUT (membership) — portal/checkout.html
   ============================================================ */
.checkout{max-width:640px;margin:0 auto}
.ben-list{list-style:none;display:flex;flex-direction:column;gap:1.05rem}
.ben{display:flex;gap:.85rem;align-items:flex-start}
.ben-ic{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--grad);box-shadow:0 6px 16px -6px rgba(227,71,3,.6)}
.ben-t{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:.92rem;color:var(--oldlace);line-height:1.15}
.ben-d{color:var(--cream-dim);font-weight:300;font-size:.9rem;margin-top:.2rem}
.cost-card{margin-top:16px}
.cost-amount{font-family:'Beautique',serif;font-weight:900;font-size:clamp(2.4rem,12vw,3.4rem);line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:inline-block}
.cost-amount .per{-webkit-text-fill-color:var(--cream-soft);font-size:1rem;font-weight:700;letter-spacing:.04em}
.cost-note{color:var(--warm-red);font-size:.78rem;font-weight:400;margin-top:.5rem;letter-spacing:.02em}
.pay-safe{text-align:center;color:var(--cream-soft);font-size:.8rem;font-weight:300;margin-top:1rem}
.pay-safe b{color:var(--cream-dim);font-weight:700}
.thanks-ic{width:56px;height:56px;border-radius:50%;margin:0 auto .4rem;display:grid;place-items:center;color:#fff;background:var(--grad)}
.thanks-ic svg{width:30px;height:30px}

/* ============================================================
   CAMERA blocks — court heatmap + highlights (report.html)
   From a camera partner (NOT the PadelPlay sensor).
   ============================================================ */
.heat-toggle{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:1rem}
.heat-seg{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:.62rem;padding:.42rem .8rem;border-radius:999px;border:1px solid var(--line);color:var(--cream-soft);background:rgba(253,246,238,.04);cursor:pointer;transition:.15s;white-space:nowrap}
.heat-seg:hover{color:var(--oldlace)}
.heat-seg.on{background:var(--grad);border-color:transparent;color:#fff}
.court-wrap{position:relative;max-width:340px;margin:0 auto;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:linear-gradient(160deg,#1b3a4a,#12252f)}
.court-svg{display:block;width:100%;height:auto}
.heat-caption{text-align:center;color:var(--cream-soft);font-size:.82rem;font-weight:300;margin-top:.7rem}
.heat-caption b{color:var(--cream-dim)}
.cam-source{text-align:center;color:#6f7679;font-size:.68rem;font-weight:300;letter-spacing:.04em;margin-top:.4rem}
.hl-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.hl-grid{grid-template-columns:1fr}}
.hl{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:rgba(23,27,29,.7)}
.hl video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#000}
.hl-ph{position:relative;aspect-ratio:16/9;display:grid;place-items:center;background:linear-gradient(160deg,var(--gable-3),var(--gable-2));color:var(--cream-soft)}
.hl-ph .play{width:48px;height:48px;border-radius:50%;background:rgba(0,0,0,.45);display:grid;place-items:center;color:#fff;font-size:20px;padding-left:3px}
.hl-ph .ph-tag{position:absolute;bottom:8px;left:8px;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.56rem;color:var(--cream-soft);background:rgba(0,0,0,.5);padding:.2rem .5rem;border-radius:999px}
.hl-meta{padding:.65rem .8rem}
.hl-label{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;font-size:.72rem;letter-spacing:.02em;color:var(--oldlace);line-height:1.15}
.hl-shot{color:var(--srobus);font-size:.68rem;font-weight:300;margin-top:.15rem;text-transform:capitalize}
.cam-empty{text-align:center;color:var(--cream-soft);font-weight:300;font-size:.9rem;padding:.4rem 0}
.cam-empty b{color:var(--cream-dim)}

/* ============================================================
   UNLOCKED (paid-member) report tier — report.html
   Shown only to an active member (or ?demo=1&unlocked=1 preview).
   Premium, on-brand: ember/cream, same fonts + cards as the rest.
   ============================================================ */
.blk-member{text-align:center;background:linear-gradient(160deg,rgba(247,131,9,.10),rgba(23,27,29,.96));border:1.5px solid rgba(247,131,9,.4)}
.blk-member .card-hd .k{color:var(--srobus)}
.member-check{width:52px;height:52px;border-radius:50%;margin:0 auto .5rem;display:grid;place-items:center;color:#fff;font-size:1.5rem;font-weight:700;background:var(--grad);box-shadow:0 10px 26px -8px rgba(227,71,3,.6)}
.member-tag{margin-left:auto;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.56rem;color:var(--srobus);background:rgba(247,131,9,.12);border:1px solid rgba(247,131,9,.4);padding:.28rem .6rem;border-radius:999px}

.unlocked-wrap{margin-top:26px}
.unlocked-wrap .lead{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;color:var(--srobus);text-align:center;margin-bottom:16px}
.unlocked-card{border:1px solid rgba(247,131,9,.28)}

/* (a) shot breakdown table */
.sb-legend{display:flex;gap:1.3rem;font-size:.76rem;color:var(--cream-soft);font-weight:300;margin-bottom:1rem}
.sb-legend .sw{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:.4rem;vertical-align:middle}
.sb-legend .sw.played{background:var(--srobus)}
.sb-legend .sw.err{background:var(--warm-red)}
.sb-table{display:flex;flex-direction:column;gap:.7rem}
.sb-row{display:grid;grid-template-columns:120px 1fr auto;align-items:center;gap:.8rem}
.sb-name{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;font-size:.68rem;letter-spacing:.02em;color:var(--oldlace)}
.sb-bar{position:relative;height:14px;border-radius:999px;overflow:hidden;background:rgba(253,246,238,.05);border:1px solid var(--line)}
.sb-bar .sb-played{position:absolute;inset:0 auto 0 0;height:100%;background:var(--grad);border-radius:999px}
.sb-bar .sb-err{position:absolute;inset:0 auto 0 0;height:100%;background:repeating-linear-gradient(45deg,var(--warm-red),var(--warm-red) 3px,rgba(255,122,85,.55) 3px,rgba(255,122,85,.55) 6px);border-radius:999px;opacity:.95}
.sb-num{font-family:'Beautique',serif;font-weight:900;font-size:1rem;color:var(--oldlace);text-align:right;min-width:56px}
.sb-num .sb-e{display:block;font-family:'Averia Serif Libre',serif;font-weight:300;font-size:.68rem;color:var(--warm-red);letter-spacing:.02em}
@media(max-width:480px){.sb-row{grid-template-columns:92px 1fr auto;gap:.5rem}.sb-name{font-size:.6rem}}

/* (b) coach plan */
.cp-group{padding:.9rem 0;border-top:1px solid var(--line)}
.cp-group:first-of-type{border-top:0;padding-top:0}
.cp-hd{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.7rem;color:var(--srobus);margin-bottom:.5rem}
.cp-list{list-style:none;display:flex;flex-direction:column;gap:.5rem}
.cp-list li{position:relative;padding-left:1.1rem;color:var(--cream-dim);font-weight:300;font-size:.92rem;line-height:1.45}
.cp-list li::before{content:"›";position:absolute;left:0;top:0;color:var(--srobus);font-weight:700}

/* (c) trend sparkline */
.trend-card .spark-wrap{position:relative;margin:.4rem 0 1.6rem}
.spark{display:block;width:100%;height:88px}
.tr-labels{position:relative;height:1rem;margin-top:.3rem}
.tr-lbl{position:absolute;transform:translateX(-50%);font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:.56rem;color:var(--cream-soft);white-space:nowrap}
.tr-lbl:first-child{transform:translateX(0)}
.tr-lbl:last-child{transform:translateX(-100%)}
.tr-metric{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.62rem;color:var(--cream-soft)}
.tr-insight{color:var(--cream-dim);font-weight:300;font-size:.96rem;margin-top:.4rem;line-height:1.45}

/* (d) 4-week drill plan */
.dp-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.dp-grid{grid-template-columns:1fr}}
.dp-week{border:1px solid var(--line);border-radius:14px;padding:1rem 1.05rem;background:rgba(23,27,29,.6)}
.dp-wk{display:flex;flex-direction:column;gap:.15rem;margin-bottom:.6rem}
.dp-num{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;letter-spacing:.06em;font-size:.78rem;color:var(--srobus)}
.dp-theme{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:.66rem;color:var(--oldlace)}
.dp-list{list-style:none;display:flex;flex-direction:column;gap:.4rem}
.dp-list li{position:relative;padding-left:1rem;color:var(--cream-dim);font-weight:300;font-size:.86rem;line-height:1.4}
.dp-list li::before{content:"";position:absolute;left:0;top:.55em;width:5px;height:5px;border-radius:50%;background:var(--srobus)}

/* ---- POST TO INSTAGRAM (highlight clips) ---- */
.hl-ig{width:100%;margin-top:.7rem;gap:.5rem;font-size:.74rem;padding:.62rem 1rem}
.btn-ig{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;border:none;border-radius:12px;cursor:pointer;color:#fff;background:var(--grad);box-shadow:0 10px 24px -10px rgba(227,71,3,.6);transition:transform .15s,box-shadow .2s}
.btn-ig:hover{transform:translateY(-1px);box-shadow:0 14px 28px -10px rgba(227,71,3,.7)}
.btn-ig:active{transform:translateY(0)}
.btn-ig svg{width:16px;height:16px;flex:none}

/* ---- TOAST (non-blocking hint) ---- */
.pui-toast{
  position:fixed;left:50%;bottom:24px;transform:translate(-50%,16px);z-index:300;
  max-width:min(92vw,420px);padding:.8rem 1.15rem;border-radius:14px;
  background:var(--gable-3);border:1px solid var(--line);color:var(--oldlace);
  font-family:'Averia Serif Libre',serif;font-size:.9rem;font-weight:300;line-height:1.35;text-align:center;
  box-shadow:0 16px 40px -12px rgba(0,0,0,.7);
  opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;
}
.pui-toast.show{opacity:1;transform:translate(-50%,0)}

/* ============================================================
   CREDITS DOCKED STICKY RAIL — the single credits display for the whole
   portal (PUI.creditSidebar). Replaces the old top banner AND the wordy
   calendar "Your credits" section.

   LAYOUT: PUI wraps the page's <main.p-main> in .p-shell (a flex row) and
   docks .pa-credit-rail beside it. The rail is position:sticky with a top
   offset that clears the sticky .p-nav (z-index 30, BELOW .p-nav's 50, so
   it never overlaps the nav). The main column keeps the centred portal
   width; the shell is just wide enough to add the rail in the gutter.

   NARROW (<=1100px): the shell collapses to one column and the rail moves
   ABOVE the content (flex order) as an inline card — it degrades, never
   breaks the layout (mobile polish is a later task).
   ============================================================ */
.p-shell{
  display:flex;align-items:flex-start;gap:28px;
  max-width:calc(var(--portal-maxw) + 28px + 248px);
  margin:0 auto;padding:0 20px;
}
/* The main column no longer self-centres — the shell centres the pair.
   Neutralise .wrap's own max-width/margin/padding when it's inside .p-shell. */
.p-shell > main.wrap{max-width:none;margin:0;padding:0;flex:1 1 auto;min-width:0}
.pa-credit-rail{
  position:sticky;z-index:30;
  top:88px;            /* clear the sticky .p-nav (nav height ≈ 68px) */
  flex:0 0 248px;width:248px;align-self:flex-start;
  background:linear-gradient(160deg,rgba(38,45,48,.96) 0%,rgba(23,27,29,.96) 100%);
  border:1px solid var(--line);border-radius:18px;padding:1.35rem 1.3rem;
  box-shadow:var(--shadow);
}
body.is-demo .pa-credit-rail{top:110px}   /* + the demo ribbon */
.pa-credit-rail.urgent{
  border-color:rgba(227,71,3,.7);
  background:linear-gradient(160deg,rgba(227,71,3,.16) 0%,rgba(23,27,29,.96) 100%);
}
/* <=3 days: the UI-only "final days" last stretch — a stronger ember push
   (brighter fill + glow). Credits still expire at a hard 30 days; this is
   purely a visual nudge, not extra redeemable time. */
.pa-credit-rail.final{
  border-color:var(--trinidad);
  background:linear-gradient(160deg,rgba(227,71,3,.26) 0%,rgba(23,27,29,.97) 100%);
  box-shadow:var(--shadow),0 0 0 1px rgba(227,71,3,.35),0 0 26px -6px rgba(227,71,3,.5);
}
.pa-cs-k{
  font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;
  letter-spacing:.16em;font-size:.62rem;color:var(--srobus);display:block;margin-bottom:.55rem;
}
.pa-cs-bal{
  font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;line-height:.9;
  font-size:3rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;display:inline-block;
}
.pa-cs-unit{
  font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  font-size:.72rem;color:var(--cream-dim);margin-top:.15rem;
}
.pa-cs-expiry{
  color:var(--cream-soft);font-weight:300;font-size:.82rem;line-height:1.4;margin-top:.6rem;
}
.pa-cs-expiry b{color:var(--cream-dim);font-weight:700}
.pa-cs-days{
  display:flex;align-items:center;gap:.4rem;margin-top:.5rem;
  font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  font-size:.66rem;color:var(--cream-dim);
}
.pa-cs-days.urgent{color:var(--warm-red)}
.pa-cs-days.final{color:var(--trinidad)}
.pa-cs-zero{color:var(--cream-soft);font-weight:300;font-size:.84rem;line-height:1.45;margin-top:.4rem}
.pa-cs-cta{
  display:inline-flex;align-items:center;justify-content:center;width:100%;
  margin-top:1.1rem;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;
  letter-spacing:.06em;font-size:.7rem;color:#fff;background:var(--grad);
  padding:.7rem 1rem;border-radius:999px;box-shadow:0 10px 24px -10px rgba(227,71,3,.6);
  transition:filter .2s,transform .2s;
}
.pa-cs-cta:hover{filter:brightness(1.08);transform:translateY(-1px)}
.pa-cs-fine{
  color:var(--cream-soft);font-weight:300;font-size:.72rem;line-height:1.4;
  margin-top:.9rem;padding-top:.85rem;border-top:1px solid var(--line);
}
/* Extra-credit top-up, inside the SAME rail — the one credits surface. */
.pa-cs-topup{margin-top:.9rem;padding-top:.85rem;border-top:1px solid var(--line)}
.pa-cs-topup-k{
  font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;
  letter-spacing:.1em;font-size:.6rem;color:var(--cream-dim);margin-bottom:.5rem;
}
.pa-cs-topup-row{display:flex;flex-wrap:wrap;gap:.4rem}
.pa-cs-topup-btn{
  font-family:'Beautique',serif;font-weight:700;font-size:.68rem;letter-spacing:.02em;
  color:var(--oldlace,#FDF6EE);background:rgba(253,246,238,.06);
  border:1px solid var(--line);border-radius:999px;padding:.4rem .75rem;
  cursor:pointer;transition:background .15s,border-color .15s;
}
.pa-cs-topup-btn:hover{background:rgba(253,246,238,.12);border-color:var(--srobus)}
.pa-cs-topup-btn:disabled{opacity:.5;cursor:default}
/* NARROW (<=1100px): stack to one column, rail as an inline card ABOVE the
   content. It degrades gracefully — never breaks the layout. */
@media (max-width:1100px){
  .p-shell{flex-direction:column;gap:16px;max-width:var(--portal-maxw)}
  .p-shell > main.wrap{width:100%}
  .pa-credit-rail{
    position:static;order:-1;width:100%;flex:none;
  }
}

/* ============================================================
   Phase 1 — cancel-confirm modal, spots-left, share, event page
   ============================================================ */

/* ---- Danger button (in-window cancel = credit forfeit) ---- */
.btn-danger{background:linear-gradient(100deg,var(--ember) 0%,var(--trinidad) 100%);box-shadow:0 12px 30px -8px rgba(125,46,15,.65)}

/* ---- Branded confirm modal (replaces window.confirm) ---- */
.pui-modal-backdrop{
  position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;
  padding:1.2rem;background:rgba(15,18,20,.72);backdrop-filter:blur(4px);
  animation:pui-fade .18s ease;
}
@keyframes pui-fade{from{opacity:0}to{opacity:1}}
.pui-modal{
  width:100%;max-width:420px;background:var(--gable-2);border:1px solid var(--line);
  border-radius:18px;padding:1.6rem 1.5rem 1.35rem;box-shadow:var(--shadow);
  animation:pui-rise .2s cubic-bezier(.2,.8,.2,1);
}
@keyframes pui-rise{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.pui-modal.danger{border-color:rgba(227,71,3,.4)}
.pui-modal-title{
  font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;letter-spacing:.03em;
  font-size:1.02rem;color:var(--oldlace);margin-bottom:.6rem;
}
.pui-modal-body{color:var(--cream-dim);font-weight:300;font-size:.94rem;line-height:1.55}
.pui-modal-actions{display:flex;gap:.7rem;justify-content:flex-end;margin-top:1.4rem;flex-wrap:wrap}
.pui-modal-actions .btn{flex:0 1 auto}

/* ---- Spots-left label (1..5 only; 0 = Full) ---- */
.spots{
  display:inline-block;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;
  letter-spacing:.06em;font-size:.66rem;color:var(--srobus);margin-top:.3rem;
}
.spots.full{color:var(--warm-red)}
.sess .info .spots{margin-top:.3rem}

/* ---- Share row (calendar rows + event page) ---- */
.share-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:.55rem}
.share-btn{
  display:inline-flex;align-items:center;gap:.35rem;cursor:pointer;
  font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  font-size:.6rem;color:var(--cream-soft);background:transparent;border:1px solid var(--line);
  border-radius:999px;padding:.4rem .7rem;transition:color .2s,border-color .2s,background .2s;
}
.share-btn:hover{color:var(--oldlace);border-color:var(--srobus);background:rgba(247,131,9,.08)}
.share-btn svg{width:13px;height:13px;flex:none}
.share-btn.wa:hover{border-color:#25D366;color:#25D366}

/* ---- Public event page ---- */
.ev-wrap{max-width:640px;margin:0 auto}
.ev-card{margin-top:1.2rem}
.ev-kinds{margin-bottom:.9rem}
.ev-title{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;font-size:1.55rem;line-height:1.1;color:var(--oldlace);letter-spacing:.01em}
.ev-when{margin-top:.9rem;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:.92rem;color:var(--srobus)}
.ev-when .tbd-note{color:var(--cream-dim)}
.ev-facts{display:flex;flex-direction:column;gap:.55rem;margin-top:1.2rem}
.ev-fact{display:flex;gap:.7rem;align-items:baseline;font-size:.92rem}
.ev-fact .k{flex:none;width:78px;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.62rem;color:var(--cream-soft)}
.ev-fact .v{color:var(--cream-dim);font-weight:300}
.ev-desc{margin-top:1.3rem;color:var(--cream-dim);font-weight:300;line-height:1.6;font-size:.98rem}
.ev-spots{margin-top:1.2rem}
.ev-cta{margin-top:1.6rem}
.ev-cta .btn{width:100%}
.ev-signin{margin-top:.7rem;color:var(--cream-soft);font-weight:300;font-size:.86rem;text-align:center}
.ev-share{margin-top:1.6rem;padding-top:1.3rem;border-top:1px solid var(--line)}
.ev-share .lbl{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.62rem;color:var(--cream-soft);margin-bottom:.7rem}
.ev-note{text-align:center;color:var(--cream-soft);font-weight:300;margin-top:2rem}

/* ============================================================
   ADMIN — in-portal event management (portal/admin.html)
   Brand-matched (ember/cream); reuses .card/.btn/.field/.sess.
   ============================================================ */
.adm-topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1rem}
.adm-topbar .adm-count{color:var(--cream-soft);font-weight:300;font-size:.86rem}
.adm-actions{display:flex;gap:.6rem;flex-wrap:wrap}

/* Session list rows reuse .sess; admin adds a status pill + edit/cancel acts. */
.adm-row .info .t{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.adm-status{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.58rem;padding:.28rem .55rem;border-radius:999px;border:1px solid var(--line);color:var(--cream-dim);background:rgba(253,246,238,.04)}
.adm-status.open{border-color:rgba(127,214,160,.4);color:var(--ok)}
.adm-status.cancelled{border-color:rgba(255,122,85,.45);color:var(--warm-red)}
.adm-status.full{border-color:rgba(247,131,9,.5);color:var(--srobus)}
.adm-status.done{color:var(--cream-soft)}
.adm-row.is-cancelled{opacity:.62}
.adm-row .act{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}

/* The add/edit form panel. Two-column grid on wide, single on narrow. */
.adm-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.adm-form-grid .full{grid-column:1 / -1}
@media(max-width:640px){.adm-form-grid{grid-template-columns:1fr}}
.adm-form-title{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;font-size:1.15rem;color:var(--oldlace);margin-bottom:1rem}
.adm-cap-hint{color:var(--cream-soft);font-weight:300;font-size:.76rem;margin-top:.35rem}
/* The date row goes disabled/hidden when "date TBD" is toggled on. */
.adm-tbd-row{display:flex;align-items:center;gap:.6rem;margin:.2rem 0 .4rem}
.adm-tbd-row input[type=checkbox]{width:18px;height:18px;accent-color:var(--srobus);cursor:pointer}
.adm-tbd-row label{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.66rem;color:var(--cream-soft);cursor:pointer;margin:0}
.adm-datetime.is-tbd{opacity:.4;pointer-events:none}
.adm-form-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.2rem}
.adm-form-actions .btn{flex:0 1 auto}

/* ============================================================
   PHASE 3 — SOCIAL LAYER
   Privacy toggles (profile), the member directory, the court line-up,
   and the "X and N others going" line. Ember/cream throughout; degrades
   to a single column on narrow screens (mobile polish is a later task).
   ============================================================ */

/* ---- Profile privacy toggles ---- */
.privacy-block{border-top:1px solid var(--line);margin:.4rem 0 1.2rem;padding-top:1.1rem}
.privacy-hd{margin-bottom:.6rem}
.privacy-hd .k{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:.68rem;color:var(--srobus)}
.privacy-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--line);cursor:pointer}
.privacy-row:last-child{border-bottom:0}
.privacy-copy{display:flex;flex-direction:column;gap:.2rem;min-width:0}
.privacy-label{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.03em;font-size:.8rem;color:var(--oldlace)}
.privacy-hint{color:var(--cream-soft);font-weight:300;font-size:.82rem;line-height:1.4}
/* The switch: a checkbox styled as an ember track+knob. */
.switch{flex:none;position:relative;width:46px;height:26px;margin-top:.15rem}
.switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:2}
.switch .track{position:absolute;inset:0;border-radius:999px;background:rgba(253,246,238,.12);border:1px solid var(--line);transition:background .2s,border-color .2s}
.switch .track::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--cream-soft);transition:transform .2s,background .2s}
.switch input:checked + .track{background:var(--grad);border-color:transparent}
.switch input:checked + .track::after{transform:translateX(20px);background:#fff}
.switch input:focus-visible + .track{outline:2px solid var(--srobus);outline-offset:2px}

/* ---- Member directory ---- */
.dir-search{display:flex;gap:.6rem;margin-bottom:1.2rem;flex-wrap:wrap}
.dir-search input{flex:1;min-width:180px;font-family:'Averia Serif Libre',serif;font-size:.95rem;
  padding:.85rem 1rem;border:1.5px solid var(--line);border-radius:12px;background:rgba(253,246,238,.04);color:var(--oldlace)}
.dir-search input::placeholder{color:var(--cream-soft)}
.dir-search input:focus{outline:none;border-color:var(--srobus);background:rgba(253,246,238,.07)}
.dir-row{display:flex;align-items:center;gap:.85rem;padding:.85rem 0;border-bottom:1px solid var(--line)}
.dir-row:last-child{border-bottom:0}
.dir-avatar{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  font-family:'Beautique',serif;font-weight:900;font-size:1rem;color:#fff;background:var(--grad);text-transform:uppercase}
.dir-info{flex:1;min-width:0}
.dir-name{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;font-size:.9rem;color:var(--oldlace);letter-spacing:.02em}
.dir-band{color:var(--cream-soft);font-size:.78rem;font-weight:300;margin-top:.1rem}
.dir-act{flex:none}
.dir-act .chip.ok{white-space:nowrap}
.dir-act .pending{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.62rem;color:var(--cream-soft)}
.req-actions{display:flex;gap:.45rem}

/* ---- Phase 4: Create-a-match ---- */
.mt-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
@media(max-width:520px){.mt-grid{grid-template-columns:1fr}}
.mt-card .act{align-self:flex-start;margin-left:auto}
.mt-lineup{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.5rem}
.mt-lineup .chip{font-size:.6rem;padding:.3rem .6rem}
.mt-card.mt-focus{background:rgba(247,131,9,.09);border-radius:14px;box-shadow:0 0 0 1px rgba(247,131,9,.5) inset;transition:background .4s,box-shadow .4s}

/* ---- Court line-up (reuses the report court frame) ---- */
.lineup-wrap{position:relative;max-width:320px;margin:0 auto;border-radius:14px;overflow:hidden;
  border:1px solid var(--line);background:linear-gradient(160deg,#1b3a4a,#12252f)}
.lineup-svg{display:block;width:100%;height:auto}
.lineup-slot{cursor:default}
.lineup-slot .seat{fill:rgba(253,246,238,.06);stroke:rgba(253,246,238,.35);stroke-width:1}
.lineup-slot.filled .seat{fill:rgba(247,131,9,.22);stroke:var(--srobus);stroke-width:1.3}
.lineup-slot .nm{font-family:'Beautique',serif;font-weight:700;font-size:6px;fill:var(--oldlace);text-anchor:middle;text-transform:uppercase;letter-spacing:.3px}
.lineup-slot .empty-nm{fill:var(--cream-soft)}
.lineup-cap{text-align:center;color:var(--cream-soft);font-size:.8rem;font-weight:300;margin-top:.7rem}
.lineup-cap b{color:var(--oldlace);font-weight:700}
.lineup-more{text-align:center;color:var(--srobus);font-family:'Beautique',serif;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;font-size:.66rem;margin-top:.4rem}

/* ---- "X and N others going" ---- */
.going{display:inline-flex;align-items:center;gap:.35rem;font-family:'Beautique',serif;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;font-size:.66rem;color:var(--cream-dim);margin-top:.3rem}
.going .dot{width:5px;height:5px;border-radius:50%;background:var(--srobus);flex:none}
.sess .info .going{margin-top:.3rem}
.ev-going{margin:.2rem 0 .4rem}

/* ---- Friends surface (directory + hub) ---- */
.friends-strip{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.3rem}
.friend-pill{display:inline-flex;align-items:center;gap:.45rem;border:1px solid var(--line);border-radius:999px;
  padding:.3rem .3rem .3rem .75rem;background:rgba(253,246,238,.04)}
.friend-pill .fp-name{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;font-size:.66rem;letter-spacing:.04em;color:var(--oldlace)}
.friend-pill .fp-avatar{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-family:'Beautique',serif;font-weight:900;font-size:.62rem;color:#fff;background:var(--grad);text-transform:uppercase}
.friend-sess{color:var(--cream-soft);font-weight:300;font-size:.85rem;line-height:1.5}
.friend-sess b{color:var(--oldlace);font-weight:700}

/* ============================================================
   v2 SOCIAL — merged Profile + Members page (portal/social.html)
   Reuses .card / .field / .dir-row / .friend-pill / .chip / .switch.
   ============================================================ */

/* Avatar photos slotted into the existing initials circles. The circle
   keeps its gradient background as a fallback; the img covers it. */
.dir-avatar img,.fp-avatar img,.soc-avatar img,.mp-avatar img{
  width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}

/* ---- Profile card (top of Social) ---- */
.soc-profile{display:flex;align-items:center;gap:1.1rem;flex-wrap:wrap}
.soc-avatar{flex:none;width:72px;height:72px;border-radius:50%;display:grid;place-items:center;
  font-family:'Beautique',serif;font-weight:900;font-size:1.7rem;color:#fff;background:var(--grad);
  text-transform:uppercase;overflow:hidden}
.soc-id{flex:1;min-width:0}
.soc-name{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;letter-spacing:.02em;
  font-size:1.3rem;color:var(--oldlace);line-height:1.1}
.soc-meta{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}
.soc-level{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  font-size:.64rem;padding:.4rem .75rem;border-radius:999px;border:1px solid rgba(247,131,9,.5);
  color:var(--srobus);background:rgba(247,131,9,.08)}
.soc-stat{color:var(--cream-dim);font-weight:300;font-size:.88rem;margin-top:.55rem}
.soc-stat b{color:var(--oldlace);font-weight:700}
.soc-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1.1rem}
.soc-actions .btn{flex:0 1 auto}

/* Avatar upload preview row inside the settings form. */
.avatar-field{display:flex;align-items:center;gap:1rem;margin-bottom:.9rem}
.avatar-preview{flex:none;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;
  font-family:'Beautique',serif;font-weight:900;font-size:1.5rem;color:#fff;background:var(--grad);
  text-transform:uppercase;overflow:hidden}
.avatar-preview img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.avatar-ctl{flex:1;min-width:0}
.avatar-ctl .file-btn{display:inline-block;cursor:pointer;font-family:'Beautique',serif;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;font-size:.66rem;padding:.55rem .95rem;border-radius:999px;
  border:1px solid var(--line);color:var(--oldlace);background:rgba(253,246,238,.04)}
.avatar-ctl input[type=file]{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.avatar-ctl .avatar-hint{color:var(--cream-soft);font-weight:300;font-size:.78rem;margin-top:.4rem}

/* Clickable directory / friend names → open the full profile. */
.dir-name.clickable,.fp-name.clickable{cursor:pointer}
.dir-name.clickable:hover,.fp-name.clickable:hover{color:var(--srobus)}

/* ---- Full member profile modal body ---- */
.mp-head{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
.mp-avatar{flex:none;width:60px;height:60px;border-radius:50%;display:grid;place-items:center;
  font-family:'Beautique',serif;font-weight:900;font-size:1.5rem;color:#fff;background:var(--grad);
  text-transform:uppercase;overflow:hidden}
.mp-name{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;font-size:1.1rem;color:var(--oldlace)}
.mp-chips{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.4rem}
.mp-stat{color:var(--cream-dim);font-weight:300;font-size:.9rem;margin:.2rem 0 .6rem}
.mp-stat b{color:var(--oldlace);font-weight:700}
.mp-results-k{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.12em;
  font-size:.6rem;color:var(--srobus);margin:.6rem 0 .4rem}
.mp-results{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.4rem}
.mp-results .chip{font-size:.62rem}
.mp-act{margin-top:1.1rem}
.mp-link{display:inline-block;margin-top:.5rem;color:var(--srobus);font-family:'Beautique',serif;
  font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.64rem}

/* ============================================================
   v2 CLUBS — stepped match creator, slot cards, match state
   badges + Sessions IA (portal/sessions.html + admin panel).
   ============================================================ */

/* ---- Sessions subtabs ---- */
.subtabs{display:flex;gap:.5rem;margin-bottom:1.4rem;flex-wrap:wrap}
.subtab{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  font-size:.72rem;padding:.6rem 1.1rem;border-radius:999px;border:1px solid var(--line);
  background:rgba(253,246,238,.04);color:var(--cream-soft);cursor:pointer;transition:color .2s,background .2s,border-color .2s}
.subtab:hover{color:var(--oldlace)}
.subtab.on{color:#fff;background:var(--grad);border-color:transparent}
.subpane[hidden]{display:none}

/* ---- Match state badge ---- */
.mt-state{display:inline-flex;align-items:center;gap:.3rem;font-family:'Beautique',serif;font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;font-size:.6rem;padding:.3rem .6rem;border-radius:999px;
  border:1px solid var(--line);color:var(--cream-dim);background:rgba(253,246,238,.04);white-space:nowrap}
.mt-state.state-pending{border-color:rgba(247,131,9,.55);color:var(--srobus);background:rgba(247,131,9,.1)}
.mt-state.state-confirmed{border-color:rgba(127,214,160,.5);color:var(--ok);background:rgba(127,214,160,.08)}
.mt-state.state-booked{border-color:rgba(95,170,222,.55);color:#7fbfe6;background:rgba(95,170,222,.1)}
.mt-state.state-cancelled{color:var(--cream-soft)}
.mt-states{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.35rem}

/* ---- Stepped creator (wizard) ---- */
.wiz-steps{display:flex;align-items:center;gap:.5rem;margin-bottom:1.2rem;flex-wrap:wrap}
.wiz-step{display:inline-flex;align-items:center;gap:.45rem;font-family:'Beautique',serif;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;font-size:.62rem;color:var(--cream-soft)}
.wiz-step .n{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:.66rem;
  border:1px solid var(--line);color:var(--cream-soft);background:rgba(253,246,238,.04)}
.wiz-step.on .n{background:var(--grad);color:#fff;border-color:transparent}
.wiz-step.done .n{border-color:var(--srobus);color:var(--srobus)}
.wiz-step.on{color:var(--oldlace)}
.wiz-sep{flex:1;height:1px;background:var(--line);min-width:12px}
.wiz-pane[hidden]{display:none}
.wiz-nav{display:flex;justify-content:space-between;gap:.6rem;margin-top:1.2rem}

/* ---- Club cards ---- */
.club-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.9rem}
.club-card{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);
  cursor:pointer;text-align:left;padding:0;background:#12252f;aspect-ratio:4/3;transition:border-color .2s,transform .15s}
.club-card:hover{border-color:var(--srobus);transform:translateY(-2px)}
.club-card.on{border-color:var(--srobus);box-shadow:0 0 0 1px var(--srobus) inset}
.club-card .club-bg{position:absolute;inset:0;background-size:cover;background-position:center;
  background-color:#12252f}
.club-card .club-fallback{position:absolute;inset:0;display:grid;place-items:center;font-size:2.4rem;
  background:linear-gradient(160deg,#1b3a4a,#12252f)}
.club-card .club-meta{position:absolute;left:0;right:0;bottom:0;padding:.7rem .8rem;
  background:linear-gradient(transparent,rgba(8,10,11,.85))}
.club-card .club-name{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;
  font-size:.82rem;color:#fff;line-height:1.05}
.club-card .club-city{font-family:'Averia Serif Libre',serif;font-weight:300;font-size:.72rem;color:var(--cream-dim);margin-top:.15rem}

/* ---- Slot cards ---- */
.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.7rem}
.slot-card{border-radius:12px;border:1px solid var(--line);background:rgba(253,246,238,.04);
  padding:.85rem .9rem;cursor:pointer;text-align:left;transition:border-color .2s,background .2s}
.slot-card:hover{border-color:var(--srobus);background:rgba(247,131,9,.06)}
.slot-card.on{border-color:var(--srobus);box-shadow:0 0 0 1px var(--srobus) inset}
.slot-card .slot-when{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;
  letter-spacing:.03em;font-size:.8rem;color:var(--oldlace)}
.slot-card .slot-sub{font-family:'Averia Serif Libre',serif;font-weight:300;font-size:.76rem;color:var(--cream-soft);margin-top:.25rem}
.slot-fallback-note{border:1px dashed var(--line);border-radius:12px;padding:.8rem .9rem;margin-bottom:1rem;
  color:var(--cream-dim);font-size:.84rem;font-weight:300;background:rgba(247,131,9,.05)}
.slot-fallback-note b{color:var(--oldlace);font-weight:700}
/* Day-chip slot picker (week nav → day chips → that day's times) */
.slot-weeknav{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.7rem}
.slot-weeklabel{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:.86rem;color:var(--oldlace)}
.slot-weekarrow{border:1px solid var(--line);background:rgba(253,246,238,.04);color:var(--oldlace);
  border-radius:999px;width:2rem;height:2rem;line-height:1;cursor:pointer;font-size:1rem}
.slot-weekarrow:hover{border-color:var(--srobus);background:rgba(247,131,9,.08)}
.slot-weekarrow.ghost{opacity:.25;cursor:default}
.daychips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.9rem}
.daychip{border-radius:999px;border:1px solid var(--line);background:rgba(253,246,238,.04);color:var(--cream-soft);
  padding:.45rem .8rem;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;
  font-family:'Averia Serif Libre',serif;font-size:.82rem}
.daychip:hover{border-color:var(--srobus);background:rgba(247,131,9,.06)}
.daychip.on{border-color:var(--srobus);background:rgba(247,131,9,.12);color:var(--oldlace)}
.daychip-n{font-size:.68rem;opacity:.7;background:rgba(247,131,9,.18);border-radius:999px;padding:.05rem .38rem}
.slot-times{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:.55rem}
.slot-time{border-radius:12px;border:1px solid var(--line);background:rgba(253,246,238,.04);color:var(--oldlace);
  padding:.6rem .5rem;cursor:pointer;text-align:center;display:flex;flex-direction:column;gap:.15rem}
.slot-time:hover{border-color:var(--srobus);background:rgba(247,131,9,.06)}
.slot-time.on{border-color:var(--srobus);box-shadow:0 0 0 1px var(--srobus) inset}
.slot-time-h{font-family:'Beautique',serif;font-weight:700;font-size:.98rem}
.slot-time .slot-court{font-family:'Averia Serif Libre',serif;font-weight:300;font-size:.72rem;color:var(--cream-soft)}
/* Other-club (self-pay) + request-availability */
.club-card.club-other{border-style:dashed}
.slot-fallback-note.note-free{border-color:var(--srobus);background:rgba(247,131,9,.07)}
.note-free-inline{color:var(--srobus)!important;font-size:.82rem}
.chip.free-tag{background:rgba(247,131,9,.14);color:var(--srobus);border:1px solid rgba(247,131,9,.35);font-size:.68rem}

/* ---- Admin: clubs / courts / slots panel ---- */
.club-admin-row{display:flex;align-items:center;gap:.9rem;padding:.8rem 0;border-bottom:1px solid var(--line)}
.club-admin-row .club-thumb{flex:none;width:56px;height:42px;border-radius:9px;background-size:cover;
  background-position:center;background-color:#12252f;display:grid;place-items:center;font-size:1.2rem;
  border:1px solid var(--line)}
.club-admin-row .info{flex:1;min-width:0}
.club-admin-row .info .t{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;font-size:.86rem;color:var(--oldlace)}
.club-admin-row .info .meta{color:var(--cream-soft);font-size:.8rem;font-weight:300;margin-top:.15rem}
.club-admin-row .act{flex:none;display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}
.slot-repeater-row{display:grid;grid-template-columns:1fr 1fr auto;gap:.5rem;align-items:end;margin-bottom:.6rem}
@media(max-width:520px){.slot-repeater-row{grid-template-columns:1fr}}

/* ============================================================
   v2 AVAILABILITY MODEL — source panel (Rules|Bot), opening-rule
   editor, and the open/close week grid. Reuses .card/.field/.day-chip.
   ============================================================ */
.avail-source{border:1px solid var(--line);border-radius:14px;padding:1rem 1.1rem;margin-bottom:1.4rem;background:rgba(253,246,238,.03)}
.avail-src-seg{display:inline-flex;border:1.5px solid var(--line);border-radius:999px;overflow:hidden;margin-bottom:.7rem}
.avail-seg{appearance:none;background:transparent;border:0;color:var(--cream-soft);font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;padding:.5rem 1.1rem;cursor:pointer;transition:background .18s,color .18s}
.avail-seg.on{background:var(--srobus);color:#1F2528}
.avail-src-help{color:var(--cream-dim);font-weight:300;font-size:.86rem;line-height:1.5;margin-bottom:.6rem}
.avail-src-help b{color:var(--oldlace);font-weight:700}
.avail-bot-box.is-hidden{display:none}
.avail-bot-meta{color:var(--cream-soft);font-size:.8rem;font-weight:300;margin-top:.2rem}
.avail-bot-meta b{color:var(--cream-dim);font-weight:700}
.avail-courts-head,.avail-week-head .adm-form-title{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase}
.avail-courts-head{font-size:.9rem;color:var(--srobus);letter-spacing:.06em;margin:.4rem 0 .3rem}

/* opening-rule editor rows */
.rule-row{border:1px solid var(--line);border-radius:12px;padding:.8rem .9rem;margin-bottom:.7rem;background:rgba(253,246,238,.03)}
.rule-days{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.7rem}
.day-chip{appearance:none;background:rgba(253,246,238,.04);border:1px solid var(--line);border-radius:999px;color:var(--cream-soft);font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.66rem;padding:.35rem .7rem;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.day-chip.on{background:rgba(247,131,9,.14);border-color:var(--srobus);color:var(--srobus)}
.rule-fields{display:grid;grid-template-columns:1fr 1fr 1fr 1fr auto;gap:.5rem;align-items:end}
@media(max-width:640px){.rule-fields{grid-template-columns:1fr 1fr}.rule-fields .rr-del{grid-column:1 / -1;justify-self:start}}
.rule-fields .rr-del{align-self:end;margin-bottom:.1rem}

/* week grid */
.avail-week-wrap{margin-top:1.4rem;border-top:1px solid var(--line);padding-top:1.1rem}
.avail-week-head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap;margin-bottom:.7rem}
.avail-week-nav{display:flex;align-items:center;gap:.5rem}
.avail-week-label{color:var(--cream-dim);font-size:.8rem;font-weight:300;min-width:130px;text-align:center}
.avail-week-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:12px;padding:.6rem}
.wk-grid{display:grid;gap:5px;min-width:460px}
.wk-corner{}
.wk-colhead{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.62rem;color:var(--cream-soft);text-align:center;padding:.2rem 0}
.wk-timehead{font-family:'Beautique',serif;font-weight:700;font-size:.66rem;color:var(--cream-soft);display:flex;align-items:center;justify-content:flex-end;padding-right:.4rem;white-space:nowrap}
.wk-cell{appearance:none;border:1px solid var(--line);border-radius:8px;min-height:34px;font-size:.8rem;line-height:1;cursor:pointer;color:var(--cream-soft);background:rgba(253,246,238,.02);transition:background .15s,border-color .15s,color .15s}
.wk-cell.wk-empty{border-style:dashed;opacity:.35;cursor:default}
.wk-cell.wk-open{border-color:var(--srobus);color:var(--srobus);background:rgba(247,131,9,.06)}
.wk-cell.wk-open:hover{background:rgba(247,131,9,.16)}
.wk-cell.wk-closed{color:var(--cream-soft);opacity:.45;background:rgba(253,246,238,.02)}
.wk-cell.wk-closed:hover{opacity:.75}
.wk-cell.wk-booked{background:var(--srobus);color:#1F2528;border-color:var(--srobus)}
.wk-cell.wk-held{background:rgba(247,131,9,.4);color:#1F2528;border-color:rgba(247,131,9,.6)}
.wk-cell.is-locked{cursor:not-allowed}

/* day grid: rows=courts, cols=times. Court-name column stays sticky-left. */
.dg-grid .dg-court{justify-content:flex-start;padding-left:.5rem;text-transform:none;letter-spacing:0;font-size:.72rem}
.dg-sticky{position:sticky;left:0;z-index:2;background:var(--ink,#1F2528)}
.avail-week-scroll .dg-sticky{background:#1F2528}
.avail-legend{display:flex;flex-wrap:wrap;gap:.6rem 1.1rem;margin-top:.9rem;color:var(--cream-dim);font-size:.78rem;font-weight:300}
.avail-legend .lg{display:inline-flex;align-items:center;gap:.4rem}
.avail-legend .lg-sw{min-height:0;width:24px;height:24px;padding:0;display:inline-flex;align-items:center;justify-content:center;cursor:default;flex:0 0 auto}

/* ============================================================
   v2 INVITES — invite-to-match friend picker + in-app invite cards
   (portal/sessions.html Matches subtab + portal/social.html)
   Reuses .card / .chip / .btn / .dir-avatar / .pui-modal.
   ============================================================ */

/* ---- Friend-picker modal (checkbox list of accepted friends) ---- */
.invite-list{display:flex;flex-direction:column;gap:.2rem;max-height:min(52vh,360px);overflow-y:auto;margin:.2rem 0 .3rem}
.invite-row{display:flex;align-items:center;gap:.75rem;padding:.6rem .2rem;border-bottom:1px solid var(--line);cursor:pointer}
.invite-row:last-child{border-bottom:0}
.invite-check{flex:none;display:grid;place-items:center}
.invite-check input{width:18px;height:18px;accent-color:var(--srobus);cursor:pointer}
.invite-avatar{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;overflow:hidden;
  font-family:'Beautique',serif;font-weight:900;font-size:.9rem;color:#fff;background:var(--grad);text-transform:uppercase}
.invite-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;display:block}
.invite-name{flex:1;min-width:0;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;
  font-size:.82rem;letter-spacing:.02em;color:var(--oldlace)}
.pui-modal-actions .wa-invite{margin-right:auto}

/* ---- In-app invite cards (incoming match invites) ---- */
.invite-cards{display:flex;flex-direction:column;gap:.7rem}
.invite-card{border:1px solid rgba(247,131,9,.35);border-radius:14px;padding:.9rem 1rem;
  background:rgba(247,131,9,.06);display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}
.invite-card .ic-body{flex:1;min-width:0}
.invite-card .ic-title{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;
  letter-spacing:.02em;font-size:.9rem;color:var(--oldlace);line-height:1.25}
.invite-card .ic-meta{color:var(--cream-soft);font-size:.8rem;font-weight:300;margin-top:.2rem}
.invite-card .ic-act{flex:none;display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}

/* ---- Pending-invite count badge on the Matches subtab ---- */
.subtab .invite-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;
  margin-left:.4rem;border-radius:999px;background:var(--srobus);color:#fff;font-family:'Beautique',serif;
  font-weight:900;font-size:.62rem;line-height:1;vertical-align:middle}

/* ============================================================
   MOBILE APP LAYOUT (≤600px ONLY) — additive, desktop untouched
   A native-app shell: a fixed bottom tab bar + a compact top bar with a
   credits pill, stacked cards, wrapped full-width buttons, a create-match
   FAB, and a full-height create-match sheet with a sticky CTA.

   Everything below is guarded by @media (max-width:600px). The two injected
   chrome elements (.p-tabbar / .p-topbar) are display:none by default so at
   ≥601px they never render — desktop keeps its top nav + credit sidebar.
   ============================================================ */
.p-tabbar,.p-topbar,.pa-join-cta{display:none}
.p-credpill{font-family:inherit}

@media (max-width:600px){
  /* --- Hide the desktop chrome, show the mobile chrome --- */
  .p-nav{display:none!important}
  .pa-credit-rail{display:none!important}
  /* The shell collapses to one column; kill its side padding since the
     top/bottom bars own the chrome now. */
  .p-shell{padding:0;gap:0}

  .p-topbar{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    position:sticky;top:0;left:0;right:0;z-index:60;
    padding:10px 16px;padding-top:calc(10px + env(safe-area-inset-top));
    background:rgba(23,27,29,.92);backdrop-filter:blur(12px);
    border-bottom:1px solid var(--line);
  }
  body.is-demo .p-topbar{top:22px}
  .p-topbar-brand{display:flex;align-items:center;flex:none}
  .p-topbar-logo{height:30px;width:auto}
  .p-credpill{
    display:inline-flex;align-items:center;gap:.4rem;flex:none;cursor:pointer;
    border:1px solid var(--line);background:rgba(253,246,238,.05);
    border-radius:999px;padding:.4rem .85rem;min-height:40px;
    color:var(--oldlace);font-weight:700;
  }
  .p-credpill-hex{font-size:1.1rem;line-height:1;
    background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
  .p-credpill-n{font-family:'Beautique',serif;font-weight:900;font-size:1.05rem;letter-spacing:.02em;color:var(--oldlace)}
  .p-credpill.urgent{border-color:rgba(227,71,3,.6);background:rgba(227,71,3,.12)}
  .p-credpill.zero .p-credpill-n{color:var(--cream-soft)}

  /* --- Bottom tab bar --- */
  .p-tabbar{
    display:flex;align-items:stretch;justify-content:space-around;
    position:fixed;bottom:0;left:0;right:0;z-index:60;
    background:rgba(23,27,29,.96);backdrop-filter:blur(14px);
    border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom);
  }
  .p-tab{
    flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
    padding:.5rem .2rem .55rem;min-height:56px;text-decoration:none;
    color:var(--cream-soft);transition:color .15s;
  }
  .p-tab-ic{display:flex;align-items:center;justify-content:center;height:24px}
  .p-tab-ic svg{width:23px;height:23px;display:block}
  .p-tab-lb{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:.56rem}
  .p-tab.on{color:var(--srobus)}
  .p-tab.on .p-tab-ic{filter:drop-shadow(0 0 8px rgba(247,131,9,.4))}

  /* --- Content clears the bars + gets a side gutter --- */
  /* Base .p-main is `padding:34px 0 80px` (zero horizontal). On mobile the
     shell padding is also 0, so without this the whole content column ran
     edge-to-edge against the screen frame — every card and line of text butted
     the edge and read as cramped. Restore a 16px gutter that matches the top
     bar's own 16px inset for a consistent rhythm. */
  /* Auth/standalone pages (main.p-main NOT inside .p-shell) get the gutter here. */
  .p-main{padding:16px 16px calc(84px + env(safe-area-inset-bottom))}
  /* Content pages wrap <main.wrap.p-main> inside .p-shell, and the desktop rule
     `.p-shell > main.wrap{padding:0}` (specificity 0,0,2,1) OVERRODE the earlier
     `.p-main` gutter entirely — so on the home/sessions/social/etc. pages the
     hero + full-width text ran edge-to-edge (cards only *looked* inset via their
     own 1.6rem padding). Re-apply the gutter AND the tab-bar clearance at the
     same selector+specificity so it actually wins; source-order breaks the tie. */
  .p-shell > main.wrap{padding:16px 16px calc(84px + env(safe-area-inset-bottom))}
  /* Slightly tighter card interior on mobile so the new 16px outer gutter +
     card padding don't over-inset text on a 390px screen. */
  .card{padding:1.2rem}
  /* The demo ribbon sits above the top bar; nudge the sticky top bar down for
     the ribbon (already handled by body.is-demo .p-topbar). */

  /* ============ HERO HEADER ============ */
  /* The desktop hero H1 (clamp min 1.9rem) + the rotated Pinyon "script"
     flourish were sized for a wide column: on a 390px screen the H1 hammered
     both edges and the -3deg script clipped under the sticky top bar. Scale
     both down for mobile, ease the rotation, and give the header a little top
     air so the flourish never clips. */
  .p-head{margin-bottom:20px;padding-top:2px}
  .p-head .script{font-size:clamp(1.3rem,4.4vw,1.75rem);transform:rotate(-2deg);transform-origin:left center;margin-left:1px;margin-bottom:-.12em}
  .p-head h1{font-size:clamp(1.5rem,6.3vw,2.05rem);letter-spacing:-.005em;margin:.3rem 0 .35rem}
  .p-head p{font-size:.95rem;line-height:1.4}

  /* ============ STACKED CARDS ============ */
  /* Session / booking / match rows: date | content | actions → stacked. The
     date becomes a small inline chip; content is full width; actions below. */
  .sess{flex-direction:column;align-items:stretch;gap:.55rem}
  .sess .date{
    width:auto;text-align:left;order:-1;align-self:flex-start;
    display:inline-flex;align-items:baseline;gap:.35rem;
    padding:.28rem .6rem;border-radius:999px;
    border:1px solid var(--line);background:rgba(247,131,9,.08);
  }
  .sess .date .d{font-size:.9rem;line-height:1;display:inline;color:var(--oldlace)}
  .sess .date .m{font-size:.6rem;margin-top:0;display:inline}
  .sess .date.tbd .d{font-size:.82rem}
  .sess .info{width:100%}
  .sess .act{width:100%;flex:none;display:flex;flex-wrap:wrap;gap:.5rem}
  .sess .act .btn{flex:1 1 auto}

  /* Admin session-list rows reuse .sess and inherit the stack; keep the
     status pill inline in the title, and let the edit/cancel cluster wrap
     full width. */
  .adm-row .act{width:100%;justify-content:stretch;flex-wrap:wrap;gap:.5rem}
  .adm-row .act .btn{flex:1 1 auto}
  .adm-topbar .adm-actions{width:100%}
  .adm-topbar .adm-actions .btn{flex:1 1 auto}

  /* Directory / invite rows: keep the avatar+name inline, action wraps below
     if tight. */
  .dir-row .dir-act,.invite-card .ic-act{flex-wrap:wrap}

  /* ============ ACTION / BUTTON ROWS ============ */
  /* Any .act cluster (match Joined·Leave / Invite / Cancel / Mark-booked)
     wraps and the buttons grow so they never overflow. */
  .act{display:flex;flex-wrap:wrap;gap:.5rem}
  .act .btn{flex:1 1 auto}
  .mt-card .act{align-self:stretch;margin-left:0;width:100%}
  .req-actions{flex-wrap:wrap;width:100%}
  .req-actions .btn,.req-actions .chip{flex:1 1 auto}

  /* ============ TAP TARGETS ============ */
  .btn-sm{min-height:40px}
  .chip{min-height:36px;display:inline-flex;align-items:center}
  .daychip{min-height:40px}
  .slot-time{min-height:44px}

  /* ============ CREATE-MATCH MOBILE SHEET ============ */
  /* When the wizard is mounted, present it as a full-height sheet: each step
     fills the screen, the primary CTA docks to a sticky bottom bar. This is
     pure styling on the existing wizard markup — no JS-flow change. */
  /* Full-height wizard container (the wizard renders inside #wiz-card, a
     .card, inside #creator-mount). Promote it to a full-screen sheet. */
  #creator-mount #wiz-card{
    position:fixed;inset:0;z-index:70;margin:0!important;border-radius:0;border:0;
    background:var(--gable);overflow-y:auto;-webkit-overflow-scrolling:touch;
    padding:calc(14px + env(safe-area-inset-top)) 16px calc(88px + env(safe-area-inset-bottom));
  }
  /* Club cards: 2-col grid */
  #creator-mount .club-grid{grid-template-columns:repeat(2,1fr);gap:.7rem}
  /* Day chips: horizontal scroll row */
  #creator-mount .daychips{
    flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;
    padding-bottom:.3rem;margin-bottom:.7rem;
  }
  #creator-mount .daychips::-webkit-scrollbar{display:none}
  #creator-mount .daychip{flex:0 0 auto}
  /* Time slots: 2-up grid */
  #creator-mount .slot-times{grid-template-columns:repeat(2,1fr)}
  #creator-mount .slot-grid{grid-template-columns:repeat(2,1fr)}
  /* Sticky CTA bar at the bottom of the sheet */
  #creator-mount .wiz-nav{
    position:fixed;left:0;right:0;bottom:0;z-index:71;margin:0;
    padding:.7rem 16px calc(.7rem + env(safe-area-inset-bottom));
    background:rgba(23,27,29,.96);backdrop-filter:blur(12px);
    border-top:1px solid var(--line);
  }
  #creator-mount .wiz-nav .btn{flex:1 1 auto;min-height:48px}

  /* ============ CREATE-MATCH FAB (Matches subtab) ============ */
  /* A round "+" button fixed above the tab bar. Shown only when the Matches
     subtab is active (body class set by sessions.html), hidden while the
     wizard sheet is open. */
  .pa-fab{
    display:none;position:fixed;z-index:55;
    right:16px;bottom:calc(72px + env(safe-area-inset-bottom));
    width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;
    background:var(--grad);color:#fff;font-size:1.9rem;line-height:1;
    box-shadow:0 14px 30px -8px rgba(227,71,3,.6);
    align-items:center;justify-content:center;
  }
  body.pa-matches-active .pa-fab{display:flex}
  body.pa-creator-open .pa-fab{display:none}

  /* ============ PROSPECT STICKY CTA (above the tab bar) ============ */
  /* Persistent "Claim your first session" bar for prospects only; never for
     members. Docks just above the bottom tab bar. */
  body.is-prospect .pa-join-cta{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    position:fixed;left:0;right:0;z-index:58;
    bottom:calc(56px + env(safe-area-inset-bottom));
    padding:.7rem 16px;background:var(--grad);color:#fff;text-decoration:none;
    box-shadow:0 -12px 26px -14px rgba(0,0,0,.7);
  }
  body.is-prospect .pa-join-cta .pj-label{
    font-family:'Beautique',serif;font-weight:800;text-transform:uppercase;
    letter-spacing:.03em;font-size:.82rem;
  }
  body.is-prospect .pa-join-cta .pj-arrow{font-size:1.25rem;line-height:1;flex:none}
  /* Content clears BOTH the join bar and the tab bar. */
  body.is-prospect .p-shell > main.wrap{padding-bottom:calc(140px + env(safe-area-inset-bottom))}
  /* If the create-match FAB and the join CTA ever coexist, lift the FAB. */
  body.is-prospect .pa-fab{bottom:calc(120px + env(safe-area-inset-bottom))}
}

/* ---- Credits SHEET (bottom sheet from the top-bar pill) ---- */
.pui-sheet-backdrop{
  position:fixed;inset:0;z-index:10000;display:flex;align-items:flex-end;justify-content:center;
  background:rgba(15,18,20,.72);backdrop-filter:blur(4px);animation:pui-fade .18s ease;
}
.pui-sheet{
  width:100%;max-width:520px;background:linear-gradient(160deg,rgba(38,45,48,.98) 0%,rgba(23,27,29,.99) 100%);
  border:1px solid var(--line);border-bottom:0;border-radius:20px 20px 0 0;
  padding:.6rem 1.4rem calc(1.6rem + env(safe-area-inset-bottom));
  box-shadow:var(--shadow);animation:pui-sheet-up .22s cubic-bezier(.2,.8,.2,1);
}
@keyframes pui-sheet-up{from{transform:translateY(100%)}to{transform:translateY(0)}}
.pui-sheet-grip{width:40px;height:4px;border-radius:999px;background:var(--line);margin:.2rem auto 1rem}
.pui-sheet-body .pa-cs-k{margin-bottom:.7rem}
.cs-sheet-hero{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.3rem}
.cs-sheet-bal{font-family:'Beautique',serif;font-weight:900;line-height:.9;font-size:3rem;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cs-sheet-unit{font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;color:var(--cream-dim)}
.cs-sheet-line{color:var(--cream-soft);font-weight:300;font-size:.88rem;line-height:1.45;margin-top:.5rem}
.cs-sheet-line b{color:var(--cream-dim);font-weight:700}
.cs-sheet-fine{color:var(--cream-soft);font-weight:300;font-size:.78rem;line-height:1.4;
  margin-top:.9rem;padding-top:.85rem;border-top:1px solid var(--line)}
body.pui-noscroll{overflow:hidden}

/* checkout · founding-member spots counter */
.founding-spots{font-family:'Beautique',serif;font-weight:800;text-transform:uppercase;letter-spacing:.05em;font-size:.82rem;color:var(--srobus);margin-top:.5rem}
.founding-spots.full{color:var(--cream-soft)}

/* checkout · founding membership locked until release */
.founding-soon{font-family:'Beautique',serif;font-weight:900;text-transform:uppercase;letter-spacing:.06em;font-size:1.35rem;color:var(--srobus);margin-top:.2rem}

/* ADMIN · CRM panel */
.crm-bars{display:flex;flex-direction:column;gap:.7rem}
.crm-bar{display:grid;grid-template-columns:135px 1fr 26px;align-items:center;gap:.6rem;font-size:.85rem;color:var(--oldlace)}
.crm-bl{color:var(--cream-soft)}
.crm-bt{height:8px;border-radius:999px;background:rgba(253,246,238,.08);overflow:hidden}
.crm-bf{display:block;height:100%;background:var(--grad)}
.crm-bar b{text-align:right;font-family:'Beautique',serif;font-weight:800;color:var(--srobus)}
.crm-list{display:flex;flex-direction:column;gap:.55rem}
.crm-row{display:flex;align-items:center;gap:.7rem;border:1px solid var(--line);border-radius:12px;padding:.6rem .7rem;background:var(--gable)}
.crm-av{width:30px;height:30px;flex:none;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:'Beautique',serif;font-weight:800;font-size:.8rem;color:#fff;background:var(--grad)}
.crm-name{font-size:.92rem;color:var(--oldlace);display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.crm-meta{font-size:.78rem;color:var(--cream-soft);margin-top:.15rem}

/* Americana consent checkbox */
.pa-consent{display:flex;gap:.5rem;align-items:flex-start;font-size:.82rem;color:var(--cream-soft);line-height:1.4;margin:.2rem 0 1rem;cursor:pointer}
.pa-consent input{margin-top:.15rem;flex:none;accent-color:var(--srobus);width:16px;height:16px}

/* WS2 admin — WhatsApp broadcast preview cards */
.wa-prev{border:1px solid var(--hair,rgba(253,246,238,.14));border-radius:12px;padding:.7rem .8rem;margin:.5rem 0;background:rgba(253,246,238,.03)}
.wa-prev-hd{font-size:.82rem;color:var(--oldlace);margin-bottom:.45rem}
.wa-prev-body{white-space:pre-wrap;word-break:break-word;font-family:inherit;font-size:.86rem;line-height:1.5;color:var(--oldlace);opacity:.92;margin:0}

/* Report — PENDING preview (no report yet): blurred sample + "play your first
   Americana" banner. The data blocks are blurred; the banner stays sharp. */
.report-blur{filter:blur(7px);opacity:.55;pointer-events:none;user-select:none}
.report-pending-banner{text-align:center}
.report-pending-banner h2{font-family:'Beautique',serif;font-size:1.5rem;color:var(--oldlace);margin:.5rem 0 .2rem}
.report-pending-banner .muted{max-width:460px;margin:.3rem auto .9rem}
.report-pending-banner .btn{margin-top:.2rem}
.rp-badge{display:inline-block;font-family:'Beautique',serif;font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.66rem;color:var(--srobus);background:rgba(247,131,9,.12);border:1px solid rgba(247,131,9,.3);padding:.28rem .6rem;border-radius:999px}