:root{
 --green:#0b4b3a;--green2:#12644d;--cream:#f8f3e8;--paper:#fffdf8;--gold:#c79a3b;
 --goldsoft:#f4e6c4;--ink:#18332b;--muted:#6e7d76;--line:#e5ddcf;--blue:#edf3f7;
 --peach:#faeee7;--mint:#edf5ef;--shadow:0 16px 42px rgba(45,38,27,.10)
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Calibri,"Segoe UI",Arial,sans-serif;background:var(--cream);color:var(--ink)}
body{direction:rtl}button,input,select,textarea{font:inherit}button,a{cursor:pointer}a{text-decoration:none;color:inherit}
.shell{display:grid;grid-template-columns:minmax(0,1fr) 246px;grid-template-areas:"content rail";direction:ltr;min-height:100vh}
.rail{grid-area:rail;direction:rtl;background:linear-gradient(180deg,#073b2e,var(--green),#073b2e);color:#fff;padding:20px 16px;display:flex;flex-direction:column;gap:18px}
.brand{display:flex;align-items:center;gap:10px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.13)}
.brand img{width:72px;height:72px;border-radius:16px;background:#fff9ee;object-fit:contain}
.brand strong{display:block;font-size:20px;color:#f1d694}.brand small{font-size:11px;opacity:.76}
.student{display:flex;gap:10px;align-items:center;padding:12px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:14px}
.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--goldsoft);color:var(--green);font-weight:900}
.nav{display:grid;gap:7px}.nav a{min-height:44px;padding:10px 12px;border-radius:11px;display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.82);font-weight:650}
.nav a:hover:not(.active):not(.is-active){background:rgba(255,255,255,.10)}.nav a.active,.nav a.is-active,.nav a.active:hover,.nav a.is-active:hover{background:#fff8ea;color:var(--green)}
.content{grid-area:content;direction:rtl;min-width:0;padding:24px 28px 34px}
.mobile-head{display:none}
.topline{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}
.eyebrow{color:var(--gold);font-weight:800;font-size:12px}.topline h1{margin:3px 0 4px;font-size:28px;color:var(--green)}
.muted{color:var(--muted);font-size:13px}.pill{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 12px;font-size:12px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:18px;box-shadow:0 8px 24px rgba(51,43,31,.04)}
.primary{border:0;border-radius:11px;background:var(--green);color:white;min-height:44px;padding:10px 16px;font-weight:800}
.secondary{border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--green);min-height:44px;padding:10px 15px;font-weight:750}
.progress{height:8px;background:#eae4d9;border-radius:999px;overflow:hidden}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--green2),var(--gold))}
.continue-card{padding:20px;display:grid;grid-template-columns:1fr 220px;gap:18px;background:linear-gradient(135deg,#fffdf8,#edf5ef)}
.continue-card h2{margin:4px 0 5px;font-size:23px;color:var(--green)}.continue-card .course-art{border-radius:15px;background:linear-gradient(145deg,#0e4e3c,#1a7158 68%,#d1a34d);color:#fff;display:grid;place-items:center;text-align:center;min-height:160px;font-size:24px;font-weight:900}
.actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:14px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}.stat{padding:14px 16px}.stat span{font-size:12px;color:var(--muted)}.stat b{display:block;color:var(--green);font-size:20px;margin-top:4px}
.section-title{display:flex;align-items:center;justify-content:space-between;margin:22px 0 10px}.section-title h2{margin:0;font-size:18px;color:var(--green)}
.course-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.course-card{padding:17px}.course-card h3{margin:0 0 6px;color:var(--green)}.course-card .row{display:flex;justify-content:space-between;gap:12px;margin-top:10px;font-size:12px;color:var(--muted)}
.next-step{padding:17px;background:#f7ead0;border-color:#ead3a5}
.course-hero{padding:20px;display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:18px}.course-hero .art{border-radius:16px;background:linear-gradient(140deg,#0d4d3b,#1b7359);color:#fff;display:grid;place-items:center;min-height:155px;font-size:23px;font-weight:900}
.units{display:grid;gap:14px}.unit{padding:15px}.unit h3{margin:0 0 10px;color:var(--green)}.lesson-row{display:grid;grid-template-columns:40px minmax(0,1fr) 90px 120px;gap:10px;align-items:center;padding:11px;border-top:1px solid #eee8dd}.lesson-row:first-of-type{border-top:0}.lesson-state{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#eef3ef}.lesson-row.current{background:#eef5ef;border-radius:12px}.lesson-row.locked{opacity:.55}.lesson-title b{display:block}.lesson-title small{color:var(--muted)}
.lesson-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:16px;align-items:start}
.lesson-main{min-width:0}.lesson-side{position:sticky;top:16px;padding:14px}.lesson-side h3{margin:0 0 10px;color:var(--green)}
.lesson-list{display:grid;gap:7px}.lesson-link{padding:10px;border:1px solid transparent;border-radius:10px;display:grid;grid-template-columns:30px 1fr;gap:8px;align-items:start}.lesson-link.active{background:#edf5ef;border-color:#d8e7dc}.lesson-link small{color:var(--muted)}
.video-card{padding:12px}.video-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}.video-head h2{margin:0;color:var(--green)}
.video-shell{position:relative;background:#062f26;border-radius:16px;overflow:hidden;aspect-ratio:16/9;display:grid;place-items:center}
.video-shell video{width:100%;height:100%;display:block;background:#062f26}.video-badge{position:absolute;top:12px;right:12px;background:rgba(255,253,248,.92);color:var(--green);padding:7px 10px;border-radius:9px;font-size:12px;font-weight:800;pointer-events:none}
.video-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:10px}.speed{display:flex;align-items:center;gap:7px}.speed select{min-height:40px;border:1px solid var(--line);border-radius:9px;background:#fff;padding:6px 9px}
.lesson-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.info-card{padding:15px}.info-card h3{margin:0 0 10px;color:var(--green)}.resource{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:11px;border-radius:12px;background:#f5efe2}.chapters{display:grid;gap:6px}.chapter{min-height:40px;border:1px solid var(--line);background:#fff;border-radius:9px;padding:7px 9px;display:flex;justify-content:space-between;align-items:center;text-align:right}.chapter:hover{border-color:#bca66f;background:#fffaf0}
.note-area textarea{width:100%;min-height:100px;border:1px solid var(--line);border-radius:11px;padding:10px;resize:vertical;background:#fff}
.lesson-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;margin-top:14px}
.complete-banner{display:none;padding:15px;margin-top:12px;background:#edf5ef;border:1px solid #d8e8dd;border-radius:14px}.complete-banner.show{display:flex;align-items:center;justify-content:space-between;gap:12px}
.split-overlay{position:fixed;inset:0;background:#f5efe4;z-index:100;display:grid;grid-template-rows:54px minmax(0,1fr)}.split-overlay[hidden]{display:none}.split-head{display:flex;align-items:center;justify-content:space-between;padding:7px 12px;background:#fffdf8;border-bottom:1px solid var(--line)}.split-body{display:grid;grid-template-columns:40% 60%;min-height:0;direction:ltr}.split-video,.split-book{min-width:0;min-height:0;padding:8px}.split-video{background:#efe8dc}.split-book iframe{width:100%;height:100%;border:0;border-radius:12px;background:#fff}.split-video .video-shell{height:100%;aspect-ratio:auto}
.reader-bridge{height:100vh;display:grid;grid-template-rows:50px minmax(0,1fr);background:#efe9dd}.reader-bridge.embedded{grid-template-rows:1fr}.reader-bridge.embedded .reader-bridge-head{display:none}.reader-bridge-head{display:flex;justify-content:space-between;align-items:center;padding:6px 12px;background:#fffdf8;border-bottom:1px solid var(--line)}.reader-bridge iframe{width:100%;height:100%;border:0}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(15px);opacity:0;background:#173f35;color:#fff;padding:10px 15px;border-radius:10px;transition:.2s;z-index:200}.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:1199px){.shell{grid-template-columns:minmax(0,1fr) 72px;grid-template-areas:"content rail";direction:ltr}.rail{padding:14px 9px}.brand div,.student div:last-child,.nav span{display:none}.brand{justify-content:center}.brand img{width:48px;height:48px}.student{justify-content:center;padding:8px}.nav a{justify-content:center;padding:9px}.content{padding:18px}.lesson-layout{grid-template-columns:minmax(0,1fr) 250px}.lesson-tabs{grid-template-columns:1fr 1fr}.lesson-tabs .info-card:last-child{grid-column:1/-1}}

@media(max-width:767px){
 .shell{display:block;direction:rtl}
 .content{padding:12px 10px 82px;direction:rtl}
 .mobile-head{display:flex;height:54px;align-items:center;justify-content:space-between;padding:5px 7px;background:#fffdf8;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:70}
 .mobile-head button{width:44px;height:44px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--green)}
 .rail{
   display:flex;position:fixed;top:0;right:0;bottom:0;left:auto;
   width:min(86vw,310px);height:100dvh;z-index:90;padding:16px;
   visibility:hidden;opacity:0;pointer-events:none;
   transition:opacity .16s ease;
   box-shadow:-18px 0 44px rgba(0,0,0,.18);overflow:auto;direction:rtl;
 }
 body.nav-open .rail{visibility:visible;opacity:1;pointer-events:auto}
 .rail .brand{padding-left:48px}
 .rail .brand div,.rail .student div:last-child,.rail .nav span{display:block}
 .rail .brand{justify-content:flex-start}.rail .brand img{width:56px;height:56px}
 .rail .student{justify-content:flex-start;padding:10px}
 .rail .nav a{justify-content:flex-start;padding:10px 12px;min-height:44px}
 .mobile-nav-close{display:grid!important;place-items:center;position:absolute;top:10px;left:10px;width:44px;height:44px;border-radius:11px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;font-size:23px;z-index:2}
 .nav-backdrop{display:block;position:fixed;inset:0;background:rgba(17,28,23,.34);z-index:80;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .16s ease,visibility .16s ease}
 body.nav-open .nav-backdrop{visibility:visible;opacity:1;pointer-events:auto}
 body.nav-open{overflow:hidden}
 .topline{margin-top:10px}.topline h1{font-size:24px}.continue-card,.course-hero{grid-template-columns:1fr}.continue-card .course-art,.course-hero .art{min-height:110px}
 .stats{grid-template-columns:1fr 1fr}.course-grid{grid-template-columns:1fr}
 .lesson-row{grid-template-columns:35px minmax(0,1fr) 70px}.lesson-row .lesson-action{display:none}
 .lesson-layout{display:block}.lesson-side{position:static;margin-top:12px}.video-card{padding:8px}.video-head{align-items:flex-start;flex-direction:column}.video-shell{border-radius:12px}
 .lesson-tabs{grid-template-columns:1fr}.lesson-tabs .info-card:last-child{grid-column:auto}.lesson-footer{align-items:stretch;flex-direction:column}.lesson-footer a,.lesson-footer button{width:100%}
 .split-overlay{display:none!important}.split-trigger{display:none}.resource{align-items:flex-start;flex-direction:column}.resource .actions{width:100%}.resource .actions a,.resource .actions button{flex:1;text-align:center}
 .primary,.secondary,.chapter,.speed select{min-height:44px}.lesson-link{min-height:50px}
}


/* ==============================================================
   R0.1 — RTL Main Rail Fix + Desktop Readability + Layout Balance
   ============================================================== */

.numeric{
  direction:ltr;
  unicode-bidi:isolate;
  font-variant-numeric:tabular-nums;
  display:inline-block;
}

/* single current course should use available width */
.course-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));
}

/* calm vertical rhythm */
.section-title{margin:27px 0 12px}
.continue-card{padding:24px;gap:22px}
.course-card{padding:21px}
.next-step{padding:21px}
.stats{gap:14px;margin:18px 0}
.stat{padding:17px 18px}
.progress{height:10px}

/* Desktop readability without changing functional structure */
@media(min-width:1200px){
  .content{padding:28px 32px 42px}
  .topline{margin-bottom:24px}
  .topline h1{font-size:32px;font-weight:800;line-height:1.18}
  .eyebrow{font-size:13px;font-weight:800}
  .muted{font-size:14px;line-height:1.65}
  .continue-card h2{font-size:25px;font-weight:800}
  .continue-card b{font-size:15px}
  .course-card h3{font-size:21px;font-weight:800}
  .course-card .row{font-size:14px}
  .section-title h2{font-size:20px;font-weight:800}
  .stat span{font-size:14px;font-weight:650}
  .stat b{font-size:24px;font-weight:850}
  .next-step b{font-size:18px}
  .next-step p{font-size:15px}
  .pill{font-size:13px}
  .primary,.secondary{font-size:14px}
  .rail .brand strong{font-size:21px}
  .rail .brand small{font-size:12px}
  .rail .nav a{font-size:14px}
}

/* Laptop typography guard */
@media(min-width:768px) and (max-width:1199px){
  .topline h1{font-size:28px}
  .muted{font-size:13px}
  .section-title h2{font-size:18px}
  .stat b{font-size:22px}
  .course-card h3{font-size:19px}
}

/* Explicit mobile-only helpers */
.mobile-nav-close,.nav-backdrop{display:none}
@media(max-width:767px){
  .mobile-nav-close,.nav-backdrop{display:block}
}


/* R0.1 explicit Laptop/Tablet Mini Rail: 768–1599 */
@media(min-width:768px) and (max-width:1599px){
  .shell{
    grid-template-columns:minmax(0,1fr) 72px;
    grid-template-areas:"content rail";
    direction:ltr;
  }
  .rail{padding:14px 9px;direction:rtl}
  .rail .brand div,
  .rail .student div:last-child,
  .rail .nav span{display:none}
  .rail .brand{justify-content:center}
  .rail .brand img{width:48px;height:48px}
  .rail .student{justify-content:center;padding:8px}
  .rail .nav a{justify-content:center;padding:9px}
}


/* ============================================================
   Nahw100 Learning Hub R0.2
   Identity Lock + Calibri Font Lock + Lesson Workspace Polish
   ============================================================ */

:root{
  --project-font: Calibri, "Segoe UI", Arial, sans-serif;
}

html,body,button,input,select,textarea,a{
  font-family:var(--project-font)!important;
}

/* Keep Calibri as the project base font across student UI. */
body{
  font-family:var(--project-font)!important;
}

/* Desktop lesson workspace: video remains primary without swallowing page. */
@media(min-width:1200px){
  .lesson-main .video-card{
    padding:14px;
  }
  .lesson-main .video-shell{
    width:min(100%, 1120px);
    max-height:64vh;
    margin-inline:auto;
    aspect-ratio:16/9;
  }
  .lesson-main .video-shell video{
    width:100%;
    height:100%;
    object-fit:contain;
  }
  .video-head h2{
    font-size:22px;
    font-weight:800;
  }
  .lesson-side h3,
  .info-card h3{
    font-size:17px;
    font-weight:800;
  }
  .lesson-link strong{
    font-size:14px;
    font-weight:750;
  }
  .lesson-link small,
  .chapter,
  .resource .muted,
  .note-area .muted{
    font-size:13px;
  }
  .chapter{
    font-weight:650;
  }
  .video-tools{
    font-size:13px;
  }
}

/* Laptop keeps the player large but prevents full-screen-like dominance. */
@media(min-width:768px) and (max-width:1199px){
  .lesson-main .video-shell{
    max-height:60vh;
  }
}

/* Mobile keeps the existing responsive 16:9 behavior. */
@media(max-width:767px){
  .lesson-main .video-shell{
    max-height:none;
    width:100%;
  }
}

/* Permanent guards documented in CSS:
   FONT-CALIBRI-GUARD
   NAV-RIGHT-GUARD
*/

/* ============================================================
   R1 Admin — functional content management, same frozen identity
   ============================================================ */
.admin-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) 250px;grid-template-areas:"admin-content admin-rail";direction:ltr;background:var(--cream)}
.admin-rail{grid-area:admin-rail;direction:rtl;background:linear-gradient(180deg,#0a4b3a,#073b30);color:#fff;padding:20px 14px;min-height:100vh;position:sticky;top:0;height:100vh}
.admin-content{grid-area:admin-content;direction:rtl;padding:24px 28px 48px;min-width:0}
.admin-brand{display:flex;align-items:center;gap:10px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.14)}.admin-brand img{width:56px;height:56px;border-radius:13px}.admin-brand strong{font-size:20px}.admin-brand small{display:block;opacity:.72;margin-top:3px}
.admin-nav{display:grid;gap:7px;margin-top:18px}.admin-nav a{padding:11px 12px;border-radius:10px;color:#fff}.admin-nav a:hover{background:rgba(255,255,255,.08)}
.admin-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:18px}.admin-top h1{margin:3px 0;font-size:30px;color:var(--green)}
.admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}.admin-stat{padding:16px}.admin-stat span{display:block;color:var(--muted);font-size:13px}.admin-stat b{display:block;font-size:27px;color:var(--green);margin-top:5px}
.admin-section{margin-top:18px}.admin-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.admin-section-head h2{margin:0;font-size:20px;color:var(--green)}
.admin-grid{display:grid;grid-template-columns:minmax(320px,.8fr) minmax(0,1.5fr);gap:12px;align-items:start}.admin-form{padding:16px}.admin-form h3{margin:0 0 12px;color:var(--green)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.form-grid .wide{grid-column:1/-1}.admin-form label{display:grid;gap:5px;font-size:13px;font-weight:700;color:var(--ink)}.admin-form input,.admin-form select,.admin-form textarea{width:100%;min-height:40px;border:1px solid var(--line);border-radius:9px;background:#fff;padding:8px 10px;color:var(--ink)}.admin-form textarea{min-height:78px;resize:vertical}.admin-form .actions{margin-top:12px}
.admin-table-wrap{overflow:auto;border-radius:14px}.admin-table{width:100%;border-collapse:collapse;background:var(--paper);min-width:680px}.admin-table th,.admin-table td{padding:10px 9px;border-bottom:1px solid var(--line);text-align:right;font-size:13px;vertical-align:middle}.admin-table th{background:#f3ecdf;color:var(--green);position:sticky;top:0}.admin-table tr:last-child td{border-bottom:0}.admin-table .tiny-actions{display:flex;gap:5px;flex-wrap:wrap}.admin-table button{min-height:34px;padding:6px 9px;border-radius:8px;border:1px solid var(--line);background:#fff;color:var(--green)}
.status-chip{display:inline-block;padding:4px 8px;border-radius:999px;font-size:12px;border:1px solid var(--line);background:#fff}.status-chip.PUBLISHED,.status-chip.ACTIVE{background:#e9f4ed;border-color:#cfe4d6}.status-chip.DRAFT{background:#fff6df;border-color:#ead8a5}.status-chip.ARCHIVED{background:#f2eeee;color:#777}
.admin-message{min-height:22px;margin-top:8px;font-size:13px}.admin-message.ok{color:#19633f}.admin-message.error{color:#9a352d}
.admin-code{direction:ltr;text-align:left;font-family:Calibri,"Segoe UI",Arial,sans-serif!important;background:#f3efe7;border:1px solid var(--line);padding:8px;border-radius:8px;font-size:12px;overflow:auto}
@media(max-width:1199px){.admin-shell{grid-template-columns:minmax(0,1fr) 72px}.admin-rail{padding:14px 8px}.admin-brand div,.admin-nav span{display:none}.admin-brand{justify-content:center}.admin-brand img{width:46px;height:46px}.admin-nav a{text-align:center;padding:10px 6px}.admin-content{padding:18px}.admin-stats{grid-template-columns:repeat(2,1fr)}.admin-grid{grid-template-columns:1fr}}


/* R1.0.1 — Admin Entry + Student/Admin Separation
   Layout only. Typography is intentionally frozen. */
.topline-utilities{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  flex-wrap:wrap;
}
.admin-utility-entry{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  white-space:nowrap;
}
@media(max-width:767px){
  .topline{flex-wrap:wrap}
  .topline-utilities{width:100%;justify-content:flex-start}
  .admin-utility-entry{max-width:100%}
}


/* R1.0.3 — protected-content deterrence. */
.video-shell video{-webkit-user-drag:none;user-select:none}
@media print{.video-shell,.split-video,.split-book,.reader-bridge iframe{display:none!important}}


/* ==============================================================
   R1.1 — Authentication UI. No existing typography sizes changed.
   ============================================================== */
.auth-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,var(--cream),#edf5ef)}
.auth-card{width:min(100%,460px);padding:26px}
.auth-brand{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.auth-brand img{width:70px;height:70px;object-fit:contain;background:#fff9ee;border-radius:16px}
.auth-brand h1{margin:3px 0;color:var(--green)}
.auth-form{display:grid;gap:13px;margin-top:18px}
.auth-form label{display:grid;gap:7px;font-weight:750;color:var(--green)}
.auth-form input[type="text"],.auth-form input[type="email"],.auth-form input[type="tel"],.auth-form input[type="password"],.auth-form input:not([type]){
 width:100%;min-height:46px;border:1px solid var(--line);border-radius:11px;background:#fff;padding:9px 12px;color:var(--ink);outline:none
}
.field-optional{color:var(--muted);font-size:12px;font-weight:650}
.field-hint{display:block;min-height:18px;margin-top:4px;font-size:12px}.field-hint.success{color:#176044}.field-hint.error{color:#8b342e}
.auth-form input:focus{border-color:#af965c;box-shadow:0 0 0 3px rgba(199,154,59,.12)}
.terms-row{display:flex!important;grid-template-columns:none!important;align-items:flex-start;gap:9px!important;color:var(--ink)!important;font-weight:600!important}
.terms-row input{margin-top:4px}
.auth-form .primary{width:100%;margin-top:4px}
.auth-switch{text-align:center;margin-top:18px;color:var(--muted)}
.auth-switch a{color:var(--green);font-weight:800}
.auth-message{min-height:24px;padding-top:4px}
.auth-message.error{color:#9b2f2f}.auth-message.success{color:var(--green)}
.auth-pending{margin-top:16px;padding:14px;border:1px solid #ead3a5;border-radius:13px;background:#fff8e9}
.auth-success-mark{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;margin:18px auto;background:#e4f2e7;color:var(--green);font-weight:900}
.auth-full-link{display:flex;align-items:center;justify-content:center;width:100%;margin-top:14px}
.rail-logout{width:100%;min-height:42px;margin-top:auto;border:1px solid rgba(255,255,255,.22);border-radius:10px;background:rgba(255,255,255,.08);color:#fff;font:inherit;font-weight:750}
.admin-logout{margin:18px 14px;width:calc(100% - 28px)}
@media(max-width:767px){.auth-page{padding:14px}.auth-card{padding:20px}}


/* ==============================================================
   R1.1.1 — First Admin Web Setup only.
   Existing login/register and project typography remain unchanged.
   ============================================================== */
.first-admin-page{background:
  radial-gradient(circle at 15% 15%,rgba(199,154,59,.08),transparent 28%),
  radial-gradient(circle at 85% 82%,rgba(10,75,58,.08),transparent 30%),
  linear-gradient(145deg,var(--cream),#edf5ef)}
.first-admin-card{width:min(100%,500px);position:relative;overflow:hidden}
.first-admin-card::before{content:"";position:absolute;inset:0 auto auto 0;width:110px;height:5px;background:linear-gradient(90deg,var(--green),var(--gold));border-radius:0 0 10px 0}
.first-admin-brand{margin-bottom:14px}
.first-admin-note{display:grid;gap:4px;padding:13px 14px;margin-bottom:16px;border:1px solid #eadfca;border-radius:12px;background:#fff8ec;color:var(--ink)}
.first-admin-note strong{color:var(--green)}
.first-admin-note span{color:var(--muted)}
.first-admin-success{text-align:center;padding-top:6px}
.first-admin-success h2{color:var(--green);margin:8px 0}
@media(max-width:767px){
  .first-admin-card{width:100%}
  .first-admin-brand{align-items:flex-start}
}


/* =================================================================
   R1.1.2 — Mobile Top Navigation Architecture + Admin Responsive Repair
   Desktop/Laptop keeps the right rail. Mobile <=767 uses top navigation.
   ================================================================= */

/* Shared mobile top-navigation components are hidden off mobile. */
.mobile-top-nav,
.admin-mobile-sticky{display:none}

/* Desktop navigation model active state. */
.admin-nav a,.mobile-top-nav a{display:flex;align-items:center;gap:8px}
.admin-nav a.active{background:rgba(255,255,255,.12);color:#fff}
.admin-section{scroll-margin-top:124px}

/* Mobile-only architecture. */
@media(max-width:767px){
  /* No side rail or drawer exists in the mobile layout. */
  .shell,.admin-shell{display:block!important;min-height:100vh;direction:rtl}
  .rail,.admin-rail{display:none!important;position:static!important;width:0!important;height:0!important;min-height:0!important;padding:0!important;margin:0!important}
  .nav-backdrop,.mobile-nav-close{display:none!important}
  body.nav-open{overflow:auto!important}

  /* Student content owns the available viewport width. */
  .content{
    width:100%!important;max-width:100%!important;min-width:0!important;
    margin:0!important;padding:0 10px 72px!important;direction:rtl
  }
  .student-mobile-head{
    display:flex!important;height:58px!important;position:sticky!important;top:0!important;z-index:82!important;
    margin:0 -10px;padding:7px 10px!important;background:#fffdf8;border-bottom:1px solid var(--line)
  }
  .mobile-brand-mini,.mobile-account-actions{display:flex;align-items:center;gap:8px;min-width:0}
  .mobile-brand-mini img{width:38px;height:38px;border-radius:10px;object-fit:contain;background:#fff9ee}
  .mobile-brand-mini strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--green)}
  .mobile-account-actions{flex:0 0 auto}
  .mobile-initial{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--goldsoft);color:var(--green);font-weight:900}
  .mobile-logout{
    min-height:36px!important;padding:6px 10px!important;border:1px solid var(--line)!important;border-radius:10px!important;
    background:#fff!important;color:var(--green)!important;font:inherit!important;font-weight:750!important;position:static!important
  }

  /* Shared horizontal nav: scrolls by touch and never reserves side width. */
  .mobile-top-nav{
    display:flex!important;align-items:center;gap:6px;width:100%;max-width:100%;
    overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:none;-webkit-overflow-scrolling:touch;
    background:#fffdf8;border-bottom:1px solid var(--line);padding:6px 8px
  }
  .mobile-top-nav::-webkit-scrollbar{display:none}
  .student-mobile-nav{position:sticky;top:58px;z-index:81;margin:0 -10px;width:calc(100% + 20px);max-width:none}
  .mobile-top-nav a{
    flex:0 0 auto;min-height:40px;padding:7px 11px;border-radius:10px;color:var(--green);font-weight:750
  }
  .mobile-top-nav a.active{background:var(--goldsoft);box-shadow:inset 0 0 0 1px #ead3a5}
  .mobile-top-nav a b{display:inline-grid;place-items:center;min-width:18px}

  /* Existing student content starts directly below the top navigation. */
  .topline{margin-top:14px}
  .mobile-head button{width:auto;height:auto}

  /* Admin receives full viewport width. */
  .admin-content{
    width:100%!important;max-width:100%!important;min-width:0!important;
    margin:0!important;padding:0 12px 40px!important;direction:rtl
  }
  .admin-mobile-sticky{
    display:block!important;position:sticky;top:0;z-index:90;
    margin:0 -12px 12px;background:#fffdf8;box-shadow:0 5px 18px rgba(40,34,26,.06)
  }
  .admin-mobile-head{
    height:58px;display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:7px 12px;border-bottom:1px solid var(--line)
  }
  .admin-mobile-brand{display:flex;align-items:center;gap:9px;min-width:0}
  .admin-mobile-brand img{width:38px;height:38px;border-radius:10px;background:#fff9ee;object-fit:contain}
  .admin-mobile-brand strong{color:var(--green);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .admin-mobile-nav{width:100%;margin:0}
  .admin-mobile-logout{flex:0 0 auto}

  /* Compact admin hero — no oversized first screen. */
  .admin-top{
    display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:start!important;
    gap:8px!important;margin:10px 0 12px!important
  }
  .admin-top h1{font-size:22px!important;line-height:1.25;margin:2px 0 3px!important}
  .admin-top .muted{line-height:1.45}
  .admin-top .secondary{min-height:38px;padding:7px 10px;white-space:nowrap}

  /* 2x2 stats remain readable down to 360px. */
  .admin-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important;margin-bottom:12px!important}
  .admin-stat{padding:12px!important;min-width:0}
  .admin-stat b{font-size:23px!important}

  /* Single-column admin sections. */
  .admin-section{margin-top:14px!important;scroll-margin-top:124px}
  .admin-section-head{align-items:flex-start;gap:7px;margin-bottom:8px}
  .admin-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;width:100%}
  .admin-form{width:100%;min-width:0;padding:14px}
  .admin-form input,.admin-form select,.admin-form textarea{width:100%!important;max-width:100%;min-width:0}
  .admin-form .actions,.admin-table .tiny-actions{display:flex;flex-wrap:wrap;gap:7px}
  .admin-table .tiny-actions button{flex:0 0 auto}

  /* Mobile Table -> Row Cards. */
  .admin-table-wrap{
    width:100%;max-width:100%;overflow:visible!important;background:transparent!important;
    border:0!important;box-shadow:none!important;padding:0!important
  }
  .admin-table{
    display:block;width:100%!important;min-width:0!important;background:transparent!important;border-collapse:separate
  }
  .admin-table thead{display:none!important}
  .admin-table tbody{display:grid;gap:10px;width:100%}
  .admin-table tr{
    display:grid!important;width:100%;min-width:0;padding:11px 12px;
    border:1px solid var(--line);border-radius:14px;background:var(--paper);
    box-shadow:0 5px 15px rgba(51,43,31,.035)
  }
  .admin-table td{
    display:grid!important;grid-template-columns:82px minmax(0,1fr);gap:9px;align-items:start;
    width:100%;min-width:0;padding:7px 0!important;border:0!important;text-align:right!important;
    overflow-wrap:anywhere
  }
  .admin-table td+td{border-top:1px dashed #eee5d7!important}
  .admin-table td::before{
    content:attr(data-label);color:var(--muted);font-weight:750;min-width:0
  }
  .admin-table td[data-label="إجراءات"]{grid-template-columns:1fr}
  .admin-table td[data-label="إجراءات"]::before{margin-bottom:2px}
  .admin-table button{max-width:100%}

  /* No form compression on real phone widths. */
  .form-grid{grid-template-columns:1fr 1fr;min-width:0}
}
@media(max-width:600px){
  .form-grid{grid-template-columns:1fr!important}
  .form-grid .wide{grid-column:auto!important}
}
@media(max-width:380px){
  .admin-top{grid-template-columns:1fr!important}
  .admin-top .secondary{justify-self:start}
}

/* Tablet retains the existing compact right rail only when it has room. */
@media(min-width:768px) and (max-width:1199px){
  .mobile-top-nav,.admin-mobile-sticky{display:none!important}
}

/* Desktop/Laptop right-rail invariant. */
@media(min-width:1200px){
  .mobile-top-nav,.admin-mobile-sticky{display:none!important}
  .admin-rail{grid-area:admin-rail}
}


/* R1.1.8 HOTFIX 2 — student identity card: no overlap; shelf ownership remains unrelated. */
@media(min-width:1200px){
  .rail .student{min-width:0;align-items:center;gap:12px;padding:12px 13px}
  .rail .student .avatar{flex:0 0 42px;width:42px;height:42px}
  .rail .student>div:last-child{min-width:0;flex:1 1 auto;text-align:right;overflow:hidden}
  .rail .student #studentName{display:block;max-width:100%;line-height:1.3;white-space:normal;overflow-wrap:anywhere;word-break:normal}
  .rail .student small{display:block;margin-top:3px;line-height:1.2;opacity:.82}
}


/* Limited student navigation polish; existing rail width and mobile model stay intact. */
.rail:has(> .nav[data-nav-context="student"]){display:grid;grid-template-rows:repeat(4,max-content);align-content:start;gap:12px}
.shell>.rail>.nav[data-nav-context="student"]{gap:4px;grid-auto-rows:minmax(46px,1fr);margin-top:4px;padding-top:8px;border-top:1px solid rgba(255,253,248,.11);min-width:0}
.shell>.rail>.nav[data-nav-context="student"]>a{
  display:grid;grid-template-columns:22px minmax(0,1fr);align-items:center;gap:10px;
  min-width:0;min-height:46px;padding:8px 12px;border:1px solid transparent;border-radius:12px;
  font-family:Calibri,"Segoe UI",Arial,sans-serif;font-size:16px;font-weight:600;line-height:1.5;
  text-align:start;color:rgba(255,253,248,.9);transition:background-color .15s ease,border-color .15s ease,color .15s ease
}
.shell>.rail>.nav[data-nav-context="student"]>a>b{
  display:grid;place-items:center;width:22px;height:24px;font-family:"Segoe UI Symbol","Segoe UI",Arial,sans-serif;
  font-size:20px;line-height:1;font-weight:600
}
.shell>.rail>.nav[data-nav-context="student"]>a>span{min-width:0;white-space:normal;overflow-wrap:break-word;word-break:normal}
.shell>.rail>.nav[data-nav-context="student"]>a:hover:not(.active):not(.is-active){background:rgba(255,253,248,.07);border-color:rgba(255,253,248,.12)}
.shell>.rail>.nav[data-nav-context="student"]>a:is(.active,.is-active){background:#fff8ea;color:var(--green);border-color:rgba(199,154,59,.45);font-weight:700}
.shell>.rail>.nav[data-nav-context="student"]>a:focus-visible{outline:2px solid #e4c476;outline-offset:2px}
@media(min-width:768px) and (max-width:1599px){
  .shell>.rail>.nav[data-nav-context="student"]>a{grid-template-columns:22px;justify-content:center;padding-inline:6px}
  }
@media(max-width:767px){
  .student-mobile-nav[data-nav-context="student"]{overscroll-behavior-inline:contain}
  .student-mobile-nav[data-nav-context="student"]>a{
    display:grid;grid-template-columns:20px auto;gap:8px;align-items:center;
    min-height:44px;padding:8px 12px;max-width:100%;border-radius:11px;
    font-family:Calibri,"Segoe UI",Arial,sans-serif;font-size:16px;font-weight:600;line-height:1.5
  }
  .student-mobile-nav[data-nav-context="student"]>a>b{display:grid;place-items:center;width:20px;min-width:20px;font-size:18px;line-height:1}
  .student-mobile-nav[data-nav-context="student"]>a>span{white-space:nowrap}
  .student-mobile-nav[data-nav-context="student"]>a:is(.active,.is-active){font-weight:700}
  .student-mobile-nav[data-nav-context="student"]>a:focus-visible{outline:2px solid var(--green);outline-offset:-2px}
}
@media(prefers-reduced-motion:reduce){.shell>.rail>.nav[data-nav-context="student"]>a{transition:none}}

/* STUDENT SIDEBAR REFERENCE — shared presentation only, no route/data changes. */
.student-reference-rail,.student-reference-nav{
  --rail-emerald:#154b3e;--rail-deep:#123d34;--rail-ivory:#f7efda;
  --rail-gold:#a99056;--rail-gold-light:#ead8a2;--rail-text:#183f33;
  --rail-paper:radial-gradient(ellipse at 0 70%,rgba(187,162,98,.12),transparent 66%),linear-gradient(112deg,#f8f1de,#f3ecd8 65%,#fbf4e3);
  --rail-bevel:inset 0 1px 1px #fffbed,inset 0 0 0 3px rgba(255,250,227,.28),0 3px 7px rgba(2,26,20,.26);
}
.shell>.rail.student-reference-rail{
  position:relative;isolation:isolate;display:flex;flex-direction:column;align-content:start;gap:12px;
  min-width:0;padding:18px 12px 14px;overflow:visible;align-self:stretch;
  background:radial-gradient(ellipse at 0 15%,rgba(138,162,126,.12),transparent 45%),linear-gradient(120deg,#153c34,#185345 48%,#103e34);
  color:var(--rail-text);border-inline-start:1px solid rgba(212,186,119,.3);
}
.shell>.rail.student-reference-rail::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.055;
  background-image:url("assets/student-sidebar-ornament.svg");background-size:170px 112px;background-repeat:repeat;
}
.student-reference-rail .student-identity-card,.student-reference-nav .student-nav-card{
  position:relative;isolation:isolate;min-width:0;border:1px solid #c8b581;border-radius:17px;
  background:var(--rail-paper);box-shadow:var(--rail-bevel);
}
.student-reference-rail .student-identity-card{padding:14px 12px 12px;display:grid;gap:12px}
.student-reference-rail .student-identity-card::before,.student-reference-nav .student-nav-card::before{
  content:"";position:absolute;inset-inline-end:0;bottom:18px;width:90px;height:115px;
  background:url("assets/student-sidebar-ornament.svg") center / 165px auto no-repeat;
  opacity:.14;transform:rotate(-70deg);pointer-events:none;z-index:-1;
}
.student-reference-rail .student-identity-card .brand{
  display:flex;align-items:center;justify-content:flex-start;gap:12px;min-width:0;margin:0;
  padding:0 0 13px;border-bottom:1px solid #d9cba5;
}
.student-reference-rail .student-identity-card .brand img{
  width:60px;height:60px;flex:0 0 60px;padding:5px;border-radius:14px;object-fit:contain;
  background:linear-gradient(130deg,#fff9e9,#e8dbb6);border:1px solid #d1bc87;
  box-shadow:inset 0 1px 2px #fffaf0,0 3px 6px #63512b35;
}
.student-reference-rail .student-identity-card .brand>div{min-width:0;flex:1}
.student-reference-rail .student-identity-card .brand strong{
  display:block;color:#a28a50;font-size:23px;font-weight:750;line-height:1.3;
  text-shadow:0 1px #fff8dc,0 -1px #6c582d44;
}
.student-reference-rail .student-identity-card .brand small{
  display:block;margin-top:4px;color:#335247;opacity:1;font-size:12px;line-height:1.5;
}
.student-reference-rail .student-identity-card .student{
  display:flex;min-width:0;align-items:center;gap:12px;padding:0;margin:0;
  background:transparent;border:0;border-radius:0;
}
.student-reference-rail .student-identity-card .student .avatar{
  width:45px;height:45px;flex:0 0 45px;display:grid;place-items:center;border-radius:50%;
  background:linear-gradient(135deg,#285c4b,#173e34);color:#e7d299;border:3px double #b5a16b;
  box-shadow:0 0 0 2px #e7dab6,inset 0 0 0 2px #ffffff16,0 2px 4px #574c3030;
  font-size:22px;font-weight:650;line-height:1;
}
.student-reference-rail .student-identity-card .student>div:last-child{min-width:0;flex:1;overflow:visible}
.student-reference-rail .student-name-line{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.student-reference-rail .student-identity-card .student strong{
  display:inline;white-space:normal;overflow-wrap:anywhere;font-size:17px;line-height:1.5;color:var(--rail-text);font-weight:750;
}
.student-reference-rail .student-own-online{display:inline-flex;align-items:center;white-space:nowrap;color:#176746;font-size:10px;font-weight:800;line-height:1.4}
.student-reference-rail .student-own-online[hidden]{display:none}
.student-reference-rail .student-identity-card .student small{display:block;font-size:13px;line-height:1.5;color:#8b7747;opacity:1;margin:0}
.shell>.student-reference-rail .student-identity-card .rail-logout{
  display:block;width:100%;min-height:44px;margin:0;padding:8px 12px;border:1px solid #aa935a;border-radius:13px;
  background:linear-gradient(180deg,#2c6656 0%,#194d3e 48%,#153d33 100%);color:#f6eaca;
  box-shadow:inset 0 0 0 2px #f4dfa12e,inset 0 2px 3px #ffffff26,0 2px 4px #483c2938;
  font-family:var(--project-font);font-size:17px;font-weight:750;line-height:1.5;text-shadow:0 1px 1px #062d26;
  transition:background-color .15s ease,box-shadow .15s ease;
}
.shell>.student-reference-rail .student-identity-card .rail-logout:hover{
  background:linear-gradient(180deg,#367460,#205542 60%,#194638);border-color:#c7ab64;box-shadow:inset 0 0 0 2px #f4dfa13b,0 3px 6px #483c2938;
}
.shell>.student-reference-rail .student-identity-card .rail-logout:active{box-shadow:inset 0 2px 5px #062e2980}
.shell>.student-reference-rail>.nav.student-reference-nav{
  display:grid;gap:12px;grid-auto-rows:auto;min-width:0;margin:0;padding:0;border:0;align-content:start;
}
.student-reference-nav .student-nav-card{padding:10px 8px 8px}
.student-reference-nav .student-nav-card::after{
  content:"";position:absolute;left:50%;top:0;transform:translateX(-50%);width:88px;height:19px;
  background:url("assets/student-sidebar-ornament.svg") center top / contain no-repeat;opacity:.55;pointer-events:none;z-index:-1;
}
.student-reference-nav .student-nav-heading{
  position:relative;margin:0 9px 5px;padding:5px 0 1px;font-size:13px;font-weight:650;line-height:1.6;
  text-align:start;color:#8b7544;
}
.student-reference-nav .student-nav-links{display:grid;gap:3px;min-width:0}
.student-reference-nav .student-nav-links>a{
  position:relative;display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:9px;min-width:0;
  min-height:49px;padding:6px 8px 6px 16px;border:1px solid transparent;border-radius:12px;
  color:var(--rail-text);font-size:16px;font-weight:700;line-height:1.5;text-align:start;
  transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.student-reference-nav .student-nav-links>a>span{display:block;min-width:0;white-space:normal;overflow-wrap:break-word;word-break:normal}
.shell>.student-reference-rail>.student-reference-nav .student-nav-links>a{min-height:49px}
.student-reference-nav .student-nav-links>a>.student-nav-medallion{
  display:grid;place-items:center;box-sizing:border-box;width:32px;height:32px;min-width:0;padding:4px;border-radius:50%;
  background:linear-gradient(135deg,#fffbea,#e5d5ac 65%,#f7eac9);border:1px solid #ae965e;
  color:#295442;box-shadow:inset 0 0 0 2px #fff9e4,0 2px 3px #58482338;
}
.student-reference-nav .student-nav-medallion svg{display:block;width:23px;height:23px;max-width:none;flex:none;filter:drop-shadow(0 1px 0 #fff5d2)}
.student-reference-nav .student-nav-links>a:hover:not(.active):not(.is-active){background:#e4d5af44;border-color:#c8b68288}
.student-reference-nav .student-nav-links>a:is(.active,.is-active){
  color:#fff1cc;background:linear-gradient(180deg,#2b6253,#174639 55%,#123c32);
  border:1px solid #ae985e;box-shadow:inset 0 0 0 2px #f0dfae4d,inset 0 2px 5px #071f1980,0 0 0 2px #244f408c;
  font-weight:750;text-shadow:0 1px 1px #0c312a;
}
.student-reference-nav .student-nav-links>a:is(.active,.is-active)::after{
  content:"";position:absolute;inset-inline-end:7px;top:50%;transform:translateY(-50%);width:6px;height:6px;border-radius:50%;
  background:linear-gradient(135deg,#ffebaf,#aa8948);box-shadow:0 1px 2px #06261b;
}
.student-reference-nav .student-nav-links>a:is(.active,.is-active)>.student-nav-medallion{
  background:linear-gradient(135deg,#e6d6ac,#c7ad70);border-color:#dbc58c;box-shadow:inset 0 0 0 2px #faebbd85,0 1px 2px #001e1680;
}
.student-reference-nav .student-nav-links>a:focus-visible,.student-reference-rail .rail-logout:focus-visible{
  outline:2px solid #b19049;outline-offset:3px;
}
.student-reference-rail>.student-rail-finial{
  flex:0 0 19px;width:100%;height:19px;margin-top:0;background:url("assets/student-sidebar-ornament.svg") center / 95px 25px no-repeat;opacity:.85;pointer-events:none;
}
@media(min-width:1600px){
  .shell:has(>.student-reference-rail){grid-template-columns:minmax(0,1fr) 272px}
}
/* Keep the existing 72px tablet/laptop rail; preserve accessible link names. */
@media(min-width:768px) and (max-width:1599px){
  .shell>.rail.student-reference-rail{padding:12px 5px;gap:10px}
  .student-reference-rail .student-identity-card{padding:8px 3px;gap:10px;border-radius:12px}
  .student-reference-rail .student-identity-card .brand{padding:0 0 9px;justify-content:center}
  .student-reference-rail .student-identity-card .brand img{width:42px;height:42px;flex-basis:42px;border-radius:10px;padding:3px}
  .student-reference-rail .student-identity-card .brand>div,.student-reference-rail .student-identity-card .student>div:last-child{display:none}
  .student-reference-rail .student-identity-card .student{justify-content:center}
  .student-reference-rail .student-identity-card .student .avatar{width:34px;height:34px;flex-basis:34px;font-size:18px}
  .shell>.student-reference-rail .student-identity-card .rail-logout{font-size:0;padding:7px 0;min-height:44px;border-radius:10px}
  .shell>.student-reference-rail .student-identity-card .rail-logout::before{content:"↪";font-size:22px;line-height:1}
  .student-reference-rail .student-nav-card{padding:7px 3px;border-radius:12px}
  .student-reference-rail .student-nav-heading{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%)}
  .student-reference-rail .student-nav-links>a{grid-template-columns:32px;justify-content:center;gap:0;padding:5px 0;min-height:44px;border-radius:9px}
  .student-reference-rail .student-nav-links>a>span{display:none}
  .student-reference-rail .student-nav-links>a:is(.active,.is-active)::after{width:4px;height:4px;inset-inline-end:2px}
  .student-reference-rail .student-identity-card::before,.student-reference-rail .student-nav-card::before,.student-reference-rail .student-nav-card::after{display:none}
}
/* Mobile keeps the same top navigation, with viewport-sized grouped cards. */
@media(max-width:767px){
  .student-mobile-nav.student-reference-nav{
    align-items:stretch;gap:8px;padding:8px 10px;scroll-snap-type:x proximity;scroll-padding-inline:10px;
    overscroll-behavior-inline:contain;background:var(--rail-deep)!important;
  }
  .student-mobile-nav.student-reference-nav .student-nav-card{
    flex:0 0 calc(100% - 4px);min-width:0;max-width:100%;padding:5px 7px 7px;border-radius:12px;white-space:normal;
    box-shadow:inset 0 1px #fffaf0,0 1px 3px #001b1544;scroll-snap-align:start;
  }
  .student-mobile-nav.student-reference-nav .student-nav-heading{font-size:12px;line-height:1.5;margin:0 5px 3px;padding:1px 0}
  .student-mobile-nav.student-reference-nav .student-nav-links{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
  .student-mobile-nav.student-reference-nav .student-nav-links>a{
    display:flex;flex-direction:column;justify-content:flex-start;gap:4px;min-height:77px;padding:5px 3px;
    font-size:14px;line-height:1.4;text-align:center;color:var(--rail-text)!important;border-color:transparent!important;
  }
  .student-mobile-nav.student-reference-nav .student-nav-links>a>span{display:block;white-space:normal;overflow-wrap:break-word}
  .student-mobile-nav.student-reference-nav .student-nav-links>a>.student-nav-medallion{width:28px;height:28px;padding:3px;flex:0 0 28px;box-shadow:inset 0 0 0 1px #fff9e4}
  .student-mobile-nav.student-reference-nav .student-nav-medallion svg{width:21px;height:21px}
  .student-mobile-nav.student-reference-nav .student-nav-links>a:is(.active,.is-active){
    color:#fff1cc!important;background:linear-gradient(180deg,#2b6253,#153f33)!important;border-color:#ae985e!important;
    box-shadow:inset 0 0 0 1px #efdbac80!important;
  }
  .student-mobile-nav.student-reference-nav .student-nav-links>a:is(.active,.is-active)::after{inset-inline-end:5px;top:12px;width:4px;height:4px}
  .student-mobile-nav.student-reference-nav .student-nav-card::before{display:none}
  .student-mobile-nav.student-reference-nav .student-nav-card::after{opacity:.22;width:70px;height:20px}
}
@media(prefers-reduced-motion:reduce){
  .student-reference-nav .student-nav-links>a,.shell>.student-reference-rail .student-identity-card .rail-logout{transition:none}
}

/* FIX3 — MOBILE STUDENT NAV COMPACT */
@media(max-width:767px){
  .student-mobile-nav.student-reference-nav{
    align-items:flex-start;
  }

  .student-mobile-nav.student-reference-nav .student-nav-links:has(>a:nth-child(4)){
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .student-mobile-nav.student-reference-nav .student-nav-card{
    padding:1px 4px 2px;
  }

  .student-mobile-nav.student-reference-nav .student-nav-heading{
    font-size:10.5px;
    line-height:1.15;
    margin:0 3px 0;
    padding:0;
  }

  .student-mobile-nav.student-reference-nav .student-nav-links>a{
    min-height:42px;
    padding:1px;
    gap:0;
    font-size:12.5px;
    line-height:1.15;
  }

  .student-mobile-nav.student-reference-nav .student-nav-links>a>.student-nav-medallion{
    width:21px;
    height:21px;
    flex-basis:21px;
    padding:2px;
  }

  .student-mobile-nav.student-reference-nav .student-nav-medallion svg{
    width:15px;
    height:15px;
  }
}