:root{--ink:#27374D;--secondary:#526D82;--accent:#9DB2BF;--bg:#F4F7F9;--surface:#fff;--soft:#E9EFF3;--border:#D7E0E6;--muted:#667787;--danger:#B42318;--success:#217A5B;--shadow:0 12px 40px rgba(39,55,77,.10);font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--bg);font-size:16px;color-scheme:light}html[data-theme=dark]{--ink:#EDF3F7;--secondary:#B9CAD5;--accent:#9DB2BF;--bg:#121A24;--surface:#1B2735;--soft:#243445;--border:#35485B;--muted:#A9BAC6;--danger:#FF8D86;--success:#72D4B1;--shadow:0 12px 40px rgba(0,0,0,.3);color-scheme:dark}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit;color:inherit}button{border:1px solid var(--border);background:var(--surface);padding:.65rem .9rem;border-radius:.7rem;cursor:pointer;font-weight:650}button:hover{border-color:var(--accent)}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 60%,transparent);outline-offset:2px}.primary{background:#27374D;color:#fff;border-color:#27374D}.secondary{background:var(--soft);border-color:transparent}.danger{color:var(--danger)}.ghost{background:transparent}.wide{width:100%}.topbar{height:68px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 3vw;gap:2rem;position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:.65rem;color:inherit;text-decoration:none;font-weight:800;white-space:nowrap}.brand-mark{width:56px;height:56px;border-radius:18px;background:#27374D;color:#fff;display:grid;place-items:center;font-weight:850;letter-spacing:-.08em}.brand-mark.small{width:35px;height:35px;border-radius:10px;font-size:.8rem}.topbar nav{display:flex;height:100%}.nav-link{border:0;background:transparent;border-radius:0;color:var(--muted)}.nav-link.active{color:var(--ink);box-shadow:inset 0 -3px var(--ink)}.account{margin-left:auto;display:flex;align-items:center;gap:.4rem}.email{font-size:.85rem;color:var(--muted);margin:0 .5rem}.icon-btn{font-size:1.25rem;padding:.42rem .7rem}main{max-width:1760px;margin:auto;padding:2rem 3vw}.planner-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}.planner-head h1{font-size:clamp(1.7rem,3vw,2.5rem);margin:.15rem 0}.eyebrow{font-size:.75rem;font-weight:800;letter-spacing:.13em;color:var(--secondary);margin:0}.head-actions{display:flex;gap:.6rem}.toolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.week-nav{display:flex;gap:.4rem}.date-jump{display:flex;align-items:center;gap:.6rem;color:var(--muted);font-size:.875rem}.date-jump input{width:auto}.mobile-view{display:none}.summary{display:grid;grid-template-columns:repeat(6,1fr);gap:.65rem;margin-bottom:1rem}.metric{background:var(--surface);border:1px solid var(--border);border-radius:.9rem;padding:.8rem 1rem}.metric strong{display:block;font-size:1.35rem}.metric span{font-size:.76rem;color:var(--muted)}.calendar{display:grid;grid-template-columns:repeat(7,minmax(150px,1fr));border:1px solid var(--border);border-radius:1rem;overflow:hidden;background:var(--border);gap:1px;box-shadow:var(--shadow)}.day{background:var(--surface);min-height:430px;padding:.75rem;display:flex;flex-direction:column;gap:.65rem}.day.today{box-shadow:inset 0 4px var(--secondary)}.day.dragover{background:var(--soft)}.day-head{display:flex;align-items:center;justify-content:space-between;padding:.2rem}.day-name{text-transform:uppercase;font-size:.72rem;font-weight:800;letter-spacing:.1em;color:var(--muted)}.day-date{font-size:1.35rem;font-weight:800;margin-top:.12rem}.day.today .day-date{display:inline-grid;place-items:center;background:var(--ink);color:var(--surface);border-radius:50%;width:2.3rem;height:2.3rem}.add-day{border:0;background:transparent;color:var(--secondary);padding:.25rem;font-size:1.3rem}.empty{color:var(--muted);text-align:center;font-size:.8rem;margin:auto}.training-card{border:1px solid var(--border);border-left:4px solid var(--sport);background:var(--bg);border-radius:.75rem;padding:.65rem;cursor:pointer;box-shadow:0 2px 8px rgba(39,55,77,.05)}.training-card:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(39,55,77,.12)}.training-title{display:flex;gap:.4rem;align-items:start;font-weight:780;font-size:.9rem}.training-title span:nth-child(2){flex:1}.training-meta{display:flex;gap:.45rem;flex-wrap:wrap;color:var(--muted);font-size:.73rem;margin:.45rem 0}.badge{display:inline-flex;align-items:center;gap:.3rem;border-radius:99px;padding:.2rem .45rem;font-size:.68rem;font-weight:800;background:var(--soft)}.badge.completed{color:var(--success)}.badge.skipped,.badge.overdue{color:var(--danger)}.quick{display:flex;gap:.3rem;margin-top:.5rem}.quick button{font-size:.68rem;padding:.25rem .4rem;background:var(--surface)}input,select,textarea{width:100%;border:1px solid var(--border);background:var(--surface);border-radius:.65rem;padding:.7rem .75rem;margin-top:.35rem}label{font-size:.84rem;font-weight:700}.optional{font-weight:400;color:var(--muted)}dialog{border:0;padding:0;border-radius:1.1rem;background:var(--surface);color:var(--ink);width:min(760px,calc(100% - 2rem));box-shadow:0 24px 70px rgba(0,0,0,.3)}dialog::backdrop{background:rgba(20,29,39,.65);backdrop-filter:blur(3px)}.dialog-card{padding:1.4rem}.dialog-card header{display:flex;justify-content:space-between;align-items:start;margin-bottom:1.1rem}.dialog-card h2{margin:.2rem 0;font-size:1.5rem}.narrow{max-width:520px}.close{border:0;background:transparent;font-size:1.6rem;padding:.2rem}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-grid .full{grid-column:1/-1}.form-grid.compact{max-width:700px}.form-actions{grid-column:1/-1;display:flex;align-items:center;gap:.6rem;margin-top:1.2rem}.spacer{flex:1}.check{display:flex;align-items:center;gap:.5rem}.check input{width:auto;margin:0}.muted{color:var(--muted)}.sports-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.8rem}.sport-card,.settings-card{background:var(--surface);border:1px solid var(--border);border-radius:1rem;padding:1rem}.sport-card{display:flex;align-items:center;gap:.8rem}.sport-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--sport) 18%,var(--surface));font-size:1.35rem}.sport-card button{margin-left:auto}.inactive{opacity:.58}.settings-card{margin-top:1rem}.toast{position:fixed;right:1rem;bottom:1rem;background:var(--ink);color:var(--surface);padding:.8rem 1rem;border-radius:.75rem;box-shadow:var(--shadow);transform:translateY(140%);transition:.25s;z-index:30}.toast.show{transform:none}.toast.bad{background:#B42318;color:#fff}.login-page{display:grid;place-items:center;padding:1rem;background:radial-gradient(circle at 70% 20%,#9DB2BF55,transparent 32%),var(--bg)}.login-card{width:min(420px,100%);background:var(--surface);padding:2rem;border-radius:1.25rem;box-shadow:var(--shadow);border:1px solid var(--border)}.login-card h1{margin:1.2rem 0 .2rem}.login-card form{display:grid;gap:1rem;margin-top:1.5rem}.alert{padding:.75rem;border-radius:.6rem;margin-top:1rem}.alert.error{background:#B4231815;color:var(--danger)}
@media(max-width:950px){.email{display:none}.summary{grid-template-columns:repeat(3,1fr)}.calendar{grid-template-columns:1fr}.day{display:none;min-height:420px}.day.mobile-active{display:flex}.mobile-view{display:flex;align-items:center;gap:.5rem}.date-jump,.week-nav{display:none}.topbar{padding:0 1rem;gap:.6rem}.topbar nav{margin-left:auto}.brand>span:last-child{display:none}.account{margin-left:0}main{padding:1.3rem 1rem}.head-actions{flex-direction:column}.planner-head{align-items:start}.training-card{padding:.8rem}}
@media(max-width:560px){.summary{display:flex;overflow:auto;padding-bottom:.25rem}.metric{min-width:145px}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.dialog-card{padding:1rem}.topbar nav .nav-link{font-size:.78rem;padding:.5rem}.planner-head{display:block}.head-actions{display:grid;grid-template-columns:1fr 1fr;margin-top:1rem}.head-actions button{font-size:.76rem}.settings-card .form-grid{display:block}.settings-card label{display:block;margin-bottom:1rem}}

/* Keep long sport names, metadata and controls contained inside their card. */
.sport-card{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:.55rem .8rem;overflow:hidden}
.sport-card>div:nth-child(2){min-width:0;overflow-wrap:anywhere}
.sport-card button{grid-column:2;margin-left:0;justify-self:start;max-width:100%}

.week-stats{margin-top:1.25rem;background:var(--surface);border:1px solid var(--border);border-radius:1rem;padding:1.2rem;box-shadow:var(--shadow)}
.week-stats-head{display:flex;align-items:center;justify-content:space-between;gap:1rem}.week-stats h2{margin:.15rem 0;font-size:1.4rem}.week-totals{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}.week-total{display:flex;align-items:baseline;gap:.35rem;background:var(--soft);border-radius:.8rem;padding:.65rem .9rem}.week-total strong{font-size:1.5rem}.week-total span,.stats-note{color:var(--muted);font-size:.8rem}.stats-note{margin:.25rem 0 1rem}.sport-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.75rem}.sport-stat{border:1px solid var(--border);border-top:4px solid var(--sport);border-radius:.8rem;padding:.85rem;min-width:0}.sport-stat-title{display:flex;align-items:center;gap:.5rem;min-width:0}.sport-stat-title strong{overflow-wrap:anywhere}.sport-stat-icon{font-size:1.2rem}.sport-stat dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.45rem;margin:.8rem 0 0}.sport-stat dl div{background:var(--bg);border-radius:.6rem;padding:.5rem;min-width:0}.sport-stat dt{font-size:.68rem;color:var(--muted)}.sport-stat dd{margin:.15rem 0 0;font-size:1.05rem;font-weight:800}.stats-empty{color:var(--muted);padding:.75rem 0}
@media(max-width:700px){.week-stats-head{align-items:flex-start;display:block}.week-totals{justify-content:flex-start;margin-top:.8rem}.week-total{display:block;text-align:center;flex:1}.week-total span{display:block}.sport-stats{grid-template-columns:1fr}.sport-stat dl{grid-template-columns:repeat(3,1fr)}}

/* Complete responsive layout for tablets and phones. */
html,body{max-width:100%;overflow-x:hidden}
@media(max-width:950px){
  .topbar{height:auto;min-height:64px;display:grid;grid-template-columns:auto 1fr auto;gap:.35rem .75rem;padding:.55rem 1rem}
  .topbar .brand{grid-column:1}.topbar nav{grid-column:2;justify-content:center}.topbar .account{grid-column:3}
  .topbar nav .nav-link{min-height:44px}.account .icon-btn,.account .nav-link{min-height:44px}
  main{width:100%;padding:1.1rem 1rem 2rem}
  .planner-head{margin-bottom:1rem}.planner-head h1{font-size:clamp(1.6rem,7vw,2.15rem);line-height:1.15}
  .toolbar{min-height:46px}.mobile-view{width:100%;justify-content:space-between;background:var(--surface);border:1px solid var(--border);border-radius:.8rem;padding:.25rem}
  .mobile-view button{min-width:44px;min-height:44px}.mobile-view strong{text-transform:capitalize;align-self:center}
  .calendar{display:block;border-radius:.9rem}.day{width:100%;min-height:52vh;border:0}.day-head{position:sticky;top:0;background:var(--surface);z-index:2;padding:.35rem .2rem .6rem}
  .add-day{min-width:44px;min-height:44px}.training-card{touch-action:manipulation}.quick{flex-wrap:wrap}.quick button{min-height:36px;flex:1 1 auto}
  dialog{max-height:92dvh;overflow:auto;margin:auto}.dialog-card header{position:sticky;top:-1.4rem;background:var(--surface);z-index:3;padding-top:1.4rem}.close{min-width:44px;min-height:44px}
  .sports-grid{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
}
@media(max-width:650px){
  .topbar{grid-template-columns:auto 1fr;padding:.45rem .75rem 0;gap:.25rem .5rem}
  .topbar .brand{grid-column:1;grid-row:1}.topbar .account{grid-column:2;grid-row:1;justify-self:end}.topbar nav{grid-column:1/-1;grid-row:2;width:100%}
  .topbar nav .nav-link{flex:1;padding:.65rem .4rem}.account form .nav-link{font-size:0;width:44px;padding:0}.account form .nav-link::after{content:'↪';font-size:1.25rem}.brand-mark.small{width:40px;height:40px}
  main{padding:.9rem .75rem 1.5rem}.planner-head{display:block}.planner-head .muted{font-size:.9rem}
  .head-actions{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.85rem}.head-actions button{width:100%;min-height:46px;padding:.55rem;font-size:.82rem;white-space:normal}
  .summary{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-inline:contain;gap:.5rem;margin-inline:-.75rem;padding:0 .75rem .45rem;scrollbar-width:thin}.metric{min-width:145px;scroll-snap-align:start;padding:.7rem .8rem}.metric strong{font-size:1.2rem}
  .day{min-height:58dvh;padding:.7rem}.training-card{padding:.8rem}.training-title{font-size:1rem}.training-meta{font-size:.8rem}.badge{font-size:.75rem;padding:.25rem .5rem}
  input,select,textarea{font-size:1rem;min-height:46px}textarea{min-height:90px}.form-grid{grid-template-columns:1fr;gap:.8rem}.form-grid .full,.form-actions{grid-column:auto}
  dialog{width:calc(100% - 1rem);max-height:95dvh;border-radius:.9rem}.dialog-card{padding:1rem}.dialog-card header{top:-1rem;padding-top:1rem}.dialog-card h2{font-size:1.3rem}.form-actions{position:sticky;bottom:-1rem;background:var(--surface);padding:.8rem 0 1rem;margin-top:.7rem;flex-wrap:wrap}.form-actions .spacer{display:none}.form-actions button{min-height:44px;flex:1}.form-actions .danger{flex-basis:100%;order:3}
  .sports-grid{grid-template-columns:1fr}.sport-card{padding:.85rem}.settings-card{padding:.9rem}.settings-card h2{font-size:1.25rem}
  .week-stats{padding:.9rem;margin-top:.9rem}.week-totals{display:flex;flex-wrap:nowrap;overflow-x:auto;margin-inline:-.9rem;padding:0 .9rem .35rem}.week-total{min-width:110px;flex:1 0 110px}.stats-note{line-height:1.45}.sport-stat{padding:.75rem}.sport-stat dl{gap:.35rem}.sport-stat dl div{padding:.45rem .35rem}.sport-stat dt{font-size:.65rem}.sport-stat dd{font-size:1rem}
}
@media(max-width:390px){
  .topbar nav .nav-link{font-size:.75rem}.head-actions{grid-template-columns:1fr}.planner-head h1{font-size:1.55rem}.summary{gap:.4rem}.metric{min-width:132px}
  .sport-stat dl{grid-template-columns:1fr}.sport-stat dl div{display:flex;align-items:center;justify-content:space-between}.sport-stat dd{margin:0}
}

/* Mobile dashboards wrap inside the viewport; no internal horizontal scrollers. */
@media(max-width:650px){
  .summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;scroll-snap-type:none;margin-inline:0;padding:0;gap:.5rem}
  .metric{min-width:0;width:auto;scroll-snap-align:none;overflow-wrap:anywhere}
  .week-totals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;overflow:visible;margin-inline:0;padding:0;gap:.4rem}
  .week-total{min-width:0;width:auto;max-width:100%;padding:.6rem .25rem;overflow-wrap:anywhere}
}
@media(max-width:340px){
  .summary{grid-template-columns:1fr}
  .week-totals{grid-template-columns:1fr}
  .week-total{display:flex;text-align:left;justify-content:space-between;align-items:baseline;padding:.6rem .75rem}
  .week-total span{display:inline}
}

/* Preserve one continuous rounded border and draw the sport accent inside it. */
.sport-stat{position:relative;overflow:hidden;border:1px solid var(--border);padding-top:1rem}
.sport-stat::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--sport);pointer-events:none}

.week-stats-head{margin-bottom:.8rem}.week-totals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.6rem;width:100%}.compare-total,.compliance-total{background:var(--soft);border-radius:.8rem;padding:.75rem;min-width:0}.compare-total>span,.compliance-total>span{display:block;color:var(--muted);font-size:.72rem;font-weight:700;margin-bottom:.45rem}.compare-total>div{display:grid;grid-template-columns:auto 1fr;gap:.12rem .4rem;align-items:baseline}.compare-total b{font-size:1.2rem}.compare-total small,.compliance-total small{color:var(--muted);font-size:.68rem}.compliance-total strong{font-size:1.45rem}.compliance-track{height:7px;background:var(--surface);border-radius:99px;overflow:hidden;margin:.4rem 0}.compliance-track i{display:block;height:100%;background:var(--success);border-radius:inherit}.stat-compare{display:grid;grid-template-columns:minmax(75px,1fr) minmax(60px,.7fr) minmax(70px,.8fr);gap:.35rem;margin-top:.8rem;align-items:center}.stat-compare>*{min-width:0}.stat-compare>b{font-size:.66rem;color:var(--muted);text-align:right;overflow-wrap:anywhere}.stat-compare>span{font-size:.72rem;color:var(--muted)}.stat-compare>strong{text-align:right;background:var(--bg);border-radius:.5rem;padding:.4rem;font-size:1rem}
@media(max-width:700px){.week-totals{grid-template-columns:repeat(2,minmax(0,1fr));margin:0;padding:0;overflow:visible}.compare-total,.compliance-total{min-width:0}.stat-compare{grid-template-columns:minmax(70px,1fr) minmax(62px,.7fr) minmax(72px,.8fr)}}
@media(max-width:350px){.week-totals{grid-template-columns:1fr}.compare-total>div{grid-template-columns:auto 1fr}.stat-compare{grid-template-columns:minmax(65px,1fr) 58px 68px}.stat-compare>strong{padding:.35rem .2rem}}

.app-download{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1rem}.app-download-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:14px;background:#27374D;color:#fff;font-weight:850;letter-spacing:-.08em}.app-download h2{margin:0 0 .25rem}.app-download p{margin:.2rem 0 .35rem;line-height:1.45}.app-download small{color:var(--muted)}.download-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.7rem 1rem;border-radius:.7rem;text-decoration:none;font-weight:750;white-space:nowrap}
@media(max-width:650px){.app-download{grid-template-columns:auto minmax(0,1fr)}.app-download .download-button{grid-column:1/-1;width:100%}}

@media(max-width:650px){
  body{padding-top:105px}
  .topbar{position:fixed;top:0;left:0;right:0;z-index:100;width:100%;box-shadow:0 3px 12px rgba(0,0,0,.16)}
}

.header-icon,.logout-button{display:inline-flex;align-items:center;justify-content:center}.header-icon svg,.logout-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.header-icon svg circle{fill:none}.header-icon svg path{fill:none}.logout-button{gap:.45rem}
@media(max-width:650px){.account form .logout-button{font-size:inherit;width:44px;padding:0}.account form .logout-button::after{content:none}.logout-label{display:none}.header-icon svg,.logout-button svg{width:23px;height:23px}}