/* The "📅 This week" block — tools/publish-week.mjs writes it, dist/study/week-ahead.js
   adds the car reviews' energy. Everything is scoped under #wa-panel. Light-only,
   like the rest of the page. */

#wa-panel { margin: 0 0 18px; padding: 14px 10px 6px; border-radius: 16px; border: 1px solid #9fd3cf;
  background: linear-gradient(160deg, #e9fbf8 0%, #e3f3ff 100%); color: #10323a; }
#wa-panel h2 { margin: 0 4px 6px; font-size: 22px; line-height: 1.25; }
#wa-panel .wa-lead, #wa-panel .wa-h3, #wa-panel .wa-energy { margin-left: 4px; margin-right: 4px; }
#wa-panel .wa-range { font-size: 15px; font-weight: 600; color: #2b6a73; white-space: nowrap; }
#wa-panel .wa-lead { margin: 0 0 10px; font-size: 16px; color: #24505a; }
#wa-panel .wa-part { margin: 0 0 10px; }
#wa-panel details.wa-part { border-radius: 12px; background: #fff; border: 1px solid #c6e5e1; }
#wa-panel details.wa-part > summary { min-height: 48px; padding: 12px 14px; font-size: 18px; font-weight: 700; cursor: pointer; list-style-position: inside; }
#wa-panel details.wa-part[open] > summary { border-bottom: 1px solid #e0f0ee; }
#wa-panel .wa-list { margin: 8px 0 10px; padding: 0 12px 0 30px; font-size: 17px; line-height: 1.45; }
#wa-panel .wa-list li { margin: 0 0 8px; }
#wa-panel .wa-hedge { color: #7a4b00; font-weight: 600; }
#wa-panel .wa-np { color: #5b6770; font-style: italic; }
#wa-panel .wa-tag { display: inline-block; margin: 0 4px 0 0; padding: 1px 8px; border-radius: 999px; background: #e3f3ff;
  border: 1px solid #b8d9f2; font-size: 13px; font-weight: 700; color: #1d4f7a; vertical-align: 1px; }
#wa-panel .wa-tag.wa-test { background: #f5f2ff; border-color: #cfc3f5; color: #4a3a86; }

/* the car reviews */
#wa-panel .wa-h3 { margin: 4px 0 4px; font-size: 19px; }
#wa-panel .wa-energy { margin: 0 0 8px; font-size: 15px; font-weight: 600; color: #7a4b00; }
#wa-panel .wa-car { margin: 0 0 10px; border-radius: 14px; background: #fff; border: 2px solid #f0c77f; }
#wa-panel .wa-car > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; min-height: 56px; padding: 12px 14px;
  cursor: pointer; list-style: none; }
#wa-panel .wa-car > summary::-webkit-details-marker { display: none; }
#wa-panel .wa-car > summary::before { content: '▸'; color: #b0741a; font-size: 18px; }
#wa-panel .wa-car[open] > summary::before { content: '▾'; }
#wa-panel .wa-car-title { font-size: 19px; font-weight: 800; color: #3b2a12; }
#wa-panel .wa-car-sub { flex: 1 1 100%; font-size: 15px; color: #6b5a42; }
#wa-panel .wa-state { margin-left: auto; padding: 3px 10px; border-radius: 999px; background: #fff4dc; border: 1px solid #f0c77f;
  font-size: 14px; font-weight: 700; color: #8a4b0f; white-space: nowrap; }
#wa-panel .wa-state.wa-now { background: #e8731a; border-color: #e8731a; color: #fff; }
#wa-panel .wa-state.wa-done { background: #e6f6e9; border-color: #a9dab4; color: #1d5e2c; }
#wa-panel .wa-state.wa-soon { background: #f1f3f5; border-color: #d5dbe0; color: #4b5560; }
#wa-panel .wa-car.wa-car-done { border-color: #a9dab4; }
#wa-panel .wa-car.wa-car-now { border-color: #e8731a; box-shadow: 0 0 0 3px #ffe1c2; }
#wa-panel .wa-car-body { padding: 0 8px 10px; }
#wa-panel .wa-hint { margin: 0 0 8px; font-size: 15px; color: #6b5a42; }
#wa-panel .wa-xhead { margin: 12px 0 6px; font-size: 16px; font-weight: 800; color: #7a4b00; }
#wa-panel .wa-q { margin: 0 0 8px; border-radius: 12px; border: 1px solid #e6dcc8; background: #fffdf8; }
#wa-panel .wa-q.wa-x { border-color: #f0c77f; background: #fff8e8; }
#wa-panel .wa-q > summary { display: flex; gap: 10px; align-items: flex-start; min-height: 52px; padding: 12px 10px; cursor: pointer; list-style: none;
  font-size: 18px; line-height: 1.35; font-weight: 600; }
#wa-panel .wa-q > summary::-webkit-details-marker { display: none; }
#wa-panel .wa-qn { flex: 0 0 auto; min-width: 28px; height: 28px; border-radius: 999px; background: #f3e6cc; color: #6b4a12;
  font-size: 15px; font-weight: 800; line-height: 28px; text-align: center; }
#wa-panel .wa-qt { flex: 1 1 auto; }
#wa-panel .wa-q > summary::after { content: 'Tap to check'; flex: 0 0 auto; align-self: center; font-size: 13px; font-weight: 600; color: #9a7a45; }
#wa-panel .wa-q[open] > summary::after { content: ''; }
#wa-panel .wa-q.wa-got .wa-qn { background: #2e9a4b; color: #fff; }
#wa-panel .wa-q.wa-notyet .wa-qn { background: #c98a1b; color: #fff; }
#wa-panel .wa-a { padding: 0 10px 12px 48px; }
@media (max-width: 480px) { #wa-panel .wa-a { padding-left: 12px; } #wa-panel .wa-q > summary::after { content: none; } }
#wa-panel .wa-a p { margin: 0 0 8px; font-size: 18px; line-height: 1.4; color: #1d3a24; }
#wa-panel .wa-marks { display: flex; gap: 8px; }
#wa-panel .wa-mark { flex: 1 1 0; min-height: 48px; border-radius: 12px; border: 2px solid #d6c6a8; background: #fff; color: #3b2a12;
  font-size: 17px; font-weight: 700; white-space: nowrap; cursor: pointer; }
#wa-panel .wa-mark.wa-on.wa-yes { border-color: #2e9a4b; background: #e8f7ec; color: #1d5e2c; }
#wa-panel .wa-mark.wa-on.wa-no { border-color: #c98a1b; background: #fff4dc; color: #7a4b00; }
#wa-panel .wa-wait { margin: 0; font-size: 14px; color: #6b5a42; }
#wa-panel .wa-paid { margin: 10px 0 0; padding: 10px 12px; border-radius: 12px; background: #e6f6e9; font-size: 18px; font-weight: 700; color: #1d5e2c; }

/* the week, day by day */
#wa-panel .wa-day { padding: 8px 14px 2px; }
#wa-panel .wa-day h4 { margin: 4px 0 4px; font-size: 17px; color: #1d4f7a; }
#wa-panel .wa-day ul { margin: 0 0 8px; padding-left: 20px; font-size: 16px; line-height: 1.45; }
#wa-panel .wa-day li { margin: 0 0 6px; }
#wa-panel .wa-day.wa-today h4::after { content: ' · today'; color: #e8731a; }
#wa-panel .wa-notposted { margin: 4px 14px 12px; font-size: 15px; color: #5b6770; }
#wa-panel .wa-spaced p { margin: 8px 14px 12px; font-size: 16px; line-height: 1.45; }
#wa-panel .wa-rules .wa-list { font-size: 16px; }
