/* Main hubs paint behind the iPhone status area, matching secondary screens.
   Their scroll views apply the safe-area inset to content instead, so the
   page background stays seamless while controls remain below the clock. */
.own-plan-choice{margin:20px 0 4px;border-top:1px solid var(--line);padding-top:20px;}
.own-plan-choice summary{color:var(--blue);font-weight:700;font-size:14px;cursor:pointer;padding:8px 0;}
.own-plan-choice p{font-size:13px;line-height:1.6;color:var(--ink-soft);}
.own-plan-actions,.editor-prescription{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.own-plan-actions .btn{font-size:13px;padding:12px 8px;}
.own-plan-ready{padding:16px;border:1px solid var(--blue);border-radius:4px;background:var(--blue-soft);margin:14px 0;}
.own-plan-ready p{font-size:13px;color:var(--ink-soft);line-height:1.5;}
.text-action{border:0;background:none;color:var(--blue);font:600 13px 'Inter',sans-serif;padding:12px 0;cursor:pointer;}
.own-plan-ready .text-action+.text-action{margin-left:18px;}
.import-card label,.editor-day>label,.editor-exercise label,.lift-trend label{display:block;font-size:12px;font-weight:600;color:var(--ink-soft);margin:12px 0 7px;}
.import-card textarea{min-height:190px;resize:vertical;}
.import-card input[type=file]{font-size:12px;width:100%;}
.import-card>.btn{margin-top:18px;}
.import-image img{display:block;max-height:230px;width:100%;object-fit:contain;border-radius:4px;margin:12px 0;}
.import-warning{padding:16px;border:1px solid var(--blue);border-radius:4px;background:var(--blue-soft);font-size:13px;line-height:1.6;}
.editor-days{display:grid;gap:16px;margin-top:22px;}
.editor-day-head{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.editor-day-head h3{font-size:17px;margin:0;}
.editor-day-head label{font-size:11px;color:var(--ink-soft);display:flex;align-items:center;gap:8px;}
.editor-day-head input{width:18px;height:18px;accent-color:var(--blue);}
.editor-exercise{border-top:1px solid var(--line);margin-top:18px;padding-top:12px;}
.editor-exercise-head{display:flex;justify-content:space-between;align-items:center;font-size:12px;}
.editor-day .btn{margin-top:18px;}
.editor-prescription>div{min-width:0;}
.editor-footer{display:grid;gap:12px;margin-top:24px;padding-bottom:24px;}
.training-progress{margin:36px 0;}
.training-progress .section-label-row{align-items:flex-end;gap:8px;}
.training-progress .section-label-row>span{font-size:11px;white-space:nowrap;}
.training-progress .screen-kicker{font-size:10px;letter-spacing:.14em;margin-bottom:8px;}
.training-progress .screen-copy{font-size:13px;line-height:1.6;margin:12px 0 18px;}
.progress-chart-card{padding:24px 20px;}
.trend-totals{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.trend-totals>div{display:flex;flex-direction:column;gap:4px;}
.trend-totals strong{font:900 36px 'Barlow Condensed',sans-serif;letter-spacing:-.05em;}
.trend-totals span{font-size:11px;color:var(--ink-soft);}
.trend-chart{display:flex;gap:20px;margin:28px 0 18px;}
.trend-column{flex:1;min-width:0;text-align:center;}
.trend-track{height:100px;background:var(--blue-soft);border-radius:4px;display:flex;align-items:flex-end;overflow:hidden;margin:8px 0;}
.trend-bar{width:100%;border-radius:4px;background:var(--accent);}
.trend-value{font-size:12px;font-weight:700;}
.trend-label{font-size:10px;color:var(--ink-soft);white-space:nowrap;}
.progress-chart-card .btn{margin-top:18px;}
.lift-trend{margin-top:20px;}
.lift-trend h3{font:900 19px 'Barlow Condensed',sans-serif;margin:6px 0 16px;}
.lift-current{display:flex;flex-direction:column;gap:4px;margin-top:20px;}
.lift-current strong{font:900 32px 'Barlow Condensed',sans-serif;letter-spacing:-.03em;}
.lift-current small{font-size:17px;}
.lift-current>span,.lift-dates{font-size:11px;color:var(--ink-soft);}
.lift-chart{display:block;width:100%;margin-top:12px;}
.lift-axis{stroke:var(--line);fill:none;}
.lift-line{stroke:var(--blue);stroke-width:3;fill:none;stroke-linejoin:round;}
.lift-dot{fill:var(--blue);stroke:var(--surface);stroke-width:2;}
.lift-dates{display:flex;justify-content:space-between;margin:0 0 16px;}
/* The paywall keeps a fixed dark canvas in both appearance modes. */
.shell[data-screen="paywall"]{background:#080808;color:#F0F0F0;}
.shell[data-screen="paywall"] .app-view{padding:calc(10px + env(safe-area-inset-top)) 22px calc(28px + env(safe-area-inset-bottom));background:radial-gradient(ellipse at 90% 14%,rgba(var(--accent-rgb),.13) 0,transparent 38%),radial-gradient(ellipse at 0% 30%,rgba(var(--accent-rgb),.05) 0,transparent 40%),#080808;}
.paywall{max-width:440px;margin:auto;}
.paywall-top{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#A0A0A0;font-size:10px;}
.paywall-close{background:#1A1A1A;border:1px solid #222222;border-radius:50%;width:32px;height:32px;font-size:23px;line-height:1;color:#E0E0E0;cursor:pointer;}
.paywall-brand{display:flex;align-items:center;justify-content:center;gap:4px;margin:18px 0 24px;}
.paywall-brand .mascot-icon{width:78px;height:59px;margin:0;}
.paywall-brand>span{font:900 19px 'Barlow Condensed',sans-serif;letter-spacing:.025em;}
.paywall-brand b{display:inline-block;font:700 9px 'Inter',sans-serif;border:1px solid var(--accent);border-radius:4px;color:var(--accent);padding:4px 4px;vertical-align:middle;}
.paywall-eyebrow{color:var(--accent);text-align:center;font-size:9px;text-transform:uppercase;letter-spacing:.11em;font-weight:700;}
.paywall h1{font:900 clamp(32px,8.9vw,42px)/1.05 'Barlow Condensed',sans-serif;letter-spacing:-.055em;text-align:center;margin:12px 0 16px;color:#F0F0F0;}
.paywall h1 em{font-style:normal;color:var(--accent);}
.paywall-sub{font-size:12px;line-height:1.7;text-align:center;color:#A0A0A0;margin-bottom:20px;}
.paywall-benefits{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 14px;font-size:10px;color:#E0E0E0;margin:0 0 24px;}
.paywall-offer{display:flex;gap:16px;align-items:center;border:1px solid rgba(var(--accent-rgb),.34);background:rgba(var(--accent-rgb),.12);border-radius:4px;padding:16px;margin-bottom:19px;}
.offer-symbol{font:900 38px 'Barlow Condensed',sans-serif;letter-spacing:-.055em;color:var(--accent);}
.offer-symbol>span{font-size:17px;}
.paywall-offer>div{min-width:0;display:flex;flex-direction:column;gap:4px;}
.paywall-offer b{font-size:12px;}
.paywall-offer div>span{font-size:10px;line-height:1.6;color:#A0A0A0;}
.paywall-options{display:grid;gap:12px;}
.paywall-option{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #222222;background:#111111;border-radius:4px;padding:16px 12px;cursor:pointer;color:#F0F0F0;font-family:'Inter',sans-serif;min-height:82px;width:100%;}
.paywall-option.selected{border:2px solid var(--accent);padding:16px 12px;background:linear-gradient(110deg,rgba(var(--accent-rgb),.10),rgba(var(--accent-rgb),.03));box-shadow:none;}
.paywall-radio{flex:none;width:17px;height:17px;border:1px solid #808080;border-radius:50%;}
.selected .paywall-radio{border:5px solid var(--accent);background:#080808;}
.paywall-option-name{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0;}
.paywall-option-name>b{font-size:14px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.paywall-option-name b small{font-size:8px;white-space:nowrap;border-radius:4px;background:rgba(var(--accent-rgb),.20);color:var(--accent);padding:4px 4px;font-weight:600;}
.paywall-option-name>span{font-size:9px;color:#A0A0A0;line-height:1.4;}
.paywall-option-price{text-align:right;display:flex;flex-direction:column;gap:4px;flex:none;}
.paywall-option-price s{font-size:10px;color:#808080;}
.paywall-option-price b{font-size:17px;}
.paywall-option-price small{font-size:9px;color:#A0A0A0;}
.paywall-checkout{margin-top:20px;}
.paywall .paywall-cta{background:var(--accent);color:#080808;box-shadow:none;border-radius:4px;font-size:14px;min-height:54px;display:flex;align-items:center;justify-content:center;gap:12px;}
.paywall-terms{font-size:10px;line-height:1.65;text-align:center;color:#A0A0A0;margin:13px 6px 5px;}
.paywall-preview-note{font-size:10px;text-align:center;color:#808080;}
.paywall-links{display:flex;gap:16px;justify-content:center;margin-top:17px;}
.paywall-links button{border:0;padding:4px 0;color:#A0A0A0;background:none;font-size:10px;text-decoration:underline;cursor:pointer;}
.paywall-preview-toggle{display:flex;align-items:center;justify-content:center;gap:8px;font-size:10px;color:#808080;margin-top:24px;}
.paywall-preview-toggle input{width:14px;height:14px;accent-color:var(--accent);}
@media(max-width:350px){.paywall-offer{gap:12px;padding:12px;}.paywall-option{gap:8px;}.paywall-option-price b{font-size:15px;}.own-plan-actions{grid-template-columns:1fr;}.editor-day-head{align-items:flex-start;}.editor-prescription{grid-template-columns:1fr;}}
.own-plan-choice .hint,.import-card .hint,.editor-days .hint,.training-progress .hint{font-size:12px;line-height:1.6;color:var(--ink-soft);margin:12px 0;}
/* This row has horizontal margins; the global 100% width must leave room for them. */
.app-view>.up-next-line{width:calc(100% - 6px);max-width:calc(100% - 6px);}

.shell[data-screen="plan-editor"] .app-view>.hint{font-size:12px;line-height:1.6;color:var(--ink-soft);}

/* ---- Type system (restyle pass 2) ----------------------------------------
   Mirrors the block at the end of index.html's stylesheet. This file is a
   second stylesheet with its own literals, so a sweep of index.html alone
   would leave the paywall on the old type. Appended last so it layers over
   the rules above at equal specificity. */
.paywall h1,
.paywall-brand>span,
.lift-trend h3{
  font-family:'Barlow Condensed',sans-serif;
  text-transform:uppercase;
  letter-spacing:-.01em;
}
.offer-symbol,
.trend-totals strong,
.lift-current strong{
  font-family:'Barlow Condensed',sans-serif;
  letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;
  font-feature-settings:'tnum' 1;
}
.paywall-eyebrow,
.paywall-option-name>span,
.paywall-option-price small,
.paywall-terms,
.paywall-preview-note{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  letter-spacing:.06em;
}
.paywall-eyebrow{text-transform:uppercase;}

/* Add to calendar, on Plan, under the day list. Settings is where you go when
   you already know a feature exists; this is where someone reading their week
   is already thinking about when it fits. The Me screen keeps its own row as
   the settings-shaped home for the same action. Dashed rather than solid so it
   reads as an offer beside the week, not a third primary action competing with
   the check-in card below it. */
.plan-cal{
  display:flex;align-items:center;gap:10px;width:100%;
  margin-top:12px;padding:14px 16px;
  background:none;border:1.5px dashed var(--line);border-radius:var(--r);
  color:var(--muted);font-family:'Inter',sans-serif;font-size:13px;font-weight:600;
  text-align:left;cursor:pointer;-webkit-appearance:none;appearance:none;
}
.plan-cal:active{background:var(--surface);}
.plan-cal svg{width:18px;height:18px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}