:root {
    --color-danger: #b74545;
    --radius-card: 18px;
    --radius-control: 11px;
    --shadow-card: 0 12px 32px rgba(28, 62, 89, .07);
    --color-success: #25815b;
}

body { background: var(--color-page); color: var(--color-ink); }
.ui-app { min-height: 100vh; display: flex; flex-direction: column; }
.ui-main { width: min(100% - 2rem, 1160px); margin: 0 auto; padding: 2rem 0 4rem; flex: 1; }
.ui-page { display: grid; gap: 1.25rem; }
.ui-page-header { width: min(100% - 2rem, 1160px); margin: 0 auto; padding: 2rem 0 0; display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.ui-page-header__copy { min-width: 0; }
.ui-page-header__actions, .ui-card__actions { display:flex; align-items:center; gap:.65rem; flex-wrap:wrap; }
.ui-eyebrow { color: var(--color-brand); font-size: .72rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; margin-bottom:.35rem; }
.ui-page-title { font-size: clamp(1.65rem, 3vw, 2.15rem); line-height:1.15; font-weight:800; letter-spacing:-.035em; }
.ui-section-title { font-size:1.05rem; font-weight:800; letter-spacing:-.015em; }
.ui-muted { color:var(--color-muted); font-size:.9rem; margin-top:.25rem; }
.ui-card { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-card); box-shadow:var(--shadow-card); overflow:hidden; }
.ui-card__heading { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.25rem 1.4rem; border-bottom:1px solid var(--color-border); }
.ui-card__body { padding:1.4rem; }
.ui-button { display:inline-flex; justify-content:center; align-items:center; gap:.5rem; min-height:2.55rem; padding:.62rem 1rem; border-radius:var(--radius-control); font-size:.88rem; line-height:1.2; font-weight:800; text-decoration:none; transition:background .16s ease, transform .16s ease, box-shadow .16s ease; cursor:pointer; }
.ui-button:hover { transform:translateY(-1px); }
.ui-button--primary { background:var(--color-brand); color:#fff; box-shadow:0 5px 14px rgba(9,91,149,.18); }
.ui-button--primary:hover { background:var(--color-brand-strong); }
.ui-button--quiet { background:var(--color-brand-soft); color:var(--color-brand); }
.ui-button--quiet:hover { background:#dcebf6; }
.ui-button--danger { background:#fff0ef; color:var(--color-danger); }
.ui-link { color:var(--color-brand); font-weight:800; font-size:.88rem; }
.ui-pill { display:inline-flex; border-radius:999px; padding:.35rem .7rem; background:var(--color-brand-soft); color:var(--color-brand); font-size:.76rem; font-weight:800; white-space:nowrap; }
.ui-input, .ui-select, .ui-textarea { width:100%; border:1px solid var(--color-border); border-radius:var(--radius-control); padding:.72rem .85rem; background:#fff; color:var(--color-ink); outline:none; transition:border-color .15s, box-shadow .15s; }
.ui-textarea { min-height:12rem; }
.ui-input:focus, .ui-select:focus, .ui-textarea:focus { border-color:var(--color-brand); box-shadow:0 0 0 3px rgba(9,91,149,.12); }
.ui-label { display:block; margin:0 0 .4rem; color:var(--color-ink); font-size:.83rem; font-weight:800; }
.ui-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.ui-choice-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr)); gap:.75rem; }
.ui-choice-card { display:flex; align-items:center; gap:.8rem; min-width:0; padding:1rem; border:1px solid var(--color-border); border-radius:14px; background:var(--color-surface-muted); cursor:pointer; }
.ui-choice-card[hidden] { display:none; }
.ui-choice-card:hover { border-color:#aac8dc; background:var(--color-brand-soft); }
.ui-choice-card input { flex:none; accent-color:var(--color-brand); }
.ui-choice-card__title { display:block; color:var(--color-ink); font-weight:900; }
.ui-form-field--wide { grid-column:1/-1; }
.ui-table-wrap { overflow-x:auto; }
.ui-table { width:100%; border-collapse:collapse; text-align:left; }
.ui-table th { color:var(--color-muted); font-size:.7rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; padding:.75rem 1rem; background:var(--color-surface-muted); }
.ui-table td { padding:1rem; border-top:1px solid var(--color-border); vertical-align:middle; font-size:.9rem; }
.ui-list-row { display:flex; align-items:center; gap:.9rem; padding:1rem 1.4rem; color:inherit; text-decoration:none; border-bottom:1px solid var(--color-border); transition:background .15s ease; }
.ui-list-row:last-child { border-bottom:0; }
.ui-list-row:hover { background:var(--color-surface-muted); }
.ui-list-row__title, .ui-list-row__meta { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ui-list-row__title { font-weight:800; }
.ui-list-row__meta { color:var(--color-muted); font-size:.82rem; margin-top:.12rem; }
.ui-avatar { width:2.7rem; height:2.7rem; border-radius:50%; display:grid; place-items:center; flex:none; background:var(--color-brand-soft); color:var(--color-brand); font-weight:900; }
.ui-empty-state { padding:3rem 1rem; text-align:center; color:var(--color-muted); }
.ui-empty-state h3 { margin-top:.5rem; color:var(--color-ink); font-weight:800; }
.ui-empty-state__icon { width:2.8rem; height:2.8rem; margin:auto; display:grid; place-items:center; border-radius:50%; background:var(--color-accent-soft); color:var(--color-accent); font-size:1.25rem; }
.ui-alert { padding:.9rem 1rem; border-radius:var(--radius-control); background:#fff0ef; color:var(--color-danger); }
.ui-nav { background:var(--color-surface); border-bottom:1px solid var(--color-border); }
.ui-nav__inner { width:min(100% - 2rem, 1280px); min-height:5rem; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.ui-nav__links { display:flex; align-items:center; gap:.25rem; flex-wrap:wrap; }
.ui-nav__links a { padding:.65rem .8rem; border-radius:10px; color:var(--color-muted); font-size:.87rem; font-weight:800; text-decoration:none; }
.ui-nav__links a:hover, .ui-nav__links a.is-active { background:var(--color-brand-soft); color:var(--color-brand); }
.ui-footer { text-align:center; color:var(--color-muted); padding:1rem; font-size:.78rem; }
.ui-progress-bar { display:flex; justify-content:center; align-items:center; gap:2rem; padding:1rem; background:rgba(255,255,255,.65); border-bottom:1px solid var(--color-border); }
.ui-progress-item { display:flex; align-items:center; gap:.65rem; color:var(--color-brand); font-size:.8rem; font-weight:800; }
.ui-progress-item > div { width:3rem; height:3rem; }
.ui-progress-item svg { height:100%; display:inline-block; }
.ui-progress-item--accent { color:var(--color-accent); }
.ui-admin-note { color:var(--color-muted); font-size:.8rem; }
.ui-stat-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.ui-stat { background:linear-gradient(140deg,var(--color-surface),var(--color-surface-muted)); border:1px solid var(--color-border); border-radius:15px; padding:1.2rem; }
.ui-stat__value { font-size:1.6rem; font-weight:900; color:var(--color-brand); }
.ui-stat__label { color:var(--color-muted); font-size:.82rem; margin-top:.15rem; }
.ui-journal-entry { padding:1.15rem 0; border-bottom:1px solid var(--color-border); }
.ui-journal-entry__heading { display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem 1rem; }
.ui-journal-entry__heading h2, .ui-journal-entry__heading h3 { min-width:0; overflow-wrap:anywhere; }
.ui-journal-entry:first-of-type { padding-top:0; }
.ui-journal-entry:last-child { border-bottom:0; padding-bottom:0; }
.ui-journal-entry__text { margin-top:.75rem; line-height:1.75; color:var(--color-ink); white-space:pre-wrap; }
.ui-journal-title-fields { display:grid; grid-template-columns:5rem minmax(0,1fr); align-items:center; gap:.75rem; }
.ui-exercise-card__footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; border-top:1px solid var(--color-border); margin-top:1rem; padding-top:1rem; }
.ui-exercise-image { width:100%; max-height:24rem; object-fit:contain; border:1px solid var(--color-border); border-radius:14px; background:var(--color-surface-muted); padding:.5rem; }
.ui-player-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); min-height:340px; }
.ui-player-image { width:100%; height:100%; min-height:280px; max-height:460px; object-fit:cover; background:var(--color-surface-muted); }
.ui-player-content { align-self:center; padding:clamp(1.25rem,4vw,3rem); }
.ui-player-title { margin-top:.8rem; font-size:clamp(1.5rem,3vw,2rem); font-weight:900; letter-spacing:-.03em; }
.ui-audio-player { width:100%; margin-top:2rem; }
.ui-dialog { width:min(92vw,540px); padding:2rem; border:1px solid var(--color-border); border-radius:20px; color:var(--color-ink); box-shadow:0 24px 70px rgba(20,43,61,.25); }
.ui-dialog::backdrop { background:rgba(19,43,62,.45); backdrop-filter:blur(3px); }
.ui-dialog__close { position:absolute; top:.6rem; right:.8rem; }
.ui-dialog__close button { color:var(--color-muted); font-size:1.6rem; }
.ui-module-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr)); gap:.9rem; }
.ui-module-tile { display:flex; flex-direction:column; align-items:flex-start; min-height:175px; gap:.6rem; padding:1.1rem; border:1px solid var(--color-border); border-radius:15px; text-decoration:none; color:inherit; background:linear-gradient(150deg,var(--color-surface),var(--color-surface-muted)); transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.ui-module-tile:hover { transform:translateY(-2px); border-color:#b9d2e4; box-shadow:0 10px 22px rgba(28,62,89,.08); }
.ui-module-tile__icon { width:2.5rem; height:2.5rem; display:grid; place-items:center; border-radius:12px; background:var(--color-accent-soft); color:var(--color-accent); font-size:1.25rem; }
.ui-module-tile__title { font-weight:900; font-size:1.02rem; }
.ui-progress { display:block; width:100%; height:.45rem; overflow:hidden; border-radius:999px; background:var(--color-accent-soft); }
.ui-progress > span { display:block; height:100%; border-radius:inherit; background:var(--color-accent); transition:width .2s ease; }
.ui-chip-list { display:flex; gap:.55rem; flex-wrap:wrap; }
.ui-chip { display:inline-flex; align-items:center; gap:.4rem; padding:.52rem .75rem; border-radius:999px; background:var(--color-brand-soft); color:var(--color-brand); font-size:.82rem; font-weight:800; text-decoration:none; }
.ui-chip:hover { background:#d7e9f6; }
.ui-chip--remove { background:var(--color-surface-muted); color:var(--color-ink); }
.ui-chip--remove span { color:var(--color-danger); font-size:1.1rem; line-height:1; }
.ui-subheading { margin:1.2rem 0 .65rem; color:var(--color-muted); font-size:.73rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.ui-dashboard-hero { position:relative; display:flex; align-items:center; justify-content:space-between; gap:2rem; min-height:250px; overflow:hidden; padding:2rem clamp(1.25rem,4vw,3rem); border-radius:22px; background:linear-gradient(115deg,var(--color-brand-soft) 0%,var(--color-page) 54%,var(--color-accent-soft) 100%); }
.ui-dashboard-hero h2 { font-size:clamp(1.8rem,4vw,2.65rem); line-height:1.08; font-weight:900; letter-spacing:-.04em; }
.ui-dashboard-hero h2 span { color:var(--color-brand); }
.ui-dashboard-hero p:not(.ui-eyebrow) { color:var(--color-muted); margin-top:.75rem; }
.ui-dashboard-hero__art { position:absolute; right:20%; top:-2.2rem; color:rgba(244,146,39,.14); font-size:15rem; line-height:1; pointer-events:none; }
.ui-admin-shortcuts { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem 1.4rem; background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-card); }
.ui-shortcut-links { display:flex; align-items:center; flex-wrap:wrap; gap:.5rem; }
.ui-shortcut-links a { padding:.55rem .75rem; border-radius:10px; background:var(--color-surface-muted); color:var(--color-brand); text-decoration:none; font-weight:800; font-size:.84rem; }
.ui-shortcut-links a:hover { background:var(--color-brand-soft); }
.ui-assignment-picker__heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem 1.4rem; border-bottom:1px solid var(--color-border); }
.ui-assignment-picker__columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; padding:1.1rem 1.4rem 1.4rem; }
.ui-assignment-group { min-width:0; overflow:hidden; border:1px solid var(--color-border); border-radius:14px; background:var(--color-surface-muted); }
.ui-assignment-group__heading { display:flex; align-items:center; justify-content:space-between; padding:.8rem .9rem .65rem; }
.ui-assignment-group__heading h3 { color:var(--color-ink); font-size:.78rem; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.ui-assignment-group__heading > span { display:grid; min-width:1.55rem; height:1.55rem; place-items:center; padding:0 .35rem; border-radius:999px; background:var(--color-brand-soft); color:var(--color-brand); font-size:.72rem; font-weight:900; }
.ui-assignment-search { display:flex; align-items:center; gap:.55rem; margin:0 .7rem .55rem; padding:0 .7rem; border:1px solid var(--color-border); border-radius:9px; background:var(--color-surface); color:var(--color-muted); }
.ui-assignment-search svg { width:1rem; height:1rem; flex:none; }
.ui-assignment-search input { width:100%; min-width:0; height:2.35rem; border:0; outline:0; background:transparent; color:var(--color-ink); font-size:.82rem; }
.ui-assignment-search:focus-within { border-color:var(--color-brand); box-shadow:0 0 0 3px rgba(9,91,149,.1); }
.ui-assignment-list { max-height:19rem; overflow-y:auto; overscroll-behavior:contain; padding:0 .55rem .55rem; }
.ui-assignment-row { display:flex; align-items:center; justify-content:space-between; gap:.7rem; min-height:2.75rem; padding:.35rem .5rem; border-bottom:1px solid var(--color-border); }
.ui-assignment-row:last-of-type { border-bottom:0; }
.ui-assignment-row[hidden] { display:none; }
.ui-assignment-row__name { min-width:0; overflow:hidden; color:var(--color-ink); font-size:.82rem; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.ui-assignment-action { display:inline-flex; align-items:center; gap:.25rem; flex:none; padding:.28rem .48rem; border-radius:7px; color:var(--color-brand); font-size:.72rem; font-weight:900; text-decoration:none; }
.ui-assignment-action:hover { background:var(--color-brand-soft); }
.ui-assignment-action--remove { color:var(--color-danger); }
.ui-assignment-action--remove:hover { background:#fff0ef; }
.ui-assignment-action > span { font-size:.95rem; line-height:1; }
.ui-assignment-empty { padding:.8rem .5rem; color:var(--color-muted); font-size:.78rem; }
.ui-assignment-empty[hidden] { display:none; }
.ui-library-browser__heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem 1.4rem; border-bottom:1px solid var(--color-border); }
.ui-library-browser__copy { min-width:0; }
.ui-library-browser__title-line { display:flex; align-items:center; flex-wrap:wrap; gap:.65rem; }
.ui-library-search { display:flex; align-items:center; gap:.55rem; width:min(100%, 340px); min-width:230px; padding:0 .7rem; border:1px solid var(--color-border); border-radius:9px; background:var(--color-surface-muted); color:var(--color-muted); }
.ui-library-search svg { width:1rem; height:1rem; flex:none; }
.ui-library-search input { width:100%; min-width:0; height:2.55rem; border:0; outline:0; background:transparent; color:var(--color-ink); font-size:.84rem; }
.ui-library-search:focus-within { border-color:var(--color-brand); box-shadow:0 0 0 3px rgba(9,91,149,.1); background:var(--color-surface); }
.ui-library-browser__list { min-width:0; }
.ui-library-browser__list--bounded { max-height:24rem; overflow-y:auto; overscroll-behavior:contain; }
.ui-library-row { display:flex; align-items:center; gap:.9rem; min-width:0; padding:.85rem 1.4rem; border-bottom:1px solid var(--color-border); color:inherit; text-decoration:none; transition:background .15s ease; }
.ui-library-row:last-of-type { border-bottom:0; }
.ui-library-row:hover { background:var(--color-surface-muted); }
.ui-library-row[hidden] { display:none; }
.ui-library-row__main { display:flex; flex:1; flex-direction:column; min-width:0; }
.ui-library-row__detail { flex:none; color:var(--color-muted); font-size:.8rem; white-space:nowrap; }
.ui-library-row__related { overflow:hidden; margin-top:.25rem; color:var(--color-muted); font-size:.75rem; text-overflow:ellipsis; white-space:nowrap; }
.ui-library-row--exercise .ui-list-row__meta { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ui-button--small { min-height:2.15rem; padding:.45rem .7rem; font-size:.76rem; }
.ui-library-row--selectable { cursor:pointer; }
.ui-library-row--selectable:hover { background:var(--color-brand-soft); }
.ui-library-checkbox { width:1.05rem; height:1.05rem; flex:none; accent-color:var(--color-brand); }
.ui-module-manager__actions { display:flex; justify-content:flex-end; padding:1rem 0; }
.ui-library-no-results { padding:1.5rem 1rem; text-align:center; color:var(--color-muted); }
.ui-library-no-results h3 { margin-top:.55rem; color:var(--color-ink); font-size:.95rem; font-weight:800; }
.ui-library-no-results p { margin-top:.2rem; font-size:.82rem; }
.ui-library-no-results[hidden] { display:none; }
/* Legacy Tailwind color utilities resolve through the app palette as well. */
.bg-white { background-color:var(--color-surface) !important; }
.bg-gray-50 { background-color:var(--color-surface-muted) !important; }
.bg-gray-100 { background-color:var(--color-page) !important; }
.bg-gray-200 { background-color:var(--color-neutral-200) !important; }
.bg-gray-700, .bg-gray-800, .bg-gray-900 { background-color:var(--color-brand-strong) !important; }
.bg-indigo-50, .bg-indigo-100 { background-color:var(--color-brand-soft) !important; }
.bg-orange-300 { background-color:var(--color-accent) !important; }
.bg-slate-300 { background-color:var(--color-neutral-300) !important; }
.bg-slate-600 { background-color:var(--color-brand) !important; }
.text-gray-400 { color:var(--color-neutral-400) !important; }
.text-gray-500, .text-gray-600 { color:var(--color-muted) !important; }
.text-gray-700, .text-gray-800, .text-gray-900 { color:var(--color-ink) !important; }
.text-blue-600, .text-blue-900, .text-indigo-600, .text-indigo-700, .text-indigo-800 { color:var(--color-brand) !important; }
.text-green-500, .text-green-600 { color:var(--color-success) !important; }
.text-red-400, .text-red-500, .text-red-600 { color:var(--color-danger) !important; }
.border-gray-200, .border-gray-300, .border-gray-400, .border-gray-500, .border-gray-700, .border-gray-900 { border-color:var(--color-border) !important; }
.border-indigo-300, .border-indigo-400, .border-indigo-700 { border-color:var(--color-brand) !important; }
.hover\:bg-gray-300:hover, .hover\:bg-gray-100:hover { background-color:var(--color-neutral-200) !important; }
.hover\:bg-gray-700:hover, .hover\:bg-slate-600:hover { background-color:var(--color-brand-strong) !important; }
.hover\:text-white:hover { color:#fff !important; }
.hover\:text-gray-700:hover { color:var(--color-ink) !important; }
.focus\:bg-gray-200:focus { background-color:var(--color-surface-muted) !important; }
.focus\:text-gray-700:focus { color:var(--color-ink) !important; }
.btn { color:var(--color-brand); border-color:var(--color-brand); }
.btn:hover { color:var(--color-brand-strong); border-color:var(--color-brand-strong); }
@media (max-width:960px) {
    .ui-nav__inner { flex-wrap:wrap; row-gap:.35rem; padding:.55rem 0; }
    .ui-nav__inner > div:first-child { flex:1; }
    .ui-nav__account { margin-left:auto; }
    .ui-nav__links { display:grid; flex-basis:100%; grid-template-columns:repeat(auto-fit,minmax(5.5rem,1fr)); }
    .ui-nav__links a { text-align:center; }
}
@media (max-width:720px) {
    .ui-main { width:min(100% - 1.25rem, 1160px); padding:1.25rem 0 3rem; }
    .ui-nav__inner { align-items:stretch; flex-direction:column; padding:.75rem 0; }
    .ui-nav__inner > div:first-child { justify-content:space-between; }
    .ui-nav__inner > div:first-child .block { height:2.75rem; }
    .ui-nav__links { display:grid; width:100%; grid-template-columns:repeat(auto-fit,minmax(5.5rem,1fr)); gap:.25rem; }
    .ui-nav__links a { padding:.55rem .4rem; text-align:center; white-space:normal; }
    .ui-nav__account { justify-content:flex-end; flex-wrap:wrap; padding-top:.25rem; }
    .ui-progress-bar { gap:.65rem; justify-content:space-around; padding:.7rem .5rem; }
    .ui-admin-note { display:none; }
    .ui-page-header { align-items:flex-start; flex-direction:column; }
    .ui-form-grid, .ui-stat-grid { grid-template-columns:1fr; }
    .ui-card__heading { align-items:flex-start; flex-direction:column; }
    .ui-card__body { padding:1rem; }
    .ui-list-row { gap:.65rem; padding:.85rem 1rem; }
    .ui-list-row .ui-link { display:none; }
    .ui-student-journals__action { display:none; }
    .ui-player-card { grid-template-columns:1fr; }
    .ui-player-image { width:100%; max-height:260px; min-height:0; }
    .ui-player-content { padding:1.25rem; }
    .ui-audio-player { margin-top:1.25rem; }
    .ui-dashboard-hero { align-items:flex-start; flex-direction:column; }
    .ui-dashboard-hero { gap:1rem; min-height:0; padding:1.4rem 1.1rem; }
    .ui-dashboard-hero h2 { font-size:clamp(1.7rem,8vw,2.3rem); }
    .ui-dashboard-hero__art { right:-1rem; top:3.5rem; font-size:9rem; }
    .ui-admin-shortcuts { align-items:flex-start; flex-direction:column; }
    .ui-assignment-picker__columns { grid-template-columns:1fr; padding:.9rem; }
    .ui-assignment-picker__heading { align-items:flex-start; }
    .ui-library-browser__heading { align-items:stretch; flex-direction:column; }
    .ui-library-search { width:100%; min-width:0; }
    .ui-library-row { gap:.65rem; padding:.8rem .9rem; }
    .ui-library-row--exercise { align-items:flex-start; flex-wrap:wrap; }
    .ui-library-row--exercise .ui-library-row__main { flex-basis:calc(100% - 3.5rem); }
    .ui-library-row--exercise .ui-library-row__detail { margin-left:3.5rem; }
    .ui-library-row:not(.ui-library-row--selectable) { flex-wrap:wrap; }
    .ui-library-row:not(.ui-library-row--selectable) .ui-library-row__main { flex-basis:calc(100% - 3.4rem); }
    .ui-library-row:not(.ui-library-row--selectable) > form { margin-left:3.35rem; }
    .ui-library-row:not(.ui-library-row--selectable) > .ui-button { min-height:2.25rem; padding:.48rem .65rem; }
    .ui-journal-entry__heading { flex-wrap:wrap; }
    .ui-journal-entry__heading time { margin-left:auto; font-size:.78rem; }
    .ui-journal-title-fields { grid-template-columns:4.5rem minmax(0,1fr); gap:.5rem; }
    .ui-assignment-row { align-items:flex-start; }
    .ui-table { min-width:640px; }
}
@media (max-width:420px) {
    .ui-nav__links { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ui-progress-item { gap:.4rem; font-size:.7rem; }
    .ui-progress-item > div { width:2.4rem; height:2.4rem; }
    .ui-library-row { gap:.5rem; padding:.75rem; }
    .ui-library-row:not(.ui-library-row--selectable) .ui-library-row__main { flex-basis:calc(100% - 3rem); }
    .ui-library-row:not(.ui-library-row--selectable) > form { margin-left:3rem; }
    .ui-stat { padding:.9rem; }
}