/* School progress, dojo and What's new. Solid band fills keep text contrast independent of the glass and wallpaper. */
.grade{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border:1px solid;border-radius:7px;font-size:12px;font-weight:600;line-height:1.45;white-space:nowrap}.grade b{font-weight:750;letter-spacing:.02em}
.grade.band-a{color:#c7f5df;background:#0e3b2c;border-color:#58c496}.grade.band-b{color:#cfe8ff;background:#0e2f4d;border-color:#62aee8}.grade.band-c{color:#fff2b0;background:#3a3208;border-color:#d9bf45}
.grade.band-d{color:#ffd9b3;background:#47280c;border-color:#e89a4e}.grade.band-f{color:#ffd6d1;background:#4f1714;border-color:#ec7468}.grade.band-none{color:#dde7f3;background:#1b2635;border-color:#8193ab;font-weight:500}
.badge.missing{color:#fff;background:#a4262c;border-color:#ff9d95;font-weight:650}.badge.for{color:var(--ink);border-color:var(--accent);margin-left:6px}
.report{border-top:1px solid var(--line);padding:18px 0 6px;margin-top:14px}.report:first-of-type{border-top:0;margin-top:6px}.report h3{margin:0}.report-tags{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.progress-table td small,.progress-table th small{display:block;color:var(--faint);font-size:11px;margin-top:4px;font-weight:400}.progress-table td{vertical-align:middle}
.course-chips,.work-items{list-style:none;padding:0;margin:14px 0;display:grid;gap:9px}.course-chips li{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;font-size:13px;padding-bottom:9px;border-bottom:1px solid var(--line)}.course-chips .course-name{flex:1 1 150px;min-width:0}.course-chips small{flex-basis:100%;color:var(--faint);font-size:11px}
.work-items li{font-size:13px;line-height:1.5}.work-items li small{display:block;color:var(--faint);font-size:11px;margin-top:3px}.progress-person{min-width:0}
.dojo-today{margin:14px 0 4px}.dojo-today p{margin:0 0 6px}.dojo-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0}
.dojo-stats>div,.dojo-pe{border:1px solid var(--line);border-radius:14px;padding:15px 16px;background:#07152a73;min-width:0}.dojo-stats strong,.dojo-pe strong{display:block;font-size:30px;font-weight:600;letter-spacing:-.03em;line-height:1.2;color:var(--accent);margin:6px 0}
.dojo-stats strong small,.dojo-pe strong small{font-size:15px;color:var(--muted);font-weight:400;letter-spacing:0}.dojo-stats>div>small,.dojo-pe>small{display:block;color:var(--muted);font-size:12px;line-height:1.5}
.stat-label{display:block;text-transform:uppercase;letter-spacing:.12em;font-size:10px;color:var(--faint)}.dojo progress{display:block;width:100%;height:6px;margin:8px 0;border:0;border-radius:4px;accent-color:var(--accent)}.dojo-pe{margin:0 0 14px}
.dojo .review-row>.actions{margin:0;flex:0 0 auto}.dojo-today p{font-size:14px;line-height:1.7}.notice-item.unread{border-left:3px solid var(--accent);padding-left:14px}
/* Phones: each course becomes a stacked row, so the missing badge never sits off-screen. */
@media(max-width:620px){.dojo-stats{grid-template-columns:minmax(0,1fr);gap:10px}.dojo-stats strong,.dojo-pe strong{font-size:26px}.report .row{align-items:flex-start}.dojo .review-row{flex-wrap:wrap}
.progress-table{min-width:0}.progress-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.progress-table tr{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;padding:12px 0;border-bottom:1px solid var(--line)}
.progress-table th,.progress-table td{display:block;border:0;padding:0}.progress-table th[scope=row]{flex:1 0 100%}
.progress-table td[data-label]:not([data-label=Score]):before{content:attr(data-label) ': ';color:var(--faint);font-size:11px}}
@media(prefers-contrast:more){.dojo-stats>div,.dojo-pe{background:#08172b}.grade,.badge.missing{border-width:2px}}
@media print{.grade,.badge.missing{border:1px solid #000!important;color:#000!important;background:#fff!important}}

/* Site feedback, 2026-09-17: the drawer under Riker's chat and the /feedback page. */
.feedback-drawer{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}
.feedback-drawer>summary{cursor:pointer;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.95rem;list-style:none}
.feedback-drawer>summary::-webkit-details-marker{display:none}
.feedback-drawer[open]>summary{color:var(--ink);margin-bottom:10px}
.feedback-item{padding:14px 0;border-top:1px solid var(--line)}
.feedback-item:first-of-type{border-top:0}
.feedback-item .row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.feedback-reply{margin:8px 0 0;padding:10px 12px;border-radius:12px;background:rgba(190,225,255,.10);border:1px solid var(--line)}
/* Attachments, 2026-09-17: the Attach control, the list before sending, and files in conversations and feedback. */
.ask-buttons{display:flex;gap:8px;align-self:stretch;flex:0 0 auto}
.attach{display:flex;position:relative}.attach[hidden]{display:none}
/* Outranks the site-wide input:not([type=checkbox]) rule, which would otherwise size this over the button. */
.attach input.attach-input{position:absolute;width:1px;height:1px;min-height:0;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0;opacity:0;pointer-events:none}
.attach-button{white-space:nowrap}.attach-button .icon{width:17px;height:17px}.attach.busy .attach-button{opacity:.55;pointer-events:none}
.attach-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}.attach-row .fine{margin:0}
.attach-list{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}.attach-list[hidden]{display:none}
.attach-item{display:flex;align-items:center;gap:11px;min-width:0;padding:8px 8px 8px 10px;border:1px solid var(--line);border-radius:12px;background:#07152a8c}
.attach-item.failed{border-color:#ff9d95}
.attach-badge{flex:0 0 46px;height:46px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;overflow:hidden;font-size:10px;font-weight:650;letter-spacing:.06em;color:var(--accent)}
.attach-badge img{width:100%;height:100%;object-fit:cover}
.attach-text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
.attach-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.attach-text small{color:var(--faint);font-size:11px;line-height:1.5}.attach-item.failed .attach-status{color:#ffd6d1}
.attach-remove{flex:0 0 auto;padding:10px 8px}
.attach-note{margin:8px 0 0}.attach-note.error{color:#ffe1b7}
form.dropping{outline:2px dashed var(--accent);outline-offset:6px;border-radius:12px}
.chat-files{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px;margin-top:10px}
.file-item{display:flex;flex-direction:column;gap:4px;min-width:0;max-width:100%}
.file-thumb{display:block;line-height:0}.file-thumb img{display:block;max-width:100%;height:auto;border-radius:10px;border:1px solid var(--line);background:#07152a}
.file-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;max-width:100%;padding:8px 12px;border:1px solid var(--line);border-radius:10px;color:var(--ink);text-decoration:none;font-size:13px;background:#07152a8c}
.file-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.file-chip small{color:var(--faint);font-size:11px;flex:0 0 auto}.file-chip .icon{width:18px;height:18px;flex:0 0 18px;color:var(--accent)}
.file-chip.removed{color:var(--faint);border-style:dashed;background:none}
.file-remove{border:0;margin:0;padding:0}.file-remove>summary{min-height:32px;padding:4px 2px;font-size:12px}.file-remove form{display:grid;gap:8px;justify-items:start;margin:4px 0 0}
@media(max-width:600px){.askrow .ask-buttons{width:100%}.ask-buttons .attach{flex:0 0 auto}.ask-buttons>.button{flex:1 1 auto;justify-content:center}.file-thumb img{max-width:min(160px,100%)}}
@media print{.attach,.attach-list,.attach-note,.file-remove{display:none!important}}
/* 2026-09-18: files show as sending from the moment Send is pressed; each person's page shows their own chat. */
.attach-list.sending .attach-remove{visibility:hidden}.attach-list.sending .attach-status{color:var(--accent)}
.read-only-chat .chat-messages{margin-top:12px}.read-only-chat .empty{margin:10px 0}
.read-only-note{margin:14px 0 4px;padding:10px 12px;border:1px dashed var(--line);border-radius:12px;font-size:14px}
.read-only-note a{white-space:nowrap}
