/* Homework (Owen, 13 September 2026): the class homework page, its calendar, marksheet, list and form. */
.hw-title{align-items:flex-start}
.hw-actions{display:flex;gap:8px;flex-wrap:wrap}
.hw-page{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.hw-panel{min-width:0;background:#fff;border:1px solid #dce5e1;border-radius:12px;padding:14px 16px}
.hw-panel-head{display:flex;align-items:baseline;gap:6px 14px;flex-wrap:wrap;margin-bottom:8px}
.hw-panel-head h2{margin:0;font-size:18px}.hw-panel-head p{margin:0;color:#5e716b;font-size:13px}
.hw-panel h3{margin:10px 0 6px;font-size:13px;color:#40524c;text-transform:uppercase;letter-spacing:.04em}
.hw-empty,.hw-none{color:#6f7d76;font-size:13px;margin:4px 0}
.hw-note,.hw-keys{font-size:12px;color:#5e716b;margin:8px 0 0}

/* Subject colours: the same twelve families as the timetable (subject-colours.js); the name is always shown too. */
.hw-subj,.hw-chip{--hw-bg:#eef2f0;--hw-edge:#9aa9a2}
.hw-c1{--hw-bg:#e8f0fb;--hw-edge:#4d79b8}.hw-c2{--hw-bg:#fdf1de;--hw-edge:#c07a16}.hw-c3{--hw-bg:#e5f4ea;--hw-edge:#2f8a57}
.hw-c4{--hw-bg:#f3ece2;--hw-edge:#8a6440}.hw-c5{--hw-bg:#e7f3f5;--hw-edge:#2f7f8c}.hw-c6{--hw-bg:#f8e9f0;--hw-edge:#a8457a}
.hw-c7{--hw-bg:#efeafa;--hw-edge:#6e56b0}.hw-c8{--hw-bg:#fbecea;--hw-edge:#b4493e}.hw-c9{--hw-bg:#fbf6dc;--hw-edge:#9a8413}
.hw-c10{--hw-bg:#eef2f0;--hw-edge:#6f7d76}.hw-c11{--hw-bg:#f1f1f1;--hw-edge:#8a8a8a}.hw-c12{--hw-bg:#eaf1ee;--hw-edge:#51766a}
.hw-subj{display:inline-block;padding:2px 8px;border-radius:999px;background:var(--hw-bg);border:1px solid var(--hw-edge);font-size:12px;font-weight:700;color:#233c36;white-space:nowrap}

/* Calendar: two weeks, a column per school day. */
.hw-cal-nav{margin-left:auto;display:flex;gap:4px}.hw-cal-nav button{padding:4px 10px}.hw-cal-nav [aria-pressed=true]{background:#eef5f0;border-color:#8fc6a2}
.hw-days{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.hw-day{display:flex;flex-direction:column;min-width:0;min-height:96px;padding:8px;border:1px solid #dfe7e2;border-radius:10px;background:#fbfdfc}
.hw-day.is-today{border-color:#2b6b45;box-shadow:inset 0 0 0 1px #2b6b45}
.hw-day.is-past{background:#f6f8f7}.hw-day.is-past .hw-chip{opacity:.7}
.hw-day.is-heavy{border-color:#d9a441;background:#fffaf0}
.hw-day.is-off{background:repeating-linear-gradient(135deg,#f6f8f7 0 8px,#eef2f0 8px 16px)}
.hw-day-head{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-bottom:6px;font-size:13px}
.hw-dayflag{font-size:11px;padding:1px 6px;border-radius:999px;background:#eef5f0;color:#2b6b45;border:1px solid #cfe3d6}
.hw-chips{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.hw-chip{display:grid;grid-template-columns:1fr auto;gap:0 6px;width:100%;text-align:left;padding:5px 7px;border:1px solid var(--hw-edge);border-left-width:4px;border-radius:7px;background:var(--hw-bg);color:#1b302b;font-size:12px;line-height:1.3}
.hw-chip:hover{filter:brightness(.97)}
.hw-chip-subject{font-weight:700}.hw-chip small{grid-row:1;grid-column:2;color:#4f5d69}
.hw-chip-title{grid-column:1/-1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hw-day-foot{margin-top:auto;padding-top:6px;display:flex;align-items:center;justify-content:space-between;gap:4px;font-size:11px;color:#5e716b}
.hw-heavy{padding:1px 6px;border-radius:999px;background:#fde8c8;color:#7a4a00;font-weight:700}
@media (max-width:760px){.hw-days{grid-template-columns:1fr}.hw-day{min-height:0}}

/* Marksheet */
.hw-tabs{display:flex;gap:4px;flex-wrap:wrap;width:100%}.hw-tabs button{padding:4px 10px;font-size:13px}
.hw-tabs [aria-pressed=true]{background:#174b3f;border-color:#174b3f;color:#fff}.hw-tabs small{opacity:.8;font-weight:400}
.hw-key{display:flex;align-items:center;gap:5px}.hw-key .hw-cell{width:20px;height:20px;font-size:11px}
.hw-table{border-collapse:separate;border-spacing:0;font-size:13px;min-width:100%}
.hw-table th,.hw-table td{padding:3px 4px;border-bottom:1px solid #edf1ef;text-align:center;vertical-align:middle}
.hw-table thead th{position:sticky;top:0;background:#fff;z-index:1;vertical-align:bottom}
.hw-table .hw-stu{text-align:left;position:sticky;left:0;background:#fff;z-index:2;min-width:180px}
.hw-stu{display:table-cell}.hw-table th.hw-stu>span{display:inline-flex;flex-direction:column;vertical-align:middle;margin-left:6px}
.hw-table th.hw-stu small{color:#6f7d76;font-weight:400}
.hw-table .avatar{vertical-align:middle}
.hw-col{min-width:64px;max-width:96px}
.hw-colhead{display:flex;flex-direction:column;align-items:center;width:100%;padding:3px 4px;border:0;background:none;font-size:12px;line-height:1.2}
.hw-colhead small{max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#5e716b;font-weight:400}
.hw-colhead:hover{background:#eef5f0;border-radius:6px}
.hw-col.is-upcoming .hw-colhead b::after{content:' ·';color:#9aa9a2}
.hw-all{margin-top:2px;padding:1px 6px;font-size:11px;border-radius:6px}
.hw-cell{display:inline-flex;align-items:center;justify-content:center;width:30px;height:28px;padding:0;border:1px solid #dfe7e2;border-radius:6px;background:#fff;font-weight:700;font-size:14px;color:#1b302b}
button.hw-cell:hover{border-color:#8fc6a2}button.hw-cell:focus-visible{outline:2px solid #2b6b45;outline-offset:1px}
.hw-cell.is-done{background:#e5f4ea;border-color:#8fc6a2;color:#1f6b40}
.hw-cell.is-late{background:#fdf1de;border-color:#e0b36a;color:#8a5200}
.hw-cell.is-missing{background:#fcecec;border-color:#efc4c4}
.hw-cell.is-upcoming{background:#fbfdfc;border-style:dashed}
.hw-n{min-width:44px;font-variant-numeric:tabular-nums}.hw-n.is-missing{color:#a33a2f;font-weight:700}
.hw-report{min-width:110px;white-space:nowrap}
.hw-table tfoot th,.hw-table tfoot td{border-bottom:0;border-top:2px solid #dce5e1;font-size:12px;color:#40524c}
.hw-table tfoot th{text-align:left;position:sticky;left:0;background:#fff}

/* The list of homework set */
.hw-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.hw-item{display:flex;align-items:flex-start;gap:10px;padding:8px 10px;border:1px solid #edf1ef;border-radius:10px}
.hw-item-main{flex:1;min-width:0}.hw-item-main small{display:block;color:#5e716b;font-size:12px}.hw-item-main p{margin:4px 0 0;font-size:13px;white-space:pre-line}
.hw-item-title{padding:0;border:0;background:none;font-weight:700;font-size:14px;text-align:left;color:#174b3f}.hw-item-title:hover{text-decoration:underline}
.hw-attach{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px;font-size:12px}.hw-attach a{overflow-wrap:anywhere}
.hw-file{color:#40524c}
.hw-item-actions{display:flex;gap:4px;flex-wrap:wrap}.hw-delete{color:#a33a2f}

/* Dialog and form */
.hw-dialog{width:min(640px,calc(100vw - 24px));max-height:calc(100vh - 32px);padding:0;border:0;border-radius:14px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.hw-dialog::backdrop{background:rgba(20,36,31,.45)}
.hw-form,.hw-detail{padding:16px 18px}
.hw-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.hw-dialog-head h2{margin:0;font-size:18px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hw-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px}.hw-wide{grid-column:1/-1}
.hw-grid label{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:700;color:#233c36}
.hw-grid label small{font-weight:400;color:#6f7d76}
.hw-grid input:not([type=checkbox]),.hw-grid select,.hw-grid textarea{font:inherit;font-weight:400;padding:7px 9px;border:1px solid #cfdbd5;border-radius:8px;width:100%}
.hw-grid textarea{resize:vertical}
.hw-load{margin:0;padding:7px 10px;border-radius:8px;background:#f3f6f5;font-size:13px;color:#40524c}.hw-load:empty{display:none}
.hw-load.is-ok{background:#eef7f1;color:#1f6b40}.hw-load.is-warn{background:#fff3df;color:#7a4a00}
.hw-files{display:flex;flex-direction:column;gap:4px}
.hw-grid label.hw-keep{flex-direction:row;align-items:center;gap:6px;font-weight:400}
.hw-also{border:1px solid #dce5e1;border-radius:10px;padding:8px 12px 10px;margin:0}.hw-also[hidden]{display:none}
.hw-also legend{font-size:13px;font-weight:700;padding:0 4px}.hw-also-note{margin:0 0 6px;font-size:12px;color:#5e716b}
.hw-also-row{display:grid;grid-template-columns:minmax(120px,1fr) auto;gap:4px 10px;align-items:center;padding:4px 0;border-top:1px solid #f0f3f1}
.hw-grid .hw-also-row label{flex-direction:row;align-items:center;gap:6px}
.hw-also-row small{grid-column:1/-1;font-size:12px;color:#5e716b}.hw-also-row small.is-warn{color:#7a4a00}
.hw-grid .hw-also-due input{width:auto}
.hw-form .actions,.hw-detail .actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}
.hw-facts{display:grid;grid-template-columns:max-content 1fr;gap:4px 14px;margin:0 0 8px;font-size:14px}.hw-facts div{display:contents}.hw-facts dt{color:#5e716b}.hw-facts dd{margin:0}
.hw-desc{white-space:pre-line;background:#f6f8f7;padding:8px 10px;border-radius:8px}
.hw-attach-list{padding-left:18px;font-size:13px}.hw-attach-list a{overflow-wrap:anywhere}
@media (max-width:560px){.hw-grid{grid-template-columns:1fr}}
