/* The connected day: ordinary records, one clear consequence at a time. */
.day-visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.connected-day, .day-understand { --day-ink:#c6e0ef; --day-muted:#91a1ae; --day-rule:#ffffff15; }
.day-intro { display:grid; grid-template-columns:1.1fr 1fr; gap:10%; align-items:center; margin-bottom:80px; }
.day-system-copy { padding-block:35px; }
.day-system-copy .day-intro-note { margin-top:28px; }
.day-system-copy > .text-link { margin-top:24px; }
.day-system-steps {
 --loop-period:10.2s; --loop-stagger:1.45s; --loop-arrival:.8s;
 --loop-gap:12px; --loop-connector:12px;
 display:flex; flex-wrap:wrap; align-items:center; gap:var(--loop-gap);
 list-style:none; padding:0; margin:28px 0 0; color:#b2c2ce; font-size:12px;
}
.day-system-steps li { --step:0; position:relative; display:flex; align-items:center; }
.day-system-steps li:nth-child(2) { --step:1; }
.day-system-steps li:nth-child(3) { --step:2; }
.day-system-steps li:nth-child(4) { --step:3; }
.day-system-steps li:nth-child(5) { --step:4; }
.day-system-steps li + li::before {
 content:""; display:block; width:var(--loop-connector); height:1px;
 margin-right:var(--loop-gap); background:#91aec03b;
}
.day-step-label { position:relative; display:inline-block; }
.day-step-label::after, .day-system-steps li + li::after {
 content:""; position:absolute; pointer-events:none; opacity:0;
 height:1px; background:linear-gradient(90deg, transparent, #a6cce5 35%, #e7f6ff 75%, transparent);
}
.day-step-label::after { left:0; right:0; bottom:-5px; transform-origin:left; }
.day-system-steps li + li::after {
 left:0; top:50%; width:var(--loop-connector); transform-origin:left;
 box-shadow:0 0 5px #9ecdeb40;
}
/* One finite handoff inside a long cycle; only the visible row runs it.
 * These are product stages, not completion or recorded-evidence states. */
.day-system-steps[data-loop-motion="running"] .day-step-label,
.day-system-steps[data-loop-motion="running"] .day-step-label::after,
.day-system-steps[data-loop-motion="running"] li + li::after {
 animation-duration:var(--loop-period); animation-iteration-count:infinite;
 animation-timing-function:cubic-bezier(.4,0,.2,1);
 animation-delay:calc(var(--loop-arrival) + var(--step) * var(--loop-stagger));
}
.day-system-steps[data-loop-motion="running"] .day-step-label { animation-name:day-step-illuminate; }
.day-system-steps[data-loop-motion="running"] .day-step-label::after { animation-name:day-step-trace; }
.day-system-steps[data-loop-motion="running"] li + li::after {
 animation-name:day-step-transfer;
 animation-delay:calc(var(--loop-arrival) + var(--step) * var(--loop-stagger) - .48s);
}
@keyframes day-step-illuminate {
 0%,18%,100% { color:#b2c2ce; text-shadow:0 0 10px #a5d7f000; transform:translateY(0); }
 4%,10% { color:#edf8ff; text-shadow:0 0 10px #a5d7f05c; transform:translateY(-1.5px); }
}
@keyframes day-step-trace {
 0% { opacity:0; transform:scaleX(.12); }
 4% { opacity:.75; transform:scaleX(.65); }
 10% { opacity:.55; transform:scaleX(1); }
 18%,100% { opacity:0; transform:scaleX(1); }
}
@keyframes day-step-transfer {
 0% { opacity:0; transform:scaleX(.08); }
 3% { opacity:.85; transform:scaleX(.5); }
 6% { opacity:.85; transform:scaleX(1); }
 10%,100% { opacity:0; transform:scaleX(1); }
}
.day-product { width:100%; margin:0; display:flex; flex-direction:column; align-items:center; gap:26px; }
/* Front-on product still: retain the app's pixels and let the thin metal edge
   catch the light. No perspective resampling or reflections over the UI. */
.day-phone {
 --phone-radius:46px;
 position:relative; isolation:isolate; width:clamp(272px, 27vw, 342px);
 padding:3px; border:1px solid #777a82; border-radius:var(--phone-radius);
 background:linear-gradient(120deg,#93969b 0%,#41444a 12%,#1b1c20 42%,#393b40 76%,#74767c 100%);
 box-shadow:inset 0 0 0 1px #e4e5e62b,0 0 0 1px #090a0c,0 28px 60px -18px #000c;
}
.day-phone-display { position:relative; overflow:hidden; border:4px solid #050506; border-radius:calc(var(--phone-radius) - 4px); background:#030306; }
.day-phone .app-capture { display:block; width:100%; height:auto; aspect-ratio:430 / 932; object-fit:contain; }
.day-phone-key { position:absolute; z-index:-1; width:3px; border-radius:2px; background:linear-gradient(90deg,#202126,#87898d,#2b2c30); }
.day-phone-key-action { left:-3px; top:15%; height:3%; }
.day-phone-key-volume { left:-3px; top:22%; height:12%; background:linear-gradient(to bottom,#6b6d72 0 44%,transparent 44% 56%,#6b6d72 56%); }
.day-phone-key-power { right:-3px; top:24%; height:9%; }
.day-phone-status { position:absolute; inset:2.25% 7.5% auto; display:flex; align-items:center; justify-content:space-between; color:#f5f5f7; font:600 clamp(10px,1.05vw,12px)/1 system-ui,sans-serif; pointer-events:none; }
.day-phone-status svg { width:16.5%; height:auto; }
.day-phone-island { position:absolute; top:1.4%; left:35.5%; width:29%; height:3.7%; border-radius:30px; background:#000; box-shadow:inset 0 0 0 1px #ffffff05; pointer-events:none; }
.day-phone-island::after { content:""; position:absolute; right:9%; top:34%; height:32%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle at 65% 35%,#18253c,#080a10 55%,#030305); }
.day-phone-home { position:absolute; bottom:.8%; left:35%; width:30%; height:.45%; border-radius:10px; background:#f5f5f7; pointer-events:none; }
.day-product figcaption { font-size:10px; line-height:1.6; color:#8395a3; }
#example-actions { scroll-margin-top:120px; }
.day-intro-note { max-width:420px; color:#a4acb5; font-size:15px; line-height:1.8; }
.day-example-label { display:block; color:#8998a5; font-size:11px; line-height:1.6; }
.day-intro-note .day-example-label { margin-top:17px; }
.day-workspace { display:grid; grid-template-columns:1fr 1fr; gap:8%; border-top:1px solid var(--day-rule); padding-top:30px; }
.day-column-heading { display:flex; justify-content:space-between; gap:20px; align-items:center; margin-bottom:24px; }
.day-column-heading h3 { font-size:20px; letter-spacing:-.03em; margin:0; }
.quiet-button { background:none; border:0; color:#a7bbc9; font:inherit; font-size:11px; min-height:44px; padding:8px 0 8px 8px; cursor:pointer; }
.day-plan-list { list-style:none; padding:0; margin:0; }
.day-plan-list li { padding:24px 0; border-bottom:1px solid var(--day-rule); display:grid; grid-template-columns:45px 1fr; gap:14px; }
.day-plan-list time { color:#8496a5; font-size:12px; padding-top:3px; font-variant-numeric:tabular-nums; }
.day-plan-list strong { display:block; color:#dce5ec; font-size:15px; font-weight:500; }
.day-plan-list small { display:block; color:#8296a6; font-size:11px; line-height:1.8; margin-top:6px; }
.day-plan-list .is-recorded strong { color:#c3e2f4; }
.day-plan-note { font-size:12px; color:var(--day-muted); line-height:1.8; max-width:350px; margin:24px 0; }
.day-receipt { display:flex; gap:12px; align-items:flex-start; padding:16px 0; color:#bed5e4; font-size:12px; line-height:1.7; }
.evidence-dot { flex:none; display:inline-block; width:5px; height:5px; margin-top:7px; border-radius:50%; background:#b0d5ed; box-shadow:0 0 9px #92c8eb30; }
.day-execute-column { padding-left:30px; border-left:1px solid var(--day-rule); }
.day-execute-tabs { display:flex; gap:24px; border-bottom:1px solid var(--day-rule); margin-bottom:30px; }
.day-execute-tabs button { border:0; border-bottom:1px solid transparent; background:none; font:inherit; color:#8294a4; cursor:pointer; padding:12px 0; min-height:44px; }
.day-execute-tabs button[aria-selected="true"] { color:#d0e9f9; border-bottom-color:#accfe8; }
.day-time { font-size:11px; color:#8c9eab; margin-bottom:18px; }
.day-execute-column h3 { font-size:34px; letter-spacing:-.045em; line-height:1.12; margin:0 0 20px; }
.day-execute-column [role="tabpanel"] > p:not(.day-time,.day-action-note) { color:#9fadb9; font-size:13px; line-height:1.8; max-width:365px; }
.day-duration { display:flex; align-items:baseline; gap:13px; margin:26px 0; color:#a2b3bf; font-size:12px; }
.day-duration strong { color:#d6e8f5; font-size:64px; line-height:1.1; font-weight:500; letter-spacing:-.06em; }
.day-action { margin-top:12px; font-size:12px; min-height:48px; }
.day-action-note { font-size:11px; color:#8296a5; line-height:1.8; margin:14px 0 20px; max-width:370px; }
.day-execute-column .text-link { font-size:12px; }
button.text-link { background:none; border:0; padding:12px 0; cursor:pointer; }
button:disabled { cursor:default; }
.day-action:disabled, #day-adjust:disabled { opacity:.4; }
.day-workout-sets { list-style:none; padding:0; margin:24px 0 12px; }
.day-workout-sets li { display:flex; align-items:center; gap:12px; padding:8px 0; min-height:36px; color:#8296a5; font-size:11px; }
.day-workout-sets li span:nth-child(2) { flex:1; }
.day-workout-sets .set-check { width:17px; height:17px; border:1px solid #9ab6c630; border-radius:50%; text-align:center; line-height:15px; font-size:10px; color:#cbe7f7; }
.day-workout-sets li.is-recorded { color:#bad2e2; }
.day-workout-sets .is-recorded .set-check { background:#8ab9d519; border-color:#9ab6c67a; }
.day-understand-grid { display:grid; grid-template-columns:1fr 1fr; gap:8%; }
.day-stats,.day-judge { border-top:1px solid var(--day-rule); padding-top:27px; min-width:0; }
.day-score { margin:33px 0 25px; }
.day-score > span { font-size:13px; color:#a7bbc9; }
.day-score > div { display:flex; gap:8px; align-items:baseline; color:#a2b7c8; margin:16px 0 12px; }
.day-score strong { font-size:68px; letter-spacing:-.065em; font-weight:500; line-height:1; color:#d0e5f3; font-variant-numeric:tabular-nums; }
.day-score > p { font-size:12px; color:#8d9fac; line-height:1.7; }
.day-stat-facts { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:28px 0; }
.day-stat-facts dt { color:#899ca9; font-size:10px; line-height:1.7; }
.day-stat-facts dd { margin:8px 0 0; color:#c9dce9; font-size:20px; letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.evidence-disclosure { border-top:1px solid #ffffff15; color:#9daebb; font-size:12px; margin-top:18px; }
.evidence-disclosure > summary { color:#b5c8d6; cursor:pointer; padding:15px 0; line-height:1.7; }
.evidence-detail-note,.day-source-note { color:#788d9c; font-size:10px; line-height:1.8; margin:14px 0; }
.evidence-record { padding:13px 0; border-top:1px solid #ffffff0c; }
.evidence-record strong { display:block; font-size:12px; color:#c7d8e5; font-weight:500; }
.evidence-record p { margin:7px 0 0; font-size:11px; line-height:1.8; color:#92a6b5; }
#day-score-components .evidence-record { display:flex; justify-content:space-between; gap:15px; align-items:baseline; }
#day-review { min-height:135px; font-size:16px; line-height:1.85; color:#c2ccd5; }
#day-review p { margin:0 0 16px; }
.day-adjustment { padding-top:24px; margin-top:28px; border-top:1px solid var(--day-rule); }
.day-adjustment h4 { font-size:23px; letter-spacing:-.035em; margin:0 0 14px; }
.day-adjustment > p:not(.day-time,.day-action-note) { font-size:13px; color:#a3b1be; line-height:1.8; margin-bottom:18px; }
.day-adjustment .button { font-size:12px; }
.day-complete { display:flex; gap:13px; margin-top:48px; max-width:650px; font-size:14px; line-height:1.8; color:#c2d5e3; }
.day-download { display:flex; justify-content:space-between; align-items:center; gap:35px; margin-top:70px; padding-top:45px; border-top:1px solid var(--day-rule); }
.day-download h3 { font-size:38px; letter-spacing:-.045em; line-height:1.15; }
.day-download p { margin-top:18px; color:#91a1af; font-size:13px; line-height:1.8; }
.day-download .button { white-space:nowrap; font-size:12px; }
.day-region-delta { color:#b2d3e8 !important; font-size:11px !important; line-height:1.7; margin-top:10px; }
.evidence-number-button { display:flex; align-items:baseline; gap:5px; padding:0; background:none; border:0; font:inherit; color:inherit; cursor:pointer; min-height:35px; }
.evidence-metrics .evidence-number-button #region-sets { font:inherit; letter-spacing:inherit; margin:0; }
.evidence-metrics .evidence-inspect { font-size:12px; color:#7f9fb7; }
#region-history-list { max-height:360px; overflow:auto; overscroll-behavior:contain; padding-right:10px; }
.region-evidence .evidence-disclosure p { max-width:none; }
.evidence-change { animation:evidence-ack 900ms cubic-bezier(.16,.7,.3,1); }
@keyframes evidence-ack { 0% { filter:brightness(1); } 25% { filter:brightness(1.25); transform:translateY(-2px); } 100% { filter:brightness(1); transform:translateY(0); } }
.connected-day [hidden],.day-understand [hidden] { display:none !important; }
.motion-paused .evidence-change { animation:none; }
@media (prefers-reduced-motion:reduce) { .evidence-change { animation:none; } }
@media (max-width:760px) {
 .day-intro { grid-template-columns:1fr; gap:38px; margin-bottom:60px; }
 .day-system-copy { padding-block:0; }
 .day-phone { --phone-radius:44px; width:min(320px, 82vw); }
 .day-system-steps { --loop-gap:9px; --loop-connector:9px; font-size:11px; }
 .day-workspace,.day-understand-grid { grid-template-columns:1fr; gap:45px; }
 .day-execute-column { padding-left:0; border-left:0; }
 .day-plan-list li { padding:20px 0; }
 .day-download { flex-direction:column; align-items:flex-start; margin-top:45px; gap:25px; }
 .day-download h3 { font-size:32px; }
 .day-download .button { white-space:normal; }
 .day-stat-facts { gap:8px; }
 .day-stat-facts dt { font-size:9px; }
}
.connected-day .button,.day-understand .button {
  display:inline-flex; align-items:center; justify-content:center; gap:14px;
  padding:14px 21px; min-height:48px; border:1px solid #a7c7df50;
  border-radius:28px; background:#bdddf0; color:#0a1721; font-weight:500;
  line-height:1.5; text-align:center; transition:background 180ms ease;
}
.connected-day .button:hover:not(:disabled),.day-understand .button:hover:not(:disabled) { background:#d2e9f7; }
.day-understand .button.secondary { background:#afcfe90b; color:#c5dfef; }
.connected-day .button:disabled,.day-understand .button:disabled { background:#b5d7ec12; color:#9bb5c6; opacity:.7; }
#day-score-components .evidence-record { display:block; }
.day-anatomy-next { display:inline-flex; margin-top:23px; font-size:12px; line-height:1.7; }
.day-understand .has-evidence .day-column-heading h3::before {
  content:""; display:inline-block; width:5px; height:5px; margin-right:10px;
  vertical-align:middle; border-radius:50%; background:#b0d5ed;
}
