/* v9 student daily UI. Everything is prefixed v9-. */
:root {
  --v9-red: #c0392b; --v9-red-bg: #f7e1dd; --v9-red-ink: #8a2a1f;
  --v9-orange: #b8620f; --v9-orange-bg: #fbe8d2; --v9-orange-ink: #7d4309;
  --v9-green: #26774a; --v9-green-bg: #dcefe3; --v9-green-ink: #1b5736;
  --v9-gold: #c9a227; --v9-gold-bg: #f6ebbd; --v9-gold-ink: #5e4a00;
}
.v9-eyebrow { font-size: 12px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); margin-bottom: 3px; }
.v9-skel { height: 120px; border-radius: var(--r-lg); background: var(--panel-2); margin-bottom: 16px; animation: pulse 1.4s ease-in-out infinite; }

/* colour markers: always a letter or a star, never colour alone */
.v9-dot { display: inline-grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 50%; font: 700 12px/1 var(--display); background: var(--panel-2); color: var(--muted); border: 1px solid var(--line); }
.v9-dot.big { width: 34px; height: 34px; font-size: 16px; }
.v9-dot.v9-c-red { background: var(--v9-red); color: #fff; border-color: var(--v9-red); }
.v9-dot.v9-c-orange { background: var(--v9-orange); color: #fff; border-color: var(--v9-orange); }
.v9-dot.v9-c-green { background: var(--v9-green); color: #fff; border-color: var(--v9-green); }
.v9-dot.v9-c-gold { background: var(--v9-gold); color: #3a2e00; border-color: var(--v9-gold); }
.v9-dot.v9-c-pending { background: transparent; border: 2px dashed var(--faint); color: var(--muted); }
.v9-dot.v9-c-rest, .v9-dot.v9-c-future { background: var(--panel-2); }

/* home */
.v9-home { display: grid; gap: 16px; margin-bottom: 16px; }
.v9-home .panel + .panel, .v9-card + .v9-card { margin-top: 0; }
.v9-card .panel-head h2 { font-size: 19px; }
.v9-pills { gap: 8px; }
.v9-targets { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.v9-target { background: var(--deep); border: 1px solid var(--line); border-radius: var(--r); padding: 12px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.v9-target b { font: 800 28px/1.1 var(--display); }
.v9-target span { font-size: 13px; color: var(--muted); }
.v9-target small { font-size: 12px; color: var(--faint); }
.v9-target .bar { margin-top: 6px; }
.v9-actions { margin-top: 16px; }
.v9-wknote { margin: 12px 0 0; }
.v9-striphead { margin: 18px 0 6px; }
.v9-strip { display: flex; gap: 3px; }
.v9-sq { flex: 1; min-width: 0; height: 28px; border-radius: 6px; display: grid; place-items: center; font: 700 11px/1 var(--display); background: var(--panel-2); color: var(--muted); border: 1px solid var(--line); }
.v9-sq.v9-c-red { background: var(--v9-red-bg); color: var(--v9-red-ink); border-color: var(--v9-red); }
.v9-sq.v9-c-orange { background: var(--v9-orange-bg); color: var(--v9-orange-ink); border-color: var(--v9-orange); }
.v9-sq.v9-c-green { background: var(--v9-green-bg); color: var(--v9-green-ink); border-color: var(--v9-green); }
.v9-sq.v9-c-gold { background: var(--v9-gold-bg); color: var(--v9-gold-ink); border-color: var(--v9-gold); }
.v9-sq.v9-c-pending { background: transparent; border-style: dashed; }
.v9-sq.v9-c-future { opacity: .45; }
.v9-spbar b { font: 800 16px var(--display); }
.v9-next { margin: 10px 0 0; }
.v9-next a { text-decoration: none; }
.v9-next a:hover { text-decoration: underline; }
.v9-bar { height: 8px; }
.v9-profit.is-done { border-color: var(--v9-green); }
.v9-profit.is-done .v9-bar i { background: var(--v9-green); }
.v9-profit .v9-bar i { background: var(--grad); }
.v9-money { font-size: 15px; margin-bottom: 10px; }
.v9-money b { font: 800 28px/1.1 var(--display); }
.v9-remain { margin: 8px 0 0; }
.v9-coach { margin: 12px 0 0; }
.v9-reasons { margin: 6px 0 0; padding-left: 18px; font-size: 13px; color: var(--muted); }
.v9-tierrow { margin-top: 14px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.v9-tier { display: inline-flex; align-items: center; gap: 5px; font-weight: 650; color: var(--v9-gold-ink); background: var(--v9-gold-bg); border-color: var(--v9-gold); }
.v9-tier svg { width: 14px; height: 14px; }
.v9-modal h2 { font-size: 22px; }
@media (min-width: 1000px) { .v9-home { grid-template-columns: 1.35fr 1fr; } .v9-home .v9-sprintcard { grid-column: 1 / -1; } }
@media (max-width: 520px) { .v9-target b { font-size: 24px; } .v9-card { padding: 16px; } }

/* form */
.v9-form { margin-top: 12px; }
.v9-preview { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: var(--r); border: 1px solid var(--line); background: var(--deep); margin-bottom: 16px; }
.v9-pv-red { background: var(--v9-red-bg); border-color: var(--v9-red); color: var(--v9-red-ink); }
.v9-pv-orange { background: var(--v9-orange-bg); border-color: var(--v9-orange); color: var(--v9-orange-ink); }
.v9-pv-green { background: var(--v9-green-bg); border-color: var(--v9-green); color: var(--v9-green-ink); }
.v9-pv-gold { background: var(--v9-gold-bg); border-color: var(--v9-gold); color: var(--v9-gold-ink); }
.v9-preview .muted { color: inherit; opacity: .85; }
.v9-fields { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 12px; }
.v9-fld input { min-height: 44px; }
.v9-fld > span { min-height: 2.6em; }
.v9-tg { font-style: normal; color: var(--faint); font-size: 12px; }
.v9-form textarea { min-height: 76px; }
.v9-formfoot { margin-top: 4px; }
.v9-form .btn.primary { min-height: 44px; }
.v9-mini-t { color: var(--muted); display: flex; gap: 6px; flex-wrap: wrap; margin: -4px 0 8px; }
.v9-mini-t span { font-weight: 600; }
.v9-lock { display: flex; gap: 8px; align-items: flex-start; margin: 14px 0 0; }
.v9-lock svg { width: 16px; height: 16px; flex: none; margin-top: 2px; }
.v9-ro { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin: 12px 0; }
.v9-ro div { background: var(--deep); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 8px 10px; }
.v9-ro dt { font-size: 12px; color: var(--muted); }
.v9-ro dd { margin: 0; font: 800 18px var(--display); }

/* daily layout */
.v9-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 16px; }
@media (max-width: 700px) { .v9-stats { grid-template-columns: repeat(2, 1fr); } }
.v9-dgrid { display: grid; gap: 16px; grid-template-columns: 1fr; align-items: start; }
.v9-dgrid .panel + .panel { margin-top: 0; }
@media (min-width: 900px) {
  .v9-dgrid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); grid-template-areas: "cal form" "weeks form"; }
  .v9-calpanel { grid-area: cal; } .v9-weeks { grid-area: weeks; }
  .v9-formpanel { grid-area: form; position: sticky; top: 16px; }
}

/* calendar */
.v9-calhead { flex-wrap: wrap; }
.v9-msw { gap: 6px; flex-wrap: nowrap; }
.v9-msw .btn { min-height: 40px; min-width: 40px; }
.v9-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; }
.v9-wd { text-align: center; font-size: 12px; font-weight: 600; color: var(--muted); padding-bottom: 2px; }
.v9-cell { position: relative; min-height: 62px; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--panel); padding: 5px 4px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 2px; cursor: pointer; }
.v9-cell.blank { border: 0; background: none; cursor: default; }
.v9-cell .n { font-size: 12px; font-weight: 650; color: var(--muted); align-self: flex-start; padding-left: 2px; line-height: 1; }
.v9-cell .tiny { font-size: 10px; color: var(--muted); line-height: 1; min-height: 10px; }
.v9-cell .v9-dot { width: 24px; height: 24px; }
.v9-cell.v9-c-red { background: var(--v9-red-bg); border-color: #e3b3ab; }
.v9-cell.v9-c-orange { background: var(--v9-orange-bg); border-color: #ebc79d; }
.v9-cell.v9-c-green { background: var(--v9-green-bg); border-color: #a9d4b9; }
.v9-cell.v9-c-gold { background: var(--v9-gold-bg); border-color: #dfc765; }
.v9-cell.v9-c-rest { background: var(--panel-2); }
.v9-cell.v9-c-pending { background: var(--panel); border: 2px dashed var(--faint); }
.v9-cell.v9-c-future { background: var(--panel); opacity: .45; cursor: default; }
.v9-cell.today .n { color: var(--text); text-decoration: underline; }
.v9-cell.sel { outline: 2px solid var(--text); outline-offset: 1px; }
.v9-cell:not(:disabled):not(.blank):hover { border-color: var(--text); }
@media (max-width: 520px) { .v9-cal { gap: 3px; } .v9-cell { min-height: 56px; padding: 4px 2px; } .v9-cell .tiny { font-size: 9px; } .v9-cell .v9-dot { width: 22px; height: 22px; } }

.v9-legend { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.v9-legend h3 { margin-bottom: 10px; }
.v9-legend ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.v9-legend li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; }
.v9-legend li .v9-dot { margin-top: 1px; }

/* week summary */
.v9-thisweek { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 14px; }
.v9-wc { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.v9-chipc { font: 700 11px/1 var(--display); padding: 4px 6px; border-radius: 6px; border: 1px solid var(--line); }
.v9-chipc.v9-c-red { background: var(--v9-red-bg); color: var(--v9-red-ink); }
.v9-chipc.v9-c-orange { background: var(--v9-orange-bg); color: var(--v9-orange-ink); }
.v9-chipc.v9-c-green { background: var(--v9-green-bg); color: var(--v9-green-ink); }
.v9-chipc.v9-c-gold { background: var(--v9-gold-bg); color: var(--v9-gold-ink); }
.v9-wt tr.cur td { background: var(--panel-2); font-weight: 600; }
.v9-wt tr:hover td { cursor: default; }
.v9-wt td, .v9-wt th { white-space: nowrap; }

/* sprint */
.v9-goalbar { display: grid; gap: 14px; }
.v9-goaltxt h2 { font-size: clamp(20px, 2.6vw, 26px); max-width: 30ch; }
.v9-goalmeta { display: flex; gap: 16px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.v9-goalmeta > div { display: flex; flex-direction: column; gap: 2px; }
.v9-goalmeta b { font: 800 18px var(--display); }
.v9-weekgrid { margin-top: 16px; align-items: stretch; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 860px) { .v9-weekgrid { grid-template-columns: 1fr; } }
.v9-weekgrid .panel + .panel { margin-top: 0; }
.v9-week .chip svg { width: 13px; height: 13px; }
.v9-wgoal { margin: -6px 0 12px; }
.v9-week.locked { background: var(--deep); }
.v9-week.locked .v9-items { opacity: .55; }
.v9-unlock { display: flex; gap: 8px; align-items: flex-start; margin: 12px 0 0; color: var(--muted); }
.v9-unlock svg { width: 16px; height: 16px; flex: none; margin-top: 2px; }
.v9-items { margin-top: 10px; }
.v9-item { align-items: center; }
.v9-item .check:disabled { cursor: default; }
.v9-itbody { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.v9-go { margin-left: auto; flex: none; min-height: 36px; }
@media (max-width: 520px) { .v9-item { flex-wrap: wrap; } .v9-go { margin-left: 34px; } }

.v9-today .panel-head, .v9-sprintcard .panel-head { flex-wrap: wrap; }
.v9-pills .chip, .v9-wc { white-space: nowrap; }
.v9-wc { flex-wrap: nowrap; }
.v9-formpanel, .v9-formpanel * { min-width: 0; }
.v9-formpanel { max-width: 100%; }
.v9-form input, .v9-form select, .v9-form textarea { max-width: 100%; }
.v9-dgrid { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .v9-dgrid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); } }
.v9-weeks, .v9-dgrid > * { min-width: 0; }
.scroll-x { overflow-x: auto; max-width: 100%; }
.v9-wt th, .v9-wt td { padding-left: 6px; padding-right: 6px; white-space: nowrap; }
/* checklist-first daily form */
.v9-q{margin:4px 0 8px}.v9-checks{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.v9-chk{position:relative;cursor:pointer}.v9-chk input{position:absolute;opacity:0;inset:0;cursor:pointer}
.v9-chk span{display:flex;align-items:center;gap:10px;padding:14px;border:2px solid var(--line);border-radius:14px;font-weight:600;min-height:56px}
.v9-chk svg{width:20px;height:20px}
.v9-chk input:checked+span{border-color:#5865f2;background:#5865f21a}
.v9-chk input:focus-visible+span{outline:2px solid #5865f2;outline-offset:2px}
.v9-sec{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}.v9-sec[hidden]{display:none}.v9-sec h4{margin:0 0 8px;font-size:15px}
.v9-form .v9-fld > span{min-height:0;margin-bottom:4px;display:block}.v9-form .v9-fld{margin-bottom:10px}
.v9f-check .modal{max-height:92vh;overflow:auto}.v9f-check .v9-preview{display:none}
