/* ============================================================
   Research Hub — stationery palette
   ============================================================ */
:root {
  --cream:        #faf6ef;
  --paper:        #f5f0e6;
  --parchment:    #ede5d4;
  --tan:          #c8b89a;
  --tan-dark:     #a89070;
  --brown-light:  #9a7e62;
  --brown:        #7a5c3c;
  --brown-dark:   #5a3e28;
  --ink:          #3d2e1e;
  --sage:         #5e8a5e;
  --sage-light:   #d8ead8;
  --rust:         #b86040;
  --gold:         #c8a030;
  --focus-ring:   rgba(122,92,60,.2);
}

/* ── Light Blue ── */
[data-theme="light-blue"] {
  --cream:       #edf2f8;
  --paper:       #e2eaf5;
  --parchment:   #cfdaee;
  --tan:         #a0b8d8;
  --tan-dark:    #7090b8;
  --brown-light: #4868a0;
  --brown:       #2a5090;
  --brown-dark:  #183870;
  --ink:         #0c2050;
  --sage:        #286a50;
  --sage-light:  #b8d8cc;
  --rust:        #a04038;
  --gold:        #786c1a;
  --focus-ring:  rgba(42,80,144,.2);
}

/* ── Dark Blue ── */
[data-theme="dark-blue"] {
  color-scheme: dark;
  --cream:       #0c1827;
  --paper:       #112234;
  --parchment:   #192e46;
  --tan:         #2c4460;
  --tan-dark:    #3a587a;
  --brown-light: #6890b8;
  --brown:       #3670b0;
  --brown-dark:  #90b8dc;
  --ink:         #c8ddf0;
  --sage:        #3a8a64;
  --sage-light:  #0c2e20;
  --rust:        #c07060;
  --gold:        #c0a030;
  --focus-ring:  rgba(54,112,176,.3);
}

/* ── Light Red ── */
[data-theme="light-red"] {
  --cream:       #fdf0ee;
  --paper:       #f8e5e2;
  --parchment:   #f2d8d4;
  --tan:         #dca89a;
  --tan-dark:    #c07868;
  --brown-light: #984840;
  --brown:       #7a2820;
  --brown-dark:  #5a1810;
  --ink:         #380c0a;
  --sage:        #3a7a50;
  --sage-light:  #c0d8c8;
  --rust:        #a03020;
  --gold:        #8a7020;
  --focus-ring:  rgba(122,40,32,.2);
}

/* ── Dark Red ── */
[data-theme="dark-red"] {
  color-scheme: dark;
  --cream:       #160c0a;
  --paper:       #221210;
  --parchment:   #301a18;
  --tan:         #502828;
  --tan-dark:    #683838;
  --brown-light: #a86860;
  --brown:       #c05048;
  --brown-dark:  #e08878;
  --ink:         #f0d0c8;
  --sage:        #3a8a5c;
  --sage-light:  #102c1c;
  --rust:        #d07060;
  --gold:        #c0a030;
  --focus-ring:  rgba(192,80,72,.3);
}

/* ── Light Green ── */
[data-theme="light-green"] {
  --cream:       #eff7ee;
  --paper:       #e2f0e0;
  --parchment:   #d0e8cc;
  --tan:         #90c890;
  --tan-dark:    #60a860;
  --brown-light: #347834;
  --brown:       #186018;
  --brown-dark:  #0c480c;
  --ink:         #063006;
  --sage:        #286858;
  --sage-light:  #b8d8cc;
  --rust:        #8a4a20;
  --gold:        #7a7018;
  --focus-ring:  rgba(24,96,24,.2);
}

/* ── Dark Green ── */
[data-theme="dark-green"] {
  color-scheme: dark;
  --cream:       #091409;
  --paper:       #0f1e0f;
  --parchment:   #162816;
  --tan:         #284228;
  --tan-dark:    #365836;
  --brown-light: #58985a;
  --brown:       #409840;
  --brown-dark:  #80c880;
  --ink:         #c0e8c0;
  --sage:        #3a8870;
  --sage-light:  #0c2c20;
  --rust:        #c08040;
  --gold:        #b8a028;
  --focus-ring:  rgba(64,152,64,.3);
}

/* ── Light Purple ── */
[data-theme="light-purple"] {
  --cream:       #f5f0fc;
  --paper:       #ece4f8;
  --parchment:   #e0d4f4;
  --tan:         #b8a0e0;
  --tan-dark:    #9070c8;
  --brown-light: #6840b0;
  --brown:       #5020a0;
  --brown-dark:  #380c80;
  --ink:         #200848;
  --sage:        #347860;
  --sage-light:  #c0d8d0;
  --rust:        #9a3878;
  --gold:        #806e18;
  --focus-ring:  rgba(80,32,160,.2);
}

/* ── Dark Purple ── */
[data-theme="dark-purple"] {
  color-scheme: dark;
  --cream:       #0e0818;
  --paper:       #180e28;
  --parchment:   #201638;
  --tan:         #382858;
  --tan-dark:    #4a3870;
  --brown-light: #8868c0;
  --brown:       #7848b8;
  --brown-dark:  #b090e0;
  --ink:         #e0d0f8;
  --sage:        #3a8a6c;
  --sage-light:  #0e2c28;
  --rust:        #c07088;
  --gold:        #c0a028;
  --focus-ring:  rgba(120,72,184,.3);
}

/* ── OSU — Scarlet & Gray ── */
[data-theme="osu"] {
  --cream:       #f8f4f4;
  --paper:       #f2ecec;
  --parchment:   #e8e0e0;
  --tan:         #c4a8a8;
  --tan-dark:    #a08080;
  --brown-light: #4A4F55;
  --brown:       #BA0C2F;
  --brown-dark:  #880820;
  --ink:         #1a1212;
  --sage:        #3a7848;
  --sage-light:  #c0d8c4;
  --rust:        #a03828;
  --gold:        #c09028;
  --focus-ring:  rgba(186,12,47,.2);
  --nav-bg:      #BA0C2F;
  --nav-fg:      #4A4F55;
  --nav-border:  rgba(0,0,0,.25);
}

/* ── Michigan — Blue & Maize ── */
[data-theme="michigan"] {
  --cream:       #f0f3fa;
  --paper:       #e5eaf5;
  --parchment:   #d4dcf0;
  --tan:         #9db0d8;
  --tan-dark:    #6888c0;
  --brown-light: #3a5a90;
  --brown:       #00274C;
  --brown-dark:  #001838;
  --ink:         #000c1e;
  --sage:        #287850;
  --sage-light:  #b8d8c8;
  --rust:        #b84820;
  --gold:        #FFCB05;
  --focus-ring:  rgba(0,39,76,.2);
  --nav-bg:      #00274C;
  --nav-fg:      #FFCB05;
  --nav-border:  rgba(0,0,0,.3);
}

/* ── Harvard — Crimson ── */
[data-theme="harvard"] {
  --cream:       #fdf4f2;
  --paper:       #f8ecea;
  --parchment:   #f0d8d4;
  --tan:         #d0a898;
  --tan-dark:    #b08070;
  --brown-light: #8a5048;
  --brown:       #A51C30;
  --brown-dark:  #780e20;
  --ink:         #1e0808;
  --sage:        #3a7848;
  --sage-light:  #c0d8c4;
  --rust:        #c05828;
  --gold:        #b89020;
  --focus-ring:  rgba(165,28,48,.2);
  --nav-bg:      #A51C30;
  --nav-fg:      #1e0808;
  --nav-border:  rgba(0,0,0,.25);
}

/* ── FSU — Garnet & Gold ── */
[data-theme="fsu"] {
  --cream:       #faf6f0;
  --paper:       #f5efe6;
  --parchment:   #ede2d0;
  --tan:         #cfc0a0;
  --tan-dark:    #b09870;
  --brown-light: #8a6858;
  --brown:       #782F40;
  --brown-dark:  #5a1e2e;
  --ink:         #280e14;
  --sage:        #3a7848;
  --sage-light:  #c0d8c4;
  --rust:        #a04828;
  --gold:        #CEB888;
  --focus-ring:  rgba(120,47,64,.2);
  --nav-bg:      #782F40;
  --nav-fg:      #280e14;
  --nav-border:  rgba(0,0,0,.25);
}

/* ── Caltech — Orange ── */
[data-theme="caltech"] {
  --cream:       #fff9f4;
  --paper:       #fff2e4;
  --parchment:   #ffe5c8;
  --tan:         #e8b878;
  --tan-dark:    #c89050;
  --brown-light: #a06830;
  --brown:       #c84c08;
  --brown-dark:  #8c3008;
  --ink:         #201008;
  --sage:        #3a7848;
  --sage-light:  #c0d8c4;
  --rust:        #d06020;
  --gold:        #e09820;
  --focus-ring:  rgba(200,76,8,.2);
  --nav-bg:      #FF6C0C;
  --nav-fg:      #201008;
  --nav-border:  rgba(0,0,0,.2);
}

[data-theme="middlebury"] {
  --cream:       #f2f7fb;
  --paper:       #deeaf6;
  --parchment:   #bfd4ec;
  --tan:         #88b4d8;
  --tan-dark:    #4878a8;
  --brown-light: #1a5888;
  --brown:       #0D395F;
  --brown-dark:  #082840;
  --ink:         #040f1e;
  --sage:        #2a6878;
  --sage-light:  #5898a8;
  --rust:        #c04828;
  --gold:        #c09818;
  --focus-ring:  rgba(13,57,95,.3);
  --nav-bg:      #0D395F;
  --nav-fg:      #040f1e;
  --nav-border:  rgba(0,0,0,.3);
}

/* ── Purdue — Old Gold & Black ── */
[data-theme="purdue"] {
  --cream:       #faf8f0;
  --paper:       #f5f0e2;
  --parchment:   #ece0c0;
  --tan:         #CFB991;
  --tan-dark:    #b09060;
  --brown-light: #705028;
  --brown:       #1a1000;
  --brown-dark:  #000000;
  --ink:         #0a0800;
  --sage:        #3a7848;
  --sage-light:  #c0d8c4;
  --rust:        #a04828;
  --gold:        #CFB991;
  --focus-ring:  rgba(0,0,0,.2);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background: var(--cream);
  color: var(--ink);
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
  font-size: 15px;
  line-height: 1.6;
  min-height: 100vh;
}

a { color: var(--brown); }
a:hover { color: var(--brown-dark); }

/* ── Nav ── */
.nav {
  background: var(--nav-bg, var(--parchment));
  border-bottom: 1px solid var(--nav-border, var(--tan));
  position: sticky; top: 0; z-index: 100;
}
.nav-inner {
  max-width: 1200px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  height: 52px; padding: 0 24px;
}
.nav-brand {
  font-size: 1.05rem; font-weight: 800; letter-spacing: .01em;
  color: var(--nav-fg, var(--brown-dark)); text-decoration: none;
}
.nav-links { display: flex; gap: 4px; align-items: center; }
.nav-links a {
  padding: 5px 10px; border-radius: 5px;
  text-decoration: none; color: var(--nav-fg, var(--brown));
  font-size: .875rem; font-weight: 500;
  transition: background .12s;
}
.nav-links a:hover, .nav-links a.active { background: rgba(0,0,0,.12); color: var(--nav-fg, var(--brown-dark)); }
.nav-logout { opacity: .6; font-size: .8rem !important; }
.nav-logout:hover { opacity: 1 !important; }

/* ── Container ── */
.container { max-width: 1200px; margin: 0 auto; padding: 28px 24px 80px; }

/* ── Headings ── */
.page-heading { margin-bottom: 24px; }
.page-heading h1 { font-size: 1.5rem; color: var(--brown-dark); font-weight: 800; }
.page-heading .subtitle { color: var(--brown-light); font-size: .9rem; margin-top: 3px; }

.section-heading {
  font-size: 1rem; font-weight: 700; color: var(--brown-dark);
  margin: 28px 0 12px; padding-bottom: 7px;
  border-bottom: 2px solid var(--tan);
  display: flex; align-items: center; gap: 10px;
}

/* ── Cards ── */
.card {
  background: var(--paper);
  border: 1px solid var(--tan);
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 14px;
}
.card-title {
  font-size: .95rem; font-weight: 700; color: var(--brown-dark);
  margin-bottom: 14px; padding-bottom: 10px;
  border-bottom: 1px solid var(--tan);
}

/* ── Project grid ── */
.project-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
  gap: 14px;
}

.project-card {
  background: var(--paper);
  border: 1px solid var(--tan);
  border-radius: 8px;
  padding: 16px 18px;
  display: flex; flex-direction: column;
}
.project-card-header {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 8px;
  margin-bottom: 6px;
}
.project-card-title {
  font-size: .95rem; font-weight: 700;
  color: var(--brown-dark); text-decoration: none; flex: 1;
}
.project-card-title:hover { color: var(--brown); }
.project-card-desc {
  font-size: .8rem; color: var(--brown-light);
  margin-bottom: 10px; line-height: 1.4;
}
.project-card-footer {
  display: flex; align-items: center; gap: 6px;
  flex-wrap: wrap; margin-top: 10px;
  padding-top: 10px; border-top: 1px solid var(--parchment);
}

.status-badge {
  display: inline-block; padding: 2px 9px;
  border-radius: 20px; font-size: .72rem; font-weight: 600;
  background: var(--parchment); color: var(--brown);
  border: 1px solid var(--tan); white-space: nowrap;
}
.status-badge.is-published { background: #f5f0d0; border-color: var(--gold); color: #7a6000; }
.status-badge.is-backburner { background: #f0e8e0; border-color: var(--tan-dark); color: var(--brown-light); }

/* ── Buttons ── */
.btn {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 7px 15px; border-radius: 5px;
  border: 1px solid transparent; font-size: .875rem;
  font-weight: 500; cursor: pointer; text-decoration: none;
  transition: background .12s, border-color .12s;
  line-height: 1.4; white-space: nowrap; font-family: inherit;
}
.btn-primary   { background: var(--brown);     color: #fff; border-color: var(--brown); }
.btn-primary:hover { background: var(--brown-dark); }
.btn-secondary { background: var(--parchment); color: var(--brown-dark); border-color: var(--tan); }
.btn-secondary:hover { background: var(--tan); }
.btn-success   { background: var(--sage);  color: #fff; border-color: var(--sage); }
.btn-success:hover { background: #4a7a4a; }
.btn-danger    { background: #c53030; color: #fff; border-color: #c53030; }
.btn-danger:hover  { background: #9b2424; }
.btn-outline   { background: transparent; border-color: var(--tan); color: var(--brown); }
.btn-outline:hover { background: var(--parchment); }
.btn-ghost     { background: transparent; border-color: transparent; color: var(--brown-light); padding: 4px 8px; }
.btn-ghost:hover { color: var(--brown-dark); background: var(--parchment); }
.btn-sm  { padding: 4px 10px; font-size: .8rem; }
.btn-xs  { padding: 2px 7px;  font-size: .73rem; }

/* ── Forms ── */
.form-group { margin-bottom: 14px; }
.form-group label {
  display: block; font-size: .84rem; font-weight: 600;
  color: var(--brown-dark); margin-bottom: 4px;
}
.form-group input[type=text],
.form-group input[type=email],
.form-group input[type=password],
.form-group input[type=date],
.form-group input[type=time],
.form-group input[type=url],
.form-group input[type=number],
.form-group select,
.form-group textarea {
  width: 100%; padding: 7px 10px;
  border: 1px solid var(--tan); border-radius: 5px;
  background: var(--cream); color: var(--ink);
  font-size: .9rem; font-family: inherit;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none; border-color: var(--brown-light);
  box-shadow: 0 0 0 3px var(--focus-ring);
}
.form-group .hint { font-size: .78rem; color: var(--brown-light); margin-top: 3px; }
.text-muted-label { font-weight: normal !important; color: var(--brown-light); }

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }

/* ── Alerts ── */
.alert {
  padding: 10px 14px; border-radius: 6px;
  margin-bottom: 16px; font-size: .88rem;
}
.alert-error   { background: #fff0f0; border: 1px solid #f8b4b4; color: #c53030; }
.alert-success { background: #f2fff2; border: 1px solid #a8dca8; color: #276749; }
.alert-info    { background: #f0f4ff; border: 1px solid #b4c8f8; color: #2b5282; }

/* ── Task list ── */
.task-list   { list-style: none; }
.subtask-list { list-style: none; margin-left: 26px; }

.task-item, .subtask-item {
  display: flex; align-items: flex-start; gap: 7px;
  padding: 5px 0;
  border-bottom: 1px solid var(--parchment);
}
.task-item:last-child, .subtask-item:last-child { border-bottom: none; }

.task-check {
  width: 16px; height: 16px; flex-shrink: 0; margin-top: 3px;
  border: 1.5px solid var(--tan-dark); border-radius: 3px;
  cursor: pointer; background: var(--cream);
  appearance: none; -webkit-appearance: none; position: relative;
  transition: background .1s, border-color .1s;
}
.task-check:checked {
  background: var(--sage); border-color: var(--sage);
}
.task-check:checked::after {
  content: ''; position: absolute; left: 4px; top: 1px;
  width: 5px; height: 9px;
  border: 2px solid #fff; border-top: none; border-left: none;
  transform: rotate(42deg);
}
.task-check:focus { outline: none; box-shadow: 0 0 0 3px var(--focus-ring); }

.task-body   { flex: 1; min-width: 0; }
.task-label  { font-size: .88rem; line-height: 1.45; cursor: default; }
.task-actions { display: flex; gap: 4px; opacity: 0; transition: opacity .12s; flex-shrink: 0; }
.task-item:hover .task-actions,
.subtask-item:hover .task-actions { opacity: 1; }

.task-item.is-complete > .task-body > .task-label,
.subtask-item.is-complete > .task-body > .task-label {
  text-decoration: line-through; color: var(--brown-light); opacity: .65;
}

/* Add-task inline form */
.add-task-row {
  display: flex; gap: 6px; margin-top: 8px;
  padding-top: 8px; border-top: 1px dashed var(--tan);
}
.add-task-row input {
  flex: 1; padding: 5px 8px;
  border: 1px solid var(--tan); border-radius: 4px;
  background: var(--cream); font-size: .85rem; font-family: inherit;
}
.add-task-row input:focus { outline: none; border-color: var(--brown-light); box-shadow: 0 0 0 2px var(--focus-ring); }

/* ── Utility ── */
.text-sm   { font-size: .85rem; }
.text-xs   { font-size: .76rem; }
.text-muted { color: var(--brown-light); }
.font-bold  { font-weight: 700; }
.mt-2  { margin-top: 8px; }
.mt-4  { margin-top: 16px; }
.mb-4  { margin-bottom: 16px; }
.gap-2 { gap: 8px; }
.flex  { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }

/* ── Weekly / Daily list items ── */
.week-project-section { margin-bottom: 18px; }
.week-project-title { font-size: .85rem; font-weight: 700; color: var(--brown-dark); margin-bottom: 6px; }

.schedule-item {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid var(--parchment);
}
.schedule-item:last-child { border-bottom: none; }
.schedule-time {
  font-size: .76rem; color: var(--brown-light);
  min-width: 58px; padding-top: 3px; font-variant-numeric: tabular-nums;
}
.schedule-label { flex: 1; font-size: .9rem; line-height: 1.4; }
.schedule-type-badge {
  font-size: .7rem; padding: 1px 7px; border-radius: 10px;
  background: var(--parchment); color: var(--brown-light);
  border: 1px solid var(--tan); white-space: nowrap; margin-top: 2px;
}
.schedule-item.is-complete .schedule-label { text-decoration: line-through; color: var(--brown-light); opacity: .6; }

/* ── Timeline ── */
.timeline-wrap { overflow-x: auto; }
.timeline-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.timeline-table th {
  background: var(--parchment); border: 1px solid var(--tan);
  padding: 6px 4px; text-align: center; font-weight: 700;
  color: var(--brown-dark); white-space: nowrap;
}
.timeline-table th.col-project { text-align: left; min-width: 160px; max-width: 200px; }
.timeline-table th.col-cur-month { background: var(--tan); }
.timeline-table td {
  border: 1px solid var(--tan); padding: 5px 4px;
  text-align: center; vertical-align: middle;
}
.timeline-table td.project-name-cell {
  text-align: left; font-weight: 600; color: var(--brown-dark);
  max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  padding-left: 8px;
}
.timeline-cell { border-radius: 3px; padding: 2px 4px; font-size: .72rem; font-weight: 600; }
.timeline-table td.col-cur-month { background: #faf6ef; }

/* ── Goals page ── */
.goal-row {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 0; border-bottom: 1px solid var(--parchment);
}
.goal-row:last-child { border-bottom: none; }
.goal-status-name { flex: 1; font-size: .9rem; font-weight: 600; color: var(--brown-dark); }
.goal-status-name.is-current { color: var(--sage); }
.goal-date-input { padding: 5px 8px; border: 1px solid var(--tan); border-radius: 4px; background: var(--cream); font-size: .85rem; font-family: inherit; }
.goal-date-input:focus { outline: none; border-color: var(--brown-light); }

/* ── Landing page ── */
.landing-hero {
  text-align: center; padding: 64px 24px 36px;
}
.landing-hero h1 {
  font-size: 2.4rem; color: var(--brown-dark);
  font-weight: 800; margin-bottom: 14px; line-height: 1.2;
}
.landing-hero .tagline {
  font-size: 1.1rem; color: var(--brown-light); max-width: 480px; margin: 0 auto 32px;
}
.auth-card {
  max-width: 420px; margin: 0 auto 56px;
  background: var(--paper); border: 1px solid var(--tan);
  border-radius: 10px; padding: 28px;
}
.auth-tabs {
  display: flex; margin-bottom: 20px;
  border-bottom: 2px solid var(--tan);
}
.auth-tab {
  padding: 7px 16px; font-weight: 600; cursor: pointer;
  color: var(--brown-light); font-size: .9rem; text-decoration: none;
  border-bottom: 2.5px solid transparent; margin-bottom: -2px;
  transition: color .12s;
}
.auth-tab.active { color: var(--brown-dark); border-bottom-color: var(--brown); }
.features-section {
  max-width: 820px; margin: 0 auto; padding: 20px 24px 60px;
  border-top: 1px solid var(--tan);
}
.features-section h2 { text-align: center; font-size: 1.3rem; color: var(--brown-dark); margin-bottom: 24px; }
.features-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.feature-card {
  background: var(--paper); border: 1px solid var(--tan);
  border-radius: 8px; padding: 16px 18px;
}
.feature-card h3 { font-size: .92rem; font-weight: 700; color: var(--brown-dark); margin-bottom: 5px; }
.feature-card p  { font-size: .82rem; color: var(--brown-light); line-height: 1.55; }
.feature-icon { font-size: 1.3rem; margin-bottom: 7px; }

/* ── Footer ── */
.site-footer {
  text-align: center; padding: 18px;
  border-top: 1px solid var(--tan);
  background: var(--parchment);
  font-size: .78rem; color: var(--brown-light);
}

/* ── Status legend ── */
.legend { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0; }
.legend-item { display: flex; align-items: center; gap: 5px; font-size: .76rem; color: var(--brown-dark); }
.legend-swatch { width: 14px; height: 14px; border-radius: 3px; flex-shrink: 0; }

/* ── Drag handles ── */
.drag-handle {
  cursor: grab; color: var(--tan-dark); user-select: none;
  font-size: 1rem; flex-shrink: 0; padding: 0 2px;
}
.drag-handle:hover { color: var(--brown); }
.sortable-chosen { background: var(--parchment) !important; border-radius: 5px; }

.task-drag-handle {
  cursor: grab; color: var(--tan); user-select: none;
  font-size: .85rem; flex-shrink: 0; opacity: 0;
  transition: opacity .12s; padding: 0 2px;
}
.task-item:hover .task-drag-handle { opacity: 1; }

/* ── Journal banners on project cards ── */
.journal-banner {
  background: #fdf8e0; border: 1px solid var(--gold);
  border-radius: 6px; padding: 7px 12px;
  margin-bottom: 10px; font-size: .85rem; color: #7a6000;
}
.submission-banner {
  background: #e8f0fe; border: 1px solid #a8c0f0;
  border-radius: 6px; padding: 6px 12px;
  margin-bottom: 10px; font-size: .82rem; color: #1a3a6c;
}

/* ── Weekly flat list item ── */
.weekly-task-item {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 0; border-bottom: 1px solid var(--parchment);
}
.weekly-task-item:last-child { border-bottom: none; }
.weekly-task-item.is-complete > div > div:last-child {
  text-decoration: line-through; opacity: .55;
}

/* ── Hide completed tasks ── */
.task-list.hide-complete > .task-item.is-complete { display: none; }
.task-list.hide-complete .subtask-item.is-complete { display: none; }

/* ── Due date badge ── */
.due-badge {
  display: inline-block; font-size: .68rem; font-weight: 600;
  padding: 1px 6px; border-radius: 10px; border: 1px solid;
  margin-left: 6px; vertical-align: middle; white-space: nowrap;
}

/* ── Responsive ── */
@media (max-width: 680px) {
  .grid-2, .grid-3, .features-grid { grid-template-columns: 1fr; }
  .project-grid { grid-template-columns: 1fr; }
  .nav-links a { padding: 5px 6px; font-size: .8rem; }
  .landing-hero h1 { font-size: 1.7rem; }
}