/* Student assignment reference layout. Isolated from the teacher workspace. */
.content:has(#at-live-role-panel > .at-sa) > .heading { display:none; }
.card:has(> #at-live-role-panel > .at-sa) { padding:0; border:0; background:transparent; box-shadow:none; }
.at-sa { --sa-purple:#7c10e8; --sa-ink:#2c2146; --sa-muted:#838ca0; display:grid; gap:24px; width:100%; margin:auto; color:var(--sa-ink); }
.at-sa .at-sa-icon { width:23px; height:23px; flex:none; display:inline-block; vertical-align:middle; }
.at-sa .at-sa-hero { position:relative; min-height:150px; display:flex; align-items:center; justify-content:space-between; gap:24px; overflow:hidden; padding:6px 8px 0; }
.at-sa .at-sa-hero h2 { margin:0 0 12px; font-size:clamp(25px,2.5vw,32px); font-weight:700; line-height:1.5; color:#2b2045; }
.at-sa .at-sa-hero p { margin:0; color:var(--sa-muted); font-size:17px; line-height:1.8; }
.at-sa .at-sa-art { width:365px; height:172px; flex:none; object-fit:contain; margin-block:-16px -14px; object-position:center; }
.at-sa .at-sa-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:stretch; padding:14px 18px; gap:0; border:1.5px solid #e5dcff; border-radius:22px; background:#fbfaff; box-shadow:0 9px 24px #6747b409; }
body[data-workspace] #at-live-role-panel .at-sa .at-sa-tabs button { display:flex; align-items:center; justify-content:center; gap:15px; min-height:68px; margin:0; padding:12px 16px; border:0; border-inline-end:1px solid #ece6f8; border-radius:0; box-shadow:none; background:#fff; color:#423454; font:inherit; font-size:17px; font-weight:600; cursor:pointer; }
body[data-workspace] #at-live-role-panel .at-sa .at-sa-tabs button:last-child { border-inline-end:0; border-radius:16px 0 0 16px; }
body[data-workspace] #at-live-role-panel .at-sa .at-sa-tabs button:first-child { border-radius:16px; }
body[data-workspace] #at-live-role-panel .at-sa .at-sa-tabs button:hover { background:#f7f1ff; color:#6427ad; box-shadow:none; }
body[data-workspace] #at-live-role-panel .at-sa .at-sa-tabs button[aria-selected="true"] { background:linear-gradient(106deg,#169edc 0%,#7040e4 55%,#9600e6 100%); color:#fff; border:0; border-radius:16px; box-shadow:0 5px 14px #7854dc18; }
.at-sa .at-sa-tabs .at-sa-icon { width:27px; height:27px; }
.at-sa .at-sa-tabs [data-assignment-filter="grid"] .at-sa-icon { fill:currentColor; }
.at-sa .at-sa-tabs [data-assignment-filter="all"] .at-sa-icon { fill:currentColor; stroke:none; }
.at-sa .at-sa-tabs [data-assignment-filter="todo"] .at-sa-icon { color:#ff6b78; }
.at-sa .at-sa-tabs [data-assignment-filter="submitted"] .at-sa-icon { color:#0999df; }
.at-sa .at-sa-tabs [data-assignment-filter="reviewed"] .at-sa-icon { color:#37a245; }
.at-sa .at-sa-tabs [data-assignment-filter="reviewed"] circle { fill:#43b452; stroke:#43b452; }
.at-sa .at-sa-tabs [data-assignment-filter="reviewed"] path { stroke:white; }
.at-sa .at-sa-tabs button[aria-selected="true"] .at-sa-icon { color:white; }
.at-sa .at-sa-tabs button b { display:grid; place-items:center; width:35px; height:35px; flex:none; margin-inline-start:12px; border-radius:50%; background:#f1eaff; color:#7443cc; font-size:19px; font-weight:700; }
.at-sa .at-sa-tabs [data-assignment-filter="todo"] b { background:#ffedf0; color:#fc596c; }
.at-sa .at-sa-tabs [data-assignment-filter="submitted"] b { background:#e5f5ff; color:#0a9de4; }
.at-sa .at-sa-tabs [data-assignment-filter="reviewed"] b { background:#e9f7e9; color:#359b43; }
.at-sa .at-sa-tabs button[aria-selected="true"] b { background:#fff; color:#7b46d2; }
.at-sa .at-sa-list { display:grid; gap:22px; }
.at-sa .at-sa-card { display:grid; gap:18px; min-width:0; padding:24px; border:1.5px solid #e5dcff; border-radius:23px; background:linear-gradient(130deg,#fff 60%,#fcfaff); box-shadow:0 7px 25px #51368706; }
.at-sa .at-sa-card-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.at-sa .at-sa-course { display:flex; align-items:center; gap:20px; min-width:0; }
.at-sa .at-sa-course-icon { width:65px; height:65px; flex:none; display:grid; place-items:center; border-radius:17px; background:linear-gradient(135deg,#f0e7ff,#eee8ff); color:#7f19eb; }
.at-sa .at-sa-course-icon .at-sa-icon { width:33px; height:33px; stroke-width:2.3; filter:drop-shadow(0 3px 1px #8d51e52b); }
.at-sa .at-sa-course h3 { margin:0; font-size:25px; font-weight:700; line-height:1.5; overflow-wrap:anywhere; color:var(--sa-ink); }
.at-sa .at-sa-status { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:8px 13px; border-radius:13px; background:#fff4df; color:#b68025; font-size:16px; font-weight:700; white-space:nowrap; }
.at-sa .at-sa-status.is-reviewed { background:#eaf8ed; color:#2d8a37; }
.at-sa .at-sa-status.is-reviewed circle { fill:#3ba148; stroke:#3ba148; }
.at-sa .at-sa-status.is-reviewed path { stroke:white; }
.at-sa .at-sa-status.is-submitted { background:#e7f5ff; color:#158bc4; }
.at-sa .at-sa-meta { display:flex; align-items:center; flex-wrap:wrap; gap:18px; margin-top:-11px; padding-inline-start:85px; font-size:16px; color:#685d80; line-height:1.8; }
.at-sa .at-sa-meta span { display:inline-flex; align-items:center; gap:9px; }
.at-sa .at-sa-meta .at-sa-icon { width:20px; height:20px; color:#7f7197; }
.at-sa .at-sa-meta i { display:block; width:1px; height:24px; background:#d9cce9; }
.at-sa .at-sa-instructions { padding:0; margin:0; white-space:pre-wrap; font-size:15px; line-height:1.9; color:#776d8a; overflow-wrap:anywhere; }
.at-sa .at-sa-file-panel { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:110px; padding:18px 22px; border:1.5px solid #e8dfff; border-radius:18px; background:linear-gradient(115deg,#f9f6ff,#f9f5ff); }
body[data-workspace] #at-live-role-panel .at-sa .at-sa-file-button { display:inline-flex; align-items:center; justify-content:center; gap:16px; min-height:57px; padding:12px 22px; margin:0; border:1px solid #9e34ff; border-radius:15px; background:linear-gradient(110deg,#8500ed,#730ce7); color:white; font:inherit; font-size:17px; font-weight:600; box-shadow:0 4px 9px #8a2ee51c; cursor:pointer; white-space:nowrap; }
body[data-workspace] #at-live-role-panel .at-sa .at-sa-file-button:hover { background:linear-gradient(110deg,#7300d7,#6500cd); color:white; border-color:#8e25f4; box-shadow:0 6px 15px #7b27dd29; }
.at-sa .at-sa-file-button .at-sa-icon { width:25px; height:25px; }
.at-sa .at-sa-file-info { display:flex; align-items:center; gap:18px; min-width:0; direction:ltr; }
.at-sa .at-sa-document { display:grid; place-items:center; width:62px; height:62px; flex:none; border-radius:19px; background:white; color:#7c16df; box-shadow:0 3px 12px #8f5ecb07; }
.at-sa .at-sa-document .at-sa-icon { width:34px; height:34px; stroke-width:2.1; }
.at-sa .at-sa-file-info b { display:flex; align-items:center; gap:8px; font-size:16px; color:#302447; line-height:1.7; }
.at-sa .at-sa-file-info b .at-sa-icon { width:20px; height:20px; color:#9628e8; fill:#9628e8; }
.at-sa .at-sa-file-info b .at-sa-icon path+path { stroke:white; }
.at-sa .at-sa-file-info small { display:block; margin-top:3px; color:#9195a7; font-size:16px; max-width:430px; overflow-wrap:anywhere; line-height:1.5; }
.at-sa .at-sa-feedback { display:grid; gap:17px; margin:0; padding:18px 22px; border:1.5px solid #e8dfff; border-radius:19px; background:linear-gradient(115deg,#f8f4ff,#f9f7ff); }
.at-sa .at-sa-feedback-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:62px; }
.at-sa .at-sa-teacher { display:flex; align-items:center; gap:18px; direction:ltr; }
.at-sa .at-sa-teacher-avatar { display:grid; place-items:center; flex:none; width:63px; height:63px; border-radius:50%; background:#ecebf1; font-size:44px; line-height:1; }
.at-sa .at-sa-teacher b { display:flex; align-items:center; gap:8px; font-size:17px; color:#302447; }
.at-sa .at-sa-teacher b .at-sa-icon { width:21px; height:21px; color:#9222e4; }
.at-sa .at-sa-teacher small { display:block; margin-top:4px; color:#9290a5; font-size:14px; direction:rtl; text-align:start; }
.at-sa .at-sa-rating { display:flex; align-items:center; gap:18px; direction:ltr; }
.at-sa .at-sa-rating strong { color:#7d12e5; font-size:25px; line-height:1; white-space:nowrap; }
.at-sa .at-sa-stars { display:flex; gap:3px; line-height:1; }
.at-sa .at-sa-stars i { color:#d7cee7; font-size:39px; font-style:normal; text-shadow:0 1px 1px #91849f0a; }
.at-sa .at-sa-stars i.earned { color:#ffbd1c; text-shadow:0 2px 1px #cf971c20; }
.at-sa .at-sa-feedback-message { min-width:0; padding:17px 21px; border:1px solid #eee7fc; border-radius:17px; background:#ffffffed; }
.at-sa .at-sa-feedback-message h4 { margin:0 0 8px; color:#7c24db; font-size:18px; font-weight:700; line-height:1.8; }
.at-sa .at-sa-feedback-message h4:last-child { margin-bottom:0; }
.at-sa .at-sa-feedback-message p { margin:0; color:#8b879e; font-size:16px; line-height:2; white-space:pre-wrap; overflow-wrap:anywhere; }
.at-sa .at-sa-submit-row { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:15px 0 0; color:#877b9b; font-size:14px; }
.at-sa .at-sa-awaiting { display:flex; align-items:flex-start; gap:14px; padding:18px; border:1px solid #dceeff; border-radius:16px; color:#4585a2; background:#f3faff; }
.at-sa .at-sa-awaiting b,.at-sa .at-sa-awaiting span { display:block; }
.at-sa .at-sa-awaiting span { margin-top:5px; font-size:13px; color:#8191a2; }
.at-sa .at-sa-awaiting p { margin:8px 0 0; font-size:14px; }
.at-sa .at-sa-empty { display:grid; justify-items:center; gap:9px; padding:28px; border:1px dashed #ddd1f1; border-radius:20px; background:#fdfbff; text-align:center; }
.at-sa .at-sa-empty > span { display:grid; place-items:center; width:56px; height:56px; border-radius:18px; background:#f0e6ff; color:#8c49da; }
.at-sa .at-sa-empty > span .at-sa-icon { width:30px; height:30px; }
.at-sa .at-sa-empty h3 { margin:0; font-size:19px; }
.at-sa .at-sa-empty p { margin:0; color:#8b809a; font-size:14px; }
body[data-workspace] #at-live-role-panel .at-sa .at-sa-empty button { margin-top:8px; padding:9px 18px; border:1px solid #d5bcf5; border-radius:10px; background:white; color:#7e37d1; }
.at-sa [hidden] { display:none!important; }
.at-sa button:focus-visible { outline:3px solid #c39bee; outline-offset:3px; }
@media(max-width:1000px){
  .at-sa .at-sa-art{width:290px;height:151px}.at-sa .at-sa-tabs{padding:10px}.at-sa .at-sa-tabs button{gap:9px}.at-sa .at-sa-tabs button b{margin-inline-start:0}
  body[data-workspace] #at-live-role-panel .at-sa .at-sa-tabs button{font-size:15px;padding:10px;gap:9px}
  .at-sa .at-sa-file-info small{max-width:270px}.at-sa .at-sa-meta{font-size:14px}.at-sa .at-sa-feedback-heading{gap:15px}.at-sa .at-sa-teacher{gap:10px}.at-sa .at-sa-rating{gap:10px}.at-sa .at-sa-stars i{font-size:30px}.at-sa .at-sa-rating strong{font-size:22px}.at-sa .at-sa-teacher-avatar{width:49px;height:49px;font-size:35px}.at-sa .at-sa-teacher small{font-size:12px}
}
@media(max-width:650px){
  .at-sa{gap:17px}.at-sa .at-sa-hero{gap:5px;min-height:120px}.at-sa .at-sa-hero h2{font-size:24px;margin-bottom:6px}.at-sa .at-sa-hero p{font-size:13px}.at-sa .at-sa-art{width:160px;height:127px;margin-inline-end:-18px}.at-sa .at-sa-tabs{grid-template-columns:repeat(2,minmax(0,1fr));padding:7px;border-radius:17px;gap:4px}.at-sa .at-sa-tabs button b{width:29px;height:29px;font-size:16px}.at-sa .at-sa-tabs .at-sa-icon{width:23px;height:23px}
  body[data-workspace] #at-live-role-panel .at-sa .at-sa-tabs button{min-height:52px;padding:8px;font-size:14px;border:0;border-radius:12px}
  .at-sa .at-sa-card{padding:16px;gap:15px;border-radius:18px}.at-sa .at-sa-course{gap:11px}.at-sa .at-sa-course-icon{width:47px;height:47px;border-radius:13px}.at-sa .at-sa-course-icon .at-sa-icon{width:28px;height:28px}.at-sa .at-sa-course h3{font-size:20px}.at-sa .at-sa-status{padding:7px 9px;font-size:12px;gap:6px}.at-sa .at-sa-status .at-sa-icon{width:19px;height:19px}.at-sa .at-sa-meta{padding-inline-start:0;margin:0;gap:8px;font-size:12px}.at-sa .at-sa-meta i{height:18px}.at-sa .at-sa-meta .at-sa-icon{width:16px;height:16px}
  .at-sa .at-sa-file-panel{flex-direction:column-reverse;align-items:stretch;padding:14px;gap:14px;min-height:0}.at-sa .at-sa-file-info{gap:12px}.at-sa .at-sa-document{width:48px;height:48px;border-radius:13px}.at-sa .at-sa-document .at-sa-icon{width:29px;height:29px}.at-sa .at-sa-file-info b{font-size:14px}.at-sa .at-sa-file-info small{font-size:12px;max-width:230px}
  body[data-workspace] #at-live-role-panel .at-sa .at-sa-file-button{min-height:45px;font-size:14px;padding:10px 14px;border-radius:12px}
  .at-sa .at-sa-feedback{padding:14px;gap:14px}.at-sa .at-sa-feedback-heading{flex-direction:column-reverse;align-items:stretch;gap:15px}.at-sa .at-sa-rating{justify-content:flex-end}.at-sa .at-sa-teacher b{font-size:15px}.at-sa .at-sa-feedback-message{padding:14px}.at-sa .at-sa-feedback-message h4{font-size:15px}.at-sa .at-sa-feedback-message p{font-size:14px}.at-sa .at-sa-submit-row{flex-direction:column;align-items:stretch}.at-sa .at-sa-submit-row>span{font-size:12px;text-align:center}
}
