:root {
  --brand-soft:#DFF1E7;
  --action-primary:#287451;
  --action-hover:#216344;
  --action-active:#194E35;
  --on-primary:#FFF;
  --page:#F7F9F7;
  --surface:#FFF;
  --subtle:#F0F4F1;
  --text:#202923;
  --secondary:#5C6B62;
  --border:#DDE5DF;
  --control:#7D8C83;
  --focus:#287451;
  --success:#216E46;
  --success-surface:#E8F5EC;
  --error:#B33A3A;
  --error-surface:#FCEDED;
  --disabled:#E8EDE9;
  --radius:12px}

* {
  box-sizing:border-box}
body {
  margin:0;
  background:var(--page);
  color:var(--text);
  font-family:Tahoma,"Segoe UI",Arial,sans-serif;
  font-size:1rem;
  line-height:1.75}
a {
  color:var(--action-primary);
  overflow-wrap:anywhere}
a:focus-visible,button:focus-visible,input:focus-visible {
  outline:2px solid var(--focus);
  outline-offset:3px}
button:focus-visible,.button:focus-visible {
  box-shadow:0 0 0 2px var(--surface)}
.shell {
  max-width:1120px;
  margin-inline:auto;
  padding:16px}
header.shell {
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:16px;
  border-block-end:1px solid var(--border)}
.brand {
  font-size:1.5rem;
  font-weight:700;
  text-decoration:none}
nav,.actions {
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap}
nav a,.actions a,.panel>a,.panel p>a {
  display:inline-flex;
  align-items:center;
  min-height:44px}
nav form {
  margin:0}
.panel {
  max-width:560px;
  margin:24px auto;
  padding:24px;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:16px;
  box-shadow:0 2px 8px #2029230a}
h1 {
  font-size:1.5rem;
  line-height:1.5;
  margin-block:0 16px}
h2 {
  font-size:1.25rem}
bdi {
  overflow-wrap:anywhere}
.muted,.help {
  color:var(--secondary)}
.help {
  font-size:.875rem}
.field {
  margin-block:20px}
.field label {
  display:block;
  margin-block-end:8px;
  font-weight:600}
input:not([type=hidden]):not([type=checkbox]) {
  display:block;
  width:100%;
  min-height:48px;
  border:1px solid var(--control);
  border-radius:var(--radius);
  padding:10px 12px;
  font:inherit;
  background:var(--surface);
  color:var(--text)}
input[type=checkbox] {
  width:24px;
  height:24px;
  vertical-align:middle}
input[type=file] {
  overflow-wrap:anywhere}
input[aria-invalid=true] {
  border-color:var(--error)}
button,.button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  min-height:48px;
  padding:10px 20px;
  border:1px solid var(--action-primary);
  border-radius:var(--radius);
  font:inherit;
  font-weight:600;
  cursor:pointer;
  background:var(--action-primary);
  color:var(--on-primary);
  text-decoration:none}
button:hover,.button:hover {
  background:var(--action-hover)}
button:active,.button:active {
  background:var(--action-active)}
button:disabled {
  background:var(--disabled);
  color:var(--secondary);
  cursor:default;
  border-color:var(--control)}
button.secondary {
  background:var(--surface);
  color:var(--action-primary);
  border-color:var(--control)}
button.secondary:hover {
  background:var(--subtle)}
button.secondary:active {
  background:var(--brand-soft)}
.errors {
  color:var(--error)}
.errors:not(:empty) {
  background:var(--error-surface);
  padding:8px 12px;
  border-radius:8px}
.errors p {
  margin:0}
.success {
  color:var(--success);
  background:var(--success-surface);
  padding:12px}
.avatar {
  object-fit:cover;
  border-radius:50%;
  max-width:100%}
.skip {
  position:absolute;
  inset-block-start:-100px;
  padding:12px;
  background:var(--surface);
  z-index:1}
.skip:focus {
  inset-block-start:0}
ul {
  padding-inline-start:24px}
@media(min-width:640px) {
  .shell {
  padding:24px}
.panel {
  margin-block:32px}
}
@media(max-width:380px) {
  .panel {
  padding:16px}
}
.preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-block:24px}
.preset-grid form,.preset-grid button{width:100%;margin:0}
.subject-list{list-style:none;padding:0}
.subject-list li{padding-block:16px;border-block-end:1px solid var(--border)}
.subject-list .actions{margin-block-start:8px}
.subject-list form{margin:0}
.archived{margin-block-start:32px;color:var(--secondary)}
button.danger{background:var(--error);border-color:var(--error)}
button.danger:hover,button.danger:active{background:#922d2d}

/* Focused timer */
.timer-shell{max-width:40rem;margin:2rem auto;padding:1.25rem;text-align:center}
.timer-shell h1{font-size:clamp(1.4rem,5vw,2rem)}
.timer-state{color:var(--color-muted,#52625a);margin-top:2rem}
.timer-clock{display:block;font-variant-numeric:tabular-nums;direction:ltr;font-size:clamp(3rem,14vw,6rem);font-weight:700;line-height:1.4;margin:1rem auto 2rem}
.timer-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-bottom:2rem}
.timer-actions button{min-height:44px}
@media(max-width:420px){.timer-actions,.timer-actions form,.timer-actions button{width:100%}}

/* Phase 6 private progress pages */
.progress-shell{max-width:720px;margin:24px auto;padding:0 16px 32px}
.progress-shell section{margin-block:24px}
.study-lead{padding:24px;background:var(--surface);border:1px solid var(--border);border-radius:16px}
.study-lead-value{font-size:clamp(2.25rem,9vw,4rem);font-weight:700;line-height:1.4;margin:4px 0 20px}
.start-button{width:100%;max-width:340px}
.summary-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0}
.summary-list>div{padding:12px;border-block-start:1px solid var(--border)}
.summary-list dt{color:var(--secondary)}.summary-list dd{margin:0;font-weight:700}
.progress-track,.day-bar{display:block;background:var(--subtle);border:1px solid var(--control);border-radius:999px;overflow:hidden}
.progress-track{height:14px}.progress-track span,.day-bar span{display:block;height:100%;background:var(--action-primary)}
.seven-days,.history-list,.subject-stats{list-style:none;padding:0;margin:0}
.seven-days li{display:grid;grid-template-columns:minmax(125px,1fr) minmax(50px,2fr) minmax(85px,1fr);align-items:center;gap:10px;padding:8px 0;border-block-end:1px solid var(--border)}
.seven-days small{display:block;color:var(--secondary)}.day-bar{height:14px}.seven-days strong{text-align:end}
.period-tabs,.progress-links,.pagination{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-block:16px}
.period-tabs a,.pagination a{display:inline-flex;align-items:center;min-height:44px;padding:4px 10px}
.period-tabs [aria-current=page]{font-weight:700;border-block-end:2px solid var(--action-primary)}
.subject-stats li,.history-list li{padding:16px 0;border-block-end:1px solid var(--border)}
.subject-stats li{display:flex;justify-content:space-between;gap:12px}.history-list time{display:block;color:var(--secondary)}
@media(max-width:420px){.seven-days li{grid-template-columns:1fr 1fr}.seven-days .day-bar{grid-column:1/-1;grid-row:2}.seven-days strong{text-align:end}}