[hidden]{display:none !important}
:root{--navy:#0f1b2d;--navy2:#1a2b45;--orange:#f26a1b;--cream:#faf6ef;--ink:#1d2433;--muted:#5d6676;--line:#e3dccf;--green:#1e8e5a;--red:#c0392b}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--cream);color:var(--ink);line-height:1.45}
button,input,select,textarea{font:inherit}
header{background:var(--navy);color:#fff}
.hwrap{max-width:1180px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.logo{font-family:Oswald,Impact,sans-serif;font-weight:700;font-size:26px;letter-spacing:.5px;cursor:pointer}
.logo span{color:var(--orange)}
nav.tabs{display:flex;gap:4px;flex:1}
.tab{background:transparent;color:#b9c3d3;border:0;padding:8px 12px;font-weight:600;border-radius:8px;cursor:pointer}
.tab.on{color:#fff;background:var(--navy2)}
@media(hover:hover){.tab:hover{color:#fff;background:var(--navy2)}} /* phones keep :hover after a tap */
.who{color:#b9c3d3;font-size:14px;display:flex;gap:10px;align-items:center}
.who b{color:#fff}
.banner{background:#fff3e6;border-bottom:1px solid #f3d2b3;color:#7a3a0c;font-size:13.5px;text-align:center;padding:7px 12px}
main{max-width:1180px;margin:0 auto;padding:22px 20px 60px}
h1,h2{font-family:Oswald,sans-serif;font-weight:500;margin:0 0 10px}
h1{font-size:30px}h2{font-size:22px}
h3{margin:0 0 10px;font-size:16.5px}
.muted{color:var(--muted)}
.small{font-size:13px}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:16px}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.spread{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.btn{border:1px solid var(--line);background:#fff;color:var(--ink);padding:8px 13px;border-radius:9px;font-weight:600;cursor:pointer;font-size:14px}
.btn:hover{border-color:#c9bfae}
.btn.pri{background:var(--orange);border-color:var(--orange);color:#fff}
.btn.pri:hover{background:#d95c12}
.btn.dark{background:var(--navy);border-color:var(--navy);color:#fff}
.btn.danger{color:var(--red)}
.btn.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.btn.sm{padding:5px 9px;font-size:13px}
.btn:disabled{opacity:.45;cursor:not-allowed}
label.f{display:block;font-size:13px;font-weight:600;color:var(--muted);margin:10px 0 4px}
input.i,select.i,textarea.i{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink)}
textarea.i{min-height:70px;resize:vertical}
input.i:focus,select.i:focus,textarea.i:focus{outline:2px solid #f9c39f;border-color:var(--orange)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.pcard{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.pcard svg{display:block;width:100%;height:auto;background:#f7efe1;cursor:pointer}
.pcard .pb{padding:10px 12px;display:flex;flex-direction:column;gap:6px;flex:1}
.pcard .pt{font-weight:700}
.pcard .acts{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto}
.badge{display:inline-block;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:#eef0f4;color:#3c4558}
.badge.Beginner{background:#e3f4ea;color:#17673f}.badge.Intermediate{background:#fff1dc;color:#8a5200}.badge.Advanced{background:#fde6e3;color:#9b2b1f}
.empty{border:2px dashed var(--line);border-radius:14px;padding:26px;text-align:center;color:var(--muted)}
.court{width:100%;max-width:640px;margin:0 auto;height:auto;display:block;border-radius:10px;touch-action:none;user-select:none;-webkit-user-select:none}
.authwrap{max-width:430px;margin:30px auto}
.seg{display:flex;background:#eee8dc;border-radius:10px;padding:3px;gap:3px}
.seg button{flex:1;border:0;background:transparent;padding:8px;border-radius:8px;font-weight:600;cursor:pointer;color:var(--muted)}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.err{color:var(--red);font-size:14px;min-height:20px;margin-top:8px}
.ok{color:var(--green)}
.check{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;margin-top:12px}
.check input{margin-top:3px}
/* editor */
.ed{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start}
@media(max-width:900px){.ed{grid-template-columns:1fr}}
.tools{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 4px}
.tool{border:1px solid var(--line);background:#fff;border-radius:9px;padding:7px 10px;font-weight:600;font-size:13.5px;cursor:pointer}
.tool.on{background:var(--orange);color:#fff;border-color:var(--orange)}
.hint{font-size:13px;color:var(--muted);min-height:20px}
.steps{display:flex;flex-direction:column;gap:6px}
.stepbtn{display:flex;justify-content:space-between;align-items:center;text-align:left;border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 10px;cursor:pointer;font-size:14px}
.stepbtn.on{border-color:var(--orange);background:#fff6ef;box-shadow:inset 3px 0 0 var(--orange)}
.stepbtn small{color:var(--muted)}
.qed{border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:10px;background:#fdfbf7}
.qed .opt{display:flex;gap:6px;align-items:center;margin-top:5px}
.qed .opt input[type=text]{flex:1}
/* viewer */
.view{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:18px;align-items:start}
@media(max-width:900px){.view{grid-template-columns:1fr}}
.stepbox{background:#f4efe6;border-radius:10px;padding:10px 12px;margin-top:10px;font-size:14.5px;min-height:48px}
.q{border-top:1px solid var(--line);padding:12px 0}
.q:first-child{border-top:0}
.q p{margin:0 0 8px;font-weight:600}
.qopt{display:block;width:100%;text-align:left;border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 11px;margin:5px 0;cursor:pointer;font-size:14px}
.qopt.right{background:#e3f4ea;border-color:#8fd0ab}
.qopt.wrong{background:#fde6e3;border-color:#f0a59b}
.qopt:disabled{cursor:default;color:var(--ink)}
.exp{font-size:13.5px;background:#f4efe6;border-radius:8px;padding:8px 10px;margin-top:6px}
/* teams */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th,.tbl td{border-bottom:1px solid var(--line);padding:8px 6px;text-align:left;vertical-align:middle}
.tbl th{font-size:12.5px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.3px}
.code{font-family:ui-monospace,Menlo,monospace;font-size:22px;font-weight:700;letter-spacing:3px;background:#fff6ef;border:1px dashed var(--orange);border-radius:10px;padding:6px 12px;display:inline-block}
.pill{display:inline-block;font-size:12px;font-weight:700;border-radius:999px;padding:2px 9px}
.pill.done{background:#e3f4ea;color:#17673f}.pill.part{background:#fff1dc;color:#8a5200}.pill.none{background:#eef0f4;color:#5d6676}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:800px){.two{grid-template-columns:1fr}}
/* modal + toast */
.modal{position:fixed;inset:0;background:rgba(15,27,45,.55);display:flex;align-items:center;justify-content:center;z-index:50;padding:16px}
.modal .box{background:#fff;border-radius:14px;max-width:560px;width:100%;max-height:85vh;overflow:auto;padding:18px}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--navy);color:#fff;padding:10px 16px;border-radius:10px;font-size:14px;z-index:60;box-shadow:0 6px 20px rgba(0,0,0,.2);max-width:90vw}
.toast.bad{background:var(--red)}
.loading{text-align:center;color:var(--muted);padding:60px 0}
.pick{display:flex;gap:8px;align-items:center;padding:7px 4px;border-bottom:1px solid var(--line);font-size:14px}
.notice{background:#fff3e6;border:1px solid #f3d2b3;color:#5a2a08;border-radius:10px;padding:12px 14px;margin-top:12px;font-size:14.5px}
.or{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;margin:12px 0}
.or::before,.or::after{content:"";flex:1;border-top:1px solid var(--line)}
.kidform{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:10px;background:#fbfaf7}
.btn.dangerfill{background:var(--red);border-color:var(--red);color:#fff}
/* ---------- Step 2: IQ path ---------- */
.logo .pilot{font:700 11px/1 Inter,sans-serif;letter-spacing:.08em;text-transform:uppercase;background:var(--orange);color:#fff;border-radius:999px;padding:4px 8px;margin-left:8px;vertical-align:middle;font-style:normal}
.iq{background:var(--navy);color:#fff;border-radius:12px;padding:8px 14px;text-align:center;min-width:78px}
.iq span{display:block;font-size:11px;letter-spacing:.1em;opacity:.75}.iq b{font:700 28px/1.1 Oswald,sans-serif}
.card.hl{border-color:var(--orange);box-shadow:0 0 0 2px rgba(242,106,27,.15)}
.card.level.soon{opacity:.6}
.lessons{display:flex;flex-direction:column;gap:6px}
.lrow{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;font:inherit;cursor:pointer;min-height:48px}
.lrow .ltitle{flex:1;font-weight:600}.lrow.locked{cursor:default;color:var(--muted);background:#f6f4ef}
.lrow.open{border-color:var(--orange)}.lrow.done .lnum{background:#e3f4ea;color:#17673f}
.lnum{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#eef0f4;font-weight:700;font-size:13px;flex:none}
.stepper{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}.stepper span{font-size:12.5px;padding:5px 10px;border-radius:999px;background:#eef0f4;color:#3c4558}
.stepper span.on{background:var(--orange);color:#fff;font-weight:700}.stepper span.past{background:#e3f4ea;color:#17673f}
.job{background:#fff3e6;border-left:4px solid var(--orange);padding:10px 12px;border-radius:8px;margin-top:8px}
.btn.big{padding:12px 18px;font-size:16px}
.center{text-align:center}.big-emoji{font-size:44px;line-height:1}
.dots{display:flex;gap:6px;margin:10px 0}.dot{flex:1;padding:8px 0;border:1px solid var(--line);border-radius:10px;background:#fff;font:700 13px Inter,sans-serif;cursor:pointer}.dot.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.fbbtn{position:fixed;right:14px;bottom:14px;z-index:40;border:0;border-radius:999px;padding:11px 16px;background:var(--navy);color:#fff;font:700 14px Inter,sans-serif;box-shadow:0 4px 14px rgba(0,0,0,.25);cursor:pointer}
.fbpanel{position:fixed;right:14px;bottom:66px;z-index:41;width:min(340px,calc(100vw - 28px));background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;box-shadow:0 10px 30px rgba(0,0,0,.2)}
.fbkinds{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
body.has-fb main{padding-bottom:84px}
.qalt{margin-top:10px;padding:10px;border:1px dashed var(--line);border-radius:10px;background:#fbfaf7}
.pickpos{margin-top:12px;padding:12px;border-top:1px solid var(--line)}
.dot{color:var(--ink);-webkit-appearance:none;appearance:none}
.card.intro p{margin:0 0 8px}.card.intro p:last-child{margin:0}
.rank{padding:14px 16px}.rname{font:700 22px/1.2 Oswald,sans-serif;color:var(--navy)}
.bar{height:10px;border-radius:999px;background:#eef0f4;margin-top:10px;overflow:hidden}.bar span{display:block;height:100%;background:var(--orange);border-radius:999px;min-width:6px}
.gain{font:700 24px/1.2 Oswald,sans-serif;color:var(--orange);margin:6px 0}.rankup{font-size:18px;margin:6px 0}

/* Phone layout: one-line header, tabs in a bottom bar, round Feedback button */
.phone-only{display:none!important}
@media(max-width:700px){
  .phone-only{display:flex!important}.desk-only{display:none!important}
  header .hwrap{padding:10px 16px;gap:8px}
  header .logo{font-size:21px}
  header .who{display:none}
  nav.tabs{position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--navy);gap:0;padding:6px 4px calc(6px + env(safe-area-inset-bottom));border-top:1px solid #24364f}
  nav.tabs .tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11.5px;padding:6px 2px;border-radius:10px;min-height:48px}
  nav.tabs .tab .ic{font-size:21px;line-height:1}
  nav.tabs .tab .dk{display:none}
  body.signed-in main{padding-bottom:calc(150px + env(safe-area-inset-bottom))}
  body.signed-in .toast{bottom:calc(84px + env(safe-area-inset-bottom))}
  .fbbtn{bottom:calc(80px + env(safe-area-inset-bottom));right:12px;width:50px;height:50px;padding:0;font-size:22px;display:flex;align-items:center;justify-content:center}
  .fbbtn[hidden]{display:none}
  .fbbtn .tl{display:none}
  .fbpanel{bottom:calc(140px + env(safe-area-inset-bottom));max-height:calc(100vh - 220px);overflow:auto}
  .acct{align-items:center;justify-content:space-between;gap:10px}
}

/* Daily streak */
.duo{display:block}
@media(min-width:701px){.duo{display:grid;grid-template-columns:1fr 1fr;gap:16px}.duo>.card{margin-bottom:16px}}
.streak{cursor:pointer}.streak:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.streak .top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.streak .big{font-family:Oswald,sans-serif;font-size:24px;font-weight:700;line-height:1.2}
.frz{font-size:13px;color:#2a6fb0;background:#e8f2fc;border-radius:999px;padding:3px 10px;font-weight:700;white-space:nowrap}
.wk{display:flex;justify-content:space-between;margin-top:12px}
.wk div{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11.5px;color:var(--muted);flex:1}
.wk span{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f1eee8;font-size:17px}
.wk .on span{background:#fff0e5;box-shadow:inset 0 0 0 2px var(--orange)}
.wk .fz span{background:#e8f2fc;box-shadow:inset 0 0 0 2px #7fb3e3}
.wk .today{color:var(--ink);font-weight:700}
.narrow{max-width:560px}
.stats{display:flex;gap:10px;margin:12px 0 16px}.stats .card{flex:1;text-align:center;margin:0;padding:12px 6px}.stats .n{font-family:Oswald,sans-serif;font-size:26px;font-weight:700}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;text-align:center;font-size:12px}
.cal .h{color:var(--muted);font-weight:700}
.cal .d{aspect-ratio:1;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f6f4ef;font-size:11px;color:var(--muted)}
.cal .d b{font-size:15px;line-height:1;min-height:15px}
.cal .d.on{background:#fff0e5;color:var(--ink)}.cal .d.fz{background:#e8f2fc;color:var(--ink)}.cal .d.t{box-shadow:inset 0 0 0 2px var(--ink)}
.badges{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.bdg{position:relative;text-align:center;border:1px solid var(--line);border-radius:12px;padding:10px 4px;background:#fff}
.bdg.gold:not(.off){background:#fffaf0;border-color:#f0c75e}
.bdg .e{font-size:28px}.bdg .t{font-weight:700;font-size:13px}.bdg.off{opacity:.4;filter:grayscale(1)}
.bdg .new{position:absolute;top:-8px;right:-6px;background:var(--orange);color:#fff;font-size:10px;font-weight:800;padding:2px 6px;border-radius:999px}
.sday{color:var(--orange);white-space:nowrap}
.sline{font:700 20px Oswald,sans-serif;color:var(--orange);margin:4px 0}
/* Badge celebration */
.cele{position:fixed;inset:0;z-index:80;background:rgba(15,27,45,.72);display:flex;align-items:center;justify-content:center;padding:20px;overflow:hidden}
.cele .box{position:relative;z-index:2;background:#fff;border-radius:20px;padding:26px 22px 22px;text-align:center;max-width:340px;width:100%;box-shadow:0 20px 50px rgba(0,0,0,.35);animation:celePop .55s cubic-bezier(.2,1.6,.4,1) both}
.cele.gold .box{background:linear-gradient(#fffaf0,#fff3d6);border:2px solid #f0c75e}
.cele .medal{width:120px;height:120px;margin:0 auto 10px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:64px;background:radial-gradient(circle at 35% 30%,#fff 0,#ffe7d3 45%,#f8b98c 100%);box-shadow:0 0 0 6px #fff0e5,0 0 0 10px var(--orange);animation:celeSpin 1.2s ease-out .2s both}
.cele.gold .medal{background:radial-gradient(circle at 35% 30%,#fffbe8 0,#ffe08a 45%,#e7b23a 100%);box-shadow:0 0 0 6px #fff6d8,0 0 0 10px #d9a521,0 0 40px 10px rgba(240,199,94,.6)}
.cele .kick{font-size:12px;letter-spacing:2px;font-weight:800;color:var(--orange);text-transform:uppercase}
.cele h2{font-size:30px;margin:4px 0 6px}
.cele p{margin:0 0 16px;color:var(--muted)}
.cele .btn{width:100%}
.conf{position:absolute;top:-20px;width:9px;height:14px;border-radius:2px;z-index:1;animation:celeFall linear both;pointer-events:none}
@keyframes celePop{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes celeSpin{from{transform:rotateY(540deg) scale(.6)}to{transform:rotateY(0) scale(1)}}
@keyframes celeFall{from{transform:translateY(0) rotate(0)}to{transform:translateY(110vh) rotate(720deg)}}
@media(prefers-reduced-motion:reduce){.cele .box,.cele .medal{animation:none}.conf{display:none}}
@media(min-width:701px){.narrow .cal{max-width:400px;margin:0 auto}}

/* Collapsible levels */
.level .lhead{display:flex;align-items:center;gap:10px;width:100%;background:none;border:0;padding:0;text-align:left;cursor:pointer;font:inherit;color:inherit}
.level .lhead h3{margin:0;flex:1}
.level .lhead:focus-visible{outline:3px solid var(--orange);outline-offset:4px;border-radius:6px}
.level .chev{font-size:18px;color:var(--muted);transition:transform .2s;width:20px;text-align:center}
.level.closed .chev{transform:rotate(-90deg)}
.level .mbar{height:6px;border-radius:99px;background:#eceae4;margin-top:10px;overflow:hidden}.level .mbar span{display:block;height:100%;background:var(--orange)}
.level.closed .lessons,.level.closed .lsum{display:none}

/* Know the court: find the spot */
.tapcourt{cursor:crosshair;touch-action:manipulation}
.findq{font-size:20px}.findq .hot{color:var(--orange)}
/* Free-plan limits */
.lrow.plan{background:#fffaf0;border:1px dashed #f0c75e;color:#6b5a2e;cursor:pointer;opacity:1}
.lrow.plan .lnum{background:#fff1c7}
.lrow.plan .ptag{margin-left:auto;font-size:11.5px;font-weight:800;color:#8a6a0c;background:#fff1c7;border-radius:999px;padding:3px 9px;white-space:nowrap}
.plansheet{text-align:center}.plansheet .star{font-size:40px}.plansheet h2{margin:6px 0}
.plansheet ul{text-align:left;padding-left:20px;margin:10px 0 14px}.plansheet li{margin:6px 0}.plansheet .btn{width:100%}
.freedone{background:#fffaf0;border:1px solid #f0c75e;border-radius:14px;padding:14px;margin:12px 0;text-align:left}
.limitbox{background:#fffaf0;border:1px solid #f0c75e;border-radius:14px;padding:14px;margin:0 0 14px}

/* Score sharing (Step 3) */
.sharebox{margin-top:12px;padding:10px 12px;background:#f7f5f0;border-radius:12px}
.sharebox.ask{background:#fff7e0;border:1px solid #f0c75e}
.waitbox{background:#fff7e0;border-color:#f0c75e}

/* Play editor: desktop shows every section; phones get a full-screen editor */
.fold>summary{display:none}
.chip{font:inherit}
@media(max-width:700px){
  body.editing header,body.editing .fbbtn,body.editing .banner{display:none!important}
  body.editing main{padding:0 0 calc(90px + env(safe-area-inset-bottom))}
  .edtop{position:sticky;top:0;z-index:30;background:var(--navy);color:#fff;gap:8px;padding:10px 12px;margin:0;flex-wrap:nowrap}
  .edtop h1{flex:1;min-width:0;margin:0;font-size:17px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .edtop .row{gap:6px;flex-wrap:nowrap}
  .edtop .btn{background:transparent;border:1px solid #3a4b66;color:#fff;padding:8px 11px;min-height:40px}
  .edtop .btn.pri{background:var(--orange);border-color:var(--orange)}
  .edtop .lbl{display:none}
  .ed{display:flex;flex-direction:column;gap:0;align-items:stretch}
  .edcol,.edmain,.edsteps{display:contents}
  #eSvg{order:1;display:block;width:auto;height:auto;margin:12px 12px 0;border-radius:12px}
  body.typing .tools{display:none}
  #eChips{order:2;gap:6px;overflow-x:auto;padding:10px 12px;background:#fff;border-bottom:1px solid var(--line)}
  .chip{flex:none;border:1.5px solid var(--line);background:#f7f5f0;border-radius:999px;padding:8px 14px;min-height:40px;font-weight:800;font-size:14px;color:#3c4558;cursor:pointer}
  .chip.on{background:var(--ink);border-color:var(--ink);color:#fff}
  .chip.add{border-style:dashed;color:var(--orange);background:#fff}
  #eHint{order:3;margin:0;padding:8px 12px;background:#fff;font-size:13px;border-radius:0}
  #eStepText{order:4;padding:0 12px 10px;background:#fff}
  #eStepText .f{margin-top:0}
  .edsbtns{order:5;padding:0 12px 12px;margin:0!important;background:#fff}
  .edsteps .dh,#eSteps,#eAddStep{display:none}
  #eDelStep:disabled{display:none}
  #eMetaFold{order:6}#eSetupFold{order:7}
  .ed>.edcol>details.fold:nth-of-type(2){order:8}.ed>.edcol>details.fold:nth-of-type(3){order:9}
  .fold{background:#fff;border:0;border-top:1px solid var(--line);border-radius:0;margin:0;padding:0 12px;box-shadow:none}
  .fold>summary{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:14px 0;font-weight:800;font-size:16px;list-style:none;cursor:pointer}
  .fold>summary::-webkit-details-marker{display:none}
  .fold>summary small{flex:1;min-width:0;font-weight:600;color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .fold>summary::after{content:'▾';color:var(--muted)}
  .fold[open]>summary::after{content:'▴'}
  .fold[open]{padding-bottom:14px}
  .fold .dh{display:none}
  .fold .two{display:block}.fold .two>div+div{margin-top:10px}
  .tools{position:fixed;left:0;right:0;bottom:0;z-index:40;margin:0;background:#fff;border-top:1px solid var(--line);display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:2px;padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .tool{border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11.5px;font-weight:700;color:#5b6474;padding:6px 0;border-radius:10px;min-height:52px}
  .tool .ti{font-size:20px;line-height:1;color:#3c4558}
  .tool.on{background:#fff0e5;color:var(--orange)}
  .tool.on .ti{color:var(--orange)}
  body.editing .toast{bottom:calc(84px + env(safe-area-inset-bottom))}
}

/* Coach dashboard tab on the team page */
.ttabs{display:flex;gap:6px;margin:14px 0 0;border-bottom:2px solid var(--line)}
.ttab{border:0;background:none;padding:10px 16px;font:700 15px Inter,sans-serif;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-2px;cursor:pointer;display:flex;align-items:center;gap:6px}
.ttab.on{color:var(--ink);border-bottom-color:var(--orange)}
.ttab .bd{background:#e0675a;color:#fff;border-radius:999px;font-size:12px;padding:1px 7px}
@media(max-width:700px){.ttab{flex:1;justify-content:center;padding:10px 6px}}
.dash{margin-top:14px}
.dash .sum{display:flex;gap:10px;margin:10px 0 14px}
.dash .sum div{flex:1;background:#f7f5f0;border-radius:12px;padding:10px 8px;text-align:center}
.dash .sum b{display:block;font:700 24px/1.1 Oswald,sans-serif}
.dash .sum span{font-size:12px;color:var(--muted)}
.miss{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-top:10px;background:#fff}
.miss .top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.miss .nm{font-weight:800;font-size:16px}
.miss .pct{font:700 20px Oswald,sans-serif}
.miss.bad .pct{color:#c0392b}.miss.mid .pct{color:#c46a12}
.mbar{height:8px;border-radius:999px;background:#eef0f4;margin:8px 0 6px;overflow:hidden}.mbar span{display:block;height:100%;border-radius:999px}
.miss.bad .mbar span{background:#e0675a}.miss.mid .mbar span{background:#f0a24a}
.miss .facts{font-size:13px;color:var(--muted)}
.tq{margin-top:10px;background:#fff6ef;border-radius:10px;padding:9px 11px;font-size:14px}
.tq small{display:block;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;margin-bottom:2px}
.miss .acts{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.whol{margin-top:8px;font-size:13.5px}.whol div{display:flex;justify-content:space-between;align-items:center;padding:5px 0;border-top:1px solid var(--line)}
.good{margin-top:12px;font-size:14px;color:var(--muted)}.good b{color:#1e8e5a}
.lockn{font-size:12.5px;color:var(--muted);margin-top:10px}
.ttab{white-space:nowrap}
.tpane>.card:first-child{margin-top:14px}
@media(max-width:700px){
  .ttabs{gap:2px}.ttab{padding:10px 2px;font-size:14px;gap:4px}
  #pane-pb .grid{grid-template-columns:1fr;gap:8px}
  #pane-pb .pcard{flex-direction:row;align-items:center}
  #pane-pb .pcard>div:first-child{width:96px;flex:none}
  #pane-pb .pcard svg{width:96px}
  #pane-pb .pcard .pb{padding:8px 10px}
}
@media(max-width:400px){.ttab .em{display:none}}

/* Plays page: My plays / Starter library tabs */
.ptabs{margin:4px 0 14px}
.ttab .ct{color:var(--muted);font-weight:600}
.chipsf{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 12px}
.chipsf button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:7px 13px;font:700 13.5px Inter,sans-serif;color:#3c4558;cursor:pointer;min-height:36px}
.chipsf button.on{background:var(--ink);border-color:var(--ink);color:#fff}
.inmine{font-size:13px;font-weight:700;color:#1e8e5a;padding:6px 4px}
.pcard[hidden]{display:none}
@media(max-width:700px){
  .ptabs .ttab{flex:1;justify-content:center}
  .chipsf{flex-wrap:nowrap;overflow-x:auto;margin-right:-16px;padding-right:16px}.chipsf button{flex:none}
  .pp .grid{grid-template-columns:1fr;gap:8px}
  .pp .pcard{flex-direction:row;align-items:center}
  .pp .pcard>div:first-child{width:96px;flex:none}
  .pp .pcard svg{width:96px}
  .pp .pcard .pb{padding:8px 10px}
}

/* Share box: already-shared teams are locked; Update appears when the play changed */
.shrow{display:flex;align-items:center;gap:10px;padding:11px 2px;border-top:1px solid var(--line);flex-wrap:wrap;cursor:pointer}
.shrow.done{cursor:default}
.shrow input{width:20px;height:20px}.shrow input:disabled{opacity:.45}.shrow .nm{font-weight:700;flex:1}.shrow.done .nm{color:var(--muted)}
.st{font-size:12.5px;font-weight:700;border-radius:999px;padding:3px 9px;white-space:nowrap}.st.on{background:#e7f6ee;color:#1e8e5a}
.chg{flex-basis:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 0 0 30px;background:#fff6ef;border-radius:9px;padding:7px 10px;font-size:13px;color:#8a4a12}

/* Coach "Get started" guide (guide.js) */
.gcard{background:#fff;border:2px solid var(--orange);border-radius:14px;padding:14px 16px;margin:0 0 16px}
.gcard .gh{display:flex;justify-content:space-between;align-items:center;gap:10px}.gcard h3{margin:0;font-size:17px}
.gbar{height:8px;border-radius:999px;background:#eef0f4;margin:10px 0 8px;overflow:hidden}.gbar span{display:block;height:100%;background:var(--orange);border-radius:999px;transition:width .3s}
.gstep{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:14.5px}
.gstep .ck{width:24px;height:24px;border-radius:50%;border:2px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:var(--muted);flex:none}
.gstep.done .ck{background:#1e8e5a;border-color:#1e8e5a;color:#fff}.gstep.done .t{color:var(--muted);text-decoration:line-through}
.gstep.next{font-weight:800}.gstep.next .ck{border-color:var(--orange);color:var(--orange)}.gstep .go{margin-left:auto}
.ghide{font-size:12.5px;color:var(--muted);background:none;border:0;text-decoration:underline;cursor:pointer;padding:4px}
.gprev{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-top:10px;background:#fbfaf7;position:relative}
.gpl{position:absolute;top:8px;right:10px;font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.gpsum{display:flex;gap:8px;margin:14px 0 10px}.gpsum div{flex:1;background:#f1eee8;border-radius:10px;padding:6px;text-align:center;font-size:11.5px;color:var(--muted)}.gpsum b{display:block;font:700 18px Oswald,sans-serif;color:var(--ink)}
.gprow{display:flex;justify-content:space-between;font-weight:800;font-size:14px}.gpp{color:#c46a12}.gprev .mbar span{background:#f0a24a}.gpq{font-size:12.5px;color:var(--muted)}
.gspot{position:absolute;border-radius:12px;box-shadow:0 0 0 9999px rgba(15,27,45,.62);z-index:2000;pointer-events:none;outline:3px solid var(--orange);outline-offset:3px}
.gtip{position:absolute;z-index:2001;background:#fff;border-radius:12px;padding:12px 14px;box-shadow:0 8px 24px rgba(0,0,0,.3);width:290px;max-width:calc(100vw - 24px);font-size:14.5px;line-height:1.4}
.gtip small{display:block;color:var(--orange);font-weight:800;font-size:12px;letter-spacing:.03em;text-transform:uppercase;margin-bottom:3px}
.gtip .row{justify-content:space-between;margin-top:10px;flex-wrap:nowrap}
.gtip:after{content:'';position:absolute;left:var(--ax,30px);border:9px solid transparent}.gtip.below:after{top:-18px;border-bottom-color:#fff}.gtip.above:after{bottom:-18px;border-top-color:#fff}
@media(min-width:900px){
  .gsteps{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
  .gstep{flex-direction:column;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:10px 12px;gap:6px}
  .gstep.next{border-color:var(--orange);background:#fff6ef}.gstep .go{margin-left:0}
  .gdone{display:flex;gap:18px;align-items:flex-start}.gdone>div:first-child{flex:1}.gdone .gprev{width:340px;flex:none;margin-top:8px}
}
.gstep .go{display:flex;gap:6px;flex:none}.gstep .go .btn{white-space:nowrap}
.gstats{display:flex;gap:10px;margin-top:10px}.gstats div{flex:1;background:#f7f5f0;border-radius:12px;padding:8px;text-align:center;font-size:12.5px;color:var(--muted)}.gstats b{display:block;font:700 22px Oswald,sans-serif;color:var(--ink)}
@media(max-width:420px){.gstep{font-size:13.5px}.gstep .go .btn{padding:6px 9px}}

/* ---------- Front door (signed-out landing page, front.js) ---------- */
body.front{overflow-x:hidden}
body.front main{max-width:none;padding:0}
body.front header .who{display:flex;margin-left:auto}
body.front header .who .btn{background:transparent;color:#fff;border-color:#3a4b66}
.fd-wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.fd-top{background:var(--navy);color:#fff}
.fd-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding-top:44px;padding-bottom:60px}
.fd-hero h1{font:700 52px/1.05 Oswald,Impact,sans-serif;margin:0 0 14px;color:#fff}
.fd-hero h1 span{color:var(--orange)}
.fd-hero p{font-size:18px;line-height:1.5;color:#c9d1de;margin:0 0 22px;max-width:520px}
.fd-cta{display:flex;gap:10px;flex-wrap:wrap}
.fd-cta .btn{padding:12px 20px;font-size:16px}
.fd-hero .fd-cta .btn:not(.pri){background:transparent;color:#fff;border-color:#5a6b86}
.fd-tiny{font-size:13px;color:#93a0b5;margin-top:12px}
.fd-phones{position:relative;height:520px}
.fd-phone{position:absolute;width:280px;border-radius:34px;border:10px solid #23314a;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.45);background:#fff}
.fd-phone img{display:block;width:100%}
.fd-phone.a{left:10px;top:0;transform:rotate(-4deg)}
.fd-phone.b{right:0;top:40px;transform:rotate(4deg);width:250px}
.fd section{padding:56px 0}
.fd section.fd-nt{padding-top:0}
.fd-h2{font:700 34px Oswald,Impact,sans-serif;margin:0 0 6px;text-align:center}
.fd-sub{text-align:center;color:var(--muted);margin:0 0 28px;font-size:16.5px}
.fd-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.fd-step{background:#fff;border:1px solid #ebe5da;border-radius:18px;padding:18px;text-align:center}
.fd-step .n{display:inline-flex;width:34px;height:34px;border-radius:50%;background:var(--orange);color:#fff;font-weight:800;align-items:center;justify-content:center}
.fd-step h3{margin:10px 0 4px;font-size:19px}
.fd-step p{color:var(--muted);margin:0 0 14px;font-size:14.5px}
.fd-step .fd-shot{border-radius:14px;overflow:hidden;border:1px solid #ebe5da;height:300px;background:#fff}
.fd-step .fd-shot.mid{display:flex;align-items:center}
.fd-shot img{width:100%;display:block}
.fd-roles{display:grid;gap:26px}
.fd-role{display:grid;grid-template-columns:1fr 300px;gap:36px;align-items:center;background:#fff;border:1px solid #ebe5da;border-radius:22px;padding:28px 32px}
.fd-role:nth-child(even){grid-template-columns:300px 1fr}
.fd-role:nth-child(even) .txt{order:2}
.fd-tag{display:inline-block;font:800 12px Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#c2500d;margin-bottom:6px}
.fd-role h3{font:700 28px Oswald,Impact,sans-serif;margin:0 0 10px}
.fd-role ul{margin:0;padding-left:20px;color:#3c4558;line-height:1.7;font-size:15.5px}
.fd-role .fd-shot{border-radius:22px;overflow:hidden;border:8px solid #23314a;height:360px}
.fd-role .fd-shot.fit{height:auto}
.fd-safe{background:var(--navy);color:#fff;border-radius:24px;padding:34px}
.fd-safe .fd-sub{color:#b9c3d3}
.fd-safe .g{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.fd-safe .i{background:#18253c;border-radius:16px;padding:16px}
.fd-safe .i b{display:block;font-size:16px;margin:6px 0 4px}
.fd-safe .i span{color:#b9c3d3;font-size:14px}
.fd-safe .e{font-size:26px}
.fd-final{text-align:center;padding-top:30px;padding-bottom:60px}
.fd-final h2{font:700 34px Oswald,Impact,sans-serif;margin:0 0 14px}
.fd-final .fd-cta{justify-content:center}
.fd-foot{border-top:1px solid #ebe5da;padding:22px 0;color:var(--muted);font-size:14px}
.fd-foot .fd-wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}
.fd-foot a{color:var(--muted);margin-right:16px}
@media(max-width:760px){
  .fd-wrap{padding:0 18px}
  .fd-hero{grid-template-columns:1fr;padding-top:26px;padding-bottom:40px;gap:26px}
  .fd-hero h1{font-size:38px}.fd-hero p{font-size:16px}
  .fd-phones{height:350px;overflow:hidden}
  .fd-phone{width:220px}.fd-phone.b{width:200px;right:6px}
  .fd-cta .btn{flex:1;text-align:center}
  .fd section{padding:40px 0}.fd-h2{font-size:28px}
  .fd-steps{grid-template-columns:1fr}
  .fd-step .fd-shot{height:240px}.fd-step .fd-shot.mid{height:auto}
  .fd-role,.fd-role:nth-child(even){grid-template-columns:1fr;padding:22px;gap:18px}
  .fd-role:nth-child(even) .txt{order:0}
  .fd-role .fd-shot{height:300px;max-width:280px;margin:0 auto}
  .fd-safe{padding:24px 18px}.fd-safe .g{grid-template-columns:1fr 1fr}
}