/* ============================================================
   Reviewer · unified design system
   Single theme file. Replaces minimal.css / studio.css layering.
   Palette: primary #315DA8 · titles #192B45 · accent #137D73
            soft blue #EAF1FC · page #F6F8FC · border #E1E8F1
            secondary text #596B82
   ============================================================ */

@import url('scoring.css');

/* ---------- 1. Tokens & reset ---------- */
:root{
  --blue:#315DA8; --blue-dark:#264A86; --navy:#192B45; --teal:#137D73;
  --soft:#EAF1FC; --soft-2:#F0F5FD; --bg:#F6F8FC; --card:#FFFFFF;
  --line:#E1E8F1; --line-soft:#EBF0F7; --muted:#596B82; --faint:#8295AC;
  --danger:#B23A3A; --danger-soft:#FBEDED; --warn:#8A6410; --warn-soft:#FBF3DC;
  --good:#137D73; --good-soft:#E3F2EF;
  --radius:14px; --radius-s:9px;
  --shadow:0 1px 2px rgba(25,43,69,.04),0 4px 16px rgba(25,43,69,.05);
  --shadow-lift:0 6px 24px rgba(25,43,69,.10);
  --ink:#192B45;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{
  margin:0;background:var(--bg);color:var(--navy);
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased;
}
[hidden]{display:none!important}
img,svg{max-width:100%}
h1,h2,h3,h4,p{overflow-wrap:anywhere;margin:0}
h1{font-size:clamp(26px,3.2vw,36px);font-weight:650;letter-spacing:-.03em;line-height:1.25;color:var(--navy)}
h2{font-size:21px;font-weight:650;letter-spacing:-.02em;color:var(--navy)}
h3{font-size:16px;font-weight:650;color:var(--navy)}
h4{font-size:13px;font-weight:650;color:var(--muted)}
p{margin:8px 0}
a{color:var(--blue);text-underline-offset:3px}
.eyebrow{font-size:11px;letter-spacing:.14em;font-weight:650;color:var(--faint);text-transform:uppercase;margin:0 0 8px}
.hint,small,.meta{color:var(--muted);font-size:13px}
.meta{display:flex;gap:10px 16px;flex-wrap:wrap;align-items:center}
b,strong{font-weight:650}
::selection{background:#C7D9F5}

/* ---------- 2. Focus & accessibility ---------- */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,
textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--blue);outline-offset:2px;border-radius:4px;
}
.skip-link{position:fixed;top:-100px;left:16px;z-index:200;background:#fff;color:var(--navy);
  padding:10px 16px;border-radius:8px;box-shadow:var(--shadow-lift);text-decoration:none}
.skip-link:focus{top:12px}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ---------- 3. Header / footer ---------- */
.site-header{
  position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:26px;
  min-height:62px;padding:10px max(4vw,20px);
  background:rgba(255,255,255,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.site-header a{text-decoration:none;color:var(--navy)}
.brand{display:inline-flex;align-items:center;gap:10px;font-size:18px;font-weight:700;letter-spacing:-.02em}
.brand-symbol{width:26px;height:26px;color:var(--blue);flex-shrink:0}
.site-nav{display:flex;gap:4px}
.site-nav a{font-size:14px;font-weight:550;color:var(--muted);padding:8px 13px;border-radius:8px}
.site-nav a:hover{background:var(--soft);color:var(--navy)}
.site-nav a[aria-current=page]{background:var(--soft);color:var(--blue)}
.site-user{margin-left:auto;display:flex;align-items:center;gap:12px}
.site-user form{margin:0}
.avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;
  background:var(--soft);color:var(--blue);font-size:12px;font-weight:700;flex-shrink:0}
.identity{display:flex;flex-direction:column;line-height:1.3;font-size:13px;font-weight:600;color:var(--navy)}
.identity small{font-size:11px;font-weight:500;color:var(--muted)}
.site-header>.button{margin-left:auto}
main{max-width:1200px;margin:0 auto;padding:28px max(4vw,20px) 72px;min-height:72vh}
footer,.site-footer{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;gap:16px;
  padding:22px max(4vw,20px) 34px;border-top:1px solid var(--line);color:var(--faint);font-size:12px}

/* Breadcrumbs */
.breadcrumbs{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;margin:2px 0 20px;color:var(--faint)}
.breadcrumbs a{color:var(--muted);text-decoration:none;padding:3px 2px}
.breadcrumbs a:hover{color:var(--blue);text-decoration:underline}
.breadcrumbs b{color:var(--navy);font-weight:600}
.breadcrumbs span{color:#B9C5D6;user-select:none}
.back{display:inline-block;font-size:13px;color:var(--muted);margin-bottom:18px;text-decoration:none}
.back:hover{color:var(--blue)}

/* ---------- 4. Buttons ---------- */
button,.button{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font:inherit;font-size:14px;font-weight:600;line-height:1.2;
  padding:10px 18px;border-radius:var(--radius-s);border:1px solid var(--blue);
  background:var(--blue);color:#fff;cursor:pointer;text-decoration:none;
  transition:background .15s,border-color .15s,box-shadow .15s;
  white-space:nowrap;
}
button:hover,.button:hover{background:var(--blue-dark);border-color:var(--blue-dark);color:#fff}
button:disabled{background:var(--line);border-color:var(--line);color:var(--faint);cursor:not-allowed}
.secondary,button.secondary,.button.secondary{background:#fff;border-color:var(--line);color:var(--blue)}
.secondary:hover,button.secondary:hover,.button.secondary:hover{background:var(--soft);border-color:#C9D8EE;color:var(--blue-dark)}
.ghost,button.ghost{background:transparent;border-color:transparent;color:var(--muted);padding:8px 12px}
.ghost:hover,button.ghost:hover{background:var(--soft);border-color:transparent;color:var(--navy)}
.danger-button,button.danger-button{background:var(--danger);border-color:var(--danger);color:#fff}
.danger-button:hover{background:#8F2E2E;border-color:#8F2E2E}
.link{background:transparent;border:0;color:var(--blue);padding:4px 6px;border-radius:6px;font-weight:600;cursor:pointer;text-decoration:none}
.link:hover{background:var(--soft);color:var(--blue-dark)}
.table-button{background:transparent;border:1px solid transparent;color:var(--blue);padding:7px 12px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer}
.table-button:hover{background:var(--soft);color:var(--blue-dark)}
.table-button.primary-link{border-color:var(--line);background:#fff;color:var(--good)}
.table-button.primary-link:hover{background:var(--good-soft);border-color:#C4E0DA;color:#0D5F57}
.table-button.danger-text{color:var(--danger)}
.table-button.danger-text:hover{background:var(--danger-soft);color:#8F2E2E}
.text-action{font-weight:600;white-space:nowrap;color:var(--blue);text-decoration:none}
.text-action:hover{text-decoration:underline}
.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
button span,.button span{white-space:nowrap}

/* ---------- 5. Badges & status ---------- */
.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;
  background:var(--soft);color:var(--blue);padding:4px 11px;font-size:11.5px;font-weight:650;
  white-space:nowrap;border:0;line-height:1.5}
.badge.good{background:var(--good-soft);color:var(--good)}
.badge.warn{background:var(--warn-soft);color:var(--warn)}
.badge.danger{background:var(--danger-soft);color:var(--danger)}
.badge.neutral{background:var(--line-soft);color:var(--muted)}
.count-pill{display:inline-grid;place-items:center;min-width:23px;height:23px;padding:0 7px;font-size:11.5px;
  font-weight:650;border-radius:999px;background:var(--soft);color:var(--blue);margin-left:10px;vertical-align:middle}
.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--blue);margin-right:2px}
.badge .status-dot{margin:0}

/* ---------- 6. Cards / panels / sections ---------- */
.panel,.grading-card,.assignment-block,.submitted-file,.questions .question{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.panel{padding:24px;margin:18px 0}
.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin:4px 0 26px;flex-wrap:wrap}
.page-head>div:first-child{min-width:0;flex:1}
.page-head h1{margin:0 0 6px}
.page-head p{margin:4px 0 0;color:var(--muted)}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:26px 0 14px;flex-wrap:wrap}
.section-head>div{min-width:0}
.section-head h2{margin:0}
.section-head p{margin:4px 0 0}
.empty{padding:26px;border:1.5px dashed #CBD8E9;border-radius:var(--radius);color:var(--muted);background:#FBFCFE;text-align:center}
.flash{padding:14px 18px;background:var(--soft);border:1px solid #CFDFF5;border-radius:10px;margin-bottom:20px;font-size:14px}

/* ---------- 7. Forms ---------- */
.form{display:block;max-width:100%}
label{display:block;font-size:13px;font-weight:600;color:var(--navy);margin-bottom:16px}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),textarea,select{
  display:block;width:100%;margin-top:7px;padding:10px 13px;
  font:inherit;font-size:14px;line-height:1.55;color:var(--navy);
  background:#fff;border:1px solid #D4DEEC;border-radius:var(--radius-s);
  -webkit-appearance:none;appearance:none;max-width:100%;
  transition:border-color .15s,box-shadow .15s;
}
input:not([type=checkbox]):focus,textarea:focus,select:focus{
  border-color:var(--blue);box-shadow:0 0 0 3px rgba(49,93,168,.14);outline:none}
input::placeholder,textarea::placeholder{color:#9FAEC2;opacity:1}
textarea{resize:vertical;min-height:72px}
select{padding-right:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23596B82' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
input[type=checkbox],input[type=radio]{accent-color:var(--blue);width:16px;height:16px}
input[type=file]{padding:14px;background:#FBFCFE;border:1.5px dashed #C8D6E8!important}
input[type=file]::file-selector-button{font:inherit;font-size:13px;font-weight:600;border:1px solid var(--line);
  border-radius:8px;background:var(--soft);color:var(--blue);padding:8px 14px;margin-right:14px;cursor:pointer}
.two{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.two>label{min-width:0}
input+small,label small{font-weight:500}

/* JS-generated friendly file picker (interface-v3.js) */
.english-file-picker{display:flex;align-items:center;gap:14px;background:#FBFCFE;border:1.5px dashed #C8D6E8;
  border-radius:var(--radius-s);padding:12px;margin-top:7px;position:relative}
.english-file-picker span{min-width:0;overflow-wrap:anywhere;font-size:13px;font-weight:500;color:var(--muted)}
.english-file-picker button{flex-shrink:0}
.native-file-input{position:absolute!important;width:1px!important;height:1px!important;opacity:0;overflow:hidden;padding:0!important;pointer-events:none;border:0!important}

/* ---------- 8. Tables ---------- */
.table-scroll{display:block;width:100%;max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:12px;background:#fff;
  scrollbar-width:thin;scrollbar-color:#BCCBDF transparent}
.table-scroll>table{width:max-content;min-width:100%;table-layout:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
th{text-align:left;font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;font-weight:650;
  color:var(--muted);background:#F8FAFD;white-space:nowrap}
td,th{padding:13px 16px;border-bottom:1px solid var(--line-soft)}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover td{background:#FAFCFF}
td small{display:block;margin-top:3px}
.table-scroll th,.table-scroll td{white-space:nowrap}
.table-scroll td p,.table-scroll td pre{white-space:normal;max-width:52ch;overflow-wrap:anywhere}
.table-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.table-actions form{margin:0}

/* ---------- 9. Dialogs & toast ---------- */
dialog{width:min(640px,calc(100vw - 32px));border:1px solid var(--line);border-radius:18px;padding:28px;
  max-height:min(86dvh,860px);overflow:auto;box-shadow:0 24px 80px rgba(25,43,69,.25);color:var(--navy)}
dialog::backdrop{background:rgba(25,43,69,.38);backdrop-filter:blur(3px)}
dialog .page-head{margin-bottom:18px}
dialog h2{font-size:22px}
.dialog-close,dialog .page-head>.secondary{width:36px;height:36px;padding:0;font-size:20px;line-height:1;border-radius:9px;flex-shrink:0}

/* ---------- 10. Details / disclosure ---------- */
summary{cursor:pointer;font-weight:600;color:var(--navy)}
summary::-webkit-details-marker{font-size:.85em}
.support-section{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:0;margin:18px 0;overflow:hidden}
.support-section>summary{padding:18px 24px;font-size:14.5px;color:var(--navy);list-style-position:inside}
.support-section>summary:hover{background:#FAFCFF}
.support-section[open]>summary{border-bottom:1px solid var(--line-soft)}
.support-section>*:not(summary){margin-left:24px;margin-right:24px}
.support-section>p:last-child,.support-section>div:last-child,.support-section>details:last-child,.support-section>form:last-child{margin-bottom:20px}
.support-section>summary+*{margin-top:16px}
.support-section>pre{max-height:46vh;overflow:auto;overscroll-behavior:contain}

/* ---------- 11. Landing page ---------- */
.landing-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:56px;align-items:center;
  padding:48px 0 56px}
.landing-hero h1{font-size:clamp(34px,4.6vw,56px);font-weight:700;letter-spacing:-.035em;line-height:1.12;margin:14px 0 18px}
.landing-hero h1 em{font-style:normal;color:var(--blue)}
.hero-description{font-size:17px;color:var(--muted);line-height:1.75;margin:0 0 28px;max-width:52ch}
.hero-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.hero-actions .button{padding:12px 22px}
.hero-panel{background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:22px;display:grid;gap:12px}
.hero-panel .hero-step{display:flex;gap:14px;align-items:flex-start;padding:12px 12px;border-radius:12px;background:var(--soft-2)}
.hero-panel .hero-step i{font-style:normal;display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;
  border-radius:50%;background:#fff;color:var(--blue);font-size:12.5px;font-weight:700;border:1px solid var(--line)}
.hero-panel .hero-step b{display:block;font-size:14px}
.hero-panel .hero-step p{margin:2px 0 0;font-size:12.5px;color:var(--muted);line-height:1.6}
.principle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:14px 0 8px}
.principle-grid article{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.principle-grid h3{margin:10px 0 8px;font-size:15.5px}
.principle-grid p{font-size:13.5px;color:var(--muted);line-height:1.7;margin:0}
.principle-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--soft);color:var(--blue);font-size:17px}
.role-paths{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:14px 0}
.role-paths article{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.role-paths h3{font-size:17px;margin-bottom:14px}
.role-paths ol{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.role-paths li{display:flex;gap:12px;align-items:baseline;font-size:14px;color:var(--muted)}
.role-paths li i{font-style:normal;color:var(--blue);font-weight:700;font-size:12.5px;flex-shrink:0;width:18px}
.role-paths li b{color:var(--navy);font-weight:600}

/* ---------- 12. Auth / login ---------- */
.auth{max-width:520px;margin:28px auto 0}
.auth-intro{text-align:center;margin-bottom:26px}
.auth-intro h1{margin:10px 0 8px}
.auth-intro p{color:var(--muted)}
.role-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:22px 24px;margin-bottom:14px;display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:16px;align-items:center}
.role-card .role-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;font-size:19px;background:var(--soft);color:var(--blue)}
.role-card.student .role-icon{background:var(--good-soft);color:var(--teal)}
.role-card h3{margin:0 0 3px;font-size:15.5px}
.role-card p{margin:0;font-size:13px;color:var(--muted)}
.role-card .role-pick{grid-column:2/4;margin:4px 0 0}
.role-card label{margin:0}
.auth-divider{display:flex;align-items:center;gap:14px;color:var(--faint);font-size:12px;margin:22px 0 16px}
.auth-divider::before,.auth-divider::after{content:'';height:1px;flex:1;background:var(--line)}
.auth .form{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px}
.auth .form>button{width:100%;margin-top:4px}
#account-fill-status{min-height:20px;margin:10px 2px 0;text-align:center}

/* ---------- 13. Course cards ---------- */
.collection-section{padding-top:8px}
.collection-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:22px;flex-wrap:wrap}
.collection-head h2{margin:0}
.gallery-grid,.gallery-grid.single-course{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,310px),1fr));gap:24px;align-items:stretch}
.gallery-card{display:flex;flex-direction:column;min-width:0;background:var(--card);border:1px solid var(--line);
  border-radius:16px;box-shadow:var(--shadow);overflow:hidden;transition:box-shadow .2s,transform .2s}
.gallery-card:hover{box-shadow:var(--shadow-lift);transform:translateY(-2px)}
.gallery-cover{position:relative;display:block;height:150px;background:linear-gradient(135deg,#2C5296 0%,#315DA8 55%,#3F74C4 100%);
  color:#fff;text-decoration:none;overflow:hidden;isolation:isolate}
.tone-1 .gallery-cover{background:linear-gradient(135deg,#0F6A61,#17897E)}
.tone-2 .gallery-cover{background:linear-gradient(135deg,#41557E,#5A6FA0)}
.tone-3 .gallery-cover{background:linear-gradient(135deg,#6A4E8E,#8465AE)}
.cover-code{position:absolute;left:20px;top:18px;font-size:12px;font-weight:700;letter-spacing:.1em;z-index:1}
.cover-index{position:absolute;left:20px;bottom:16px;font-size:9.5px;letter-spacing:.14em;opacity:.75;z-index:1}
.cover-arrow{position:absolute;right:18px;bottom:13px;font-size:20px;z-index:1;transition:transform .2s}
.gallery-cover:hover .cover-arrow{transform:translate(2px,-2px)}
.cover-art{position:absolute;inset:0;z-index:0;overflow:hidden;opacity:.5}
.cover-art i{position:absolute;width:150px;height:190px;border-radius:90px 90px 6px 6px;left:46%;top:26%;
  background:rgba(255,255,255,.14);transform:rotate(-26deg)}
.cover-art i:nth-child(2){left:58%;top:16%;background:rgba(255,255,255,.18);transform:rotate(-8deg)}
.cover-art i:nth-child(3){left:70%;top:30%;background:rgba(255,255,255,.26);transform:rotate(12deg)}
.gallery-caption{display:flex;flex-direction:column;flex:1;padding:18px 22px 16px}
.gallery-caption h2{font-size:19px;margin:0 0 8px}
.gallery-caption h2 a{color:var(--navy);text-decoration:none}
.gallery-caption h2 a:hover{color:var(--blue)}
.gallery-caption>p{color:var(--muted);font-size:13.5px;line-height:1.7;margin:0 0 16px}
.gallery-links{margin-top:auto;display:flex;flex-wrap:wrap;gap:6px 18px;padding-top:14px;border-top:1px solid var(--line-soft)}
.gallery-links a{font-size:12.5px;font-weight:600;color:var(--blue);text-decoration:none;padding:4px 0}
.gallery-links a:hover{text-decoration:underline}
.gallery-links span{color:var(--faint);margin-left:5px}
.gallery-empty{grid-column:1/-1}

/* ---------- 14. Course workspace (teacher & student) ---------- */
.course-context{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin:0 0 6px}
.course-context>div{min-width:0}
.course-context h1{margin:0}
.course-context .eyebrow{margin-bottom:6px}
.course-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

.course-tabs{display:flex;gap:6px;margin:14px 0 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.course-tabs a{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--muted);
  text-decoration:none;padding:9px 14px 11px;border-bottom:2px solid transparent;margin-bottom:-1px;border-radius:8px 8px 0 0}
.course-tabs a:hover{color:var(--navy);background:var(--soft-2)}
.course-tabs a[aria-current=page]{color:var(--blue);border-bottom-color:var(--blue)}
.course-tabs .count-pill{margin-left:0;min-width:20px;height:20px;font-size:10.5px}

.chapter-group{margin:16px 0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow:hidden}
.chapter-group>summary{display:flex;align-items:baseline;gap:14px;padding:19px 24px;font-size:16.5px;font-weight:650;list-style-position:inside}
.chapter-group>summary:hover{background:#FAFCFF}
.chapter-group[open]>summary{border-bottom:1px solid var(--line-soft)}
.chapter-group>summary small{font-weight:500;white-space:nowrap;margin-left:auto}
.chapter-assignments{padding:4px 18px 18px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.chapter-assignments .assignment-block{background:#FBFCFE;box-shadow:none;margin:14px 0}
.chapter-edit{margin:10px 0;font-size:13px;color:var(--muted)}
.chapter-edit>summary{font-weight:500;color:var(--faint);font-size:12.5px}
.chapter-edit>summary:hover{color:var(--blue)}
.chapter-form{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;padding:14px 0 6px}
.chapter-form label{flex:1;min-width:200px;margin:0}
.chapter-form small{flex-basis:100%}
.chapter-edit form+form{margin-top:10px}

.assignment-block{scroll-margin-top:80px;padding:22px 26px;margin:18px 0;min-width:0}
.assignment-card-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:20px;margin:0}
.assignment-card-head h3{font-size:17px;line-height:1.45;margin:0 0 6px}
.assignment-actions{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap}
.assignment-instructions{margin:14px 0 4px}
.assignment-instructions>summary,.assignment-submissions>summary{font-size:13.5px;color:var(--blue);font-weight:600;padding:7px 0}
.assignment-instructions>summary:hover,.assignment-submissions>summary:hover{text-decoration:underline}
.instruction-content{display:grid;gap:20px;margin-top:12px;padding:20px 22px;background:var(--soft-2);
  border:1px solid var(--line-soft);border-radius:12px;min-width:0;max-height:52vh;overflow:auto;overscroll-behavior:contain}
.instruction-content h4{margin:0 0 8px;letter-spacing:.06em;text-transform:uppercase;font-size:11.5px}
.instruction-text{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.8;font-size:14px;color:#33465F}
.assignment-submissions{margin-top:8px}
.assignment-submissions>summary .hint{display:inline-block;margin-left:14px;font-weight:500}
.assignment-submissions[open]>.table-scroll{margin-top:12px;max-height:48vh;overflow:auto}

/* Hold-to-delete */
.hold-delete-form{margin:0;width:96px;flex-shrink:0;position:relative}
.hold-delete{position:relative;overflow:hidden;width:100%;height:40px;padding:8px 14px;
  background:#fff;color:var(--danger);border:1px solid #DCA8A8;border-radius:var(--radius-s);
  user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:pan-y}
.hold-delete:hover{background:var(--danger-soft);color:var(--danger);border-color:var(--danger)}
.hold-delete span{position:relative;z-index:1}
.hold-delete::before{content:'';position:absolute;inset:0;background:var(--danger);transform:scaleX(0);transform-origin:left}
.hold-delete.holding::before{transform:scaleX(1);transition:transform 1.5s linear}
.hold-delete.holding span{color:#fff}
.hold-help{display:block;text-align:center;font-size:10.5px;color:var(--faint);margin-top:5px;line-height:1.5}

/* Reference files / student rosters */
.upload-row{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:8px}
.upload-row label{flex:1;min-width:230px;margin-bottom:0}
.list-search{display:block;margin-top:14px}
.list-search input{max-width:420px}
.bounded-list{max-height:300px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;margin-top:12px;padding-right:8px}
.row{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:12px 2px;border-bottom:1px solid var(--line-soft)}
.row:last-child{border-bottom:0}
.row>span{flex:1;min-width:0;overflow-wrap:anywhere;line-height:1.7}
.row small{display:block;margin-top:2px}
.row>form{flex:0 0 auto;margin:0}
.student-picker{margin:14px 0 20px;padding:16px 20px;border:1px solid var(--line);border-radius:12px;background:var(--soft-2)}
.student-picker>summary{font-size:13.5px;color:var(--blue)}
.student-options{max-height:240px;overflow:auto;margin:14px 0;background:#fff;border:1px solid var(--line);border-radius:10px}
.student-options label{display:flex;gap:13px;align-items:center;padding:11px 14px;margin:0;border-bottom:1px solid var(--line-soft);cursor:pointer;font-weight:550}
.student-options label:last-child{border-bottom:0}
.student-options label:hover{background:var(--soft-2)}
.student-options input{flex:none}
.student-options small{display:block;margin-top:2px;font-weight:400;overflow-wrap:anywhere}
.course-settings .form{max-width:560px}
.course-settings form:last-of-type{margin-bottom:20px}
.workspace-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.workspace-grid>.support-section{margin:0}
datalist{display:none}

/* ---------- 15. Assignment detail & submit (student) ---------- */
.assignment-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin:0 0 24px;flex-wrap:wrap}
.assignment-detail-head>div{flex:1;min-width:0}
.assignment-detail-head h2{font-size:clamp(22px,2.6vw,30px);margin:0 0 10px}
.assignment-workspace{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:22px;align-items:start}
.assignment-context{min-width:0}
.assignment-detail-grid{display:block}
.detail-panel{margin:0 0 16px;padding:20px 24px;min-width:0;max-width:100%;overflow:hidden}
.detail-panel>summary{font-size:14.5px}
.detail-panel h3{margin:0 0 4px}
.detail-panel>.assignment-brief,.detail-panel>.rubric-list{max-height:300px;overflow:auto;overscroll-behavior:contain;
  scrollbar-width:thin;padding-right:8px;overflow-wrap:anywhere;min-width:0}
.detail-panel>.assignment-brief{margin-top:12px;white-space:pre-wrap;font-size:14px;line-height:1.8;color:#33465F}
.rubric-list{margin-top:8px}
.rubric-list article{display:flex;gap:13px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--line-soft)}
.rubric-list article:last-child{border-bottom:0}
.rubric-list article>span{font-size:12px;font-weight:700;color:var(--blue);background:var(--soft);
  width:22px;height:22px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;align-self:flex-start;transform:translateY(2px)}
.rubric-list article>div{min-width:0;line-height:1.7;flex:1}
.rubric-list .badge{margin-left:8px}
.rubric-list p{font-size:13.5px;color:var(--muted);margin:6px 0 0}
.rubric-description{margin-top:4px;font-size:13px}
.rubric-description>summary{color:var(--faint);font-weight:500;font-size:12.5px}
.rubric-description>summary:hover{color:var(--blue)}
.assignment-submit{min-width:0;padding:24px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);position:sticky;top:84px}
.assignment-submit h2{margin:0 0 16px;font-size:18px}
.assignment-submit .form{margin:0}
.assignment-submit #submission-form{margin:0;padding:0;border:0}
.written-answer>summary{font-size:13.5px;color:var(--blue);font-weight:600;padding:4px 0}
.written-answer>label{display:block;margin-top:12px}
#submission-form button[type=submit],#submission-form form>button{width:100%;margin-top:6px}

/* ---------- 16. Review workspace (shared) ---------- */
.review-guide{margin:2px 0 10px}
.review-guide p{margin:0;color:var(--muted);font-size:13.5px}
.review-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px 22px;flex-wrap:wrap;
  padding:12px 16px;margin:14px 0;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}
.review-filters,.bulk-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.approve-all-form{margin:0}
.review-filter{background:transparent;border:1px solid transparent;color:var(--muted);font-size:13px;font-weight:600;
  padding:7px 13px;border-radius:999px}
.review-filter:hover{background:var(--soft);color:var(--navy);border-color:transparent}
.review-filter.active{background:var(--navy);border-color:var(--navy);color:#fff}
.bulk-actions button{font-size:13px;padding:8px 14px}
.bulk-actions .approve-all-form button{background:var(--good);border-color:var(--good)}
.bulk-actions .approve-all-form button:hover{background:#0D5F57;border-color:#0D5F57}
.bulk-actions button[value=approve]{background:#fff;border-color:var(--line);color:var(--good)}
.bulk-actions button[value=approve]:hover{background:var(--good-soft);border-color:#C4E0DA}
.bulk-actions button.danger-button{background:#fff;border-color:#DCA8A8;color:var(--danger)}
.bulk-actions button.danger-button:hover{background:var(--danger-soft);border-color:var(--danger)}

/* Criterion navigation (built by review-panels.js) */
.criterion-navigation{display:flex;align-items:center;gap:10px;margin:14px 0 12px;min-width:0}
.criterion-navigation>button{flex-shrink:0;background:#fff;border:1px solid var(--line);color:var(--blue);
  border-radius:var(--radius-s);padding:8px 13px;font-size:13px}
.criterion-navigation>button:hover{background:var(--soft);color:var(--blue-dark);border-color:#C9D8EE}
.criterion-navigation>button:disabled{background:#F2F5FA;border-color:var(--line);color:#AEBCCD}
.criterion-tabs{display:flex;gap:8px;overflow:auto;flex:1;min-width:0;position:relative;
  scrollbar-width:thin;scrollbar-color:#BCCBDF transparent;padding-bottom:4px}
.criterion-tabs button{background:var(--soft);border:1px solid transparent;color:var(--blue);border-radius:999px;
  padding:8px 15px;flex-shrink:0;font-size:13px;font-weight:600;max-width:280px;overflow:hidden;text-overflow:ellipsis}
.criterion-tabs button:hover{background:#DEE9FA;color:var(--blue-dark)}
.criterion-tabs button[aria-current=true]{background:var(--blue);border-color:var(--blue);color:#fff}
.criterion-count{white-space:nowrap;font-size:12.5px;font-weight:600;color:var(--muted)}

/* Review track: one bounded card per criterion */
.review-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;position:relative;align-items:stretch}
.review-track::-webkit-scrollbar{display:none}
.review-track>.grading-card{flex:0 0 100%;width:100%;min-width:0;margin:0;scroll-snap-align:start;
  display:flex;flex-direction:column;overflow:hidden;height:66vh}
.teacher-review-page .review-track>.grading-card{height:clamp(400px,calc(100dvh - 320px),760px)}
.criterion-content{overflow-y:auto;overflow-x:hidden;min-height:0;flex:1;overscroll-behavior-y:contain;scrollbar-width:thin}
.review-track .grading-footer{flex-shrink:0;margin:0}

/* Grading card internals */
.grading-card{margin:20px 0}
.grading-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px 28px;
  padding:18px 24px;background:#FAFCFF;border-bottom:1px solid var(--line-soft);flex-wrap:wrap}
.grading-head>div:first-child{min-width:0;flex:1}
.grading-head h2{font-size:19px;margin:0}
.grading-head .eyebrow{margin-bottom:7px}
.grading-head>strong{flex-shrink:0;white-space:nowrap;font-size:20px;color:var(--navy)}
.grading-score{flex:0 0 auto;text-align:right;white-space:nowrap}
.grading-score strong{font-size:28px;font-weight:700;color:var(--navy)}
.grading-score span{color:var(--muted);font-size:14px}
.grading-score small{display:block;margin-top:3px;color:var(--warn);font-weight:600}
.grading-standard{font-size:13.5px;color:var(--muted);margin:8px 0 0;line-height:1.7}
.criterion-standard{margin-top:10px;font-size:13px;color:var(--muted)}
.criterion-standard summary{font-weight:500;font-size:12.5px;color:var(--faint)}
.criterion-standard summary:hover{color:var(--blue)}
.criterion-standard .grading-standard{max-height:130px;overflow:auto;overflow-wrap:anywhere;margin:8px 0 0}
.grading-body{display:grid;grid-template-columns:1fr 1fr}
.grading-body>section{min-width:0;padding:22px 24px;line-height:1.75}
.grading-body>section+section{border-left:1px solid var(--line-soft);background:var(--soft-2)}
.grading-body h3{display:flex;align-items:center;gap:8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--faint);margin:0 0 10px}
.grading-body h3:not(:first-child){margin-top:24px}
.grading-body p{font-size:14px;margin:8px 0}
.grading-verdict{font-weight:650;color:var(--navy);font-size:15px!important}
.grading-explanation{color:#33465F}
.grading-next{background:var(--good-soft);border:1px solid #CBE4DE;border-radius:11px;padding:14px 18px;margin-top:18px}
.grading-next h3{color:var(--good);margin-bottom:6px}
.grading-next p{margin:0;color:#14544D}
.scoring-breakdown{margin:16px 0;border:1px solid var(--line-soft);border-radius:11px;background:#fff;overflow:hidden}
.scoring-breakdown>summary{padding:11px 16px;font-size:13px;color:var(--blue)}
.scoring-breakdown>summary:hover{background:var(--soft-2)}
.scoring-breakdown[open]>summary{border-bottom:1px solid var(--line-soft)}
.scoring-breakdown>*:not(summary){margin-left:16px;margin-right:16px}
.scoring-breakdown>p:last-child,.scoring-breakdown>div:last-child{margin-bottom:12px}
.scoring-breakdown .badge{white-space:normal;line-height:1.6;height:auto}
.scoring-check{border-top:1px solid var(--line-soft);padding:12px 0;font-size:13px}
.scoring-check p{margin:4px 0;font-size:13px}

/* Evidence */
blockquote{margin:12px 0;padding:13px 16px;background:#fff;border:1px solid var(--line-soft);
  border-left:3px solid #A9C3E8;border-radius:0 10px 10px 0;font-size:13.5px;line-height:1.85;overflow-wrap:anywhere}
.grading-body>section+section blockquote{background:#fff}
mark{background:#D9E6F9;color:#17304F;border-radius:3px;padding:1px 3px;
  box-decoration-break:clone;-webkit-box-decoration-break:clone}
.evidence-surrounding{color:var(--faint)}
.evidence-check{font-size:12.5px!important;font-weight:650;margin:6px 0 14px}
.evidence-check.verified{color:var(--good)}
.evidence-empty{display:block;padding:12px 16px;background:var(--warn-soft);border:1px solid #EBDDB4;
  border-radius:10px;color:var(--warn);font-size:13px!important;font-weight:550}
.course-citation{margin:12px 0}
.citation-source{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:650;color:var(--blue);
  background:var(--soft);border-radius:7px;padding:4px 10px;margin:0 0 4px}
.citation-source::before{content:'📄';font-size:11px}

/* Card footer: selection + actions */
.grading-footer{display:flex;align-items:center;justify-content:space-between;gap:14px 24px;
  border-top:1px solid var(--line-soft);padding:14px 24px;background:#FAFCFF;flex-wrap:wrap}
.grading-footer>div:first-child{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.grading-footer label{display:inline-flex;align-items:center;gap:9px;margin:0;font-size:13.5px;font-weight:550;cursor:pointer}
.grading-footer .hint{font-size:12px}

/* Confidence chips (plain markup) */
.confidence{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:650;border-radius:999px;padding:4px 11px}
.confidence.high{background:var(--good-soft);color:var(--good)}
.confidence.low{background:var(--warn-soft);color:var(--warn)}
.confidence i{font-style:normal;width:7px;height:7px;border-radius:50%;background:currentColor}

/* Release bar */
.review-bottom-grid{display:grid;grid-template-columns:1fr;gap:18px;margin-top:18px}
.release-summary{display:flex;align-items:center;justify-content:space-between;gap:16px 28px;flex-wrap:wrap;
  padding:18px 24px;margin:0;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.release-summary p{margin:0 0 3px;font-size:14.5px}
.release-summary form{margin:0}
.release{background:var(--good);border-color:var(--good)}
.release:hover{background:#0D5F57;border-color:#0D5F57}

/* Questions */
.questions{margin-top:26px}
.questions h2{font-size:18px;margin-bottom:12px}
.questions .question{margin:14px 0}
.question{padding:18px 22px}
.question>b{font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--faint)}
.question>p{margin:8px 0 12px;font-size:14px}
.reply{background:var(--soft-2);border:1px solid var(--line-soft);border-radius:10px;padding:13px 16px;font-size:13.5px}
.reply b{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.reply p{margin:6px 0 0}
p.reply{margin-top:10px}
.ask{border-top:1px solid var(--line-soft);padding:14px 24px;margin:0}
.review-track .ask,.review-track .question{margin:14px 24px 18px;border-radius:12px;border:1px solid var(--line-soft);background:#fff;padding:14px 18px}
.ask>summary{font-size:13.5px;color:var(--blue)}
.ask form{margin-top:12px}
.ask button{font-size:13px;padding:9px 16px}

/* Student total score hero */
.total-score{font-size:clamp(34px,4vw,44px);font-weight:700;white-space:nowrap;color:var(--navy);line-height:1.1}
.total-score small{font-size:17px;color:var(--muted);font-weight:500}
.score-hero{display:flex;align-items:center;gap:14px 36px;flex-wrap:wrap;padding:20px 26px;margin:0 0 18px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.score-hero>div{min-width:0}
.score-hero .score-note{font-size:13px;color:var(--muted);max-width:46ch}
.improvement-plan{padding:20px 26px;margin:0 0 18px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.improvement-plan h2{font-size:16px;margin-bottom:12px}
.improvement-plan ol{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.improvement-plan li{display:flex;gap:12px;align-items:baseline;font-size:14px;line-height:1.65}
.improvement-plan li i{font-style:normal;font-weight:700;font-size:12px;color:var(--blue);background:var(--soft);
  width:22px;height:22px;flex-shrink:0;display:grid;place-items:center;border-radius:50%;align-self:flex-start;transform:translateY(2px)}
.improvement-plan li small{display:block;color:var(--muted)}

/* Review-page header strip */
.review-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px 28px;flex-wrap:wrap;margin:0 0 14px}
.review-head>div:first-child{min-width:0;flex:1}
.review-head h1{font-size:clamp(21px,2.4vw,28px);margin:0 0 6px}
.review-head .meta{margin-top:4px}
.review-stats{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ---------- 17. Review edit dialog ---------- */
dialog.review-edit-dialog{width:min(780px,calc(100vw - 28px));max-width:780px;max-height:calc(100dvh - 36px);
  padding:0;border-radius:18px;overflow:hidden;background:#fff}
.review-edit-form{margin:0;display:flex;flex-direction:column;max-height:calc(100dvh - 38px)}
.review-edit-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  padding:22px 28px 18px;border-bottom:1px solid var(--line);flex-shrink:0}
.review-edit-header .eyebrow{margin:0 0 7px;max-width:540px;line-height:1.6}
.review-edit-header h2{margin:0;font-size:21px}
.review-edit-close{width:34px;height:34px;padding:0;font-size:20px;line-height:1;border-radius:9px}
.review-edit-body{overflow-y:auto;min-height:0;padding:24px 28px;overscroll-behavior:contain}
.review-edit-score{display:grid;grid-template-columns:180px minmax(0,1fr);gap:22px;align-items:start;
  background:var(--soft-2);border:1px solid var(--line-soft);padding:18px 20px;border-radius:12px;margin-bottom:22px}
.review-edit-form label{display:block;margin:0;font-size:13px;font-weight:650;line-height:1.6}
.review-edit-form textarea{font-size:14px;font-weight:400;line-height:1.75;padding:12px 14px;margin-top:8px;min-height:84px}
.review-score-input{display:flex;align-items:center;gap:10px;margin-top:8px}
.review-edit-form .review-score-input input{width:104px;min-width:0;margin:0;padding:10px 12px;font-size:19px;font-weight:600}
.review-score-input>span{white-space:nowrap;color:var(--muted);font-size:13.5px;font-weight:500}
.review-edit-feedback{display:grid;gap:20px}
.review-edit-actions{display:flex;justify-content:flex-end;gap:10px;padding:16px 28px;background:#FAFCFF;
  border-top:1px solid var(--line);flex-shrink:0}
.review-edit-actions button{min-width:104px}

/* ---------- 18. Rubric / scoring editor skin (over scoring.css) ---------- */
.score-workspace{max-width:1200px}
.score-back{color:var(--muted)}
.score-page-head h1{color:var(--navy)}
.score-toolbar{background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);
  padding:14px 18px;margin:16px 0}
.score-state{background:var(--soft);color:var(--blue);border-radius:999px;font-weight:650}
.score-table-scroll{border-color:var(--line);border-radius:12px;scrollbar-color:#BCCBDF #F1F5F9}
.score-table th{background:#F8FAFD;color:var(--muted)}
.score-table td{border-color:var(--line-soft)}
.score-section-head h2{color:var(--navy)}
.score-workspace .score-cell,.assignment-form .score-cell{color:var(--navy)}
.score-workspace .score-cell:hover{background:var(--soft-2)}
.score-workspace .score-cell:focus{background:#fff;border-color:var(--blue);outline:2px solid rgba(49,93,168,.18)}
.score-workspace .score-add:hover,.new-scoring .score-add:hover{background:var(--soft);color:var(--blue)}
.score-workspace .score-delete:hover,.new-scoring .score-delete:hover{background:var(--danger-soft);color:var(--danger)}
.score-levels summary{color:var(--blue)}
.score-json{border-color:var(--line)}
#rules-error{color:var(--danger)}
#rules-error:not(:empty){background:var(--danger-soft);border:1px solid #E7C4C4;border-radius:10px;padding:12px 16px;font-size:13px;margin:14px 0}
.score-structure-tip{background:var(--soft-2);border-color:var(--line);color:var(--muted)}
.score-structure-tip strong,.score-structure-tip .score-hierarchy{color:var(--blue)}
#save-state:not(:empty){color:var(--warn);font-weight:600}

/* New-assignment builder */
.assignment-form.panel{padding:28px 30px}
.assignment-form fieldset{border:0;margin:0 0 6px;padding:0}
.form-section-title{display:flex;align-items:baseline;gap:12px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  font-weight:700;color:var(--faint);margin:26px 0 16px;padding-top:22px;border-top:1px solid var(--line-soft)}
.form-section-title:first-of-type{margin-top:0;padding-top:0;border-top:0}
.rubric-builder-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 16px}
.rubric-builder-head h2{font-size:17px}
.rubric-editor{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:16px;background:#FBFCFE;
  border:1px solid var(--line);border-radius:12px;padding:20px;margin-bottom:14px}
.rubric-editor>div{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:0 18px;min-width:0}
.rubric-editor>div label:last-child{grid-column:1/-1;margin-bottom:0}
.rubric-editor label{margin-bottom:14px}
.rubric-editor>button{align-self:start}
.criterion-number{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--soft);
  color:var(--blue);font-size:12.5px;font-weight:700;margin-top:2px}
.new-scoring{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px 24px;margin:20px 0}
.new-scoring>summary{color:var(--blue);font-size:14px}
.new-scoring>.hint{margin:14px 0 20px;max-width:80ch;line-height:1.8}
.new-scoring .support-section{box-shadow:none;background:var(--soft-2)}
.assignment-form>button[type=submit]{margin-top:10px;padding:12px 26px}
#json-editor{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;line-height:1.7}

/* ---------- 19. Submission files pages ---------- */
.submission-detail-page .submission-detail-head{display:flex;justify-content:space-between;align-items:flex-start;
  gap:20px;margin:0 0 24px;flex-wrap:wrap}
.submission-detail-head>div{min-width:0;flex:1}
.submission-detail-head h1{margin:0 0 10px}
.submission-owner{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px;padding:22px 26px;margin:0 0 22px}
.submission-owner h3{margin:6px 0 2px}
.submission-owner p{margin:0;overflow-wrap:anywhere;color:var(--muted);font-size:14px}
.submission-detail-page>h2{margin:0 0 14px;font-size:18px}
.submitted-file-list{display:grid;gap:14px;margin:0 0 26px}
.submitted-file{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px 24px;padding:18px 22px}
.submitted-file>div{flex:1;min-width:0}
.submitted-file b{display:block;line-height:1.6;overflow-wrap:anywhere}
.submitted-file small{display:block;margin-top:4px}
.file-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.submission-text{padding:24px 28px;margin-top:0}
.submission-text .section-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:18px;margin:0 0 18px}
.submission-text .section-head h2{margin:0 0 8px;font-size:18px}
.submission-text .section-head p{margin:0}
.text-preview-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}
pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.85;max-height:480px;overflow:auto;
  background:var(--soft-2);border:1px solid var(--line-soft);border-radius:11px;padding:18px 20px;margin:10px 0}
.submission-text pre{white-space:pre;overflow:auto;max-height:560px;margin:0}

/* ---------- 20. Materials library (student) ---------- */
.deadline-section{margin:0 0 26px;padding:22px 26px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow)}
.deadline-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.deadline-heading h2{font-size:18px;margin:4px 0 0}
.deadline-heading .eyebrow{margin:0}
.deadline-scroll{overflow-x:auto;scrollbar-width:thin;margin-top:20px}
.deadline-track{display:flex;list-style:none;padding:0;margin:0;min-width:100%;width:max-content}
.deadline-item{position:relative;flex:0 0 280px;width:280px;padding:18px 26px 10px 0;border-top:2px solid var(--line)}
.deadline-dot{position:absolute;top:-6px;left:0;width:10px;height:10px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 4px #fff}
.deadline-item.soon .deadline-dot{background:#C08A1C}
.deadline-item.past .deadline-dot{background:#AEB9C8}
.deadline-item.unscheduled{border-top-style:dashed}
.deadline-date{font-size:12px;color:var(--muted);margin:0 0 10px}
.deadline-item>a{display:block;color:var(--navy);font-size:14px;line-height:1.6;text-decoration:none;font-weight:550}
.deadline-item>a:hover{color:var(--blue);text-decoration:underline}
.deadline-badges{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px}
.deadline-controls{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:20px}
.deadline-views,.deadline-navigation{display:flex;gap:4px;align-items:center}
.deadline-views{padding:4px;background:var(--soft-2);border-radius:10px}
.deadline-controls button{padding:7px 13px;border:0;background:transparent;color:var(--muted);border-radius:7px;font-size:12.5px;min-height:32px}
.deadline-views button.active{background:#fff;color:var(--blue);box-shadow:0 1px 4px rgba(25,43,69,.12)}
.deadline-controls button:hover{background:var(--soft);color:var(--blue)}
.deadline-range{font-size:13.5px;color:var(--muted);margin:18px 0 14px}
.deadline-chart-scroll{overflow-x:auto;scrollbar-width:none;padding:6px 0}
.deadline-chart-scroll::-webkit-scrollbar{display:none}
.deadline-chart{display:grid;grid-template-columns:repeat(var(--bins),minmax(34px,1fr));min-width:550px}
.deadline-chart[data-zoom=week]{grid-template-columns:repeat(var(--bins),minmax(88px,1fr));width:max-content;min-width:100%}
.deadline-chart[data-zoom=month]{grid-template-columns:repeat(var(--bins),minmax(150px,1fr));width:max-content;min-width:100%}
.deadline-chart[data-zoom=semester]{grid-template-columns:repeat(var(--bins),minmax(190px,1fr));width:max-content;min-width:100%}
.deadline-time-cell{position:relative;display:flex;align-items:center;flex-direction:column;gap:12px;padding:8px 0 16px;min-height:106px}
.deadline-time-cell:before{content:'';position:absolute;top:58px;width:100%;height:2px;background:var(--line)}
.deadline-tick{font-size:10px;color:var(--faint);white-space:nowrap}
.deadline-time-cell button.deadline-bubble{z-index:1;display:grid;place-items:center;width:28px;height:28px;min-height:0;
  padding:0;background:var(--blue);color:#fff;border:3px solid #fff;border-radius:50%;font-size:11px}
.deadline-time-cell button.deadline-bubble.is-empty,.deadline-time-cell button.deadline-bubble:disabled{background:var(--soft-2);color:#A9B8CB;opacity:1}
.deadline-time-cell button.deadline-bubble:hover:not(:disabled),.deadline-time-cell button.deadline-bubble.selected{background:var(--navy);outline:3px solid var(--soft)}
.deadline-time-cell.is-today{background:var(--soft-2);border-radius:8px}
.deadline-time-cell.is-focused .deadline-bubble{outline:3px solid var(--soft);background:var(--blue-dark)}
.deadline-time-cell small{font-size:9px;color:var(--blue)}
.deadline-chart-hint{font-size:12px;margin:6px 0 18px}
.deadline-day-view{padding-top:8px;scrollbar-width:none}
.deadline-day-view::-webkit-scrollbar{display:none}
.deadline-day-view .deadline-item.is-focused{border-top-color:var(--blue)}
.deadline-day-view .deadline-item.is-focused .deadline-dot{background:var(--blue-dark)}
.deadline-explorer .deadline-chart-scroll[hidden],.deadline-explorer .deadline-day-view[hidden],
.deadline-explorer .deadline-chart-hint[hidden],.deadline-explorer>p[hidden]{display:none!important}

.material-library-tools{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:22px 0 10px;flex-wrap:wrap}
.material-type-filters{display:flex;flex-wrap:wrap;gap:8px}
.material-type-filters button{background:#fff;color:var(--muted);border:1px solid var(--line);font-size:12.5px;padding:8px 14px;border-radius:999px}
.material-type-filters button:hover{background:var(--soft);color:var(--blue);border-color:#C9D8EE}
.material-type-filters button.active{background:var(--blue);border-color:var(--blue);color:#fff}
.material-search{flex:0 1 280px;min-width:220px;font-size:12.5px;color:var(--muted);margin:0}
.material-unit,.student-unit{border:1px solid var(--line);border-radius:var(--radius);margin:16px 0;background:var(--card);box-shadow:var(--shadow);overflow:hidden}
.student-unit>summary{display:flex;align-items:center;gap:13px;padding:18px 22px;cursor:pointer;list-style:none}
.student-unit>summary::-webkit-details-marker{display:none}
.student-unit>summary:hover{background:#FAFCFF}
.student-unit>summary .badge{margin-left:auto}
.unit-stack-icon{font-size:20px;color:var(--blue)}
.student-unit>.student-material-grid{padding:0 18px 18px}
.student-material-grid{display:grid;gap:12px;align-items:start}
.library-file{margin:0;background:#FBFCFE;border:1px solid var(--line-soft);border-radius:12px;overflow:hidden}
.library-file>summary{display:flex;align-items:center;gap:14px;padding:15px 18px;cursor:pointer;list-style:none}
.library-file>summary::-webkit-details-marker{display:none}
.library-file>summary:hover{background:var(--soft-2)}
.library-file[open]{border-color:#C3D4EC;background:#fff}
.library-file>summary>div{min-width:0;flex:1}
.library-file>summary b{font-size:14px;font-weight:600;display:block;line-height:1.5;overflow-wrap:anywhere}
.library-file>summary small{font-size:12px;margin-top:3px;display:block}
.file-type-mark{display:grid;place-items:center;flex:0 0 42px;height:44px;border-radius:9px;background:var(--soft);color:var(--blue);font-size:10px;font-weight:700;letter-spacing:.04em}
.material-expand{font-size:17px;color:var(--faint);transition:transform .15s}
.library-file[open] .material-expand{transform:rotate(45deg)}
.material-preview{padding:0 18px 16px}
.material-actions{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin:4px 0 10px}
.material-actions .button{font-size:13px;padding:8px 15px}
#material-no-results button{display:block;margin:14px auto 0}

/* ---------- 21. Questions database (teacher) ---------- */
.notion-database{border:1px solid var(--line);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);margin:16px 0;overflow:hidden}
.database-title{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 24px;list-style:none;cursor:pointer}
.database-title::-webkit-details-marker{display:none}
.database-title:hover{background:#FAFCFF}
.database-title h3{margin:0;font-size:16px}
.database-title .eyebrow{margin-bottom:5px}
.database-summary-meta{display:flex;align-items:center;gap:12px}
.collapse-chevron{font-size:19px;color:var(--faint);transform:rotate(90deg);transition:transform .15s;display:inline-block}
.notion-database[open] .collapse-chevron{transform:rotate(-90deg)}
.notion-database>.table-scroll{border:0;border-top:1px solid var(--line-soft);border-radius:0;box-shadow:none}
.question-table td{vertical-align:top}
.question-comment{display:block;margin-top:4px;white-space:normal;max-width:44ch;line-height:1.65}
.inline-resolution{display:flex;gap:8px;align-items:center;margin:0 0 8px}
.inline-resolution input{width:240px;margin:0;padding:8px 12px;font-size:13px}
.inline-resolution button{font-size:13px;padding:8px 14px}
.table-link{font-size:13px}

/* ---------- 22. Guide ---------- */
.usage-guide{max-width:920px;margin:0 auto}
.guide-intro{max-width:70ch;color:var(--muted);line-height:1.8}
.guide-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 30px}
.guide-section{scroll-margin-top:90px;margin:36px 0}
.guide-section>h2{font-size:24px;margin:8px 0 18px}
.guide-steps{list-style:none;padding:0;margin:0;counter-reset:guide}
.guide-steps>li{counter-increment:guide;position:relative;padding:22px 26px 22px 72px;margin:0 0 16px;
  border:1px solid var(--line);border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow)}
.guide-steps>li:before{content:counter(guide,decimal-leading-zero);position:absolute;left:22px;top:23px;
  color:var(--blue);font-size:16px;font-weight:700}
.guide-steps h3{margin:0 0 12px;font-size:16px}
.guide-path{display:flex;flex-wrap:wrap;align-items:center;gap:8px;line-height:1.9}
.guide-path b{font-size:12.5px;font-weight:600;padding:4px 10px;border-radius:7px;background:var(--soft);color:var(--blue)}
.guide-path span{color:var(--faint)}
.guide-steps p{font-size:13.5px;line-height:1.8;color:var(--muted);margin:12px 0 0}
.guide-note{padding:18px 22px;background:var(--soft-2);border:1px solid var(--line);border-radius:12px;
  font-size:13.5px;line-height:1.8;color:var(--muted)}
.guide-note strong{color:var(--navy)}
.secondary-link{font-size:13px;color:var(--muted)}

/* ---------- 23. Math ---------- */
.katex-display{max-width:100%;overflow-x:auto;overflow-y:hidden;padding:8px 2px;scrollbar-width:thin}

/* ---------- 24. Workspace density tweak (interface-v3.js hook) ---------- */
.workspace-v3 main{padding-top:22px}
.workspace-v3 footer{display:none}

/* ---------- 25. Entrance animation ---------- */
.gallery-card,.grading-card,.panel,.chapter-group{animation:rise .35s ease both}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- 26. Responsive ---------- */
@media(max-width:960px){
  .landing-hero{grid-template-columns:1fr;gap:30px;padding:28px 0 36px}
  .principle-grid{grid-template-columns:1fr 1fr}
  .grading-body{grid-template-columns:1fr}
  .grading-body>section+section{border-left:0;border-top:1px solid var(--line-soft)}
  .assignment-workspace{grid-template-columns:1fr}
  .assignment-submit{position:static}
  .workspace-grid{grid-template-columns:1fr}
  .role-paths{grid-template-columns:1fr}
}
@media(max-width:700px){
  main{padding:20px 16px 56px}
  .site-header{gap:12px;padding:10px 16px;flex-wrap:wrap}
  .site-nav{display:none}
  .identity{font-size:12px}
  .identity small{display:none}
  .brand{font-size:16px}
  .principle-grid{grid-template-columns:1fr}
  .two{grid-template-columns:1fr}
  .page-head,.section-head,.grading-head{gap:14px}
  .assignment-block{padding:18px}
  .assignment-card-head{grid-template-columns:1fr;gap:14px}
  .assignment-card-head .assignment-actions{justify-content:flex-start;width:100%}
  .grading-head,.grading-body>section,.grading-footer{padding:16px 18px}
  .grading-footer>div:first-child{flex-basis:100%}
  .grading-footer .table-actions{width:100%;justify-content:space-between;gap:8px}
  .review-toolbar{padding:12px 14px}
  .bulk-actions{width:100%}
  .bulk-actions>button,.bulk-actions .approve-all-form{flex:1}
  .bulk-actions .approve-all-form button{width:100%}
  .bulk-actions>button{padding-inline:10px;font-size:12.5px}
  .criterion-navigation{flex-wrap:wrap;gap:8px}
  .criterion-tabs{order:4;flex-basis:100%}
  .criterion-count{margin-left:auto}
  .review-track>.grading-card{height:64dvh}
  .teacher-review-page .review-track>.grading-card{height:66dvh}
  .chapter-group>summary{padding:16px 18px;font-size:15.5px}
  .chapter-assignments{padding:4px 10px 12px}
  .rubric-editor{grid-template-columns:minmax(0,1fr);gap:12px;padding:16px}
  .rubric-editor>div{grid-template-columns:1fr}
  .rubric-editor>button{justify-self:start}
  .upload-row>button{align-self:flex-start}
  .inline-resolution{flex-wrap:wrap}
  .inline-resolution input{width:100%;flex:1 1 180px}
  .english-file-picker{flex-wrap:wrap}
  .submission-text .section-head{grid-template-columns:1fr}
  .review-edit-score{grid-template-columns:1fr;gap:16px;padding:16px}
  .review-edit-header{padding:18px 18px 14px}
  .review-edit-body{padding:18px}
  .review-edit-actions{padding:14px 18px}
  .review-edit-actions button{flex:1;min-width:0}
  .deadline-item{width:250px;flex-basis:250px}
  .material-library-tools{flex-direction:column;align-items:stretch;gap:14px}
  .material-search{flex:auto;min-width:0}
  .guide-steps>li{padding:18px 16px 18px 56px}
  .guide-steps>li:before{left:16px;top:19px;font-size:14px}
  .score-hero{padding:16px 18px}
  footer{flex-wrap:wrap;gap:8px;padding:18px 16px 28px}
}