:root {
  --bg: #07080c;
  --bg-soft: #0d0e14;
  --panel: rgba(27, 28, 36, .52);
  --panel-strong: rgba(24, 25, 33, .84);
  --line: rgba(255, 255, 255, .10);
  --line-bright: rgba(255, 255, 255, .18);
  --text: #f4f3f8;
  --muted: #9999a5;
  --numeral: #b9adf2;
  --numeral-soft: rgba(185, 173, 242, .16);
  --danger: #d48f9f;
  --shadow: 0 30px 90px rgba(0, 0, 0, .52);
}

* { box-sizing: border-box; }
html { background: var(--bg); color-scheme: dark; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", sans-serif; }
body {
  margin: 0;
  min-height: 100dvh;
  color: var(--text);
  background:
    radial-gradient(ellipse at 18% -8%, rgba(141, 132, 190, .12), transparent 38%),
    radial-gradient(ellipse at 103% 46%, rgba(255, 255, 255, .055), transparent 32%),
    linear-gradient(155deg, rgba(11,12,18,.72) 0%, rgba(6,7,10,.64) 48%, rgba(10,11,16,.72) 100%),
    url("assets/backgrounds/hubble-ultra-deep.jpg") center / cover no-repeat fixed;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .28;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

.ambient { position: fixed; border-radius: 50%; pointer-events: none; filter: blur(105px); opacity: .18; }
.ambient-a { width: 330px; height: 330px; background: #8f84bd; top: 7%; left: -220px; }
.ambient-b { width: 280px; height: 280px; background: #d6d3e0; right: -220px; bottom: 10%; opacity: .08; }

.app-shell { width: min(100%, 960px); min-height: 100dvh; margin: auto; padding: calc(22px + env(safe-area-inset-top)) 24px calc(112px + env(safe-area-inset-bottom)); position: relative; }
.app-bar { display: flex; align-items: center; justify-content: space-between; margin: 0 2px 25px; }
.app-bar h1 { margin: 3px 0 0; font-size: 32px; line-height: 1; letter-spacing: -1.7px; font-weight: 680; }
.period { color: var(--numeral); text-shadow: 0 0 18px rgba(185, 173, 242, .35); }
.eyebrow { margin: 0; color: #858590; font-size: 9px; font-weight: 720; letter-spacing: 2px; }
.app-actions { display: flex; gap: 10px; }
.icon-button {
  width: 43px; height: 43px; border-radius: 50%; border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.025));
  color: var(--text); display: grid; place-items: center; cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 12px 35px rgba(0,0,0,.24);
  backdrop-filter: blur(24px) saturate(120%); -webkit-backdrop-filter: blur(24px) saturate(120%);
}
.icon-button svg, .tab svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }

.glass-panel {
  position: relative;
  background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.028) 45%, rgba(255,255,255,.05));
  border: 1px solid var(--line);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), inset 0 -1px 0 rgba(255,255,255,.025), var(--shadow);
  backdrop-filter: blur(34px) saturate(118%); -webkit-backdrop-filter: blur(34px) saturate(118%);
}
.glass-panel::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  border: 1px solid transparent;
  background: linear-gradient(120deg, rgba(255,255,255,.20), transparent 22%, transparent 72%, rgba(185,173,242,.12)) border-box;
  -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: .62;
}

.view { display: none; }
.view.active { display: block; animation: enter .42s cubic-bezier(.2,.8,.2,1); }
@keyframes enter { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.day-rail { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 7px; margin-bottom: 17px; }
.day-chip { min-width: 0; border: 1px solid transparent; background: transparent; color: #74747f; border-radius: 17px; padding: 10px 2px; cursor: pointer; font-weight: 690; }
.day-chip span { display: block; font-size: 8px; letter-spacing: 1px; }
.day-chip strong { display: block; margin-top: 4px; font-size: 15px; color: inherit; }
.day-chip.active {
  color: #eceaf3;
  border-color: rgba(255,255,255,.14);
  background: linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.045));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 10px 30px rgba(0,0,0,.20);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}

.hero-card { position: relative; overflow: hidden; border-radius: 33px; padding: 28px; display: grid; grid-template-columns: minmax(0,1fr) 88px; gap: 22px; min-height: 240px; isolation: isolate; }
.hero-card::before {
  content: ""; position: absolute; inset: -20%; z-index: -1;
  background:
    radial-gradient(circle at 83% 24%, transparent 0 11%, rgba(212,208,232,.09) 15%, transparent 26%),
    radial-gradient(circle at 20% 118%, rgba(130,121,174,.17), transparent 48%);
}
.hero-copy, .readiness-ring, .hero-card .primary-button { position: relative; z-index: 2; }
.hero-copy { min-width: 0; }
.hero-copy h2 { max-width: 590px; margin: 10px 0 13px; font-size: clamp(31px, 6vw, 47px); font-weight: 650; line-height: .99; letter-spacing: -2.15px; text-wrap: balance; }
.muted { margin: 0; color: var(--muted); line-height: 1.5; }

.lens-well {
  position: absolute; z-index: 0; width: 250px; height: 250px; right: -72px; top: -84px; border-radius: 50%;
  background:
    radial-gradient(circle at 42% 40%, transparent 0 31%, rgba(255,255,255,.035) 39%, rgba(185,173,242,.12) 45%, rgba(255,255,255,.18) 47%, rgba(10,11,16,.10) 51%, transparent 66%),
    conic-gradient(from 30deg, transparent, rgba(255,255,255,.11), transparent 28%, rgba(185,173,242,.08), transparent 61%, rgba(255,255,255,.09), transparent);
  border: 1px solid rgba(255,255,255,.13);
  box-shadow: inset 18px 14px 50px rgba(255,255,255,.035), inset -20px -24px 55px rgba(0,0,0,.33), 0 0 80px rgba(154,143,205,.08);
  backdrop-filter: blur(5px) contrast(1.08); -webkit-backdrop-filter: blur(5px) contrast(1.08);
  transform: rotate(-12deg);
}
.lens-well::before { content: ""; position: absolute; inset: 23px; border-radius: 50%; border: 1px solid rgba(255,255,255,.11); box-shadow: 0 0 0 12px rgba(185,173,242,.018), 0 0 0 30px rgba(255,255,255,.014); }
.lens-well::after { content: ""; position: absolute; width: 42%; height: 12%; left: 25%; top: 16%; border-radius: 50%; background: rgba(255,255,255,.17); filter: blur(9px); transform: rotate(-24deg); opacity: .48; }

.readiness-ring { width: 84px; height: 84px; align-self: start; display: grid; place-items: center; }
.readiness-ring svg { position: absolute; inset: 0; transform: rotate(-90deg); }
.readiness-ring circle { fill: none; stroke-width: 3.5; }
.ring-track { stroke: rgba(255,255,255,.08); }
.ring-value { stroke: rgba(190,180,235,.72); stroke-dasharray: 264; stroke-dashoffset: 55; filter: drop-shadow(0 0 6px rgba(185,173,242,.28)); }
.readiness-ring span, .numeral { color: var(--numeral); }
.readiness-ring span { margin-top: -7px; font-size: 24px; font-weight: 650; }
.readiness-ring small { position: absolute; margin-top: 27px; color: #888893; font-size: 9px; }

.primary-button {
  appearance: none; border: 1px solid rgba(255,255,255,.28); border-radius: 17px;
  background: linear-gradient(180deg, rgba(248,247,251,.94), rgba(219,217,228,.86));
  color: #111116; font: inherit; font-weight: 760; padding: 15px 20px; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  box-shadow: inset 0 1px 0 #fff, 0 14px 35px rgba(0,0,0,.28), 0 0 0 1px rgba(185,173,242,.05);
}
.primary-button:active { transform: scale(.985); }
.hero-card .primary-button { grid-column: 1 / -1; width: 100%; align-self: end; }

.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 12px; margin: 28px 3px 13px; }
.section-heading h3 { margin: 5px 0 0; font-size: 20px; font-weight: 620; letter-spacing: -.5px; }
.section-heading.compact { margin: 0 0 20px; }
.status-pill { flex: none; padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; color: #a9a7b2; background: rgba(255,255,255,.035); font-size: 10px; }
.status-pill::before { content: ""; display: inline-block; width: 5px; height: 5px; margin-right: 6px; border-radius: 50%; background: var(--numeral); box-shadow: 0 0 9px rgba(185,173,242,.4); vertical-align: 1px; }

.exercise-list { display: grid; gap: 9px; }
.exercise-card { display: grid; grid-template-columns: 47px minmax(0,1fr) auto; align-items: center; gap: 13px; padding: 13px; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(135deg, rgba(255,255,255,.045), rgba(255,255,255,.018)); box-shadow: inset 0 1px 0 rgba(255,255,255,.035); }
.exercise-number { width: 43px; height: 43px; border: 1px solid rgba(185,173,242,.10); border-radius: 14px; color: var(--numeral); background: var(--numeral-soft); display: grid; place-items: center; font-weight: 680; }
.exercise-card h4 { margin: 0 0 5px; font-size: 14px; font-weight: 620; }
.exercise-card p { margin: 0; overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.exercise-chevron { color: #666670; font-size: 21px; }
.safety-note { margin-top: 13px; padding: 16px; border-radius: 21px; display: flex; gap: 13px; box-shadow: none; }
.safety-icon { color: var(--numeral); font-size: 18px; }
.safety-note strong { font-size: 12px; font-weight: 630; }
.safety-note p { margin: 4px 0 0; color: var(--muted); font-size: 11px; line-height: 1.45; }

.view-title { padding: 17px 4px 25px; }
.view-title h2 { margin: 8px 0; font-size: 40px; font-weight: 650; letter-spacing: -2px; }
.view-title > p:last-child { margin: 0; color: var(--muted); }
.history-list { display: grid; gap: 11px; }
.empty-state { padding: 40px 24px; border: 1px dashed rgba(255,255,255,.14); border-radius: 25px; color: var(--muted); text-align: center; }
.empty-state strong { display: block; margin-bottom: 8px; color: var(--text); font-size: 17px; }
.history-card { padding: 18px; border-radius: 23px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; }
.history-card h3 { margin: 5px 0 7px; font-size: 18px; font-weight: 620; }
.history-card p { margin: 0; color: var(--muted); font-size: 11px; }
.history-score { align-self: center; text-align: right; }
.history-score strong { display: block; color: var(--numeral); font-size: 24px; font-weight: 650; }
.history-score small { color: var(--muted); }
.metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.metric-card { padding: 18px; border-radius: 22px; }
.metric-card span { color: var(--muted); font-size: 10px; }
.metric-card strong { display: block; margin-top: 8px; color: var(--numeral); font-size: 27px; font-weight: 650; letter-spacing: -1px; }
.chart-card, .coach-card { margin-top: 12px; padding: 20px; border-radius: 25px; }
.volume-chart { height: 155px; padding: 8px 3px 0; border-bottom: 1px solid var(--line); display: flex; align-items: end; gap: 10px; }
.bar-wrap { height: 100%; flex: 1; display: flex; flex-direction: column; justify-content: end; gap: 7px; color: var(--muted); font-size: 9px; text-align: center; }
.bar { min-height: 4px; border-radius: 8px 8px 3px 3px; background: linear-gradient(to top, #706995, #c8c1e8); box-shadow: 0 0 17px rgba(185,173,242,.12); }
.coach-card { display: flex; align-items: flex-start; gap: 15px; }
.coach-orb { width: 40px; height: 40px; flex: none; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; background: radial-gradient(circle at 34% 28%, #fff, #c7c2dc 13%, #625c7f 39%, #15161d 69%); box-shadow: inset -7px -8px 16px rgba(0,0,0,.45), 0 0 24px rgba(185,173,242,.12); }
.coach-card h3 { margin: 0 0 7px; font-weight: 620; }
.coach-card p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }

.tab-bar { position: fixed; z-index: 20; left: 50%; bottom: calc(14px + env(safe-area-inset-bottom)); transform: translateX(-50%); width: min(calc(100% - 28px), 530px); height: 68px; padding: 7px; border-radius: 24px; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); box-shadow: 0 18px 65px rgba(0,0,0,.62); }
.tab { min-width: 0; border: 0; border-radius: 17px; background: transparent; color: #686872; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font: inherit; font-size: 9px; font-weight: 680; cursor: pointer; }
.tab svg { width: 18px; height: 18px; }
.tab.active { color: #eeedf3; background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.055)); box-shadow: inset 0 1px 0 rgba(255,255,255,.10); }

.sheet-backdrop { position: fixed; z-index: 30; inset: 0; background: rgba(2,3,5,.58); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.session-sheet { position: fixed; z-index: 31; left: 50%; bottom: 0; transform: translate(-50%, 105%); width: min(100%,760px); max-height: 94dvh; overflow: auto; padding: 22px 22px calc(25px + env(safe-area-inset-bottom)); border: 1px solid var(--line); border-radius: 33px 33px 0 0; background: rgba(14,15,21,.94); box-shadow: 0 -30px 90px rgba(0,0,0,.68); backdrop-filter: blur(40px) saturate(115%); -webkit-backdrop-filter: blur(40px) saturate(115%); transition: transform .38s cubic-bezier(.2,.82,.2,1); }
.session-sheet.open { transform: translate(-50%,0); }
.sheet-header, .dialog-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
.sheet-header h2, .dialog-heading h2 { margin: 5px 0 0; font-weight: 640; letter-spacing: -1px; }
.session-exercises { display: grid; gap: 12px; }
.session-exercise { padding: 16px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.03); }
.session-exercise-header { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 13px; }
.session-exercise-header h3 { margin: 0; font-size: 15px; font-weight: 620; }
.session-exercise-header span { color: var(--muted); font-size: 10px; }
.set-row { display: grid; grid-template-columns: 34px 1fr 1fr 42px; align-items: end; gap: 8px; margin-top: 8px; }
.set-index { height: 42px; color: var(--numeral); display: grid; place-items: center; font-size: 11px; }
.input-wrap { display: grid; gap: 4px; }
.input-wrap span { color: #73737d; font-size: 8px; text-transform: uppercase; letter-spacing: 1px; }
.input-wrap input, .form-dialog input, .form-dialog select, textarea { width: 100%; height: 42px; padding: 0 11px; outline: none; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.045); color: var(--text); font: inherit; }
.input-wrap input:focus, .form-dialog input:focus, textarea:focus { border-color: rgba(185,173,242,.42); box-shadow: 0 0 0 3px rgba(185,173,242,.07); }
.set-check { height: 42px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.04); color: #696973; font-size: 17px; cursor: pointer; }
.set-check.done { border-color: rgba(185,173,242,.28); background: var(--numeral-soft); color: var(--numeral); }
.checkin-card { margin-top: 14px; padding: 18px; border-radius: 22px; box-shadow: none; }
.checkin-card h3 { margin: 0 0 17px; font-weight: 620; }
.checkin-card label { display: block; margin: 14px 0 7px; color: var(--muted); font-size: 10px; }
.segmented { padding: 4px; border-radius: 14px; background: rgba(255,255,255,.04); display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; }
.segmented button { height: 36px; border: 0; border-radius: 10px; background: transparent; color: var(--muted); font: inherit; font-size: 10px; font-weight: 620; }
.segmented button.active { background: rgba(255,255,255,.10); color: var(--text); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
textarea { height: auto; padding: 11px; resize: vertical; }
.complete-button { width: 100%; margin-top: 14px; }
.form-dialog { width: min(calc(100% - 28px),480px); padding: 22px; border: 1px solid var(--line); border-radius: 27px; background: rgba(16,17,23,.96); color: var(--text); }
.form-dialog::backdrop { background: rgba(0,0,0,.62); backdrop-filter: blur(9px); }
.form-dialog label { margin-bottom: 14px; color: var(--muted); display: grid; gap: 7px; font-size: 10px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.form-dialog .primary-button { width: 100%; margin-top: 5px; }
/* v7 — transient glass confirmation: never a solid white/neon pill. */
.toast {
  position:fixed; z-index:60; left:50%; bottom:calc(98px + env(safe-area-inset-bottom));
  transform:translate(-50%,20px); opacity:0; pointer-events:none; padding:11px 17px;
  border:.5px solid rgba(255,255,255,.34); border-radius:999px;
  background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(7,14,19,.5) 54%,rgba(104,201,232,.055));
  color:rgba(247,250,251,.94); font-size:11px; font-weight:650; letter-spacing:.05px;
  box-shadow:0 18px 44px rgba(0,4,8,.48),inset 0 .5px 0 rgba(255,255,255,.52),inset 0 -.5px 0 rgba(0,0,0,.3);
  text-shadow:0 1px 7px rgba(0,0,0,.55);
  backdrop-filter:blur(26px) saturate(155%); -webkit-backdrop-filter:blur(26px) saturate(155%);
  transition:.25s;
}
.toast.show { opacity: 1; transform: translate(-50%,0); }
body.sheet-open { overflow: hidden; }

@media (min-width: 760px) {
  .exercise-list { grid-template-columns: 1fr 1fr; }
  .safety-note { grid-column: 1 / -1; }
  .hero-card { padding: 34px; }
  .history-list { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  html, body { width: 100%; max-width: 100vw; overflow-x: clip; }
  .app-shell { padding-left: 15px; padding-right: 15px; }
  .app-bar { margin-bottom: 18px; }
  .day-rail { gap: 3px; }
  .day-chip { padding: 9px 1px; }
  .hero-card { min-height: 228px; padding: 22px; grid-template-columns: minmax(0,1fr) 68px; gap: 10px; }
  .hero-copy h2 { max-width: 100%; font-size: clamp(29px, 9.2vw, 36px); line-height: 1.01; letter-spacing: -1.7px; overflow-wrap: anywhere; }
  .lens-well { width: 210px; height: 210px; right: -82px; top: -76px; }
  .readiness-ring { width: 68px; height: 68px; }
  .readiness-ring span { font-size: 20px; }
  .readiness-ring small { margin-top: 23px; }
  .section-heading { margin-top: 24px; }
  .status-pill { max-width: 132px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .metric-grid { grid-template-columns: 1fr 1fr; }
  .metric-card:last-child { grid-column: 1 / -1; }
  .session-sheet { padding-left: 14px; padding-right: 14px; }
  .set-row { grid-template-columns: 28px minmax(0,1fr) minmax(0,1fr) 40px; }
  .segmented button { font-size: 9px; }
  .exercise-card { grid-template-columns: 43px minmax(0,1fr) auto; }
  .view-title h2 { font-size: 37px; }
}

@media (max-width: 360px) {
  .app-shell { padding-left: 11px; padding-right: 11px; }
  .hero-card { padding: 19px; }
  .hero-copy h2 { font-size: 28px; }
  .status-pill { max-width: 118px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* v3 — iOS gravitational liquid glass, derived from the newest Florida Paint Service optical language. */
:root {
  --bg: #090b12;
  --bg-soft: #10141d;
  --panel: rgba(72,78,96,.22);
  --panel-strong: rgba(24,29,41,.72);
  --line: rgba(255,255,255,.18);
  --line-bright: rgba(255,255,255,.34);
  --text: #f7f8fb;
  --muted: #a8acb7;
  --numeral: #c7bdfd;
  --numeral-soft: rgba(199,189,253,.16);
  --glass-cool: rgba(170,224,255,.16);
  --glass-warm: rgba(255,192,157,.10);
  --glass-deep: rgba(8,12,20,.34);
}
body {
  background:
    radial-gradient(ellipse at 8% -5%,rgba(118,175,230,.28),transparent 35%),
    radial-gradient(ellipse at 105% 31%,rgba(167,127,222,.19),transparent 32%),
    radial-gradient(ellipse at 48% 108%,rgba(225,131,105,.10),transparent 38%),
    linear-gradient(155deg,rgba(22,27,39,.72) 0%,rgba(8,10,16,.64) 43%,rgba(16,19,27,.72) 100%),
    url("assets/backgrounds/hubble-ultra-deep.jpg") center / cover no-repeat fixed;
}
body::before { opacity:.16; }
.ambient { filter:blur(86px); opacity:.32; }
.ambient-a { width:420px; height:420px; background:linear-gradient(145deg,#75c8f1,#9d75dc); top:4%; left:-280px; }
.ambient-b { width:360px; height:360px; background:linear-gradient(145deg,#ffd0b5,#8fc8e6); right:-265px; bottom:5%; opacity:.16; }

.icon-button {
  position:relative; overflow:hidden; width:44px; height:44px;
  border:1px solid rgba(255,255,255,.26);
  background:linear-gradient(135deg,rgba(213,239,255,.18),rgba(255,255,255,.055) 44%,rgba(255,205,181,.07));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.42),inset 0 -1px 0 rgba(0,0,0,.24),0 12px 35px rgba(0,0,0,.24);
  backdrop-filter:blur(24px) saturate(150%); -webkit-backdrop-filter:blur(24px) saturate(150%);
  transition:transform .18s ease,background .25s ease;
}
.icon-button::before {
  content:""; position:absolute; inset:2px; border-radius:inherit; pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.28),transparent 32%,transparent 70%,rgba(143,213,255,.11)); opacity:.8;
}
.icon-button:active { transform:scale(.94); }

.glass-panel {
  background:linear-gradient(118deg,var(--glass-cool),rgba(255,255,255,.075) 28%,rgba(255,255,255,.035) 57%,var(--glass-warm)),rgba(24,29,42,.32);
  border:1px solid rgba(255,255,255,.25);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 -1px 0 rgba(0,0,0,.28),inset 1px 0 0 rgba(190,231,255,.10),var(--shadow);
  backdrop-filter: blur(30px) saturate(155%) contrast(1.04);
  -webkit-backdrop-filter:blur(30px) saturate(155%) contrast(1.04);
}
.glass-panel::after {
  background:linear-gradient(118deg,rgba(255,255,255,.62),rgba(197,235,255,.14) 19%,transparent 39%,transparent 69%,rgba(255,207,183,.18) 87%,rgba(255,255,255,.28)) border-box;
  opacity:.74;
}
.liquid-surface::before {
  content:""; position:absolute; inset:1px; z-index:0; border-radius:inherit; pointer-events:none;
  background:
    radial-gradient(ellipse at 18% 0,rgba(255,255,255,.20),transparent 24%),
    radial-gradient(ellipse at 95% 100%,rgba(166,215,255,.10),transparent 31%),
    linear-gradient(110deg,transparent 28%,rgba(255,255,255,.035) 48%,transparent 67%);
  mix-blend-mode:screen;
}

.day-chip { transition:transform .2s ease,color .2s ease; }
.day-chip:active { transform:scale(.94); }
.day-chip.active {
  border-color:rgba(255,255,255,.29);
  background:linear-gradient(130deg,rgba(204,235,255,.18),rgba(255,255,255,.07) 54%,rgba(236,190,255,.08));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 -1px 0 rgba(0,0,0,.22),0 10px 30px rgba(0,0,0,.20);
  backdrop-filter:blur(20px) saturate(160%); -webkit-backdrop-filter:blur(20px) saturate(160%);
}

.hero-card { border-radius:36px; }
.hero-card::before {
  background:
    radial-gradient(circle at 83% 24%,transparent 0 10%,rgba(220,241,255,.10) 14%,rgba(177,147,224,.09) 16%,transparent 28%),
    radial-gradient(circle at 14% 117%,rgba(104,182,225,.22),transparent 47%),
    linear-gradient(122deg,rgba(255,255,255,.07),transparent 29%,transparent 72%,rgba(255,195,164,.06));
}
.lens-well {
  background:
    radial-gradient(circle at 38% 31%,rgba(255,255,255,.31),transparent 8%),
    radial-gradient(circle at 45% 42%,transparent 0 28%,rgba(193,229,255,.08) 34%,rgba(255,255,255,.22) 42%,rgba(192,154,240,.13) 46%,rgba(6,9,16,.18) 51%,transparent 68%),
    conic-gradient(from 22deg,rgba(255,255,255,.03),rgba(138,214,255,.18),transparent 24%,rgba(234,162,255,.11),transparent 57%,rgba(255,208,176,.16),transparent 82%,rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.25);
  box-shadow:inset 20px 17px 48px rgba(255,255,255,.07),inset -22px -26px 58px rgba(0,0,0,.42),inset 0 0 0 7px rgba(255,255,255,.025),0 0 90px rgba(130,196,235,.14);
  backdrop-filter:blur(2px) saturate(180%) contrast(1.12); -webkit-backdrop-filter:blur(2px) saturate(180%) contrast(1.12);
}
.lens-well::before { border-color:rgba(255,255,255,.18); box-shadow:0 0 0 10px rgba(190,228,255,.025),0 0 0 27px rgba(218,183,255,.018),inset 0 0 28px rgba(255,255,255,.05); }
.lens-well::after { width:46%; height:14%; left:21%; top:14%; background:linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,255,255,.48),rgba(170,225,255,.10)); filter:blur(8px); opacity:.68; }

.primary-button {
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(226,232,243,.86));
  box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(111,129,159,.18),0 14px 35px rgba(0,0,0,.28),0 0 26px rgba(180,218,255,.09);
}
.exercise-card {
  border-color:rgba(255,255,255,.16); border-radius:21px;
  background:linear-gradient(128deg,rgba(189,225,255,.075),rgba(255,255,255,.032) 49%,rgba(255,201,177,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(0,0,0,.18);
  backdrop-filter:blur(20px) saturate(135%); -webkit-backdrop-filter:blur(20px) saturate(135%);
}
.exercise-number { border-color:rgba(218,207,255,.20); background:linear-gradient(145deg,rgba(205,193,255,.22),rgba(156,178,223,.10)); box-shadow:inset 0 1px 0 rgba(255,255,255,.18); }
.status-pill { border-color:rgba(255,255,255,.19); background:linear-gradient(120deg,rgba(188,222,255,.10),rgba(255,255,255,.035)); backdrop-filter:blur(15px); }

.tab-bar {
  border-radius:27px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.44),inset 0 -1px 0 rgba(0,0,0,.35),0 20px 70px rgba(0,0,0,.58);
}
.tab { position:relative; z-index:2; }
.tab.active {
  color:#fff; border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(130deg,rgba(218,241,255,.22),rgba(255,255,255,.09) 55%,rgba(221,186,255,.09));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 0 rgba(0,0,0,.22),0 8px 22px rgba(0,0,0,.16);
}
.session-sheet,.form-dialog {
  background:linear-gradient(138deg,rgba(47,57,74,.82),rgba(13,16,24,.90) 56%,rgba(51,39,60,.78));
  border-color:rgba(255,255,255,.24);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.34),0 -30px 90px rgba(0,0,0,.58);
  backdrop-filter:blur(42px) saturate(155%); -webkit-backdrop-filter:blur(42px) saturate(155%);
}

@media (max-width:640px) {
  .app-shell { padding-top:calc(16px + env(safe-area-inset-top)); }
  .app-bar h1 { font-size:30px; }
  .day-rail { margin-inline:-2px; }
  .day-chip { border-radius:16px; }
  .hero-card { border-radius:32px; padding:23px; min-height:244px; }
  .hero-copy h2 { font-size:clamp(30px,9.7vw,38px); }
  .primary-button { min-height:50px; border-radius:18px; }
  .exercise-card { min-height:72px; }
  .tab-bar { height:70px; border-radius:28px; bottom:calc(10px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-transparency:reduce) {
  .glass-panel,.icon-button,.day-chip.active,.exercise-card,.session-sheet,.form-dialog { background:#1a1e29; backdrop-filter:none; -webkit-backdrop-filter:none; }
}
@media (prefers-contrast:more) {
  .glass-panel,.icon-button,.exercise-card { border-width:2px; border-color:#fff; }
}
/* v4 — V7 clear optical refraction: neutral, sharp, minimal; no purple glassmorphism. */
:root {
  --bg:#080b0f;
  --bg-soft:#0d1116;
  --panel:rgba(255,255,255,.055);
  --panel-strong:rgba(12,17,22,.76);
  --line:rgba(255,255,255,.17);
  --line-bright:rgba(255,255,255,.38);
  --text:#f7f9fa;
  --muted:rgba(237,242,245,.58);
  --numeral:#f1f6f8;
  --numeral-soft:rgba(220,240,248,.07);
  --glass-cool:rgba(218,245,255,.075);
  --glass-warm:rgba(255,255,255,.018);
  --glass-deep:rgba(5,10,14,.14);
}
body {
  background:
    radial-gradient(ellipse at 12% -8%,rgba(187,225,239,.12),transparent 37%),
    radial-gradient(ellipse at 102% 42%,rgba(174,218,233,.065),transparent 29%),
    linear-gradient(155deg,#121820 0%,#070a0e 46%,#0b0f14 100%);
}
body::before { opacity:.09; }
.ambient { filter:blur(120px); }
.ambient-a { width:360px; height:360px; left:-275px; top:3%; opacity:.13; background:#d9f4ff; }
.ambient-b { width:300px; height:300px; right:-245px; bottom:4%; opacity:.065; background:#ffffff; }
.period { color:#fff; text-shadow:none; }
.eyebrow { color:rgba(235,241,244,.48); }

.glass-panel {
  background:linear-gradient(142deg,rgba(255,255,255,.075),rgba(255,255,255,.026) 52%,rgba(178,228,245,.035));
  border:.5px solid rgba(255,255,255,.22);
  box-shadow:0 18px 54px rgba(0,8,12,.22),inset 0 .5px 0 rgba(255,255,255,.42),inset 0 -.5px 0 rgba(0,0,0,.16);
  backdrop-filter:blur(38px) saturate(142%); -webkit-backdrop-filter:blur(38px) saturate(142%);
}
.glass-panel::after {
  padding:.5px;
  background:linear-gradient(106deg,rgba(255,255,255,.64),transparent 24%,transparent 74%,rgba(184,233,249,.24)) border-box;
  opacity:.62;
}
.icon-button {
  border:.5px solid rgba(255,255,255,.28);
  background:linear-gradient(142deg,rgba(255,255,255,.105),rgba(255,255,255,.035));
  box-shadow:0 11px 30px rgba(0,8,12,.18),inset 0 .5px 0 rgba(255,255,255,.42),inset 0 -.5px 0 rgba(0,0,0,.12);
  backdrop-filter:blur(28px) saturate(145%); -webkit-backdrop-filter:blur(28px) saturate(145%);
}
.icon-button::before { opacity:.42; background:linear-gradient(135deg,rgba(255,255,255,.35),transparent 35%,rgba(196,238,251,.07)); }

.optical-target { position:relative; z-index:12; }
.optical-target::before,.optical-target::after { display:none!important; }
body.optical-ready .optical-target {
  background:rgba(255,255,255,.012)!important;
  border-color:rgba(255,255,255,.055)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body.optical-ready .tab-bar { background:rgba(7,12,16,.34)!important; border-color:rgba(255,255,255,.08)!important; }
body.optical-ready .primary-button { background:rgba(7,12,16,.16)!important; }
body:not(.optical-ready) .optical-target {
  background:linear-gradient(142deg,rgba(255,255,255,.11),rgba(255,255,255,.035),rgba(174,229,247,.045))!important;
  border-color:rgba(255,255,255,.28)!important;
}
liquid-glass,.lqg-glass,.lqg-glass * { pointer-events:none!important; }

.day-rail { gap:4px; margin-bottom:19px; }
.day-chip { color:rgba(230,236,239,.38); border-radius:15px; font-weight:610; }
.day-chip.active {
  color:#f7f9fa;
  border:.5px solid rgba(255,255,255,.22);
  background:linear-gradient(142deg,rgba(255,255,255,.105),rgba(255,255,255,.035));
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.36),0 8px 25px rgba(0,0,0,.12);
  backdrop-filter:blur(26px) saturate(135%); -webkit-backdrop-filter:blur(26px) saturate(135%);
}

.hero-card { border-radius:32px; min-height:226px; isolation:auto; }
.hero-card::before { background:linear-gradient(135deg,rgba(255,255,255,.035),transparent 42%,rgba(174,228,246,.025)); }
.lens-well { display:none; }
.readiness-ring { width:76px; height:76px; }
.ring-track { stroke:rgba(255,255,255,.09); }
.ring-value { stroke:rgba(241,248,250,.72); filter:none; }
.readiness-ring span,.numeral { color:#f5f8fa; }
.readiness-ring span { font-weight:560; }
.readiness-ring small { color:rgba(235,241,244,.46); }
.hero-copy h2 { font-weight:610; }
.primary-button {
  min-height:49px;
  color:#f8fafb;
  border:.5px solid rgba(255,255,255,.28);
  background:linear-gradient(142deg,rgba(255,255,255,.13),rgba(255,255,255,.045) 58%,rgba(183,230,245,.055));
  box-shadow:0 10px 28px rgba(0,8,12,.16),inset 0 .5px 0 rgba(255,255,255,.45),inset 0 -.5px 0 rgba(0,0,0,.1);
  text-shadow:0 1px 10px rgba(0,0,0,.35);
  backdrop-filter:blur(30px) saturate(140%); -webkit-backdrop-filter:blur(30px) saturate(140%);
}

.section-heading { margin-top:25px; }
.status-pill { color:rgba(237,242,245,.58); border:.5px solid rgba(255,255,255,.15); background:rgba(255,255,255,.025); backdrop-filter:none; }
.status-pill::before { background:rgba(239,247,249,.72); box-shadow:none; }
.exercise-list { gap:8px; }
.exercise-card {
  min-height:68px;
  border:.5px solid rgba(255,255,255,.12);
  border-radius:19px;
  background:rgba(255,255,255,.018);
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.08);
  backdrop-filter:none; -webkit-backdrop-filter:none;
}
.exercise-number {
  color:rgba(244,248,249,.88);
  border:.5px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.11);
  font-weight:570;
}
.exercise-chevron { color:rgba(235,241,244,.27); }
.safety-note { background:transparent; border-color:rgba(255,255,255,.09); box-shadow:none; backdrop-filter:none; }
.safety-icon { color:rgba(241,247,249,.75); }

.tab-bar { position:fixed; left:50%; bottom:calc(14px + env(safe-area-inset-bottom)); transform:translateX(-50%); border-radius:28px; z-index:20; }
.tab { color:rgba(232,238,241,.34); font-weight:570; }
.tab.active {
  color:#f8fafb;
  border:.5px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.07);
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.24);
}
.history-score strong,.metric-card strong { color:#f4f8f9; }
.bar { background:linear-gradient(to top,rgba(198,222,230,.35),rgba(244,249,250,.88)); box-shadow:none; }
.coach-orb { background:radial-gradient(circle at 34% 28%,#fff,#dce7eb 13%,#64747b 39%,#11171b 69%); box-shadow:inset -7px -8px 16px rgba(0,0,0,.45),0 0 20px rgba(220,243,250,.06); }
.input-wrap input:focus,.form-dialog input:focus,textarea:focus { border-color:rgba(226,243,248,.38); box-shadow:0 0 0 3px rgba(220,240,246,.055); }
.set-check.done { border-color:rgba(235,247,250,.25); background:rgba(255,255,255,.07); color:#f6fafb; }
.session-sheet,.form-dialog { background:rgba(12,17,22,.88); border-color:rgba(255,255,255,.2); backdrop-filter:blur(48px) saturate(145%); -webkit-backdrop-filter:blur(48px) saturate(145%); }

@media (max-width:640px) {
  body::after { content:""; position:fixed; z-index:4; left:0; right:0; bottom:0; height:112px; pointer-events:none; background:linear-gradient(180deg,transparent,rgba(7,10,14,.74) 52%,rgba(7,10,14,.94)); }
  .hero-card { min-height:210px; border-radius:30px; padding:20px; }
  .hero-copy h2 { font-size:clamp(29px,9.3vw,36px); }
  .readiness-ring { width:68px; height:68px; }
  .hero-card .primary-button { min-height:46px; }
  .section-heading { margin-top:21px; }
  .exercise-list { gap:7px; }
  .exercise-card { min-height:58px; padding:9px 11px; }
  .exercise-number { width:40px; height:40px; }
  .tab-bar { height:66px; }
}
@media (prefers-reduced-transparency:reduce) {
  liquid-glass { display:none!important; }
  .optical-target { background:#172028!important; border-color:rgba(255,255,255,.28)!important; }
}
/* v5 — living gravitational edges: stronger lift without purple/neon. */
:root {
  --lift-cyan:rgba(126,222,255,.18);
  --lift-warm:rgba(255,231,199,.11);
}
body {
  background:
    radial-gradient(ellipse at 10% -10%,rgba(185,229,245,.17),transparent 38%),
    radial-gradient(ellipse at 94% 46%,rgba(106,195,226,.085),transparent 31%),
    radial-gradient(ellipse at 48% 108%,rgba(230,244,249,.055),transparent 34%),
    linear-gradient(155deg,#151d26 0%,#070a0e 47%,#0a1016 100%);
}
.ambient-a { opacity:.2; }
.ambient-b { opacity:.1; }

.glass-panel {
  border-color:rgba(255,255,255,.31);
  background:linear-gradient(143deg,rgba(255,255,255,.105),rgba(255,255,255,.035) 43%,rgba(111,204,235,.052) 78%,rgba(255,255,255,.025));
  box-shadow:
    0 34px 88px rgba(0,5,9,.48),
    0 10px 28px rgba(0,4,8,.3),
    0 0 42px rgba(111,209,241,.055),
    inset 0 1px 0 rgba(255,255,255,.58),
    inset 0 -1px 0 rgba(77,162,190,.13);
}
.glass-panel::after {
  opacity:.9;
  background:linear-gradient(108deg,rgba(255,255,255,.88),rgba(188,239,255,.3) 16%,transparent 31%,transparent 66%,rgba(255,232,202,.18) 84%,rgba(255,255,255,.48)) border-box;
}
.hero-card { transform:translateY(-3px); }
.hero-card::before {
  opacity:.72;
  background:linear-gradient(112deg,transparent 8%,rgba(255,255,255,.11) 23%,transparent 38%,transparent 64%,rgba(143,225,252,.09) 77%,transparent 91%);
  background-size:230% 100%;
  animation:hero-specular 8s ease-in-out infinite;
}
.icon-button {
  border-color:rgba(255,255,255,.39);
  box-shadow:0 16px 34px rgba(0,5,9,.35),0 0 20px rgba(137,222,250,.055),inset 0 1px 0 rgba(255,255,255,.62),inset 0 -1px 0 rgba(0,0,0,.22);
}
.day-chip.active {
  border-color:rgba(255,255,255,.35);
  box-shadow:0 13px 30px rgba(0,5,9,.26),0 0 18px rgba(142,224,250,.055),inset 0 1px 0 rgba(255,255,255,.48);
}
.exercise-card {
  border-color:rgba(255,255,255,.155);
  background:linear-gradient(138deg,rgba(255,255,255,.032),rgba(255,255,255,.012));
  box-shadow:0 10px 24px rgba(0,5,8,.16),inset 0 .5px 0 rgba(255,255,255,.13);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.exercise-card:hover {
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.27);
  box-shadow:0 18px 34px rgba(0,5,8,.25),0 0 20px rgba(121,213,243,.04),inset 0 .5px 0 rgba(255,255,255,.2);
}
.exercise-number {
  border-color:rgba(255,255,255,.22);
  background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.022));
  box-shadow:0 6px 16px rgba(0,4,7,.18),inset 0 .5px 0 rgba(255,255,255,.2);
}

.lqg-glass {
  pointer-events:none!important;
  overflow:hidden!important;
  box-shadow:
    0 24px 60px rgba(0,4,8,.52),
    0 8px 20px rgba(0,4,8,.32),
    0 0 28px var(--lift-cyan),
    inset 0 1px 1px rgba(255,255,255,.78),
    inset 0 -1px 1px rgba(69,178,216,.25)!important;
  animation:optical-breathe 5.6s ease-in-out infinite;
}
.lqg-glass::after {
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  padding:1px;
  background:linear-gradient(108deg,transparent 5%,rgba(255,255,255,.9) 20%,rgba(116,225,255,.52) 27%,transparent 39%,transparent 63%,rgba(255,222,181,.3) 76%,rgba(255,255,255,.62) 84%,transparent 96%);
  background-size:230% 100%;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  animation:optical-edge-sweep 6.8s ease-in-out infinite;
}
body.optical-ready .primary-button {
  border-color:rgba(255,255,255,.14)!important;
  box-shadow:0 18px 40px rgba(0,4,8,.31),0 0 24px rgba(123,219,250,.07)!important;
}
body.optical-ready .tab-bar {
  border-color:rgba(255,255,255,.15)!important;
  box-shadow:0 28px 64px rgba(0,4,8,.5),0 7px 22px rgba(0,4,8,.3),0 0 30px rgba(122,217,248,.07)!important;
}
.tab.active {
  border-color:rgba(255,255,255,.26);
  background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.045));
  box-shadow:0 7px 18px rgba(0,4,7,.2),inset 0 1px 0 rgba(255,255,255,.43);
}

@keyframes optical-edge-sweep {
  0%,15% { background-position:100% 0; opacity:.58; }
  48% { opacity:1; }
  85%,100% { background-position:-110% 0; opacity:.66; }
}
@keyframes optical-breathe {
  0%,100% { filter:brightness(1) saturate(1); }
  50% { filter:brightness(1.075) saturate(1.11); }
}
@keyframes hero-specular {
  0%,18% { background-position:115% 0; }
  72%,100% { background-position:-105% 0; }
}

@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }

/* v6 — one-day-at-a-time Athena voice onboarding. */
.onboarding-shell {
  position:relative; z-index:2; min-height:100dvh;
  padding:calc(24px + env(safe-area-inset-top)) 18px calc(28px + env(safe-area-inset-bottom));
  display:grid; place-items:center;
}
.onboarding-shell[hidden],.onboarding-step[hidden] { display:none!important; }
body.onboarding-active .app-shell,body.onboarding-active .session-sheet,body.onboarding-active .sheet-backdrop,body.onboarding-active .form-dialog { display:none!important; }
.onboarding-stage { width:min(100%,620px); }
.onboarding-step { animation:enter .42s cubic-bezier(.2,.8,.2,1); }
.onboarding-step > h2 { margin:10px 0 8px; font-size:clamp(34px,8vw,52px); line-height:1; letter-spacing:-2.2px; font-weight:620; }
.athena-intro { display:flex; align-items:center; gap:19px; }
.athena-intro img {
  width:102px; height:102px; flex:none; object-fit:cover; border-radius:31px;
  border:1px solid rgba(255,255,255,.34);
  box-shadow:0 24px 60px rgba(0,4,8,.48),0 0 35px rgba(237,190,112,.1),inset 0 1px 0 rgba(255,255,255,.55);
}
.athena-intro h1 { margin:8px 0 0; font-size:clamp(36px,8vw,58px); line-height:.98; letter-spacing:-2.7px; font-weight:610; }
.intro-copy,.step-copy { max-width:520px; color:var(--muted); line-height:1.6; }
.intro-copy { margin:28px 2px 24px; font-size:15px; }
.onboarding-step > .primary-button { width:100%; }
.body-part-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:26px 0 16px; }
.body-part-grid button {
  min-height:64px; padding:14px; border:1px solid rgba(255,255,255,.15); border-radius:21px;
  background:linear-gradient(142deg,rgba(255,255,255,.055),rgba(255,255,255,.016)); color:var(--text);
  font:inherit; font-size:16px; font-weight:600; text-align:left; cursor:pointer;
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.16); transition:.2s ease;
}
.body-part-grid button.selected {
  transform:translateY(-2px); border-color:rgba(255,255,255,.48);
  background:linear-gradient(142deg,rgba(255,255,255,.15),rgba(151,224,248,.065));
  box-shadow:0 16px 32px rgba(0,5,9,.29),0 0 24px rgba(127,218,248,.075),inset 0 1px 0 rgba(255,255,255,.5);
}
.selection-note { min-height:22px; margin:0 2px 16px; color:var(--muted); font-size:12px; }
.primary-button:disabled { opacity:.32; cursor:not-allowed; }
.text-button,.example-button,.secondary-button {
  appearance:none; border:0; background:transparent; color:rgba(239,245,247,.62); font:inherit; cursor:pointer;
}
.text-button { margin:0 0 14px 4px; padding:8px 0; font-size:12px; }
.voice-entry-card { overflow:hidden; border-radius:36px; padding:26px; min-height:600px; }
.voice-card-heading { position:relative; z-index:2; display:grid; grid-template-columns:minmax(0,1fr) 74px; align-items:start; gap:18px; }
.voice-card-heading h2 { margin:10px 0 0; font-size:clamp(28px,7vw,42px); line-height:1.02; letter-spacing:-1.8px; font-weight:610; text-wrap:balance; }
.voice-card-heading img { width:74px; height:74px; object-fit:cover; border-radius:24px; border:1px solid rgba(255,255,255,.25); opacity:.9; }
.voice-example { position:relative; z-index:2; max-width:470px; margin:18px 0 6px; color:var(--muted); font-size:12px; line-height:1.55; }
.voice-control-area { position:relative; z-index:2; min-height:278px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.voice-button {
  width:112px; height:112px; border-radius:50%; border:1px solid rgba(255,255,255,.46);
  background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.028) 54%,rgba(123,220,252,.07));
  color:#fff; display:grid; place-items:center; cursor:pointer; touch-action:none; user-select:none; -webkit-user-select:none;
  box-shadow:0 28px 62px rgba(0,4,8,.55),0 0 38px rgba(122,219,250,.14),inset 0 1px 1px rgba(255,255,255,.7),inset 0 -1px 1px rgba(74,177,211,.25);
  transition:transform .22s ease,filter .22s ease;
}
.voice-button svg { width:37px; height:37px; fill:none; stroke:currentColor; stroke-width:1.45; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
.voice-control-area strong { margin-top:20px; font-size:14px; font-weight:620; }
.voice-control-area > small { margin-top:6px; color:var(--muted); text-align:center; }
.voice-lock-rail {
  position:absolute; top:12px; left:50%; transform:translateX(-50%); opacity:0;
  width:86px; height:68px; border:1px solid rgba(255,255,255,.13); border-radius:30px;
  background:rgba(255,255,255,.028); display:flex; flex-direction:column; align-items:center; justify-content:center; transition:.2s ease;
}
.voice-lock-rail span { font-size:19px; }.voice-lock-rail small { color:var(--muted); font-size:8px; }
.voice-entry-card[data-voice-state="listening"] .voice-button,.voice-entry-card[data-voice-state="locked"] .voice-button { transform:scale(1.08); filter:brightness(1.17); }
.voice-entry-card[data-voice-state="listening"] .voice-lock-rail,.voice-entry-card[data-voice-state="locked"] .voice-lock-rail { opacity:1; transform:translate(-50%,-8px); }
.voice-entry-card[data-voice-state="listening"] .voice-button { animation:voice-gravity-pulse 1.35s ease-in-out infinite; }
.voice-entry-card[data-voice-state="locked"] .voice-button { box-shadow:0 30px 70px rgba(0,4,8,.58),0 0 52px rgba(126,222,255,.23),inset 0 1px 1px rgba(255,255,255,.82); }
.example-button { display:block; margin:-4px auto 4px; padding:9px 13px; font-size:11px; text-decoration:underline; text-underline-offset:4px; }
.example-button[hidden],.voice-result[hidden] { display:none!important; }
.voice-result { position:relative; z-index:2; margin-top:12px; padding-top:20px; border-top:1px solid rgba(255,255,255,.11); }
.voice-result label { position:relative; display:grid; gap:6px; color:var(--muted); font-size:9px; letter-spacing:.8px; text-transform:uppercase; }
.voice-result input { width:100%; height:48px; border:1px solid rgba(255,255,255,.15); border-radius:15px; background:rgba(255,255,255,.035); color:var(--text); padding:0 13px; font:inherit; font-size:14px; outline:none; }
.parsed-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:10px; }
.parsed-grid label:last-child { position:relative; }.parsed-grid label:last-child span { position:absolute; right:12px; bottom:16px; color:var(--muted); font-size:9px; }
#parsedWeight { padding-right:34px; }
.weight-pattern-question { margin-top:16px; padding:15px; border:1px solid rgba(255,255,255,.11); border-radius:18px; background:rgba(255,255,255,.025); }
.weight-pattern-question > p { margin:0 0 11px; color:rgba(242,247,249,.88); font-size:13px; }
.weight-pattern-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.choice-button { min-height:42px; border:1px solid rgba(255,255,255,.12); border-radius:14px; background:rgba(255,255,255,.025); color:var(--muted); font:inherit; font-size:12px; cursor:pointer; }
.choice-button.selected { border-color:rgba(180,231,250,.38); background:rgba(164,225,247,.11); color:var(--text); box-shadow:inset 0 1px 0 rgba(255,255,255,.17); }
.varied-weight-prompt { margin-top:13px; }
.varied-weight-prompt[hidden] { display:none!important; }
.voice-suggestion { margin:9px 2px 0!important; color:var(--muted)!important; font-size:11px!important; line-height:1.45; }
.voice-suggestion strong { color:rgba(242,247,249,.86); font-weight:600; }
#baselineExplanation { margin:17px 0; color:rgba(242,247,249,.78); font-size:13px; }
.confirmation-actions { display:grid; grid-template-columns:.72fr 1.28fr; gap:9px; }
.secondary-button { min-height:49px; border:1px solid rgba(255,255,255,.13); border-radius:17px; background:rgba(255,255,255,.025); }
.saved-exercise-stack { display:grid; gap:9px; margin:0 0 14px; }
.saved-exercise-stack[hidden],.next-exercise-card[hidden],.voice-entry-card[hidden] { display:none!important; }
.saved-exercise-card { position:relative; overflow:hidden; display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:center; gap:12px; padding:14px 16px; border-radius:22px; animation:saved-card-settle .42s cubic-bezier(.2,.8,.2,1); }
.saved-exercise-number { width:36px; height:36px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.18); border-radius:14px; background:rgba(255,255,255,.055); color:rgba(242,248,250,.72); font-size:11px; }
.saved-exercise-card h3 { margin:0 0 4px; font-size:14px; font-weight:620; }
.saved-exercise-card p { margin:0; color:var(--muted); font-size:11px; }
.saved-check { color:rgba(184,236,250,.88); font-size:18px; }
.next-exercise-card { position:relative; overflow:hidden; min-height:350px; padding:30px; border-radius:36px; display:flex; flex-direction:column; justify-content:center; animation:next-card-rise .46s cubic-bezier(.2,.86,.2,1); }
.next-exercise-card h2 { max-width:470px; margin:12px 0 10px; font-size:clamp(34px,8vw,48px); line-height:1; letter-spacing:-2px; font-weight:610; text-wrap:balance; }
.next-exercise-card > p:not(.eyebrow) { max-width:430px; margin:0 0 28px; color:var(--muted); line-height:1.55; }
.next-exercise-actions { display:grid; grid-template-columns:1.25fr .75fr; gap:9px; }
.next-exercise-actions .secondary-button { color:rgba(239,245,247,.68); }
@keyframes saved-card-settle { from{opacity:0;transform:translateY(14px) scale(.98)} to{opacity:1;transform:none} }
@keyframes next-card-rise { from{opacity:0;transform:translateY(24px) scale(.975);filter:blur(5px)} to{opacity:1;transform:none;filter:none} }
.today-part-chip { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:0 16px; border:1px solid rgba(255,255,255,.18); border-radius:16px; background:rgba(255,255,255,.045); color:rgba(245,249,250,.85); font-size:12px; }
@keyframes voice-gravity-pulse { 0%,100%{transform:scale(1.04)} 50%{transform:scale(1.11)} }
@media (max-width:640px) {
  .onboarding-shell { align-items:start; padding-left:15px; padding-right:15px; }
  .onboarding-stage { padding-top:clamp(12px,7vh,58px); }
  .athena-intro { align-items:flex-start; gap:14px; }
  .athena-intro img { width:78px; height:78px; border-radius:24px; }
  .athena-intro h1 { font-size:clamp(32px,10vw,43px); letter-spacing:-2px; }
  .intro-copy { margin-top:23px; }
  .body-part-grid { gap:8px; margin-top:21px; }
  .body-part-grid button { min-height:57px; border-radius:18px; font-size:14px; }
  .voice-entry-card { min-height:0; padding:20px; border-radius:31px; }
  .voice-card-heading { grid-template-columns:minmax(0,1fr) 58px; gap:10px; }
  .voice-card-heading img { width:58px; height:58px; border-radius:19px; }
  .voice-card-heading h2 { font-size:clamp(27px,7.8vw,34px); }
  .voice-control-area { min-height:250px; }
  .voice-button { width:100px; height:100px; }
  .parsed-grid { gap:6px; }
  .voice-result input { padding-inline:9px; }
  .next-exercise-card { min-height:330px; padding:25px; }
  .next-exercise-actions { grid-template-columns:1fr; }
}

/* v7 calibration — three isolated optical materials for the same workout state. */
html[data-glass-variant] {
  --calibration-edge:rgba(255,255,255,.72);
  --calibration-cool:rgba(152,226,252,.2);
  --calibration-warm:rgba(255,225,193,.12);
}
html[data-glass-variant] body {
  background:
    radial-gradient(circle at 18% 8%,rgba(190,234,250,.2),transparent 29%),
    radial-gradient(circle at 86% 71%,rgba(113,196,225,.11),transparent 27%),
    linear-gradient(155deg,#17222d 0%,#070b10 46%,#0d151d 100%);
}
html[data-glass-variant] .saved-exercise-card,
html[data-glass-variant] .next-exercise-card {
  isolation:isolate;
  border:0;
}
html[data-glass-variant] .saved-exercise-card > *,
html[data-glass-variant] .next-exercise-card > * { position:relative; z-index:2; }
html[data-glass-variant] .saved-exercise-card::before,
html[data-glass-variant] .next-exercise-card::before {
  content:"";
  position:absolute;
  inset:1px;
  z-index:0;
  border-radius:inherit;
  pointer-events:none;
}
html[data-glass-variant] .saved-exercise-card::after,
html[data-glass-variant] .next-exercise-card::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  border-radius:inherit;
  pointer-events:none;
  padding:1px;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
}

/* A — clear optical glass: brightest transmission, smallest edge, Apple-like restraint. */
html[data-glass-variant="clear"] { --calibration-edge:rgba(255,255,255,.86); }
html[data-glass-variant="clear"] .saved-exercise-card,
html[data-glass-variant="clear"] .next-exercise-card {
  background:linear-gradient(142deg,rgba(255,255,255,.13),rgba(255,255,255,.035) 45%,rgba(184,235,250,.07));
  box-shadow:0 28px 70px rgba(0,5,9,.34),inset 0 1px 0 rgba(255,255,255,.58),inset 0 -1px 0 rgba(0,0,0,.15);
  backdrop-filter:blur(34px) saturate(155%) brightness(1.06);
  -webkit-backdrop-filter:blur(34px) saturate(155%) brightness(1.06);
}
html[data-glass-variant="clear"] .saved-exercise-card::before,
html[data-glass-variant="clear"] .next-exercise-card::before {
  background:linear-gradient(128deg,rgba(255,255,255,.1),transparent 38%,rgba(151,226,250,.045));
  box-shadow:inset 0 0 28px rgba(255,255,255,.025);
}
html[data-glass-variant="clear"] .saved-exercise-card::after,
html[data-glass-variant="clear"] .next-exercise-card::after {
  background:linear-gradient(112deg,var(--calibration-edge),rgba(204,240,252,.23) 18%,transparent 34%,transparent 74%,rgba(255,255,255,.38)) border-box;
}
html[data-glass-variant="clear"] .saved-exercise-number,
html[data-glass-variant="clear"] .next-exercise-actions button {
  background:rgba(255,255,255,.065);
  border-color:rgba(255,255,255,.25);
}

/* B — gravitational lens: thick refractive rim, cool/warm caustics and lifted depth. */
html[data-glass-variant="lens"] { --calibration-edge:rgba(255,255,255,.96); }
html[data-glass-variant="lens"] .saved-exercise-card,
html[data-glass-variant="lens"] .next-exercise-card {
  background:
    radial-gradient(circle at 15% 5%,rgba(255,255,255,.16),transparent 24%),
    linear-gradient(136deg,rgba(255,255,255,.085),rgba(5,15,22,.14) 47%,rgba(111,210,241,.075));
  box-shadow:0 38px 88px rgba(0,4,8,.56),0 0 44px rgba(105,205,238,.09),inset 0 2px 1px rgba(255,255,255,.52),inset 0 -2px 2px rgba(62,158,191,.22);
  backdrop-filter:blur(27px) saturate(178%) contrast(1.08);
  -webkit-backdrop-filter:blur(27px) saturate(178%) contrast(1.08);
  transform:translateY(-2px);
}
html[data-glass-variant="lens"] .saved-exercise-card::before,
html[data-glass-variant="lens"] .next-exercise-card::before {
  inset:3px;
  background:
    linear-gradient(118deg,rgba(255,255,255,.13),transparent 29%,transparent 63%,rgba(94,207,244,.085)),
    radial-gradient(ellipse at 78% 108%,rgba(255,214,170,.12),transparent 37%);
  box-shadow:inset 9px 8px 26px rgba(255,255,255,.035),inset -10px -8px 28px rgba(81,196,234,.075);
}
html[data-glass-variant="lens"] .saved-exercise-card::after,
html[data-glass-variant="lens"] .next-exercise-card::after {
  padding:2px;
  background:conic-gradient(from 215deg at 50% 50%,rgba(255,255,255,.98),rgba(137,224,252,.5),transparent 20%,transparent 51%,rgba(255,220,180,.3),rgba(255,255,255,.88),rgba(131,220,250,.45),rgba(255,255,255,.98)) border-box;
  filter:drop-shadow(0 0 8px rgba(140,222,249,.14));
}
html[data-glass-variant="lens"] .saved-exercise-number {
  background:radial-gradient(circle at 30% 22%,rgba(255,255,255,.2),rgba(103,207,242,.045) 55%,rgba(0,0,0,.08));
  border-color:rgba(255,255,255,.4);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.62),0 8px 19px rgba(0,4,8,.34);
}
html[data-glass-variant="lens"] .next-exercise-actions .primary-button {
  background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(106,211,246,.07))!important;
  border-color:rgba(255,255,255,.42);
  box-shadow:0 18px 36px rgba(0,4,8,.33),inset 0 1px 1px rgba(255,255,255,.62);
}

/* C — smoked gravitational glass: deepest material, crisp edge, maximum gym readability. */
html[data-glass-variant="smoked"] body {
  background:
    radial-gradient(circle at 20% 4%,rgba(151,213,234,.11),transparent 29%),
    linear-gradient(155deg,#10171e 0%,#04070a 49%,#090e13 100%);
}
html[data-glass-variant="smoked"] .saved-exercise-card,
html[data-glass-variant="smoked"] .next-exercise-card {
  background:linear-gradient(137deg,rgba(30,41,50,.79),rgba(5,10,14,.7) 56%,rgba(15,27,34,.78));
  box-shadow:0 36px 84px rgba(0,0,0,.66),inset 0 1px 0 rgba(255,255,255,.27),inset 0 -1px 0 rgba(0,0,0,.58);
  backdrop-filter:blur(44px) saturate(125%);
  -webkit-backdrop-filter:blur(44px) saturate(125%);
}
html[data-glass-variant="smoked"] .saved-exercise-card::before,
html[data-glass-variant="smoked"] .next-exercise-card::before {
  background:linear-gradient(121deg,rgba(255,255,255,.055),transparent 32%,rgba(93,183,215,.045));
  box-shadow:inset 0 0 42px rgba(0,0,0,.28),inset 8px 0 24px rgba(255,255,255,.015);
}
html[data-glass-variant="smoked"] .saved-exercise-card::after,
html[data-glass-variant="smoked"] .next-exercise-card::after {
  background:linear-gradient(110deg,rgba(255,255,255,.68),rgba(127,214,243,.22) 19%,transparent 36%,transparent 72%,rgba(255,255,255,.25)) border-box;
}
html[data-glass-variant="smoked"] .saved-exercise-number {
  background:rgba(255,255,255,.045);
  border-color:rgba(255,255,255,.2);
}
html[data-glass-variant="smoked"] .saved-check { color:rgba(208,241,250,.72); }
html[data-glass-variant="smoked"] .next-exercise-actions .primary-button {
  background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(80,170,201,.045))!important;
  border-color:rgba(255,255,255,.29);
}

/* D — neutral white gravitational glass: colorless refraction on a bright field. */
html[data-glass-variant="white"] {
  color-scheme:light;
  background:#f5f5f2;
  --bg:#f5f5f2;
  --bg-soft:#ececea;
  --text:#151719;
  --muted:#66696c;
  --line:rgba(20,22,24,.13);
  --line-bright:rgba(255,255,255,.92);
  --calibration-edge:rgba(255,255,255,.98);
}
html[data-glass-variant="white"] body {
  color:var(--text);
  background:
    radial-gradient(ellipse at 8% 10%,rgba(0,0,0,.075),transparent 31%),
    radial-gradient(ellipse at 92% 68%,rgba(0,0,0,.055),transparent 27%),
    linear-gradient(147deg,#fff 0%,#f5f5f2 47%,#e9e9e6 100%);
}
html[data-glass-variant="white"] body::before { opacity:.11; mix-blend-mode:multiply; }
html[data-glass-variant="white"] .ambient-a {
  background:#929292;
  opacity:.12;
}
html[data-glass-variant="white"] .ambient-b {
  background:#fff;
  opacity:.5;
  box-shadow:0 0 90px rgba(0,0,0,.08);
}
html[data-glass-variant="white"] .saved-exercise-card,
html[data-glass-variant="white"] .next-exercise-card {
  background:
    radial-gradient(circle at 15% 4%,rgba(255,255,255,.94),transparent 25%),
    linear-gradient(136deg,rgba(255,255,255,.58),rgba(255,255,255,.19) 48%,rgba(228,228,225,.3));
  box-shadow:0 34px 72px rgba(26,28,30,.16),0 3px 14px rgba(26,28,30,.07),inset 0 2px 1px rgba(255,255,255,.98),inset 0 -2px 2px rgba(40,42,44,.09);
  backdrop-filter:blur(29px) saturate(100%) contrast(1.03);
  -webkit-backdrop-filter:blur(29px) saturate(100%) contrast(1.03);
  transform:translateY(-2px);
}
html[data-glass-variant="white"] .saved-exercise-card::before,
html[data-glass-variant="white"] .next-exercise-card::before {
  inset:3px;
  background:
    linear-gradient(118deg,rgba(255,255,255,.72),transparent 29%,transparent 66%,rgba(0,0,0,.025)),
    radial-gradient(ellipse at 78% 108%,rgba(255,255,255,.44),transparent 38%);
  box-shadow:inset 9px 8px 26px rgba(255,255,255,.32),inset -10px -8px 28px rgba(0,0,0,.025);
}
html[data-glass-variant="white"] .saved-exercise-card::after,
html[data-glass-variant="white"] .next-exercise-card::after {
  padding:2px;
  background:conic-gradient(from 215deg at 50% 50%,#fff,rgba(255,255,255,.68),rgba(30,32,34,.11) 20%,transparent 36%,transparent 54%,rgba(20,22,24,.12),rgba(255,255,255,.98),rgba(28,30,32,.13),#fff) border-box;
  filter:drop-shadow(0 1px 3px rgba(20,22,24,.13));
}
html[data-glass-variant="white"] .saved-exercise-number {
  color:rgba(20,22,24,.68);
  background:radial-gradient(circle at 30% 22%,rgba(255,255,255,.96),rgba(255,255,255,.32) 58%,rgba(0,0,0,.035));
  border-color:rgba(20,22,24,.15);
  box-shadow:inset 0 1px 1px #fff,0 8px 18px rgba(20,22,24,.09);
}
html[data-glass-variant="white"] .saved-check { color:rgba(25,27,29,.62); }
html[data-glass-variant="white"] .next-exercise-actions button {
  color:#202224;
  background:linear-gradient(145deg,rgba(255,255,255,.69),rgba(255,255,255,.25))!important;
  border-color:rgba(25,27,29,.16);
  box-shadow:0 14px 28px rgba(20,22,24,.09),inset 0 1px 1px rgba(255,255,255,.98);
}
html[data-glass-variant="white"] .toast {
  color:#202224;
  border-color:rgba(20,22,24,.14);
  background:linear-gradient(145deg,rgba(255,255,255,.8),rgba(255,255,255,.38));
  box-shadow:0 18px 44px rgba(20,22,24,.16),inset 0 1px 1px #fff;
  text-shadow:none;
  backdrop-filter:blur(26px) saturate(100%);
  -webkit-backdrop-filter:blur(26px) saturate(100%);
}

/* White-field repairs: no dark mobile footer veil and no white-on-white utility copy. */
html[data-glass-variant="white"] body::after { background:linear-gradient(180deg,transparent,rgba(245,245,242,.52) 54%,rgba(245,245,242,.92)); }
html[data-glass-variant="white"] .text-button,
html[data-glass-variant="white"] .eyebrow { color:rgba(24,26,28,.46); }

/* v8 — light glass laboratory: three brighter premium directions beyond the neutral baseline. */
html[data-glass-variant="air"],
html[data-glass-variant="crystal"],
html[data-glass-variant="pearl"] {
  color-scheme:light;
  --text:#17191b;
  --muted:#62666a;
  --line:rgba(18,20,22,.12);
  --line-bright:rgba(255,255,255,.94);
}
html[data-glass-variant="air"] body::after,
html[data-glass-variant="crystal"] body::after,
html[data-glass-variant="pearl"] body::after {
  background:linear-gradient(180deg,transparent,rgba(250,250,248,.44) 54%,rgba(248,248,246,.9));
}
html[data-glass-variant="air"] .text-button,
html[data-glass-variant="crystal"] .text-button,
html[data-glass-variant="pearl"] .text-button,
html[data-glass-variant="air"] .eyebrow,
html[data-glass-variant="crystal"] .eyebrow,
html[data-glass-variant="pearl"] .eyebrow { color:rgba(24,26,28,.48); }
html[data-glass-variant="air"] .saved-check,
html[data-glass-variant="crystal"] .saved-check,
html[data-glass-variant="pearl"] .saved-check { color:rgba(24,26,28,.58); }
html[data-glass-variant="air"] .saved-exercise-number,
html[data-glass-variant="crystal"] .saved-exercise-number,
html[data-glass-variant="pearl"] .saved-exercise-number { color:rgba(20,22,24,.67); }

/* E — AIR GLASS: the lightest direction, almost weightless with a soft contact shadow. */
html[data-glass-variant="air"] { background:#fdfdfc; --bg:#fdfdfc; --bg-soft:#f5f5f3; --calibration-edge:rgba(255,255,255,.99); }
html[data-glass-variant="air"] body {
  color:var(--text);
  background:
    radial-gradient(ellipse at 18% 7%,rgba(0,0,0,.035),transparent 29%),
    radial-gradient(ellipse at 87% 67%,rgba(0,0,0,.027),transparent 31%),
    linear-gradient(152deg,#fff 0%,#fcfcfb 58%,#f4f4f2 100%);
}
html[data-glass-variant="air"] body::before { opacity:.045; mix-blend-mode:multiply; }
html[data-glass-variant="air"] .ambient-a { background:#a8a8a6; opacity:.055; }
html[data-glass-variant="air"] .ambient-b { background:#fff; opacity:.34; }
html[data-glass-variant="air"] .saved-exercise-card,
html[data-glass-variant="air"] .next-exercise-card {
  background:linear-gradient(142deg,rgba(255,255,255,.66),rgba(255,255,255,.24));
  box-shadow:0 23px 54px rgba(24,26,28,.10),0 2px 7px rgba(24,26,28,.04),inset 0 1px 0 rgba(255,255,255,1),inset 0 -1px 0 rgba(30,32,34,.045);
  backdrop-filter:blur(19px) saturate(100%);
  -webkit-backdrop-filter:blur(19px) saturate(100%);
  transform:none;
}
html[data-glass-variant="air"] .saved-exercise-card::before,
html[data-glass-variant="air"] .next-exercise-card::before {
  inset:2px;
  background:linear-gradient(125deg,rgba(255,255,255,.48),transparent 36%,rgba(255,255,255,.12) 72%,rgba(0,0,0,.012));
  box-shadow:inset 6px 6px 18px rgba(255,255,255,.32);
}
html[data-glass-variant="air"] .saved-exercise-card::after,
html[data-glass-variant="air"] .next-exercise-card::after {
  padding:1px;
  background:linear-gradient(132deg,#fff,rgba(255,255,255,.46) 36%,rgba(25,27,29,.09) 71%,#fff) border-box;
  filter:drop-shadow(0 1px 1px rgba(20,22,24,.08));
}
html[data-glass-variant="air"] .saved-exercise-number,
html[data-glass-variant="air"] .next-exercise-actions button,
html[data-glass-variant="air"] .toast {
  color:#202224;
  background:rgba(255,255,255,.5)!important;
  border-color:rgba(22,24,26,.12);
  box-shadow:0 10px 24px rgba(22,24,26,.07),inset 0 1px 0 #fff;
  text-shadow:none;
}

/* F — CRYSTAL LENS: clearer optics, visible refraction and a polished titanium rim. */
html[data-glass-variant="crystal"] { background:#f7f8f8; --bg:#f7f8f8; --bg-soft:#eef0f0; --calibration-edge:rgba(255,255,255,1); }
html[data-glass-variant="crystal"] body {
  color:var(--text);
  background:
    repeating-linear-gradient(118deg,transparent 0 54px,rgba(18,20,22,.022) 55px,transparent 56px 112px),
    radial-gradient(circle at 10% 18%,rgba(0,0,0,.055),transparent 24%),
    radial-gradient(circle at 88% 73%,rgba(255,255,255,.95),transparent 28%),
    linear-gradient(145deg,#fff,#f1f2f2 66%,#e9ebeb);
}
html[data-glass-variant="crystal"] body::before { opacity:.065; mix-blend-mode:multiply; }
html[data-glass-variant="crystal"] .ambient-a { background:#777b7d; opacity:.08; }
html[data-glass-variant="crystal"] .ambient-b { background:#fff; opacity:.42; }
html[data-glass-variant="crystal"] .saved-exercise-card,
html[data-glass-variant="crystal"] .next-exercise-card {
  background:
    radial-gradient(ellipse at 8% 0%,rgba(255,255,255,.82),transparent 31%),
    linear-gradient(137deg,rgba(255,255,255,.43),rgba(255,255,255,.12) 52%,rgba(210,214,215,.16));
  box-shadow:0 31px 64px rgba(21,24,26,.14),0 4px 12px rgba(21,24,26,.05),inset 0 2px 1px #fff,inset 0 -2px 2px rgba(25,28,30,.07);
  backdrop-filter:blur(15px) saturate(100%) contrast(1.055);
  -webkit-backdrop-filter:blur(15px) saturate(100%) contrast(1.055);
  transform:translateY(-1px);
}
html[data-glass-variant="crystal"] .saved-exercise-card::before,
html[data-glass-variant="crystal"] .next-exercise-card::before {
  inset:3px;
  background:linear-gradient(112deg,rgba(255,255,255,.62),transparent 24%,transparent 63%,rgba(0,0,0,.035)),radial-gradient(ellipse at 72% 110%,rgba(255,255,255,.36),transparent 42%);
  box-shadow:inset 9px 8px 20px rgba(255,255,255,.27),inset -10px -8px 22px rgba(18,20,22,.028);
}
html[data-glass-variant="crystal"] .saved-exercise-card::after,
html[data-glass-variant="crystal"] .next-exercise-card::after {
  padding:2px;
  background:conic-gradient(from 224deg,#fff,rgba(255,255,255,.72),rgba(30,34,36,.14) 23%,transparent 37%,transparent 58%,rgba(25,28,30,.12),#fff,rgba(25,28,30,.16),#fff) border-box;
  filter:drop-shadow(0 2px 3px rgba(18,20,22,.12));
}
html[data-glass-variant="crystal"] .saved-exercise-number,
html[data-glass-variant="crystal"] .next-exercise-actions button,
html[data-glass-variant="crystal"] .toast {
  color:#1e2022;
  background:linear-gradient(145deg,rgba(255,255,255,.58),rgba(255,255,255,.16))!important;
  border-color:rgba(22,25,27,.14);
  box-shadow:0 13px 28px rgba(20,23,25,.09),inset 0 1px 0 #fff;
  text-shadow:none;
}

/* G — PEARL MIST: warmer ivory light, soft frost, restrained jewelry-like depth. */
html[data-glass-variant="pearl"] { background:#fbfaf6; --bg:#fbfaf6; --bg-soft:#f2f0e9; --text:#191918; --muted:#68665f; --calibration-edge:rgba(255,255,252,1); }
html[data-glass-variant="pearl"] body {
  color:var(--text);
  background:
    radial-gradient(ellipse at 12% 12%,rgba(103,96,76,.07),transparent 30%),
    radial-gradient(ellipse at 90% 70%,rgba(255,255,255,.96),transparent 31%),
    linear-gradient(148deg,#fffefa 0%,#f8f6ef 53%,#ece9df 100%);
}
html[data-glass-variant="pearl"] body::before { opacity:.055; mix-blend-mode:multiply; }
html[data-glass-variant="pearl"] .ambient-a { background:#999486; opacity:.075; }
html[data-glass-variant="pearl"] .ambient-b { background:#fffdf7; opacity:.45; }
html[data-glass-variant="pearl"] .saved-exercise-card,
html[data-glass-variant="pearl"] .next-exercise-card {
  background:
    radial-gradient(ellipse at 16% 3%,rgba(255,255,252,.91),transparent 29%),
    linear-gradient(139deg,rgba(255,255,252,.65),rgba(249,247,239,.26) 52%,rgba(219,215,202,.21));
  box-shadow:0 29px 62px rgba(58,55,46,.13),0 3px 10px rgba(58,55,46,.05),inset 0 2px 1px rgba(255,255,255,.97),inset 0 -2px 2px rgba(68,64,52,.065);
  backdrop-filter:blur(25px) saturate(92%);
  -webkit-backdrop-filter:blur(25px) saturate(92%);
  transform:translateY(-1px);
}
html[data-glass-variant="pearl"] .saved-exercise-card::before,
html[data-glass-variant="pearl"] .next-exercise-card::before {
  inset:3px;
  background:linear-gradient(121deg,rgba(255,255,252,.64),transparent 31%,rgba(255,253,246,.12) 67%,rgba(70,66,53,.024));
  box-shadow:inset 8px 8px 24px rgba(255,255,255,.3),inset -9px -7px 24px rgba(67,63,51,.023);
}
html[data-glass-variant="pearl"] .saved-exercise-card::after,
html[data-glass-variant="pearl"] .next-exercise-card::after {
  padding:1.5px;
  background:linear-gradient(134deg,#fff,rgba(255,254,248,.72) 32%,rgba(67,64,53,.12) 68%,rgba(255,255,252,.98)) border-box;
  filter:drop-shadow(0 2px 3px rgba(55,52,44,.1));
}
html[data-glass-variant="pearl"] .saved-exercise-number,
html[data-glass-variant="pearl"] .next-exercise-actions button,
html[data-glass-variant="pearl"] .toast {
  color:#22211e;
  background:linear-gradient(145deg,rgba(255,255,252,.72),rgba(245,242,232,.28))!important;
  border-color:rgba(61,58,49,.13);
  box-shadow:0 12px 26px rgba(55,52,44,.08),inset 0 1px 0 #fff;
  text-shadow:none;
}

/* v9 — fitness background laboratory: color lives behind colorless Crystal Lens glass. */
html[data-glass-variant="crystal"][data-background-field] body::before { opacity:.08; mix-blend-mode:multiply; }
html[data-glass-variant="crystal"][data-background-field] .saved-exercise-card,
html[data-glass-variant="crystal"][data-background-field] .next-exercise-card {
  backdrop-filter:blur(12px) saturate(104%) contrast(1.045);
  -webkit-backdrop-filter:blur(12px) saturate(104%) contrast(1.045);
}

/* 1 — Athletic Motion: ice-blue ribbon, coral energy, restrained violet depth. */
html[data-glass-variant="crystal"][data-background-field="motion"] body {
  background:
    radial-gradient(ellipse at 104% 26%,rgba(108,90,216,.27) 0 13%,transparent 34%),
    radial-gradient(ellipse at -4% 74%,rgba(255,119,78,.3) 0 14%,transparent 36%),
    linear-gradient(126deg,transparent 0 26%,rgba(64,170,238,.08) 27% 34%,rgba(81,154,228,.31) 36% 45%,rgba(255,255,255,.08) 47% 52%,transparent 54%),
    linear-gradient(148deg,#fff 0%,#f5f8fb 54%,#edf0f4 100%);
}
html[data-glass-variant="crystal"][data-background-field="motion"] .ambient-a { background:#4b96de; opacity:.14; }
html[data-glass-variant="crystal"][data-background-field="motion"] .ambient-b { background:#ff8a61; opacity:.13; }

/* 2 — Performance Contours: topographic training lines over cool/warm energy zones. */
html[data-glass-variant="crystal"][data-background-field="contour"] body {
  background:
    repeating-radial-gradient(ellipse at 78% 25%,transparent 0 29px,rgba(50,57,66,.07) 30px 31px,transparent 32px 59px),
    radial-gradient(ellipse at 10% 9%,rgba(48,154,229,.24),transparent 34%),
    radial-gradient(ellipse at 92% 78%,rgba(255,144,89,.22),transparent 31%),
    radial-gradient(ellipse at 38% 56%,rgba(126,97,207,.12),transparent 35%),
    linear-gradient(150deg,#fff,#f3f5f7 65%,#eceef0);
}
html[data-glass-variant="crystal"][data-background-field="contour"] .ambient-a { background:#6d8ec8; opacity:.1; }
html[data-glass-variant="crystal"][data-background-field="contour"] .ambient-b { background:#ffc0a0; opacity:.11; }

/* 3 — Velocity Track: diagonal lane rhythm with a sharp cobalt/coral handoff. */
html[data-glass-variant="crystal"][data-background-field="track"] body {
  background:
    repeating-linear-gradient(124deg,transparent 0 48px,rgba(31,37,44,.055) 49px 50px,transparent 51px 98px),
    linear-gradient(124deg,transparent 0 20%,rgba(35,128,222,.27) 20% 31%,rgba(255,255,255,.18) 32% 37%,rgba(239,103,69,.24) 38% 47%,transparent 48%),
    radial-gradient(circle at 85% 18%,rgba(113,87,213,.17),transparent 27%),
    linear-gradient(151deg,#fff,#f2f4f6 62%,#ebedef);
}
html[data-glass-variant="crystal"][data-background-field="track"] .ambient-a { background:#237fd3; opacity:.12; }
html[data-glass-variant="crystal"][data-background-field="track"] .ambient-b { background:#ff7953; opacity:.12; }

/* 4 — Recovery Pulse: sunrise warmth crossed by a cool measured rhythm. */
html[data-glass-variant="crystal"][data-background-field="pulse"] body {
  background:
    repeating-linear-gradient(180deg,transparent 0 55px,rgba(36,42,48,.045) 56px,transparent 57px 112px),
    radial-gradient(ellipse at 18% 15%,rgba(255,157,94,.28),transparent 36%),
    radial-gradient(ellipse at 83% 52%,rgba(81,150,231,.25),transparent 34%),
    radial-gradient(ellipse at 46% 90%,rgba(131,92,205,.15),transparent 37%),
    linear-gradient(153deg,#fffdf9,#f4f6f8 58%,#eceff2);
}
html[data-glass-variant="crystal"][data-background-field="pulse"] .ambient-a { background:#ff9d65; opacity:.12; }
html[data-glass-variant="crystal"][data-background-field="pulse"] .ambient-b { background:#4e93df; opacity:.12; }

/* v10 — photographic depth laboratory: recognizable scenery is only softened where glass crosses it. */
html[data-glass-variant="crystal"][data-background-field="beach"] body,
html[data-glass-variant="crystal"][data-background-field="trail"] body,
html[data-glass-variant="crystal"][data-background-field="pool"] body {
  background-color:#eef2f4;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}
html[data-glass-variant="crystal"][data-background-field="beach"] body {
  background-image:linear-gradient(rgba(255,255,255,.04),rgba(255,255,255,.09)),url("assets/backgrounds/coastal-dawn.png");
}
html[data-glass-variant="crystal"][data-background-field="trail"] body {
  background-image:linear-gradient(rgba(255,255,255,.03),rgba(255,255,255,.08)),url("assets/backgrounds/coastal-trail.png");
}
html[data-glass-variant="crystal"][data-background-field="pool"] body {
  background-image:linear-gradient(rgba(255,255,255,.02),rgba(255,255,255,.08)),url("assets/backgrounds/pool-courtyard.png");
}
html[data-glass-variant="crystal"][data-background-field="beach"] .ambient,
html[data-glass-variant="crystal"][data-background-field="trail"] .ambient,
html[data-glass-variant="crystal"][data-background-field="pool"] .ambient { display:none; }
html[data-glass-variant="crystal"][data-background-field="beach"] body::before,
html[data-glass-variant="crystal"][data-background-field="trail"] body::before,
html[data-glass-variant="crystal"][data-background-field="pool"] body::before { opacity:.025; mix-blend-mode:soft-light; }
html[data-glass-variant="crystal"][data-background-field="beach"] body::after,
html[data-glass-variant="crystal"][data-background-field="trail"] body::after,
html[data-glass-variant="crystal"][data-background-field="pool"] body::after {
  background:linear-gradient(to bottom,transparent,rgba(248,249,250,.54));
}
html[data-glass-variant="crystal"][data-background-field="beach"] .saved-exercise-card,
html[data-glass-variant="crystal"][data-background-field="beach"] .next-exercise-card,
html[data-glass-variant="crystal"][data-background-field="trail"] .saved-exercise-card,
html[data-glass-variant="crystal"][data-background-field="trail"] .next-exercise-card,
html[data-glass-variant="crystal"][data-background-field="pool"] .saved-exercise-card,
html[data-glass-variant="crystal"][data-background-field="pool"] .next-exercise-card {
  background:linear-gradient(138deg,rgba(255,255,255,.52),rgba(255,255,255,.22) 50%,rgba(255,255,255,.36));
  backdrop-filter:blur(13px) saturate(112%) brightness(1.04);
  -webkit-backdrop-filter:blur(13px) saturate(112%) brightness(1.04);
  box-shadow:0 22px 52px rgba(26,32,38,.2),inset 0 1px 0 rgba(255,255,255,.94),inset 0 -1px 0 rgba(32,38,44,.12);
}
html[data-glass-variant="crystal"][data-background-field="beach"] .saved-exercise-card::before,
html[data-glass-variant="crystal"][data-background-field="beach"] .next-exercise-card::before,
html[data-glass-variant="crystal"][data-background-field="trail"] .saved-exercise-card::before,
html[data-glass-variant="crystal"][data-background-field="trail"] .next-exercise-card::before,
html[data-glass-variant="crystal"][data-background-field="pool"] .saved-exercise-card::before,
html[data-glass-variant="crystal"][data-background-field="pool"] .next-exercise-card::before {
  background:linear-gradient(128deg,rgba(255,255,255,.18),transparent 40%,rgba(255,255,255,.12));
}

/* v11 — editorial athletic material laboratory: six deliberately different non-wallpaper directions. */
html[data-glass-variant="crystal"]:is(
  [data-background-field="fabric"],
  [data-background-field="knit"],
  [data-background-field="ribbons"],
  [data-background-field="architecture"],
  [data-background-field="foam"],
  [data-background-field="membrane"]
) {
  --text:#121417;
  --muted:#30353a;
}
html[data-glass-variant="crystal"]:is(
  [data-background-field="fabric"],
  [data-background-field="knit"],
  [data-background-field="ribbons"],
  [data-background-field="architecture"],
  [data-background-field="foam"],
  [data-background-field="membrane"]
) body {
  background-color:#edf0f3;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}
html[data-glass-variant="crystal"][data-background-field="fabric"] body { background-image:url("assets/backgrounds/editorial-fabric.png"); }
html[data-glass-variant="crystal"][data-background-field="knit"] body { background-image:url("assets/backgrounds/editorial-knit.png"); }
html[data-glass-variant="crystal"][data-background-field="ribbons"] body { background-image:url("assets/backgrounds/editorial-ribbons.png"); }
html[data-glass-variant="crystal"][data-background-field="architecture"] body { background-image:url("assets/backgrounds/editorial-architecture.png"); }
html[data-glass-variant="crystal"][data-background-field="foam"] body { background-image:url("assets/backgrounds/editorial-foam.png"); }
html[data-glass-variant="crystal"][data-background-field="membrane"] body { background-image:url("assets/backgrounds/editorial-membrane.png"); }
html[data-glass-variant="crystal"]:is(
  [data-background-field="fabric"],
  [data-background-field="knit"],
  [data-background-field="ribbons"],
  [data-background-field="architecture"],
  [data-background-field="foam"],
  [data-background-field="membrane"]
) .ambient { display:none; }
html[data-glass-variant="crystal"]:is(
  [data-background-field="fabric"],
  [data-background-field="knit"],
  [data-background-field="ribbons"],
  [data-background-field="architecture"],
  [data-background-field="foam"],
  [data-background-field="membrane"]
) #backToBodyPartsButton {
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.45);
  border-radius:999px;
  color:#1d2227;
  background:rgba(255,255,255,.52);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85),0 5px 18px rgba(20,25,30,.1);
  backdrop-filter:blur(9px) saturate(108%);
  -webkit-backdrop-filter:blur(9px) saturate(108%);
}
html[data-glass-variant="crystal"]:is(
  [data-background-field="fabric"],
  [data-background-field="knit"],
  [data-background-field="ribbons"],
  [data-background-field="architecture"],
  [data-background-field="foam"],
  [data-background-field="membrane"]
) body::before {
  opacity:.03;
  mix-blend-mode:soft-light;
}
html[data-glass-variant="crystal"]:is(
  [data-background-field="fabric"],
  [data-background-field="knit"],
  [data-background-field="ribbons"],
  [data-background-field="architecture"],
  [data-background-field="foam"],
  [data-background-field="membrane"]
) body::after {
  background:linear-gradient(180deg,rgba(250,251,252,.24),transparent 22%,transparent 69%,rgba(245,247,249,.5));
}
html[data-glass-variant="crystal"]:is(
  [data-background-field="fabric"],
  [data-background-field="knit"],
  [data-background-field="ribbons"],
  [data-background-field="architecture"],
  [data-background-field="foam"],
  [data-background-field="membrane"]
) :is(.saved-exercise-card,.next-exercise-card) {
  background:
    linear-gradient(136deg,rgba(255,255,255,.5),rgba(255,255,255,.16) 46%,rgba(255,255,255,.3)),
    radial-gradient(ellipse at 18% 2%,rgba(255,255,255,.34),transparent 38%);
  backdrop-filter:blur(11px) saturate(115%) brightness(1.055);
  -webkit-backdrop-filter:blur(11px) saturate(115%) brightness(1.055);
  border-color:rgba(255,255,255,.52);
  box-shadow:
    0 24px 54px rgba(20,25,32,.22),
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 1px 0 0 rgba(255,255,255,.5),
    inset 0 -1px 0 rgba(20,28,36,.14);
}
html[data-glass-variant="crystal"]:is(
  [data-background-field="fabric"],
  [data-background-field="knit"],
  [data-background-field="ribbons"],
  [data-background-field="architecture"],
  [data-background-field="foam"],
  [data-background-field="membrane"]
) :is(.saved-exercise-card,.next-exercise-card)::before {
  background:
    linear-gradient(112deg,rgba(255,255,255,.3),transparent 22% 72%,rgba(255,255,255,.16)),
    radial-gradient(ellipse at 22% 0%,rgba(255,255,255,.28),transparent 42%);
}

/* Access gate */
.access-gate{
  position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  padding:24px;background:rgba(10,13,20,.85);backdrop-filter:blur(18px);
}
.access-gate-inner{
  width:100%;max-width:360px;padding:36px 28px 32px;border-radius:24px;
  display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;
}
.access-gate-avatar{ width:72px;height:72px;border-radius:50%;object-fit:cover;margin-bottom:4px; }
.invite-input{
  width:100%;margin-top:4px;padding:14px 18px;border-radius:14px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);
  color:#fff;font-size:18px;text-align:center;letter-spacing:.1em;
  outline:none;transition:border-color .2s;
}
.invite-input:focus{ border-color:rgba(255,255,255,.45); }
.invite-error{ color:#ff6b6b;font-size:13px;margin-top:4px; }
