/* Landing: features first (2×2, each card says what it is, what it does and where to try it),
   then the live "time passing" block with plain sentences instead of bare percentages. */
.features-section{padding-block:95px 70px}
.feature-grid.feature-grid-four{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.feature-grid-four .feature-card{display:grid;grid-template-columns:minmax(0,1fr) 150px;align-items:center;gap:22px;min-height:0;padding:24px 26px}
.feature-grid-four .feature-illustration{order:2;height:120px;margin:0;border-radius:20px;background:var(--paper);box-shadow:var(--shadow-inset)}
.feature-grid-four .feature-copy{order:1;min-width:0}
.feature-grid-four .feature-number{position:static;display:inline-block;margin-bottom:6px;color:var(--purple-dark);font-size:11px;font-weight:800}
.feature-grid-four .feature-card h3{margin:0 0 6px;font-size:18px}
.feature-grid-four .feature-card p{max-width:none;margin:0;font-size:12px;line-height:2}
.feature-grid-four .calendar-illustration{width:auto;padding:16px 20px;display:block}
.feature-grid-four .habit-illustration>.type-icon{right:12px;top:10px}
.feature-tags{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0;padding:0;list-style:none}
.feature-tags li{padding:3px 10px;border-radius:9px;background:var(--paper);color:var(--muted);font-size:10px;box-shadow:var(--shadow-inset)}
.feature-link{display:inline-flex;gap:5px;margin-top:12px;font-size:12px;font-weight:800}
.feature-link:hover{text-decoration:underline;text-underline-offset:4px}
.feature-tasks{border-top:4px solid var(--green)}
.feature-habits{border-top:4px solid var(--purple)}
.feature-calendar{border-top:4px solid #b9b4c6}
.feature-deadlines{border-top:4px solid var(--deadline)}
.due-copy .deadline-add-button{color:#fff}
.deadline-illustration{display:grid;place-items:center}
.deadline-illustration-chip{display:grid;justify-items:center;gap:0;padding:10px 18px;border-radius:16px;background:var(--deadline-soft);color:var(--deadline);line-height:1.3}
.deadline-illustration-chip b{font-size:34px;font-weight:900;line-height:1.1}
.deadline-illustration-chip small{font-size:10px;font-weight:700}

.time-progress-showcase{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:50px;padding-block:20px 90px}
.time-showcase-copy h2{margin:0 0 12px;font-size:clamp(40px,5vw,64px);line-height:1.25;letter-spacing:-.055em;font-weight:700}
.time-showcase-copy h2 span{color:var(--purple)}
.time-showcase-copy h2 .time-title-accent{color:var(--theme-danger)}
.time-showcase-copy>p:not(.eyebrow){margin:0;color:var(--muted);font-size:13px;line-height:2.1}
.calendar-time-progress.time-showcase-bars{display:grid;grid-template-columns:1fr;gap:18px;margin:0;padding:24px 26px;border:1px solid rgba(203,75,88,.42);border-radius:24px;background:var(--card);box-shadow:0 0 0 1px rgba(203,75,88,.2),0 0 27px 4px rgba(203,75,88,.25),var(--shadow-soft);animation:time-card-red-pulse 2.4s ease-in-out infinite;transform:scale(.7);transform-origin:right center}
.time-showcase-bars .time-progress-label{width:100%;margin-bottom:8px;font-size:13px;color:var(--ink)}
.time-showcase-bars .time-progress-label b{font-size:13px;color:var(--ink)}
.time-showcase-bars .time-progress-label span>b:first-child{color:var(--theme-danger);font-size:16px;font-weight:900}
.time-showcase-bars .time-progress-label small{color:var(--muted);font-size:11px;font-weight:700;white-space:nowrap}
.time-showcase-bars .time-progress-track{position:relative;width:100%;height:10px;overflow:hidden;isolation:isolate}
.time-showcase-bars .time-progress-track>i{position:relative;overflow:hidden;background:linear-gradient(to left,color-mix(in srgb,var(--theme-danger) 55%,var(--card)),color-mix(in srgb,var(--theme-danger) 78%,var(--card)),var(--theme-danger))}
.time-showcase-bars .time-progress-track>i::after{content:"";position:absolute;z-index:1;inset-block:-60%;inset-inline-start:-35%;width:25%;transform:skewX(-20deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);pointer-events:none;animation:time-track-shine 5s ease-in-out infinite}
.time-showcase-bars .time-progress-item:nth-child(2) .time-progress-track>i::after{animation-delay:.7s}
.time-showcase-bars .time-progress-item:nth-child(3) .time-progress-track>i::after{animation-delay:1.4s}
@keyframes time-track-shine{0%,8%{inset-inline-start:-35%;opacity:0}16%{opacity:.8}58%,100%{inset-inline-start:115%;opacity:0}}
@keyframes time-card-red-pulse{0%,100%{border-color:rgba(203,75,88,.38);box-shadow:0 0 0 1px rgba(203,75,88,.16),0 0 22px 2px rgba(203,75,88,.18),var(--shadow-soft)}50%{border-color:rgba(211,66,81,.78);box-shadow:0 0 0 2px rgba(211,66,81,.3),0 0 34px 8px rgba(211,66,81,.38),var(--shadow-soft)}}
.hero-art{grid-template-rows:auto auto;align-content:center;row-gap:12px}
.hero-preview-hint{grid-row:2;z-index:3;align-self:start;margin:-18px 0 0;padding:8px 15px;border-radius:999px;font-size:11px;animation:preview-hint-float 5.2s ease-in-out infinite}
.hero-preview-hint svg{width:17px;height:19px;transform-origin:top left;animation:preview-hint-cursor-pop 2.6s ease-in-out infinite}
.hero-preview-hint:hover{background:#e4deed;box-shadow:2px 2px 6px #d9d3e2,-2px -2px 6px #f5f2f9}
.preview-interaction-hint{min-height:36px;padding:8px 15px;gap:8px;border-radius:999px;box-shadow:0 5px 12px rgba(82,67,112,.12);font-size:11px;line-height:1.6;animation:preview-hint-float 5.2s ease-in-out infinite}
.preview-interaction-hint svg{width:16px;height:18px;flex:0 0 auto;transform-origin:top left;animation:preview-hint-cursor-pop 2.6s ease-in-out infinite}
.section-demo-hint{position:relative;z-index:3;margin:-10px auto -9px}
.due-demo .preview-interaction-hint.due-hint{position:relative;z-index:3;top:20px;margin:14px auto -32px}
@keyframes preview-hint-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes preview-hint-cursor-pop{0%,100%{transform:translateY(0) scale(1)}42%{transform:translateY(-2px) scale(1.06)}62%{transform:translateY(1px) scale(.96)}}
@media(prefers-reduced-motion:reduce){.time-showcase-bars,.time-showcase-bars .time-progress-track>i::after,.preview-interaction-hint,.preview-interaction-hint svg{animation:none!important}.time-showcase-bars{border-color:rgba(203,75,88,.55);box-shadow:0 0 0 1px rgba(203,75,88,.25),0 0 25px 4px rgba(203,75,88,.25),var(--shadow-soft)}}

html[data-theme=dark] .feature-grid-four .feature-illustration,html[data-theme=dark] .feature-tags li{background:var(--theme-surface)}
html[data-theme=dark] .calendar-time-progress.time-showcase-bars{background:var(--card);border-color:rgba(233,104,117,.52);box-shadow:0 0 0 1px rgba(233,104,117,.23),0 0 28px 4px rgba(233,104,117,.28),var(--shadow-soft)}
html[data-theme=dark] .time-showcase-bars .time-progress-label span>b:first-child{color:var(--theme-danger)}

@media(max-width:900px){
  .feature-grid-four .feature-card{grid-template-columns:minmax(0,1fr) 120px;gap:16px;padding:20px}
  .time-progress-showcase{gap:30px}
  .time-showcase-copy h2{font-size:48px}
}
@media(max-width:680px){
  .features-section{padding-block:60px 45px}
  .feature-grid.feature-grid-four{grid-template-columns:1fr;gap:13px}
  .feature-grid-four .feature-card{grid-template-columns:minmax(0,1fr) 96px;gap:14px;padding:18px 16px}
  .feature-grid-four .feature-illustration{height:96px}
  .feature-grid-four .feature-card h3{font-size:15px}
  .feature-grid-four .feature-card p{font-size:11px}
  .feature-grid-four .calendar-illustration{padding:12px}
  .deadline-illustration-chip{padding:8px 10px}
  .deadline-illustration-chip b{font-size:26px}
  .time-progress-showcase{grid-template-columns:1fr;gap:20px;padding-block:10px 60px}
  .time-showcase-copy h2{font-size:43px}
  .time-showcase-copy>p:not(.eyebrow){font-size:11px}
  .calendar-time-progress.time-showcase-bars{padding:18px 16px;gap:14px;transform:scale(.9);transform-origin:center}
  .time-showcase-bars .time-progress-label{font-size:12px}
}

@media(max-width:390px){.time-showcase-copy h2{font-size:38px}}

/* Reviews: score summary + one row the visitor scrolls themselves (snap, arrows on desktop) */
.reviews-section{padding-block:30px 90px}
.reviews-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:22px}
.reviews-head h2{margin:0;font-size:34px;line-height:1.45;letter-spacing:-.04em}
.reviews-head h2 em{font-style:normal;color:var(--purple)}
.reviews-score{display:grid;justify-items:center;gap:2px;min-width:170px;padding:16px 22px;border-radius:22px;background:var(--card);box-shadow:var(--shadow-soft)}
.reviews-score>b{font-size:40px;font-weight:900;line-height:1.1;color:var(--ink)}
.reviews-score small{color:var(--muted);font-size:11px}
.reviews-score-stars{position:relative;display:inline-block;color:#ddd8cc;font-size:20px;letter-spacing:3px;line-height:1}
.reviews-score-stars::before{content:"★★★★★"}
.reviews-score-stars i{position:absolute;inset:0 0 0 auto;overflow:hidden;color:#e0a32e;white-space:nowrap}
.reviews-score-stars i::before{content:"★★★★★"}
.reviews-scroller{position:relative}
.reviews-strip{display:flex;gap:16px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:4px;padding:8px 4px 18px;scrollbar-width:thin;scrollbar-color:#cfcabd transparent}
.reviews-strip:focus-visible{outline:2px solid var(--purple);outline-offset:4px;border-radius:18px}
.reviews-strip::-webkit-scrollbar{height:6px}
.reviews-strip::-webkit-scrollbar-thumb{border-radius:6px;background:#cfcabd}
.review-item{display:flex;flex-direction:column;gap:12px;width:330px;flex:0 0 auto;scroll-snap-align:start;padding:20px 22px;border-radius:22px;background:var(--card);box-shadow:var(--shadow-soft);border:1px solid rgba(60,58,48,.05)}
.review-stars{display:flex;gap:3px;color:#ddd8cc;font-size:16px;line-height:1}
.review-stars .is-on{color:#e0a32e}
.review-text{flex:1;margin:0;color:var(--ink);font-size:13px;line-height:2}
.review-person{display:flex;align-items:center;gap:11px;padding-top:12px;border-top:1px solid var(--line)}
.review-avatar{width:42px;height:42px;flex:0 0 auto;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,hsl(var(--hue) 55% 72%),hsl(calc(var(--hue) + 30) 50% 52%));color:#fff;font-size:13px;font-weight:800;box-shadow:0 4px 10px hsl(var(--hue) 40% 50% / .25)}
.review-person>div{display:grid}
.review-person b{font-size:13px}
.review-person small{color:var(--muted);font-size:10px}
.reviews-arrow{position:absolute;z-index:2;top:calc(50% - 30px);width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid var(--line);border-radius:50%;background:var(--card);color:var(--purple-dark);box-shadow:var(--shadow-soft);cursor:pointer;transition:opacity .2s,transform .2s}
.reviews-arrow svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.reviews-arrow.is-prev{right:-22px}
.reviews-arrow.is-next{left:-22px}
.reviews-arrow:hover:not(:disabled){transform:scale(1.08)}
.reviews-arrow:disabled{opacity:0;pointer-events:none}
html[data-theme=dark] .reviews-score-stars,html[data-theme=dark] .review-stars{color:#4a4f5f}
html[data-theme=dark] .review-item{border-color:var(--line)}
html[data-theme=dark] .reviews-strip{scrollbar-color:#4a4f5f transparent}
@media(max-width:900px){.reviews-arrow{display:none}}
@media(max-width:680px){
  .reviews-section{padding-block:10px 60px}
  .reviews-head{flex-direction:column;align-items:stretch}
  .reviews-head h2{font-size:28px}
  .reviews-score{grid-template-columns:auto 1fr;justify-items:start;align-items:center;column-gap:14px;min-width:0;padding:12px 16px}
  .reviews-score>b{grid-row:span 2;font-size:34px}
  .review-item{width:min(280px,82vw);padding:16px 18px}
  .review-text{font-size:12px}
}

/* Media tracker: three numbered section tiles, then one board of compact, aligned rows */
.media-tracker{--media-books:#3a6ea5;--media-series:#b8475b;--media-podcasts:#1f8a85}
.media-showcase{padding-block:70px 90px;border-top:1px solid rgba(60,58,48,.08)}
html[data-theme=dark] .media-tracker{--media-books:#8fb8e8;--media-series:#f09aa8;--media-podcasts:#7fd6cf}
.media-head{display:flex;align-items:center;justify-content:space-between;gap:40px;margin-bottom:28px}
.media-copy{max-width:560px}
.media-copy h2{margin:0 0 14px;font-size:34px;line-height:1.45;letter-spacing:-.04em}
.media-copy h2 em{font-style:normal;color:var(--media-books)}
.media-copy>p:not(.eyebrow){margin:0;color:var(--muted);font-size:13px;line-height:2.1}
.media-eyebrow{color:var(--media-books)}
.media-dot{background:var(--media-books)}
.media-overall{display:flex;align-items:center;gap:18px;flex:0 0 auto;padding:18px 22px;border-radius:24px;background:var(--card);box-shadow:var(--shadow-soft)}
.media-overall-ring{--p:0%;position:relative;width:118px;height:118px;display:grid;place-items:center;align-content:center;border-radius:50%;background:conic-gradient(var(--media-books) 0 calc(var(--p) * .34),var(--media-series) 0 calc(var(--p) * .67),var(--media-podcasts) 0 var(--p),var(--line) 0);transition:background .4s}
.media-overall-ring::before{content:"";position:absolute;inset:11px;border-radius:50%;background:var(--card);box-shadow:var(--shadow-inset)}
.media-overall-ring b,.media-overall-ring small{position:relative}
.media-overall-ring b{font-size:30px;font-weight:900;line-height:1.1}
.media-overall-ring small{color:var(--muted);font-size:10px}
.media-overall-copy{display:grid;gap:6px;font-size:12px;color:var(--muted)}
.media-overall-copy b{display:inline-block;min-width:22px;color:var(--ink);font-size:15px}
.media-overall-copy .is-done b{color:var(--green)}
.media-overall-copy .is-active b{color:var(--media-books)}

/* Section tiles: big, numbered, each with its own summary and progress, so all three read as real sections */
.media-pick-hint{display:flex;align-items:center;gap:10px;margin:0 0 12px;color:var(--muted);font-size:13px}
.media-pick-count{padding:3px 11px;border-radius:9px;background:var(--ink);color:var(--paper);font-size:12px;font-weight:800}
.media-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}
.media-tab{--accent:var(--media-books);position:relative;display:grid;gap:6px;min-width:0;padding:16px 18px;border:2px solid transparent;border-radius:20px;background:var(--card);box-shadow:var(--shadow-soft);color:var(--ink);text-align:right;cursor:pointer;transition:transform .2s,border-color .2s,box-shadow .2s}
.media-tab[data-media-tab=series]{--accent:var(--media-series)}
.media-tab[data-media-tab=podcasts]{--accent:var(--media-podcasts)}
.media-tab:hover{transform:translateY(-2px)}
.media-tab:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.media-tab-top{display:flex;align-items:center;gap:10px}
.media-tab-step{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,var(--paper));color:var(--accent);font-size:13px;font-weight:900}
.media-tab-icon{font-size:24px;line-height:1}
.media-tab-check{margin-inline-start:auto;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#fff;font-size:13px;font-weight:900;opacity:0;transform:scale(.6);transition:opacity .2s,transform .2s}
.media-tab-label{font-size:15px;font-weight:800}
.media-tab-sub{color:var(--muted);font-size:11px}
.media-tab-bar{display:block;height:6px;overflow:hidden;border-radius:6px;background:color-mix(in srgb,var(--accent) 12%,var(--line))}
.media-tab-bar i{display:block;height:100%;border-radius:inherit;background:var(--accent);transition:width .35s ease}
.media-tab[aria-selected=true]{border-color:var(--accent);background:linear-gradient(170deg,color-mix(in srgb,var(--accent) 9%,var(--card)),var(--card) 70%);box-shadow:0 10px 24px color-mix(in srgb,var(--accent) 18%,transparent)}
.media-tab[aria-selected=true] .media-tab-label{color:var(--accent)}
.media-tab[aria-selected=true] .media-tab-check{opacity:1;transform:none}
.media-tab[aria-selected=true]::after{content:"";position:absolute;bottom:-11px;right:calc(50% - 9px);width:18px;height:18px;rotate:45deg;background:var(--card);border-right:2px solid var(--accent);border-bottom:2px solid var(--accent)}
html[data-theme=dark] .media-tab-check{color:#151820}

/* Board: one panel with aligned rows for the chosen section */
.media-board{--accent:var(--media-books);padding:18px 20px 8px;border-radius:24px;background:var(--card);box-shadow:var(--shadow-soft);border-top:4px solid var(--accent)}
.media-board[data-type=series]{--accent:var(--media-series)}
.media-board[data-type=podcasts]{--accent:var(--media-podcasts)}
.media-board-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.media-board-head h3{margin:0;color:var(--accent);font-size:17px}
.media-board-head small{color:var(--muted);font-size:11px}
.media-board-hint{margin:0;color:var(--muted);font-size:11px;text-align:left}
.media-board-hint span{display:block;font-size:10px;opacity:.8}
.media-list{display:grid}
.media-card{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) 84px minmax(260px,auto);align-items:center;gap:16px;padding:14px 4px;border-bottom:1px solid var(--line);overflow:hidden;animation:media-card-in .3s ease both}
.media-card:last-child{border-bottom:0}
.media-card::after{content:"";position:absolute;inset:0;background:linear-gradient(108deg,transparent 33%,rgba(255,255,255,.7) 49%,transparent 65%);transform:translateX(120%);pointer-events:none}
.media-card.is-shining::after{animation:due-shine .75s ease}
.media-cover{width:48px;height:62px;display:grid;place-items:center;border-radius:5px 11px 11px 5px;background:linear-gradient(150deg,hsl(var(--hue) 55% 62%),hsl(calc(var(--hue) + 25) 50% 38%));box-shadow:inset 4px 0 0 rgba(0,0,0,.14),0 5px 12px hsl(var(--hue) 40% 40% / .28)}
.media-card[data-type=series] .media-cover,.media-card[data-type=podcasts] .media-cover{height:48px;border-radius:14px}
.media-cover-icon{font-size:20px;line-height:1}
.media-main{display:grid;gap:6px;min-width:0}
.media-title-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 10px;min-width:0}
.media-title-line h4{margin:0;font-size:14px}
.media-title-line small{color:var(--muted);font-size:11px}
.media-bar{display:block;height:8px;overflow:hidden;border-radius:8px;background:color-mix(in srgb,var(--accent) 13%,var(--line))}
.media-bar i{display:block;height:100%;border-radius:inherit;background:var(--accent);transition:width .3s ease}
.media-status{display:flex;flex-wrap:wrap;gap:2px 14px;font-size:11px;color:var(--muted)}
.media-progress-text{color:var(--ink);font-weight:800}
.media-position{color:var(--accent);font-weight:700}
.media-eta::before{content:"◷ ";color:var(--accent)}
.media-percent{display:grid;justify-items:center;line-height:1.1}
.media-percent b{color:var(--accent);font-size:28px;font-weight:900;font-variant-numeric:tabular-nums}
.media-percent small{color:var(--muted);font-size:10px}
.media-card.is-complete .media-percent b,.media-card.is-complete .media-eta{color:var(--green)}
.media-card.is-complete .media-bar i{background:var(--green)}
.media-card.is-complete .media-eta{font-weight:800}
.media-card.is-complete .media-eta::before{content:""}
.media-form{display:flex;align-items:center;gap:8px}
.media-field{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px;white-space:nowrap}
.media-field input{width:74px;height:38px;padding:0 8px;border:1px solid var(--line);border-radius:11px;background:var(--paper);color:var(--ink);font:inherit;font-size:14px;font-weight:800;text-align:center}
.media-field input:focus{outline:2px solid var(--accent);outline-offset:1px}
.media-save,.media-quick{height:38px;padding:0 14px;border-radius:11px;font:inherit;font-size:12px;font-weight:800;white-space:nowrap;cursor:pointer;transition:transform .2s,filter .2s}
.media-save{border:0;background:var(--accent);color:#fff}
html[data-theme=dark] .media-save{color:#151820}
.media-quick{border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);background:transparent;color:var(--accent)}
.media-save:hover,.media-quick:hover:not(:disabled){transform:translateY(-1px);filter:brightness(.95)}
.media-quick:disabled{opacity:.4;cursor:default}
@keyframes media-card-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
html[data-theme=dark] .media-card::after{background:linear-gradient(108deg,transparent 33%,rgba(160,190,240,.12) 49%,transparent 65%)}
html[data-theme=dark] .media-field input{background:#1b1e28;border-color:#7a8297}
html[data-theme=dark] .media-pick-count{background:var(--ink);color:var(--paper)}
@media(max-width:1000px){
  .media-card{grid-template-columns:48px minmax(0,1fr) 76px;row-gap:10px}
  .media-form{grid-column:2/-1}
}
@media(max-width:900px){.media-head{flex-direction:column;align-items:stretch}.media-overall{align-self:flex-start}}
@media(max-width:680px){
  .media-showcase{padding-block:50px 60px}
  .media-copy h2{font-size:28px}
  .media-copy>p:not(.eyebrow){font-size:11px}
  .media-overall{align-self:stretch;padding:14px 16px}
  .media-overall-ring{width:96px;height:96px}
  .media-overall-ring b{font-size:24px}
  .media-tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .media-tab{padding:11px 9px;gap:4px;border-radius:16px}
  .media-tab-top{gap:6px}
  .media-tab-step{width:20px;height:20px;font-size:11px}
  .media-tab-icon{font-size:19px}
  .media-tab-check{width:18px;height:18px;font-size:10px}
  .media-tab-label{font-size:11px;line-height:1.6}
  .media-tab-sub{display:none}
  .media-board{padding:14px 12px 4px}
  .media-board-head{flex-direction:column;align-items:flex-start}
  .media-board-hint{text-align:right}
  .media-card{grid-template-columns:42px minmax(0,1fr) 62px;gap:10px 12px}
  .media-percent b{font-size:22px}
  .media-form{grid-column:1/-1;flex-wrap:wrap}
  .media-field{flex:1 1 100%}
  .media-field input{flex:1}
  .media-save,.media-quick{flex:1}
}
@media(prefers-reduced-motion:reduce){.media-card,.media-card.is-shining::after{animation:none}.media-tab-check{transition:none}}

/* Panel library page: same tracker, plus add/edit/delete and the auto-task note */
.dashboard-main.library-mode>:not(#libraryPage){display:none}
.library-page{animation:admin-page-enter .25s ease both}
.library-heading p{max-width:560px}
.type-icon.library-icon{color:#3a6ea5}
html[data-theme=dark] .type-icon.library-icon{color:#8fb8e8}
.library-add-button{background:#3a6ea5;box-shadow:5px 5px 12px #ccd6e2,-4px -4px 11px #fff}
.library-add-button:hover{background:#2f5c8b}
html[data-theme=dark] .library-add-button{background:#8fb8e8;color:#151820}
.library-overall{flex-wrap:wrap;margin-bottom:22px;align-self:stretch}
.library-auto-note{flex:1 1 220px;display:flex;align-items:center;gap:8px;margin:0;padding:10px 14px;border-radius:14px;background:var(--green-soft);color:var(--green-dark);font-size:12px;font-weight:700}
.library-auto-note span{width:22px;height:22px;flex:0 0 auto;display:grid;place-items:center;border-radius:50%;background:var(--green);color:#fff;font-size:12px}
.media-row-tools{display:inline-flex;gap:2px;margin-inline-start:auto}
.media-row-tools button{padding:2px 8px;border:0;border-radius:7px;background:transparent;color:var(--muted);font:inherit;font-size:11px;cursor:pointer}
.media-row-tools button:hover{background:var(--line);color:var(--ink)}
.media-row-tools .danger{color:var(--theme-danger)}
.media-empty{display:grid;justify-items:center;gap:8px;padding:28px 10px;color:var(--muted);text-align:center}
.media-empty-icon{font-size:34px}
.media-empty p{margin:0;font-size:13px}
.library-dialog{width:min(480px,calc(100% - 30px))}
.library-dialog form:not(.dialog-close-form){gap:6px}
.library-dialog label{margin-top:6px;font-size:11px;font-weight:700}
.library-dialog label span{color:var(--muted);font-weight:400}
.library-dialog input:not([type=radio]){width:100%;min-height:42px;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:#f0efea;color:var(--ink);font:inherit;font-size:13px}
.library-dialog input:focus{outline:2px solid #3a6ea5;outline-offset:1px}
.library-type-field{margin:10px 0 0;padding:0;border:0}
.library-type-field legend{margin-bottom:7px;font-size:11px;font-weight:700}
.library-type-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.library-type-picker label{margin:0;cursor:pointer}
.library-type-picker input{position:absolute;opacity:0;pointer-events:none}
.library-type-picker span{display:block;padding:10px 6px;border:1px solid var(--line);border-radius:12px;text-align:center;font-size:12px;font-weight:700;transition:background .2s,border-color .2s}
.library-type-picker input:checked+span{border-color:#3a6ea5;background:#e3ecf6;color:#2f5c8b}
.library-type-picker input:focus-visible+span{outline:2px solid #3a6ea5;outline-offset:2px}
.library-field-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.library-field-grid>div{display:flex;flex-direction:column;gap:6px;min-width:0}
.library-dialog .button-primary{background:#3a6ea5}
html[data-theme=dark] .library-dialog input:not([type=radio]){background:#1b1e28;border-color:#7a8297}
html[data-theme=dark] .library-type-picker input:checked+span{background:#26344a;border-color:#8fb8e8;color:#bcd6f5}
html[data-theme=dark] .library-dialog .button-primary{background:#8fb8e8;color:#151820}
@media(max-width:680px){
  .library-field-grid{grid-template-columns:1fr}
  .library-overall{padding:14px}
  .media-row-tools{margin-inline-start:0}
}

/* Library: on/off switch for adding progress to the day's tasks */
.library-auto-toggle{flex:1 1 260px;display:flex;align-items:center;gap:12px;margin:0;padding:12px 14px;border-radius:14px;background:var(--paper);box-shadow:var(--shadow-inset);cursor:pointer}
.library-auto-toggle input{position:absolute;opacity:0;pointer-events:none}
.library-switch{position:relative;width:46px;height:26px;flex:0 0 auto;border-radius:20px;background:#c9c5ba;transition:background .2s}
.library-switch::after{content:"";position:absolute;top:3px;right:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.2);transition:transform .2s}
.library-auto-toggle input:checked+.library-switch{background:var(--green)}
.library-auto-toggle input:checked+.library-switch::after{transform:translateX(-20px)}
.library-auto-toggle input:focus-visible+.library-switch{outline:3px solid var(--green);outline-offset:2px}
.library-auto-copy{display:grid;gap:1px}
.library-auto-copy b{font-size:13px}
.library-auto-copy small{color:var(--muted);font-size:11px}
html[data-theme=dark] .library-switch{background:#4a4f5f}
@media(prefers-reduced-motion:reduce){.library-switch,.library-switch::after{transition:none}}

/* Fitness tracker: weight (orange), running (green), body measurements (violet); reuses the media tiles and board */
.fit-tracker{--fit-weight:#c9682a;--fit-running:#2f8f5b;--fit-body:#7a5bd0}
html[data-theme=dark] .fit-tracker{--fit-weight:#f2b07a;--fit-running:#86d6a8;--fit-body:#bfa9f5}
.fit-showcase{padding-block:70px 90px;border-top:1px solid rgba(60,58,48,.08)}
.fit-showcase .media-copy h2 em{color:var(--fit-weight)}
.fit-eyebrow{color:var(--fit-weight)}
.fit-dot{background:var(--fit-weight)}
.fit-tabs .media-tab[data-fit-tab=weight]{--accent:var(--fit-weight)}
.fit-tabs .media-tab[data-fit-tab=running]{--accent:var(--fit-running)}
.fit-tabs .media-tab[data-fit-tab=body]{--accent:var(--fit-body)}
.fit-board{--accent:var(--fit-weight)}
.fit-board[data-type=running]{--accent:var(--fit-running)}
.fit-board[data-type=body]{--accent:var(--fit-body)}
.fit-highlights{display:grid;gap:9px;flex:0 0 auto;min-width:260px}
.fit-highlight{--highlight:var(--fit-weight);display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:12px;row-gap:1px;min-height:70px;padding:10px 14px;border:1px solid color-mix(in srgb,var(--highlight) 20%,var(--line));border-inline-start:3px solid var(--highlight);border-radius:17px;background:linear-gradient(115deg,color-mix(in srgb,var(--highlight) 7%,var(--card)),var(--card) 72%);box-shadow:var(--shadow-soft);transition:transform .2s,box-shadow .2s}
.fit-highlight:nth-child(2){--highlight:var(--fit-running)}
.fit-highlight:nth-child(3){--highlight:var(--fit-body)}
.fit-highlight:hover{transform:translateY(-2px);box-shadow:0 9px 20px rgba(36,43,38,.1)}
.fit-highlight-icon{grid-row:1/3;width:40px;height:40px;display:grid;place-items:center;border-radius:13px;background:color-mix(in srgb,var(--highlight) 13%,var(--card));font-size:21px}
.fit-highlight b{font-size:17px;font-weight:900;line-height:1.3}
.fit-highlight small{color:var(--muted);font-size:10px}
.fit-body{display:grid;gap:16px;padding:16px 0 18px}
.fit-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:10px}
.fit-kpi{display:grid;gap:2px;padding:12px 14px;border-radius:16px;background:var(--paper);box-shadow:var(--shadow-inset)}
.fit-kpi>span{color:var(--muted);font-size:11px}
.fit-kpi>b{color:var(--ink);font-size:22px;font-weight:900;line-height:1.3;font-variant-numeric:tabular-nums}
.fit-kpi>b small{color:var(--muted);font-size:11px;font-weight:700}
.fit-kpi-note{color:var(--muted);font-size:10px}
.fit-kpi.is-good>b{color:var(--green)}
.fit-kpi.is-bad>b{color:var(--theme-danger)}
.fit-kpi.is-gold{background:linear-gradient(160deg,#fbf0d6,var(--paper))}
.fit-kpi.is-gold>b{color:#b07a12}
html[data-theme=dark] .fit-kpi.is-gold{background:linear-gradient(160deg,#3d3322,var(--paper))}
html[data-theme=dark] .fit-kpi.is-gold>b{color:#edc68a}
.fit-chart-box{padding:8px 6px 0;border-radius:18px;background:var(--paper);box-shadow:var(--shadow-inset)}
.fit-chart{display:block;width:100%;height:auto}
.fit-chart-grid{stroke:var(--line);stroke-width:1}
.fit-chart-axis{stroke:color-mix(in srgb,var(--muted) 55%,transparent);stroke-width:1.3}
.fit-chart-y-label{fill:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
.fit-chart-goal{stroke:var(--green);stroke-width:2;stroke-dasharray:6 6}
.fit-chart-goal-label{fill:var(--green);font-size:12px;font-weight:800}
.fit-chart-area{fill:var(--accent);opacity:.12}
.fit-chart-line{fill:none;stroke:var(--accent);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.fit-chart-dot{fill:var(--card);stroke:var(--accent);stroke-width:3}
.fit-chart-dot.is-last{fill:var(--accent)}
.fit-chart-value{fill:var(--ink);font-size:13px;font-weight:800}
.fit-chart-value.is-last{fill:var(--accent);font-size:15px}
.fit-chart-label{fill:var(--muted);font-size:12px}
.fit-insight{margin:0;padding:10px 14px;border-radius:14px;background:color-mix(in srgb,var(--accent) 10%,var(--card));color:var(--ink);font-size:12px;font-weight:700;line-height:1.9}
.fit-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;padding-top:12px;border-top:1px solid var(--line)}
/* کارت پرسیدن وزن هدف */
.fit-goal-ask{display:grid;gap:4px;margin-bottom:14px;padding:16px 18px;border:2px solid var(--accent);border-radius:18px;background:color-mix(in srgb,var(--accent) 9%,var(--card))}
.fit-goal-ask>b{font-size:15px}
.fit-goal-ask>p{margin:0;color:var(--muted);font-size:12px}
.fit-goal-ask .fit-form{border-top:0;padding-top:8px}
.fit-goal-cancel{height:42px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.fit-goal-edit{justify-self:start;margin-top:4px;padding:3px 9px;border:1px solid var(--accent);border-radius:9px;background:transparent;color:var(--accent);font:inherit;font-size:10px;font-weight:800;cursor:pointer}
.fit-field{display:grid;gap:5px;min-width:160px;color:var(--muted);font-size:12px}
.fit-field input{height:42px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);font:inherit;font-size:15px;font-weight:800;text-align:center}
.fit-field input:focus{outline:2px solid var(--accent);outline-offset:1px}
.fit-save{height:42px;padding:0 20px;border:0;border-radius:12px;background:var(--accent);color:#fff;font:inherit;font-size:13px;font-weight:800;cursor:pointer;transition:transform .2s,filter .2s}
.fit-save:hover{transform:translateY(-1px);filter:brightness(.95)}
html[data-theme=dark] .fit-save{color:#151820}
.fit-goal-bar{height:10px;overflow:hidden;border-radius:10px;background:color-mix(in srgb,var(--accent) 13%,var(--line))}
.fit-goal-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(to left,color-mix(in srgb,var(--accent) 60%,#fff),var(--accent));transition:width .4s ease}
.fit-bars{display:flex;align-items:stretch;gap:3px;height:190px;padding:10px 8px 0;border-radius:18px;background:var(--paper);box-shadow:var(--shadow-inset)}
.fit-bar-col{position:relative;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;min-width:0;gap:4px}
.fit-bar{position:relative;width:100%;max-width:18px;border-radius:6px 6px 3px 3px;background:var(--accent);transition:height .4s ease}
.fit-bar em{position:absolute;bottom:calc(100% + 2px);left:50%;translate:-50% 0;color:var(--muted);font-size:8px;font-style:normal;font-weight:800;white-space:nowrap}
.fit-bar-col small{height:14px;color:var(--muted);font-size:9px}
.fit-bar-col.is-future .fit-bar{background:var(--line)}
.fit-bar-col.is-future small{opacity:.5}
.fit-bar-col.is-today::before{content:"";position:absolute;inset:-4px -1px 16px;border-radius:8px;background:color-mix(in srgb,var(--accent) 12%,transparent)}
.fit-bar-col.is-today small{color:var(--accent);font-weight:900}
.fit-bar-col.is-record .fit-bar{background:linear-gradient(to top,#c48a14,#f1c453)}
.fit-bar-col.is-record .fit-bar em{color:#b07a12;font-size:10px}
.fit-bar-col.is-record .fit-bar em::after{content:" 🏆"}
.fit-bar-col.is-celebrating .fit-bar{animation:fit-pop .7s ease}
.fit-body-grid{display:grid;grid-template-columns:150px minmax(0,1fr);gap:20px;align-items:start}
.fit-figure{width:100%;height:auto;padding:10px;border-radius:18px;background:var(--paper);box-shadow:var(--shadow-inset)}
.fit-figure-shape{fill:color-mix(in srgb,var(--accent) 14%,var(--card));stroke:color-mix(in srgb,var(--accent) 35%,transparent);stroke-width:1.5}
.fit-figure-dot circle{fill:var(--accent);stroke:var(--card);stroke-width:2;transition:r .2s}
.fit-figure-dot text{fill:#fff;font-size:9px;font-weight:900}
.fit-figure-dot.is-active circle{r:11;fill:var(--accent);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--accent) 60%,transparent))}
html[data-theme=dark] .fit-figure-dot text{fill:#151820}
.fit-measure-table{display:grid;gap:4px}
.fit-measure-row{display:grid;grid-template-columns:minmax(120px,1.4fr) repeat(3,minmax(52px,.6fr)) minmax(96px,.9fr) minmax(150px,1fr);align-items:center;gap:8px;padding:8px 10px;border-radius:13px;transition:background .2s}
.fit-measure-row:not(.is-head):hover,.fit-measure-row:not(.is-head):focus-within{background:color-mix(in srgb,var(--accent) 7%,transparent)}
.fit-measure-row.is-head{color:var(--muted);font-size:11px;font-weight:700;border-bottom:1px solid var(--line);border-radius:0}
.fit-measure-row.is-head .is-current{color:var(--accent)}
.fit-measure-name{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center}
.fit-measure-name i{grid-row:span 2;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:#fff;font-size:11px;font-style:normal;font-weight:900}
html[data-theme=dark] .fit-measure-name i{color:#151820}
.fit-measure-name b{font-size:13px}
.fit-measure-name small{color:var(--muted);font-size:10px}
.fit-measure-value{color:var(--muted);font-size:13px;font-weight:700;text-align:center;font-variant-numeric:tabular-nums}
.fit-measure-value.is-current{color:var(--ink);font-weight:900}
.fit-measure-delta{justify-self:center;padding:3px 9px;border-radius:9px;background:var(--paper);color:var(--muted);font-size:11px;font-weight:800;white-space:nowrap}
.fit-measure-delta.is-good{background:var(--green-soft);color:var(--green-dark)}
.fit-measure-delta.is-bad{background:color-mix(in srgb,var(--theme-danger) 14%,var(--card));color:var(--theme-danger)}
.fit-measure-form{display:flex;gap:6px}
.fit-measure-form input{width:100%;min-width:0;height:36px;padding:0 8px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:13px;font-weight:800;text-align:center}
.fit-measure-form input:focus{outline:2px solid var(--accent);outline-offset:1px}
.fit-measure-form button{height:36px;padding:0 12px;border:0;border-radius:10px;background:var(--accent);color:#fff;font:inherit;font-size:12px;font-weight:800;cursor:pointer}
html[data-theme=dark] .fit-measure-form button{color:#151820}
html[data-theme=dark] :is(.fit-field input,.fit-measure-form input){background:#1b1e28;border-color:#7a8297}
@keyframes fit-pop{0%{transform:scaleY(.6)}60%{transform:scaleY(1.08)}100%{transform:none}}
@media(max-width:1200px){
  .fit-measure-row{grid-template-columns:minmax(110px,1.3fr) repeat(3,minmax(44px,.5fr)) minmax(90px,.9fr);row-gap:6px}
  .fit-measure-row .fit-measure-form{grid-column:2/-1}
  .fit-measure-row.is-head>span:last-child{display:none}
}
@media(max-width:900px){.fit-highlights{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));min-width:0}}
@media(max-width:680px){
  .fit-showcase{padding-block:50px 60px}
  .fit-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fit-kpi>b{font-size:19px}
  .fit-bars{height:150px;gap:2px;padding-inline:4px}
  .fit-bar em{display:none}
  .fit-bar-col.is-record .fit-bar em{display:block}
  .fit-body-grid{grid-template-columns:1fr}
  .fit-figure{max-width:150px;justify-self:center}
  .fit-measure-row.is-head{display:none}
  .fit-measure-row{grid-template-columns:repeat(3,minmax(0,1fr));padding:12px;border:1px solid var(--line)}
  .fit-measure-name{grid-column:1/-2}
  .fit-measure-delta{grid-column:3;grid-row:1}
  .fit-measure-value::before{content:attr(data-month);display:block;color:var(--muted);font-size:9px;font-weight:400}
  .fit-measure-row .fit-measure-form{grid-column:1/-1}
  .fit-form{flex-direction:column;align-items:stretch}
  .fit-field{min-width:0}
}
@media(prefers-reduced-motion:reduce){.fit-bar,.fit-goal-bar i,.fit-figure-dot circle{transition:none}.fit-bar-col.is-celebrating .fit-bar{animation:none}}
.fit-chart-box{max-width:820px;margin-inline:auto;width:100%}
.fit-chart-value{font-size:12px}.fit-chart-value.is-last{font-size:13px}.fit-chart-label{font-size:11px}.fit-chart-goal-label{font-size:11px}
.fit-chart-value{paint-order:stroke;stroke:var(--paper);stroke-width:5px;stroke-linejoin:round}

.fit-run-goal{display:grid;gap:7px;margin:4px 0 18px}
.fit-run-goal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:12px}
.fit-run-goal-head b{color:var(--ink);font-size:12px;font-variant-numeric:tabular-nums}
.fit-run-chart{min-width:0;padding:16px 18px 12px;border-radius:18px;background:var(--paper);box-shadow:var(--shadow-inset)}
.fit-run-chart-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--muted);font-size:12px}
.fit-run-chart-head b{color:var(--ink);font-size:14px;font-weight:900}
.fit-run-scroll{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-color:var(--line) transparent}
.fit-run-svg{display:block;width:100%;min-width:720px;height:auto;margin-top:8px;overflow:visible}
.fit-run-grid{stroke:var(--line);stroke-width:1;stroke-dasharray:3 5}
.fit-run-axis{stroke:color-mix(in srgb,var(--muted) 70%,transparent);stroke-width:1.5}
.fit-run-tick,.fit-run-day,.fit-run-axis-title{fill:var(--muted);font-size:13px;font-variant-numeric:tabular-nums}
.fit-run-unit{fill:var(--muted);font-size:13px;font-weight:700}
.fit-run-axis-title{font-weight:700}
.fit-run-today-band{fill:color-mix(in srgb,var(--accent) 9%,transparent)}
.fit-run-bar{fill:var(--accent);transition:opacity .2s,filter .2s}
.fit-run-bar:hover{filter:brightness(1.08)}
.fit-run-bar.is-record{fill:#e5a82d}
.fit-run-value{fill:var(--ink);font-size:12px;font-weight:900;font-variant-numeric:tabular-nums}
.fit-run-value.is-record{fill:#a9750b}
.fit-run-day.is-current{fill:var(--accent);font-weight:900}
.fit-run-legend{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:2px;color:var(--muted);font-size:11px}
.fit-run-legend span{position:relative;padding-inline-start:15px}
.fit-run-legend span::before{position:absolute;inset-inline-start:0;top:50%;width:9px;height:9px;border-radius:3px;background:var(--accent);content:"";transform:translateY(-50%)}
.fit-run-legend span.is-record::before{background:#e5a82d}
.fit-run-legend span.is-today::before{border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 14%,var(--card));box-sizing:border-box}
html[data-theme=dark] .fit-run-value.is-record{fill:#f3cc74}
@media(max-width:680px){
  .fit-run-chart{padding:12px 10px 10px}
  .fit-run-chart-head{align-items:flex-start;flex-direction:column;gap:4px}
  .fit-run-svg{min-width:680px}
  .fit-run-legend{gap:7px 12px;font-size:10px}
  .fit-run-goal-head{align-items:flex-start;flex-direction:column;gap:2px}
}

/* Reviews: user dialog in the panel + admin moderation page */
.dashboard-main.admin-reviews-mode>:not(#adminReviewsPage){display:none}
.app-sidebar button.review-side-link>span{color:#e0a32e}
.review-dialog{width:min(480px,calc(100% - 30px))}
.review-dialog form:not(.dialog-close-form){gap:8px}
.review-status{margin:8px 0 0;padding:8px 12px;border-radius:12px;background:var(--purple-soft);color:var(--purple-dark);font-size:12px;font-weight:700}
.review-status[data-status=approved]{background:var(--green-soft);color:var(--green-dark)}
.review-status[data-status=hidden]{background:color-mix(in srgb,var(--theme-danger) 12%,var(--card));color:var(--theme-danger)}
.review-stars-field,.review-name-field{margin:10px 0 0;padding:0;border:0}
.review-stars-field legend,.review-name-field legend,.review-dialog label[for=reviewText]{margin-bottom:6px;font-size:12px;font-weight:700}
.review-dialog label[for=reviewText] span{color:var(--muted);font-weight:400}
.review-star-picker{display:flex;gap:6px;direction:ltr;justify-content:flex-end}
.review-star{width:42px;height:42px;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:#d5d0c4;font-size:22px;line-height:1;cursor:pointer;transition:transform .15s,color .15s}
.review-star.is-on{color:#e0a32e;border-color:#ecc76f;background:#fdf6e3}
.review-star:hover{transform:scale(1.08)}
.review-star:focus-visible{outline:2px solid #e0a32e;outline-offset:2px}
.review-dialog textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#f0efea;color:var(--ink);font:inherit;font-size:13px;line-height:1.9;resize:vertical}
.review-dialog textarea:focus{outline:2px solid var(--purple);outline-offset:1px}
.review-name-field label{display:flex;align-items:center;gap:8px;margin-bottom:4px;font-size:12px;cursor:pointer}
.review-name-field input{accent-color:var(--purple)}
.review-note{margin:4px 0 0;color:var(--muted);font-size:11px}
html[data-theme=dark] .review-dialog textarea{background:#1b1e28;border-color:#7a8297}
html[data-theme=dark] .review-star{background:var(--theme-surface);border-color:var(--line);color:#4a4f5f}
html[data-theme=dark] .review-star.is-on{background:#3d3322;border-color:#a8822f;color:#f1c453}
.admin-review-filters{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 14px}
.admin-review-filter{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--muted);font:inherit;font-size:12px;cursor:pointer}
.admin-review-filter span{min-width:20px;padding:0 6px;border-radius:8px;background:var(--line);color:var(--ink);font-size:11px}
.admin-review-filter.selected{border-color:var(--purple);background:var(--purple-soft);color:var(--purple-dark);font-weight:700}
.admin-review-list{display:grid;gap:12px}
.admin-review-empty{margin:0;padding:24px;border:1px dashed var(--line);border-radius:16px;color:var(--muted);text-align:center;font-size:13px}
.admin-review-card{padding:14px 16px;border-radius:16px;background:var(--paper);border-inline-start:4px solid #e0a32e}
.admin-review-card.is-approved{border-inline-start-color:var(--green)}
.admin-review-card.is-hidden{border-inline-start-color:var(--muted);opacity:.8}
.admin-review-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.admin-review-head>div{display:grid;flex:1;min-width:180px}
.admin-review-head b{font-size:14px}
.admin-review-head small{color:var(--muted);font-size:11px}
.admin-review-status{padding:3px 10px;border-radius:9px;background:#fdf1d6;color:#9a6a0f;font-size:11px;font-weight:800}
.admin-review-card.is-approved .admin-review-status{background:var(--green-soft);color:var(--green-dark)}
.admin-review-card.is-hidden .admin-review-status{background:var(--line);color:var(--muted)}
.admin-review-text{margin:10px 0;color:var(--ink);font-size:13px;line-height:2}
.admin-review-actions .approve-action{background:var(--green);color:#fff}
html[data-theme=dark] .admin-review-actions .approve-action{color:#172d25}
html[data-theme=dark] .admin-review-status{background:#3d3322;color:#edc68a}

/* Panel workout page */
.dashboard-main.workout-mode>:not(#workoutPage){display:none}
.workout-page{animation:admin-page-enter .25s ease both}
.workout-heading p{max-width:560px}
.type-icon.workout-icon{color:#c9682a}
html[data-theme=dark] .type-icon.workout-icon{color:#f2b07a}
.workout-highlights{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin-bottom:22px}
.workout-settings{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;margin:0 0 20px;padding:16px 18px;border-radius:20px;background:var(--card);box-shadow:var(--shadow-soft);--accent:#c9682a}
.workout-settings[hidden]{display:none}
.workout-settings label{display:grid;gap:6px;min-width:150px;font-size:12px;font-weight:700}
.workout-settings label span{color:var(--muted);font-weight:400}
.workout-settings input{height:42px;padding:0 12px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);font:inherit;font-size:14px;font-weight:800;text-align:center}
html[data-theme=dark] .workout-settings input{background:#1b1e28;border-color:#7a8297}
html[data-theme=dark] .workout-settings{--accent:#f2b07a}

/* Finance tracker: income (green), expense (red), net (blue) */
.fin-tracker{--fin-income:#2f8f5b;--fin-expense:#c0475b;--fin-net:#3a6ea5;--accent:#3a6ea5}
html[data-theme=dark] .fin-tracker{--fin-income:#86d6a8;--fin-expense:#f09aa8;--fin-net:#8fb8e8;--accent:#8fb8e8}
.fin-showcase{padding-block:70px 90px;border-top:1px solid rgba(60,58,48,.08)}
.fin-showcase .media-copy h2 em{color:var(--fin-net)}
.fin-eyebrow{color:var(--fin-net)}
.fin-dot{background:var(--fin-net)}
.fin-tag{align-self:flex-start;background:color-mix(in srgb,var(--fin-net) 12%,var(--card));color:var(--fin-net)}
.dashboard-main.finance-mode>:not(#financePage){display:none}
.dashboard-main.settings-mode>:not(#settingsPage){display:none}
/* صفحهٔ تنظیمات */
.settings-page{animation:admin-page-enter .25s ease both}
.settings-page .habits-page-heading{margin-bottom:19px}
.settings-card{max-width:720px}
.settings-card h2{margin:0 0 6px;font-size:16px}
.settings-card>p{margin:0 0 14px;color:var(--muted);font-size:13px}
.settings-options{display:grid;gap:10px}
.settings-option{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:15px;background:var(--paper);cursor:pointer}
.settings-option:has(input:checked){border-color:var(--purple);background:color-mix(in srgb,var(--purple) 8%,var(--card))}
.settings-option input{width:18px;height:18px;margin:3px 0 0;flex:none;accent-color:var(--purple)}
.settings-option span{display:grid;gap:3px}
.settings-option b{font-size:14px}
.settings-option small{color:var(--muted);font-size:12px;line-height:1.8}
.finance-page{animation:admin-page-enter .25s ease both}
.finance-heading p{max-width:560px}
.type-icon.finance-icon{color:#3a6ea5}
html[data-theme=dark] .type-icon.finance-icon{color:#8fb8e8}
.fin-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.fin-periods{display:flex;flex-wrap:wrap;gap:6px;padding:5px;border-radius:16px;background:var(--paper);box-shadow:var(--shadow-inset)}
.fin-period{padding:8px 14px;border:0;border-radius:12px;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.fin-period:hover{color:var(--ink)}
.fin-period.is-active{background:var(--card);color:var(--fin-net);box-shadow:var(--shadow-soft)}
.fin-add-toggle{padding:10px 18px;border:0;border-radius:14px;background:var(--fin-net);color:#fff;font:inherit;font-size:13px;font-weight:800;cursor:pointer;box-shadow:0 6px 16px color-mix(in srgb,var(--fin-net) 25%,transparent)}
html[data-theme=dark] .fin-add-toggle{color:#151820}
.fin-actions{display:flex;align-items:center;gap:8px}
.fin-eye{display:grid;place-items:center;width:42px;height:42px;flex:none;padding:0;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--fin-net);cursor:pointer;box-shadow:var(--shadow-soft)}
.fin-eye svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fin-eye:hover{border-color:var(--fin-net)}
.fin-eye[aria-pressed=true]{color:var(--muted)}
/* دکمهٔ متن‌دار صفحهٔ حساب و کتاب: رنگی و واضح تا کاربر راحت پیدایش کند. */
.fin-eye.has-label{display:inline-flex;align-items:center;gap:8px;width:auto;height:42px;padding:0 14px;border:2px solid var(--fin-net);background:color-mix(in srgb,var(--fin-net) 10%,var(--card));color:var(--fin-net);font:inherit;font-size:13px;font-weight:800}
.fin-eye.has-label[aria-pressed=true]{color:var(--fin-net)}
.fin-eye.has-label:hover{background:color-mix(in srgb,var(--fin-net) 18%,var(--card))}
.fin-eye-text{display:inline-grid;white-space:nowrap}
.fin-eye-text>span{grid-area:1/1}
.fin-eye[aria-pressed=true] .is-hide,.fin-eye[aria-pressed=false] .is-show{visibility:hidden}
/* عدد واقعی و ستاره روی هم قرار می‌گیرند؛ عرض کادر همیشه به اندازهٔ بلندترینشان است و با زدن چشم چیزی جابه‌جا نمی‌شود. */
.fin-amt{display:inline-grid;vertical-align:baseline}
.fin-amt>span{grid-area:1/1;white-space:nowrap}
.fin-amt-mask,.fin-masked .fin-amt-real{visibility:hidden}
.fin-masked .fin-amt-mask{visibility:visible}
.hub-card .fin-eye{position:absolute;top:14px;left:16px;z-index:1;width:28px;height:28px;border-radius:9px;box-shadow:none}
.hub-card .fin-eye svg{width:16px;height:16px}
/* چشم کوچک کنار «حساب و کتاب» در منوی کناری و منوی «بیشتر» موبایل. */
.side-eye.fin-eye{width:26px;height:26px;margin-inline-start:auto;border-radius:8px;box-shadow:none}
.side-eye.fin-eye,.hub-card .fin-eye{--fin-net:#3a6ea5}
html[data-theme=dark] :is(.side-eye.fin-eye,.hub-card .fin-eye){--fin-net:#8fb8e8}
.side-eye.fin-eye svg{width:15px;height:15px}
.side-eye.fin-eye[aria-pressed=false]{background:color-mix(in srgb,var(--fin-net) 14%,var(--card));border-color:var(--fin-net)}
.mobile-more-item .side-eye.fin-eye{position:absolute;top:6px;inset-inline-start:8px;margin:0}
@media(max-width:680px){.hub-card .fin-eye{top:19px;left:52px}.hub-finance .hub-card-head{padding-inline-end:72px}}
.fin-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin-bottom:16px;padding:16px;border-radius:20px;background:var(--card);box-shadow:var(--shadow-soft);border-top:4px solid var(--fin-expense)}
.fin-form[hidden]{display:none}
.fin-form[data-type=income]{border-top-color:var(--fin-income)}
.fin-field{display:grid;gap:5px;min-width:120px;flex:1 1 140px;color:var(--muted);font-size:12px}
.fin-field input,.fin-field select{height:42px;padding:0 10px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);font:inherit;font-size:13px;font-weight:700}
.fin-field input:focus,.fin-field select:focus{outline:2px solid var(--fin-net);outline-offset:1px}
.fin-save{height:42px;padding:0 20px;border:0;border-radius:12px;background:var(--fin-expense);color:#fff;font:inherit;font-size:13px;font-weight:800;cursor:pointer}
.fin-form[data-type=income] .fin-save{background:var(--fin-income)}
html[data-theme=dark] .fin-save{color:#151820}
.fin-switch{display:inline-flex;gap:4px;padding:4px;border-radius:12px;background:var(--paper);box-shadow:var(--shadow-inset)}
.fin-switch button{padding:6px 12px;border:0;border-radius:9px;background:transparent;color:var(--muted);font:inherit;font-size:12px;font-weight:700;cursor:pointer}
.fin-switch button.is-active{background:var(--card);color:var(--ink);box-shadow:var(--shadow-soft)}
.fin-type-switch{align-self:center}
.fin-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:16px}
.fin-kpi{display:grid;gap:3px;padding:14px 16px;border-radius:18px;background:var(--card);box-shadow:var(--shadow-soft);border-top:3px solid var(--line)}
.fin-kpi>span{color:var(--muted);font-size:11px}
.fin-kpi>b{font-size:18px;font-weight:900;line-height:1.5;font-variant-numeric:tabular-nums}
.fin-kpi>small{color:var(--muted);font-size:10px}
.fin-kpi.is-income{border-top-color:var(--fin-income)}.fin-kpi.is-income>b{color:var(--fin-income)}
.fin-kpi.is-expense{border-top-color:var(--fin-expense)}.fin-kpi.is-expense>b{color:var(--fin-expense)}
.fin-kpi.is-net{border-top-color:var(--fin-net)}.fin-kpi.is-net>b{color:var(--fin-net)}
.fin-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:16px;margin-bottom:16px}
.fin-card{min-width:0;padding:16px 18px;border-radius:22px;background:var(--card);box-shadow:var(--shadow-soft)}
.fin-card-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.fin-card-head h3{margin:0;font-size:15px}
.fin-legend{display:flex;gap:12px;color:var(--muted);font-size:11px}
.fin-legend span{display:inline-flex;align-items:center;gap:5px}
.fin-legend i{width:10px;height:10px;border-radius:3px}
.fin-legend .is-income{background:var(--fin-income)}.fin-legend .is-expense{background:var(--fin-expense)}.fin-legend .is-net{background:var(--fin-net);border-radius:50%}
.fin-bars{display:flex;align-items:stretch;gap:8px;height:230px;padding:8px 6px 0;border-radius:16px;background:var(--paper);box-shadow:var(--shadow-inset)}
.fin-bar-col{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px;padding:4px 2px 0;border-radius:12px}
.fin-bar-col.is-selected{background:color-mix(in srgb,var(--fin-net) 9%,transparent)}
.fin-net{padding:1px 6px;border-radius:7px;background:color-mix(in srgb,var(--fin-net) 14%,var(--card));color:var(--fin-net);font-size:9px;font-weight:800;white-space:nowrap}
.fin-net.is-negative{background:color-mix(in srgb,var(--fin-expense) 14%,var(--card));color:var(--fin-expense)}
.fin-bar-pair{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:3px}
.fin-bar{width:min(16px,42%);border-radius:5px 5px 2px 2px;transition:height .4s ease}
.fin-bar.is-income{background:var(--fin-income)}
.fin-bar.is-expense{background:var(--fin-expense)}
.fin-bar-col small{height:18px;color:var(--muted);font-size:10px;white-space:nowrap}
.fin-bar-col.is-now small{color:var(--fin-net);font-weight:900}
.fin-breakdown{display:grid;grid-template-columns:150px minmax(0,1fr);align-items:center;gap:18px}
.fin-donut{position:relative;width:150px;height:150px;border-radius:50%;display:grid;place-items:center}
.fin-donut-center{position:absolute;inset:22px;display:grid;place-items:center;align-content:center;border-radius:50%;background:var(--card);box-shadow:var(--shadow-inset);text-align:center}
.fin-donut-center small{color:var(--muted);font-size:10px}
.fin-donut-center b{font-size:15px;font-weight:900}
.fin-headline{margin:0 0 10px;color:var(--muted);font-size:12px}
.fin-headline b{color:var(--ink)}
.fin-rank{display:grid;gap:8px;margin:0;padding:0;list-style:none;max-height:230px;overflow:auto}
.fin-rank li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;align-items:center;font-size:12px}
.fin-rank-label{display:flex;align-items:center;gap:7px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fin-rank-label i{width:9px;height:9px;flex:0 0 auto;border-radius:50%}
.fin-rank li>b{font-weight:900}
.fin-rank li>small{grid-column:1/-1;color:var(--muted);font-size:10px}
.fin-rank-bar{grid-column:1/-1;height:5px;overflow:hidden;border-radius:5px;background:var(--line)}
.fin-rank-bar i{display:block;height:100%;border-radius:inherit}
.fin-insights{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin-bottom:16px}
.fin-insight{display:flex;align-items:flex-start;gap:10px;margin:0;padding:12px 14px;border-radius:16px;background:var(--card);box-shadow:var(--shadow-soft);font-size:12px;line-height:1.9}
.fin-insight span{font-size:18px;line-height:1.4}
.fin-list-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.fin-sort{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:12px}
.fin-sort select{height:34px;padding:0 8px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:12px}
.fin-list{display:grid}
.fin-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:10px 4px;border-bottom:1px solid var(--line)}
.fin-row:last-of-type{border-bottom:0}
.fin-row-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--fin-expense) 12%,var(--card));font-size:18px}
.fin-row.is-income .fin-row-icon{background:color-mix(in srgb,var(--fin-income) 14%,var(--card))}
.fin-row-info{display:grid;min-width:0}
.fin-row-info b{overflow:hidden;font-size:13px;text-overflow:ellipsis;white-space:nowrap}
.fin-row-info small{color:var(--muted);font-size:11px}
.fin-row-amount{color:var(--fin-expense);font-size:13px;font-weight:900;white-space:nowrap;font-variant-numeric:tabular-nums}
.fin-row.is-income .fin-row-amount{color:var(--fin-income)}
.fin-row-remove{padding:4px 9px;border:0;border-radius:8px;background:transparent;color:var(--theme-danger);font:inherit;font-size:11px;cursor:pointer}
.fin-row-remove:hover{background:color-mix(in srgb,var(--theme-danger) 12%,transparent)}
.fin-more{justify-self:center;margin-top:10px;padding:8px 16px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--fin-net);font:inherit;font-size:12px;font-weight:800;cursor:pointer}
.fin-empty{margin:0;padding:22px;color:var(--muted);font-size:13px;text-align:center}
html[data-theme=dark] :is(.fin-field input,.fin-field select,.fin-sort select){background:#1b1e28;border-color:#7a8297}
@media(max-width:980px){.fin-grid{grid-template-columns:1fr}}
@media(max-width:680px){
  .fin-showcase{padding-block:50px 60px}
  .fin-toolbar{flex-direction:column;align-items:stretch}
  .fin-periods{overflow-x:auto;flex-wrap:nowrap}
  .fin-period{white-space:nowrap}
  .fin-actions .fin-add-toggle{flex:1}
  .fin-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fin-kpi>b{font-size:15px}
  .fin-bars{gap:3px;height:190px}
  .fin-net{font-size:8px;padding:1px 3px}
  .fin-bar-col small{font-size:8px}
  .fin-breakdown{grid-template-columns:1fr;justify-items:center}
  .fin-breakdown-side{width:100%}
  .fin-row{grid-template-columns:auto minmax(0,1fr) auto}
  .fin-row-remove{grid-column:2/-1;justify-self:start}
}
@media(prefers-reduced-motion:reduce){.fin-bar{transition:none}}

/* Mobile bottom bar: with many sections, items keep a readable width and the bar scrolls sideways */
@media(max-width:680px){
  .app-sidebar{justify-content:flex-start;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;scroll-snap-type:x proximity}
  .app-sidebar::-webkit-scrollbar{display:none}
  .app-sidebar>.side-link,.app-sidebar>button.side-link,.app-sidebar>.admin-menu{flex:0 0 66px;width:66px;min-width:66px;scroll-snap-align:start}
  .app-sidebar .side-link,.app-sidebar button.side-link{font-size:9px}
}
@media(max-width:680px){.app-sidebar .admin-submenu{position:fixed;bottom:calc(76px + env(safe-area-inset-bottom));left:12px;z-index:30}}
@media(max-width:680px){.fin-toolbar,.fin-toolbar>*{min-width:0;max-width:100%}}

/* QA fixes: login link only in the mobile menu, deadline feature label colour, dark-mode leftovers */
.main-nav .mobile-login-link{display:none}
@media(max-width:680px){.main-nav .mobile-login-link{display:block;color:var(--purple-dark);font-weight:800}}
.feature-grid-four .feature-number.deadline-text{color:var(--deadline)}
html[data-theme=dark] .feature-grid-four .feature-number.deadline-text{color:var(--deadline)}
html[data-theme=dark] .task-preview-progress{background:#30473e}
html[data-theme=dark] .habit-preview-progress{background:var(--theme-track)}
html[data-theme=dark] .cal-days i,html[data-theme=dark] .task-illustration i:last-child{background:#3a4254}
html[data-theme=dark] .habit-ring{background:conic-gradient(var(--purple) 0 71%,var(--theme-track) 71%)}

/* Mobile bottom bar: five items (dashboard, habits, deadlines, library, more); the rest live in the "more" sheet */
.mobile-more-link{display:none}
@media(max-width:680px){
  .app-sidebar{overflow:visible;justify-content:space-around}
  .app-sidebar>:is(.calendar-side-link,.tasks-side-link,.workout-side-link,.calories-side-link,.finance-side-link,.settings-side-link,.profile-side-link,.review-side-link,.reminder-setting-link,.admin-menu){display:none!important}
  .app-sidebar>.mobile-more-link{display:flex}
  .app-sidebar>.mobile-more-link>span{font-size:20px;line-height:22px}
}
.mobile-more-sheet{width:100%;max-width:520px;margin:auto auto 0;padding:18px 16px max(18px,env(safe-area-inset-bottom));border:0;border-radius:22px 22px 0 0;background:var(--card);color:var(--ink);box-shadow:0 -12px 40px rgba(30,28,24,.2)}
.mobile-more-sheet::backdrop{background:rgba(37,36,32,.35);backdrop-filter:blur(2px)}
.mobile-more-sheet[open]{animation:more-sheet-in .22s ease-out}
@keyframes more-sheet-in{from{transform:translateY(24px);opacity:.4}}
@media(prefers-reduced-motion:reduce){.mobile-more-sheet[open]{animation:none}}
.mobile-more-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.mobile-more-head h2{margin:0;font-size:15px}
.mobile-more-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mobile-more-item{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:78px;padding:10px 6px;border:0;border-radius:15px;background:var(--paper);color:var(--ink);font:inherit;font-size:11px;font-weight:600;text-align:center;text-decoration:none;cursor:pointer}
.mobile-more-item>span:first-child{font-size:20px;line-height:24px}
.mobile-more-item .type-icon{width:26px;height:26px}
.mobile-more-item.active{background:var(--purple-soft);color:var(--purple-dark)}
.mobile-more-item .side-badge{position:absolute;top:6px;inset-inline-end:8px}

/* Dashboard: every section in full, in order: deadlines, library, fitness, finance, then the progress charts */
.dashboard-main.dashboard-mode #deadlineWidget{display:none}
.dashboard-main.dashboard-mode>:is(#deadlinesPage,#libraryPage,#workoutPage,#caloriesPage,#financePage){margin-top:34px;padding-top:28px;border-top:1px solid var(--line)}
.dashboard-main.dashboard-mode .habits-page-heading h1{font-size:20px}
.dashboard-main.dashboard-mode .habits-page-heading .theme-toggle{display:none}
.dashboard-main.dashboard-mode>.analytics-section{margin-top:34px}
@media(max-width:680px){.dashboard-main.dashboard-mode>:is(#deadlinesPage,#libraryPage,#workoutPage,#caloriesPage,#financePage){margin-top:24px;padding-top:20px}.dashboard-main.dashboard-mode .habits-page-heading h1{font-size:18px}}
.month-completion-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.month-completion-select{min-width:0;max-width:110px;padding:3px 6px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink);font:inherit;font-size:9px;cursor:pointer}

/* Calorie counter (landing demo + panel page): target ring, macros, four meals, water, 7-day chart, add-food dialog */
:root{--cal:#1d7a73;--cal-soft:#dcefed;--cal-over:#b8475b;--cal-c:#b07a12;--cal-p:#3a6ea5;--cal-f:#b8475b}
html[data-theme=dark]{--cal:#7fd3cc;--cal-soft:#1d3634;--cal-over:#f09aa8;--cal-c:#f1c453;--cal-p:#8fb8e8;--cal-f:#f09aa8}
.dashboard-main.calories-mode>:not(#caloriesPage){display:none}
.type-icon.calories-icon{color:var(--cal)}
.cal-showcase{padding-block:70px 90px;border-top:1px solid rgba(60,58,48,.08)}
.cal-showcase .media-copy h2 em{color:var(--cal)}
.cal-eyebrow{color:var(--cal)}
.cal-dot{background:var(--cal)}
.cal-tag{align-self:flex-start;background:var(--cal-soft);color:var(--cal)}
.cal-tracker{display:grid;gap:14px}
.cal-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cal-date{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cal-date b{min-width:150px;font-size:13px;text-align:center}
.cal-day-step{width:32px;height:32px;border:0;border-radius:10px;background:var(--card);box-shadow:var(--shadow-soft);color:var(--ink);font-size:17px;cursor:pointer}
.cal-day-step:disabled{opacity:.35;cursor:default}
.cal-today,.cal-goal-toggle{padding:8px 12px;border:1px solid var(--line);border-radius:11px;background:var(--card);color:var(--cal);font:inherit;font-size:11px;font-weight:700;cursor:pointer}
.cal-goal-toggle[aria-expanded=true]{background:var(--cal-soft)}
.cal-goal{display:grid;gap:12px;padding:18px;border-radius:18px;background:var(--card);box-shadow:var(--shadow-soft)}
.cal-goal[hidden]{display:none}
.cal-goal-intro{margin:0;color:var(--muted);font-size:11px;line-height:1.9}
.cal-goal-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.cal-field{display:grid;gap:5px;font-size:11px;font-weight:600}
.cal-field input,.cal-field select,.cal-quick-row input,.cal-detail-row input,.cal-detail-row select,.cal-search{width:100%;min-width:0;min-height:40px;padding:8px 11px;border:1px solid var(--line);border-radius:11px;background:var(--paper);color:var(--ink);font:inherit;font-size:12px}
.cal-goal-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cal-goal-preview{flex:1 1 220px;margin:0;color:var(--cal);font-size:11px;font-weight:700}
.cal-save{min-height:40px;padding:0 16px;border:0;border-radius:11px;background:var(--cal);color:#fff;font:inherit;font-size:12px;font-weight:700;cursor:pointer}
html[data-theme=dark] .cal-save{color:#10201f}
.cal-save:disabled{opacity:.45;cursor:default}
.cal-cancel{min-height:40px;padding:0 14px;border:1px solid var(--line);border-radius:11px;background:transparent;color:var(--muted);font:inherit;font-size:12px;cursor:pointer}
.cal-summary{display:flex;align-items:center;gap:22px;padding:20px 22px;border-radius:20px;background:var(--card);box-shadow:var(--shadow-soft)}
.cal-ring{--p:0%;position:relative;display:grid;place-items:center;width:150px;height:150px;flex:0 0 150px;border-radius:50%;background:conic-gradient(var(--cal) 0 var(--p),var(--cal-soft) var(--p) 100%)}
.cal-ring.is-over{background:conic-gradient(var(--cal-over) 0 100%)}
.cal-ring::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--card)}
.cal-ring-center{position:relative;display:grid;justify-items:center;gap:2px}
.cal-ring-center b{font-size:28px;line-height:1.1;font-variant-numeric:tabular-nums}
.cal-ring.is-over .cal-ring-center b{color:var(--cal-over)}
.cal-ring-center small{color:var(--muted);font-size:10px}
.cal-summary-copy{display:grid;flex:1;gap:16px;min-width:0}
.cal-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.cal-stat{display:grid;gap:1px;padding:10px 12px;border-radius:13px;background:var(--paper)}
.cal-stat small,.cal-stat span{color:var(--muted);font-size:10px}
.cal-stat b{font-size:19px;font-variant-numeric:tabular-nums}
.cal-stat.is-eaten b{color:var(--cal)}
.cal-stat.is-over b{color:var(--cal-over)}
.cal-macros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.cal-macro{display:grid;gap:6px;min-width:0}
.cal-macro-top{display:flex;justify-content:space-between;gap:6px;font-size:11px}
.cal-macro-top b{color:var(--muted);font-size:10px;font-weight:600;white-space:nowrap}
.cal-macro-track{height:7px;overflow:hidden;border-radius:7px;background:var(--paper)}
.cal-macro-track i{display:block;height:100%;border-radius:inherit;transition:width .4s ease}
.cal-macro-c .cal-macro-track i{background:var(--cal-c)}
.cal-macro-p .cal-macro-track i{background:var(--cal-p)}
.cal-macro-f .cal-macro-track i{background:var(--cal-f)}
.cal-plan-note{margin:-4px 4px 0;color:var(--muted);font-size:11px;line-height:1.8}
.cal-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:start}
.cal-meals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#calorie .cal-layout{grid-template-columns:minmax(0,1fr);gap:14px}
#calorie .cal-meals,#calorie .cal-side{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
#calorie .cal-meals{grid-auto-rows:minmax(164px,auto)}
#calorie .cal-meal{min-height:156px}
.cal-meal,.cal-card{display:grid;align-content:start;gap:10px;padding:15px 16px;border-radius:18px;background:var(--card);box-shadow:var(--shadow-soft)}
.cal-meal-head{display:flex;align-items:center;gap:8px}
.cal-meal-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:var(--cal-soft);font-size:15px}
.cal-meal-head h4,.cal-card h3{margin:0;font-size:13px}
.cal-meal-head b{margin-right:auto;color:var(--cal);font-size:11px}
.cal-meal-list{display:grid;gap:2px}
.cal-entry{display:flex;align-items:center;gap:8px;padding:7px 4px;border-bottom:1px solid var(--line)}
.cal-entry-text{display:grid;flex:1;min-width:0}
.cal-entry-text b{overflow:hidden;font-size:12px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.cal-entry-text small{color:var(--muted);font-size:10px}
.cal-entry-kcal{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.cal-entry-remove{width:26px;height:26px;flex:0 0 26px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:15px;cursor:pointer}
.cal-entry-remove:hover{background:var(--paper);color:var(--cal-over)}
.cal-meal-empty{margin:4px 0;color:var(--muted);font-size:11px}
.cal-meal-add{justify-self:start;padding:7px 11px;border:1px dashed color-mix(in srgb,var(--cal) 45%,transparent);border-radius:10px;background:transparent;color:var(--cal);font:inherit;font-size:11px;font-weight:700;cursor:pointer}
.cal-meal-add:hover{background:var(--cal-soft)}
.cal-side{display:grid;gap:12px}
.cal-water-count{margin:0;color:var(--muted);font-size:11px}
.cal-glasses{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}
.cal-glass{aspect-ratio:1;padding:0;border:1px solid var(--line);border-radius:9px;background:var(--paper);font-size:13px;filter:grayscale(1);opacity:.45;cursor:pointer}
.cal-glass.is-full{border-color:transparent;background:var(--cal-soft);filter:none;opacity:1}
.cal-week-chart{position:relative;display:flex;align-items:stretch;gap:7px;height:120px}
.cal-week-day{display:grid;grid-template-rows:minmax(0,1fr) auto;flex:1;gap:4px;text-align:center}
.cal-week-day>span{position:relative;display:flex;align-items:flex-end}
.cal-week-day i{display:block;width:100%;min-height:2px;border-radius:6px 6px 2px 2px;background:color-mix(in srgb,var(--cal) 55%,transparent)}
.cal-week-day.is-selected i{background:var(--cal)}
.cal-week-day.is-over i{background:var(--cal-over)}
.cal-week-goal{position:absolute;right:0;left:0;border-top:1px dashed var(--cal)}
.cal-week-day small{color:var(--muted);font-size:10px}
.cal-week-note{margin:0;color:var(--muted);font-size:10px;line-height:1.8}
.cal-dialog{width:min(520px,calc(100% - 24px));max-height:min(86vh,720px);padding:22px;border:1px solid var(--line);border-radius:22px;background:var(--card);color:var(--ink);box-shadow:0 20px 60px rgba(40,38,33,.25)}
.cal-dialog[open]{display:grid;gap:12px;align-content:start;overflow:auto}
.cal-dialog::backdrop{background:rgba(37,36,32,.35);backdrop-filter:blur(3px)}
.cal-dialog h3{margin:0 0 0 40px;font-size:17px}
.cal-dialog .dialog-close{position:absolute;top:14px;left:14px}
.cal-results{display:grid;gap:4px;max-height:260px;overflow:auto}
.cal-results-label{margin:2px 2px 4px;color:var(--muted);font-size:11px}
.cal-result{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border:0;border-radius:11px;background:var(--paper);color:var(--ink);font:inherit;text-align:right;cursor:pointer}
.cal-result:hover,.cal-result:focus-visible{background:var(--cal-soft)}
.cal-result b{font-size:12px;font-weight:600}
.cal-result small{flex:0 0 auto;color:var(--muted);font-size:10px}
.cal-detail{display:grid;gap:8px;padding:13px;border:1px solid color-mix(in srgb,var(--cal) 35%,transparent);border-radius:14px;background:color-mix(in srgb,var(--cal-soft) 55%,var(--card))}
.cal-detail[hidden]{display:none}
.cal-detail-name{font-size:13px}
.cal-detail-row{display:grid;grid-template-columns:90px minmax(0,1fr) auto;gap:8px}
.cal-detail-result{margin:0;color:var(--cal);font-size:11px;font-weight:700}
.cal-quick summary{color:var(--muted);font-size:11px;cursor:pointer}
.cal-quick-row{display:grid;grid-template-columns:minmax(0,1fr) 90px auto;gap:8px;margin-top:8px}
.cal-source{margin:0;color:var(--muted);font-size:10px}
@media(max-width:980px){.cal-layout{grid-template-columns:1fr}.cal-side{grid-template-columns:1fr 1fr}.cal-goal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.cal-showcase{padding-block:50px 60px}.cal-summary{flex-direction:column;align-items:stretch;padding:16px}.cal-ring{align-self:center;width:136px;height:136px;flex-basis:136px}.cal-stat b{font-size:16px}.cal-macros{grid-template-columns:1fr}.cal-meals,.cal-side,#calorie .cal-meals,#calorie .cal-side{grid-template-columns:1fr}#calorie .cal-meals{grid-auto-rows:auto}#calorie .cal-meal{min-height:0}.cal-date b{min-width:0}.cal-dialog{padding:18px}.cal-detail-row{grid-template-columns:70px minmax(0,1fr)}.cal-detail-row .cal-save{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.cal-macro-track i{transition:none}}

/* SMS-code sign-in and profile completion */
.otp-form #otpMobile,.otp-form #otpCode{text-align:left;letter-spacing:.06em;font-size:14px}
.otp-form #otpCode{font-size:20px;letter-spacing:.5em;text-align:center}
.otp-sent-note{margin:8px 0 0;color:var(--muted);font-size:10px;line-height:1.8}
.otp-actions{display:flex;justify-content:space-between;gap:10px;margin-top:6px}
.otp-link{padding:4px 0;border:0;background:none;color:var(--purple-dark);font:inherit;font-size:10px;font-weight:700;cursor:pointer}
.otp-link:disabled{color:var(--muted);font-weight:500;cursor:default}
.auth-mode-switch{display:block;margin:16px auto 0;padding:6px 10px;border:0;border-radius:9px;background:none;color:var(--purple-dark);font:inherit;font-size:11px;font-weight:700;cursor:pointer}
.auth-mode-switch:hover{background:var(--purple-soft)}
.signup-method-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:19px 0 15px;padding:5px;border-radius:13px;background:var(--paper);box-shadow:var(--shadow-inset)}
.signup-method-tabs button{min-height:38px;padding:7px 8px;border:0;border-radius:9px;background:transparent;color:var(--muted);font:inherit;font-size:11px;font-weight:700;cursor:pointer}
.signup-method-tabs button[aria-selected=true]{background:var(--card);color:var(--purple-dark);box-shadow:var(--shadow-soft)}
.auth-card.signup .signup-panels{min-height:310px}
.signup-phone-soon{display:grid;align-content:center;justify-items:center;gap:4px;min-height:310px;margin:0;padding:28px 20px;border:1px solid var(--line);border-radius:16px;background:var(--card);text-align:center}
.signup-phone-soon>span{font-size:25px}
.signup-phone-soon strong{font-size:14px}
.signup-phone-soon p{margin:0;color:var(--muted);font-size:11px}
.profile-edit-link{padding:0;border:0;background:none;color:var(--purple-dark);font:inherit;font-size:9px;font-weight:700;text-align:right;cursor:pointer}
.profile-mini .profile-edit-link{display:inline-block}
.profile-mini .avatar{overflow:hidden}
.profile-mini .avatar img{width:100%;height:100%;object-fit:cover}
.profile-dialog form{display:flex;flex-direction:column}
.profile-dialog-note{margin:6px 0 4px;color:var(--muted);font-size:11px;line-height:1.8}
.profile-dialog #profileMobile{opacity:.7}
.profile-later{align-self:center;margin-top:8px}
.profile-nudge{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-8px 0 18px;padding:11px 14px;border:1px solid color-mix(in srgb,var(--purple) 25%,transparent);border-radius:14px;background:var(--purple-soft);color:var(--purple-dark);font-size:11px;font-weight:600}
.profile-nudge-button{flex:0 0 auto;padding:7px 12px;border:0;border-radius:10px;background:var(--purple);color:#fff;font:inherit;font-size:11px;font-weight:700;cursor:pointer}
html[data-theme=dark] .profile-nudge-button{color:#16181f}
@media(max-width:680px){.profile-nudge{flex-direction:column;align-items:stretch;text-align:right}}

/* Account profile page: optional personal details, stored with the signed-in account. */
.dashboard-main.profile-mode>:not(#profilePage){display:none}
.profile-page{animation:admin-page-enter .25s ease both}
.profile-page .habits-page-heading{margin-bottom:19px}
.profile-page-grid{display:grid;grid-template-columns:minmax(205px,260px) minmax(0,1fr);align-items:start;gap:16px}
.profile-card{min-width:0;padding:22px;border-radius:19px;background:var(--card);box-shadow:var(--shadow-soft)}
.profile-photo-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.profile-avatar-stage{width:112px;height:112px;display:grid;place-items:center;overflow:hidden;border:1px solid var(--line);border-radius:50%;background:var(--purple-soft);color:var(--purple-dark);font-size:40px}
.profile-avatar-stage img{width:100%;height:100%;object-fit:cover}
.profile-photo-card h2,.profile-form h2{margin:0;font-size:15px}
.profile-photo-card p,.profile-form-head p{margin:3px 0 0;color:var(--muted);font-size:10px;line-height:1.8}
.profile-photo-pick{min-height:36px;padding:0 15px;font-size:10px;cursor:pointer}
.profile-photo-remove{border:0;background:none;color:#a64c52;font:inherit;font-size:10px;cursor:pointer}
.profile-form-head{margin-bottom:15px}
.profile-fields{display:grid;grid-template-columns:125px minmax(0,1fr);align-items:center;gap:10px 14px}
.profile-fields label{color:var(--ink);font-size:11px;font-weight:600}
.profile-fields label small{color:var(--muted);font-size:9px;font-weight:400}
.profile-fields input{width:100%;min-width:0;height:39px;padding:0 11px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:11px;outline:none}
.profile-fields input:focus{border-color:var(--purple);box-shadow:0 0 0 3px color-mix(in srgb,var(--purple) 15%,transparent)}
.profile-fields input[readonly]{color:var(--muted);direction:ltr;text-align:left}
.profile-data-note{margin:14px 0 12px;color:var(--muted);font-size:9px;line-height:1.8}
.profile-save-button{min-height:40px;padding-inline:16px;font-size:10px}
@media(max-width:680px){.profile-page-grid{grid-template-columns:1fr}.profile-photo-card{display:grid;grid-template-columns:78px minmax(0,1fr) auto;align-items:center;text-align:right;padding:14px}.profile-avatar-stage{width:68px;height:68px;font-size:28px;grid-row:span 2}.profile-photo-card h2{font-size:12px}.profile-photo-pick{grid-column:2/-1;justify-self:start}.profile-photo-remove{grid-column:2/-1;justify-self:start}.profile-card{padding:16px}.profile-fields{grid-template-columns:95px minmax(0,1fr);gap:9px}.profile-fields input{height:36px}.profile-save-button{width:100%}}

/* Dashboard previews: one clickable card per section (deadlines, library, fitness, calories, finance) */
.hub-section{margin-top:30px}
.hub-section-head{margin-bottom:14px}
.hub-section-head h2{margin:2px 0 0;font-size:17px}
.hub-section-head p{margin:3px 0 0;color:var(--muted);font-size:11px}
.hub-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px}
.hub-card{--hub:#3a6ea5;--hub-soft:#e3ecf6;position:relative;display:flex;flex-direction:column;gap:12px;min-width:0;padding:18px 19px;overflow:hidden;border-radius:20px;background:var(--card);box-shadow:var(--shadow-soft);color:var(--ink);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.hub-card::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--hub);opacity:.85}
.hub-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(60,55,45,.14)}
.hub-card:focus-visible{outline:3px solid var(--hub);outline-offset:3px}
.hub-deadline{--hub:var(--deadline);--hub-soft:var(--deadline-soft)}
.hub-workout{--hub:#b05a22;--hub-soft:#f6e6da}
.hub-calories{--hub:var(--cal);--hub-soft:var(--cal-soft)}
.hub-finance{--hub:#2f7d52;--hub-soft:#dcefe3}
html[data-theme=dark] .hub-library{--hub:#8fb8e8;--hub-soft:#24324a}
html[data-theme=dark] .hub-workout{--hub:#f2b07a;--hub-soft:#3d2c22}
html[data-theme=dark] .hub-finance{--hub:#86d6a8;--hub-soft:#1f3a2c}
html[data-theme=dark] .hub-card:hover{box-shadow:0 14px 30px rgba(0,0,0,.35)}
.hub-card-head{display:flex;align-items:center;gap:9px}
.hub-card-head .type-icon{width:32px;height:32px;flex:0 0 32px;display:grid;place-items:center;border-radius:11px;background:var(--hub-soft);color:var(--hub);box-shadow:none}
.hub-card-head .type-icon svg{width:18px;height:18px}
.hub-card-head h3{margin:0;font-size:14px}
.hub-card-go{margin-right:auto;padding:4px 9px;border-radius:9px;background:var(--hub-soft);color:var(--hub);font-size:10px;font-weight:700;white-space:nowrap;transition:transform .2s ease}
.hub-card:hover .hub-card-go{transform:translateX(-3px)}
.hub-big{display:grid;gap:2px}
.hub-big b{color:var(--hub);font-size:24px;line-height:1.3;font-variant-numeric:tabular-nums}
.hub-big small{overflow:hidden;color:var(--muted);font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.hub-big.is-bad b,.hub-stat.is-bad b{color:#b23f52}
.hub-big.is-warn b{color:#b5651d}
.hub-big.is-good b,.hub-stat.is-good b{color:#2f7d52}
html[data-theme=dark] :is(.hub-big.is-bad,.hub-stat.is-bad) b{color:#f09aa8}
html[data-theme=dark] .hub-big.is-warn b{color:#f2b07a}
html[data-theme=dark] :is(.hub-big.is-good,.hub-stat.is-good) b{color:#86d6a8}
.hub-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.hub-stat{display:grid;gap:1px;min-width:0;padding:8px;border-radius:12px;background:var(--paper)}
.hub-stat b{overflow-wrap:anywhere;font-size:13px;line-height:1.4}
.hub-stat small{color:var(--muted);font-size:9px}
.hub-bar{display:grid;gap:5px}
.hub-bar-top{display:flex;justify-content:space-between;gap:10px;font-size:10px}
.hub-bar-top span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hub-bar-top b{flex:0 0 auto;color:var(--muted);font-size:9px;font-weight:600}
.hub-track{height:6px;overflow:hidden;border-radius:6px;background:var(--hub-soft)}
.hub-track i{display:block;height:100%;border-radius:inherit;background:var(--hub)}
.hub-ring-row{display:flex;align-items:center;gap:14px}
.hub-ring{--p:0%;position:relative;display:grid;place-content:center;justify-items:center;width:84px;height:84px;flex:0 0 84px;border-radius:50%;background:conic-gradient(var(--hub) 0 var(--p),var(--hub-soft) var(--p) 100%)}
.hub-ring.is-over{background:conic-gradient(var(--cal-over) 0 100%)}
.hub-ring::before{content:"";position:absolute;inset:8px;border-radius:50%;background:var(--card)}
.hub-ring b,.hub-ring small{position:relative}
.hub-ring b{font-size:16px;line-height:1.2}
.hub-ring small{color:var(--muted);font-size:9px}
.hub-ring-copy{display:grid;gap:2px}
.hub-ring-copy b{color:var(--hub);font-size:16px}
.hub-ring-copy small{color:var(--muted);font-size:10px}
.hub-empty{display:grid;gap:10px;margin-top:auto}
.hub-empty p{margin:0;color:var(--muted);font-size:11px;line-height:1.9}
.hub-empty-action{justify-self:start;padding:7px 11px;border-radius:10px;background:var(--hub-soft);color:var(--hub);font-size:11px;font-weight:700}
.dashboard-main.dashboard-mode>.weekly-reflection{margin-top:24px}
.weekly-reflection>div{min-width:0}
.weekly-reflection #reflectionPreview{line-height:1.8;overflow-wrap:anywhere}
.weekly-reflection #reflectionPreview.has-note{color:var(--ink)}
.reflection-dialog{width:min(520px,calc(100% - 30px))}
.reflection-dialog .eyebrow{margin:0 0 6px}
.reflection-dialog h2{margin:0 0 7px}
.reflection-dialog-note{margin:0 0 13px;color:var(--muted);font-size:11px;line-height:1.8}
.reflection-dialog form:not(.dialog-close-form){gap:8px}
.reflection-dialog label{font-size:11px;font-weight:700}
.reflection-dialog textarea{width:100%;min-height:128px;padding:11px 13px;border:1px solid var(--line);border-radius:12px;background:#f4f3ef;color:var(--ink);font:inherit;font-size:12px;line-height:1.9;resize:vertical}
.reflection-dialog textarea:focus{outline:2px solid var(--purple);outline-offset:1px}
.reflection-dialog-actions{display:flex;gap:9px;align-items:center;margin-top:5px}
.reflection-dialog-actions .button{min-height:41px;margin:0}
.reflection-dialog-actions #reflectionClear{color:var(--theme-danger)}
.reflection-dialog-actions [type=submit]{margin-right:auto}
@media(max-width:680px){.hub-grid{grid-template-columns:1fr;gap:12px}.hub-card{padding:16px;border-radius:17px}.hub-big b{font-size:21px}}
@media(prefers-reduced-motion:reduce){.hub-card,.hub-card-go{transition:none}.hub-card:hover{transform:none}}
/* Spacious rows with visible summaries for every subsection. */
.hub-grid{grid-template-columns:1fr;gap:24px}
.hub-card{flex-direction:row;align-items:center;gap:22px;padding:20px 22px 20px 60px}
.hub-card::before{inset:0 0 0 auto;width:4px;height:auto}
.hub-card:hover{transform:translateX(-3px)}
.hub-card-head{flex:0 0 140px;gap:9px;min-width:0}
.hub-card-head h3{font-size:13px}
.hub-card-go{position:absolute;top:50%;left:16px;display:grid;place-items:center;width:28px;height:28px;margin:0;padding:0;font-size:16px;transform:translateY(-50%)}
.hub-card:hover .hub-card-go{transform:translate(-3px,-50%)}
.hub-big{flex:0 0 210px;min-width:0}
.hub-big b{font-size:20px}
.hub-bar{flex:1 1 auto;min-width:0}
.hub-deadline>.hub-stats,.hub-deadline>.hub-bar~.hub-bar{display:none}
.hub-detailed{display:grid;grid-template-columns:140px minmax(0,1fr);align-items:stretch}
.hub-detailed .hub-card-head{align-self:center}
.hub-content{display:grid;gap:12px;min-width:0}
.hub-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;min-width:0}
.hub-metric{--hub-metric:var(--hub);display:flex;flex-direction:column;gap:7px;min-width:0;padding:13px 14px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--hub-soft) 24%,var(--card));}
.hub-metric h4{margin:0;color:var(--ink);font-size:11px;font-weight:600;line-height:1.7}
.hub-metric-value{color:var(--hub-metric);font-size:20px;font-variant-numeric:tabular-nums;line-height:1.4;overflow-wrap:anywhere}
.hub-metric-note{display:block;min-width:0;color:var(--muted);font-size:10px;line-height:1.9;overflow-wrap:anywhere}
.hub-metric .hub-bar{flex:0 0 auto;gap:6px;margin-top:auto;padding-top:4px}
.hub-metric .hub-bar-top{flex-wrap:wrap;gap:3px 8px;font-size:9px}
.hub-metric .hub-bar-top span{white-space:normal}
.hub-metric .hub-track{height:5px;background:color-mix(in srgb,var(--hub-metric) 13%,var(--card))}
.hub-metric .hub-track i{background:var(--hub-metric)}
.hub-metric-series,.hub-metric-f,.hub-metric-expense,.hub-metric.is-bad{--hub-metric:#b23f52}
.hub-metric-podcasts,.hub-metric-running,.hub-metric-income,.hub-metric.is-good{--hub-metric:#2f7d68}
.hub-metric-body{--hub-metric:var(--purple)}
.hub-metric-p{--hub-metric:#3a6ea5}
.hub-metric-c{--hub-metric:#a67415}
.hub-detail-note{color:var(--muted);font-size:10px;line-height:1.8}
.hub-calorie-content{grid-template-columns:minmax(220px,1.1fr) minmax(0,2fr);align-items:center;gap:16px}
.hub-calorie-content .hub-panels{align-self:center}
.hub-calorie-content>.hub-detail-note{grid-column:1/-1}
.hub-ring-row{min-width:0;gap:12px}
.hub-calorie-content>.hub-ring-row{display:grid;justify-items:center;gap:12px;text-align:center}
.hub-ring{width:184px;height:184px;flex-basis:184px}
.hub-ring::before{inset:14px}
.hub-ring b{font-size:34px}
.hub-ring small{font-size:12px}
.hub-ring-copy{justify-items:center}
.hub-ring-copy b{font-size:16px;line-height:1.9}
.hub-ring-copy small{font-size:10px}
.hub-finance-footer{display:flex;align-items:center;gap:24px}
.hub-finance-footer>.hub-bar{max-width:440px}
.hub-finance-footer>.hub-detail-note{margin-inline-start:auto}
.hub-empty{flex:1 1 auto;grid-template-columns:minmax(0,1fr) auto;align-items:center;margin:0}
html[data-theme=dark] :is(.hub-metric-series,.hub-metric-f,.hub-metric-expense,.hub-metric.is-bad){--hub-metric:#f09aa8}
html[data-theme=dark] :is(.hub-metric-podcasts,.hub-metric-running,.hub-metric-income,.hub-metric.is-good){--hub-metric:#86d6a8}
html[data-theme=dark] .hub-metric-p{--hub-metric:#8fb8e8}
html[data-theme=dark] .hub-metric-c{--hub-metric:#e3bd73}
@media(max-width:1150px){.hub-detailed{grid-template-columns:1fr;gap:16px}.hub-detailed .hub-card-head{padding-inline-end:26px}.hub-finance-footer{gap:18px}}
@media(max-width:900px){.hub-deadline{flex-wrap:wrap;gap:12px 18px}.hub-deadline .hub-card-head{flex-basis:100%}.hub-big{flex:1 1 160px}.hub-deadline>.hub-bar{flex:1 1 180px}.hub-empty{grid-template-columns:1fr}.hub-calorie-content{grid-template-columns:1fr}.hub-calorie-content .hub-ring-row{padding-bottom:4px}}
@media(max-width:680px){.hub-grid{gap:22px}.hub-card{padding:17px 16px;border-radius:17px}.hub-card-go{top:19px;left:16px;transform:none}.hub-card:hover .hub-card-go{transform:translateX(-3px)}.hub-card-head{padding-inline-end:36px}.hub-panels{grid-template-columns:1fr;gap:10px}.hub-metric{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 10px;padding:12px 14px}.hub-metric h4{font-size:12px}.hub-metric-value{font-size:18px}.hub-metric-note,.hub-metric .hub-bar{grid-column:1/-1}.hub-metric .hub-bar{width:100%;margin-top:4px}.hub-finance-footer{flex-direction:column;align-items:stretch;gap:10px}.hub-finance-footer>.hub-detail-note{margin:0}.hub-ring-row{gap:16px}.hub-ring-copy b{font-size:15px}.hub-deadline .hub-card-head{padding-bottom:4px}.hub-deadline>.hub-big{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.hub-card:hover{transform:none}}
#syncStatus[data-state=saved]{color:var(--green-dark)}
#syncStatus[data-state=failed]{color:#b23f52;font-weight:700}
html[data-theme=dark] #syncStatus[data-state=failed]{color:#f09aa8}
/* پنجرهٔ افزودن خوراکی در موبایل: بالای صفحه، تا کیبورد روی نتیجه‌ها را نگیرد */
@media(max-width:680px){
  .cal-dialog{width:calc(100% - 16px);margin:10px auto auto;max-height:calc(100dvh - 20px);padding:16px 14px}
  .cal-dialog .cal-search{font-size:16px}
  .cal-results{max-height:none}
  .cal-result{padding:11px 12px}
}
/* موبایل: بدون زوم ناخواسته. دوبار ضربه زوم نمی‌کند (زوم دو انگشتی برای کاربر باز است)،
   و چون Safari آیفون روی کادرهای کوچک‌تر از ۱۶ پیکسل خودکار زوم می‌کند، کادرها در آیفون ۱۶ پیکسل‌اند. */
html,body{touch-action:manipulation;-webkit-text-size-adjust:100%;text-size-adjust:100%}
@supports (-webkit-touch-callout:none){
  input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{font-size:16px!important}
}
/* کادرهای فرم حساب و کتاب عرض ستون را پر کنند و با متن ۱۶ پیکسلی آیفون از صفحه بیرون نزنند */
.fin-field{min-width:0}
.fin-field input,.fin-field select{width:100%;min-width:0;box-sizing:border-box}

/* Keep the main landing headlines on one shared type scale. */
.landing-main .hero h1,
.landing-main .time-showcase-copy h2,
.landing-main .due-copy h2,
.landing-main #mediaTitle,
.landing-main #fitTitle,
.landing-main #calTitle,
.landing-main #finTitle,
.landing-main .features-section .section-heading h2,
.landing-main .stats-copy h2,
.landing-main .reviews-head h2{font-size:clamp(40px,5vw,64px);line-height:1.25;letter-spacing:-.055em;font-weight:700}
@media(max-width:900px){.landing-main .hero h1,.landing-main .time-showcase-copy h2,.landing-main .due-copy h2,.landing-main #mediaTitle,.landing-main #fitTitle,.landing-main #calTitle,.landing-main #finTitle,.landing-main .features-section .section-heading h2,.landing-main .stats-copy h2,.landing-main .reviews-head h2{font-size:48px}}
@media(max-width:680px){.landing-main .hero h1,.landing-main .time-showcase-copy h2,.landing-main .due-copy h2,.landing-main #mediaTitle,.landing-main #fitTitle,.landing-main #calTitle,.landing-main #finTitle,.landing-main .features-section .section-heading h2,.landing-main .stats-copy h2,.landing-main .reviews-head h2{font-size:43px}}
@media(max-width:390px){.landing-main .hero h1,.landing-main .time-showcase-copy h2,.landing-main .due-copy h2,.landing-main #mediaTitle,.landing-main #fitTitle,.landing-main #calTitle,.landing-main #finTitle,.landing-main .features-section .section-heading h2,.landing-main .stats-copy h2,.landing-main .reviews-head h2{font-size:38px}}

/* Body measurements: a focused monthly entry form beside the selected measurement trend. */
.fit-body-layout{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:16px;align-items:stretch}
.fit-body-entry,.fit-body-progress{min-width:0;padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--card);box-shadow:var(--shadow-inset)}
.fit-body-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}
.fit-body-section-head>div{color:var(--ink);font-size:16px;font-weight:900}
.fit-body-section-head small,.fit-body-list-head small{color:var(--muted);font-size:11px}
.fit-body-entry-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px}
.fit-body-field{display:grid;gap:5px;min-width:0;color:var(--muted);font-size:11px;font-weight:700}
.fit-body-field.is-wide{grid-column:1/-1}
.fit-body-field :is(input,select){width:100%;min-width:0;height:40px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:inherit;font-size:13px;font-weight:800}
.fit-body-field :is(input,select):focus{outline:2px solid var(--accent);outline-offset:1px}
.fit-body-save{grid-column:1/-1;min-height:40px;border:0;border-radius:11px;background:var(--accent);color:#fff;font:inherit;font-size:13px;font-weight:900;cursor:pointer;transition:filter .2s,transform .2s}
.fit-body-save:hover{filter:brightness(.95);transform:translateY(-1px)}
html[data-theme=dark] .fit-body-save{color:#151820}
.fit-body-list-head{display:flex;align-items:center;justify-content:space-between;padding:0 2px 8px;border-bottom:1px solid var(--line)}
.fit-body-list-head b{color:var(--ink);font-size:12px}
.fit-body-part-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding-top:10px}
.fit-body-part{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 8px;align-items:center;min-width:0;padding:9px 10px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink);font:inherit;text-align:right;cursor:pointer;transition:border-color .2s,background .2s,transform .2s}
.fit-body-part:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}
.fit-body-part.is-selected{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--paper))}
.fit-body-part-name{overflow:hidden;color:var(--muted);font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.fit-body-part b{grid-column:1/-1;color:var(--ink);font-size:13px;font-weight:900}
.fit-body-part small{grid-column:1/-1;overflow:hidden;color:var(--muted);font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.fit-body-progress{display:flex;flex-direction:column;justify-content:flex-start}
.fit-body-chart-box{width:100%;max-width:none;margin:0;padding:12px 8px 2px;background:var(--paper)}
.fit-body-chart-note{margin:12px 0 0;padding:9px 12px;border-radius:11px;background:color-mix(in srgb,var(--accent) 9%,var(--card));color:var(--muted);font-size:11px;font-weight:700;line-height:1.8}
.fit-body-chart-empty{display:grid;min-height:200px;place-items:center;padding:24px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);font-size:13px;text-align:center;line-height:2}
@media(max-width:980px){.fit-body-layout{grid-template-columns:1fr}}
@media(max-width:520px){.fit-body-entry,.fit-body-progress{padding:13px}.fit-body-section-head{align-items:flex-start;flex-direction:column;gap:3px}.fit-body-part-list{grid-template-columns:repeat(2,minmax(0,1fr))}.fit-body-entry-form{gap:8px}}

/* Make weekly calorie amounts readable above each day's bar. */
.cal-week-day>span{height:100%;overflow:visible}
.cal-week-day .cal-week-value{position:absolute;z-index:2;right:50%;transform:translateX(50%);color:var(--cal);font-size:9px;line-height:1.2;font-variant-numeric:tabular-nums;white-space:nowrap}
.cal-week-day.is-over .cal-week-value{color:var(--cal-over)}
.cal-week-goal{z-index:1;pointer-events:none}

/* Progress chart: clearer weekly groups, readable values and a full 0–100% scale. */
.stats-demo{padding:24px 26px 22px}
.stats-demo-head b{font-size:16px}
.chart-legend{margin-top:12px}
.bar-chart{height:220px;margin-top:12px}
.chart-y{padding:22px 0 25px;font-size:9px}
.chart-plot{min-width:0}
.grid-lines{inset:22px 0 27px}
.chart-bars{inset:22px 3px 27px;align-items:stretch;overflow:visible}
.bar-pair{position:relative;flex:1;min-width:0;max-width:76px;height:100%;align-items:stretch;justify-content:center;gap:5px}
.bar-item{position:relative;display:block;flex:0 1 18px;min-width:9px;height:100%}
.bar-item .bar{position:absolute;right:0;bottom:0;width:100%;height:var(--height);border-radius:6px 6px 2px 2px}
.bar-item>b{position:absolute;right:50%;bottom:calc(var(--height) + 4px);transform:translateX(50%);color:var(--muted);font-size:9px;line-height:1.2;font-variant-numeric:tabular-nums;white-space:nowrap}
.bar-item.task-value>b{color:var(--green-dark)}
.bar-item.habit-value>b{color:var(--purple-dark)}
.chart-x{font-size:9px}
@media(max-width:680px){.stats-section{gap:25px}.stats-demo{padding:18px 14px 17px}.bar-chart{height:190px;gap:7px}.chart-y{font-size:8px}.bar-item>b{font-size:8px}.chart-x{font-size:8px}}