:root {
  color-scheme: dark;
  --pine: #103c32;
  --pine-deep: #062a22;
  --clay: #bc4c2e;
  --clay-deep: #9f3c25;
  --court: #c95834;
  --court-dark: #b94a2c;
  --surface: #1e4c3d;
  --lime: #e6eb47;
  --coral: #7c211d;
  --cream: #fff8e8;
  --ink: #fff8e8;
  --muted: #d8d3bf;
  --line: rgba(255, 248, 232, 0.96);
}

* { box-sizing: border-box; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  color: var(--ink);
  background:
    linear-gradient(rgba(6, 42, 34, .95), rgba(6, 42, 34, .98)),
    url("assets/clay-texture.png") center / 900px repeat,
    var(--pine-deep);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
button { font: inherit; }
.app-shell { width: min(100%, 760px); margin: 0 auto; padding: max(1.25rem, env(safe-area-inset-top)) 1rem max(2rem, env(safe-area-inset-bottom)); }
.app-header, .session-heading, .results-heading, .history-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.app-header { margin-bottom: 1.2rem; }
.brand-lockup { display: flex; align-items: center; gap: .75rem; }
.header-actions { display: flex; flex-direction: column; align-items: flex-end; gap: .55rem; }
.ball-mark { position: relative; flex: 0 0 auto; width: 2.25rem; aspect-ratio: 1; border-radius: 50%; background: var(--lime); box-shadow: inset 0 0 0 2px rgba(6,42,34,.18); overflow: hidden; }
.ball-mark::before, .ball-mark::after { content: ""; position: absolute; width: 2.2rem; height: 2.2rem; border: 2px solid var(--pine); border-radius: 50%; }.ball-mark::before { left: -1.55rem; top: -.15rem; }.ball-mark::after { right: -1.55rem; bottom: -.15rem; }
h1, h2, h3, p { margin: 0; }
h1 { font-size: clamp(1.7rem, 5vw, 2.25rem); letter-spacing: -0.055em; }
h2 { font-size: clamp(1.25rem, 4vw, 1.65rem); letter-spacing: -0.04em; }
h3 { font-size: 1.15rem; letter-spacing: -0.025em; }
.eyebrow, .step { color: var(--lime); font-size: .68rem; font-weight: 800; letter-spacing: .12em; }
.intro-card { margin-bottom: 1rem; padding: 1.15rem; border: 1px solid rgba(255,248,232,.25); border-radius: 1rem; background: rgba(13, 55, 44, .84); }
.sync-status { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .65rem; width: 100%; min-height: 3.35rem; margin: 0 0 .75rem; padding: .65rem .8rem; border: 1px solid rgba(255,248,232,.22); border-radius: .85rem; color: var(--cream); background: rgba(13,55,44,.86); text-align: left; cursor: pointer; }
.sync-status:disabled { cursor: wait; }
.sync-status:focus-visible { outline: 3px solid var(--lime); outline-offset: 2px; }
.sync-status-indicator { width: .72rem; height: .72rem; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 .22rem rgba(230,235,71,.12); }
.sync-status-copy { min-width: 0; }
.sync-status-copy strong, .sync-status-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sync-status-copy strong { font-size: .75rem; }
.sync-status-copy small { margin-top: .13rem; color: var(--muted); font-size: .59rem; font-weight: 650; }
.sync-status-action { color: var(--lime); font-size: .65rem; font-weight: 850; white-space: nowrap; }
.sync-status.sync-syncing .sync-status-indicator { animation: sync-pulse .8s ease-in-out infinite alternate; }
.sync-status.sync-offline .sync-status-indicator { background: #d8a14b; box-shadow: 0 0 0 .22rem rgba(216,161,75,.12); }
.sync-status.sync-error .sync-status-indicator { background: #ef9a87; box-shadow: 0 0 0 .22rem rgba(239,154,135,.12); }
.sync-status.sync-syncing .sync-status-action { visibility: hidden; }
@keyframes sync-pulse { to { opacity: .35; transform: scale(.78); } }
.intro-card h2 { margin: .25rem 0 .45rem; }
.intro-card p:last-child, .instruction { color: var(--muted); line-height: 1.45; }
.hidden { display: none !important; }
.court-stage { position: relative; width: 100%; padding: 1.35rem 1rem; border: 1px solid rgba(255,248,232,.16); border-radius: 1.4rem; background: var(--surface); box-shadow: 0 1rem 3rem rgba(0,0,0,.25); }
.selection-stage { padding-top: 1.75rem; padding-bottom: 1rem; }
.direction-label { position: absolute; left: 0; width: 100%; text-align: center; color: rgba(255,255,255,.72); font-size: .58rem; font-weight: 800; letter-spacing: .12em; pointer-events: none; }
.direction-label.opponent { top: .48rem; }
.direction-label.player { bottom: .48rem; }
.court { position: relative; width: min(100%, 420px); aspect-ratio: .58; margin: 0 auto; overflow: hidden; border: 2px solid var(--line); background: linear-gradient(rgba(189, 76, 43, .83), rgba(189, 76, 43, .83)), url("assets/clay-texture.png") center / 420px auto; }
.court::before, .court::after { content: ""; position: absolute; left: 0; z-index: 1; width: 100%; height: 2px; background: var(--line); pointer-events: none; }
.court::before { top: 50%; }.court::after { top: 20%; }
.court-net { position: absolute; z-index: 2; top: calc(50% - 4px); left: -2%; width: 104%; height: 8px; border-top: 2px solid var(--line); border-bottom: 2px solid var(--line); background: rgba(255,255,255,.18); pointer-events: none; }
.service-line { position: absolute; z-index: 1; left: 0; width: 100%; height: 2px; background: var(--line); pointer-events: none; }
.service-line.far { top: 35%; }.service-line.near { top: 65%; }
.center-line { position: absolute; z-index: 1; top: 20%; left: 50%; width: 2px; height: 60%; background: var(--line); pointer-events: none; }
.court-note { position: absolute; z-index: 2; top: 52%; width: 100%; color: rgba(255,255,255,.6); font-size: .61rem; font-weight: 800; letter-spacing: .13em; text-align: center; pointer-events: none; }
.target-zone { position: absolute; z-index: 3; width: 50%; padding: 0; border: 0; color: white; background: transparent; cursor: pointer; transition: background .16s ease, box-shadow .16s ease; }
.target-zone:hover, .target-zone:focus-visible { outline: 3px solid var(--lime); outline-offset: -4px; background: rgba(220,255,55,.18); }
.target-zone.selected { color: #163b2c; background: var(--lime); box-shadow: inset 0 0 0 4px var(--cream); }
.target-zone span { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 90%; font-size: clamp(.65rem, 2.4vw, .88rem); font-weight: 800; line-height: 1.15; }
.target-zone.baseline { top: 0; height: 20%; }.target-zone.service { top: 35%; height: 15%; }
.ad { left: 0; }.deuce { right: 0; }
.selection-court { aspect-ratio: 1.25; }
.selection-court::before { top: 50%; }
.selection-court::after, .selection-court .court-net, .selection-court .service-line, .selection-court .court-note { display: none; }
.selection-court .center-line { top: 0; height: 100%; }
.selection-court .target-zone.baseline { top: 0; height: 50%; }
.selection-court .target-zone.service { top: 50%; height: 50%; }
.tracking-court::before { top: 50%; }
.tracking-court::after, .tracking-court .service-line.near { display: none; }
.tracking-court .service-line.far { top: 25%; }
.tracking-court .center-line { top: 0; height: 50%; }
.selected-target { min-height: 1.6rem; margin: .85rem 0 .25rem; text-align: center; color: var(--muted); font-weight: 650; }
.session-name-field { display: block; margin: .8rem 0; }
.session-name-field > span { display: flex; justify-content: space-between; margin-bottom: .4rem; color: var(--cream); font-size: .78rem; font-weight: 750; }
.session-name-field small { color: var(--muted); font-size: .68rem; font-weight: 600; }
.session-name-field input { width: 100%; min-height: 3.35rem; padding: .8rem .95rem; border: 1px solid rgba(255,248,232,.3); border-radius: .85rem; color: var(--cream); background: rgba(255,248,232,.08); font-size: 1rem; outline: none; }
.session-name-field input:focus { border-color: var(--lime); box-shadow: 0 0 0 3px rgba(230,235,71,.15); }
.session-name-field input::placeholder { color: rgba(216,211,191,.65); }
.player-selector { margin: .8rem 0; }
.player-selector > span { display: block; margin-bottom: .4rem; color: var(--cream); font-size: .78rem; font-weight: 750; }
.tag-options, .history-filters { display: flex; gap: .5rem; }
.tag-option, .history-filter { min-height: 2.7rem; padding: .5rem .85rem; border: 1px solid rgba(255,248,232,.3); border-radius: .7rem; color: var(--cream); background: rgba(255,248,232,.08); font-size: .78rem; font-weight: 800; cursor: pointer; }
.tag-option.selected, .history-filter.selected { border-color: var(--lime); color: #163b2c; background: var(--lime); }
.tag-option:focus-visible, .history-filter:focus-visible { outline: 3px solid var(--lime); outline-offset: 2px; }
.last-session { margin: 0 0 .8rem; color: var(--cream); font-size: .78rem; text-align: center; }
.primary-button { width: 100%; min-height: 3.5rem; border: 0; border-radius: .85rem; color: #163b2c; background: var(--lime); font-weight: 850; cursor: pointer; }
.primary-button:disabled { color: rgba(255,248,232,.55); background: #3a6658; cursor: not-allowed; }
.text-button, .reset-button { border: 0; color: var(--muted); background: transparent; cursor: pointer; font-size: .82rem; font-weight: 750; text-decoration: underline; text-underline-offset: .2rem; }
.session-heading { margin-bottom: .8rem; }.session-heading h2 { margin-top: .25rem; }.instruction { color: var(--muted); }
.session-meta { margin-top: .25rem; color: var(--muted); font-size: .75rem; line-height: 1.35; }
.session-player, .player-tag { display: inline-flex; align-items: center; width: fit-content; margin-top: .4rem; padding: .22rem .5rem; border-radius: 999px; color: #163b2c; background: var(--lime); font-size: .68rem; font-weight: 850; }
.ball-count { min-width: 4.4rem; padding: .55rem .65rem; border-radius: .8rem; text-align: center; background: rgba(230,235,71,.14); }
.ball-count strong { display: block; color: var(--lime); font-size: 1.4rem; line-height: 1; }.ball-count span { color: var(--muted); font-size: .7rem; }
.session-control-row { display: flex; align-items: stretch; justify-content: space-between; gap: .45rem; margin-bottom: .5rem; }
.session-control-row .ball-count { min-width: 3.55rem; padding: .38rem .5rem; }
.session-control-row .ball-count strong { font-size: 1.18rem; }
.session-control-row .ball-count span { font-size: .62rem; }
.session-control-row .rotate-button { min-height: 2.45rem; padding: .4rem .62rem; font-size: .7rem; }
.session-control-row .active-session-actions { margin-left: auto; }
.tracker-toolbar { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .3rem; }
.rotate-button { min-height: 2.7rem; padding: .55rem .75rem; border: 1px solid rgba(255,248,232,.28); border-radius: .75rem; color: var(--cream); background: rgba(255,248,232,.08); font-size: .76rem; font-weight: 800; cursor: pointer; white-space: nowrap; }
.rotation-copy { margin-bottom: .65rem; color: var(--lime); font-size: .68rem; font-weight: 750; }
.tracking-stage { padding: .65rem; overflow: hidden; }
.tracking-map { position: relative; width: min(100%, 430px); aspect-ratio: 1; margin: 0 auto; transition: transform .24s ease; }
.tracking-map.orientation-0 { transform: rotate(0deg); }
.tracking-map.orientation-90 { transform: rotate(90deg); }
.tracking-map.orientation-180 { transform: rotate(180deg); }
.tracking-map.orientation-270 { transform: rotate(270deg); }
.tracking-map.orientation-90 .button-copy { transform: rotate(-90deg); }
.tracking-map.orientation-180 .button-copy { transform: rotate(-180deg); }
.tracking-map.orientation-270 .button-copy { transform: rotate(-270deg); }
.tracking-court { position: absolute; inset: 4.25rem; width: auto; max-width: none; aspect-ratio: 1; margin: 0; }
.tracking-court::before { top: 50%; }
.tracking-court::after { display: none; }
.tracking-court .center-line { top: 0; height: 100%; }
.outcome-button { position: absolute; z-index: 5; display: flex; align-items: center; justify-content: center; border: 0; border-radius: .85rem; color: var(--cream); background: var(--coral); box-shadow: 0 .3rem .75rem rgba(0,0,0,.28); font-size: .82rem; font-weight: 850; cursor: pointer; touch-action: manipulation; }
.outcome-button:active { filter: brightness(1.16); }.outcome-button:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.button-copy { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding: .25rem; line-height: 1.05; text-align: center; transition: transform .24s ease; }
.outcome-button.long, .outcome-button.short { left: 50%; width: 6.5rem; min-height: 3.55rem; transform: translateX(-50%); }
.outcome-button.long { top: .25rem; }.outcome-button.short { bottom: .25rem; }
.outcome-button.wide { top: 50%; left: .25rem; width: 3.55rem; min-height: 6.5rem; transform: translateY(-50%); }
.outcome-button.wide.deuce { right: .25rem; left: auto; }
.outcome-button.in { width: 50%; height: 50%; min-height: 0; color: #163b2c; background: var(--lime); box-shadow: inset 0 0 0 3px var(--cream), 0 .25rem .6rem rgba(0,0,0,.25); font-size: 1.05rem; }
.outcome-button.in[data-target="baseline-ad"] { left: 0; top: 0; }.outcome-button.in[data-target="baseline-deuce"] { left: 50%; top: 0; }.outcome-button.in[data-target="service-ad"] { left: 0; top: 50%; }.outcome-button.in[data-target="service-deuce"] { left: 50%; top: 50%; }
.outcome-button.other-side { left: var(--other-left); top: var(--other-top); width: 50%; height: var(--other-height); min-height: 0; }
.results-card { margin-top: 1.2rem; padding: 1.15rem; border: 1px solid rgba(255,248,232,.2); border-radius: 1rem; background: rgba(13, 55, 44, .88); }.results-heading { margin-bottom: 1rem; }
.result-breakdown { display: grid; grid-template-columns: repeat(5, 1fr); gap: .4rem; }.result { padding: .55rem .22rem; border-radius: .65rem; text-align: center; background: rgba(255,248,232,.1); }.result.on-target { background: rgba(230,235,71,.18); }.result strong { display: block; font-size: .93rem; }.result span { display: block; margin-top: .12rem; color: var(--muted); font-size: .59rem; font-weight: 700; }.result.on-target strong { color: var(--lime); }
.accuracy-summary { display: grid; grid-template-columns: minmax(7rem, .9fr) minmax(8.5rem, 1.1fr); align-items: center; gap: 1rem; }
.accuracy-visual { min-width: 0; text-align: center; }
.accuracy-zones { position: relative; width: min(100%, 8rem); aspect-ratio: 1; margin: 0 auto; }
.accuracy-ring { position: absolute; display: block; border-radius: 50%; transition: border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.accuracy-ring.panic { inset: 0; border: .78rem solid rgba(214,95,73,.14); }
.accuracy-ring.learning { inset: 19%; border: .62rem solid rgba(127,191,106,.14); }
.accuracy-ring.comfort { inset: 39%; border: 1px solid rgba(115,200,216,.24); background: rgba(115,200,216,.1); }
.zone-panic .accuracy-ring.panic { border-color: #d65f49; box-shadow: 0 0 1rem rgba(214,95,73,.4); }
.zone-learning .accuracy-ring.learning { border-color: #7fbf6a; box-shadow: 0 0 .9rem rgba(127,191,106,.38); }
.zone-comfort .accuracy-ring.comfort { border-color: #b7e8ef; background: #73c8d8; box-shadow: 0 0 .9rem rgba(115,200,216,.48); }
.accuracy-value { position: absolute; z-index: 3; top: 50%; left: 50%; color: var(--cream); font-size: .78rem; line-height: 1; transform: translate(-50%, -50%); }
.zone-comfort .accuracy-value { color: #07342c; }
.accuracy-zone-label { display: block; margin-top: .38rem; color: var(--muted); font-size: .68rem; font-weight: 800; }
.zone-panic .accuracy-zone-label { color: #ef9a87; }.zone-learning .accuracy-zone-label { color: #a9d79a; }.zone-comfort .accuracy-zone-label { color: #9bdce7; }
.accuracy-totals { display: grid; gap: .55rem; }
.accuracy-stat { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: .1rem .55rem; padding: .72rem .8rem; border: 1px solid rgba(255,248,232,.1); border-radius: .72rem; background: rgba(255,248,232,.08); }
.accuracy-stat span { color: var(--cream); font-size: .74rem; font-weight: 800; }
.accuracy-stat strong { font-size: 1.15rem; line-height: 1; }
.accuracy-stat small { grid-column: 1 / -1; color: var(--muted); font-size: .6rem; font-weight: 700; }
.accuracy-stat.on-target strong, .accuracy-stat.in strong { color: var(--lime); }.accuracy-stat.out strong { color: #ef9a87; }
.history-heading { margin-bottom: 1rem; }
.history-filters { margin: 0 0 .8rem; }
.history-filter { min-height: 2.35rem; padding: .4rem .72rem; }
.history-list { display: grid; gap: .8rem; }
.history-empty { padding: 2rem 1rem; border: 1px dashed rgba(255,248,232,.28); border-radius: 1rem; color: var(--muted); text-align: center; }
.history-card { padding: 1rem; border: 1px solid rgba(255,248,232,.2); border-radius: 1rem; background: rgba(13,55,44,.88); }
.history-card-header { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .35rem; }
.history-card h3 { color: var(--cream); }
.history-date, .history-targets { color: var(--muted); font-size: .7rem; line-height: 1.4; }
.history-date { flex: 0 0 auto; text-align: right; }
.history-card-actions { display: grid; justify-items: end; gap: .35rem; }
.rename-history-button, .delete-history-button { min-height: 2.1rem; padding: .35rem .65rem; border: 1px solid rgba(255,248,232,.26); border-radius: .55rem; font-size: .7rem; font-weight: 800; cursor: pointer; }
.rename-history-button { color: var(--cream); background: rgba(255,248,232,.08); }
.delete-history-button { color: #fff0e8; background: rgba(124,33,29,.76); }
.rename-history-button:focus-visible, .delete-history-button:focus-visible { outline: 3px solid var(--lime); outline-offset: 2px; }
.history-card .result-breakdown { margin-top: .8rem; }
.history-total { margin-top: .7rem; color: var(--cream); font-size: .75rem; font-weight: 750; }
@media (min-width: 620px) { .app-shell { padding-top: 2rem; }.court-stage { padding-left: 3.7rem; padding-right: 3.7rem; }.selection-stage { padding-top: 1.75rem; }.tracking-stage { padding: 1rem; }.court { max-width: 380px; }.tracking-court { max-width: none; } }
@media (max-width: 390px) { .result-breakdown { gap: .25rem; }.app-header { gap: .5rem; }.header-actions { gap: .4rem; }.tracking-court { inset: 4rem; }.outcome-button.long, .outcome-button.short { width: 6rem; min-height: 3.35rem; }.outcome-button.wide { width: 3.35rem; min-height: 6rem; } }

/* Full-court challenge picker and saved-session map. */
.sessions-button { min-height: 2.7rem; padding: .5rem .85rem; border: 1px solid rgba(255,248,232,.7); border-radius: .7rem; color: var(--cream); background: transparent; font-size: .78rem; font-weight: 850; cursor: pointer; }
.sessions-button:focus-visible { outline: 3px solid var(--lime); outline-offset: 2px; }
.active-session-actions { display: flex; gap: .45rem; }
.intro-card h2 { margin-top: 0; }
.selection-stage { padding: .8rem; }
#selection-court { padding: 1.7rem 2rem; }
.court-legend, .court-feed-legend { margin: .1rem 0 .65rem; color: var(--muted); font-size: .6rem; font-weight: 850; letter-spacing: .1em; text-align: center; }
.court-feed-legend { margin: .65rem 0 .1rem; color: var(--lime); }
.court-diagram { position: relative; width: 100%; max-width: 680px; aspect-ratio: 2.167; margin: 0 auto; overflow: visible; border: 2px solid var(--line); background: linear-gradient(rgba(189, 76, 43, .9), rgba(189, 76, 43, .9)), url("assets/clay-texture.png") center / 600px auto; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.court-diagram::before { content: ""; position: absolute; inset: 0; border: 1px solid rgba(255,248,232,.45); pointer-events: none; }
.diagram-line { position: absolute; z-index: 1; display: block; background: var(--line); pointer-events: none; }
.diagram-line.left-service-line { top: 12.5%; bottom: 12.5%; left: 23.08%; width: 2px; }
.diagram-line.right-service-line { top: 12.5%; bottom: 12.5%; left: 76.92%; width: 2px; }
.diagram-line.top-singles-sideline { top: 12.5%; left: 0; width: 100%; height: 2px; }
.diagram-line.bottom-singles-sideline { top: 87.5%; left: 0; width: 100%; height: 2px; }
.diagram-line.center-service-line { top: 50%; left: 23.08%; width: 53.84%; height: 2px; }
.diagram-net { position: absolute; z-index: 4; top: -2%; bottom: -2%; left: calc(50% - 4px); width: 8px; border-right: 2px solid var(--cream); border-left: 2px solid var(--cream); background: repeating-linear-gradient(0deg, rgba(255,248,232,.42) 0 2px, rgba(6,42,34,.1) 2px 5px); box-shadow: 0 0 0 1px rgba(6,42,34,.18); pointer-events: none; }
.court-target { position: absolute; z-index: 2; display: flex; align-items: center; justify-content: center; margin: 0; padding: .35rem; border: 1px solid rgba(255,248,232,.72); color: var(--cream); background: rgba(6,42,34,.12); font-size: clamp(.58rem, 2.55vw, .86rem); font-weight: 850; line-height: 1.1; text-align: center; }
.interactive-court .court-target { cursor: pointer; touch-action: manipulation; }
.interactive-court .court-target:hover, .interactive-court .court-target:focus-visible { outline: 3px solid var(--lime); outline-offset: -4px; background: rgba(230,235,71,.22); }
.court-target.selected { color: #163b2c; background: var(--lime); box-shadow: inset 0 0 0 2px var(--cream); }
.interactive-court .court-target.unavailable { cursor: not-allowed; opacity: .3; filter: saturate(.35); }
.court-target[data-target="baseline-ad"] { top: 12.5%; left: 0; width: 23.08%; height: 37.5%; }
.court-target[data-target="baseline-deuce"] { top: 50%; left: 0; width: 23.08%; height: 37.5%; }
.court-target[data-target="service-ad"] { top: 12.5%; left: 23.08%; width: 26.92%; height: 37.5%; }
.court-target[data-target="service-deuce"] { top: 50%; left: 23.08%; width: 26.92%; height: 37.5%; }
.feed-marker { position: absolute; z-index: 6; display: grid; width: 2.75rem; height: 2.75rem; padding: 0; border: 0; place-items: center; top: var(--feed-y); left: var(--feed-x); border-radius: 50%; color: inherit; background: transparent; font-size: 1.55rem; line-height: 1; transform: translate(-50%, -50%); }
.interactive-court .feed-marker { cursor: pointer; touch-action: manipulation; }
.interactive-court .feed-marker:hover, .interactive-court .feed-marker:focus-visible { outline: 3px solid var(--cream); outline-offset: 2px; }
.feed-marker.selected { border: 2px solid var(--cream); background: rgba(230,235,71,.24); box-shadow: 0 0 0 3px rgba(230,235,71,.38); transform: translate(-50%, -50%) scale(1.08); }
.history-card { padding: .8rem; }
.history-card-header { align-items: flex-start; margin-bottom: .55rem; }
.history-card h3 { font-size: 1rem; }
.history-title-line { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .5rem; min-width: 0; }
.history-title-line .player-tag { flex: 0 0 auto; margin-top: 0; }
.history-card-actions { display: grid; justify-items: end; gap: .2rem; }
.history-date { white-space: nowrap; }
.rename-history-button, .delete-history-button { min-height: 1.85rem; padding: .28rem .5rem; }
.history-glance { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(4.9rem, .65fr); align-items: center; gap: .65rem; }
.history-court-summary { min-width: 0; padding: .75rem 1rem; }
.history-court-summary .court-diagram { max-width: none; }
.history-glance-metrics { display: grid; justify-items: center; min-width: 0; }
.history-card .accuracy-summary { margin-top: .65rem; padding: .6rem; border-radius: .75rem; background: rgba(255,248,232,.055); }
.accuracy-summary.compact { grid-template-columns: 5.2rem minmax(0, 1fr); gap: .65rem; }
.accuracy-summary.compact .accuracy-zones { width: 4.7rem; }
.accuracy-summary.compact .accuracy-ring.panic { border-width: .46rem; }
.accuracy-summary.compact .accuracy-ring.learning { border-width: .36rem; }
.accuracy-summary.compact .accuracy-value { font-size: .6rem; }
.accuracy-summary.compact .accuracy-zone-label { margin-top: .2rem; font-size: .57rem; }
.accuracy-summary.compact .accuracy-totals { gap: .32rem; }
.accuracy-summary.compact .accuracy-stat { padding: .38rem .5rem; border-radius: .5rem; }
.accuracy-summary.compact .accuracy-stat span { font-size: .62rem; }
.accuracy-summary.compact .accuracy-stat strong { font-size: .82rem; }
.accuracy-summary.compact .accuracy-stat small { font-size: .52rem; }
.history-card .accuracy-summary.graph-only { display: block; margin: 0; padding: 0; background: transparent; }
.accuracy-summary.graph-only.compact .accuracy-zones { width: 4.5rem; }
.history-breakdown-disclosure { margin-top: .55rem; border-top: 1px solid rgba(255,248,232,.12); }
.history-breakdown-disclosure summary { display: flex; align-items: center; justify-content: space-between; min-height: 2.35rem; color: var(--cream); font-size: .68rem; font-weight: 850; cursor: pointer; list-style: none; touch-action: manipulation; }
.history-breakdown-disclosure summary::-webkit-details-marker { display: none; }
.history-breakdown-disclosure summary::after { content: "+"; display: grid; width: 1.35rem; height: 1.35rem; border: 1px solid rgba(255,248,232,.28); border-radius: 50%; place-items: center; color: var(--lime); font-size: .9rem; line-height: 1; }
.history-breakdown-disclosure[open] summary::after { content: "−"; }
.live-breakdown-disclosure { margin-top: .75rem; border-top: 1px solid rgba(255,248,232,.12); }
.live-breakdown-disclosure summary { display: flex; align-items: center; justify-content: space-between; min-height: 2.55rem; color: var(--cream); font-size: .72rem; font-weight: 850; cursor: pointer; list-style: none; touch-action: manipulation; }
.live-breakdown-disclosure summary::-webkit-details-marker { display: none; }
.live-breakdown-disclosure summary::after { content: "+"; display: grid; width: 1.4rem; height: 1.4rem; border: 1px solid rgba(255,248,232,.28); border-radius: 50%; place-items: center; color: var(--lime); font-size: .95rem; line-height: 1; }
.live-breakdown-disclosure[open] summary::after { content: "−"; }
.expanded-breakdown { padding: .2rem 0 .15rem; }
.expanded-shot-totals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem; }
.expanded-shot-total { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: .08rem .4rem; padding: .48rem .58rem; border-radius: .55rem; background: rgba(255,248,232,.075); }
.expanded-shot-total span { font-size: .63rem; font-weight: 800; }
.expanded-shot-total strong { font-size: .88rem; }
.expanded-shot-total small { grid-column: 1 / -1; color: var(--muted); font-size: .53rem; font-weight: 700; }
.expanded-shot-total.on-target strong, .expanded-shot-total.in strong { color: var(--lime); }.expanded-shot-total.out strong { color: #ef9a87; }
.miss-breakdown-label { margin: .55rem 0 .3rem; color: var(--muted); font-size: .57rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.history-card .history-miss-breakdown { display: grid; grid-template-columns: repeat(auto-fit, minmax(3.6rem, 1fr)); gap: .22rem; margin-top: 0; }
.history-card .result { padding: .3rem .18rem; border-radius: .42rem; }
.history-card .result strong { font-size: .74rem; }
.history-card .result span { margin: 0; font-size: .54rem; }
.history-card .result small { display: block; margin-top: .12rem; color: var(--muted); font-size: .48rem; font-weight: 700; }
.history-total { margin-top: .22rem; color: var(--muted); font-size: .6rem; text-align: center; }
.summary-court .court-target { color: rgba(255,248,232,.75); pointer-events: none; }
.summary-court .feed-marker { pointer-events: none; }
.summary-court .feed-marker:not(.selected) { display: none; }
.session-name-field small { color: var(--lime); }
@media (max-width: 390px) { #selection-court { padding: 1.45rem 1.6rem; }.court-target { font-size: .53rem; }.sessions-button { min-height: 2.55rem; padding: .45rem .7rem; }.feed-marker { width: 2.6rem; height: 2.6rem; font-size: 1.42rem; }.history-glance { grid-template-columns: minmax(0, 1fr) 4.7rem; gap: .4rem; }.history-court-summary { padding: .68rem .82rem; }.history-card .result { padding: .2rem .16rem; } }

/* Active sessions use a target-only scoring surface with contained outcome controls. */
.is-scoring .app-shell { padding-top: max(.7rem, env(safe-area-inset-top)); }
.is-scoring .app-header { display: none; }
.is-scoring .session-heading { margin-bottom: .35rem; }
.is-scoring .session-heading .step { font-size: .59rem; }
.is-scoring .session-heading h2 { font-size: clamp(1.22rem, 6vw, 1.55rem); }
.is-scoring .session-player { margin-top: .25rem; }
.tracking-stage { padding: 1rem; overflow: hidden; }
#scoring-court { width: 100%; }
.scoring-layout { display: grid; grid-template-columns: 17fr 60fr 19fr; grid-template-rows: 3.5rem 13rem 3.5rem; gap: .38rem; width: 100%; max-width: 36rem; margin: 0 auto; transition: transform .2s ease; }
.scoring-court { grid-column: 2; grid-row: 2; width: 100%; max-width: none; height: 100%; aspect-ratio: auto; }
.scoring-layout.inverted { transform: rotate(180deg); }
.scoring-layout.inverted .scoring-button, .scoring-layout.inverted .court-target { transform: rotate(180deg); }
.scoring-layout.inverted .scoring-cone { transform: rotate(180deg); }
.scoring-layout.inverted .scoring-cone:active { transform: rotate(180deg) scale(.94); }
.scoring-zone[data-target="baseline-ad"] { top: 0; left: 0; width: 50%; height: 50%; }
.scoring-zone[data-target="baseline-deuce"] { top: 50%; left: 0; width: 50%; height: 50%; }
.scoring-zone[data-target="service-ad"] { top: 0; left: 50%; width: 50%; height: 50%; }
.scoring-zone[data-target="service-deuce"] { top: 50%; left: 50%; width: 50%; height: 50%; }
.summary-court .feed-marker { width: 1.55rem; height: 1.55rem; font-size: .98rem; }
.summary-court .feed-marker.selected { border-width: 1px; box-shadow: 0 0 0 1px var(--cream), 0 0 0 3px rgba(230,235,71,.28); }
.scoring-button { position: absolute; z-index: 8; display: flex; align-items: center; justify-content: center; min-height: 2.75rem; padding: .35rem; border: 2px solid rgba(255,248,232,.72); border-radius: .7rem; color: var(--cream); background: var(--coral); box-shadow: 0 .22rem .55rem rgba(0,0,0,.24); font-size: clamp(.72rem, 2.7vw, 1rem); font-weight: 900; line-height: 1; text-align: center; cursor: pointer; touch-action: manipulation; }
.scoring-button:active { filter: brightness(1.16); }
.scoring-button:focus-visible { outline: 3px solid var(--lime); outline-offset: 2px; }
.scoring-zone { z-index: 9; border-radius: .35rem; box-shadow: inset 0 0 0 1px rgba(255,248,232,.45); }
.scoring-on-target { border-color: var(--cream); color: #163b2c; background: var(--lime); box-shadow: inset 0 0 0 2px var(--cream); }
.scoring-short, .scoring-deep, .scoring-other-side { border-color: rgba(255,248,232,.75); color: var(--cream); background: rgba(162,73,48,.82); }
.scoring-cone { position: absolute; z-index: 12; display: inline-flex; align-items: center; justify-content: center; gap: .12rem; min-width: 2.8rem; min-height: 2.15rem; padding: .22rem .28rem; border: 1px solid rgba(255,248,232,.82); border-radius: .52rem; color: var(--cream); background: rgba(6,42,34,.83); box-shadow: 0 .12rem .3rem rgba(0,0,0,.28); font-size: .62rem; font-weight: 950; cursor: pointer; touch-action: manipulation; }
.bullseye-icon { position: relative; display: block; width: 1.15rem; height: 1.15rem; border: .18rem solid #ffcc46; border-radius: 50%; background: #bc5139; box-shadow: inset 0 0 0 .16rem #f6f2dc; }
.bullseye-icon i { position: absolute; top: 50%; left: 50%; width: .3rem; height: .3rem; border-radius: 50%; background: #9c2f27; transform: translate(-50%, -50%); }
.scoring-cone > strong { font-size: .62rem; }
.scoring-cone:active { filter: brightness(1.16); transform: scale(.94); }
.scoring-cone:focus-visible { outline: 3px solid var(--lime); outline-offset: 2px; }
.scoring-cone-baseline-ad { top: .28rem; left: .28rem; }
.scoring-cone-baseline-deuce { top: calc(50% + .28rem); left: .28rem; }
.scoring-cone-service-ad { top: .28rem; left: calc(50% + .28rem); }
.scoring-cone-service-deuce { top: calc(50% + .28rem); left: calc(50% + .28rem); }
.scoring-long, .scoring-ad-wide, .scoring-deuce-wide, .scoring-net { position: relative; inset: auto; min-height: 0; }
.scoring-long, .scoring-ad-wide, .scoring-deuce-wide { border-color: rgba(223,235,227,.72); color: #e3eee8; background: rgba(44,91,75,.34); box-shadow: none; }
.scoring-long, .scoring-net { writing-mode: vertical-rl; text-orientation: upright; letter-spacing: .06em; }
.scoring-long { grid-column: 1; grid-row: 1 / 4; width: 100%; height: 100%; }
.scoring-ad-wide, .scoring-deuce-wide { grid-column: 2; justify-self: stretch; width: 100%; height: 100%; }
.scoring-ad-wide { grid-row: 1; }
.scoring-deuce-wide { grid-row: 3; }
.scoring-net { grid-column: 3; grid-row: 1 / 4; width: 100%; height: 100%; border-color: rgba(255,248,232,.88); background-color: rgba(6,42,34,.74); background-image: repeating-linear-gradient(0deg, transparent 0 .48rem, rgba(255,248,232,.28) .48rem .54rem), repeating-linear-gradient(90deg, transparent 0 .48rem, rgba(255,248,232,.22) .48rem .54rem); box-shadow: inset 0 0 0 1px rgba(255,248,232,.18), 0 .22rem .55rem rgba(0,0,0,.2); text-shadow: 0 1px 2px var(--pine-deep); }
@media (max-width: 480px) { .tracking-stage { padding: .9rem; }.scoring-layout { grid-template-rows: 3.25rem 12rem 3.25rem; gap: .32rem; }.scoring-button { border-radius: .58rem; font-size: .68rem; }.scoring-cone { min-width: 2.58rem; min-height: 2.05rem; }.summary-court .feed-marker { width: 1.4rem; height: 1.4rem; font-size: .88rem; } }
@media (max-width: 350px) { .tracking-stage { padding: .72rem; }.scoring-layout { grid-template-rows: 3rem 11rem 3rem; gap: .26rem; }.scoring-button { padding: .24rem; font-size: .62rem; } }
@media (max-width: 350px) { .session-control-row { gap: .28rem; }.session-control-row .ball-count { min-width: 3.15rem; padding: .34rem .36rem; }.session-control-row .rotate-button { padding: .35rem .42rem; font-size: .65rem; }.session-control-row .sessions-button { min-height: 2.45rem; padding: .4rem .5rem; font-size: .7rem; }.active-session-actions { gap: .28rem; } }
@media (max-width: 390px) { .accuracy-summary { grid-template-columns: 6.5rem minmax(0, 1fr); gap: .65rem; }.accuracy-zones { width: 6.5rem; }.accuracy-ring.panic { border-width: .64rem; }.accuracy-ring.learning { border-width: .5rem; }.accuracy-stat { padding: .58rem .62rem; }.accuracy-stat strong { font-size: 1rem; }.history-card .history-miss-breakdown { gap: .16rem; } }

/* Player-centred coaching workspace. */
.compact-header { align-items: center; min-height: 2.5rem; margin-bottom: 1rem; }
.brand-button { padding: 0; border: 0; color: var(--cream); background: transparent; cursor: pointer; }
.brand-name { font-size: 1.08rem; font-weight: 900; letter-spacing: -.05em; }
.compact-header .ball-mark { width: 1.9rem; }
.header-navigation { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; margin-left: auto; }
.header-button { margin-left: 0; }
.screen { min-width: 0; }
.screen-heading, .player-dashboard-heading, .section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
.screen-heading { margin-bottom: .9rem; }
.screen-heading h1, .player-dashboard-heading h1 { margin-top: .18rem; }
.screen-heading .text-button { padding-top: .2rem; }
.muted { color: var(--muted); font-size: .76rem; line-height: 1.4; }
.muted strong { color: var(--cream); }
.add-player-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; margin-bottom: .9rem; }
.add-player-row input, .class-details-card input, .class-details-card textarea, .analysis-card input, .analysis-card textarea { width: 100%; min-height: 2.85rem; padding: .65rem .75rem; border: 1px solid rgba(255,248,232,.28); border-radius: .7rem; color: var(--cream); background: rgba(255,248,232,.07); font: inherit; outline: none; }
.class-details-card textarea, .analysis-card textarea { min-height: 5rem; resize: vertical; line-height: 1.35; }
.add-player-row input:focus, .class-details-card input:focus, .class-details-card textarea:focus, .analysis-card input:focus, .analysis-card textarea:focus { border-color: var(--lime); box-shadow: 0 0 0 3px rgba(230,235,71,.13); }
.class-details-card input:disabled, .class-details-card textarea:disabled, .analysis-card input:disabled, .analysis-card textarea:disabled, .checkpoint:disabled, .technique-check-button:disabled, .analysis-counter > button:disabled { opacity: .68; cursor: default; }
.primary-small, .mini-button { min-height: 2.65rem; padding: .45rem .7rem; border: 1px solid rgba(255,248,232,.4); border-radius: .65rem; font-size: .72rem; font-weight: 850; cursor: pointer; }
.primary-small { border-color: var(--lime); color: #163b2c; background: var(--lime); }
.mini-button { color: var(--cream); background: rgba(255,248,232,.07); }
.mini-button.danger, .outline-button.danger { border-color: rgba(239,154,135,.65); color: #ffd4c7; }
.player-list, .timeline, .linked-sessions { display: grid; gap: .65rem; }
.empty-state, .not-available { padding: 1.1rem; border: 1px dashed rgba(255,248,232,.28); border-radius: .9rem; color: var(--muted); line-height: 1.45; text-align: center; }
.player-card, .timeline-card, .class-details-card, .workspace-section, .priority-card, .analysis-card, .linked-session-card { border: 1px solid rgba(255,248,232,.2); border-radius: .95rem; background: rgba(13,55,44,.88); }
.player-card { overflow: hidden; }
.player-card-main, .timeline-main, .linked-session-card > button { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .7rem; width: 100%; padding: .85rem; border: 0; color: var(--cream); background: transparent; text-align: left; cursor: pointer; }
.player-card-main > span:nth-child(2), .timeline-main > span:nth-child(2), .linked-session-card span:first-child { min-width: 0; }
.player-card strong, .timeline-card strong, .linked-session-card strong { display: block; overflow: hidden; color: var(--cream); font-size: .96rem; text-overflow: ellipsis; white-space: nowrap; }
.player-card small, .timeline-card small, .timeline-card em, .timeline-card span:not(.timeline-icon):not(.chevron), .linked-session-card small { display: block; margin-top: .17rem; color: var(--muted); font-size: .65rem; font-style: normal; line-height: 1.35; }
.player-card em { display: block; margin-top: .28rem; color: var(--lime); font-size: .61rem; font-style: normal; line-height: 1.25; }
.player-initial, .timeline-icon { display: grid; flex: 0 0 auto; width: 2.3rem; height: 2.3rem; border-radius: 50%; place-items: center; color: #163b2c; background: var(--lime); font-size: .95rem; font-weight: 900; }
.timeline-icon { color: var(--cream); background: rgba(230,235,71,.16); font-size: 1rem; }
.chevron { color: var(--lime); font-size: 1.5rem; line-height: 1; }
.card-actions { display: flex; justify-content: flex-end; gap: .4rem; padding: 0 .75rem .7rem; }
.archived { opacity: .72; }
.player-dashboard-heading { margin-bottom: .85rem; }
.header-actions-inline, .class-header-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; }
.dashboard-actions { display: grid; grid-template-columns: 1.3fr 1fr; gap: .55rem; margin-bottom: .8rem; }
.outline-button.large { display: grid; min-height: 3.5rem; padding: .65rem; border: 1px solid rgba(255,248,232,.48); border-radius: .85rem; place-items: center; color: var(--cream); background: rgba(255,248,232,.06); font-weight: 850; cursor: pointer; }
.player-stats { display: grid; grid-template-columns: minmax(0, 1fr); gap: .45rem; margin-bottom: .55rem; }
.player-stats > div { min-width: 0; padding: .7rem .5rem; border-radius: .7rem; background: rgba(255,248,232,.08); text-align: center; }
.player-stats strong { display: block; color: var(--lime); font-size: 1.15rem; }
.player-stats span { display: block; overflow: hidden; margin-top: .14rem; color: var(--muted); font-size: .55rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.topic-summary, .topic-selector { border: 1px solid rgba(255,248,232,.16); border-radius: .7rem; overflow: hidden; background: rgba(255,248,232,.035); }
.topic-summary { margin-bottom: .8rem; }
.topic-summary summary, .topic-selector summary { display: flex; align-items: center; min-height: 2.55rem; padding: .5rem .65rem; color: var(--cream); font-size: .68rem; font-weight: 850; cursor: pointer; list-style: none; }
.topic-summary summary::-webkit-details-marker, .topic-selector summary::-webkit-details-marker { display: none; }
.topic-summary summary::after, .topic-selector summary::after { content: "+"; margin-left: .5rem; color: var(--lime); font-size: 1rem; }
.topic-summary[open] summary::after, .topic-selector[open] summary::after { content: "−"; }
.topic-summary summary small, .topic-selector summary small { margin-left: auto; color: var(--muted); font-size: .58rem; font-weight: 700; }
.topic-summary > div { display: flex; flex-wrap: wrap; gap: .4rem; padding: .1rem .55rem .55rem; }
.topic-summary > div span { display: inline-flex; align-items: center; gap: .28rem; padding: .34rem .45rem; border-radius: .45rem; color: var(--cream); background: rgba(255,248,232,.07); font-size: .6rem; }
.topic-summary > div strong { color: var(--lime); }
.priority-card, .analysis-card { padding: .9rem; }
.priority-card { margin-bottom: .9rem; }
.priority-card ol, .analysis-summary ol { display: grid; gap: .38rem; margin: .6rem 0 0; padding: 0; list-style: none; }
.priority-card li, .analysis-summary li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .6rem; padding: .5rem .6rem; border-radius: .55rem; background: rgba(255,248,232,.06); color: var(--cream); font-size: .68rem; }
.priority-card li strong, .analysis-summary li strong { display: grid; min-width: 1.45rem; height: 1.45rem; border-radius: 50%; place-items: center; color: #163b2c; background: var(--lime); font-size: .64rem; }
.timeline-section { margin-top: 1rem; }
.timeline-section h2, .workspace-section h2 { margin-top: .15rem; font-size: 1.12rem; }
.timeline-card.class-timeline.completed { border-color: rgba(230,235,71,.34); }
.timeline-card.class-timeline.draft { border-style: dashed; }
.class-workspace > .screen-heading { margin-bottom: .7rem; }
.class-details-card { margin-bottom: .85rem; overflow: hidden; }
.class-details-disclosure, .previous-class-notes { border: 1px solid rgba(255,248,232,.2); border-radius: .95rem; background: rgba(13,55,44,.88); }
.class-details-disclosure summary, .previous-class-notes summary { display: flex; align-items: center; min-height: 3.05rem; padding: .72rem .9rem; color: var(--cream); font-size: .78rem; font-weight: 850; cursor: pointer; list-style: none; }
.class-details-disclosure summary::-webkit-details-marker, .previous-class-notes summary::-webkit-details-marker, .workspace-disclosure summary::-webkit-details-marker, .audio-diagnostics summary::-webkit-details-marker { display: none; }
.class-details-disclosure summary::after, .previous-class-notes summary::after, .workspace-disclosure summary::after, .audio-diagnostics summary::after { content: "+"; margin-left: .55rem; color: var(--lime); font-size: 1rem; }
.class-details-disclosure[open] summary::after, .previous-class-notes[open] summary::after, .workspace-disclosure[open] summary::after, .audio-diagnostics[open] summary::after { content: "−"; }
.class-details-disclosure summary small, .previous-class-notes summary small { margin-left: auto; color: var(--muted); font-size: .58rem; font-weight: 700; text-align: right; }
.class-details-body { display: grid; gap: .7rem; padding: 0 .9rem .9rem; }
.previous-class-notes { margin-bottom: .85rem; overflow: hidden; }
.previous-class-notes-body { display: grid; gap: .7rem; padding: 0 .9rem .9rem; }
.previous-class-notes-body > div { padding: .7rem; border-radius: .65rem; background: rgba(255,248,232,.05); }
.previous-class-notes-body .step { margin-bottom: .3rem; }
.previous-class-notes-body p:last-child { color: var(--muted); font-size: .68rem; line-height: 1.4; white-space: pre-wrap; }
.read-only-notice { margin: 0 0 .7rem; padding: .65rem .75rem; border: 1px solid rgba(230,235,71,.32); border-radius: .7rem; color: var(--muted); background: rgba(230,235,71,.07); font-size: .66rem; line-height: 1.35; }
.class-details-card label, .analysis-card label { display: grid; gap: .32rem; color: var(--cream); font-size: .68rem; font-weight: 800; }
.class-details-card label small, .analysis-card label small { color: var(--muted); font-size: .58rem; font-weight: 650; }
.field-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: .65rem; }
.topic-toggles, .topic-picker { display: flex; flex-wrap: wrap; gap: .35rem; }
.topic-selector .topic-toggles { padding: .05rem .55rem .55rem; }
.readonly-topics { min-height: 2.2rem; padding: .5rem .6rem; border: 1px solid rgba(255,248,232,.14); border-radius: .55rem; color: var(--muted); background: rgba(255,248,232,.035); font-size: .65rem; line-height: 1.3; }
.topic-toggle { min-height: 2.2rem; padding: .35rem .55rem; border: 1px solid rgba(255,248,232,.3); border-radius: .55rem; color: var(--cream); background: rgba(255,248,232,.06); font-size: .64rem; font-weight: 850; cursor: pointer; }
.topic-toggle.selected { border-color: var(--lime); color: #163b2c; background: var(--lime); }
.auto-name-note { margin: 0; color: var(--muted); font-size: .6rem; line-height: 1.3; }
.workspace-section { margin-top: .8rem; }
.workspace-disclosure { overflow: hidden; padding: 0; }
.workspace-disclosure > summary { display: flex; align-items: center; justify-content: space-between; min-height: 4rem; padding: .78rem .9rem; color: var(--cream); cursor: pointer; list-style: none; }
.workspace-disclosure > summary h2 { margin-top: .12rem; font-size: 1.12rem; }
.workspace-summary-meta { display: flex; align-items: center; gap: .45rem; margin-left: .5rem; }
.workspace-section-action { display: flex; justify-content: flex-end; margin: 0 0 .65rem; }
.workspace-section-action .primary-small { min-height: 2.25rem; padding: .35rem .52rem; font-size: .62rem; }
.workspace-section-body { padding: 0 .9rem .9rem; }
.empty-teaching { margin: 0; padding: .8rem; border: 1px dashed rgba(255,248,232,.24); border-radius: .7rem; text-align: center; }
.technique-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; margin-bottom: .6rem; padding: .25rem; border-radius: .7rem; background: rgba(255,248,232,.055); }
.technique-tabs button { min-height: 2.6rem; padding: .45rem .6rem; border: 1px solid transparent; border-radius: .52rem; color: var(--muted); background: transparent; font-size: .68rem; font-weight: 850; cursor: pointer; }
.technique-tabs button.selected { border-color: rgba(230,235,71,.55); color: #163b2c; background: var(--lime); }
.technique-intro { margin: .15rem 0 .65rem; font-size: .64rem; }
.technique-progressions { display: grid; gap: .55rem; }
.technique-progression { overflow: hidden; border: 1px solid rgba(255,248,232,.16); border-radius: .78rem; background: rgba(255,248,232,.035); }
.technique-progression > summary { display: flex; align-items: center; min-height: 3.35rem; padding: .65rem .7rem; cursor: pointer; list-style: none; }
.technique-progression > summary::-webkit-details-marker, .technique-info summary::-webkit-details-marker { display: none; }
.technique-progression > summary > span { display: grid; gap: .12rem; min-width: 0; }
.technique-progression > summary small { color: var(--lime); font-size: .5rem; font-weight: 900; letter-spacing: .12em; }
.technique-progression > summary strong { color: var(--cream); font-size: .75rem; line-height: 1.2; }
.technique-progression > summary em { display: grid; min-width: 2.5rem; min-height: 2rem; margin-left: auto; border-radius: .55rem; place-items: center; color: var(--lime); background: rgba(230,235,71,.1); font-size: .62rem; font-style: normal; font-weight: 900; }
.technique-progression > summary::after { margin-left: .45rem; content: "+"; color: var(--lime); font-size: 1rem; }
.technique-progression[open] > summary::after { content: "−"; }
.technique-progression-body { display: grid; gap: .7rem; padding: 0 .55rem .65rem; }
.technique-setup, .technique-conclusion { padding: .7rem; border-radius: .65rem; background: rgba(255,248,232,.055); }
.technique-setup p, .technique-conclusion p { margin: .38rem 0 0; color: var(--cream); font-size: .62rem; line-height: 1.42; }
.technique-setup .step, .technique-conclusion .step, .technique-checks > .step { margin: 0 0 .45rem; color: var(--lime); font-size: .52rem; }
.technique-checks { display: grid; gap: .42rem; }
.technique-check { overflow: hidden; border: 1px solid rgba(255,248,232,.13); border-radius: .62rem; background: rgba(255,248,232,.035); }
.technique-check.nested { margin-left: .8rem; border-color: rgba(230,235,71,.17); background: rgba(230,235,71,.035); }
.technique-check-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; }
.technique-check-button { display: grid; grid-template-columns: 1.4rem minmax(0, 1fr); align-items: center; gap: .45rem; width: 100%; min-height: 3.2rem; padding: .5rem; border: 0; color: var(--cream); background: transparent; font-size: .65rem; font-weight: 750; line-height: 1.3; text-align: left; cursor: pointer; }
.technique-check-button.reviewed { background: rgba(230,235,71,.11); }
.technique-check-button.reviewed .checkpoint-state { border-color: var(--lime); background: var(--lime); }
.technique-info { align-self: stretch; border-left: 1px solid rgba(255,248,232,.11); }
.technique-info > summary { display: grid; min-width: 3.1rem; min-height: 3.2rem; padding: .4rem; place-items: center; color: var(--lime); font-size: 0; cursor: pointer; list-style: none; }
.technique-info > summary span { font-size: .85rem; }
.technique-info[open] { grid-column: 1 / -1; border-top: 1px solid rgba(255,248,232,.1); border-left: 0; }
.technique-info[open] > summary { display: flex; min-height: 2.35rem; padding: .4rem .6rem; justify-content: space-between; color: var(--lime); font-size: .58rem; font-weight: 850; }
.technique-info > div { display: grid; gap: .36rem; padding: 0 .65rem .65rem; }
.technique-info p { margin: 0; color: var(--muted); font-size: .59rem; line-height: 1.42; }
.technique-info p::before { margin-right: .35rem; content: "•"; color: var(--lime); }
.technique-subchecks { display: grid; gap: .35rem; padding: 0 .4rem .45rem; }
.technique-empty { margin: 0; }
.technique-empty p { margin: .3rem 0 0; }
.situational-section > summary { min-height: 3rem; }
.situational-section-body { display: grid; gap: .5rem; padding: 0 .7rem .7rem; }
.situational-section-body p { margin: 0; color: var(--muted); font-size: .62rem; line-height: 1.4; }
.situational-section-body ul { display: grid; gap: .35rem; margin: 0; padding: 0; list-style: none; }
.situational-section-body li { padding: .5rem .6rem; border-radius: .5rem; color: var(--cream); background: rgba(255,248,232,.055); font-size: .62rem; font-weight: 700; line-height: 1.3; }
.situational-section-body li::before { margin-right: .4rem; color: var(--lime); content: "•"; }
.section-heading { margin-bottom: .65rem; }
.section-count { display: grid; min-width: 2.55rem; min-height: 2.1rem; padding: .25rem .45rem; border-radius: .55rem; place-items: center; color: var(--lime); background: rgba(230,235,71,.12); font-size: .68rem; font-weight: 850; }
.checklist-intro { margin: 0 0 .65rem; }
.calibration-count-toggle { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; margin-bottom: .5rem; padding: .25rem; border-radius: .65rem; background: rgba(255,248,232,.055); }
.calibration-count-button { min-height: 2.15rem; padding: .35rem .55rem; border: 1px solid transparent; border-radius: .48rem; color: var(--muted); background: transparent; font-size: .62rem; font-weight: 850; cursor: pointer; }
.calibration-count-button.selected { border-color: rgba(230,235,71,.55); color: #163b2c; background: var(--lime); }
.checklist-groups { display: grid; gap: .45rem; }
.checklist-group { border: 1px solid rgba(255,248,232,.15); border-radius: .7rem; overflow: hidden; background: rgba(255,248,232,.035); }
.checklist-group summary { display: flex; align-items: center; justify-content: space-between; min-height: 2.8rem; padding: .55rem .65rem; color: var(--cream); font-size: .74rem; font-weight: 850; cursor: pointer; list-style: none; }
.checklist-group summary::-webkit-details-marker { display: none; }
.checklist-group summary::after { content: "+"; margin-left: .55rem; color: var(--lime); font-size: 1rem; }
.checklist-group[open] summary::after { content: "−"; }
.checklist-group summary small { margin-left: auto; color: var(--muted); font-size: .58rem; }
.checkpoint-list { display: grid; gap: .36rem; padding: .15rem .45rem .5rem; }
.checkpoint { display: grid; grid-template-columns: 1.45rem minmax(0, 1fr) auto; align-items: center; gap: .45rem; width: 100%; min-height: 3.25rem; padding: .45rem; border: 1px solid rgba(255,248,232,.15); border-radius: .58rem; color: var(--cream); background: rgba(255,248,232,.05); font-size: .66rem; font-weight: 700; line-height: 1.28; text-align: left; cursor: pointer; }
.checkpoint.reviewed { border-color: rgba(230,235,71,.65); background: rgba(230,235,71,.12); }
.checkpoint-state { display: grid; width: 1.25rem; height: 1.25rem; border: 1px solid rgba(255,248,232,.45); border-radius: 50%; place-items: center; color: #163b2c; background: transparent; font-size: .75rem; }
.checkpoint.reviewed .checkpoint-state { border-color: var(--lime); background: var(--lime); }
.checkpoint > strong { display: grid; min-width: 1.5rem; height: 1.5rem; border-radius: 50%; place-items: center; color: #163b2c; background: #ef9a87; font-size: .64rem; }
.checkpoint-copy { display: grid; gap: .28rem; min-width: 0; }
.checkpoint-copy > small { display: grid; gap: .16rem; color: var(--muted); font-size: .58rem; font-weight: 650; line-height: 1.3; }
.checkpoint-copy > small > span { position: relative; padding-left: .65rem; }
.checkpoint-copy > small > span::before { position: absolute; left: .12rem; content: "•"; color: var(--lime); }
.linked-sessions { margin-top: .25rem; }
.linked-session-card { overflow: hidden; }
.linked-session-card > button { padding: .7rem; }
.analysis-card { display: grid; gap: .75rem; }
.analysis-instructions { display: flex; align-items: flex-start; justify-content: space-between; gap: .55rem; }
.analysis-instructions p { margin: 0; }
.analysis-grid { display: grid; gap: .65rem; }
.analysis-group { border: 1px solid rgba(255,248,232,.13); border-radius: .7rem; overflow: hidden; }
.analysis-group h3 { padding: .6rem .65rem; background: rgba(255,248,232,.05); font-size: .72rem; }
.analysis-counter { display: grid; grid-template-columns: minmax(0, 1fr) auto; border-top: 1px solid rgba(255,248,232,.1); }
.analysis-counter > button { min-height: 3.15rem; padding: .45rem .6rem; border: 0; color: var(--cream); background: transparent; font-size: .65rem; font-weight: 700; line-height: 1.25; text-align: left; cursor: pointer; }
.analysis-counter > button:active { background: rgba(230,235,71,.14); }
.analysis-counter > button .checkpoint-copy > small { margin-top: .15rem; }
.analysis-counter > div { display: flex; align-items: center; gap: .3rem; padding: .35rem .5rem; }
.analysis-counter strong { display: grid; min-width: 1.55rem; height: 1.55rem; border-radius: .48rem; place-items: center; color: #163b2c; background: var(--lime); font-size: .68rem; }
.counter-adjust { display: grid; width: 1.55rem; height: 1.55rem; padding: 0; border: 1px solid rgba(255,248,232,.35); border-radius: .48rem; place-items: center; color: var(--cream); background: rgba(255,248,232,.06); font-size: 1rem; cursor: pointer; }
.counter-add { border-color: rgba(230,235,71,.78); color: #163b2c; background: var(--lime); font-weight: 900; }
.analysis-summary { padding-top: .15rem; }
.analysis-summary .section-heading { align-items: center; margin-bottom: 0; }
.analysis-summary .muted { margin: .12rem 0 0; font-size: .58rem; }
.progression-setup .topic-picker { align-items: center; margin: 0 0 .75rem; }
.progression-setup .topic-picker > span { margin-right: .2rem; color: var(--muted); font-size: .68rem; font-weight: 800; }
.progression-setup .selected-target { padding: .35rem .4rem; font-size: .68rem; }
.scoring-screen { padding-top: max(.7rem, env(safe-area-inset-top)); }
.scoring-topline { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; margin-bottom: .35rem; }
.scoring-topline h1 { max-width: 14rem; margin-top: .14rem; font-size: clamp(1.05rem, 5.5vw, 1.5rem); line-height: 1.08; }
.scoring-topline .player-tag { margin-top: .25rem; }
.history-detail-court { padding: .85rem; margin: .7rem 0; border: 1px solid rgba(255,248,232,.18); border-radius: .9rem; background: var(--surface); }
.detail-actions { display: flex; justify-content: flex-end; gap: .45rem; margin-top: .8rem; }
.audio-diagnostics { margin-top: .65rem; border: 1px solid rgba(255,248,232,.16); border-radius: .7rem; overflow: hidden; background: rgba(255,248,232,.035); }
.audio-diagnostics summary { display: flex; align-items: center; min-height: 2.75rem; padding: .55rem .65rem; color: var(--cream); font-size: .7rem; font-weight: 850; cursor: pointer; list-style: none; }
.audio-diagnostics summary small { margin-left: auto; color: var(--muted); font-size: .56rem; font-weight: 700; }
.audio-diagnostics-body { padding: 0 .65rem .65rem; }
.audio-diagnostics-body > p { margin: 0; color: var(--muted); font-size: .61rem; line-height: 1.35; }
.audio-diagnostics-actions { display: flex; flex-wrap: wrap; gap: .4rem; margin: .6rem 0; }
.audio-diagnostic-status { color: var(--cream) !important; }
.audio-diagnostic-latest { margin-top: .35rem !important; font-size: .55rem !important; }
@media (max-width: 390px) {
  .app-shell { padding-right: .82rem; padding-left: .82rem; }
  .player-dashboard-heading h1, .screen-heading h1 { font-size: 1.4rem; }
  .dashboard-actions { grid-template-columns: 1fr; }
  .field-grid { grid-template-columns: 1fr; }
  .player-stats { gap: .3rem; }
  .player-stats > div { padding: .6rem .25rem; }
  .player-stats span { font-size: .5rem; }
  .class-header-actions .mini-button, .class-header-actions .primary-small { padding: .4rem .5rem; }
}