/* STEPS — Progress ekrani uslublari.
   Egasi: PROGRESS agenti (screens/progress.js, weight.js).
   Ildizlar: [data-screen="progress"] · [data-overlay="weight"]. Ranglar — faqat tokenlar; rangli matn — *-ink; grafik — --chart-*. */

/* ═════════════ Sarlavha va ogohlantirish ═════════════ */
[data-screen="progress"] .avatar{width:44px;height:44px}
[data-screen="progress"] .banner{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start;margin-bottom:10px;padding:14px 16px;
  border-radius:var(--r-md);font-size:14px;font-weight:700;line-height:1.4}
[data-screen="progress"] .banner svg.i{width:20px;height:20px;margin-top:1px}
[data-screen="progress"] .banner--near{background:var(--near-soft);color:var(--near-ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--near) 18%,transparent)}
[data-screen="progress"] .banner-acts{grid-column:2;display:flex;gap:8px}
[data-screen="progress"] .banner-acts .btn{height:44px;padding:0 16px;font-size:15px}
[data-screen="progress"] .banner-acts .btn--soft{background:var(--surface);color:var(--fg);box-shadow:var(--e1)}
[data-screen="progress"] .banner-acts .btn--ghost{color:var(--near-ink)}

/* ═════════════ Vazn kartasi ═════════════ */
[data-screen="progress"] .wcard{display:grid;gap:14px}
[data-screen="progress"] .w-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
[data-screen="progress"] .w-cap{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
[data-screen="progress"] .w-now{font-size:48px;font-weight:700;line-height:1}
[data-screen="progress"] .w-now small{font-family:var(--font);font-size:17px;color:var(--muted);font-weight:700;letter-spacing:0;margin-left:4px}
[data-screen="progress"] .w-top .pill{margin-top:22px}
[data-screen="progress"] .wrange button{font-size:12px;min-height:44px}
[data-screen="progress"] .wchart{width:100%;height:auto;display:block;overflow:visible;margin:2px 0 -4px}
[data-screen="progress"] .wchart .grid{stroke:var(--chart-grid);stroke-width:1}
[data-screen="progress"] .wchart .goal{stroke:var(--chart-goal);stroke-width:1.5;stroke-dasharray:4 5;opacity:.8}
[data-screen="progress"] .wchart .area{fill:url(#wg-area)}
[data-screen="progress"] .wchart .line{fill:none;stroke:var(--chart-line);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
[data-screen="progress"] .wchart .dot{fill:var(--muted);opacity:.4}
[data-screen="progress"] .wchart .end{fill:var(--chart-line);stroke:var(--surface);stroke-width:3}
[data-screen="progress"] .wchart text{fill:var(--chart-label);font-size:11px;font-weight:700;font-family:var(--font)}
[data-screen="progress"] .wchart .gl{fill:var(--fg)}
[data-screen="progress"] .w-empty{display:grid;justify-items:center;text-align:center;gap:8px;padding:10px 0 4px}
[data-screen="progress"] .w-empty p{font-size:14px;font-weight:600;color:var(--muted);max-width:26ch}
[data-screen="progress"] .wcard > .empty{padding:20px 12px}
[data-screen="progress"] .goalbar{display:grid;gap:8px;padding-top:12px;border-top:1px solid var(--sep)}
[data-screen="progress"] .goalbar .bar{height:10px}
[data-screen="progress"] .goalbar .ends{display:flex;justify-content:space-between;font-size:12px;font-weight:700;color:var(--muted)}
[data-screen="progress"] .goalbar .ends b{color:var(--brand-ink)}
[data-screen="progress"] .eta{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--muted)}

[data-screen="progress"] .logrow{margin-top:10px}
[data-screen="progress"] .logrow .cell{min-height:64px;gap:12px}
[data-screen="progress"] .logrow .cell-art{width:36px;height:36px}

/* ═════════════ Plitkalar ═════════════ */
[data-screen="progress"] .tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
[data-screen="progress"] .tile{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--e1);padding:14px 16px 16px;display:grid;gap:4px;align-content:start}
[data-screen="progress"] .tile-art{width:40px;height:40px;margin-bottom:6px}
[data-screen="progress"] .tile-v{font-size:28px;font-weight:700;line-height:1}
[data-screen="progress"] .tile-l{font-size:13px;font-weight:700;color:var(--muted)}
[data-screen="progress"] .tile-s{font-size:12px;font-weight:700;color:var(--brand-ink)}

/* ═════════════ Bu hafta ═════════════ */
[data-screen="progress"] .week-card{padding:18px 16px 16px}
[data-screen="progress"] .bars{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;align-items:end;height:128px;position:relative;margin-top:6px}
[data-screen="progress"] .b-col{height:100%;display:flex;align-items:flex-end;justify-content:center;border-radius:var(--r-xs);min-width:0}
[data-screen="progress"] .b-col:active:not(:disabled){transform:none;background:var(--surface-2)}
[data-screen="progress"] .b-col:disabled{cursor:default}
[data-screen="progress"] .b{width:100%;max-width:26px;border-radius:7px;background:var(--ok);transition:height .8s var(--ease)}
[data-screen="progress"] .b--near{background:var(--near)}
[data-screen="progress"] .b--off{background:var(--off)}
[data-screen="progress"] .b--today{background:var(--chart-empty);box-shadow:inset 0 0 0 1.5px var(--faint)}
[data-screen="progress"] .b--none{background:var(--chart-empty)}
[data-screen="progress"] .b--frozen{width:12px;height:12px!important;border-radius:50%;background:var(--faint);opacity:.6;margin-bottom:2px}
[data-screen="progress"] .tline{position:absolute;left:-4px;right:-4px;border-top:1.5px dashed var(--chart-goal);opacity:.6;pointer-events:none;z-index:1}
[data-screen="progress"] .tline span{position:absolute;right:0;top:-18px;font-size:10px;font-weight:800;color:var(--muted);background:var(--surface);padding:0 2px}
[data-screen="progress"] .bars-l{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-top:8px;text-align:center;font-size:11px;font-weight:700;color:var(--muted)}
[data-screen="progress"] .bars-l .now{color:var(--fg)}
[data-screen="progress"] .legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:14px;font-size:12px;font-weight:700;color:var(--muted)}
[data-screen="progress"] .legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
[data-screen="progress"] .lg-ok{background:var(--ok)} [data-screen="progress"] .lg-near{background:var(--near)} [data-screen="progress"] .lg-off{background:var(--off)}
[data-screen="progress"] .sum{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--sep)}
[data-screen="progress"] .sum-n{display:grid;gap:2px}
[data-screen="progress"] .sum-n b{font-size:22px;font-weight:700;line-height:1.1}
[data-screen="progress"] .sum-n b small{font-size:14px;color:var(--muted)}
[data-screen="progress"] .sum-n span{font-size:12px;font-weight:700;color:var(--muted)}
[data-screen="progress"] .sum-p{margin-top:12px;font-size:14px;font-weight:700;color:var(--fg);line-height:1.4}
[data-screen="progress"] .week-card > .empty{padding:18px 10px}

/* ═════════════ Uyqu tartibi ═════════════ */
/* 7 tun: rejada — brend doira + ✓, farqli — sariq doira (qizil emas), javobsiz — bo'sh halqa. Shakl ham farq qiladi (rang yolg'iz emas). */
[data-screen="progress"] .slp-card{padding:16px;display:grid;gap:14px}
[data-screen="progress"] .slp-head{display:flex;align-items:center;gap:14px}
[data-screen="progress"] .slp-art{flex:none;width:40px;height:40px}
[data-screen="progress"] .slp-sum{display:grid;gap:4px;min-width:0}
[data-screen="progress"] .slp-n{display:flex;align-items:baseline;gap:8px}
[data-screen="progress"] .slp-n b{font-size:22px;font-weight:700;line-height:1.1}
[data-screen="progress"] .slp-n b small{font-size:14px;color:var(--muted)}
[data-screen="progress"] .slp-n span{font-size:14px;font-weight:700;color:var(--fg)}
[data-screen="progress"] .slp-w{font-size:13px;font-weight:700;color:var(--muted)}
[data-screen="progress"] .slp-days{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;list-style:none;margin:0;padding:12px 0 0;border-top:1px solid var(--sep)}
[data-screen="progress"] .slp-d{display:grid;justify-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--muted)}
[data-screen="progress"] .slp-d i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--chart-empty);box-shadow:inset 0 0 0 1.5px var(--edge-strong)}
[data-screen="progress"] .slp-d i svg.i{width:13px;height:13px;stroke-width:3}
[data-screen="progress"] .slp-d--ok i{background:var(--brand);color:var(--on-brand);box-shadow:none}
[data-screen="progress"] .slp-d--no i{background:var(--near);box-shadow:none}
[data-screen="progress"] .slp-d.is-today span{color:var(--fg)}

/* ═════════════ Yutuqlar ═════════════ */
[data-screen="progress"] .achv{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
[data-screen="progress"] .ach{background:var(--surface);border-radius:var(--r-md);box-shadow:var(--e1);padding:12px 8px;display:grid;justify-items:center;gap:0}
[data-screen="progress"] .ach-art{position:relative;width:44px;height:44px;margin-bottom:6px}
[data-screen="progress"] .ach b{font-size:20px;line-height:1}
[data-screen="progress"] .ach span{font-size:12px;font-weight:700;color:var(--muted)}
[data-screen="progress"] .ach:not(.is-on){background:transparent;box-shadow:inset 0 0 0 1px var(--edge-strong)}
[data-screen="progress"] .ach:not(.is-on) .ach-art svg{filter:grayscale(1);opacity:.35}
[data-screen="progress"] .ach:not(.is-on) b{color:var(--muted)}
[data-screen="progress"] .ach-lock{position:absolute;right:-4px;bottom:-2px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  background:var(--surface);color:var(--muted);box-shadow:var(--e1)}
[data-screen="progress"] .ach-lock svg.i.sm{width:12px;height:12px}

/* ═════════════ Vazn yozish (sheet) ═════════════ */
[data-overlay="weight"] .sheet{background:var(--surface-raised)}
[data-overlay="weight"] .wt-date{margin-bottom:6px}
[data-overlay="weight"] .wt-date button{min-height:44px}
[data-overlay="weight"] .wt{display:flex;align-items:center;justify-content:center;gap:14px;padding:22px 0 6px}
[data-overlay="weight"] .wt-btn{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;flex:none;background:var(--surface-2);
  box-shadow:inset 0 0 0 1px var(--edge);color:var(--fg);touch-action:none}
[data-overlay="weight"] .wt-btn svg.i{width:24px;height:24px;stroke-width:2.4}
[data-overlay="weight"] .wt-field{display:flex;align-items:baseline;gap:6px;min-width:0;padding:4px 8px;border-radius:var(--r-sm);cursor:text}
[data-overlay="weight"] .wt-field:focus-within{box-shadow:0 0 0 2px var(--focus)}
[data-overlay="weight"] .wt-in{width:4.4ch;min-width:2.4ch;max-width:5.4ch;border:0;background:none;padding:0;text-align:center;font-size:56px;font-weight:700;line-height:1.1;color:var(--fg);outline:none}
[data-overlay="weight"] .wt-unit{font-size:18px;font-weight:800;color:var(--muted)}
[data-overlay="weight"] .wt-note{min-height:20px;text-align:center;font-size:13px;font-weight:700;color:var(--muted);margin:4px 0 18px}
[data-overlay="weight"] .wt-note.is-err{color:var(--off-ink)}
[data-overlay="weight"] .wt-del{margin-top:6px;color:var(--off-ink)}
[data-overlay="weight"] .wt-goal{display:grid;justify-items:center;text-align:center;gap:6px;padding:8px 0 4px}
[data-overlay="weight"] .wt-goal-art{margin-bottom:6px}
[data-overlay="weight"] .wt-goal-t{font-size:26px;font-weight:800;letter-spacing:-.02em}
[data-overlay="weight"] .wt-goal-p{font-size:15px;font-weight:600;color:var(--muted);margin-bottom:14px}

@supports (corner-shape:squircle){
  [data-screen="progress"] .tile,[data-screen="progress"] .ach,[data-screen="progress"] .banner{corner-shape:squircle}
}
