:root {
  color-scheme: dark;
  --bg: #0b100d;
  --panel: rgba(22, 31, 26, .9);
  --panel-2: #1a251f;
  --line: rgba(255,255,255,.09);
  --text: #f4f7f5;
  --muted: #92a099;
  --green: #b7ef5a;
  --spotify: #1ed760;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  color: var(--text);
  background: var(--bg);
  font-family: "DM Sans", sans-serif;
}

.auth-gate { position: fixed; z-index: 3000; inset: 0; display: grid; place-items: start center; overflow-y: auto; padding: 1rem; background: radial-gradient(circle at 15% 10%, rgba(183,239,90,.13), transparent 28rem), var(--bg); }
.auth-gate[hidden] { display: none; }
.auth-pending .shell { visibility: hidden; }
.auth-gate-card { display: grid; gap: 1.25rem; width: min(520px, 100%); margin: auto 0; padding: clamp(1.5rem, 4vw, 2.6rem); border: 1px solid var(--line); border-radius: 24px; background: linear-gradient(145deg, rgba(28,39,33,.98), rgba(18,26,22,.98)); box-shadow: 0 30px 100px rgba(0,0,0,.45); }
.auth-gate-brand { display: flex; align-items: center; gap: 1rem; }
.auth-gate-brand img,
.auth-gate-logo { width: 52px; height: 52px; flex: 0 0 52px; border-radius: 14px; }
.auth-gate-logo rect { fill: #101914; }
.auth-gate-logo circle { fill: none; stroke: var(--green); stroke-width: 44px; }
.auth-gate-logo path { fill: var(--text); }
.auth-gate-brand h1 { font-size: clamp(2rem, 8vw, 3.3rem); }
.auth-gate-card h2 { margin: 0; font: 600 clamp(1.45rem, 5vw, 2rem) "Space Grotesk", sans-serif; }
.auth-gate-card p { margin: .45rem 0 0; color: var(--muted); }
.auth-mode-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border: 1px solid var(--line); border-radius: 14px; background: rgba(0,0,0,.15); }
.auth-mode-tabs button { padding: .75rem .8rem; border: 0; border-radius: 10px; color: var(--muted); background: transparent; cursor: pointer; font-weight: 800; }
.auth-mode-tabs button[aria-selected="true"] { color: var(--bg); background: var(--green); }
.auth-google-button { display: flex; align-items: center; justify-content: center; gap: .65rem; width: 100%; padding: .95rem 1rem; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.035); font-weight: 700; cursor: pointer; }
.auth-google-button:hover { border-color: rgba(183,239,90,.35); background: rgba(183,239,90,.06); }
.auth-apple-button { display: flex; align-items: center; justify-content: center; gap: .55rem; width: 100%; padding: .95rem 1rem; border: 1px solid #fff; border-radius: 12px; color: #000; background: #fff; cursor: pointer; }
.auth-provider-icon,
.auth-apple-button span { display: block; width: 22px; height: 22px; flex: 0 0 22px; background-position: center; background-repeat: no-repeat; background-size: contain; font-size: 0; line-height: 0; }
.google-icon { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 48 48' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23FFC107' d='M43.6 20.5H42V20H24v8h11.3C33.7 32.7 29.3 36 24 36c-6.6 0-12-5.4-12-12s5.4-12 12-12c3.1 0 5.9 1.2 8 3.1l5.7-5.7C34.1 6.1 29.3 4 24 4 12.9 4 4 12.9 4 24s8.9 20 20 20 20-8.9 20-20c0-1.3-.1-2.4-.4-3.5z'/%3E%3Cpath fill='%23FF3D00' d='M6.3 14.7l6.6 4.8C14.7 15.1 19 12 24 12c3.1 0 5.9 1.2 8 3.1l5.7-5.7C34.1 6.1 29.3 4 24 4 16.3 4 9.7 8.3 6.3 14.7z'/%3E%3Cpath fill='%234CAF50' d='M24 44c5.2 0 9.9-2 13.5-5.2l-6.2-5.2C29.3 35.1 26.8 36 24 36c-5.3 0-9.7-3.3-11.3-7.9l-6.5 5C9.5 39.6 16.2 44 24 44z'/%3E%3Cpath fill='%231976D2' d='M43.6 20.5H42V20H24v8h11.3c-.8 2.3-2.2 4.2-4.1 5.6l6.2 5.2C36.9 39.3 44 34 44 24c0-1.3-.1-2.4-.4-3.5z'/%3E%3C/svg%3E"); }
.auth-apple-button span,
.apple-icon { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000000' d='M16.4 13.1c0-2.4 2-3.6 2.1-3.7-1.1-1.7-2.9-1.9-3.5-1.9-1.5-.2-2.9.9-3.7.9-.7 0-1.9-.9-3.1-.8-1.6 0-3.1.9-3.9 2.4-1.7 3-.4 7.3 1.2 9.7.8 1.2 1.8 2.5 3.1 2.4 1.2-.1 1.7-.8 3.2-.8s1.9.8 3.2.8c1.3 0 2.2-1.2 3-2.4.9-1.4 1.3-2.7 1.3-2.8 0-.1-2.9-1.2-2.9-3.8zM14 6c.7-.8 1.1-1.9 1-3-.9 0-2 .6-2.7 1.4-.6.7-1.1 1.9-1 2.9 1 .1 2-.5 2.7-1.3z'/%3E%3C/svg%3E"); }
.auth-apple-button:hover { background: #eee; }
.auth-divider { display: flex; align-items: center; gap: .8rem; color: var(--muted); font-size: .75rem; }
.auth-divider::before, .auth-divider::after { content: ""; height: 1px; flex: 1; background: var(--line); }
.auth-email-row { display: flex; gap: .55rem; }
.auth-email-row[hidden] { display: none; }
.auth-otp-row input { font-variant-numeric: tabular-nums; letter-spacing: .22em; text-align: center; }
.auth-email-row input { min-width: 0; flex: 1; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: 10px; outline: none; color: var(--text); background: #0f1712; }
.auth-email-row input:focus { border-color: var(--green); }
.auth-gate-status { min-height: 1.2em; font-size: .82rem; }
.auth-gate-status.is-error { padding: .7rem .8rem; border: 1px solid rgba(255, 108, 108, .55); border-radius: 9px; color: #ff9b9b; background: rgba(130, 28, 28, .18); font-weight: 700; }
.auth-gate-tools { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-top: -.45rem; color: var(--muted); font-size: .82rem; }
.auth-gate-version { font-weight: 800; letter-spacing: .08em; opacity: .78; }
.auth-diagnostics { display: grid; gap: .7rem; padding: .8rem; border: 1px solid color-mix(in srgb, var(--accent) 35%, transparent); border-radius: 12px; background: color-mix(in srgb, var(--accent) 8%, transparent); }
.auth-diagnostics[hidden] { display: none; }
.auth-diagnostics p { margin: 0; font-size: .82rem; }
.auth-diagnostics-actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.auth-diagnostics-actions button { flex: 1 1 150px; }
.auth-password-toggle { justify-self: center; border: 0; color: var(--muted); background: transparent; cursor: pointer; text-decoration: underline; }
.auth-password-panel { display: grid; gap: .6rem; }
.auth-password-panel[hidden] { display: none; }
.auth-password-panel > input { width: 100%; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: 10px; outline: none; color: var(--text); background: #0f1712; }
.auth-password-panel > input:focus { border-color: var(--green); }
.auth-password-panel > input.is-invalid { border-color: #ff7676; box-shadow: 0 0 0 2px rgba(255, 118, 118, .15); }
.auth-password-actions { display: grid; grid-template-columns: 1fr; gap: .55rem; }
.auth-code-panel { display: grid; gap: .65rem; }
.auth-code-panel > button { width: 100%; }
.auth-signup-help { padding: .8rem 1rem; border-radius: 10px; background: color-mix(in srgb, var(--green) 7%, transparent); font-size: .86rem; }
.account-password-setting { display: flex; flex-wrap: wrap; gap: .55rem; }
.account-password-setting[hidden] { display: none; }
.account-password-setting input { flex: 1 1 220px; }

button, input, textarea { font: inherit; }
button { color: inherit; }

.shell { width: 100%; margin: 0; padding: 3vh clamp(.85rem, 1.5vw, 2rem); }
.topbar { position: relative; display: flex; min-height: 92px; align-items: flex-start; justify-content: space-between; margin-bottom: .35rem; }
.topbar.timer-enabled { display: flex; min-height: 92px; align-items: flex-start; margin-bottom: .35rem; }
.topbar.timer-enabled .header-meta { justify-content: flex-end; }
.brand-block { display: flex; align-items: center; gap: 1rem; }
.brand-block .eyebrow { margin-bottom: .35rem; }
.menu-button { position: relative; display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--line); border-radius: 50%; color: var(--green); background: var(--panel-2); cursor: pointer; font-size: 1.15rem; }
.menu-button svg { width: 21px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.menu-invitation-badge { position: absolute; top: -5px; right: -5px; display: grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border: 2px solid var(--bg); border-radius: 999px; color: var(--bg); background: var(--green); font: 800 .65rem "DM Sans", sans-serif; box-shadow: 0 3px 12px rgba(0,0,0,.35); }
.eyebrow, .section-label { margin: 0 0 .55rem; color: var(--green); font-size: .72rem; font-weight: 700; letter-spacing: .18em; }
.board-section-label { display: inline-flex; align-items: center; gap: .45rem; }
.today-training-shortcut { padding: 0; border: 0; color: inherit; background: transparent; cursor: pointer; font: inherit; font-weight: inherit; letter-spacing: inherit; text-transform: inherit; }
.today-training-shortcut:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
.today-training-shortcut:focus-visible { border-radius: 3px; outline: 2px solid color-mix(in srgb, var(--green) 55%, transparent); outline-offset: 4px; }
.today-training-shortcut:active { opacity: .65; }
.new-board-shortcut { display: inline-flex; align-items: center; min-height: 28px; padding: .35rem .7rem; border: 0; border-radius: 999px; color: #fff; background: var(--green); cursor: pointer; font: 800 .72rem "DM Sans", sans-serif; letter-spacing: 0; text-transform: none; }
.new-board-shortcut:disabled { opacity: .45; cursor: default; }
.calendar-shortcut { display: inline-grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px; box-sizing: border-box; padding: 0; border: 1px solid color-mix(in srgb, var(--green) 48%, transparent); border-radius: 50%; color: var(--green); background: color-mix(in srgb, var(--green) 10%, transparent); cursor: pointer; line-height: 0; vertical-align: middle; }
.calendar-shortcut svg { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transform: translateY(.5px); }
.calendar-shortcut:hover { background: color-mix(in srgb, var(--green) 14%, transparent); }
h1 { margin: 0; font: 700 clamp(2rem, 4vw, 4.5rem)/.95 "Space Grotesk", sans-serif; letter-spacing: -.055em; }
.header-meta { display: flex; align-items: center; gap: 1rem; }
.sharing-invitation-notice { display: block; width: fit-content; max-width: calc(100% - 1rem); margin: -1vh 0 1.25rem; padding: .75rem 1rem; border: 1px solid color-mix(in srgb, var(--green) 38%, transparent); border-radius: 12px; color: var(--green); background: color-mix(in srgb, var(--green) 8%, var(--panel)); cursor: pointer; font-weight: 700; text-align: left; }
.sharing-invitation-notice:hover { background: color-mix(in srgb, var(--green) 13%, var(--panel)); }
.cast-button { width: 46px; height: 46px; padding: 11px; border: 1px solid var(--line); border-radius: 50%; background: var(--panel-2); cursor: pointer; }
.cast-button svg { width: 22px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; }
.cast-button.connected { color: var(--green); border-color: rgba(183,239,90,.4); }
.display-button svg { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.display-pairing-form { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.display-pairing-form .primary-button { grid-column: 1 / -1; }
.display-pairing-form input { min-width: 0; padding: .75rem; border: 1px solid var(--line); border-radius: 10px; color: var(--text); background: var(--panel-2); }
.display-list { display: grid; gap: .65rem; }
.display-list-item { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: start; gap: .8rem; padding: 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-2); }
.display-list-item small { display: block; color: var(--muted); }
.display-list-item > .secondary-button:last-child { grid-column: 1 / -1; justify-self: end; padding: .35rem .15rem; border-color: transparent; color: var(--muted); background: transparent; }
.display-mode-summary { display:flex; grid-column:1/-1; flex-wrap:wrap; align-items:center; gap:.25rem .55rem; padding:.85rem .9rem; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.display-mode-summary .display-mode-kicker { flex-basis:100%; color:var(--muted); font-size:.65rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.display-mode-summary .display-mode-title { color:var(--text); font-size:1.05rem; }
.display-mode-summary .display-mode-detail { padding:.22rem .5rem; border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line)); border-radius:999px; color:var(--accent); background:color-mix(in srgb,var(--accent) 8%,transparent); font-size:.72rem; font-weight:800; }
.display-mode-summary small { flex-basis:100%; margin-top:.2rem; }
.display-mode-actions { display:grid; grid-column:1/-1; gap:.7rem; }
.display-board-mode-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; padding:.55rem; border:1px solid var(--line); border-radius:14px; background:var(--panel); }
.display-mode-actions button { width:100%; min-width:0; padding:.8rem .7rem; white-space:normal; text-align:left; }
.display-mode-actions button.active { border-color:var(--accent); color:var(--accent); background:color-mix(in srgb,var(--accent) 9%,var(--panel-2)); }
.display-mode-choice { position:relative; min-height:64px; padding-right:2rem!important; border:1px solid transparent!important; border-radius:10px; font-weight:800; }
.display-mode-choice::after { content:none; }
.display-mode-choice.active { border:2px solid var(--accent)!important; color:var(--text)!important; background:rgba(76,201,240,.1)!important; box-shadow:inset 0 0 0 1px rgba(76,201,240,.18),0 0 0 1px rgba(76,201,240,.12); }
.display-option-actions { display:flex; align-items:center; justify-content:space-between; gap:.6rem; }
.display-option-actions .display-timer-toggle { flex:1; }
.display-option-actions button { width:auto; }
.gym-display-dialog { width:min(560px,calc(100vw - 1.25rem)); max-height:92vh; overflow:auto; }
.gym-display-dialog .dialog-content { gap:1rem; }
.gym-display-fieldset { display:grid; gap:.65rem; min-width:0; padding:1rem; border:1px solid var(--line); border-radius:12px; }
.gym-display-slide-config { position:relative; padding-top:1.2rem; }
.gym-display-slide-config>legend { width:100%; padding:0 .25rem; }
.gym-display-slide-config>legend>label { display:grid; grid-template-columns:22px minmax(0,1fr); align-items:start; gap:.7rem; color:var(--text); cursor:pointer; }
.gym-display-slide-config>legend input { width:18px!important; height:18px; margin:.15rem 0 0; padding:0!important; accent-color:var(--accent); }
.gym-display-slide-config>legend span { display:grid; gap:.12rem; }
.gym-display-slide-config>legend b { font-size:1rem; }
.gym-display-slide-config>legend small { color:var(--muted); font-weight:400; }
.gym-display-slide-config:has(>legend input:not(:checked))>label,.gym-display-slide-config:has(>legend input:not(:checked))>input,.gym-display-slide-config:has(>legend input:not(:checked))>textarea,.gym-display-slide-config:has(>legend input:not(:checked))>.gym-display-select-all,.gym-display-slide-config:has(>legend input:not(:checked))>.gym-display-calendars,.gym-display-slide-config:has(>legend input:not(:checked))>small { opacity:.45; }
.gym-display-fieldset textarea { min-height:90px; resize:vertical; }
.gym-display-calendars { display:grid; gap:.5rem; }
.gym-display-calendars label { display:grid; grid-template-columns:22px minmax(0,1fr); align-items:center; gap:.65rem; padding:.35rem 0; color:var(--text); }
.gym-display-calendars input { width:18px!important; height:18px; margin:0; padding:0!important; accent-color:var(--accent); }
.gym-display-select-all { display:grid!important; grid-template-columns:22px minmax(0,1fr)!important; align-items:center!important; gap:.65rem!important; padding:.45rem 0 .65rem!important; border-bottom:1px solid var(--line); color:var(--text)!important; }
.gym-display-select-all input { width:18px!important; height:18px; margin:0; padding:0!important; accent-color:var(--accent); }
.gym-display-dialog .dialog-actions { position:sticky; bottom:-.8rem; z-index:2; margin:0 -.8rem -.8rem; padding:.8rem; background:var(--panel); }
.display-timer-toggle { display: flex; align-items: center; gap: .65rem; padding: .65rem .85rem; color: var(--muted); }
.display-timer-toggle input { width: 1.1rem; height: 1.1rem; accent-color: var(--accent); }
.board-text-size-setting { display: grid; grid-template-columns: auto 100px 2.5rem; align-items: center; column-gap: .35rem; color: var(--muted); font-size: .76rem; font-weight: 700; white-space: nowrap; }
.board-text-size-setting output { color: var(--text); font-weight: 800; text-align: right; }
.board-text-size-setting input { width: 100px; margin-right: -.15rem; accent-color: var(--green); }
.view-help-dialog { width: min(720px, 92vw); max-height: 90vh; overflow: auto; }
.view-help-list { display: grid; gap: .65rem; margin: 0; padding: 0; list-style: none; }
.view-help-list li { position: relative; display: grid; grid-template-columns: 44px minmax(0,1fr); gap: .85rem; padding: .85rem; border: 1px solid var(--line); border-radius: 14px; background: var(--panel-2); }
.view-help-list li.recommended { border-color: color-mix(in srgb,var(--accent) 55%,var(--line)); background: color-mix(in srgb,var(--accent) 7%,var(--panel-2)); }
.view-help-icon { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--line); border-radius: 50%; color: var(--accent); background: var(--panel); }
.view-help-display-modes { margin-top:.85rem; padding-top:.8rem; border-top:1px solid var(--line); }
.view-help-display-modes>strong { display:block; margin-bottom:.55rem; font-size:.8rem; }
.view-help-mode-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.45rem; }
.view-help-mode-grid>div { display:grid; grid-template-columns:28px minmax(0,1fr); gap:.5rem; padding:.55rem; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.view-help-mode-grid i { display:grid; place-items:center; width:28px; height:28px; border-radius:8px; color:var(--accent); background:color-mix(in srgb,var(--accent) 9%,transparent); font-style:normal; font-weight:900; }
.view-help-mode-grid b,.view-help-mode-grid small { display:block; }
.view-help-mode-grid small { margin-top:.12rem; color:var(--muted); font-size:.68rem; line-height:1.3; }
.view-help-active-note { margin:.55rem 0 0!important; color:var(--muted); font-size:.7rem!important; }
@media(max-width:560px){.view-help-mode-grid{grid-template-columns:1fr}}
.view-help-icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.view-help-copy > strong,.view-help-title-row > strong { display: block; color: var(--text); font-size: 1rem; }
.view-help-title-row { display: flex; align-items: center; gap: .55rem; }
.view-help-title-row b { padding: .18rem .42rem; border-radius: 999px; color: var(--background); background: var(--accent); font-size: .58rem; letter-spacing: .08em; }
.view-help-category { display: block; margin-top: .1rem; color: var(--accent); font-size: .76rem; font-weight: 800; }
.view-help-copy p { margin: .35rem 0; color: var(--muted); font-size: .84rem; line-height: 1.35; }
.view-help-copy small { display: block; color: var(--muted); font-size: .78rem; line-height: 1.35; }
.view-help-copy small strong { color: var(--text); }
@media(max-width:700px){.view-help-dialog{max-height:94vh}.view-help-list{gap:.5rem}.view-help-list li{grid-template-columns:38px minmax(0,1fr);gap:.7rem;padding:.7rem}.view-help-icon{width:38px;height:38px}.view-help-icon svg{width:20px;height:20px}.view-help-copy p{margin:.25rem 0}.view-help-dialog .dialog-content{gap:.8rem}}
.display-board-picker-dialog { width: min(900px,calc(100vw - 2rem)); }
.display-picker-calendar-label { display: grid; gap: .35rem; color: var(--muted); font-weight: 700; }
.display-board-picker-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; max-height: min(55vh,560px); overflow: auto; }
.display-board-picker-card { display: grid; gap: .4rem; padding: 1rem; border: 1px solid var(--line); border-radius: 14px; color: var(--text); background: var(--panel-2); text-align: left; cursor: pointer; }
.display-board-picker-card:hover,.display-board-picker-card.active { border-color: var(--accent); }
.display-board-picker-card strong { font-size: 1.05rem; }
.display-board-picker-card span,.display-board-picker-card small { color: var(--muted); }
.display-board-picker-card .display-board-preview { color: var(--accent); }
.display-sync-state { display: inline-flex; align-items: center; gap: .45rem; color: var(--accent); font-weight: 700; white-space: nowrap; }
.display-sync-state::before { width: .55rem; height: .55rem; border-radius: 50%; background: var(--accent); content: ""; box-shadow: 0 0 0 .2rem color-mix(in srgb,var(--accent) 15%,transparent); }
@media(max-width:700px){.display-pairing-form{grid-template-columns:1fr}.display-board-picker-grid{grid-template-columns:1fr}}
@media(max-width:700px){.board-text-size-setting{display:none}.sessions-board .session-title,.sessions-board .exercise-name,.sessions-board .exercise-detail,.sessions-board .exercise-minute{zoom:1}}
.clock { display: grid; text-align: right; }
.clock strong { color: var(--clock); font: 600 clamp(1.7rem, 3vw, 3rem)/1 "Space Grotesk", sans-serif; }
.clock span { margin-top: .35rem; color: var(--muted); font-size: .82rem; text-transform: capitalize; }
.gym-timer { position: absolute; z-index: 5; top: 0; left: 50%; display: grid; grid-template-columns: auto auto auto; align-items: center; gap: .55rem; box-sizing: border-box; max-width: calc(100% - 640px); padding: .3rem .65rem; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); box-shadow: 0 14px 40px rgba(0,0,0,.22); transform: translateX(-50%); }
.gym-timer-config { display: grid; grid-template-columns: repeat(3, auto); gap: .2rem; }
.gym-timer-config select, .gym-timer-config label { min-height: 29px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: var(--panel-2); font-size: .72rem; }
.gym-timer-interval:not([hidden]) { display: flex; gap: .2rem; }
.gym-timer-interval label { min-width: 66px; }
.gym-timer-config select { grid-column: 1 / -1; padding: .2rem .35rem; outline: none; }
.gym-timer-config label { display: flex; align-items: center; gap: .15rem; padding: 0 .3rem; }
.gym-timer-config input[type="number"] { width: 44px; padding: 0; border: 0; outline: none; color: var(--text); background: transparent; text-align: right; font-weight: 700; }
.gym-timer-prep input { accent-color: var(--green); }
.gym-timer-readout { display: grid; min-width: 230px; text-align: center; }
.gym-timer-readout span { color: var(--green); font-size: .75rem; font-weight: 800; letter-spacing: .12em; }
.gym-timer-readout strong { font: 700 clamp(3.5rem, 4.4vw, 4.75rem)/.86 "Space Grotesk", sans-serif; font-variant-numeric: tabular-nums; }
.gym-timer-actions { display: grid; gap: .25rem; }
.gym-timer-actions button { min-width: 74px; padding: .35rem .6rem; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--panel-2); cursor: pointer; font-size: .75rem; font-weight: 700; }
.gym-timer-actions button:first-child { border-color: color-mix(in srgb, var(--green) 42%, transparent); color: var(--green); }
.gym-timer.is-prep .gym-timer-readout strong { color: var(--green); }
.gym-timer.is-rest .gym-timer-readout strong { color: var(--muted); }
.gym-timer.is-finished { border-color: color-mix(in srgb, var(--green) 55%, transparent); }

.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; align-items: start; gap: 1.25rem; }
.dashboard-grid.spotify-disabled { grid-template-columns: minmax(0, 1fr); }
.side-column { display: grid; align-content: start; gap: 1.25rem; }
.side-column[hidden] { display: none !important; }
.card { border: 1px solid var(--line); border-radius: 24px; background: var(--panel); box-shadow: 0 22px 70px rgba(0,0,0,.2); }
.workout-card { min-height: 66vh; padding: clamp(1.3rem, 3vw, 2.4rem); }
.workout-board { min-width: 0; }
.board-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.board-heading h2 { margin: 0; font: 600 clamp(1.8rem, 3vw, 3rem)/1 "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.dashboard-title { display: block; width: min(680px, 70vw); border: 0; padding: 0; color: var(--text); background: transparent; outline: none; font: 600 clamp(1.8rem, 3vw, 3rem)/1 "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.dashboard-title.is-bold,
.session-title.is-bold { font-weight: 800; }
.dashboard-title.is-regular,
.session-title.is-regular { font-weight: 400; }
.active-dashboard-date { margin: .35rem 0 0; color: var(--muted); font-size: .78rem; text-transform: capitalize; }
.board-calendar-switch { position: relative; display: inline-flex; align-items: center; gap: .45rem; margin-top: .45rem; color: var(--muted); font-size: .76rem; }
.board-calendar-switch span { color: var(--green); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.board-calendar-select-button { display: flex; align-items: center; justify-content: space-between; gap: .8rem; min-width: 170px; min-height: 34px; max-width: min(320px, 70vw); padding: .35rem .55rem .35rem .65rem; border: 1px solid var(--line); border-radius: 9px; color: var(--text); background: var(--panel-2); cursor: pointer; font: 700 .78rem "DM Sans", sans-serif; text-align: left; }
.board-calendar-select-button > span { overflow: hidden; color: inherit; letter-spacing: normal; text-overflow: ellipsis; text-transform: none; white-space: nowrap; }
.board-calendar-select-button > b { color: var(--green); font-size: 1rem; transition: transform .15s ease; }
.board-calendar-select-button[aria-expanded="true"] > b { transform: rotate(180deg); }
.board-calendar-select-button.active { border-color: color-mix(in srgb, var(--green) 44%, transparent); background: color-mix(in srgb, var(--green) 12%, var(--panel-2)); }
.board-calendar-filter-panel { position: absolute; z-index: 30; top: calc(100% + .4rem); left: 5.7rem; display: grid; gap: .35rem; min-width: min(330px, calc(100vw - 2rem)); max-height: 340px; overflow: auto; padding: .65rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); box-shadow: 0 20px 70px rgba(0,0,0,.34); }
.board-calendar-filter-all { position: sticky; z-index: 2; top: -.65rem; margin: -.65rem -.65rem 0; padding: .65rem .65rem .45rem; border-bottom: 1px solid var(--line); color: var(--green) !important; background: var(--panel); font-weight: 800; }
.board-calendar-filter-panel label { display: flex; align-items: center; gap: .45rem; min-height: 32px; color: var(--text); font-size: .82rem; }
.board-calendar-filter-panel input { accent-color: var(--green); }
.board-calendar-filter-option { display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: center; gap: .35rem; min-height: 32px; }
.board-calendar-filter-option > span { overflow: hidden; padding: .3rem .2rem; color: var(--text) !important; cursor: pointer; font: 700 .78rem "DM Sans", sans-serif; letter-spacing: normal; text-overflow: ellipsis; text-transform: none; white-space: nowrap; }
.board-calendar-filter-option.current > span { color: var(--green) !important; }
.new-board-calendar-dialog { width: min(480px, calc(100vw - 2rem)); }
.new-board-calendar-field { display: grid; gap: .45rem; color: var(--muted); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.new-board-calendar-field select { width: 100%; min-height: 48px; padding: 0 .8rem; border: 1px solid var(--line); border-radius: 10px; color: var(--text); background: var(--panel-2); font: 700 .95rem "DM Sans", sans-serif; text-transform: none; }
.new-board-calendar-field input { width: 100%; min-height: 48px; padding: 0 .8rem; border: 1px solid var(--line); border-radius: 10px; color: var(--text); background: var(--panel-2); font: 700 .95rem "DM Sans", sans-serif; text-transform: none; }
.new-board-create-calendar-form { display: grid; gap: .7rem; padding: .85rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-2); }
.new-board-create-calendar-form[hidden] { display: none; }
.new-board-create-calendar-form .dialog-actions { margin: 0; }
.new-board-create-calendar-form .dialog-feedback { min-height: 1.2em; margin: 0; color: var(--danger); font-size: .78rem; }
.new-board-calendar-actions { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.new-board-calendar-actions > .text-button { color: var(--green); white-space: nowrap; }
@media (max-width: 560px) { .new-board-calendar-actions { align-items: stretch; flex-direction: column; } .new-board-calendar-actions > .text-button { text-align: left; } }
.board-actions { display: flex; align-items: center; gap: .65rem; }
#deleteDashboardButton { order: 99; margin-left: auto; }
.sessions-board { --exercise-font-size: clamp(.95rem, 4cqi, 1.15rem); display: grid; grid-template-columns: repeat(var(--session-count, 1), minmax(0, 1fr)); align-items: stretch; gap: 1.25rem; }
.sessions-board .session-title,
.sessions-board .exercise-name,
.sessions-board .exercise-detail,
.sessions-board .exercise-minute { zoom: var(--board-text-scale, 1); }
.sessions-board.main-calendar-empty { display: block; }
.main-calendar-empty-state { display: grid; place-items: center; min-height: 280px; padding: 2rem; border: 1px dashed var(--line); border-radius: 18px; color: var(--muted); text-align: center; }
.main-calendar-empty-state strong { color: var(--text); font: 600 clamp(1.35rem, 3vw, 2rem) "Space Grotesk", sans-serif; }
.main-calendar-empty-state p { max-width: 460px; margin: .45rem 0 0; }
.sessions-board.has-verbose-content { --exercise-font-size: clamp(.86rem, 3.4cqi, 1rem); }
.sessions-board.has-extreme-content { --exercise-font-size: clamp(.78rem, 3cqi, .92rem); }
.session-card { position: relative; container-type: inline-size; display: flex; flex-direction: column; min-width: 0; height: 100%; padding: clamp(1.15rem, 2vw, 1.65rem); }
.session-heading { display: flex; flex-direction: column; align-items: stretch; gap: .45rem; }
.session-heading-actions { position: relative; display: flex; flex: 0 0 auto; align-items: center; justify-content: flex-end; gap: .2rem; }
.session-order { position: absolute; top: clamp(.85rem, 1.5vw, 1.15rem); right: clamp(.85rem, 1.5vw, 1.15rem); display: grid; place-items: center; min-width: 28px; height: 28px; padding: 0 .45rem; border: 1px solid rgba(183,239,90,.24); border-radius: 999px; color: var(--green); background: rgba(183,239,90,.055); font: 700 .72rem "Space Grotesk", sans-serif; }
.session-heading-actions button { display: grid; place-items: center; width: 28px; height: 28px; padding: 0; border: 0; background: transparent; }
.session-heading-actions button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.undo-session-button,
.redo-session-button,
.session-note-toggle,
.save-session-template-button,
.session-lock-button { border-radius: 6px !important; color: #68756e; cursor: pointer; font-size: 1rem; line-height: 1; }
.undo-session-button:hover:not(:disabled),
.redo-session-button:hover:not(:disabled),
.session-note-toggle:hover:not(:disabled),
.save-session-template-button:hover:not(:disabled),
.session-lock-button:hover:not(:disabled),
.session-note-toggle.active,
.session-lock-button.active { color: var(--green); background: rgba(183,239,90,.07) !important; }
.session-note-toggle { position: relative; }
.session-card.has-session-notes .session-note-toggle { color: var(--green); background: rgba(183,239,90,.055) !important; }
.session-note-toggle.active { outline: 1px solid color-mix(in srgb, var(--green) 36%, transparent); outline-offset: -1px; }
.session-note-toggle.active svg { fill: color-mix(in srgb, var(--green) 13%, transparent); }
.session-lock-button .lock-closed { display: none; }
.session-lock-button.active .lock-open { display: none; }
.session-lock-button.active .lock-closed { display: block; fill: currentColor; stroke: currentColor; }
.session-card.has-session-notes:not(.has-open-notes) .session-note-toggle::after { content: ""; position: absolute; top: 3px; right: 3px; width: 8px; height: 8px; border: 2px solid var(--panel); border-radius: 999px; background: var(--green); box-shadow: 0 0 0 1px rgba(183,239,90,.22); }
.undo-session-button:disabled,
.redo-session-button:disabled,
.save-session-template-button:disabled,
.drag-handle:disabled,
.delete-session-button:disabled { opacity: .28; cursor: default; }
.drag-handle { border-radius: 6px !important; color: #77847d; cursor: grab; font-size: 1.05rem; touch-action: none; }
.drag-handle svg { width: 18px; height: 18px; fill: currentColor; stroke: none; }
.drag-handle:hover { color: var(--green); background: rgba(183,239,90,.07) !important; }
.drag-handle:active { cursor: grabbing; }
.session-type { width: fit-content; max-width: calc(100% - 2.45rem); border: 1px solid rgba(183,239,90,.24); border-radius: 999px; padding: .45rem .75rem; color: var(--green); background: rgba(183,239,90,.06); outline: none; font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.session-type:disabled { opacity: 1; border-color: rgba(183,239,90,.24); color: var(--green); background: rgba(183,239,90,.06); -webkit-text-fill-color: var(--green); cursor: default; }
.session-type option { color: var(--text); background: #17211b; }
.delete-session-button { border: 0; color: #68756e; background: transparent; cursor: pointer; }
.delete-session-button:hover { color: #ff8c8c; }
.session-card.sortable-ghost { opacity: .25; }
.session-card.sortable-drag { border-color: rgba(183,239,90,.55); box-shadow: 0 28px 80px rgba(0,0,0,.45); }
.session-title { display: block; width: 100%; min-height: 1.2em; margin: .75rem 0 .85rem; overflow: hidden; resize: none; border: 0; color: var(--text); background: transparent; outline: none; font: 400 clamp(1.7rem, 7cqi, 3.4rem)/1.02 "Space Grotesk", sans-serif; letter-spacing: 0; }
.session-title:read-only,
.session-title:disabled { opacity: 1; color: var(--text); -webkit-text-fill-color: var(--text); }
.session-title.text-medium { font-size: clamp(1.45rem, 5.4cqi, 2.7rem); }
.session-title.text-long { font-size: clamp(1.15rem, 4.2cqi, 2rem); line-height: 1.12; }
.sessions-board.has-medium-titles .session-title,
.sessions-board.has-medium-titles .session-title.text-medium,
.sessions-board.has-medium-titles .session-title.text-long { min-height: 1.35em; font-size: clamp(1.45rem, 5.4cqi, 2.7rem); line-height: 1.08; }
.sessions-board.has-long-titles .session-title,
.sessions-board.has-long-titles .session-title.text-medium,
.sessions-board.has-long-titles .session-title.text-long { min-height: 1.7em; font-size: clamp(1.15rem, 4.2cqi, 2rem); line-height: 1.12; }
.session-notes { width: 100%; min-height: 220px; margin: -.5rem 0 1rem; padding: 1rem 1.05rem; resize: vertical; border: 1px dashed color-mix(in srgb, var(--green) 26%, var(--line)); border-radius: 12px; outline: none; color: var(--text); background: color-mix(in srgb, var(--green) 5%, transparent); font: 500 .95rem/1.45 "DM Sans", sans-serif; }
.session-notes:focus { border-color: color-mix(in srgb, var(--green) 52%, transparent); }
.linked-text { white-space: pre-wrap; }
.exercise-name a, .exercise-detail a, .session-notes a { color: var(--green); text-decoration: underline; text-underline-offset: .16em; overflow-wrap: anywhere; }
.exercise-name a:hover, .exercise-detail a:hover, .session-notes a:hover { color: color-mix(in srgb, var(--green) 76%, #fff); }
.emom-options { align-items: center; justify-content: space-between; gap: .75rem; margin: -.35rem 0 1rem; padding: .7rem .8rem; border: 1px solid rgba(183,239,90,.14); border-radius: 12px; background: rgba(183,239,90,.035); }
.emom-options:not([hidden]) { display: flex; }
.emom-options label { display: flex; align-items: center; gap: .55rem; color: var(--muted); font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.duration-control { display: flex; align-items: center; gap: .3rem; color: var(--green); }
.emom-duration { width: 48px; border: 0; border-bottom: 1px solid rgba(183,239,90,.35); color: var(--green); background: transparent; outline: none; text-align: right; font-weight: 700; }
.emom-options p { margin: 0; color: var(--muted); font-size: .68rem; text-align: right; }
.exercise-minute { display: none; color: var(--green); font-family: "Space Grotesk", sans-serif; font-size: var(--exercise-font-size); font-weight: 600; line-height: 1.3; letter-spacing: 0; text-align: center; }
.session-card.is-emom .exercise-row { grid-template-columns: max-content minmax(0, 1fr) auto; column-gap: .35rem; }
.session-card.is-emom .exercise-minute { display: block; }
.session-card.is-emom .exercise-minute { grid-column: 1; grid-row: 1; align-self: baseline; padding: 0; text-align: right; }
.session-card.is-emom .exercise-name { grid-column: 2; }
.session-card.is-emom .exercise-row:has(.exercise-name.text-medium) .exercise-minute,
.session-card.is-emom .exercise-row:has(.exercise-name.text-long) .exercise-minute { font-size: var(--exercise-font-size); }
.session-card.is-emom .exercise-detail { grid-column: 2; }
.session-card.is-emom .exercise-actions { grid-column: 3; }
.session-exercises { display: grid; flex: 1 1 auto; grid-template-columns: repeat(var(--exercise-columns, 1), minmax(0, 1fr)); grid-auto-rows: minmax(78px, auto); gap: .55rem; margin-bottom: .75rem; align-content: start; }
.session-exercises:has(.exercise-row:only-child) { grid-template-rows: minmax(0, 1fr); }
.session-exercises:has(.exercise-row:only-child) .exercise-row { min-height: 100%; align-content: start; }
.session-card.is-multi-column .session-exercises { align-items: stretch; column-gap: .45rem; }
.session-card.is-multi-column .emom-options { max-width: 50%; }
.session-card .exercise-row { grid-template-columns: minmax(0, 1fr) auto; min-height: 78px; gap: .2rem .65rem; padding: .55rem .65rem; }
.session-card .exercise-name,
.session-card .exercise-name.text-medium,
.session-card .exercise-name.text-long,
.session-card .exercise-detail,
.session-card .exercise-detail.text-medium,
.session-card .exercise-detail.text-long { font-size: var(--exercise-font-size); }
.session-card .exercise-detail { min-width: 0; }
.session-card > .add-session-exercise { margin-top: auto; flex: 0 0 auto; }
.sessions-board.is-dense { gap: .75rem; }
.sessions-board.is-dense .session-card { padding: 1rem; border-radius: 18px; }
.sessions-board.is-dense .session-title { margin: .75rem 0 .9rem; font-size: clamp(1.15rem, 4.2cqi, 2rem); }
.sessions-board.is-dense .exercise-row { grid-template-columns: minmax(0, 1fr) auto; gap: .4rem; min-height: 51px; padding: .35rem .4rem; }
.sessions-board.is-dense .session-card.is-emom .exercise-row { grid-template-columns: max-content minmax(0, 1fr) auto; column-gap: .3rem; }
.sessions-board.is-dense .session-card.is-emom .exercise-detail { grid-column: 2; }
.sessions-board.is-dense .session-card.is-emom .exercise-actions { grid-column: 3; }
.sessions-board.is-dense .exercise-detail { grid-column: 1; text-align: left; min-width: 0; font-size: .72rem; }
.sessions-board.is-dense .exercise-actions { grid-column: 2; grid-row: 1 / span 2; }
.sessions-board.is-compact { gap: .5rem; }
.sessions-board.is-compact .session-card { padding: .7rem; border-radius: 15px; }
.sessions-board.is-compact .session-type { max-width: calc(100% - 24px); padding: .35rem .5rem; font-size: .6rem; }
.sessions-board.is-compact .session-title { margin: .55rem 0 .7rem; font-size: clamp(1rem, 3.6cqi, 1.55rem); }
.sessions-board.is-compact .exercise-row { min-height: 45px; }
.sessions-board.is-compact .check-button { width: 31px; height: 31px; }
.sessions-board.is-compact .add-button { padding: .7rem .35rem; font-size: .72rem; }
.session-card.has-long-list { padding-top: .75rem; padding-bottom: .75rem; }
.session-card.has-long-list .session-title { margin: .45rem 0 .55rem; }
.session-card.has-long-list .emom-options { margin: -.1rem 0 .5rem; padding: .4rem .5rem; }
.session-card.has-long-list .emom-options p { display: none; }
.session-card.has-long-list .session-exercises { gap: .28rem; margin-bottom: .45rem; }
.session-card.has-long-list .exercise-row,
.sessions-board.is-dense .session-card.has-long-list .exercise-row { min-height: 78px; padding: .55rem .65rem; border-radius: 10px; }
.session-card.has-long-list .check-button { width: 27px; height: 27px; }
.session-card.has-long-list .exercise-name,
.session-card.has-long-list .exercise-detail { font-size: var(--exercise-font-size); }
.session-card.has-long-list .add-button { padding: .5rem; }
.session-card.has-very-long-list { padding: .55rem; }
.session-card.has-very-long-list .session-heading { min-height: 25px; }
.session-card.has-very-long-list .session-title { margin: .25rem 0 .35rem; font-size: clamp(.9rem, 3.2cqi, 1.3rem); }
.session-card.has-very-long-list .emom-options { padding: .25rem .4rem; }
.session-card.has-very-long-list .session-exercises { gap: .18rem; }
.session-card.has-very-long-list .exercise-row,
.sessions-board.is-dense .session-card.has-very-long-list .exercise-row { min-height: 68px; padding: .42rem .52rem; }
.session-card.has-very-long-list .check-button { width: 23px; height: 23px; }
.session-card.has-very-long-list .exercise-name,
.session-card.has-very-long-list .exercise-detail { font-size: var(--exercise-font-size); }
.session-card.has-very-long-list .add-button { padding: .35rem; font-size: .62rem; }
.session-card.has-extreme-list .emom-options { margin-bottom: .25rem; }
.session-card.has-extreme-list .session-exercises { gap: .1rem; }
.session-card.has-extreme-list .exercise-row,
.sessions-board.is-dense .session-card.has-extreme-list .exercise-row { min-height: 58px; padding: .35rem .45rem; }
.session-card.has-extreme-list .check-button { width: 19px; height: 19px; }
.session-card.has-extreme-list .exercise-name,
.session-card.has-extreme-list .exercise-detail { font-size: var(--exercise-font-size); }
.session-card.has-extreme-list .add-button { padding: .22rem; }
.card-heading, .spotify-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.title-input { width: 100%; border: 0; padding: 0; color: var(--text); background: transparent; outline: none; font: 600 clamp(1.8rem, 3vw, 3rem)/1.1 "Space Grotesk", sans-serif; letter-spacing: -.04em; }
.title-input:focus { box-shadow: 0 2px var(--green); }
.text-button, .secondary-button { border: 0; background: transparent; color: var(--muted); cursor: pointer; }
.text-button:hover { color: var(--text); }

.exercise-list { display: grid; gap: .7rem; margin: 2rem 0 1rem; }
.exercise-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .25rem .85rem; min-height: 68px; padding: .55rem .7rem; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.025); transition: opacity .2s, border .2s, transform .2s; }
.exercise-row:focus-within { border-color: rgba(183,239,90,.35); }
.exercise-row.completed { opacity: .5; }
.exercise-row.completed .exercise-name { text-decoration: line-through; }
.exercise-row.removing { opacity: 0; transform: translateX(12px); }
.exercise-row [contenteditable] { width: 100%; min-width: 0; overflow-wrap: anywhere; border: 0; outline: none; background: transparent; color: var(--text); font-family: "Space Grotesk", sans-serif; font-style: normal; font-variant: normal; font-synthesis: none; line-height: 1.25; white-space: pre-wrap; }
.exercise-row [contenteditable] * { font-family: inherit !important; font-size: inherit !important; font-style: inherit !important; letter-spacing: inherit !important; }
.exercise-row [contenteditable] [data-accent="true"],
.exercise-row [contenteditable] .accent-text-inline,
.exercise-row [contenteditable] span[style*="rgb(1, 2, 3)"],
.exercise-row [contenteditable] font[color="#010203"] { color: var(--green) !important; }
.exercise-row [contenteditable] span[style*="rgb(2, 3, 4)"],
.exercise-row [contenteditable] font[color="#020304"] { color: var(--text) !important; }
.exercise-row [contenteditable][data-placeholder]:empty::before { content: attr(data-placeholder); color: #68756e; pointer-events: none; }
.exercise-name { font-family: "Space Grotesk", sans-serif; font-weight: 600; font-size: clamp(1rem, 1.5vw, 1.25rem); }
.exercise-detail { display: none; }
.exercise-detail.text-medium { font-size: .74rem; }
.exercise-detail.text-long { font-size: .68rem; }
.exercise-actions { grid-column: 2; grid-row: 1; display: grid; align-content: center; gap: .15rem; }
.exercise-actions button { width: 25px; height: 25px; padding: 0; border: 0; color: #68756e; background: transparent; cursor: pointer; }
.exercise-actions .bold-button { border-radius: 5px; font-family: serif; font-size: .75rem; }
.exercise-actions .bold-button:hover, .exercise-actions .bold-button.active { color: var(--green); background: rgba(183,239,90,.08); }
.exercise-actions .color-button { border-radius: 5px; font-size: .72rem; }
.exercise-actions .color-button:hover, .exercise-actions .color-button.active { color: var(--green); background: color-mix(in srgb, var(--green) 10%, transparent); }
.exercise-actions .delete-button { grid-column: auto; grid-row: auto; }
.check-button { width: 39px; height: 39px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; background: transparent; cursor: pointer; }
.check-button span { opacity: 0; }
.completed .check-button { border-color: var(--green); color: #13200e; background: var(--green); }
.completed .check-button span { opacity: 1; }
.delete-button { border: 0; background: transparent; color: #68756e; font-size: 1.6rem; cursor: pointer; }
.delete-button:hover { color: #ff8c8c; }
.add-button { width: 100%; padding: 1rem; border: 1px dashed rgba(183,239,90,.26); border-radius: 15px; color: var(--green); background: rgba(183,239,90,.035); font-weight: 600; cursor: pointer; }
.add-button span { margin-right: .4rem; font-size: 1.25rem; }

.origin-transfer-notice { position: fixed; z-index: 1000; left: 50%; bottom: 1.25rem; display: flex; align-items: center; gap: 1rem; width: min(760px, calc(100vw - 2rem)); padding: .9rem 1rem; border: 1px solid rgba(183,239,90,.35); border-radius: 14px; background: #17231c; box-shadow: 0 18px 55px rgba(0,0,0,.5); transform: translateX(-50%); }
.origin-transfer-notice span { flex: 1; color: var(--muted); font-size: .88rem; }
.origin-transfer-notice strong { color: var(--text); }
.origin-transfer-notice.success { justify-content: center; border-color: rgba(30,215,96,.45); }
.app-version { position: fixed; z-index: 1200; left: 50%; bottom: .55rem; color: rgba(146,160,153,.65); font: 600 .68rem "Space Grotesk", sans-serif; letter-spacing: .08em; pointer-events: none; transform: translateX(-50%); }

.spotify-card { padding: 1.4rem; }
.spotify-logo { display: flex; align-items: center; gap: .6rem; font: 700 1.15rem "Space Grotesk", sans-serif; }
.spotify-logo svg { width: 28px; fill: var(--spotify); }
.icon-button { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--line); border-radius: 50%; background: var(--panel-2); cursor: pointer; }
.icon-button.small { width: 34px; height: 34px; }
.icon-button svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.spotify-frame-wrap { margin-top: 1.2rem; overflow: hidden; border-radius: 14px; background: #121212; }
.spotify-frame-wrap iframe { display: block; width: 100%; height: 152px; border: 0; }
.queue-preview { margin-top: .9rem; padding: .85rem; border-radius: 13px; background: rgba(255,255,255,.025); }
.queue-preview .section-label { margin-bottom: .55rem; font-size: .58rem; }
.queue-items { display: grid; gap: .45rem; }
.queue-item { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: .65rem; min-width: 0; }
.queue-item img { width: 42px; height: 42px; border-radius: 6px; object-fit: cover; }
.queue-item-copy { min-width: 0; }
.queue-item strong, .queue-item span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.queue-item strong { font-size: .78rem; }
.queue-item span { margin-top: .15rem; color: var(--muted); font-size: .68rem; }
.queue-empty { margin: 0; color: var(--muted); font-size: .75rem; }
.now-playing { margin-top: 1.2rem; min-height: 132px; overflow: hidden; border-radius: 16px; background: #101713; }
.now-playing-placeholder { display: grid; place-items: center; align-content: center; gap: .8rem; min-height: 132px; padding: 1rem; text-align: center; }
.now-playing-placeholder p { margin: 0; color: var(--muted); font-size: .86rem; }
.now-playing-placeholder .primary-button { padding: .65rem .9rem; font-size: .8rem; }
.now-playing-content { grid-template-columns: 132px minmax(0, 1fr); min-height: 132px; }
.now-playing-content:not([hidden]) { display: grid; }
.now-playing-content img { width: 132px; height: 132px; object-fit: cover; }
.now-playing-copy { min-width: 0; padding: 1rem; align-self: center; }
.playing-state { margin: 0 0 .35rem; color: var(--spotify); font-size: .65rem; font-weight: 700; letter-spacing: .13em; }
.now-playing-copy h2 { overflow: hidden; margin: 0; font: 600 1.18rem/1.2 "Space Grotesk", sans-serif; text-overflow: ellipsis; white-space: nowrap; }
.now-playing-copy > p:not(.playing-state) { overflow: hidden; margin: .3rem 0 0; color: var(--muted); font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.now-playing-copy .playing-device { color: #6f7e76 !important; font-size: .7rem !important; }
.track-progress { height: 4px; margin-top: .7rem; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.1); }
.track-progress div { width: 0; height: 100%; border-radius: inherit; background: var(--spotify); transition: width 1s linear; }
.playback-controls { display: flex; align-items: center; justify-content: center; gap: .55rem; margin-top: .7rem; }
.playback-controls button { display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid var(--line); border-radius: 50%; color: var(--text); background: rgba(255,255,255,.04); cursor: pointer; }
.playback-controls button:hover { border-color: rgba(30,215,96,.5); }
.playback-controls .playback-primary { width: 38px; height: 38px; border: 0; color: #0b100d; background: var(--spotify); font-size: 1rem; font-weight: 900; line-height: 1; }
.playback-controls button:disabled { opacity: .4; cursor: wait; }
.connect-tip { display: flex; align-items: center; gap: .7rem; margin-top: 1rem; color: var(--muted); font-size: .8rem; }
.connect-tip p { margin: 0; }
.dashboard-playback-button { margin-left: auto; padding: .5rem .65rem; border: 1px solid rgba(30,215,96,.3); border-radius: 8px; color: var(--spotify); background: rgba(30,215,96,.06); cursor: pointer; font-size: .7rem; font-weight: 700; white-space: nowrap; }
.pulse-dot { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: var(--spotify); box-shadow: 0 0 0 5px rgba(30,215,96,.1); }
.progress-card { padding: 1.4rem; }
.progress-copy { margin: 0; color: var(--muted); }
.progress-copy strong { color: var(--text); font-size: 1.4rem; }
.progress-track { height: 8px; margin-top: 1.2rem; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.08); }
.progress-bar { height: 100%; width: 0; border-radius: inherit; background: var(--green); transition: width .35s ease; }
.jam-card { display: grid; grid-template-columns: minmax(0, 1fr) 132px; align-items: center; gap: 1.2rem; padding: 1.4rem; }
.jam-copy h2 { margin: 0; font: 600 1.55rem "Space Grotesk", sans-serif; }
.jam-copy > p:not(.section-label) { margin: .55rem 0 1rem; color: var(--muted); font-size: .83rem; line-height: 1.45; }
.jam-copy .primary-button { padding: .65rem .8rem; font-size: .78rem; }
.jam-actions { display: flex; flex-wrap: wrap; gap: .45rem; }
.jam-actions .secondary-button { padding: .65rem .8rem; border: 1px solid var(--line); font-size: .78rem; }
.jam-qr { display: grid; place-items: center; width: 132px; height: 132px; padding: 9px; border-radius: 13px; color: #65726b; background: rgba(255,255,255,.05); font: 700 1.2rem "Space Grotesk", sans-serif; }
.jam-qr.active { background: #fff; }
.jam-qr img, .jam-qr canvas { width: 114px !important; height: 114px !important; }
.optional { color: #647169; font-weight: 400; }

dialog { width: min(500px, 90vw); border: 1px solid var(--line); border-radius: 22px; color: var(--text); background: #17211b; box-shadow: 0 30px 100px #000; }
dialog:not(#legalConsentDialog) { position:relative; }
dialog::backdrop { background: rgba(3,7,5,.75); backdrop-filter: blur(5px); }
#spotifyDialog { width: min(1040px, 96vw); max-height: none; overflow: visible; }
#spotifyForm { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
#spotifyForm > div:first-child,
#spotifyForm > .dialog-actions,
#spotifyForm > #spotifyError,
#spotifyForm > #languageSelect { grid-column: 1 / -1; }
.dialog-content { display: grid; gap: 1.4rem; padding: .8rem; }
.display-dialog .dialog-content { position:relative; }
.display-dialog-heading { padding-right:2.5rem; }
.dialog-close-icon { position:absolute; z-index:20; top:.7rem; right:.7rem; display:grid; place-items:center; width:36px; height:36px; padding:0; border:1px solid var(--line); border-radius:50%; color:var(--muted); background:var(--panel-2); cursor:pointer; font-size:1.45rem; line-height:1; }
.dialog-close-icon:hover { border-color:var(--accent); color:var(--text); }
.dialog-content h2 { margin: 0; font: 600 1.8rem "Space Grotesk", sans-serif; }
.dialog-help { margin: .5rem 0 0; color: var(--muted); }
.dialog-content label { display: grid; gap: .5rem; color: var(--muted); font-size: .85rem; font-weight: 600; }
.dialog-content input, .dialog-content select { padding: .9rem 1rem; border: 1px solid var(--line); border-radius: 10px; outline: none; color: var(--text); background: #0f1712; }
.dialog-content label > small { color: var(--muted); font-weight: 400; }
.dialog-content input:focus, .dialog-content select:focus { border-color: var(--green); }
.dialog-content .toggle-setting { display: flex; grid-template-columns: none; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1rem; border: 1px solid var(--line); border-radius: 12px; background: #0f1712; }
.toggle-setting span { display: grid; gap: .2rem; }
.toggle-setting strong { color: var(--text); font-size: .9rem; }
.toggle-setting small { color: var(--muted); font-weight: 400; }
.dialog-content .toggle-setting input { width: 42px; height: 23px; flex: 0 0 auto; accent-color: var(--green); cursor: pointer; }
.account-setting { display: grid; gap: .9rem; padding: 1rem; border: 1px solid var(--line); border-radius: 13px; background: rgba(255,255,255,.025); }
.account-setting > div:first-child { display: grid; gap: .2rem; }
.account-setting strong { color: var(--text); }
.account-setting small { color: var(--muted); }
.account-actions { display: flex; align-items: center; gap: .5rem; }
.account-actions input { min-width: 0; flex: 1; }
.account-actions button { white-space: nowrap; }
.coach-account-heading { display: flex !important; grid-template-columns: none !important; align-items: center; gap: .75rem !important; }
.coach-account-heading > div { display: grid; min-width: 0; gap: .2rem; }
.coach-account-heading strong,
.coach-account-heading small { display: block; }
.coach-status-icon { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 38px; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); background: var(--panel-2); font: 900 .85rem "Space Grotesk", sans-serif; }
.coach-status-icon.active { color: #101914; border-color: color-mix(in srgb, var(--green) 72%, transparent); background: var(--green); }
.coach-status-icon.pending { color: var(--green); border-color: color-mix(in srgb, var(--green) 45%, transparent); background: color-mix(in srgb, var(--green) 10%, var(--panel-2)); }
.share-list { display: grid; gap: .35rem; color: var(--muted); font-size: .76rem; }
.recipient-quick-list { display: flex; flex-wrap: wrap; gap: .35rem; }
.recipient-quick-list:empty { display: none; }
.recipient-quick-list button { max-width: 100%; overflow: hidden; padding: .35rem .55rem; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); background: var(--panel-2); cursor: pointer; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.recipient-quick-list button:hover { border-color: color-mix(in srgb, var(--green) 40%, transparent); color: var(--green); }
.recipient-quick-list button { display: inline-flex; align-items: center; gap: .35rem; }
.recipient-quick-list .recipient-forget { color: #ff9a9a; font-size: 1rem; line-height: 1; }
.coach-calendar-list { display: grid; gap: .75rem; width: 100%; }
.coach-calendar-card { display: grid; gap: .65rem; padding: .8rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-2); }
.coach-calendar-card-header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.coach-calendar-card-header strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.coach-calendar-actions, .coach-calendar-member-form { display: flex; flex-wrap: wrap; gap: .5rem; }
.coach-calendar-member-form input { flex: 1 1 210px; }
.coach-calendar-members { display: grid; gap: .35rem; }
.calendar-view-select { min-width: 180px; padding: .65rem .8rem; border: 1px solid var(--line); border-radius: 10px; color: var(--text); background: var(--panel-2); }
.calendar-management { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; margin: .85rem 0; padding: .85rem; border: 1px solid var(--line); border-radius: 13px; background: var(--panel); }
.calendar-management[hidden] { display: none; }
.calendar-management-section { align-content: start; gap: .75rem; padding: 1rem; background: color-mix(in srgb, var(--panel-2) 88%, var(--panel)); }
.calendar-management-section-header { display: grid; gap: .18rem; }
.calendar-management-section-header strong { font: 700 1.05rem "Space Grotesk", sans-serif; }
.calendar-management-section-header small { color: var(--muted); font-size: .76rem; line-height: 1.3; }
.calendar-management-section-body { display: grid; gap: .75rem; }
.calendar-management-section.collapsed .calendar-management-section-body { display: none; }
.calendar-management-section.collapsed { gap: 0; }
.calendar-management-section-header { grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
.calendar-management-section-header strong,
.calendar-management-section-header small { grid-column: 1; }
.section-collapse-toggle { grid-column: 2; grid-row: 1 / span 2; align-self: center; position: relative; width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 50%; color: var(--green); background: var(--panel-2); cursor: pointer; }
.section-collapse-toggle::before { content: ""; position: absolute; top: 50%; left: 50%; width: 9px; height: 9px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translate(-50%, -65%) rotate(45deg); transition: transform .16s ease; }
.calendar-management-section:not(.collapsed) .section-collapse-toggle::before { transform: translate(-50%, -35%) rotate(225deg); }
.section-collapse-toggle:hover { border-color: color-mix(in srgb, var(--green) 42%, var(--line)); background: color-mix(in srgb, var(--green) 9%, var(--panel-2)); }
.calendar-management .personal-card, .calendar-management .program-card { grid-column: 1 / -1; }
.program-calendar-create { display: grid; gap: .45rem; padding: .75rem; border: 1px solid color-mix(in srgb, var(--line) 72%, transparent); border-radius: 11px; background: color-mix(in srgb, var(--panel) 76%, transparent); }
.program-calendar-library-tools { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, 240px); gap: .65rem; align-items: center; padding: .75rem; border: 1px solid color-mix(in srgb, var(--line) 72%, transparent); border-radius: 11px; background: color-mix(in srgb, var(--panel) 76%, transparent); }
.program-calendar-library-title { display: grid; gap: .08rem; min-width: 0; }
.program-calendar-library-title strong { font: 800 1rem "Space Grotesk", sans-serif; }
.program-calendar-library-count { color: var(--muted); font-size: .76rem; font-weight: 800; }
.program-calendar-library-tools select { width: 100%; min-height: 42px; padding: .62rem 2.1rem .62rem .75rem; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); border-radius: 9px; outline: none; appearance: none; color: var(--text); background-color: var(--panel-2); background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 16px) 52%, calc(100% - 10px) 52%; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; font: inherit; }
.program-calendar-library-tools select:focus { border-color: color-mix(in srgb, var(--green) 45%, var(--line)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 11%, transparent); }
.program-calendar-group-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .55rem; align-items: center; padding: .75rem; border: 1px dashed color-mix(in srgb, var(--line) 82%, transparent); border-radius: 11px; background: color-mix(in srgb, var(--panel) 58%, transparent); }
.program-calendar-group-tools input { width: 100%; min-height: 42px; padding: .65rem .75rem; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); border-radius: 9px; color: var(--text); background: var(--panel-2); font: inherit; }
.program-calendar-list { display: grid; gap: .65rem; }
.program-calendar-list > .coach-calendar-card { background: var(--panel); }
.program-calendar-tree-group { display: grid; gap: .5rem; }
.program-calendar-tree-group.subgroup { margin-top: .35rem; }
.program-calendar-tree-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .45rem; align-items: center; width: 100%; min-height: 42px; padding: .35rem; border: 1px solid color-mix(in srgb, var(--line) 76%, transparent); border-radius: 10px; color: var(--text); background: color-mix(in srgb, var(--panel) 80%, transparent); text-align: left; }
.program-calendar-tree-toggle { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: .45rem; align-items: center; min-width: 0; min-height: 34px; padding: .25rem .35rem; border: 0; color: inherit; background: transparent; cursor: pointer; text-align: left; }
.program-calendar-tree-header strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.program-calendar-tree-header small { color: var(--muted); font-weight: 800; white-space: nowrap; }
.program-calendar-tree-chevron::before { content: ""; display: block; width: 8px; height: 8px; border-right: 2px solid var(--green); border-bottom: 2px solid var(--green); transform: rotate(45deg); transition: transform .16s ease; }
.program-calendar-tree-group.collapsed .program-calendar-tree-chevron::before { transform: rotate(-45deg); }
.program-calendar-tree-body { display: grid; gap: .55rem; min-height: 46px; padding-left: 1rem; border-left: 1px solid color-mix(in srgb, var(--line) 70%, transparent); }
.program-calendar-drop-zone { display: grid; gap: .55rem; min-height: 46px; }
.program-calendar-drop-zone.empty { min-height: 58px; padding: .55rem; border-radius: 10px; outline: 1px dashed color-mix(in srgb, var(--green) 22%, transparent); outline-offset: -1px; }
.program-calendar-drop-zone.silent-empty { min-height: 0; padding: 0; outline: 0; }
.program-calendar-drop-zone.empty > .empty-state { pointer-events: none; }
.program-calendar-tree-group.subgroup > .program-calendar-tree-body { padding: .55rem .55rem .55rem 1rem; background: color-mix(in srgb, var(--green) 4%, transparent); }
.program-calendar-tree-group.collapsed .program-calendar-tree-body { display: none; }
.program-calendar-tree-group.collapsed.drag-open .program-calendar-tree-body { display: grid; }
.program-calendar-list.dragging-program-calendar .program-calendar-drop-zone { min-height: 68px; border-radius: 10px; outline: 1px dashed color-mix(in srgb, var(--green) 28%, transparent); outline-offset: -1px; }
.program-calendar-tree-header.drag-over,
.program-calendar-drop-zone.drag-over { border-color: color-mix(in srgb, var(--green) 56%, var(--line)); outline: 2px solid color-mix(in srgb, var(--green) 42%, transparent); outline-offset: 2px; background: color-mix(in srgb, var(--green) 10%, var(--panel)); }
.program-calendar-group-actions { display: inline-flex; align-items: center; gap: .35rem; }
.program-calendar-subgroup-button { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid color-mix(in srgb, var(--green) 35%, transparent); border-radius: 9px; color: var(--green); background: color-mix(in srgb, var(--green) 8%, transparent); cursor: pointer; font-size: 1.1rem; font-weight: 900; line-height: 1; }
.program-calendar-subgroup-button:hover { background: color-mix(in srgb, var(--green) 14%, transparent); }
.program-calendar-group-icon-button { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid color-mix(in srgb, var(--line) 76%, transparent); border-radius: 9px; color: var(--muted); background: color-mix(in srgb, var(--panel-2) 72%, transparent); cursor: pointer; font-weight: 900; line-height: 1; }
.program-calendar-group-icon-button:hover { color: var(--green); border-color: color-mix(in srgb, var(--green) 36%, var(--line)); background: color-mix(in srgb, var(--green) 8%, var(--panel-2)); }
.program-calendar-group-icon-button.danger:hover { color: #ff8c8c; border-color: color-mix(in srgb, #ff8c8c 45%, var(--line)); background: color-mix(in srgb, #ff8c8c 10%, var(--panel-2)); }
.field-caption { color: var(--muted); font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.program-calendar-card { gap: .8rem; }
.program-calendar-card > .coach-calendar-card-header { align-items: flex-start; padding-bottom: .65rem; border-bottom: 1px solid var(--line); }
.program-calendar-card.collapsed > .coach-calendar-card-header { padding-bottom: 0; border-bottom: 0; }
.program-calendar-drag-handle { flex: 0 0 auto; width: 34px; height: 34px; padding: 0; border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); border-radius: 9px; color: var(--muted); background: color-mix(in srgb, var(--panel-2) 72%, transparent); cursor: grab; font-weight: 900; letter-spacing: -.18em; line-height: 1; touch-action: none; }
.program-calendar-drag-handle:hover { color: var(--green); border-color: color-mix(in srgb, var(--green) 42%, var(--line)); background: color-mix(in srgb, var(--green) 8%, var(--panel-2)); }
.program-calendar-drag-handle:active { cursor: grabbing; }
.program-calendar-card.dragging { opacity: .45; }
.program-calendar-card.sortable-ghost { opacity: .35; }
.program-calendar-card.sortable-drag { border-color: color-mix(in srgb, var(--green) 58%, var(--line)); box-shadow: 0 18px 52px rgba(0,0,0,.28); }
.program-calendar-title { display: grid; min-width: 0; gap: .18rem; }
.program-calendar-title strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.program-calendar-title small { color: var(--muted); font-size: .76rem; }
.program-calendar-details { display: grid; gap: .75rem; padding-top: .15rem; }
.program-calendar-card.collapsed .program-calendar-details { display: none; }
.program-listing-tools { display: grid; gap: .85rem; padding: 1rem; border: 1px solid color-mix(in srgb, var(--line) 72%, transparent); border-radius: 12px; background: linear-gradient(180deg, color-mix(in srgb, var(--panel-2) 90%, transparent) 0%, color-mix(in srgb, var(--panel) 92%, transparent) 100%); box-shadow: 0 16px 38px rgba(0,0,0,.08); }
.program-listing-toggles { display: flex; flex-wrap: wrap; gap: .55rem; align-items: center; padding: .25rem 0 .1rem; }
.program-toggle-row { display: inline-flex; align-items: center; gap: .5rem; min-height: 38px; padding: .45rem .7rem; border: 1px solid color-mix(in srgb, var(--line) 74%, transparent); border-radius: 999px; color: var(--text); background: color-mix(in srgb, var(--panel) 78%, transparent); font-weight: 800; }
.program-toggle-row input { width: 16px; height: 16px; accent-color: var(--green); }
.program-listing-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem .7rem; align-items: end; }
.program-listing-grid label { display: grid; gap: .3rem; min-width: 0; }
.program-listing-grid label.full { grid-column: 1 / -1; }
.program-listing-grid input, .program-listing-grid textarea, .program-listing-grid select { width: 100%; min-width: 0; min-height: 48px; padding: .78rem .85rem; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); border-radius: 10px; outline: none; color: var(--text); background: color-mix(in srgb, var(--panel) 92%, #fff); font: inherit; }
.program-listing-grid select { appearance: none; padding-right: 2.3rem; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 18px) 52%, calc(100% - 12px) 52%; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; }
.program-listing-grid input:focus, .program-listing-grid textarea:focus, .program-listing-grid select:focus { border-color: color-mix(in srgb, var(--green) 48%, var(--line)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 11%, transparent); }
.program-listing-grid input:disabled, .program-listing-grid select:disabled { opacity: .52; cursor: not-allowed; }
.program-listing-grid textarea { min-height: 78px; resize: vertical; }
.program-image-upload-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; align-items: center; }
.program-image-upload-row button { white-space: nowrap; }
.program-payment-note { color: var(--muted); line-height: 1.35; }
.program-payment-status { display: flex; align-items: flex-start; gap: .55rem; padding: .65rem .75rem; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); background: color-mix(in srgb, var(--panel) 78%, transparent); line-height: 1.35; }
.program-payment-status-dot { width: .6rem; height: .6rem; flex: 0 0 .6rem; margin-top: .32rem; border-radius: 50%; background: currentColor; opacity: .85; }
.program-payment-status.success { color: var(--green); border-color: color-mix(in srgb, var(--green) 42%, var(--line)); background: color-mix(in srgb, var(--green) 8%, var(--panel)); }
.program-payment-status.pending { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 38%, var(--line)); background: color-mix(in srgb, var(--accent) 8%, var(--panel)); }
.program-payment-status.warning { color: #ffd08a; border-color: color-mix(in srgb, #ffd08a 36%, var(--line)); background: color-mix(in srgb, #ffd08a 7%, var(--panel)); }
.coach-upgrade-button { font-weight: 800; }
.program-marketplace { display: grid; gap: 1.1rem; }
.program-marketplace-header { display: grid; gap: .35rem; padding: .2rem .1rem .55rem; border-bottom: 1px solid color-mix(in srgb, var(--line) 74%, transparent); background: transparent; }
.program-marketplace-header h3 { max-width: 680px; margin: 0; font: 900 clamp(1.7rem, 3vw, 2.35rem) "Space Grotesk", sans-serif; letter-spacing: 0; }
.program-marketplace-header p { max-width: 64ch; margin: 0; color: var(--muted); font-size: .98rem; line-height: 1.45; }
.program-marketplace-header .program-payment-note { max-width: 64ch; }
.program-market-filters { position: sticky; top: 0; z-index: 2; display: grid; grid-template-columns: minmax(220px, 1fr) minmax(150px, .24fr) minmax(140px, .2fr) auto; gap: .55rem; align-items: center; padding: .6rem; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); border-radius: 12px; background: color-mix(in srgb, var(--panel) 88%, transparent); box-shadow: 0 16px 38px rgba(0,0,0,.08); backdrop-filter: blur(12px); }
.program-market-filters input, .program-market-filters select { width: 100%; min-height: 46px; padding: .72rem .85rem; border: 1px solid color-mix(in srgb, var(--line) 84%, transparent); border-radius: 10px; outline: none; color: var(--text); background: color-mix(in srgb, var(--panel-2) 88%, var(--panel)); font: inherit; }
.program-market-filters input:focus, .program-market-filters select:focus { border-color: color-mix(in srgb, var(--green) 45%, var(--line)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 12%, transparent); }
.program-result-count { justify-self: end; padding-right: .25rem; color: var(--muted); font-weight: 900; white-space: nowrap; }
.program-marketplace-diagnostics:empty { display: none; }
.program-marketplace-diagnostics { display: grid; gap: .45rem; padding: .35rem; border: 1px solid color-mix(in srgb, var(--line) 86%, transparent); border-radius: 10px; color: var(--muted); background: color-mix(in srgb, var(--panel-2) 72%, transparent); }
.program-marketplace-diagnostics-summary { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .65rem; align-items: center; width: 100%; min-height: 42px; padding: .55rem .65rem; border: 0; color: var(--text); background: transparent; cursor: pointer; text-align: left; }
.program-marketplace-diagnostics-summary strong { font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; }
.program-marketplace-diagnostics-summary span { color: var(--muted); font-size: .82rem; }
.program-marketplace-diagnostics-summary .diagnostics-chevron { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 50%; color: var(--text); }
.program-marketplace-diagnostics-details { display: grid; gap: .45rem; padding: .35rem .4rem .55rem; }
.program-marketplace-diagnostic { display: flex; flex-wrap: wrap; gap: .45rem .8rem; align-items: baseline; }
.program-marketplace-diagnostic strong { color: var(--text); }
.program-marketplace-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 305px), 365px)); gap: 1rem; align-items: stretch; justify-content: start; }
.owned-program-overview { display: grid; gap: .7rem; }
.owned-program-overview:empty { display: none; }
.owned-program-overview-header { display: grid; gap: .12rem; }
.owned-program-overview-header strong { font: 800 1rem "Space Grotesk", sans-serif; }
.owned-program-overview-header small { color: var(--muted); line-height: 1.35; }
.owned-program-list { display: grid; gap: .5rem; }
.owned-program-row { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .75rem; border: 1px solid color-mix(in srgb, var(--green) 28%, var(--line)); border-radius: 10px; background: color-mix(in srgb, var(--green) 7%, var(--panel-2)); }
.owned-program-row > div:first-child { display: grid; gap: .15rem; min-width: 0; }
.owned-program-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.owned-program-row small { color: var(--muted); }
.owned-program-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .45rem; }
.program-market-card { position: relative; display: grid; grid-template-rows: auto auto auto auto 1fr auto auto; align-content: start; gap: .8rem; min-height: 390px; padding: 1rem; overflow: hidden; border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); border-radius: 12px; background: linear-gradient(180deg, color-mix(in srgb, var(--panel) 94%, #fff) 0%, var(--panel) 100%); box-shadow: 0 18px 42px rgba(0,0,0,.12); transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.program-market-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--green) 34%, var(--line)); box-shadow: 0 24px 54px rgba(0,0,0,.16); }
.program-market-card-image { display: grid; place-items: center; overflow: hidden; aspect-ratio: 16 / 9; margin: -1rem -1rem .05rem; border-radius: 12px 12px 0 0; background: color-mix(in srgb, var(--panel-2) 82%, #fff); }
.program-market-card-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.program-market-card h3 { margin: 0; font: 900 1.22rem/1.12 "Space Grotesk", sans-serif; letter-spacing: 0; }
.program-market-card p { display: -webkit-box; min-height: 2.72em; margin: 0; overflow: hidden; color: var(--muted); line-height: 1.36; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.program-card-meta { align-self: end; color: var(--muted); font-size: .82rem; }
.program-admin-actions { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; padding-top: .7rem; border-top: 1px solid color-mix(in srgb, var(--line) 72%, transparent); }
.program-admin-actions strong { width: 100%; color: var(--muted); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.program-admin-actions button { min-height: 36px; padding: .48rem .62rem; }
.program-price-card { display: inline-flex; align-items: baseline; gap: .45rem; justify-self: start; min-height: 58px; padding: .8rem 1.05rem; border: 1px solid color-mix(in srgb, var(--green) 52%, var(--line)); border-radius: 9px; color: var(--text); background: color-mix(in srgb, var(--green) 6%, var(--panel-2)); box-shadow: 0 14px 30px rgba(0,0,0,.1); }
.program-price-card strong { font-size: 1.22rem; letter-spacing: 0; }
.program-price-card span { color: var(--muted); font-weight: 800; }
.program-fact-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; padding-top: .15rem; }
.program-fact { display: grid; gap: .2rem; min-width: 0; min-height: 72px; padding: .72rem; border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); border-radius: 10px; background: color-mix(in srgb, var(--panel-2) 62%, transparent); }
.program-fact > span { color: var(--muted); font-size: .68rem; font-weight: 900; line-height: 1.15; text-transform: uppercase; }
.program-fact strong { min-width: 0; color: var(--text); font-size: .98rem; overflow-wrap: anywhere; }
.program-experience-meter { display: flex; align-items: center; gap: .14rem; min-height: 23px; }
.program-experience-meter span { color: rgba(148, 163, 184, .25); font-size: 1.05rem; line-height: 1; opacity: .48; filter: grayscale(1); text-shadow: none; }
.program-experience-meter span.active { color: #ffc533; opacity: 1; filter: none; text-shadow: 0 0 10px rgba(255, 197, 51, .42); }
.program-experience-meter em { color: var(--text); font-style: normal; font-weight: 800; }
.program-badges { display: flex; flex-wrap: wrap; gap: .35rem; min-height: 28px; }
.program-market-card-image + .program-badges { margin-top: .05rem; }
.program-badge { display: inline-flex; align-items: center; min-height: 28px; padding: .25rem .58rem; border-radius: 999px; color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--panel-2)); font-size: .72rem; font-weight: 900; }
.program-badge.purchased { color: var(--bg); background: var(--accent); }
.program-badge.muted { color: var(--muted); background: var(--panel-2); }
.program-badge.soft { color: color-mix(in srgb, var(--accent) 82%, var(--text)); background: color-mix(in srgb, var(--accent) 6%, var(--panel)); }
.program-badge.coach-badge { gap: .32rem; color: #07110c; border: 1px solid rgba(10,60,35,.18); background: linear-gradient(135deg, #b7ef5a 0%, #4bd489 58%, #efffd4 100%); box-shadow: 0 7px 18px rgba(36,138,88,.22); }
.coach-badge-icon { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 999px; color: #b7ef5a; background: #07110c; font-size: .72rem; line-height: 1; }
.program-detail-dialog { width: min(920px, 94vw); max-height: 88vh; overflow: auto; border-radius: 20px; background: var(--panel); }
.program-detail-content { position: relative; display: grid; gap: 1rem; padding: 1.05rem; }
.program-detail-content > .icon-button { position: absolute; top: .75rem; right: .75rem; z-index: 1; }
.program-detail-heading { display: grid; gap: .22rem; padding-right: 3rem; }
.program-detail-heading h2 { margin: 0; font: 900 clamp(1.7rem, 3vw, 2.5rem) "Space Grotesk", sans-serif; letter-spacing: 0; }
.program-detail-top { display: grid; grid-template-columns: minmax(260px, .95fr) minmax(260px, 1fr); gap: 1rem; align-items: start; }
.program-detail-image { display: grid; place-items: center; overflow: hidden; aspect-ratio: 16 / 9; border: 1px solid color-mix(in srgb, var(--line) 72%, transparent); border-radius: 14px; background: color-mix(in srgb, var(--panel-2) 80%, #fff); }
.program-detail-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.program-detail-summary { display: grid; gap: .85rem; align-content: start; }
.program-detail-description { margin: 0; color: var(--muted); font-size: 1rem; line-height: 1.5; white-space: pre-wrap; }
.program-detail-dialog .program-fact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.program-detail-dialog .card-actions { justify-content: flex-start; flex-wrap: wrap; }
.program-member-tools, .program-member-list, .program-private-payment-tools { display: grid; gap: .45rem; padding: .7rem; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.02); }
.program-private-payment-tools { border-color: color-mix(in srgb, var(--accent) 32%, var(--line)); background: color-mix(in srgb, var(--accent) 6%, transparent); }
.program-private-payment-tools input[readonly] { font-size: .86rem; color: var(--muted); }
.early-access-application-list { display: grid; gap: .6rem; }
.early-access-application { display: grid; gap: .35rem; padding: .75rem; border: 1px solid var(--line); border-radius: 10px; background: color-mix(in srgb, var(--panel-2) 68%, transparent); }
.early-access-application-header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.program-group-shortcuts { padding-top: .1rem; }
.empty-state.compact { margin: 0; color: var(--muted); font-size: .78rem; }
.share-item { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .45rem .55rem; border-radius: 8px; background: var(--panel-2); }
.share-item button { border: 0; color: var(--muted); background: transparent; cursor: pointer; }
.calendar-invitation { align-items: center; }
.share-invitation-actions { display: flex; gap: .35rem; }
.share-invitation-actions button { min-height: 34px; padding: .35rem .55rem; border: 1px solid var(--line); border-radius: 7px; color: var(--text); background: var(--panel-2); }
.share-invitation-actions button:first-child { border-color: color-mix(in srgb, var(--green) 45%, transparent); color: var(--green); }
.social-logins { display: grid; gap: .5rem; }
.social-logins > span { color: var(--muted); font-size: .7rem; text-align: center; }
.social-logins > div { display: grid; grid-template-columns: 1fr; gap: .45rem; }
.social-logins button { padding: .65rem; border: 1px solid var(--line); border-radius: 9px; color: var(--text); background: var(--panel-2); cursor: pointer; font-weight: 600; }
.social-logins button:hover { border-color: rgba(183,239,90,.4); }
.social-logins button:disabled { opacity: .4; cursor: not-allowed; }
.dialog-actions { display: flex; justify-content: flex-end; gap: .6rem; }
.theme-setting { padding: .9rem 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-2); }
.theme-preview { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; gap: .65rem; padding: .65rem; border: 1px solid color-mix(in srgb, var(--preview-accent) 32%, transparent); border-radius: 10px; background: var(--preview-bg); }
.theme-preview-board { display: grid; gap: .28rem; min-height: 86px; padding: .7rem; border: 1px solid color-mix(in srgb, var(--preview-accent) 24%, transparent); border-radius: 8px; color: var(--preview-text); background: var(--preview-panel); }
.theme-preview-board span { width: 54px; height: 7px; border-radius: 999px; background: var(--preview-accent); }
.theme-preview-board strong { font: 800 .9rem "Space Grotesk", sans-serif; }
.theme-preview-board p { width: 74%; height: 8px; margin: 0; border-radius: 999px; background: var(--preview-panel-2); }
.theme-preview-board button { justify-self: start; min-height: 24px; padding: .2rem .65rem; border: 0; border-radius: 7px; color: var(--preview-bg); background: var(--preview-accent); font-size: .68rem; font-weight: 900; }
.theme-preview-swatches { display: grid; grid-template-columns: repeat(2, 24px); align-content: center; gap: .35rem; }
.theme-preview-swatches i { display: block; width: 24px; height: 24px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; }
.template-toolbar { display: flex; justify-content: space-between; gap: .6rem; margin-bottom: .9rem; }
.template-section { display: grid; gap: .7rem; margin-top: 1rem; }
.template-section-title { margin: 0; color: var(--text); font: 700 .78rem "DM Sans", sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.secondary-button, .primary-button { padding: .8rem 1rem; border-radius: 10px; cursor: pointer; }
.danger-button { border-color: rgba(255,110,110,.35); color: #fff !important; background: #d95858 !important; }
.choice-dialog { width: min(470px, 90vw); }
.choice-dialog.calendar-delete-choice .dialog-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.choice-dialog.calendar-delete-choice #appConfirmCancel { grid-column:1 / -1; grid-row:2; }
@media(max-width:560px) {
  .choice-dialog.calendar-delete-choice .dialog-actions { grid-template-columns:1fr; }
  .choice-dialog.calendar-delete-choice #appConfirmCancel { grid-column:1; grid-row:auto; order:3; }
}
.legal-consent-dialog::backdrop { background: rgba(3,7,5,.84); backdrop-filter: blur(5px); }
.legal-consent-dialog a { color: var(--green); }
.template-date-dialog { width: min(620px, 94vw); }
.template-date-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.template-date-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .45rem; }
.template-date-day { position: relative; display: grid; place-items: center; min-height: 54px; padding: .5rem; border: 1px solid var(--line); border-radius: 11px; color: var(--text); background: rgba(255,255,255,.025); cursor: pointer; font-weight: 700; }
.template-date-day:hover { border-color: color-mix(in srgb, var(--green) 55%, transparent); background: color-mix(in srgb, var(--green) 10%, transparent); }
.template-date-day.outside { opacity: .35; }
.template-date-day.today { border-color: var(--green); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--green) 45%, transparent); }
.template-date-day.has-dashboard::after { content: ""; position: absolute; bottom: 6px; width: 5px; height: 5px; border-radius: 50%; background: var(--green); }
.primary-button { border: 0; color: #14200f; background: var(--green); font-weight: 700; }
.error { min-height: 1.2em; margin: -1rem 0 0; color: #ff8c8c; font-size: .8rem; }
.menu-backdrop { position: fixed; inset: 0; z-index: 20; background: rgba(3,7,5,.65); backdrop-filter: blur(3px); }
.app-menu { position: fixed; inset: 0 auto 0 0; z-index: 21; display: flex; flex-direction: column; width: min(390px, 90vw); padding: 2rem; border-right: 1px solid var(--line); background: var(--panel); box-shadow: 25px 0 80px rgba(0,0,0,.45); transform: translateX(-105%); transition: transform .25s ease; }
.app-menu.open { transform: translateX(0); }
.app-menu-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2.2rem; }
.app-menu-heading h2 { margin: 0; font: 600 2rem "Space Grotesk", sans-serif; }
.app-menu nav { display: grid; gap: .55rem; }
.app-menu nav button { display: flex; align-items: center; gap: 1rem; width: 100%; padding: 1rem; border: 1px solid transparent; border-radius: 13px; color: var(--text); background: transparent; cursor: pointer; text-align: left; font-weight: 600; }
.app-menu nav button b { flex: 1; }
.menu-row-badge { display: grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; color: var(--bg); background: var(--green); font: 800 .68rem "DM Sans", sans-serif; }
.menu-row-badge[hidden] { display: none; }
.inbox-list { display: grid; gap: .75rem; }
.inbox-message { padding: 1rem; border: 1px solid var(--line); border-radius: 14px; background: var(--panel-2); }
.inbox-message.unread { border-color: color-mix(in srgb, var(--green) 55%, var(--line)); box-shadow: inset 4px 0 var(--green); }
.inbox-message h3 { margin: 0 0 .4rem; font: 600 1.05rem "Space Grotesk", sans-serif; }
.inbox-message p { margin: 0; color: var(--muted); white-space: pre-wrap; }
.inbox-message small { display: block; margin-top: .65rem; color: var(--muted); }
.inbox-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; }
.admin-message-compose { display: grid; gap: .65rem; margin-bottom: 1rem; padding: 1rem; border: 1px solid color-mix(in srgb, var(--green) 35%, var(--line)); border-radius: 14px; }
.admin-message-compose input, .admin-message-compose textarea { width: 100%; padding: .75rem; border: 1px solid var(--line); border-radius: 9px; outline: none; color: var(--text); background: var(--panel-2); }
.admin-message-compose textarea { min-height: 110px; resize: vertical; }
.support-message-list, .support-message-history { display: grid; gap: .65rem; }
.support-message-history { padding: 1rem; border: 1px solid var(--line); border-radius: 14px; }
.support-message-header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.support-message-meta { margin-top: .3rem !important; }
.support-message-status { flex: 0 0 auto; padding: .2rem .5rem; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: .72rem; }
.support-message-status.open { border-color: color-mix(in srgb, var(--green) 45%, var(--line)); color: var(--green); }
.admin-analytics { display: grid; gap: .85rem; padding: 1rem; border: 1px solid color-mix(in srgb, var(--green) 45%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--panel-2) 75%, transparent); }
.admin-analytics-title { font: 700 1.1rem "Space Grotesk", sans-serif; }
.admin-analytics-title-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.admin-analytics-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.admin-analytics-metric { display: grid; gap: .15rem; padding: .75rem; border: 1px solid var(--line); border-radius: 10px; }
.admin-analytics-metric strong { color: var(--green); font: 700 1.5rem "Space Grotesk", sans-serif; }
.admin-analytics-metric small { color: var(--muted); }
.admin-analytics-users { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.admin-analytics-users > summary { padding: .75rem; color: var(--text); font-weight: 700; cursor: pointer; list-style-position: inside; }
.admin-analytics-users[open] > summary { border-bottom: 1px solid var(--line); }
.admin-analytics-table-wrap { max-height: 320px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.admin-analytics-users .admin-analytics-table-wrap { border: 0; border-radius: 0; }
.admin-analytics-table { width: 100%; border-collapse: collapse; font-size: .82rem; }
.admin-analytics-table th, .admin-analytics-table td { padding: .6rem .7rem; border-bottom: 1px solid var(--line); text-align: left; white-space: nowrap; }
.admin-analytics-table th { position: sticky; top: 0; color: var(--muted); background: var(--panel-2); }
.admin-analytics-sort { width: 100%; padding: 0; border: 0; color: inherit; background: transparent; font: inherit; font-weight: 700; cursor: pointer; text-align: left; }
.admin-analytics-table th[aria-sort="ascending"] .admin-analytics-sort::after { content: " \2191"; color: var(--green); }
.admin-analytics-table th[aria-sort="descending"] .admin-analytics-sort::after { content: " \2193"; color: var(--green); }
@media (max-width: 620px) { .admin-analytics-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.admin-trends-dialog { width: min(920px, calc(100vw - 2rem)); max-width: none; }
.admin-trends-panel { width: 100%; min-width: 0; }
.admin-trends-controls { display: grid; grid-template-columns: 2fr 2fr 1fr; gap: .75rem; }
.admin-trends-controls > label,
.admin-trends-controls select { min-width: 0; width: 100%; }
.admin-trends-chart { display: grid; gap: .75rem; min-height: 300px; padding: 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-2); }
.admin-trends-total { color: var(--green); font: 700 1.1rem "Space Grotesk", sans-serif; }
.admin-trends-chart svg { width: 100%; height: auto; overflow: visible; }
.admin-trends-axis { stroke: var(--line); stroke-width: 2; }
.admin-trends-line { fill: none; stroke: var(--green); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 620px) { .admin-trends-dialog { width: calc(100vw - 12px); } .admin-trends-controls { grid-template-columns: 1fr; } .admin-analytics-title-row { align-items: flex-start; flex-direction: column; } }
.app-menu nav button:hover { border-color: rgba(183,239,90,.25); background: rgba(183,239,90,.05); }
.app-menu nav span { color: var(--green); font-size: .65rem; letter-spacing: .12em; }
.menu-footer { display: grid; gap: .8rem; margin-top: auto; }
.menu-language-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
.menu-language-options button { display: flex; align-items: center; gap: .55rem; min-width: 0; padding: .75rem .8rem; border: 1px solid var(--line); border-radius: 11px; color: var(--text); background: var(--panel-2); cursor: pointer; text-align: left; }
.menu-language-options button:hover { border-color: color-mix(in srgb, var(--green) 42%, var(--line)); }
.menu-language-options button.active { border-color: var(--green); color: var(--green); background: color-mix(in srgb, var(--green) 9%, var(--panel-2)); }
.menu-language-options .language-flag { position: relative; display: inline-block; flex: 0 0 auto; width: 25px; height: 17px; overflow: hidden; border: 1px solid rgba(255,255,255,.32); border-radius: 3px; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.flag-da { background: #c8102e; }
.flag-da::before { content: ""; position: absolute; inset: 0; background: linear-gradient(to right, transparent 0 31%, #fff 31% 43%, transparent 43%), linear-gradient(to bottom, transparent 0 42%, #fff 42% 58%, transparent 58%); }
.flag-de { background: linear-gradient(to bottom, #181818 0 33.333%, #dd0000 33.333% 66.666%, #ffce00 66.666%); }
.flag-fr { background: linear-gradient(to right, #0055a4 0 33.333%, #fff 33.333% 66.666%, #ef4135 66.666%); }
.flag-gb { background: #21468b; }
.flag-gb::before { content: ""; position: absolute; inset: -3px; background: linear-gradient(32deg, transparent 42%, #fff 42% 48%, #cf142b 48% 52%, #fff 52% 58%, transparent 58%), linear-gradient(-32deg, transparent 42%, #fff 42% 48%, #cf142b 48% 52%, #fff 52% 58%, transparent 58%); }
.flag-gb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to right, transparent 0 39%, #fff 39% 61%, transparent 61%), linear-gradient(to bottom, transparent 0 34%, #fff 34% 66%, transparent 66%), linear-gradient(to right, transparent 0 44%, #cf142b 44% 56%, transparent 56%), linear-gradient(to bottom, transparent 0 41%, #cf142b 41% 59%, transparent 59%); }
.menu-language-options button b { overflow: hidden; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.menu-note { margin: 0; color: var(--muted); font-size: .75rem; }
.manager-dialog { width: min(1050px, 94vw); max-height: 88vh; overflow: auto; }
.manager-content { padding: .8rem; }
.manager-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.4rem; }
.manager-heading h2 { margin: 0; font: 600 2rem "Space Grotesk", sans-serif; }
.week-grid { display: grid; grid-template-columns: repeat(7, minmax(110px, 1fr)); gap: .65rem; }
.day-card, .saved-card, .template-card { border: 1px solid var(--line); border-radius: 14px; color: var(--text); background: rgba(255,255,255,.025); }
.day-card { min-height: 150px; padding: .8rem; cursor: pointer; text-align: left; }
.day-card:hover, .day-card.active { border-color: rgba(183,239,90,.45); }
.day-card .day-name { color: var(--green); font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.day-card strong { display: block; margin: .55rem 0; font: 600 1.35rem "Space Grotesk", sans-serif; }
.day-card small { color: var(--muted); }
.manager-list, .template-grid { display: grid; gap: .7rem; }
.template-grid { grid-template-columns: repeat(3, 1fr); }
.saved-card, .template-card { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; }
.saved-card h3, .template-card h3 { margin: 0; font: 600 1.1rem "Space Grotesk", sans-serif; }
.saved-card p, .template-card p { margin: .3rem 0 0; color: var(--muted); font-size: .78rem; }
.card-actions { display: flex; gap: .45rem; }
.card-actions button { padding: .55rem .7rem; border: 1px solid var(--line); border-radius: 9px; color: var(--text); background: var(--panel-2); cursor: pointer; }
.save-choice-actions { display: grid; gap: .55rem; margin: .2rem 0 .9rem; }
.save-choice-actions button { width: 100%; justify-content: center; min-height: 46px; }
.save-choice-help { margin-top: .35rem; }
.planner-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: 1rem; }
.calendar-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: .8rem; }
.calendar-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: .75rem; }
.calendar-header .calendar-toolbar { margin-bottom: .8rem; }
.calendar-header-actions { display: flex; align-items: center; gap: .6rem; }
.calendar-mode-switch { display: none; }
.calendar-main-view { display: grid; gap: 0; }
.calendar-filter-list { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .7rem; margin: 0 0 .85rem; padding: .7rem; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.02); }
.calendar-filter-list strong { margin-right: .25rem; font-size: .72rem; color: var(--muted); }
.calendar-filter-list label, .contact-member-picker label { display: inline-flex; align-items: center; gap: .35rem; color: var(--text); font-size: .78rem; }
.calendar-filter-list .calendar-filter-all { padding-right: .65rem; border-right: 1px solid var(--line); color: var(--green); font-weight: 800; }
.calendar-filter-list input, .contact-member-picker input { accent-color: var(--green); }
.calendar-target-select, .template-calendar-select { display: grid; gap: .35rem; }
.contact-group-form, .contact-member-picker, .contact-groups-list { display: grid; gap: .5rem; }
.contact-member-picker { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); padding: .65rem; border: 1px solid var(--line); border-radius: 10px; background: rgba(255,255,255,.02); }
.contact-member-picker label { display: grid; grid-template-columns: 16px minmax(0, 1fr); align-items: start; min-width: 0; gap: .45rem; line-height: 1.25; }
.contact-member-picker label span { min-width: 0; overflow-wrap: anywhere; }
.contact-member-picker input { width: 16px; height: 16px; margin-top: .08rem; }
.bold-button { display: none !important; }
.calendar-only-mine { display: flex; align-items: center; gap: .35rem; color: var(--muted); font-size: .7rem; white-space: nowrap; }
.calendar-only-mine input { accent-color: var(--green); }
.calendar-share-button { min-height: 36px; padding: .55rem .8rem; border: 1px solid color-mix(in srgb, var(--green) 35%, transparent); border-radius: 9px; color: var(--green); background: color-mix(in srgb, var(--green) 7%, transparent); }
.calendar-toolbar h3 { margin: 0; font: 600 1.2rem "Space Grotesk", sans-serif; text-transform: capitalize; }
.calendar-toolbar button { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; color: var(--text); background: var(--panel-2); cursor: pointer; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .45rem; }
.calendar-weekday { padding: .35rem; color: var(--muted); font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-align: center; text-transform: uppercase; }
.calendar-day { min-height: 120px; padding: .5rem; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.02); }
.calendar-day.outside { opacity: .35; }
.calendar-day.today { border-color: rgba(183,239,90,.5); }
.calendar-day-number { display: flex; align-items: center; justify-content: space-between; margin-bottom: .4rem; color: var(--muted); font-size: .72rem; font-weight: 700; }
.calendar-day-select { padding: 0; border: 0; color: inherit; background: transparent; cursor: pointer; font: inherit; }
.calendar-add { border: 0; color: var(--green); background: transparent; cursor: pointer; font-size: 1rem; }
.calendar-items { display: grid; gap: .25rem; }
.calendar-item { display: grid; grid-template-columns: minmax(0,1fr) auto; overflow: hidden; width: 100%; border-radius: 7px; color: var(--text); background: var(--panel-2); font-size: .67rem; }
.calendar-item.shared { box-shadow: inset 3px 0 var(--green); }
.calendar-item-open { overflow: hidden; padding: .35rem .4rem; border: 0; color: inherit; background: transparent; cursor: pointer; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.calendar-item-delete { padding: .2rem .4rem; border: 0; color: var(--muted); background: transparent; cursor: pointer; }
.mobile-calendar-agenda { display: none; }
.dashboard-navigator { display: inline-flex; align-items: center; gap: .35rem; margin-top: .35rem; }
.dashboard-navigator button { width: 28px; height: 28px; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: var(--text); background: var(--panel-2); cursor: pointer; }
.dashboard-navigator span { min-width: 34px; color: var(--muted); font-size: .72rem; text-align: center; }

/* Theme surfaces */
dialog, .auth-gate-card, .origin-transfer-notice { background: var(--panel); }
.dialog-content input, .dialog-content select, .dialog-content .toggle-setting, .auth-email-row input, .session-type option, .now-playing { background: var(--panel-2); }
.primary-button { color: var(--bg); }

@media (max-width: 800px) {
  body { overflow: auto; }
  #spotifyDialog { width: min(96vw, 680px); max-height: min(92dvh, 760px); overflow: auto; }
  #spotifyForm { grid-template-columns: 1fr; }
  #spotifyForm .account-actions { display: grid; grid-template-columns: 1fr; align-items: stretch; }
  #spotifyForm .account-actions button,
  #spotifyForm .account-actions input { width: 100%; }
  #spotifyForm .coach-account-heading { align-items: flex-start; }
  #spotifyForm .dialog-actions { position: sticky; bottom: -.8rem; z-index: 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: .25rem -.8rem -.8rem; padding: .75rem .8rem .85rem; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--panel) 94%, transparent); backdrop-filter: blur(14px); }
  #spotifyForm .dialog-actions button { min-height: 46px; }
  .shell { width: min(calc(100% - 1rem), 680px); margin: 0 auto; padding: 1.5rem 0; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .workout-card { min-height: auto; }
  .board-heading { align-items: flex-start; }
  .week-grid { grid-template-columns: repeat(2, 1fr); }
  .template-grid { grid-template-columns: 1fr; }
  .program-listing-grid { grid-template-columns: 1fr; }
  .program-market-filters { grid-template-columns: 1fr; }
  .program-result-count { justify-self: start; }
  .program-marketplace-grid { grid-template-columns: 1fr; }
  .owned-program-row { align-items: stretch; flex-direction: column; }
  .owned-program-actions { justify-content: flex-start; }
  .program-market-card { min-height: 0; }
  .program-detail-dialog { width: min(96vw, 680px); max-height: 92vh; }
  .program-detail-content { padding: .85rem; }
  .program-detail-top { grid-template-columns: 1fr; }
  .program-detail-dialog .program-fact-grid { grid-template-columns: 1fr; }
  .program-fact-grid { grid-template-columns: 1fr; }
  .program-image-upload-row { grid-template-columns: 1fr; }
  .program-image-upload-row button { width: 100%; }
  .manager-dialog { width: min(96vw, 680px); max-height: 92vh; }
  .manager-content { padding: .35rem; }
  .manager-heading { margin-bottom: 1rem; }
  .manager-heading h2 { font-size: 1.55rem; }
  .calendar-management { grid-template-columns: minmax(0, 1fr); padding: .65rem; }
  .calendar-management .personal-card, .calendar-management .program-card { grid-column: auto; }
  .calendar-management-section { padding: .8rem; }
  .program-calendar-library-tools { grid-template-columns: 1fr; }
  .program-calendar-group-tools { grid-template-columns: 1fr; }
  .program-calendar-tree-body { padding-left: .55rem; }
  .calendar-body { display: grid; gap: .75rem; }
  .calendar-mode-switch { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; padding: .35rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-2); }
  .calendar-mode-switch button { min-height: 42px; padding: .65rem .5rem; border: 0; border-radius: 9px; color: var(--muted); background: transparent; font-weight: 800; }
  .calendar-mode-switch button.active { color: #0b100d; background: var(--green); }
  .calendar-body.calendar-management-mode .calendar-main-view { display: none; }
  .calendar-body:not(.calendar-management-mode) .calendar-management { display: none !important; }
  .calendar-grid { gap: .28rem; }
  .calendar-header { grid-template-columns: minmax(0, 1fr); }
  .calendar-header-actions { align-items: stretch; flex-direction: column; }
  .calendar-share-button { width: 100%; margin-bottom: .6rem; }
  .calendar-day { position: relative; min-height: 48px; padding: .3rem; border-radius: 9px; }
  .calendar-day-number { justify-content: center; margin: 0; }
  .calendar-day-select { display: grid; place-items: center; width: 100%; min-height: 38px; border-radius: 7px; }
  .calendar-day.selected { border-color: var(--green); background: color-mix(in srgb, var(--green) 9%, transparent); }
  .calendar-day.has-dashboard::after { content: ""; position: absolute; bottom: 5px; left: 50%; width: 5px; height: 5px; border-radius: 50%; background: var(--green); transform: translateX(-50%); pointer-events: none; }
  .calendar-day .calendar-add, .calendar-day .calendar-items { display: none; }
  .mobile-calendar-agenda { display: grid; gap: .75rem; margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
  .mobile-calendar-agenda-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
  .mobile-calendar-agenda-heading h3 { margin: 0; font: 600 1.05rem "Space Grotesk", sans-serif; text-transform: capitalize; }
  .mobile-calendar-agenda-heading button { padding: .65rem .8rem; }
  .mobile-calendar-agenda-items { display: grid; gap: .5rem; }
  .mobile-calendar-agenda-item { display: grid; grid-template-columns: minmax(0, 1fr) 48px; overflow: hidden; min-height: 58px; border: 1px solid var(--line); border-radius: 11px; background: var(--panel-2); }
  .mobile-calendar-agenda-item.shared { box-shadow: inset 3px 0 var(--green); }
  .mobile-calendar-agenda-open { display: grid; align-content: center; gap: .15rem; min-width: 0; padding: .7rem .8rem; border: 0; color: var(--text); background: transparent; cursor: pointer; text-align: left; }
  .mobile-calendar-agenda-open strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-calendar-agenda-open small { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
  .mobile-calendar-agenda-delete { min-width: 48px; border: 0; border-left: 1px solid var(--line); color: #ff9a9a; background: transparent; cursor: pointer; font-size: 1.25rem; }
  .saved-card, .template-card { align-items: stretch; flex-direction: column; }
  .card-actions { justify-content: stretch; }
  .card-actions button { flex: 1; min-height: 44px; }
  .spotify-frame-wrap iframe { height: 152px; }
  .board-calendar-switch { flex-wrap: wrap; }
  .board-calendar-filter-panel { left: 0; }
}

@media (min-width: 1600px) {
  .shell { padding-inline: clamp(.85rem, 1vw, 1.25rem); }
  .workout-card { padding-inline: clamp(1rem, 1.4vw, 1.65rem); }
}

@media (min-width: 801px) and (max-width: 1100px) {
  .dashboard-grid { grid-template-columns: 1fr; }
  .side-column { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
  /* Keep tall dialogs inside Safari's visible viewport instead of centering
     their overflow above the browser chrome. */
  dialog[open]:not(#spotifyDialog):not(#legalConsentDialog) {
    inset-block-start: max(6px, env(safe-area-inset-top));
    inset-block-end: auto;
    max-height: calc(100vh - max(12px, env(safe-area-inset-top)) - max(12px, env(safe-area-inset-bottom)));
    max-height: calc(100dvh - max(12px, env(safe-area-inset-top)) - max(12px, env(safe-area-inset-bottom)));
    margin: 0 auto;
  }
  .manager-dialog {
    width: calc(100vw - 12px);
    max-width: calc(100vw - 12px);
    max-height: calc(100vh - max(12px, env(safe-area-inset-top)) - max(12px, env(safe-area-inset-bottom)));
    max-height: calc(100dvh - max(12px, env(safe-area-inset-top)) - max(12px, env(safe-area-inset-bottom)));
    border-radius: 18px;
  }
  .manager-content { padding: .5rem; }
  .manager-heading { padding-right: 2.75rem; }
  .calendar-header-actions { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
  .calendar-header-actions > * { width: 100%; min-width: 0; }
  .calendar-header-actions > .secondary-button:not(.calendar-import-button) { display: none; }
  .calendar-management { gap: .65rem; margin: 0; padding: .5rem; }
  .calendar-management-section { min-width: 0; padding: .7rem; }
  .coach-calendar-card-header { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; }
  .coach-calendar-card-header > small { overflow-wrap: anywhere; }
  .coach-calendar-member-form { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
  .coach-calendar-member-form input,
  .coach-calendar-member-form button { width: 100%; min-width: 0; }
  .program-calendar-create { padding: .65rem; }
  .program-calendar-library-tools,
  .program-calendar-group-tools { padding: .65rem; }
  .program-calendar-group-tools button { width: 100%; }
  .program-calendar-tree-body,
  .program-calendar-tree-group.subgroup > .program-calendar-tree-body { padding-left: .35rem; }
  .program-calendar-card { min-width: 0; padding: .7rem; }
  .program-calendar-card > .coach-calendar-card-header { gap: .65rem; }
  .program-calendar-card .program-calendar-title strong { white-space: normal; overflow-wrap: anywhere; }
  .program-calendar-card .card-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  .program-calendar-card .card-actions button { width: 100%; min-width: 0; padding: .65rem .45rem; white-space: normal; overflow-wrap: anywhere; }
  .program-calendar-card .card-actions button:first-child { grid-column: 1 / -1; }
  .share-item { align-items: stretch; flex-direction: column; overflow-wrap: anywhere; }
  .share-item button { align-self: stretch; min-height: 40px; }
  #spotifyDialog { width: 100vw; max-width: none; height: 100dvh; max-height: 100dvh; margin: 0; border: 0; border-radius: 0; }
  #spotifyForm { gap: 1rem; min-height: 100dvh; padding: 1rem; }
  #spotifyForm > div:first-child { padding-right: 2rem; }
  #spotifyForm .dialog-content h2,
  #settingsDialogTitle { font-size: 1.5rem; }
  #spotifyForm .dialog-help { font-size: .9rem; line-height: 1.4; }
  #spotifyForm .account-setting { gap: .75rem; padding: .85rem; border-radius: 14px; }
  #spotifyForm .coach-account-heading { gap: .65rem !important; }
  #spotifyForm .coach-status-icon { width: 34px; height: 34px; flex-basis: 34px; }
  #spotifyForm .theme-preview { min-height: 132px; }
  #spotifyForm .dialog-actions { bottom: -1rem; margin: .1rem -1rem -1rem; padding: .7rem 1rem calc(.8rem + env(safe-area-inset-bottom)); }
  #spotifyForm .dialog-actions button { padding: .75rem .55rem; }
  .auth-gate { padding: .6rem; }
  .auth-gate-card { gap: .8rem; padding: 1.1rem; border-radius: 18px; }
  .auth-gate-brand img,
  .auth-gate-logo { width: 42px; height: 42px; flex-basis: 42px; }
  .auth-gate-brand h1 { font-size: 2rem; }
  .auth-language-options { gap: .35rem; }
  .auth-password-actions { grid-template-columns: 1fr; }
  .template-date-dialog { width: 96vw; }
  .template-date-grid { gap: .25rem; }
  .template-date-day { min-height: 42px; padding: .3rem; border-radius: 8px; }
  .auth-email-row { display: grid; }
  .shell { width: calc(100% - 1rem); margin: 0 auto; padding: 1rem 0 2.5rem; overflow: hidden; }
  .topbar { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: .85rem; margin-bottom: 2rem; }
  .topbar.timer-enabled { display: grid; min-height: 0; grid-template-columns: minmax(0, 1fr); }
  .brand-block { min-width: 0; gap: .65rem; }
  .brand-block > div { min-width: 0; }
  .brand-block h1 { font-size: clamp(2.2rem, 12vw, 3.1rem); line-height: .95; }
  .brand-block .eyebrow { overflow-wrap: anywhere; font-size: .62rem; }
  .menu-button { flex: 0 0 auto; width: 40px; height: 40px; }
  .header-meta { justify-content: flex-end; gap: .5rem; }
  .gym-timer { position: static; grid-column: 1; grid-template-columns: minmax(0, 1fr); width: 100%; max-width: none; margin-top: .65rem; padding: .8rem; transform: none; }
  .topbar.timer-enabled .header-meta { grid-column: 1; justify-content: flex-end; }
  .gym-timer-config { grid-row: 3; grid-column: 1; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gym-timer-config select { grid-column: auto; }
  .gym-timer-config select, .gym-timer-config label { min-height: 38px; font-size: .78rem; }
  .gym-timer-readout { grid-row: 1; grid-column: 1; min-width: 0; text-align: center; }
  .gym-timer-readout strong { font-size: clamp(4rem, 22vw, 6.5rem); }
  .gym-timer-actions { grid-row: 2; grid-column: 1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gym-timer-actions button { width: 100%; }
  .header-meta .icon-button, .header-meta .cast-button { width: 40px; height: 40px; padding: 9px; }
  .clock strong { font-size: 1.65rem; }
  .board-heading { display: grid; gap: 1rem; }
  .dashboard-title { width: 100%; font-size: clamp(2rem, 10vw, 2.7rem); }
  .board-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
  .board-actions button { min-height: 46px; padding: .72rem .55rem; border: 1px solid var(--line); border-radius: 10px; color: var(--text); background: var(--panel-2); text-align: center; font-weight: 800; line-height: 1.15; }
  .board-actions #addSessionButton { border-color: transparent; color: #0b100d; background: var(--green); }
  .board-actions #deleteDashboardButton { grid-column: 2; width: 100%; min-height: 46px; margin-left: 0; padding: .72rem .55rem; border-color: rgba(255,110,110,.32); color: #ff8d8d !important; background: rgba(255,110,110,.07) !important; order: 99; }
  .sessions-board,
  .sessions-board.is-dense,
  .sessions-board.is-compact { display: grid; grid-template-columns: minmax(0, 1fr) !important; gap: 1rem; overflow: visible; }
  .sessions-board .session-card { grid-column: 1 !important; width: 100%; min-width: 0; height: auto; padding: 1rem; border-radius: 18px; }
  .sessions-board .session-title,
  .sessions-board.is-dense .session-title,
  .sessions-board.is-compact .session-title,
  .sessions-board .session-title.text-medium,
  .sessions-board .session-title.text-long { max-height: none; margin: .8rem 0 1rem; font-size: clamp(1.5rem, 6vw, 1.75rem) !important; line-height: 1.12; }
  .session-card.is-multi-column .session-exercises { grid-template-columns: minmax(0, 1fr); }
  .session-card.is-multi-column .emom-options { max-width: none; }
  .session-exercises { flex: 0 1 auto; }
  .session-exercises:has(.exercise-row:only-child) { grid-template-rows: auto; }
  .session-exercises:has(.exercise-row:only-child) .exercise-row { min-height: 78px; }
  .session-heading { gap: .4rem; }
  .session-type { max-width: min(190px, 55vw); }
  .clock span { display: none; }
  .exercise-row { grid-template-columns: minmax(0, 1fr) auto; }
  .exercise-detail { grid-column: 1; text-align: left; font-size: .85rem; }
  .exercise-actions { grid-column: 2; grid-row: 1; }
  .side-column { grid-template-columns: minmax(0, 1fr); }
  .jam-card { grid-template-columns: 1fr 112px; }
  .jam-qr { width: 112px; height: 112px; }
  .jam-qr img, .jam-qr canvas { width: 94px !important; height: 94px !important; }
  .now-playing-content { grid-template-columns: 112px minmax(0, 1fr); }
  .now-playing-content img { width: 112px; height: 132px; }
}

/* 16:9 TV / cast layout */
@media (min-width: 1200px) and (min-aspect-ratio: 16/10) {
  .shell { padding: 2vh 1.35vw; }
  .topbar { margin-bottom: .35rem; }
  h1 { font-size: clamp(2.6rem, 3.35vw, 4rem); }
  .menu-button, .icon-button { width: 42px; height: 42px; }
  .dashboard-grid { grid-template-columns: minmax(0, 1fr) 350px; gap: .85rem; }
  .board-heading { margin-bottom: .75rem; }
  .dashboard-title { font-size: clamp(1.65rem, 2.25vw, 2.6rem); }
  .active-dashboard-date { margin-top: .2rem; }
  .sessions-board { gap: .7rem; }
  .session-card { padding: 1rem; border-radius: 18px; }
  .session-title { margin: .65rem 0 .8rem; }
  .side-column { gap: .75rem; }
  .spotify-card, .jam-card { padding: 1rem; border-radius: 18px; }
  .now-playing { min-height: 112px; }
  .now-playing-content { grid-template-columns: 112px minmax(0, 1fr); min-height: 112px; }
  .now-playing-content img { width: 112px; height: 112px; }
  .now-playing-copy { padding: .75rem; }
  .queue-preview { margin-top: .65rem; padding: .65rem; }
  .queue-item img { width: 34px; height: 34px; }
  .queue-item { grid-template-columns: 34px minmax(0, 1fr); }
  .connect-tip { margin-top: .65rem; }
  .jam-card { grid-template-columns: minmax(0, 1fr) 110px; }
  .jam-qr { width: 110px; height: 110px; }
  .jam-qr img, .jam-qr canvas { width: 92px !important; height: 92px !important; }
}

html:fullscreen, html:fullscreen body { width: 100%; height: 100%; overflow: hidden; }
html:fullscreen .shell { min-height: 100vh; padding: 2.2vh 1.6vw; }
html:fullscreen .workout-card { padding-inline: clamp(.9rem, 1.2vw, 1.35rem); }
html:fullscreen .menu-button,
html:fullscreen .board-actions,
html:fullscreen .delete-session-button,
html:fullscreen .drag-handle,
html:fullscreen .delete-button,
html:fullscreen .bold-button,
html:fullscreen .color-button,
html:fullscreen .add-button,
html:fullscreen .spotify-heading .icon-button { display: none !important; }
html:fullscreen .brand-block { gap: 0; }
html:fullscreen h1 { font-size: clamp(3.4rem, 4.2vw, 5.4rem); }
html:fullscreen .dashboard-title { width: min(1400px, 90vw); max-width: 100%; font-size: clamp(2.2rem, 2.8vw, 3.5rem); }
html:fullscreen .dashboard-grid { grid-template-columns: minmax(0, 1fr) 360px; gap: 1.2rem; }
html:fullscreen .dashboard-grid.spotify-disabled { grid-template-columns: minmax(0, 1fr); }
html:fullscreen .sessions-board { gap: 1rem; }
html:fullscreen .session-card { padding: 1.35rem; }
html:fullscreen .session-title { font-size: clamp(1.65rem, 5.2cqi, 2.8rem); margin: .9rem 0 1.1rem; }

/* Keep every session heading on a desktop board at one shared visual size. */
@media (min-width: 701px) {
  .sessions-board { --uniform-session-title-size: 1.7rem; }
  .sessions-board.has-medium-titles { --uniform-session-title-size: 1.45rem; }
  .sessions-board.has-long-titles,
  .sessions-board.is-dense { --uniform-session-title-size: 1.15rem; }
  .sessions-board.is-compact { --uniform-session-title-size: 1rem; }
  .sessions-board .session-title,
  .sessions-board .session-title.text-medium,
  .sessions-board .session-title.text-long,
  .sessions-board.is-dense .session-title,
  .sessions-board.is-compact .session-title,
  .sessions-board .session-card.has-very-long-list .session-title,
  html:fullscreen .sessions-board .session-title {
    font-family: "Space Grotesk", sans-serif !important;
    font-size: var(--uniform-session-title-size) !important;
    font-stretch: normal !important;
    font-style: normal !important;
    font-variant: normal !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    line-height: 1.1 !important;
  }
}
html:fullscreen .exercise-row { min-height: 64px; padding: .65rem .75rem; }
html:fullscreen .exercise-name { font-size: clamp(1.25rem, 4.4cqi, 1.6rem); line-height: 1.3; }
html:fullscreen .session-card .exercise-name.text-medium { font-size: clamp(1.15rem, 4cqi, 1.45rem); }
html:fullscreen .session-card .exercise-name.text-long { font-size: clamp(1.02rem, 3.5cqi, 1.25rem); line-height: 1.3; }
html:fullscreen .exercise-detail { font-size: 1rem; line-height: 1.3; }
html:fullscreen .exercise-detail.text-medium { font-size: .92rem; }
html:fullscreen .exercise-detail.text-long { font-size: .85rem; }
html:fullscreen .session-type { font-size: .8rem; }
html:fullscreen .exercise-minute { font-size: clamp(1.25rem, 4.4cqi, 1.6rem); }
html:fullscreen .session-card.is-emom .exercise-row:has(.exercise-name.text-medium) .exercise-minute { font-size: clamp(1.15rem, 4cqi, 1.45rem); }
html:fullscreen .session-card.is-emom .exercise-row:has(.exercise-name.text-long) .exercise-minute { font-size: clamp(1.02rem, 3.5cqi, 1.25rem); }
html:fullscreen .sessions-board { --exercise-font-size: clamp(1.15rem, 4cqi, 1.4rem); }
html:fullscreen .sessions-board.has-verbose-content { --exercise-font-size: clamp(1.05rem, 3.6cqi, 1.25rem); }
html:fullscreen .sessions-board.has-extreme-content { --exercise-font-size: clamp(.95rem, 3.2cqi, 1.12rem); }
html:fullscreen .session-card .exercise-name,
html:fullscreen .session-card .exercise-name.text-medium,
html:fullscreen .session-card .exercise-name.text-long,
html:fullscreen .session-card .exercise-detail,
html:fullscreen .session-card .exercise-detail.text-medium,
html:fullscreen .session-card .exercise-detail.text-long,
html:fullscreen .session-card .exercise-minute { font-size: var(--exercise-font-size); }
html:fullscreen .duration-help { display: none; }
html:fullscreen .emom-options,
html.tv-mode .emom-options { display: block; margin: -.35rem 0 .8rem; }
html:fullscreen .emom-options label,
html.tv-mode .emom-options label { display: inline-flex; align-items: center; gap: .55rem; padding: .4rem .65rem; border: 1px solid var(--soft-green-border); border-radius: 999px; background: var(--soft-green); }
html:fullscreen .duration-label,
html.tv-mode .duration-label { font-size: 0; letter-spacing: 0; text-transform: uppercase; }
html:fullscreen .duration-label::before,
html.tv-mode .duration-label::before { content: "EMOM"; font-size: .72rem; letter-spacing: .12em; }
html:fullscreen .session-card:not(.is-emom) .duration-label::before,
html.tv-mode .session-card:not(.is-emom) .duration-label::before { content: "AMRAP"; }
html:fullscreen .duration-control,
html.tv-mode .duration-control { font-size: 0; font-weight: 700; }
html:fullscreen .duration-control,
html.tv-mode .duration-control { gap: 0; }
html:fullscreen .duration-control::after,
html.tv-mode .duration-control::after { content: ""; }
html:fullscreen .emom-duration,
html.tv-mode .emom-duration { width: 2.5rem; border-bottom: 0; pointer-events: none; font-size: .82rem; }
html:fullscreen .duration-control,
html.tv-mode .duration-control { color: var(--green); }
html.tv-mode .duration-help { display: none; }
html:fullscreen .topbar { margin-bottom: 2.5vh; }
html:fullscreen .board-heading { margin-bottom: 1.15rem; }

/* Keep individual long sessions inside the 16:9 fullscreen canvas. */
html:fullscreen .session-card.flow-columns .exercise-name,
html:fullscreen .session-card.flow-columns .exercise-detail {
  column-count: 2;
  column-gap: 1.1rem;
  column-rule: 1px solid rgba(255,255,255,.08);
}
html:fullscreen .session-card.auto-fit > * { zoom: var(--session-fit); }

/* First-login onboarding */
.onboarding-dialog { width:min(940px,94vw); max-height:92vh; padding:0; overflow:hidden; border:1px solid var(--line); border-radius:26px; color:var(--text); background:var(--panel); }
.onboarding-dialog::backdrop { background:rgba(0,8,12,.78); backdrop-filter:blur(8px); }
.onboarding-shell { position:relative; display:grid; grid-template-rows:auto minmax(0,1fr) auto; height:min(670px,88vh); padding:1.4rem; }
.onboarding-skip { position:absolute; z-index:2; top:1rem; right:4rem; padding:.55rem .75rem; border:0; color:var(--muted); background:transparent; cursor:pointer; }
.onboarding-progress { display:flex; justify-content:center; gap:.45rem; padding:.25rem 5rem 1rem; }
.onboarding-progress button { width:9px; height:9px; padding:0; border:0; border-radius:50%; background:var(--line); cursor:pointer; }
.onboarding-progress button.active { width:28px; border-radius:99px; background:var(--accent); }
.onboarding-slides { min-height:0; overflow:auto; }
.onboarding-slide { max-width:780px; margin:auto; text-align:center; }
.onboarding-slide h2 { margin:.25rem 0 .65rem; font:700 clamp(2rem,4vw,3.5rem)/1 "Space Grotesk",sans-serif; }
.onboarding-slide>p:not(.section-label) { max-width:650px; margin:.5rem auto; color:var(--muted); font-size:1.08rem; }
.onboarding-visual { position:relative; display:flex; align-items:center; justify-content:center; gap:1rem; min-height:330px; margin:0 auto 1.2rem; overflow:hidden; border:1px solid var(--line); border-radius:22px; background:linear-gradient(145deg,var(--panel-2),color-mix(in srgb,var(--accent) 9%,var(--panel))); }
.mini-board { width:min(620px,84%); padding:1.5rem; border:1px solid var(--soft-green-border); border-radius:18px; text-align:left; background:var(--panel); box-shadow:0 18px 60px rgba(0,0,0,.25); }
.mini-board>b { display:block; margin-bottom:1.2rem; font-size:1.45rem; }.mini-board>div{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}.mini-board span,.mini-calendars span,.visual-programs span,.ready-board span{padding:1.3rem .65rem;border:1px solid var(--line);border-radius:12px;color:var(--accent);background:var(--panel-2);font-weight:700}.mini-board small{display:block;margin-top:1rem;color:var(--muted);letter-spacing:.12em}
.visual-organize{flex-direction:column}.mini-calendars{display:grid;grid-template-columns:repeat(2,minmax(150px,220px));gap:.8rem}.mini-calendars span{text-align:left}.mini-access{display:flex;gap:.6rem}.mini-access b{padding:.55rem 1.2rem;border-radius:99px;background:var(--soft-green);color:var(--accent)}
.device{display:grid;place-items:center;border:2px solid var(--line);background:var(--panel);font-weight:800;letter-spacing:.1em}.device.phone{width:75px;height:145px;border-radius:16px}.device.tv{width:190px;height:115px;border-radius:10px}.display-code{display:grid;gap:.25rem;padding:1rem 1.4rem;border:1px solid var(--accent);border-radius:12px;background:var(--panel)}.display-code b{font-size:1.7rem;letter-spacing:.12em}.display-code small{color:var(--accent)}.flow-line{color:var(--accent);font-size:2rem}.visual-display em{position:absolute;top:1rem;right:1rem;padding:.3rem .55rem;border-radius:99px;color:var(--background);background:var(--accent);font-size:.65rem;font-style:normal;font-weight:900}
.visual-programs>div:first-child{display:grid;gap:.7rem;width:240px;padding:1.2rem;border:1px solid var(--line);border-radius:16px;background:var(--panel)}.visual-programs span{padding:.7rem}.publish-flow{padding:1.3rem;border:1px solid var(--accent);border-radius:14px;color:var(--accent);font-weight:800}.ready-timer{padding:.8rem 1.3rem;border-radius:14px;color:var(--accent);background:var(--panel);font-size:3rem;font-weight:800}.ready-board{display:grid;grid-template-columns:repeat(2,170px);gap:.8rem}.ready-board span{padding:3rem .8rem}.onboarding-feature-chips{display:flex;justify-content:center;gap:.5rem;margin:1rem 0}.onboarding-feature-chips span{padding:.45rem .75rem;border-radius:99px;color:var(--accent);background:var(--soft-green);font-weight:800}.onboarding-more{display:block;color:var(--muted)}
.onboarding-footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-top:1rem; border-top:1px solid var(--line); }
.onboarding-actions { display:flex; justify-content:flex-end; gap:1rem; }.onboarding-actions button{min-width:110px}
.onboarding-dismiss-choice { display:flex; align-items:center; gap:.75rem; max-width:100%; padding:.7rem 1rem; border:1px solid var(--accent); border-radius:12px; color:var(--text); background:var(--soft); font-weight:700; cursor:pointer; }
.onboarding-dismiss-choice input { width:1.25rem; height:1.25rem; margin:0; accent-color:var(--accent); cursor:pointer; }
@media(max-width:620px){.onboarding-shell{min-height:88vh;padding:1rem}.onboarding-visual{min-height:250px}.mini-board>div{grid-template-columns:repeat(2,1fr)}.mini-board span{padding:.7rem .45rem}.mini-calendars{grid-template-columns:repeat(2,minmax(110px,1fr));width:90%}.device.phone,.flow-line{display:none}.device.tv{width:145px}.ready-board{grid-template-columns:repeat(2,minmax(100px,1fr))}.ready-board span{padding:2rem .4rem}.visual-programs{flex-direction:column}.onboarding-slide h2{font-size:2rem}.onboarding-slide>p:not(.section-label){font-size:.95rem}.onboarding-progress{padding-bottom:.65rem}}
.onboarding-footer { flex-wrap:wrap; }
@media(max-width:620px){.onboarding-footer{align-items:stretch;flex-direction:column}.onboarding-dismiss-choice{justify-content:center}.onboarding-actions{width:100%}.onboarding-actions button{flex:1}}

/* Product-like, read-only previews used by both automatic and manual onboarding. */
.onboarding-dialog{width:min(1060px,96vw);max-height:96vh}
.onboarding-shell{height:min(740px,94vh);padding:1.15rem 1.35rem}
.onboarding-slides{overflow:hidden}
.onboarding-slide{display:grid;grid-template-rows:minmax(300px,1fr) auto auto auto;align-content:start;max-width:920px;height:100%;min-width:0}
.onboarding-slide[hidden]{display:none}
.onboarding-slide h2{margin:.15rem 0 .35rem;font-size:clamp(1.75rem,3vw,2.75rem);line-height:1.08}
.onboarding-slide>p:not(.section-label){margin:.25rem auto;font-size:clamp(.88rem,1.4vw,1.02rem);line-height:1.45}
.onboarding-slide>.section-label{margin:.65rem 0 .1rem}
.onboarding-preview{box-sizing:border-box;position:relative;display:flex;align-items:center;justify-content:center;min-width:0;height:clamp(320px,46vh,380px);padding:clamp(1rem,2.6vw,2rem);overflow:hidden;border:1px solid var(--line);border-radius:22px;background:radial-gradient(circle at 50% 0,color-mix(in srgb,var(--accent) 13%,transparent),transparent 48%),linear-gradient(145deg,var(--panel-2),color-mix(in srgb,var(--accent) 5%,var(--panel)));text-align:left}
.onboarding-preview *{box-sizing:border-box;min-width:0}
.onboarding-preview header,.onboarding-preview article,.onboarding-preview aside,.onboarding-preview section,.onboarding-preview div,.onboarding-preview label{line-height:1.38}
.onboarding-preview strong,.onboarding-preview b,.onboarding-preview small,.onboarding-preview span{display:block}
.onboarding-preview small{color:var(--muted);font-size:11px}
.onboarding-preview article{border:1px solid var(--line);background:color-mix(in srgb,var(--panel) 92%,transparent)}

.onboarding-preview-board{width:min(680px,94%);padding:1.1rem;border:1px solid var(--soft-green-border);border-radius:18px;background:var(--panel);box-shadow:0 22px 60px rgba(0,0,0,.28)}
.onboarding-preview-board>header{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:.7rem}.onboarding-preview-board>header span,.onboarding-preview-session-grid article>span,.onboarding-preview-ready-display article>span{color:var(--accent);font-size:10px;font-weight:800;letter-spacing:.12em}.onboarding-preview-board>header strong{font-size:17px}
.onboarding-preview-session-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.onboarding-preview-session-grid article{display:grid;align-content:start;gap:.12rem;min-height:82px;padding:.65rem .75rem;border-radius:11px}.onboarding-preview-session-grid strong{font-size:13px}.onboarding-preview-dates{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.4rem;margin-top:.7rem}.onboarding-preview-dates>span,.onboarding-preview-dates>strong{display:grid;place-items:center;padding:.38rem;border-radius:9px}.onboarding-preview-dates>strong{color:var(--background);background:var(--accent)}.onboarding-preview-dates small{font-size:9px;letter-spacing:.08em}.onboarding-preview-dates>strong small{color:inherit}.onboarding-preview-dates b{font-size:12px}

.onboarding-preview-organize{gap:clamp(.7rem,2vw,1.25rem)}.onboarding-preview-calendars{width:min(535px,67%);padding:1rem;border:1px solid var(--line);border-radius:17px;background:var(--panel);box-shadow:0 20px 50px rgba(0,0,0,.22)}.onboarding-preview-calendars header,.onboarding-preview-find header,.onboarding-preview-publish header{margin-bottom:.65rem;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.14em}.onboarding-preview-calendars>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.onboarding-preview-calendars article{display:grid;grid-template-columns:auto 1fr;gap:.05rem .55rem;padding:.7rem;border-radius:11px}.onboarding-preview-calendars article.selected{border-color:var(--accent);background:var(--soft-green)}.onboarding-preview-calendars article>i{grid-row:1/4;width:8px;border-radius:9px;background:var(--accent)}.onboarding-preview-calendars i.blue{background:#5f9fff}.onboarding-preview-calendars i.violet{background:#a77cff}.onboarding-preview-calendars i.orange{background:#ff985f}.onboarding-preview-calendars strong{font-size:13px}.onboarding-preview-permissions{display:grid;gap:.55rem;width:min(250px,30%);padding:1rem;border:1px solid var(--soft-green-border);border-radius:17px;background:var(--panel)}.onboarding-preview-permissions>span{color:var(--accent);font-size:9px;font-weight:800;letter-spacing:.1em}.onboarding-preview-permissions>strong{font-size:16px}.onboarding-preview-people{display:grid;gap:.25rem}.onboarding-preview-people>div{display:flex}.onboarding-preview-people i,.onboarding-preview-people b{display:grid;place-items:center;width:27px;height:27px;margin-right:-5px;border:2px solid var(--panel);border-radius:50%;color:var(--text);background:var(--panel-2);font-size:9px;font-style:normal}.onboarding-preview-permission-chips{display:flex;gap:.4rem}.onboarding-preview-permission-chips span,.onboarding-preview-permission-chips strong{padding:.35rem .55rem;border-radius:99px;font-size:10px}.onboarding-preview-permission-chips span{background:var(--panel-2)}.onboarding-preview-permission-chips strong{color:var(--background);background:var(--accent)}

.onboarding-preview-display{flex-direction:column;gap:.7rem}.onboarding-preview-device-scene{display:flex;align-items:center;justify-content:center;width:100%;gap:clamp(.5rem,2vw,1.3rem)}.onboarding-preview-phone{width:136px;padding:6px;border:2px solid color-mix(in srgb,var(--text) 35%,var(--line));border-radius:20px;background:#090d10;box-shadow:0 18px 35px rgba(0,0,0,.32)}.onboarding-preview-phone>i{width:32px;height:3px;margin:1px auto 5px;border-radius:4px;background:var(--line)}.onboarding-preview-phone>div{display:grid;gap:.45rem;height:190px;padding:.7rem .6rem;border-radius:13px;background:var(--panel)}.onboarding-preview-phone>div>span{font-size:10px;font-weight:800}.onboarding-preview-phone article{display:grid;gap:.18rem;padding:.5rem;border-radius:9px}.onboarding-preview-phone article strong{font-size:11px}.onboarding-preview-phone article small{display:flex;align-items:center;gap:.25rem;color:var(--accent);font-size:9px}.onboarding-preview-phone article small i{width:6px;height:6px;border-radius:50%;background:var(--accent)}.onboarding-preview-phone>div>b{font-size:11px}.onboarding-preview-connection{display:flex;align-items:center;width:clamp(35px,7vw,90px);color:var(--accent)}.onboarding-preview-connection span{width:100%;height:1px;background:linear-gradient(90deg,transparent,var(--accent))}.onboarding-preview-connection b{font-size:24px}.onboarding-preview-tv-wrap{position:relative;width:min(470px,58%)}.onboarding-preview-recommended{position:absolute;z-index:2;top:-10px;right:-8px;padding:.3rem .55rem;border-radius:99px;color:var(--background);background:var(--accent);font-size:9px;font-weight:900}.onboarding-preview-tv{padding:7px;border:2px solid color-mix(in srgb,var(--text) 35%,var(--line));border-radius:12px;background:#080b0d;box-shadow:0 20px 45px rgba(0,0,0,.32)}.onboarding-preview-tv>div{padding:.75rem;border-radius:6px;background:linear-gradient(145deg,#11191d,#0c1316)}.onboarding-preview-tv header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.55rem}.onboarding-preview-tv header strong{font-size:13px}.onboarding-preview-tv header b{color:var(--accent);font-size:20px}.onboarding-preview-tv section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.onboarding-preview-tv article{display:grid;gap:.08rem;padding:.55rem;border-radius:8px;background:rgba(255,255,255,.035)}.onboarding-preview-tv article span{color:var(--accent);font-size:8px;font-weight:800;letter-spacing:.1em}.onboarding-preview-tv article strong{font-size:11px}.onboarding-preview-tv article small{font-size:9px}.onboarding-preview-tv footer{margin-top:.45rem;color:var(--muted);font-size:9px;letter-spacing:.2em;text-align:right}.onboarding-preview-tv-wrap>i{width:70px;height:8px;margin:auto;border-radius:0 0 8px 8px;background:color-mix(in srgb,var(--text) 30%,var(--line))}.onboarding-preview-display-options{display:flex;justify-content:center;gap:.45rem}.onboarding-preview-display-options span,.onboarding-preview-display-options strong{padding:.4rem .65rem;border:1px solid var(--line);border-radius:99px;font-size:10px}.onboarding-preview-display-options strong{border-color:var(--accent);color:var(--background);background:var(--accent)}

.onboarding-preview-programs{gap:clamp(.6rem,1.7vw,1rem)}.onboarding-preview-find,.onboarding-preview-publish{width:min(340px,39%);padding:1rem;border:1px solid var(--line);border-radius:17px;background:var(--panel);box-shadow:0 18px 45px rgba(0,0,0,.2)}.onboarding-preview-find{display:grid;gap:.55rem}.onboarding-preview-find header{margin:0}.onboarding-preview-find article{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.55rem;padding:.65rem;border-radius:10px}.onboarding-preview-find article>span{font-size:17px}.onboarding-preview-find article div{display:grid;gap:.08rem}.onboarding-preview-find article strong{font-size:11px}.onboarding-preview-find article b{padding:.25rem .4rem;border-radius:99px;color:var(--accent);background:var(--soft-green);font-size:9px}.onboarding-preview-program-flow{display:flex;align-items:center;gap:.28rem;color:var(--muted);font-size:9px;text-transform:uppercase}.onboarding-preview-program-flow i{color:var(--accent);font-style:normal}.onboarding-preview-publish{display:grid;gap:.45rem}.onboarding-preview-publish header{margin:0}.onboarding-preview-publish label{display:grid;gap:.14rem}.onboarding-preview-publish label span{color:var(--muted);font-size:9px}.onboarding-preview-publish label strong{padding:.38rem .5rem;border:1px solid var(--line);border-radius:7px;background:var(--panel-2);font-size:10px}.onboarding-preview-publish button{justify-self:end;padding:.42rem .85rem;border:0;border-radius:8px;color:var(--background);background:var(--accent);font-size:10px;font-weight:800}

.onboarding-preview-ready-display{width:min(650px,92%);padding:1rem;border:1px solid var(--soft-green-border);border-radius:18px;background:var(--panel);box-shadow:0 22px 60px rgba(0,0,0,.28)}.onboarding-preview-ready-display>header{display:grid;place-items:center;margin-bottom:.65rem;padding:.6rem;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}.onboarding-preview-ready-display>header span{color:var(--accent);font-size:10px;font-weight:800;letter-spacing:.14em}.onboarding-preview-ready-display>header strong{font-size:30px;line-height:1.1}.onboarding-preview-ready-display>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.onboarding-preview-ready-display article{display:grid;gap:.12rem;padding:.7rem;border-radius:11px}.onboarding-preview-ready-display article strong{font-size:13px}.onboarding-preview-ready-display>footer{display:flex;justify-content:center;gap:.45rem;margin-top:.65rem}.onboarding-preview-ready-display>footer span{padding:.36rem .65rem;border-radius:99px;color:var(--accent);background:var(--soft-green);font-size:10px;font-weight:800}

@media(max-height:800px) and (min-width:621px){.onboarding-shell{height:min(690px,94vh)}.onboarding-preview{height:320px;padding:1rem}.onboarding-slide{grid-template-rows:320px auto auto auto}.onboarding-slide h2{font-size:2rem}.onboarding-slide>.section-label{margin-top:.4rem}.onboarding-footer{padding-top:.7rem}}
@media(max-width:620px){.onboarding-dialog{width:calc(100vw - 12px);max-height:calc(100vh - 12px);border-radius:18px}.onboarding-shell{height:calc(100vh - 12px);min-height:0;padding:.8rem}.onboarding-skip{top:.55rem;right:.75rem}.onboarding-progress{padding:.15rem 4.5rem .55rem}.onboarding-slide{grid-template-rows:minmax(260px,1fr) auto auto auto}.onboarding-preview{height:clamp(260px,42vh,320px);padding:.65rem;border-radius:16px}.onboarding-slide h2{font-size:1.65rem}.onboarding-slide>p:not(.section-label){font-size:.86rem;line-height:1.35}.onboarding-slide>.section-label{margin:.45rem 0 0;font-size:.68rem}.onboarding-footer{gap:.55rem;padding-top:.55rem}.onboarding-dismiss-choice{padding:.5rem .7rem;font-size:.8rem}.onboarding-actions{gap:.55rem}.onboarding-actions button{min-height:40px}.onboarding-preview-board{width:100%;padding:.65rem}.onboarding-preview-board>header{margin-bottom:.45rem}.onboarding-preview-board>header strong{font-size:13px}.onboarding-preview-session-grid{gap:.35rem}.onboarding-preview-session-grid article{min-height:65px;padding:.42rem .5rem}.onboarding-preview-session-grid strong{font-size:11px}.onboarding-preview small{font-size:9px}.onboarding-preview-dates{gap:.2rem;margin-top:.4rem}.onboarding-preview-organize{gap:.4rem}.onboarding-preview-calendars{width:64%;padding:.55rem}.onboarding-preview-calendars>div{gap:.35rem}.onboarding-preview-calendars article{display:grid;grid-template-columns:auto 1fr;padding:.4rem;gap:0 .35rem}.onboarding-preview-calendars strong{font-size:10px}.onboarding-preview-permissions{width:36%;gap:.35rem;padding:.55rem}.onboarding-preview-permissions>strong{font-size:12px}.onboarding-preview-people i,.onboarding-preview-people b{width:22px;height:22px;font-size:7px}.onboarding-preview-permission-chips{flex-wrap:wrap}.onboarding-preview-phone{width:88px;border-radius:14px}.onboarding-preview-phone>div{height:150px;padding:.45rem .35rem}.onboarding-preview-phone>div>span{font-size:8px}.onboarding-preview-phone article{padding:.35rem}.onboarding-preview-phone article strong,.onboarding-preview-phone>div>b{font-size:8px}.onboarding-preview-tv-wrap{width:62%}.onboarding-preview-tv>div{padding:.45rem}.onboarding-preview-tv header b{font-size:14px}.onboarding-preview-tv section{gap:.3rem}.onboarding-preview-tv article{padding:.35rem}.onboarding-preview-display-options span,.onboarding-preview-display-options strong{padding:.32rem .42rem;font-size:8px}.onboarding-preview-programs{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}.onboarding-preview-find,.onboarding-preview-publish{width:100%;height:100%;padding:.55rem}.onboarding-preview-program-flow{position:absolute;bottom:.35rem;left:50%;transform:translateX(-50%);white-space:nowrap}.onboarding-preview-find article{grid-template-columns:auto 1fr;padding:.4rem;gap:.3rem}.onboarding-preview-find article>b{grid-column:2;justify-self:start}.onboarding-preview-publish{gap:.3rem}.onboarding-preview-publish label strong{font-size:8px}.onboarding-preview-ready-display{width:100%;padding:.65rem}.onboarding-preview-ready-display>header{margin-bottom:.4rem;padding:.4rem}.onboarding-preview-ready-display>header strong{font-size:24px}.onboarding-preview-ready-display>footer{gap:.25rem;margin-top:.4rem}.onboarding-preview-ready-display>footer span{padding:.3rem .4rem;font-size:8px}.onboarding-feature-chips{display:none}.onboarding-more{display:none}}
@media(max-width:620px){.onboarding-dialog{width:calc(100% - 12px);max-width:calc(100% - 12px)}.onboarding-slide{grid-template-rows:auto auto auto auto}}

/* Training import */
.import-training-dialog{width:min(760px,calc(100vw - 28px));max-height:calc(100vh - 28px);padding:0;overflow:hidden}.import-training-content{max-height:calc(100vh - 28px);overflow:auto;padding:clamp(1.1rem,3vw,2rem)}.import-training-heading{padding-right:2rem}.import-training-heading h2{margin:.15rem 0 .35rem}.import-upload-actions{display:grid;place-items:center;gap:.75rem;min-height:190px;margin-top:1.25rem;padding:2rem;border:1px dashed var(--soft-green-border);border-radius:18px;background:var(--panel-2)}.import-template-download{display:flex;align-items:center;justify-content:center;gap:.45rem;margin-top:1rem;color:var(--muted);font-size:.9rem}.import-template-link{color:var(--accent);font-weight:800}.import-error{min-height:1.25rem;color:#e36c6c}.import-config,.import-preview{display:grid;gap:1rem;margin-top:1.2rem}.import-file-summary,.import-preview-hero{display:grid;gap:.2rem;padding:1rem;border:1px solid var(--soft-green-border);border-radius:14px;background:var(--soft-green)}.import-file-summary span,.import-preview-hero span{color:var(--muted);font-size:.86rem}.segmented-control{display:flex;gap:.3rem;padding:.25rem;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}.segmented-control button{flex:1;padding:.65rem;border:0;border-radius:9px;color:var(--muted);background:transparent;font-weight:800}.segmented-control button.active{color:var(--background);background:var(--accent)}.import-field{display:grid;gap:.35rem}.import-field>span{font-weight:800}.import-field>small{color:var(--muted)}.import-field input,.import-field select{width:100%;min-height:44px}.import-type-mappings{display:grid;gap:.7rem}.import-field.warning{padding:.8rem;border:1px solid #b98637;border-radius:12px;background:color-mix(in srgb,#b98637 9%,var(--panel))}.import-validation{display:grid;gap:.35rem;padding:1rem;border:1px solid var(--line);border-radius:14px;background:var(--panel-2)}.import-validation p{margin:0;font-size:.88rem}.import-validation .success{color:var(--accent)}.import-validation .warning{color:#d6a554}.import-validation .error{color:#e36c6c}.import-dialog-actions{position:sticky;bottom:-2rem;margin:0 -2rem -2rem;padding:1rem 2rem;background:linear-gradient(transparent,var(--panel) 25%)}.import-preview-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.import-preview-facts>div{display:grid;gap:.2rem;padding:.8rem;border:1px solid var(--line);border-radius:12px}.import-preview-facts span{color:var(--muted);font-size:.75rem;text-transform:uppercase}.import-duplicates{display:grid;gap:.5rem;padding:1rem;border:1px solid #b98637;border-radius:14px;background:color-mix(in srgb,#b98637 9%,var(--panel))}.import-duplicates p{margin:0}.import-preview-weeks{display:grid;gap:1rem}.import-preview-week{display:grid;gap:.5rem}.import-preview-week h3{margin:0;color:var(--accent);font-size:.86rem;letter-spacing:.08em;text-transform:uppercase}.import-preview-board{display:grid;grid-template-columns:72px 1fr;align-items:center;gap:.75rem;padding:.75rem;border:1px solid var(--line);border-radius:12px;background:var(--panel-2)}.import-preview-board time{font-weight:900;text-transform:uppercase}.import-preview-board>div{display:grid;gap:.12rem}.import-preview-board span{color:var(--muted);font-size:.82rem}.import-preview-board.duplicate{border-color:#b98637}.import-success{display:grid;place-items:center;gap:.55rem;padding:1rem;text-align:center}.import-success-icon{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;color:var(--background);background:var(--accent);font-size:2rem;font-weight:900}.import-success h2{margin:.4rem 0 0}.import-success>p{margin:0;color:var(--muted)}.import-success-detail{display:grid;gap:.2rem;width:min(360px,100%);margin:1rem 0;padding:1rem;border:1px solid var(--line);border-radius:14px;background:var(--panel-2)}.import-success-detail span{color:var(--muted)}
@media(max-width:700px){.calendar-header-actions{flex-wrap:wrap}.calendar-import-button{order:3;width:100%}.import-training-dialog{width:calc(100vw - 12px);max-height:calc(100vh - 12px)}.import-training-content{max-height:calc(100vh - 12px);padding:1rem}.import-preview-facts{grid-template-columns:1fr}.import-dialog-actions{bottom:-1rem;margin:0 -1rem -1rem;padding:1rem}.segmented-control{flex-direction:column}.import-preview-board{grid-template-columns:62px 1fr}.import-upload-actions{min-height:150px;padding:1.25rem}.import-template-download{flex-direction:column}.import-dialog-actions button{flex:1}}
.gym-display-rotation-setting { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: 12px; background: var(--panel-soft); }
.gym-display-rotation-setting span { display: grid; gap: .2rem; }
.gym-display-rotation-setting small { color: var(--muted); }
.gym-display-rotation-setting select { width: auto; min-width: 8.5rem; }