:root{
  --bg:#070B16; --surface:#0E1424; --surface2:#141C30; --surface3:#1B243C; --sunk:#050810;
  --line:rgba(255,255,255,.075); --line2:rgba(255,255,255,.14); --gline:rgba(226,193,142,.22);
  --text:#F2F5FB; --text2:#9AA5BD; --muted:#69738C;
  --gold:#E2C18E; --gold2:#F4E2BC; --gold3:#C9A063; --gink:#1A1206; --gsoft:rgba(226,193,142,.1);
  --warn:#F0B45F; --wsoft:rgba(240,180,95,.12); --ok:#6FD3A3; --oksoft:rgba(111,211,163,.12);
  --bad:#F08279; --badsoft:rgba(240,130,121,.12); --info:#7FA8F2; --infosoft:rgba(127,168,242,.12);
  --pur:#B59CF2; --pursoft:rgba(181,156,242,.12);
  --ui:'Plus Jakarta Sans',-apple-system,system-ui,'Segoe UI',sans-serif;
  --display:var(--ui);
  --top:64px; --gut:clamp(20px,3.4vw,46px); --r:16px;
  color-scheme:dark;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{font:400 15px/1.6 var(--ui);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;
  overflow-x:hidden}
button,input,select,textarea{font:inherit;color:inherit;background:none;border:0}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;letter-spacing:-.022em;line-height:1.2}
a{color:inherit;text-decoration:none}
/* ── icons: duotone, and every one moves when you touch it ── */
.ic{width:21px;height:21px;flex:0 0 auto;fill:currentColor;overflow:visible}
.ic *{transform-box:fill-box;transform-origin:center;
  transition:transform .3s cubic-bezier(.34,1.3,.5,1),opacity .2s ease}
.ic .b{opacity:.3}
.nav button.on .ic .b,.ibtn:hover .ic .b,a:hover .ic .b,button:hover .ic .b{opacity:.44}

/* each glyph has its own gesture, so the set does not feel stamped out */
:is(.nav button,.ibtn,.btn,.lk,.lnk,.ctc,.row,.item,.cHeadL):hover .ic .a{transform:translateY(-1.5px)}
:is(.nav button,.btn,.lk):hover .ic.i-play .a{transform:translateX(2px)}
:is(.nav button,.ibtn):hover .ic.i-cal .a{transform:scale(1.18)}
:is(.nav button,.ibtn):hover .ic.i-card .a{transform:translateX(3px)}
:is(.nav button,.ibtn):hover .ic.i-life .a{transform:rotate(45deg)}
:is(.nav button,.ibtn):hover .ic.i-gear .a{transform:rotate(55deg)}
:is(.nav button,.ibtn):hover .ic.i-chat .a{transform:scaleX(.62)}
:is(.nav button,.ibtn):hover .ic.i-chart .a{transform:scaleY(1.22)}
:is(.nav button,.ibtn):hover .ic.i-box .a{transform:translateY(-2.5px)}
:is(.nav button,.ibtn):hover .ic.i-tag .a{transform:translate(1.5px,1.5px)}
:is(.nav button,.ibtn):hover .ic.i-link .lL{transform:translateX(-1.6px)}
:is(.nav button,.ibtn):hover .ic.i-link .lR{transform:translateX(1.6px)}
.ibtn:hover .ic.i-bell .a{animation:swing .55s ease}
@keyframes swing{0%,100%{transform:rotate(0)}28%{transform:rotate(-11deg)}62%{transform:rotate(7deg)}}
.ibtn:hover .ic.i-menu .a{transform:scaleX(.6)}
.nav button.on .ic .a{transform:translateY(-1.5px)}
.nav button.on .ic.i-play .a{transform:translateX(2px)}
.nav button.on .ic.i-cal .a{transform:scale(1.18)}
.nav button.on .ic.i-card .a{transform:translateX(3px)}
.nav button.on .ic.i-life .a{transform:rotate(45deg)}
.nav button.on .ic.i-link .lL{transform:translateX(-1.6px)}
.nav button.on .ic.i-link .lR{transform:translateX(1.6px)}
@media (prefers-reduced-motion:reduce){.ic *{transition:none}.ic .a{transform:none!important}}
::selection{background:var(--gold);color:var(--gink)}
.skip{position:absolute;left:-999px}
.skip:focus{left:14px;top:14px;z-index:70;background:var(--surface2);padding:10px 14px;border-radius:10px}
[hidden]{display:none!important}

/* depth: one warm light source, one cool fill, and grain so it is not flat vector */
.atmos{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.atmos i{position:absolute;display:block;border-radius:50%;filter:blur(130px)}
.atmos i:first-child{top:-32vh;right:-12vw;width:70vw;height:70vh;
  background:radial-gradient(closest-side,rgba(226,193,142,.16),rgba(226,193,142,.04) 56%,transparent)}
.atmos i:last-child{top:26vh;left:-24vw;width:60vw;height:62vh;
  background:radial-gradient(closest-side,rgba(48,82,156,.22),rgba(30,52,104,.06) 58%,transparent)}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.4;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3'/%3E%3C/filter%3E%3Crect width='150' height='150' filter='url(%23n)' opacity='.52'/%3E%3C/svg%3E")}

/* ── buttons: inner highlight, hairline edge, arrow that moves ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:46px;padding:0 22px;
  border-radius:12px;font-size:14.5px;font-weight:700;letter-spacing:-.01em;cursor:pointer;position:relative;
  background:linear-gradient(180deg,var(--gold2),var(--gold) 55%,var(--gold3));color:var(--gink);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(0,0,0,.14),0 2px 5px rgba(0,0,0,.4);
  transition:filter .18s ease,transform .12s ease}
.btn:hover{filter:brightness(1.05)}
.btn:active{transform:translateY(1px)}
.btn .arw{transition:transform .22s cubic-bezier(.2,.7,.2,1)}
.btn:hover .arw{transform:translateX(3px)}
.btn .ic{width:18px;height:18px}
.btn.full{width:100%}
.btn.sm{height:38px;padding:0 15px;font-size:13.5px;border-radius:10px}
.btn.g{background:var(--surface2);color:var(--text);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  border:1px solid var(--line2)}
.btn.g:hover{background:var(--surface3);filter:none}
.btn[disabled]{opacity:.5;pointer-events:none}

/* a text link whose rule draws in from the left */
.lk{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--gold);
  cursor:pointer;position:relative;padding-bottom:2px}
.lk::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--gold);
  transition:width .24s cubic-bezier(.2,.7,.2,1)}
.lk:hover::after{width:100%}
.lk .arw{transition:transform .22s cubic-bezier(.2,.7,.2,1)}
.lk:hover .arw{transform:translateX(3px)}
.lk .ic{width:15px;height:15px}

/* ── top bar ───────────────────────────────────────────── */
.top{position:sticky;top:0;z-index:40;height:var(--top);display:flex;align-items:center;gap:12px;
  padding:0 var(--gut) 0 14px;background:rgba(7,11,22,.76);backdrop-filter:blur(16px) saturate(1.3);
  -webkit-backdrop-filter:blur(16px) saturate(1.3);border-bottom:1px solid var(--line)}
.ibtn{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;color:var(--text2);
  cursor:pointer;position:relative;transition:background .16s ease,color .16s ease}
.ibtn:hover{background:var(--surface2);color:var(--text)}
.crumb{font-size:14px;font-weight:600;color:var(--text2)}
.tright{margin-left:auto;display:flex;align-items:center;gap:8px}
.bell em{position:absolute;top:4px;right:4px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;
  background:var(--gold);color:var(--gink);font:800 10.5px/17px var(--ui);font-style:normal;text-align:center;
  border:2px solid var(--bg)}

/* ── shell and sidebar ─────────────────────────────────── */
.shell{position:relative;z-index:2;display:grid;grid-template-columns:252px minmax(0,1fr)}
.side{position:sticky;top:var(--top);align-self:start;height:calc(100vh - var(--top));display:flex;
  flex-direction:column;padding:18px 14px 14px;border-right:1px solid var(--line);overflow-y:auto}
.brand{display:flex;align-items:center;gap:12px;padding:6px 8px 0}
.mark{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;flex:0 0 auto;
  background:linear-gradient(160deg,var(--gold2),var(--gold3));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 3px 8px rgba(0,0,0,.45)}
.mark svg{width:22px;height:22px;fill:var(--gink)}
.brandT{display:flex;flex-direction:column;line-height:1.28;min-width:0}
.brandT b{font-weight:800;font-size:14.5px;letter-spacing:-.02em}
.brandT i{font-style:normal;font-size:12px;color:var(--muted);font-weight:500}

.nav{display:flex;flex-direction:column;gap:2px;margin-top:22px}
.navL{font-size:11.5px;font-weight:700;color:var(--muted);letter-spacing:.02em;margin:18px 0 6px;padding:0 12px}
.nav button{display:flex;align-items:center;gap:12px;width:100%;height:42px;padding:0 12px;border-radius:11px;
  color:var(--text2);font-size:14.5px;font-weight:500;text-align:left;cursor:pointer;position:relative;
  transition:background .16s ease,color .16s ease}
.nav button span{flex:1}
.nav button em{font-style:normal;font-size:11.5px;font-weight:700;padding:2px 7px;border-radius:7px;
  background:var(--surface3);color:var(--text2)}
.nav button em.due{background:var(--wsoft);color:var(--warn)}
.nav button:hover{background:var(--surface2);color:var(--text)}
.nav button.on{background:var(--gsoft);color:var(--gold2)}
.nav button.on .ic .d{opacity:.38}
.nav button.on::before{content:"";position:absolute;left:-14px;top:12px;bottom:12px;width:3px;
  border-radius:0 4px 4px 0;background:var(--gold)}
.nav button.on em{background:rgba(226,193,142,.2);color:var(--gold2)}

.who{margin-top:auto;display:flex;align-items:center;gap:11px;padding:10px;border-radius:13px;
  background:var(--surface);border:1px solid var(--line)}
.av{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;flex:0 0 auto;
  background:var(--surface3);color:var(--gold2);font-size:12.5px;font-weight:800}
.whoT{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.whoT b{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.whoT i{font-style:normal;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ── main ──────────────────────────────────────────────── */
.main{padding:32px var(--gut) 86px;max-width:1320px;width:100%;min-width:0}
.sec{display:none}
.sec.on{display:block}
.sec.on>*{opacity:0;animation:rise .44s cubic-bezier(.2,.7,.2,1) forwards}
.sec.on>*:nth-child(1){animation-delay:.01s}
.sec.on>*:nth-child(2){animation-delay:.06s}
.sec.on>*:nth-child(3){animation-delay:.11s}
.sec.on>*:nth-child(4){animation-delay:.16s}
@keyframes rise{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.sec.on>*{animation:none;opacity:1}}

.head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:24px}
.head h1{font-size:clamp(25px,3vw,32px);font-weight:800}
.head h1 em{font-style:normal;color:var(--gold)}
.head p{margin-top:7px;font-size:14.5px;color:var(--text2);max-width:60ch}
.head p b{color:var(--text);font-weight:700}

.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.cHead{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;
  border-bottom:1px solid var(--line)}
.cHead h2{font-size:15.5px;font-weight:700}
.cHead .ic{width:18px;height:18px;color:var(--gold)}
.cHeadL{display:flex;align-items:center;gap:10px}
.cBody{padding:20px}
.pill{display:inline-block;font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:8px}
.pill.ok{background:var(--oksoft);color:var(--ok)}
.pill.warn{background:var(--wsoft);color:var(--warn)}
.pill.gold{background:var(--gsoft);color:var(--gold2)}
.pill.mute{background:var(--surface3);color:var(--text2)}
.pill.bad{background:var(--badsoft);color:var(--bad)}
.pill.info{background:var(--infosoft);color:var(--info)}

/* dashboard */
.dgrid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px;align-items:start}
.feat{position:relative;overflow:hidden;background:
  radial-gradient(120% 120% at 92% -24%,rgba(226,193,142,.17),transparent 58%),var(--surface)}
.kick{display:block;font-size:12.5px;font-weight:600;color:var(--gold)}
.feat h3{margin-top:8px;font-size:21px;font-weight:700;max-width:26ch}
.meta{margin-top:9px;font-size:13.5px;color:var(--muted)}
.bar{height:7px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden;margin:18px 0}
.bar i{display:block;height:100%;border-radius:999px;font-style:normal;
  background:linear-gradient(90deg,var(--gold3),var(--gold2));box-shadow:0 0 12px rgba(226,193,142,.3)}
.wk{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;margin-bottom:18px}
.wk i{height:30px;border-radius:7px;background:rgba(255,255,255,.055);font-style:normal}
.wk i.f{background:rgba(226,193,142,.62)}
.wk i.n{background:var(--gold);box-shadow:0 0 0 3px rgba(226,193,142,.15)}
.kv{display:flex;flex-direction:column;gap:1px;background:var(--line);border-radius:12px;overflow:hidden;
  border:1px solid var(--line);margin-bottom:16px}
.kv>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;background:var(--surface)}
.kv dt{font-size:13.5px;color:var(--text2)}
.kv dd{font-size:14.5px;font-weight:700}
.kv dd small{font-weight:500;font-size:12.5px;color:var(--muted)}
.kv dd.gold{color:var(--gold2)} .kv dd.down{color:var(--bad)}
.kv>div.kvHead{background:var(--sunk);padding:8px 14px}
.kv>div.kvHead dt{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--info)}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(192px,1fr));gap:16px;margin-top:16px}
.stat{padding:18px 20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.stat span{font-size:13px;color:var(--text2);font-weight:500}
.stat b{display:block;margin-top:10px;font-size:29px;font-weight:800;letter-spacing:-.03em}
.stat b.gold{color:var(--gold2)}
.stat b.warn{color:var(--warn)}
.stat b.bad{color:var(--bad)}
.stat b.info{color:var(--info)}
.stat.e{border-left:2px solid var(--line2)}
.stat.e-gold{border-left-color:var(--gold)}
.stat.e-ok{border-left-color:var(--ok)}
.stat.e-warn{border-left-color:var(--warn)}
.stat.e-bad{border-left-color:var(--bad)}
.stat.e-info{border-left-color:var(--info)}
.stat.e-pur{border-left-color:var(--pur)}
.stat i{display:block;margin-top:5px;font-style:normal;font-size:12.5px;color:var(--muted)}

.block{margin-top:28px}
.bHead{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:13px}
.bHead h2{font-size:17px;font-weight:700}
.rows{display:flex;flex-direction:column;gap:9px}
.row{display:block;width:100%;text-align:left;padding:15px 18px;background:var(--surface);
  border:1px solid var(--line);border-radius:13px;cursor:pointer;transition:border-color .16s ease,background .16s ease}
.row:hover{border-color:var(--gline);background:var(--surface2)}
.rTop{display:flex;align-items:center;gap:14px}
.row b{flex:1;font-weight:600;font-size:15px}
.row .pc{font-size:13.5px;font-weight:700;color:var(--gold2)}
.row small{display:block;margin-top:3px;font-size:12.5px;color:var(--muted)}
.row .bar{margin:11px 0 0;height:5px}

/* modules */
.mods{display:flex;flex-direction:column;gap:10px}
.mod{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.mHead{display:flex;align-items:center;gap:14px;width:100%;padding:16px 20px;cursor:pointer;text-align:left}
.mHead:hover{background:var(--surface2)}
.mNo{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;flex:0 0 auto;
  background:var(--surface3);color:var(--text2);font-size:12.5px;font-weight:800}
.mod.done .mNo{background:var(--gsoft);color:var(--gold2)}
.mHead h3{flex:1;font-size:16px;font-weight:700}
.mMeta{font-size:12.5px;color:var(--muted);font-weight:600;white-space:nowrap}
.chev{width:16px;height:16px;color:var(--muted);transition:transform .24s ease}
.mod.open .chev{transform:rotate(180deg)}
.mod ol{display:none;list-style:none;border-top:1px solid var(--line)}
.mod.open ol{display:block}
.mod li{display:flex;align-items:center;gap:14px;padding:12px 20px;border-bottom:1px solid var(--line);cursor:pointer}
.mod li:last-child{border-bottom:0}
.mod li:hover{background:var(--surface2)}
.tick{display:grid;place-items:center;width:23px;height:23px;border-radius:9px;flex:0 0 auto;
  background:var(--surface3);color:transparent}
.tick .ic{width:13px;height:13px}
li.done .tick{background:var(--gold);color:var(--gink)}
li.now .tick{background:var(--gsoft);color:var(--gold)}
li.now .tick .ic{width:11px;height:11px}
.lN{flex:1;font-size:14.5px}
li.done .lN{color:var(--text2)}
.lT{font-size:12.5px;color:var(--muted);font-weight:600}

/* calls */
.cg{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px}
.per{display:flex;align-items:center;gap:14px;padding:18px 20px;border-bottom:1px solid var(--line)}
.pAv{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;flex:0 0 auto;
  background:var(--gsoft);border:1px solid var(--gline);color:var(--gold2);font-weight:800;font-size:15px}
.per b{display:block;font-weight:700;font-size:16px}
.per span{display:block;margin-top:2px;font-size:13px;color:var(--text2)}
.slot{padding:20px}
.cal{min-height:290px;border:1px dashed var(--line2);border-radius:13px;background:var(--sunk);
  display:grid;place-items:center;text-align:center;padding:28px}
.cal p{font-size:14px;color:var(--text2);max-width:34ch}
.calendly-inline-widget{min-height:630px}
.note{display:flex;gap:13px;margin-top:18px;padding:17px 20px;border-radius:var(--r);background:var(--gsoft);
  border:1px solid var(--gline);max-width:82ch}
.note .ic{color:var(--gold);margin-top:1px}
.note p{font-size:14.5px;color:var(--text2)}
.note b{color:var(--text);font-weight:700}

/* payments */
.card.due{margin-top:16px;border-color:rgba(240,180,95,.3);
  background:radial-gradient(110% 130% at 90% -30%,rgba(240,180,95,.15),transparent 60%),var(--surface)}
.dueIn{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;padding:20px}
.dueIn h3{margin-top:7px;font-size:20px}
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14.5px}
th{padding:13px 20px;text-align:left;font-weight:700;font-size:12.5px;color:var(--muted);
  border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:15px 20px;border-bottom:1px solid var(--line);white-space:nowrap}
tr:last-child td{border-bottom:0}
.r{text-align:right}
td.amt{font-weight:800}

/* contacts, links */
.grp{margin-bottom:30px}
.gHead{display:flex;align-items:baseline;gap:12px;margin-bottom:13px}
.gHead h2{font-size:17px;font-weight:700}
.gHead span{font-size:13px;color:var(--muted)}
.cardGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.ctc{display:flex;flex-direction:column;padding:20px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);box-shadow:inset 0 1px 0 rgba(255,255,255,.035);transition:border-color .16s ease}
.ctc:hover{border-color:var(--gline)}
.ctc .role{font-size:12.5px;font-weight:600;color:var(--gold)}
.ctc b{margin-top:6px;font-size:16.5px;font-weight:700}
.ctc p{margin-top:10px;margin-bottom:18px;font-size:14px;color:var(--text2);line-height:1.55;flex:1}
.lnk{display:flex;flex-direction:column;padding:18px 20px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  transition:border-color .16s ease,background .16s ease}
.lnk:hover{border-color:var(--gline);background:var(--surface2)}
.lTop{display:flex;align-items:center;gap:12px}
.lIco{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;flex:0 0 auto;
  background:linear-gradient(160deg,rgba(226,193,142,.3),rgba(201,160,99,.14));color:var(--gold2);
  border:1px solid var(--gline);font-size:12.5px;font-weight:800}
.lnk:hover .lIco{background:linear-gradient(160deg,var(--gold2),var(--gold3));color:var(--gink)}
.lnk b{flex:1;font-size:15.5px;font-weight:700}
.lnk .arw{color:var(--gold);transition:transform .22s cubic-bezier(.2,.7,.2,1)}
.lnk:hover .arw{color:var(--gold);transform:translate(3px,-3px)}
.lnk p{margin-top:11px;margin-bottom:16px;font-size:13.5px;color:var(--text2);line-height:1.55;flex:1}

/* ── the daily numbers ─────────────────────────────────── */
.streak{text-align:right}
.streak b{font-size:30px;font-weight:800;color:var(--gold2)}
.streak span{display:block;font-size:13px;color:var(--muted)}
.monthBar{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.monthBar b{font-size:17px;font-weight:700;min-width:170px;text-align:center}
.monthBar #mPrev .ic{transform:rotate(180deg)}
.mFill{margin-left:auto;font-size:13px;color:var(--muted)}
.r3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.metaBand{margin:4px 0 14px;padding:8px 13px;border-radius:10px;background:var(--infosoft);
  color:var(--info);font-size:12px;font-weight:700}
.metaBand.gg{background:rgba(226,193,142,.1);color:var(--gold2)}
.chips{display:flex;align-items:center;gap:8px;margin:18px 0 14px}
.chips>span{font-size:13.5px;color:var(--text2);margin-right:2px}
.chips button{padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:var(--sunk);
  color:var(--muted);font:inherit;font-size:13px;font-weight:600;cursor:pointer;
  transition:border-color .2s ease,color .2s ease,background .2s ease}
.chips button:hover{color:var(--text);border-color:var(--line2)}
.chips button.on{background:var(--gsoft);border-color:rgba(226,193,142,.45);color:var(--gold2)}
.jump{margin-left:14px;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.jump input{width:auto;padding:7px 11px;font-size:13px;color-scheme:dark}
label.ro input{background:var(--sunk);color:var(--text2);cursor:default}
table.wide{font-size:13px}
table.wide th,table.wide td{padding:10px 11px;white-space:nowrap}
/* the log is wide enough to scroll sideways, so the date stays put */
table.wide th:first-child,table.wide td:first-child{position:sticky;left:0;z-index:2;
  background:var(--surface);box-shadow:1px 0 0 var(--line)}
table.wide tbody tr:hover td:first-child{background:var(--surface2)}
table.wide tr.editing td:first-child{background:linear-gradient(var(--gsoft),var(--gsoft)),var(--surface)}
th.meta,td.meta{background:rgba(127,168,242,.05)}
th.meta{color:var(--info)}
th.gg,td.gg{background:rgba(226,193,142,.05)}
th.gg{color:var(--gold2)}
.numLive{display:flex;gap:10px;flex-wrap:wrap;margin:4px 0 18px}
.numLive span{flex:1;min-width:110px;padding:11px 13px;border-radius:11px;background:var(--sunk);
  border:1px solid var(--line);font-size:12.5px;color:var(--text2)}
.numLive b{display:block;margin-top:4px;font-size:18px;font-weight:800;color:var(--text)}
.numLive b.up{color:var(--ok)} .numLive b.down{color:var(--bad)}
.chart{display:flex;align-items:flex-end;gap:7px;height:116px;margin:18px 0 10px}
.chart .col{flex:1;display:flex;align-items:flex-end;justify-content:center;gap:2px;height:100%}
.chart .col i{display:block;width:46%;border-radius:3px 3px 0 0;font-style:normal;min-height:2px}
.chart .col .r{background:linear-gradient(180deg,var(--gold2),var(--gold3))}
.chart .col .s{background:rgba(127,168,242,.45)}
.chart .col em{font-style:normal;font-size:10px;color:var(--muted);text-align:center;margin-top:5px}
.chartKey{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
.chartKey span{width:10px;height:10px;border-radius:3px;display:inline-block}
.chartKey .k1{background:var(--gold)} .chartKey .k2{background:rgba(127,168,242,.6);margin-left:12px}
tr.miss td{color:var(--muted)}
tr.editing td{background:var(--gsoft)}
tbody tr{cursor:pointer}
tbody tr:hover td{background:var(--surface2)}

/* ── achievements ──────────────────────────────────────── */
.winCount{text-align:right}
.winCount b{font-size:28px;font-weight:800;color:var(--gold2)}
.winCount span{display:block;font-size:13px;color:var(--muted)}
.winGrid{display:flex;flex-direction:column;gap:14px}
.winRowT{display:flex;align-items:center;gap:12px;margin-bottom:13px;font-size:15px;font-weight:700;color:var(--gold2)}
.winRowT::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--gline),transparent)}
.winRow{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(228px,1fr))}
.winRow .win{min-height:244px}
@media (max-width:560px){.winRow .win{min-height:0}}
.win{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:26px 20px 22px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);transition:border-color .18s ease,transform .18s ease}
.win.got{cursor:pointer}
.win.got:hover{border-color:var(--gold);transform:translateY(-2px)}
.medal{position:relative;display:grid;place-items:center;margin-bottom:22px}
.winIco{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;
  background:radial-gradient(circle at 50% 35%,#16203a,#0b1222 70%);color:var(--gold);
  box-shadow:0 0 0 2px rgba(226,193,142,.35),0 0 0 6px rgba(226,193,142,.06),inset 0 2px 6px rgba(0,0,0,.45);
  transition:background .2s ease,color .2s ease,box-shadow .2s ease}
.winIco .ic{width:38px;height:38px;opacity:.85}
.winVal{position:absolute;bottom:-11px;left:50%;transform:translateX(-50%);min-width:40px;padding:0 9px;
  height:22px;border-radius:11px;font:800 11.5px/20px var(--ui);font-style:normal;letter-spacing:.02em;
  background:var(--surface);color:var(--gold);border:1px solid rgba(226,193,142,.45);white-space:nowrap}
.win.got .winIco{background:conic-gradient(from 210deg,var(--gold3),var(--gold2) 25%,var(--gold) 45%,var(--gold3) 65%,var(--gold2) 85%,var(--gold3));
  color:var(--gink);box-shadow:0 0 0 2px rgba(244,226,188,.55),0 0 0 7px rgba(226,193,142,.12),0 8px 26px rgba(226,193,142,.28),
  inset 0 2px 0 rgba(255,255,255,.45),inset 0 -3px 6px rgba(120,80,20,.35)}
.win.got .winIco .ic{opacity:1}
.win.got .winIco .ic .b{opacity:.42}
.win.got .winVal{background:linear-gradient(180deg,var(--gold2),var(--gold) 55%,var(--gold3));color:var(--gink);border-color:transparent;
  box-shadow:0 3px 10px rgba(226,193,142,.25)}
.win.got.gold .winIco{box-shadow:0 0 0 2px rgba(244,226,188,.7),0 0 0 8px rgba(226,193,142,.16),0 10px 34px rgba(226,193,142,.38),
  inset 0 2px 0 rgba(255,255,255,.5),inset 0 -3px 6px rgba(120,80,20,.35)}
.win:not(.got) .winIco .ic .b{opacity:.32}
.win:not(.got):hover .winIco{box-shadow:0 0 0 2px rgba(226,193,142,.6),0 0 0 6px rgba(226,193,142,.1),inset 0 2px 6px rgba(0,0,0,.45)}
.win b{font-size:15.5px;font-weight:700}
.win.got b{color:var(--text)}
.win:not(.got) b{color:var(--text2)}
.win p{margin-top:7px;font-size:13px;color:var(--muted);line-height:1.5}
.win time{margin-top:12px;font-size:11.5px;font-weight:700;color:var(--gold)}
.win .lock{margin-top:12px;font-size:11.5px;font-weight:700;color:var(--muted)}
.win .sh{position:absolute;top:12px;right:12px;width:30px;height:30px;display:grid;place-items:center;
  border-radius:10px;color:var(--muted);opacity:0;transition:opacity .18s ease,background .18s ease}
.win.got:hover .sh{opacity:1;background:var(--surface3);color:var(--gold)}
.win .sh .ic{width:15px;height:15px}

/* the share sheet */
.sheet{position:fixed;inset:0;z-index:90;display:none;place-items:center;padding:24px;
  background:rgba(3,6,13,.76);backdrop-filter:blur(8px)}
.sheet.on{display:grid}
.sheetIn{width:100%;max-width:720px;display:grid;grid-template-columns:260px minmax(0,1fr);gap:24px;
  align-items:center}
.sheetIn canvas{width:100%;border-radius:16px;border:1px solid var(--line2);display:block}
.sheetT h3{font-size:22px;font-weight:800}
.sheetT p{margin-top:9px;font-size:14.5px;color:var(--text2)}
.sheetBtns{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.sheetX{margin-top:14px;font-size:13.5px;color:var(--muted);cursor:pointer}
.sheetX:hover{color:var(--text)}
@media (max-width:720px){.sheetIn{grid-template-columns:1fr;gap:16px}.sheetIn canvas{max-width:200px;margin:0 auto}}

/* forms, tickets */
.sg{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:16px;align-items:start}
label{display:block;margin-bottom:15px;font-size:13px;font-weight:600;color:var(--text2)}
input,select,textarea{display:block;width:100%;margin-top:7px;padding:11px 13px;border:1px solid var(--line2);
  border-radius:11px;background:var(--sunk);font-size:14.5px;font-weight:500;resize:vertical;
  transition:border-color .16s ease}
input::placeholder,textarea::placeholder{color:var(--muted);font-weight:400}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--gold)}
.r2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fFoot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:4px}
.fFoot span{font-size:13px;color:var(--muted)}
.tix{list-style:none}
.tix li{padding:16px 20px;border-bottom:1px solid var(--line)}
.tix li:last-child{border-bottom:0}
.tH{display:flex;align-items:center;gap:12px}
.tH b{flex:1;font-weight:600;font-size:14.5px}
.tix p{margin-top:5px;font-size:13.5px;color:var(--text2)}
.tix time{display:block;margin-top:7px;font-size:12.5px;color:var(--muted)}
.empty{padding:34px 20px;text-align:center;color:var(--muted);font-size:14px}

/* toast */
.toast{position:fixed;left:50%;bottom:26px;z-index:80;transform:translate(-50%,16px);opacity:0;
  padding:12px 20px;border-radius:12px;background:var(--surface3);border:1px solid var(--line2);
  font-size:14px;font-weight:600;pointer-events:none;transition:opacity .22s ease,transform .22s ease}
.toast.on{opacity:1;transform:translate(-50%,0)}

@media (max-width:1100px){.dgrid,.sg{grid-template-columns:1fr}.main{padding:28px var(--gut) 76px}}
@media (max-width:860px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .side{position:fixed;left:0;top:var(--top);z-index:38;width:258px;background:var(--bg);
    transform:translateX(-100%);transition:transform .26s cubic-bezier(.2,.7,.2,1)}
  .side.open{transform:none}
  .crumb{display:none}
}
@media (max-width:560px){.r2,.r3{grid-template-columns:1fr;gap:0}.stat b{font-size:25px}
  .monthBar{flex-wrap:wrap}.monthBar b{min-width:0;flex:1}.mFill{width:100%;margin:2px 0 0;text-align:center}}

/* ── ask the coach ─────────────────────────────────────── */
.chat{display:flex;flex-direction:column;gap:14px;min-height:280px;max-height:56vh;overflow-y:auto;
  padding:4px 2px 18px;scroll-behavior:smooth}
.msg{max-width:84%;padding:13px 16px;border-radius:14px;font-size:14.5px;line-height:1.62;
  white-space:pre-wrap;word-wrap:break-word}
.msg.me{align-self:flex-end;background:var(--gsoft);border:1px solid rgba(226,193,142,.22);
  color:var(--text);border-bottom-right-radius:5px}
.msg.it{align-self:flex-start;background:var(--sunk);border:1px solid var(--line);
  border-bottom-left-radius:5px}
.msg.it b{color:var(--gold2)}
.msg.wait{color:var(--muted);font-style:italic}
.chatEmpty{margin:auto;text-align:center;color:var(--muted);font-size:14px;max-width:360px;line-height:1.6}
.ask{display:flex;gap:10px;align-items:stretch}
.ask input{flex:1}
.ask .btn{white-space:nowrap;padding-left:20px;padding-right:18px}
.askNote{margin-top:12px;font-size:12.5px;color:var(--muted);line-height:1.6}
@media (max-width:560px){.msg{max-width:94%}.ask{flex-direction:column}}

/* terms popup */
.terms{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:20px;
  background:rgba(4,7,14,.78);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.terms.on{display:grid}
.termsIn{width:100%;max-width:680px;max-height:calc(100vh - 40px);display:flex;flex-direction:column;
  background:var(--surface);border:1px solid var(--gline);border-radius:var(--r);
  box-shadow:0 30px 80px rgba(0,0,0,.5),inset 0 1px 0 rgba(255,255,255,.04)}
.termsHead{padding:24px 26px 14px;border-bottom:1px solid var(--line)}
.termsHead h3{font-size:21px;font-weight:800;color:var(--gold2)}
.termsHead p{margin-top:6px;font-size:14px;color:var(--text2)}
.termsBody{flex:1;overflow:auto;padding:8px 26px 18px;font-size:14px;line-height:1.6;color:var(--text2)}
.termsBody h2{margin:18px 0 6px;font-size:15px;font-weight:700;color:var(--text)}
.termsBody p{margin:0 0 9px}
.termsBody mark{background:rgba(226,193,142,.25);color:var(--gold2);padding:0 4px;border-radius:4px}
.termsBody .tVer{margin-top:16px;font-size:12px;color:var(--muted)}
.termsFoot{padding:16px 26px 22px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
.termsChk{display:flex!important;flex-direction:row!important;gap:10px;align-items:flex-start;text-align:left;font-size:14px;color:var(--text);cursor:pointer}
.termsChk input{width:17px!important;height:17px;flex:0 0 17px;margin:2px 0 0;padding:0;accent-color:var(--gold)}
.termsChk span{flex:1}
.btn:disabled{opacity:.45;cursor:not-allowed;filter:none}

/* price calculator */
.calcNote{margin-top:2px;font-size:12.5px;color:var(--muted)}
.calcTip{margin-top:14px;font-size:13.5px;line-height:1.55;color:var(--text2)}
#calcForm select{appearance:auto}

.calcSteps{margin:0 0 18px 18px;padding:0;font-size:13.5px;line-height:1.6;color:var(--text2)}
.calcSteps li{margin-bottom:3px}
.lHint{display:block;margin-top:3px;font-size:11.5px;font-weight:500;color:var(--muted)}
