:root{--primary:#7f1d1d;--primary-dark:#5b1111;--primary-light:#fbeaea;--accent:#c9a227;--bg:#f7f7f5;--surface:#fff;--surface-2:#f2f2ef;--text:#171717;--muted:#6b7280;--border:#e5e7eb;--success:#15803d;--warning:#d97706;--danger:#dc2626;--info:#64748b;--sidebar:#201b1b;--radius-sm:8px;--radius:12px;--radius-lg:16px;--shadow:0 12px 34px rgba(23,23,23,.07);--sidebar-width:270px}
html[data-theme=dark]{--bg:#111;--surface:#191919;--surface-2:#222;--text:#f5f5f4;--muted:#a3a3a3;--border:#333;--primary-light:#32191a;--sidebar:#0c0c0c;--shadow:0 16px 38px rgba(0,0,0,.24)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;font-size:14px;line-height:1.55}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}svg.icon{width:20px;height:20px;flex:0 0 auto}.skip-link{position:fixed;left:12px;top:-60px;z-index:1000;background:var(--surface);padding:10px 14px;border:2px solid var(--primary);border-radius:8px}.skip-link:focus{top:12px}:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 45%,transparent);outline-offset:2px}h1,h2,h3,h4{font-family:"Space Grotesk",sans-serif;line-height:1.15;margin:0 0 .65em}h1{font-size:clamp(2rem,4vw,4.6rem);letter-spacing:-.04em}h2{font-size:clamp(1.5rem,2.3vw,2.5rem);letter-spacing:-.025em}h3{font-size:1.15rem}p{margin:0 0 1em}.eyebrow,.label,.nav-group>p,.table th{font-family:Montserrat,sans-serif;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;font-weight:600}.eyebrow{color:var(--primary)}.muted{color:var(--muted)}.text-success{color:var(--success)}.text-danger{color:var(--danger)}.text-warning{color:var(--warning)}
.btn{appearance:none;border:1px solid transparent;border-radius:var(--radius-sm);min-height:42px;padding:10px 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:Montserrat,sans-serif;font-weight:600;font-size:.78rem;letter-spacing:.01em;transition:background .18s,border-color .18s,transform .18s}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-secondary{background:var(--surface-2);border-color:var(--border)}.btn-ghost{background:transparent;border-color:var(--border)}.btn-danger{background:var(--danger);color:#fff}.btn-sm{min-height:34px;padding:6px 10px;font-size:.72rem}.btn svg{width:17px;height:17px}.icon-button{width:42px;height:42px;border-radius:50%;border:1px solid var(--border);background:var(--surface);display:grid;place-items:center}.link{color:var(--primary);font-weight:600}.actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 9px;background:var(--surface-2);border:1px solid var(--border);font:600 .68rem Montserrat,sans-serif;text-transform:capitalize}.badge.success{background:color-mix(in srgb,var(--success) 10%,var(--surface));border-color:color-mix(in srgb,var(--success) 30%,var(--border));color:var(--success)}.badge.warning{background:color-mix(in srgb,var(--warning) 10%,var(--surface));border-color:color-mix(in srgb,var(--warning) 30%,var(--border));color:var(--warning)}.badge.danger{background:color-mix(in srgb,var(--danger) 10%,var(--surface));border-color:color-mix(in srgb,var(--danger) 30%,var(--border));color:var(--danger)}
.public-header{height:82px;display:flex;align-items:center;gap:28px;padding:0 clamp(20px,5vw,84px);background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:40}.brand{display:flex;align-items:center;gap:12px;margin-right:auto;min-width:240px}.brand img{width:48px;height:54px;object-fit:contain}.brand span{display:grid}.brand strong{font:700 .95rem "Space Grotesk",sans-serif;line-height:1.2}.brand small{color:var(--muted);font-size:.68rem}.public-nav{display:flex;align-items:center;gap:22px;font:600 .74rem Montserrat,sans-serif}.public-nav>a:not(.btn):hover{color:var(--primary)}.nav-toggle{display:none;border:0;background:transparent}.hero{min-height:690px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(350px,.9fr);align-items:center;gap:clamp(40px,7vw,120px);padding:80px clamp(20px,6vw,110px);position:relative;overflow:hidden;background:var(--surface)}.hero-copy{max-width:760px}.hero h1{max-width:690px}.hero h1 em{font-style:normal;color:var(--primary)}.hero-copy>p{max-width:620px;font-size:1.08rem;color:var(--muted)}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0}.hero-proof{display:flex;gap:26px;padding-top:22px;border-top:1px solid var(--border)}.hero-proof span{display:grid}.hero-proof strong{font:700 1.35rem "Space Grotesk",sans-serif}.hero-proof small{color:var(--muted)}.hero-panel{background:var(--primary-dark);color:#fff;padding:34px;border-radius:16px;min-height:460px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 30px 70px rgba(91,17,17,.25)}.hero-panel .notice{border-left:3px solid var(--accent);padding:18px 20px;background:rgba(255,255,255,.07)}.hero-panel .notice small{color:#e5d7d7}.hero-panel h2{font-size:2rem}.hero-panel dl{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:0}.hero-panel dt{font:600 .65rem Montserrat,sans-serif;text-transform:uppercase;letter-spacing:.08em;color:#d6b8b8}.hero-panel dd{margin:5px 0 0;font-weight:500}.section{padding:clamp(70px,8vw,120px) clamp(20px,6vw,110px)}.section.alt{background:var(--surface)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:40px}.section-heading>div{max-width:720px}.section-heading p{color:var(--muted)}.feature-grid{display:grid;grid-template-columns:1.25fr .75fr .75fr;gap:18px}.feature-card{padding:30px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);min-height:240px}.feature-card.primary{background:var(--primary);color:#fff;grid-row:span 2;min-height:500px;display:flex;flex-direction:column;justify-content:flex-end}.feature-card.primary p{color:#ecdede}.feature-card .number{font:700 4rem "Space Grotesk",sans-serif;color:var(--primary-light)}.programme-grid,.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.programme-card,.news-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:26px}.programme-card:hover,.news-card:hover{border-color:var(--primary)}.news-card time{font-size:.76rem;color:var(--muted)}.cta-band{margin:0 clamp(20px,6vw,110px) 90px;background:var(--primary-dark);color:#fff;padding:clamp(34px,5vw,70px);border-radius:16px;display:flex;align-items:center;justify-content:space-between;gap:30px}.cta-band h2{max-width:700px}.public-footer{background:#171313;color:#fff;display:grid;grid-template-columns:2fr 1fr 1fr;gap:50px;padding:70px clamp(20px,6vw,110px) 28px}.public-footer>div{display:flex;flex-direction:column;gap:10px}.public-footer p,.public-footer span,.public-footer a{color:#bdb5b5}.public-footer .footer-bottom{grid-column:1/-1;border-top:1px solid #332c2c;padding-top:24px;margin:20px 0 0}.page-hero{padding:80px clamp(20px,6vw,110px) 56px;background:var(--surface);border-bottom:1px solid var(--border)}.page-hero h1{font-size:clamp(2.4rem,4vw,4rem);max-width:900px}.page-hero p{font-size:1.05rem;max-width:760px;color:var(--muted)}.content-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:44px}.sidebar-card{border:1px solid var(--border);padding:24px;border-radius:var(--radius);background:var(--surface);height:max-content}.timeline{display:grid;gap:0}.timeline-item{display:grid;grid-template-columns:46px 1fr;gap:20px;position:relative;padding-bottom:32px}.timeline-item:not(:last-child)::before{content:"";position:absolute;left:22px;top:42px;bottom:0;border-left:1px solid var(--border)}.timeline-item>span{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:#fff;font:600 .8rem Montserrat,sans-serif;z-index:1}
.portal-frame{min-height:100vh;display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;background:var(--sidebar);color:#eee;display:flex;flex-direction:column;z-index:50}.sidebar-brand{height:82px;padding:14px 22px;display:flex;gap:12px;align-items:center;border-bottom:1px solid #332d2d}.sidebar-brand img{width:42px;height:48px}.sidebar-brand span{display:grid}.sidebar-brand strong{font:700 1rem "Space Grotesk",sans-serif}.sidebar-brand small{font-size:.68rem;color:#aaa}.sidebar nav{padding:16px 12px;overflow-y:auto;scrollbar-width:thin}.nav-group{margin-bottom:18px}.nav-group>p{color:#777;margin:0;padding:8px 11px}.nav-group a,.sidebar-logout{display:flex;align-items:center;gap:12px;border-radius:8px;padding:10px 12px;color:#bbb;font:500 .74rem Montserrat,sans-serif;margin:2px 0}.nav-group a:hover,.nav-group a.active{background:#332b2b;color:#fff}.nav-group a.active{box-shadow:inset 3px 0 var(--accent)}.nav-group svg,.sidebar-logout svg{width:18px;height:18px}.sidebar-logout{margin:auto 12px 14px;color:#ddd;border:1px solid #3b3333}.portal-body{min-width:0;display:flex;flex-direction:column}.topbar{height:82px;padding:0 28px;background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:30}.command-trigger{height:42px;min-width:330px;border:1px solid var(--border);border-radius:9px;background:var(--bg);display:flex;align-items:center;gap:10px;color:var(--muted);padding:0 12px;text-align:left}.command-trigger span{flex:1}.command-trigger kbd,.command-input kbd{font:500 .68rem Montserrat,sans-serif;border:1px solid var(--border);border-radius:5px;padding:3px 6px;background:var(--surface)}.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:10px}.profile-chip{display:flex;align-items:center;gap:10px;margin-left:5px}.profile-chip>span{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--surface-2);border:1px solid var(--border);font:600 .72rem Montserrat,sans-serif}.profile-chip div{display:grid}.profile-chip strong{font-size:.78rem}.profile-chip small{color:var(--muted);font-size:.67rem}.portal-main{padding:28px clamp(18px,3vw,42px) 54px;max-width:1680px;width:100%;margin:0 auto}.page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:26px}.page-header h1{font-size:clamp(1.85rem,3vw,2.65rem);margin:0}.page-header p{color:var(--muted);margin:6px 0 0}.portal-footer{margin-top:auto;padding:18px 28px;border-top:1px solid var(--border);color:var(--muted);font-size:.72rem}.mobile-only,.mobile-bottom-nav{display:none}
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-bottom:24px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:22px;min-width:0}.card.sharp{border-radius:8px}.card.span-3{grid-column:span 3}.card.span-4{grid-column:span 4}.card.span-5{grid-column:span 5}.card.span-6{grid-column:span 6}.card.span-7{grid-column:span 7}.card.span-8{grid-column:span 8}.card.span-9{grid-column:span 9}.card.span-12{grid-column:span 12}.card.primary-card{background:var(--primary);color:#fff;border-color:var(--primary)}.card.primary-card .muted{color:#eadada}.card.gold-card{border-top:3px solid var(--accent)}.metric{display:flex;flex-direction:column;justify-content:space-between;min-height:140px}.metric .value{font:700 clamp(1.9rem,3vw,3rem) "Space Grotesk",sans-serif;letter-spacing:-.04em}.metric .meta{color:var(--muted);font-size:.75rem}.metric.primary-card .meta{color:#e7cdcd}.progress{height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden}.progress>span{height:100%;display:block;background:var(--primary);border-radius:inherit}.card-header{display:flex;justify-content:space-between;align-items:start;gap:20px;margin-bottom:18px}.card-header h2,.card-header h3{margin:0}.split{display:grid;grid-template-columns:1fr 1fr;gap:18px}.stat-list{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--border);border:1px solid var(--border);border-radius:9px;overflow:hidden}.stat-list>div{background:var(--surface);padding:17px}.stat-list strong{display:block;font:700 1.4rem "Space Grotesk",sans-serif}.stat-list small{color:var(--muted)}
.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:9px;background:var(--surface)}.table{width:100%;border-collapse:collapse;text-align:left}.table th{background:var(--surface-2);color:var(--muted);padding:11px 14px;white-space:nowrap}.table td{padding:13px 14px;border-top:1px solid var(--border);vertical-align:middle}.table tr:hover td{background:color-mix(in srgb,var(--primary) 2%,var(--surface))}.table .actions{white-space:nowrap}.empty-state{text-align:center;padding:50px 24px}.empty-state svg{width:40px;height:40px;color:var(--muted);margin:0 auto 14px}.empty-state p{color:var(--muted);max-width:380px;margin:0 auto 18px}.filters{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:16px}.filters .field{margin:0;min-width:160px}.pagination{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:16px}.pagination a,.pagination span{border:1px solid var(--border);background:var(--surface);border-radius:7px;min-width:34px;height:34px;display:grid;place-items:center}.pagination .active{background:var(--primary);color:#fff;border-color:var(--primary)}
.field{display:grid;gap:7px;margin-bottom:16px}.field label{font:600 .73rem Montserrat,sans-serif}.field small{color:var(--muted)}.field-error{font-size:.72rem;color:var(--danger)}.input,.select,.textarea{width:100%;border:1px solid var(--border);background:var(--surface);border-radius:8px;padding:10px 12px;min-height:44px}.textarea{min-height:110px;resize:vertical}.input:focus,.select:focus,.textarea:focus{border-color:var(--primary);outline:3px solid color-mix(in srgb,var(--primary) 14%,transparent)}.input.invalid{border-color:var(--danger)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}.form-grid .span-2{grid-column:span 2}.form-section{border-top:1px solid var(--border);padding-top:24px;margin-top:24px}.form-section:first-child{border-top:0;padding-top:0;margin-top:0}.checkbox-row{display:flex;gap:10px;align-items:flex-start}.checkbox-row input{width:18px;height:18px;accent-color:var(--primary)}.segmented{display:inline-flex;border:1px solid var(--border);border-radius:8px;padding:3px;background:var(--surface-2)}.segmented button,.segmented a{border:0;background:transparent;padding:7px 12px;border-radius:6px;font:600 .7rem Montserrat,sans-serif}.segmented .active{background:var(--surface);box-shadow:0 2px 8px rgba(0,0,0,.07)}.stepper{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:30px}.step{position:relative;color:var(--muted);font:600 .65rem Montserrat,sans-serif}.step::before{content:"";display:block;height:4px;background:var(--border);border-radius:9px;margin-bottom:9px}.step.active,.step.done{color:var(--text)}.step.active::before,.step.done::before{background:var(--primary)}.course-picker{display:grid;gap:10px}.course-row{display:grid;grid-template-columns:28px 95px 1fr 70px 95px;gap:12px;align-items:center;padding:14px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}.course-row:has(input:checked){border-color:var(--primary);background:color-mix(in srgb,var(--primary) 4%,var(--surface))}.course-row input{width:18px;height:18px;accent-color:var(--primary)}.unit-counter{position:sticky;bottom:14px;z-index:5;background:var(--primary-dark);color:#fff;border-radius:10px;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;box-shadow:var(--shadow)}
.toast{position:fixed;right:22px;top:94px;z-index:100;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--info);border-radius:8px;box-shadow:var(--shadow);padding:14px 42px 14px 16px;max-width:380px;animation:toast-in .22s ease-out}.toast.is-success{border-left-color:var(--success)}.toast.is-error{border-left-color:var(--danger)}.toast.is-warning{border-left-color:var(--warning)}.toast button{position:absolute;right:10px;top:8px;border:0;background:transparent;font-size:1.3rem}.command-overlay,.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.48);z-index:200;display:grid;place-items:start center;padding-top:10vh}.command-dialog,.modal{width:min(650px,calc(100% - 28px));background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.28);overflow:hidden}.command-input{display:flex;gap:10px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--border)}.command-input input{border:0;outline:0;background:transparent;flex:1;font-size:1rem}.command-results{max-height:410px;overflow:auto;padding:8px}.command-result{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:7px}.command-result:hover,.command-result:focus{background:var(--surface-2)}.command-result small{color:var(--muted)}.modal{padding:24px;margin-top:10vh}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.skeleton{position:relative;overflow:hidden;background:var(--surface-2);border-radius:6px;min-height:18px}.skeleton::after{content:"";position:absolute;inset:0;background:var(--border);opacity:.35;animation:skeleton-pulse 1.2s ease-in-out infinite alternate}.announcement{padding:20px 0;border-bottom:1px solid var(--border)}.announcement.urgent{border-left:3px solid var(--primary);padding-left:18px;background:color-mix(in srgb,var(--primary) 3%,transparent)}.announcement-meta{display:flex;gap:10px;color:var(--muted);font-size:.72rem}.schedule{display:grid;gap:10px}.schedule-item{display:grid;grid-template-columns:100px 1fr auto;gap:18px;align-items:center;border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:8px;padding:14px;background:var(--surface)}.document-sheet{position:relative;background:#fff;color:#171717;max-width:850px;margin:24px auto;padding:64px 70px;min-height:1060px;box-shadow:var(--shadow);overflow:hidden}.document-watermark{position:absolute;width:420px;height:420px;object-fit:contain;opacity:.085;left:50%;top:48%;transform:translate(-50%,-50%);z-index:0}.document-sheet>*:not(.document-watermark){position:relative;z-index:1}.document-letterhead{text-align:center;border-bottom:3px double #333;padding-bottom:20px;margin-bottom:34px}.document-letterhead img{width:70px;height:78px;object-fit:contain;margin:0 auto 10px}.signature-block{width:240px;margin:55px 0 0 auto;text-align:center;display:grid}.signature-block img{height:58px;object-fit:contain;margin:auto}.signature-line{height:50px;border-bottom:1px solid #222}.signature-block strong{margin-top:5px}.signature-block small{color:#555}.receipt-grid{display:grid;grid-template-columns:1fr 1fr;border:1px solid #aaa}.receipt-grid>div{padding:10px 12px;border-bottom:1px solid #ccc}.receipt-grid>div:nth-child(odd){border-right:1px solid #ccc}.error-page{min-height:65vh;display:grid;place-content:center;text-align:center;padding:40px}.error-page h1{font-size:3rem}
@keyframes toast-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}@keyframes skeleton-pulse{from{opacity:.18}to{opacity:.55}}
@media(max-width:1100px){.public-nav{position:fixed;inset:82px 0 auto 0;background:var(--surface);border-bottom:1px solid var(--border);padding:24px;display:none;flex-direction:column;align-items:stretch}.public-nav.open{display:flex}.nav-toggle{display:block}.hero{grid-template-columns:1fr;background:var(--surface)}.hero-panel{min-height:380px}.feature-grid{grid-template-columns:1fr 1fr}.feature-card.primary{grid-column:1/-1;grid-row:auto;min-height:350px}.programme-grid,.news-grid{grid-template-columns:repeat(2,1fr)}.card.span-3{grid-column:span 6}.card.span-4{grid-column:span 6}.card.span-5,.card.span-7{grid-column:span 6}.portal-frame{grid-template-columns:1fr}.sidebar{position:fixed;left:0;top:0;width:var(--sidebar-width);transform:translateX(-100%);transition:transform .2s}.sidebar.open{transform:none}.mobile-only{display:grid}.command-trigger{min-width:220px}.mobile-bottom-nav{display:none}}
@media(max-width:720px){body{font-size:13px}.public-header{height:72px;padding:0 16px}.brand{min-width:0}.brand img{width:40px;height:44px}.brand small{display:none}.public-nav{inset:72px 0 auto}.hero{padding:54px 18px;min-height:auto}.hero h1{font-size:2.75rem}.hero-panel{padding:24px}.hero-proof{gap:15px}.section{padding:58px 18px}.section-heading{align-items:start;flex-direction:column}.feature-grid,.programme-grid,.news-grid,.content-layout{grid-template-columns:1fr}.feature-card.primary{min-height:300px}.cta-band{margin:0 18px 60px;flex-direction:column;align-items:flex-start}.public-footer{grid-template-columns:1fr;padding:50px 18px 100px}.public-footer .footer-bottom{grid-column:auto}.topbar{height:68px;padding:0 14px}.command-trigger{min-width:0;width:42px;border-radius:50%;justify-content:center}.command-trigger span,.command-trigger kbd{display:none}.profile-chip div{display:none}.portal-main{padding:20px 14px 100px}.page-header{align-items:flex-start;flex-direction:column}.page-header .actions{width:100%}.page-header .actions .btn{flex:1}.bento{gap:10px}.card{padding:17px}.card.span-3,.card.span-4,.card.span-5,.card.span-6,.card.span-7,.card.span-8,.card.span-9,.card.span-12{grid-column:span 12}.split,.form-grid{grid-template-columns:1fr}.form-grid .span-2{grid-column:span 1}.stepper{overflow-x:auto}.step{min-width:90px}.course-row{grid-template-columns:26px 74px 1fr 45px}.course-row .course-type{display:none}.schedule-item{grid-template-columns:70px 1fr}.schedule-item .actions{grid-column:2}.mobile-bottom-nav{position:fixed;left:0;right:0;bottom:0;height:66px;background:var(--surface);border-top:1px solid var(--border);z-index:45;display:grid;grid-template-columns:repeat(5,1fr)}.mobile-bottom-nav a,.mobile-bottom-nav button{border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font:500 .6rem Montserrat,sans-serif}.mobile-bottom-nav svg{width:19px}.portal-footer{display:none}.document-sheet{margin:0;padding:34px 24px;min-height:0;box-shadow:none}.toast{right:12px;left:12px;top:78px;max-width:none}.table.mobile-cards thead{display:none}.table.mobile-cards,.table.mobile-cards tbody,.table.mobile-cards tr,.table.mobile-cards td{display:block}.table.mobile-cards tr{border-top:1px solid var(--border);padding:10px}.table.mobile-cards td{border:0;padding:5px 7px;display:flex;justify-content:space-between;gap:15px}.table.mobile-cards td::before{content:attr(data-label);font:600 .67rem Montserrat,sans-serif;color:var(--muted)}}
@media print{*{print-color-adjust:exact;-webkit-print-color-adjust:exact}body{background:#fff}.sidebar,.topbar,.portal-footer,.mobile-bottom-nav,.public-header,.public-footer,.no-print,.toast{display:none!important}.portal-frame{display:block}.portal-main{padding:0;max-width:none}.document-sheet{box-shadow:none;margin:0;max-width:none;min-height:auto;padding:12mm 14mm}.card{box-shadow:none}.table-wrap{overflow:visible}.document-watermark{opacity:.08}.signature-block{break-inside:avoid}@page{size:A4;margin:8mm}}

/* Keep overlays closed until JavaScript explicitly opens them. */
.command-overlay[hidden],.modal-overlay[hidden]{display:none!important}

/* ===== EduQuill responsive portal refinement กค 2026-08-17 ===== */
html,body{max-width:100%;overflow-x:hidden}.portal-body{min-width:0}.portal-main{max-width:1540px}.sidebar-backdrop{display:none}.notification-button{position:relative}.notification-dot{position:absolute;right:-3px;top:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:var(--primary);color:#fff;border:2px solid var(--surface);display:grid;place-items:center;font:700 .58rem Montserrat,sans-serif}.topbar{box-shadow:0 1px 0 rgba(0,0,0,.02)}
.card{transition:border-color .2s ease,box-shadow .2s ease}.card:hover{border-color:color-mix(in srgb,var(--border) 72%,var(--text))}.page-header{align-items:flex-start}.page-header h1{line-height:1.08}.page-header .eyebrow{margin-top:0}.bento{align-items:stretch}.metric{min-height:132px}.metric .label{margin:0}.metric .value{line-height:1}.table-wrap{max-width:100%}.table td,.table th{line-height:1.4}.table th{font:600 .68rem Montserrat,sans-serif;text-transform:uppercase;letter-spacing:.035em}
.alert-card{margin:0 0 16px;padding:15px 17px;border:1px solid var(--border);border-left:4px solid var(--info);background:var(--surface);border-radius:10px}.alert-card p{margin:4px 0 0;color:var(--muted)}.alert-card.warning{border-left-color:var(--warning);background:color-mix(in srgb,var(--warning) 4%,var(--surface))}.alert-card.danger{border-left-color:var(--danger);background:color-mix(in srgb,var(--danger) 4%,var(--surface));color:var(--danger)}

/* Student dashboard: hierarchy first, not a desktop bento collapsed onto mobile. */
.student-dashboard{display:grid;gap:18px}.student-hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(290px,.65fr);gap:16px}.student-welcome{background:var(--primary);color:#fff;border-color:var(--primary);min-height:210px;display:flex;flex-direction:column;justify-content:space-between}.student-welcome .eyebrow,.student-welcome .muted{color:#eedddd}.student-welcome h1{font-size:clamp(1.8rem,3vw,2.65rem);margin:4px 0 10px;max-width:800px}.student-meta-line{display:flex;gap:8px;flex-wrap:wrap}.student-meta-line span{border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:5px 9px;font:600 .66rem Montserrat,sans-serif}.student-status-panel{display:grid;gap:12px}.status-block{border:1px solid var(--border);border-radius:12px;padding:16px;background:var(--surface)}.status-block strong{display:block;font:700 1rem "Space Grotesk",sans-serif}.status-line{display:flex;align-items:center;justify-content:space-between;gap:12px}.status-indicator{width:10px;height:10px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px color-mix(in srgb,var(--success) 12%,transparent)}.status-indicator.blocked{background:var(--danger);box-shadow:0 0 0 4px color-mix(in srgb,var(--danger) 12%,transparent)}.quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.quick-action{border:1px solid var(--border);border-radius:11px;background:var(--surface);padding:14px;display:flex;align-items:center;gap:11px;min-height:62px;font:600 .72rem Montserrat,sans-serif}.quick-action:hover{border-color:var(--primary);color:var(--primary)}.quick-action svg{width:19px}.quick-action.disabled{opacity:.55;pointer-events:none}.student-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.student-metric{padding:18px;border:1px solid var(--border);border-radius:12px;background:var(--surface)}.student-metric.primary{background:var(--primary);border-color:var(--primary);color:#fff}.student-metric.gold{border-top:3px solid var(--accent)}.student-metric .label{margin:0 0 10px;color:var(--muted)}.student-metric.primary .label,.student-metric.primary .meta{color:#ead3d3}.student-metric .value{font:700 clamp(1.75rem,3vw,2.65rem) "Space Grotesk",sans-serif;letter-spacing:-.04em;line-height:1}.student-metric .meta{display:block;margin-top:8px;color:var(--muted);font-size:.72rem}.student-main-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(310px,.55fr);gap:16px}.student-side-stack{display:grid;gap:16px;align-content:start}.student-full{grid-column:1/-1}.notice-list .announcement:first-child{padding-top:0}.course-summary-list{display:grid;gap:8px}.course-summary-item{display:grid;grid-template-columns:90px 1fr auto;gap:12px;align-items:center;border:1px solid var(--border);border-radius:9px;padding:12px 13px}.course-summary-item strong{font-family:Montserrat,sans-serif}.course-summary-item small{display:block;color:var(--muted)}.chart-shell{position:relative;min-height:260px}

/* Login announcement */
.login-announcement-overlay{place-items:center;padding:18px}.login-announcement{margin:0;width:min(620px,100%);padding:26px}.announcement-kicker{display:flex;align-items:center;gap:10px;color:var(--muted);font:600 .68rem Montserrat,sans-serif;margin-bottom:14px}.login-announcement h2{font-size:1.65rem;margin:0 0 10px}.announcement-body{color:var(--text);line-height:1.7;max-height:45vh;overflow:auto}

/* Financial hard gate */
.clearance-block{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--bg)}.clearance-panel{width:min(620px,100%);background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:30px;box-shadow:var(--shadow)}.clearance-panel h1{font-size:clamp(2rem,5vw,3rem);margin:4px 0 12px}.clearance-panel>p{color:var(--muted)}.clearance-mark{width:48px;height:48px;border-radius:50%;background:color-mix(in srgb,var(--danger) 10%,var(--surface));color:var(--danger);display:grid;place-items:center;font:700 1.5rem "Space Grotesk",sans-serif}.clearance-balance{display:flex;justify-content:space-between;align-items:end;gap:16px;margin:22px 0;padding:16px;border:1px solid var(--border);border-radius:10px}.clearance-balance span{color:var(--muted)}.clearance-balance strong{font:700 1.35rem "Space Grotesk",sans-serif}

/* Course registration */
.registration-card{padding-bottom:86px}.carryover-row{border-left:4px solid var(--accent);background:color-mix(in srgb,var(--accent) 4%,var(--surface))}.carryover-label{display:block;width:max-content;margin-top:4px;color:#80620a;font:600 .62rem Montserrat,sans-serif}.unit-counter small{opacity:.82}.unit-counter .actions{flex-wrap:wrap}

/* Management dashboards: more operational, less decorative. */
.portal-shell .card.primary-card{box-shadow:none}.portal-shell .gold-card{background:var(--surface)}.portal-shell .stat-list{border-radius:10px}.portal-shell .schedule-item{box-shadow:none}

@media(max-width:1180px){.student-hero{grid-template-columns:1fr}.student-status-panel{grid-template-columns:1fr 1fr}.quick-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.student-main-grid{grid-template-columns:1fr}.student-side-stack{grid-template-columns:1fr 1fr}.student-full{grid-column:auto}.student-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media(max-width:1100px){.sidebar{box-shadow:18px 0 50px rgba(0,0,0,.2)}.sidebar-backdrop{position:fixed;inset:0;z-index:49;border:0;background:rgba(0,0,0,.42);width:100%;height:100%}.sidebar-backdrop:not([hidden]){display:block}.sidebar.open{z-index:60}.topbar{padding-left:16px;padding-right:18px}.portal-main{padding-left:20px;padding-right:20px}}

@media(max-width:720px){
  body.sidebar-open{overflow:hidden}.topbar{height:64px;gap:8px}.topbar-actions{gap:5px}.icon-button{width:40px;height:40px}.profile-chip{margin-left:0}.portal-main{padding:18px 12px calc(88px + env(safe-area-inset-bottom));}.page-header{gap:12px;margin-bottom:18px}.page-header h1{font-size:1.8rem}.page-header .actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.page-header .actions .btn{width:100%;justify-content:center}.card{padding:15px;border-radius:11px}.bento{gap:9px}.metric{min-height:118px}.metric .value{font-size:2rem}.student-dashboard{gap:12px}.student-welcome{min-height:190px;padding:18px}.student-welcome h1{font-size:1.85rem}.student-status-panel{grid-template-columns:1fr}.status-block{padding:14px}.quick-actions{grid-template-columns:1fr 1fr;gap:8px}.quick-action{min-height:58px;padding:11px;font-size:.66rem}.student-metrics{grid-template-columns:1fr 1fr;gap:8px}.student-metric{padding:14px;min-height:112px}.student-metric .value{font-size:1.9rem}.student-main-grid,.student-side-stack{display:grid;grid-template-columns:1fr;gap:12px}.course-summary-item{grid-template-columns:72px 1fr}.course-summary-item>:last-child{grid-column:2}.chart-shell{min-height:220px}.mobile-bottom-nav{height:calc(64px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}.mobile-bottom-nav a,.mobile-bottom-nav button{min-width:0}.announcement{padding:15px 0}.announcement.urgent{padding-left:12px}.login-announcement{padding:20px 17px}.login-announcement h2{font-size:1.4rem}.modal-actions .btn{width:100%}.clearance-panel{padding:22px 18px}.clearance-balance{align-items:flex-start;flex-direction:column}.clearance-panel .actions{display:grid;grid-template-columns:1fr}.clearance-panel .btn{justify-content:center;width:100%}.registration-card{padding:14px 12px 102px}.course-picker{gap:8px}.course-row{grid-template-columns:24px 64px minmax(0,1fr) 45px;padding:11px 9px;gap:8px}.course-row strong{font-size:.72rem}.course-row .course-title{min-width:0}.course-row .course-title{overflow-wrap:anywhere}.unit-counter{left:10px;right:10px;bottom:76px;padding:11px 12px;gap:8px;flex-direction:column;align-items:stretch}.unit-counter .actions{display:grid;grid-template-columns:1fr 1fr}.unit-counter .btn{padding:9px 8px;justify-content:center}.table.mobile-cards tr{padding:12px 8px}.table.mobile-cards td{align-items:flex-start;text-align:right}.table.mobile-cards td::before{text-align:left}.segmented{max-width:100%;overflow:auto;white-space:nowrap}.document-sheet{overflow-x:auto}
}

@media(max-width:430px){.student-metrics{grid-template-columns:1fr}.quick-actions{grid-template-columns:1fr 1fr}.student-meta-line{gap:5px}.student-meta-line span{font-size:.59rem}.page-header .actions{grid-template-columns:1fr}.topbar .profile-chip{display:none}.command-trigger{margin-right:auto}.course-row{grid-template-columns:22px 58px minmax(0,1fr) 40px;gap:6px}.course-row .course-type{display:none}}

/* Fee operations and management layouts */
.fee-breakdown-list{display:grid;gap:12px}.fee-breakdown-item{border:1px solid var(--border);border-radius:12px;padding:17px;background:var(--surface)}.fee-breakdown-head,.fee-breakdown-foot{display:flex;align-items:center;justify-content:space-between;gap:14px}.fee-breakdown-head h3{margin:3px 0}.fee-amount{text-align:right;display:grid;justify-items:end;gap:7px}.fee-amount strong{font:700 1.2rem "Space Grotesk",sans-serif}.fee-progress{height:7px;background:var(--surface-2);border-radius:999px;overflow:hidden;margin:14px 0}.fee-progress span{display:block;height:100%;background:var(--primary);border-radius:inherit}.fee-breakdown-foot{color:var(--muted);font-size:.78rem}.installment-list{display:grid;gap:8px;border-top:1px solid var(--border);margin-top:15px;padding-top:14px}.installment-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border)}.installment-row:last-child{border-bottom:0}.installment-row small{display:block;color:var(--muted);margin-top:2px}.management-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.code-block{margin:0;padding:16px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;white-space:pre-wrap;overflow-wrap:anywhere;max-height:520px;overflow:auto;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace}.score-input{width:90px}.inline-decision summary{list-style:none}.inline-decision summary::-webkit-details-marker{display:none}
@media(max-width:900px){.management-grid{grid-template-columns:1fr}}
@media(max-width:720px){.fee-breakdown-head{align-items:flex-start}.fee-breakdown-head,.fee-breakdown-foot{flex-wrap:wrap}.fee-amount{text-align:left;justify-items:start}.installment-row{grid-template-columns:1fr auto}.installment-row .btn{grid-column:1/-1;width:100%}.score-input{width:min(110px,100%)}}

/* Management command centre */
.management-dashboard{display:grid;gap:18px}.management-dashboard>.page-header{margin-bottom:0}.management-commandbar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.management-command{display:flex;align-items:center;gap:12px;min-width:0;min-height:78px;padding:14px 15px;background:var(--surface);border:1px solid var(--border);border-radius:11px}.management-command:hover{border-color:var(--primary)}.management-command>span{width:38px;height:38px;flex:0 0 38px;border-radius:9px;display:grid;place-items:center;background:var(--surface-2);color:var(--primary)}.management-command svg{width:19px;height:19px}.management-command div{min-width:0;display:grid;gap:3px}.management-command strong{font:700 .82rem "Space Grotesk",sans-serif;overflow-wrap:anywhere}.management-command small{color:var(--muted);white-space:normal}.management-metrics{margin:0}.compact-value{font-size:clamp(1.35rem,2.2vw,2rem)!important;overflow-wrap:anywhere}.money-small{font-size:1rem!important;overflow-wrap:anywhere}.management-chart{height:300px;min-height:250px}.management-activity-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px}.management-activity{display:grid;grid-template-columns:10px minmax(0,1fr);gap:10px;padding:12px 0;border-bottom:1px solid var(--border)}.management-activity div{display:grid;gap:3px;min-width:0}.management-activity strong{font-size:.78rem;overflow-wrap:anywhere}.management-activity small{color:var(--muted)}.activity-mark{width:8px;height:8px;border-radius:50%;background:var(--primary);margin-top:6px}.academic-milestone{border-top:3px solid var(--accent)}.light-link{color:#fff;text-decoration:underline;text-underline-offset:3px}.document-toolbar{justify-content:center;margin-bottom:16px}.alumni-dashboard{display:grid;gap:16px}.alumni-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,.8fr);gap:28px;align-items:center;background:var(--primary);color:#fff;border-color:var(--primary)}.alumni-hero h2{font-size:clamp(1.7rem,3vw,2.6rem);margin:.5rem 0}.alumni-hero p{color:#eedddd}.alumni-hero dl{margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.2);border-radius:10px;overflow:hidden}.alumni-hero dl>div{background:rgba(0,0,0,.08);padding:14px}.alumni-hero dt{font:600 .62rem Montserrat,sans-serif;text-transform:uppercase;letter-spacing:.04em;color:#eedddd}.alumni-hero dd{margin:6px 0 0;font:700 1rem "Space Grotesk",sans-serif}.print-table{border-color:#bbb}
@media(max-width:1180px){.management-commandbar{grid-template-columns:repeat(2,minmax(0,1fr))}.management-activity-list{grid-template-columns:1fr}.alumni-hero{grid-template-columns:1fr}}
@media(max-width:720px){.management-dashboard{gap:12px}.management-commandbar{grid-template-columns:1fr 1fr;gap:8px}.management-command{min-height:72px;padding:11px;align-items:flex-start}.management-command>span{width:34px;height:34px;flex-basis:34px}.management-command strong{font-size:.73rem}.management-command small{font-size:.64rem}.management-chart{height:230px}.alumni-hero{padding:18px}.alumni-hero dl{grid-template-columns:1fr}.document-toolbar{display:grid;grid-template-columns:1fr 1fr}.document-toolbar .btn{width:100%}.print-table{overflow-x:auto}}
@media(max-width:430px){.management-commandbar{grid-template-columns:1fr}.management-command{min-height:64px;align-items:center}.alumni-hero dl{grid-template-columns:1fr}.document-toolbar{grid-template-columns:1fr}}


/* Application review remains readable down to narrow mobile widths. */
.application-review-grid{display:grid;grid-template-columns:140px minmax(0,1fr);gap:22px;align-items:start}
.application-review-passport{width:140px;height:170px;object-fit:cover;border:1px solid var(--border);border-radius:10px}
.service-card{border-top:3px solid var(--primary);background:var(--surface)}
@media (max-width:520px){
  .application-review-grid{grid-template-columns:1fr;gap:16px}
  .application-review-passport{width:112px;height:136px;justify-self:start}
}

/* ========================================================================== */
/* EduQuill 2026 visual system overhaul                                       */
/* Modern institutional service UI. No gradients, no glassmorphism.           */
/* ========================================================================== */

:root {
  --bg: #f5f6f8;
  --surface: #ffffff;
  --surface-2: #f8f9fb;
  --surface-3: #f1f3f5;
  --text: #16181d;
  --text-soft: #363a43;
  --muted: #717784;
  --border: #e2e5ea;
  --border-strong: #d4d8df;
  --primary-light: #f8eeee;
  --sidebar: #211718;
  --radius-sm: 10px;
  --radius: 13px;
  --radius-lg: 16px;
  --shadow-xs: 0 1px 2px rgba(17, 24, 39, .03);
  --shadow-sm: 0 6px 20px rgba(17, 24, 39, .055);
  --shadow: 0 14px 38px rgba(17, 24, 39, .07);
  --shadow-lg: 0 24px 70px rgba(17, 24, 39, .09);
  --content-max: 1540px;
  --form-max: 1080px;
}

html[data-theme=dark] {
  --bg: #101214;
  --surface: #17191d;
  --surface-2: #1d2025;
  --surface-3: #24272d;
  --text: #f4f5f7;
  --text-soft: #d7d9df;
  --muted: #989da8;
  --border: #2b2f36;
  --border-strong: #383d46;
  --primary-light: #321d1f;
  --sidebar: #0d0e10;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, .18);
  --shadow-sm: 0 8px 24px rgba(0, 0, 0, .18);
  --shadow: 0 16px 42px rgba(0, 0, 0, .22);
  --shadow-lg: 0 28px 80px rgba(0, 0, 0, .3);
}

html { background: var(--bg); }
body {
  background: var(--bg);
  color: var(--text);
  font-size: 14.5px;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

::selection { background: var(--primary); color: #fff; }

h1,h2,h3,h4 { color: var(--text); }
h1 { letter-spacing: -.035em; }
h2 { letter-spacing: -.025em; }
h3 { letter-spacing: -.012em; }
.public-shell h1,.public-shell h2,.public-shell h3,.public-shell h4 { color: inherit; }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 9px;
  color: var(--primary);
  font-size: .68rem;
  letter-spacing: .105em;
}
.eyebrow::before {
  content: "";
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.muted { color: var(--muted) !important; }

.btn {
  min-height: 44px;
  padding: 10px 17px;
  border-radius: 10px;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .01em;
  box-shadow: none;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: var(--primary); color: #fff; box-shadow: 0 8px 18px color-mix(in srgb,var(--primary) 18%,transparent); }
.btn-primary:hover { background: var(--primary-dark); box-shadow: 0 10px 24px color-mix(in srgb,var(--primary) 22%,transparent); }
.btn-secondary { background: var(--surface); border-color: var(--border-strong); color: var(--text); }
.btn-secondary:hover { background: var(--surface-2); border-color: color-mix(in srgb,var(--primary) 28%,var(--border-strong)); }
.btn-ghost { background: transparent; border-color: var(--border-strong); color: var(--text-soft); }
.btn-ghost:hover { background: var(--surface-2); color: var(--text); }
.btn-danger { box-shadow: 0 7px 16px color-mix(in srgb,var(--danger) 15%,transparent); }
.btn-sm { min-height: 36px; padding: 7px 11px; border-radius: 9px; }
.btn[disabled],.btn[aria-disabled=true] { opacity: .52; cursor: not-allowed; transform: none; box-shadow: none; }

.icon-button {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  border-color: var(--border);
  background: var(--surface);
  box-shadow: var(--shadow-xs);
  transition: border-color .2s, background-color .2s, transform .2s;
}
.icon-button:hover { background: var(--surface-2); border-color: var(--border-strong); transform: translateY(-1px); }

.link { text-underline-offset: 3px; }
.link:hover { text-decoration: underline; }

.badge {
  min-height: 25px;
  padding: 4px 9px;
  border-radius: 999px;
  background: var(--surface-3);
  border-color: var(--border);
  font-size: .64rem;
  letter-spacing: .015em;
}

/* Public website ----------------------------------------------------------- */
.public-header {
  height: 76px;
  padding: 0 clamp(20px,4vw,72px);
  gap: 28px;
  background: color-mix(in srgb,var(--surface) 96%,transparent);
  border-bottom-color: var(--border);
  box-shadow: 0 1px 0 rgba(17,24,39,.02);
}
.brand { min-width: 220px; gap: 11px; }
.brand img { width: 44px; height: 48px; }
.brand strong { font-size: .92rem; letter-spacing: -.01em; }
.brand small { font-size: .64rem; margin-top: 2px; }
.public-nav { gap: 8px; font-size: .7rem; }
.public-nav > a:not(.btn) {
  padding: 10px 9px;
  border-radius: 9px;
  color: var(--text-soft);
  transition: background-color .18s,color .18s;
}
.public-nav > a:not(.btn):hover { color: var(--primary); background: var(--primary-light); }
.public-nav .btn { min-height: 40px; padding-inline: 14px; }

.hero {
  min-height: 670px;
  grid-template-columns: minmax(0,1.15fr) minmax(360px,.85fr);
  gap: clamp(44px,7vw,110px);
  padding: clamp(70px,8vw,118px) clamp(22px,6vw,105px);
  background: var(--surface);
  border-bottom: 1px solid var(--border);
}
.hero-copy { max-width: 820px; }
.hero h1 { max-width: 760px; font-size: clamp(3rem,5.5vw,5.7rem); line-height: .97; }
.hero-copy > p { max-width: 650px; font-size: clamp(1rem,1.3vw,1.15rem); line-height: 1.75; }
.hero-actions { margin: 31px 0 35px; }
.hero-proof { gap: 36px; padding-top: 25px; }
.hero-proof strong { font-size: 1.55rem; }
.hero-proof small { margin-top: 2px; font-size: .72rem; }
.hero-panel {
  min-height: 480px;
  padding: clamp(28px,4vw,42px);
  border-radius: 16px;
  background: var(--primary-dark);
  box-shadow: var(--shadow-lg);
  border: 1px solid rgba(255,255,255,.08);
}
.hero-panel h2 { font-size: clamp(2rem,3vw,2.65rem); line-height: 1.08; }
.hero-panel .notice { padding: 19px 20px; border-radius: 0 12px 12px 0; background: rgba(255,255,255,.07); }
.hero-panel dl { gap: 22px 18px; }

.section { padding: clamp(72px,8vw,120px) clamp(22px,6vw,105px); }
.section > * { max-width: 1480px; margin-left: auto; margin-right: auto; }
.section-heading { margin-bottom: 38px; }
.section-heading > div { max-width: 760px; }
.section-heading h2 { font-size: clamp(2rem,3vw,3.1rem); }
.feature-grid,.programme-grid,.news-grid { gap: 16px; }
.feature-card,.programme-card,.news-card,.sidebar-card {
  border-color: var(--border);
  box-shadow: var(--shadow-xs);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.feature-card { padding: 30px; }
.feature-card:not(.primary):hover,.programme-card:hover,.news-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); border-color: color-mix(in srgb,var(--primary) 24%,var(--border)); }
.feature-card.primary { background: var(--primary); border-color: var(--primary); }
.programme-card,.news-card { min-height: 190px; padding: 27px; }
.cta-band {
  max-width: calc(1480px - 44px);
  margin: 0 auto 90px;
  border-radius: 16px;
  box-shadow: var(--shadow-lg);
}
.public-footer { padding-top: 72px; background: #181314; }
.page-hero { padding: clamp(68px,7vw,105px) clamp(22px,6vw,105px) clamp(52px,6vw,76px); }
.page-hero > * { max-width: 1480px; margin-left: auto; margin-right: auto; }
.page-hero h1 { font-size: clamp(2.8rem,5vw,5rem); }
.content-layout { gap: clamp(28px,4vw,56px); }

/* Portal shell ------------------------------------------------------------- */
.portal-frame { grid-template-columns: var(--sidebar-width) minmax(0,1fr); }
.sidebar {
  background: var(--sidebar);
  border-right: 1px solid rgba(255,255,255,.055);
}
.sidebar-brand { height: 76px; padding: 14px 18px; border-bottom-color: rgba(255,255,255,.08); }
.sidebar-brand img { width: 40px; height: 44px; }
.sidebar-brand strong { font-size: .94rem; }
.sidebar-brand small { color: rgba(255,255,255,.52); }
.sidebar nav { padding: 14px 10px 24px; }
.nav-group { margin-bottom: 15px; }
.nav-group > p { color: rgba(255,255,255,.35); padding: 9px 12px 6px; font-size: .6rem; letter-spacing: .11em; }
.nav-group a,.sidebar-logout {
  min-height: 42px;
  padding: 10px 12px;
  border-radius: 10px;
  color: rgba(255,255,255,.64);
  font-size: .7rem;
  transition: background-color .18s,color .18s,transform .18s;
}
.nav-group a:hover { color: #fff; background: rgba(255,255,255,.07); transform: translateX(2px); }
.nav-group a.active { background: rgba(255,255,255,.095); color: #fff; box-shadow: inset 3px 0 var(--accent); }
.sidebar-logout { border-color: rgba(255,255,255,.1); }
.sidebar-logout:hover { background: rgba(255,255,255,.06); color: #fff; }

.topbar {
  height: 76px;
  padding: 0 26px;
  background: var(--surface);
  border-bottom-color: var(--border);
  box-shadow: 0 1px 0 rgba(17,24,39,.02);
}
.command-trigger {
  height: 42px;
  min-width: 320px;
  max-width: 460px;
  border-radius: 11px;
  background: var(--surface-2);
  border-color: var(--border);
  color: var(--muted);
}
.command-trigger:hover { background: var(--surface-3); border-color: var(--border-strong); }
.profile-chip > span {
  border-radius: 11px;
  background: var(--primary-light);
  color: var(--primary);
  font-size: .72rem;
}
.profile-chip strong { font-size: .73rem; }
.profile-chip small { font-size: .61rem; color: var(--muted); }
.notification-dot { box-shadow: 0 0 0 2px var(--surface); }

.portal-main {
  width: 100%;
  max-width: var(--content-max);
  margin: 0 auto;
  padding: 30px clamp(22px,3vw,42px) 48px;
}
.portal-footer { color: var(--muted); padding: 22px 30px 28px; font-size: .7rem; }
.page-header { align-items: flex-end; gap: 24px; margin-bottom: 24px; }
.page-header h1 { margin-bottom: 7px; font-size: clamp(2rem,3vw,3rem); }
.page-header p:last-child { margin-bottom: 0; color: var(--muted); }

.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-xs);
  padding: 22px;
}
.card:hover { border-color: color-mix(in srgb,var(--border-strong) 75%,var(--primary)); }
.card-header { gap: 18px; margin-bottom: 18px; }
.card-header h2 { margin-bottom: 4px; font-size: 1.22rem; }
.card-header p { margin-bottom: 0; }
.primary-card { background: var(--primary); border-color: var(--primary); color: #fff; }
.primary-card h1,.primary-card h2,.primary-card h3,.primary-card h4 { color: #fff; }
.primary-card .muted,.primary-card .meta { color: rgba(255,255,255,.72) !important; }
.primary-card .link { color: #fff; }
.gold-card,.academic-milestone { border-top: 3px solid var(--accent); }
.bento { gap: 14px; }

.metric { min-height: 132px; }
.metric .value { font-size: clamp(2rem,3vw,2.8rem); letter-spacing: -.045em; }
.metric .label { color: var(--muted); }
.metric-icon { border-radius: 11px; }
.stat-list { background: var(--surface-2); border: 1px solid var(--border); }
.stat-list > div { border-color: var(--border); }

/* Management command center ------------------------------------------------ */
.management-dashboard { gap: 16px; }
.management-commandbar { gap: 10px; }
.management-command {
  min-height: 82px;
  padding: 15px;
  border-radius: 13px;
  box-shadow: var(--shadow-xs);
  transition: transform .2s,border-color .2s,box-shadow .2s;
}
.management-command:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); border-color: color-mix(in srgb,var(--primary) 30%,var(--border)); }
.management-command > span { border-radius: 10px; background: var(--primary-light); }
.management-command strong { font-size: .82rem; }
.management-command small { font-size: .67rem; }
.management-activity { padding: 13px 0; }
.management-activity strong { font-size: .76rem; }
.activity-mark { box-shadow: 0 0 0 4px var(--primary-light); }

/* Student workspace -------------------------------------------------------- */
.student-dashboard { gap: 16px; }
.student-hero {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}
.student-welcome { padding: clamp(24px,4vw,38px); }
.student-welcome h1 { font-size: clamp(2rem,3.5vw,3.2rem); }
.student-status-panel { background: var(--surface); }
.status-block { border-color: var(--border); }
.quick-actions { gap: 10px; }
.quick-action {
  min-height: 72px;
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: 12px;
  box-shadow: var(--shadow-xs);
  transition: transform .2s,border-color .2s,box-shadow .2s;
}
.quick-action:hover { transform: translateY(-2px); border-color: color-mix(in srgb,var(--primary) 28%,var(--border)); box-shadow: var(--shadow-sm); }
.student-metric { border-radius: 13px; box-shadow: var(--shadow-xs); }
.course-summary-item { border-radius: 11px; }

/* Tables and data-heavy pages --------------------------------------------- */
.table-wrap {
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  overflow: auto;
  box-shadow: var(--shadow-xs);
}
.table { width: 100%; border-collapse: separate; border-spacing: 0; }
.table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--surface-2);
  color: var(--muted);
  font-size: .63rem;
  letter-spacing: .075em;
  border-bottom: 1px solid var(--border-strong);
  padding: 12px 14px;
  white-space: nowrap;
}
.table td { padding: 13px 14px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr { transition: background-color .16s; }
.table tbody tr:hover { background: var(--surface-2); }
.filters {
  padding: 14px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 13px;
  box-shadow: var(--shadow-xs);
}
.pagination a,.pagination span { border-radius: 9px; }

/* Forms -------------------------------------------------------------------- */
form { accent-color: var(--primary); }
.form-grid { gap: 18px 20px; }
.form-section {
  margin-top: 28px;
  padding-top: 26px;
  border-top: 1px solid var(--border);
}
.form-section > h3 { margin-bottom: 6px; }
.form-section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}
.form-section-heading h3 { margin-bottom: 5px; font-size: 1.2rem; }
.form-section-heading p { margin-bottom: 0; }
.field { display: grid; align-content: start; gap: 7px; min-width: 0; }
.field label {
  color: var(--text-soft);
  font: 700 .72rem/1.35 Montserrat,sans-serif;
  letter-spacing: .01em;
}
.field small,.field-hint { color: var(--muted); font-size: .72rem; line-height: 1.5; }
.input,.select,.textarea {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--border-strong);
  border-radius: 10px;
  background: var(--surface);
  color: var(--text);
  padding: 11px 13px;
  box-shadow: 0 1px 0 rgba(17,24,39,.02);
  transition: border-color .18s,box-shadow .18s,background-color .18s;
}
.textarea { min-height: 116px; resize: vertical; }
.input::placeholder,.textarea::placeholder { color: color-mix(in srgb,var(--muted) 75%,transparent); }
.input:hover,.select:hover,.textarea:hover { border-color: color-mix(in srgb,var(--primary) 22%,var(--border-strong)); }
.input:focus,.select:focus,.textarea:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--primary) 11%,transparent);
}
.input:disabled,.select:disabled,.textarea:disabled { background: var(--surface-3); color: var(--muted); cursor: not-allowed; }
.select {
  appearance: none;
  padding-right: 42px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23717784' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 13px center;
  background-size: 16px;
}
.input[type=file] { padding: 7px 8px; background: var(--surface-2); }
.input[type=file]::file-selector-button {
  min-height: 32px;
  margin-right: 11px;
  border: 1px solid var(--border-strong);
  border-radius: 8px;
  padding: 6px 10px;
  background: var(--surface);
  color: var(--text-soft);
  font: 700 .68rem Montserrat,sans-serif;
  cursor: pointer;
}
.input[type=file]::file-selector-button:hover { background: var(--primary-light); color: var(--primary); border-color: color-mix(in srgb,var(--primary) 25%,var(--border)); }
.field-error { color: var(--danger); font-size: .72rem; font-weight: 600; }
.field:has(.field-error) .input,.field:has(.field-error) .select,.field:has(.field-error) .textarea { border-color: color-mix(in srgb,var(--danger) 65%,var(--border)); }
.checkbox-row,.check-row {
  border: 1px solid var(--border);
  border-radius: 11px;
  padding: 13px 14px;
  background: var(--surface-2);
}
.checkbox-row input,.check-row input { width: 18px; height: 18px; }

/* Applicant application ---------------------------------------------------- */
.application-shell {
  width: 100%;
  max-width: 1320px;
  margin: 0 auto;
  padding-top: 42px;
  padding-bottom: 90px;
}
.application-page-header { max-width: var(--form-max); margin-left: auto; margin-right: auto; }
.application-page-header h1 { font-size: clamp(2.35rem,4vw,3.65rem); }
.application-form {
  max-width: var(--form-max);
  margin: 0 auto;
  padding: clamp(22px,3.5vw,38px);
  box-shadow: var(--shadow-sm);
}
.application-form > h2 { font-size: clamp(1.45rem,2.2vw,2rem); margin-bottom: 7px; }
.application-form > h2 + .muted { margin-bottom: 24px; }
.stepper {
  max-width: var(--form-max);
  margin: 0 auto 18px;
  padding: 7px;
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  gap: 5px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: var(--shadow-xs);
}
.step {
  min-width: 0;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 7px 9px;
  border-radius: 9px;
  color: var(--muted);
  font: 700 .67rem Montserrat,sans-serif;
  transition: background-color .18s,color .18s;
}
.step:hover { background: var(--surface-2); color: var(--text); }
.step.active { background: var(--primary); color: #fff; }
.step.done { background: var(--primary-light); color: var(--primary); }
.step-number {
  width: 23px;
  height: 23px;
  flex: 0 0 23px;
  display: grid;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  font-size: .6rem;
}
.step.active .step-number { border-color: rgba(255,255,255,.65); }
.form-error-summary {
  max-width: var(--form-max);
  margin: 0 auto 16px;
  padding: 15px 17px;
  border: 1px solid color-mix(in srgb,var(--danger) 35%,var(--border));
  border-left: 4px solid var(--danger);
  border-radius: 11px;
  background: color-mix(in srgb,var(--danger) 5%,var(--surface));
  color: var(--text);
  box-shadow: var(--shadow-xs);
}
.form-error-summary strong { display: block; margin-bottom: 6px; }
.form-error-summary ul { margin: 0; padding-left: 19px; color: var(--text-soft); }
.result-entry-section { margin-top: 32px; }
.result-entry-list {
  display: grid;
  gap: 8px;
  border: 1px solid var(--border);
  border-radius: 13px;
  padding: 8px;
  background: var(--surface-2);
}
.result-entry-row {
  display: grid;
  grid-template-columns: 44px minmax(0,1fr) 150px 112px;
  gap: 12px;
  align-items: end;
  padding: 11px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--surface);
  transition: border-color .18s,box-shadow .18s;
}
.result-entry-row:hover { border-color: var(--border); box-shadow: var(--shadow-xs); }
.result-entry-row.has-duplicate { border-color: color-mix(in srgb,var(--danger) 55%,var(--border)); background: color-mix(in srgb,var(--danger) 3%,var(--surface)); }
.result-entry-index {
  width: 34px;
  height: 34px;
  margin-bottom: 7px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: var(--surface-3);
  color: var(--muted);
  font: 700 .66rem Montserrat,sans-serif;
}
.result-grade-field .select { font-weight: 700; }
.result-row-status { align-self: center; color: var(--danger); font: 600 .65rem Inter,sans-serif; }
.result-entry-error { margin: 10px 0 0; }
.result-entry-section > .field-hint { display: block; margin-top: 10px; }
.form-actions {
  position: sticky;
  bottom: 0;
  z-index: 5;
  margin: 34px -38px -38px;
  padding: 16px 38px;
  justify-content: space-between;
  background: var(--surface);
  border-top: 1px solid var(--border);
  border-radius: 0 0 var(--radius) var(--radius);
  box-shadow: 0 -14px 30px rgba(17,24,39,.045);
}
.application-review-grid { padding: 18px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-2); }
.application-review-passport { border-radius: 12px; box-shadow: var(--shadow-xs); }
.result-review { margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--border); }
.result-review-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.result-review-grid > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 48px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-2);
}
.result-review-grid span { color: var(--text-soft); font-size: .76rem; }
.result-review-grid strong { color: var(--primary); font: 700 .78rem Montserrat,sans-serif; }
.review-hint { margin-top: 18px !important; }

/* Auth/applicant cards and status pages ----------------------------------- */
.public-shell main.section > .card[style*="max-width"] { box-shadow: var(--shadow-sm); }
.status-indicator { box-shadow: 0 0 0 5px var(--surface); }
.progress { background: var(--surface-3); border-radius: 999px; }
.progress > span { border-radius: inherit; }
.empty-state { padding: 28px; border-radius: 12px; background: var(--surface-2); border: 1px dashed var(--border-strong); }
.alert-card { border-left-width: 3px; }

/* Modal / command palette / notices --------------------------------------- */
.modal-overlay,.command-overlay { background: rgba(13,15,18,.52); }
.modal,.command-dialog {
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--surface);
  box-shadow: 0 34px 90px rgba(0,0,0,.22);
}
.command-dialog { overflow: hidden; }
.command-input { background: var(--surface); border-bottom-color: var(--border); }
.command-result { border-radius: 9px; }
.command-result:hover { background: var(--surface-2); }
.toast { border-radius: 12px; box-shadow: var(--shadow-lg); }
.announcement { border-bottom-color: var(--border); }

/* Finance / registration -------------------------------------------------- */
.clearance-panel,.registration-card,.fee-breakdown-item {
  border-radius: 13px;
  box-shadow: var(--shadow-xs);
}
.fee-breakdown-item { padding: 18px; }
.installment-row { border-color: var(--border); }
.course-row { border-radius: 10px; }
.course-row:hover { background: var(--surface-2); }
.unit-counter { border-radius: 13px; box-shadow: var(--shadow-lg); }
.segmented { border-radius: 11px; padding: 4px; background: var(--surface-2); }
.segmented a,.segmented button { border-radius: 8px; }

/* Documents --------------------------------------------------------------- */
.document-sheet { border-radius: 13px; box-shadow: var(--shadow-sm); }
.document-toolbar { padding: 10px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-xs); }

/* Responsive -------------------------------------------------------------- */
@media (max-width: 1180px) {
  .public-nav { gap: 3px; }
  .public-nav > a:not(.btn) { padding-inline: 7px; }
  .hero { grid-template-columns: 1fr 380px; gap: 42px; }
  .result-review-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 1000px) {
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-panel { min-height: 390px; }
  .public-header { height: 70px; }
  .nav-toggle { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--border); border-radius: 10px; color: var(--text); }
  .public-nav {
    position: absolute;
    top: calc(100% + 1px);
    left: 14px;
    right: 14px;
    display: none;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: var(--surface);
    box-shadow: var(--shadow-lg);
  }
  .public-nav.open { display: grid; }
  .public-nav > a { width: 100%; }
  .public-nav .btn { justify-content: center; }
  .content-layout { grid-template-columns: 1fr; }
  .sidebar-card { position: static; }
  .result-entry-row { grid-template-columns: 38px minmax(0,1fr) 125px; }
  .result-row-status { grid-column: 2/-1; margin-top: -2px; }
}

@media (max-width: 720px) {
  body { font-size: 14px; }
  .public-header { padding-inline: 15px; }
  .brand { min-width: 0; }
  .brand small { display: none; }
  .hero { padding: 56px 18px; }
  .hero h1 { font-size: clamp(2.65rem,13vw,4.2rem); }
  .hero-proof { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
  .hero-proof span { min-width: 0; }
  .hero-proof strong { font-size: 1.2rem; }
  .section { padding: 58px 16px; }
  .section-heading { align-items: flex-start; flex-direction: column; margin-bottom: 26px; }
  .feature-grid,.programme-grid,.news-grid { grid-template-columns: 1fr; }
  .feature-card.primary { grid-row: auto; min-height: 330px; }
  .programme-card,.news-card { min-height: 0; }
  .cta-band { margin: 0 16px 56px; padding: 30px 22px; flex-direction: column; align-items: flex-start; }
  .public-footer { grid-template-columns: 1fr; gap: 30px; padding: 52px 18px 24px; }
  .page-hero { padding: 58px 18px 42px; }

  .topbar { height: 64px; padding: 0 12px; }
  .portal-main { padding: 20px 12px calc(86px + env(safe-area-inset-bottom)); }
  .page-header { align-items: flex-start; }
  .page-header h1 { font-size: 1.9rem; }
  .card { padding: 16px; }
  .card-header { align-items: flex-start; }
  .table-wrap { border-radius: 11px; }

  .form-grid { grid-template-columns: 1fr; gap: 15px; }
  .field.span-2 { grid-column: auto; }
  .input,.select,.textarea { min-height: 49px; font-size: 16px; }
  .textarea { min-height: 112px; }
  .application-shell { padding: 24px 12px 88px; }
  .application-page-header { align-items: flex-start; margin-bottom: 17px; }
  .application-page-header h1 { font-size: 2.25rem; }
  .application-form { padding: 18px 14px; border-radius: 12px; }
  .stepper {
    display: flex;
    overflow-x: auto;
    justify-content: flex-start;
    scrollbar-width: none;
    padding: 6px;
    margin-bottom: 13px;
  }
  .stepper::-webkit-scrollbar { display: none; }
  .step { flex: 0 0 auto; min-height: 43px; padding: 6px 10px; }
  .step-label { white-space: nowrap; }
  .form-section-heading { flex-direction: column; gap: 9px; }
  .result-entry-list { padding: 6px; }
  .result-entry-row {
    grid-template-columns: 34px minmax(0,1fr) 92px;
    gap: 8px;
    padding: 9px;
  }
  .result-entry-index { width: 30px; height: 30px; margin-bottom: 9px; }
  .result-entry-row .field label { font-size: .64rem; }
  .result-entry-row .select { padding-left: 9px; padding-right: 30px; background-position: right 8px center; }
  .result-row-status { grid-column: 2/-1; }
  .form-actions {
    margin: 30px -14px -18px;
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
    gap: 8px;
  }
  .form-actions .btn { flex: 1 1 140px; }
  .result-review-grid { grid-template-columns: 1fr; }
  .application-review-grid { padding: 14px; }

  .filters { padding: 11px; }
  .management-commandbar { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
  .brand strong { max-width: 185px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .hero-proof { grid-template-columns: 1fr 1fr; }
  .hero-panel dl { grid-template-columns: 1fr; }
  .management-commandbar { grid-template-columns: 1fr; }
  .result-entry-row { grid-template-columns: 30px minmax(0,1fr) 80px; }
  .result-entry-row .field label { font-size: .6rem; }
  .result-grade-field .select { padding-left: 8px; }
  .form-actions { display: grid; grid-template-columns: 1fr; }
  .form-actions .btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Auth, registration and shared CRUD polish -------------------------------- */
.auth-section { min-height: calc(100vh - 76px); display: grid; align-items: center; }
.auth-shell { width: min(100%,520px); margin: 0 auto; }
.auth-shell.auth-wide { width: min(100%,560px); }
.auth-shell.auth-status { width: min(100%,650px); }
.auth-heading { margin-bottom: 20px; }
.auth-heading h1 { margin-bottom: 9px; font-size: clamp(2.45rem,5vw,3.7rem); }
.auth-heading p:last-child { max-width: 520px; }
.auth-card { padding: clamp(22px,4vw,30px); box-shadow: var(--shadow-sm); }
.auth-card .field + .field { margin-top: 16px; }
.auth-card > .btn:last-child { margin-top: 20px; width: 100%; }
.auth-card > .actions:last-child { margin-top: 20px; }
.auth-switch { margin-top: 18px; text-align: center; color: var(--muted); }
.application-register-section { padding-top: clamp(50px,7vw,90px); }
.application-register-layout { grid-template-columns: minmax(0,1fr) minmax(280px,340px); max-width: 1180px !important; }
.register-title { font-size: clamp(2.7rem,5vw,4.5rem); max-width: 680px; }
.register-card { margin: 24px 0 16px; }
.register-card > .btn:last-child { width: auto; }
.admission-summary { position: sticky; top: 100px; padding: 26px; box-shadow: var(--shadow-sm); }
.admission-summary h3 { font-size: 1.35rem; }
.crud-editor { margin-bottom: 18px; padding: clamp(20px,3vw,28px); box-shadow: var(--shadow-sm); }
.crud-editor .form-grid { margin-bottom: 22px; }
.crud-form-actions { justify-content: flex-end; padding-top: 18px; border-top: 1px solid var(--border); }

@media (max-width: 900px) {
  .application-register-layout { grid-template-columns: 1fr; }
  .admission-summary { position: static; }
}
@media (max-width: 720px) {
  .auth-section { min-height: auto; padding-top: 42px; padding-bottom: 64px; }
  .auth-heading h1 { font-size: 2.35rem; }
  .auth-card { padding: 18px 15px; }
  .auth-card > .actions:last-child { align-items: stretch; flex-direction: column; }
  .auth-card > .actions:last-child .btn { width: 100%; }
  .application-register-section { padding-top: 42px; }
  .register-title { font-size: 2.65rem; }
  .crud-form-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .crud-form-actions .btn { width: 100%; }
}

/* 2026-08-17 mobile width + bulk admissions hotfix ------------------------ */
.admission-summary-grid {
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.admission-summary-card {
  min-width: 0;
  padding: 14px 15px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: var(--shadow-xs);
  display: grid;
  gap: 7px;
}
.admission-summary-card span {
  color: var(--muted);
  font: 600 .62rem Montserrat,sans-serif;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.admission-summary-card strong {
  font: 700 1.55rem "Space Grotesk",sans-serif;
  letter-spacing: -.035em;
}
.admission-summary-card.is-active {
  border-color: color-mix(in srgb,var(--primary) 35%,var(--border));
  box-shadow: inset 0 3px var(--primary), var(--shadow-xs);
}
.bulk-admission-form { display: grid; gap: 12px; }
.bulk-action-bar {
  position: sticky;
  top: 84px;
  z-index: 12;
  display: grid;
  grid-template-columns: minmax(150px,.42fr) minmax(0,1.58fr);
  gap: 16px;
  align-items: end;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.bulk-selection { display: grid; gap: 2px; align-self: center; }
.bulk-selection-count { font: 700 1rem "Space Grotesk",sans-serif; }
.bulk-selection small { color: var(--muted); }
.bulk-action-controls {
  display: grid;
  grid-template-columns: minmax(170px,1fr) minmax(200px,1.2fr) minmax(210px,1.25fr) auto;
  gap: 9px;
  align-items: end;
}
.compact-field { gap: 5px; }
.compact-field > span { font-size: .61rem; }
.compact-field .input,.compact-field .select { min-height: 42px; }
[data-bulk-programme-field][hidden] { display: none !important; }
.bulk-reason-field.is-required > span::after { content: " *"; color: var(--danger); }
.select-column { width: 62px; text-align: center; }
.select-column input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--primary); }
.check-label { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.admission-queue-table .table td { vertical-align: middle; }

@media (max-width: 1180px) {
  .admission-summary-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .bulk-action-bar { grid-template-columns: 1fr; top: 72px; }
  .bulk-action-controls { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .bulk-action-controls .btn { width: 100%; }
}

/* This override intentionally comes after the 2026 design layer. The prior
   modernization reintroduced the desktop sidebar track below the older media
   query, leaving a blank 270px column on phones/tablets. */
@media (max-width: 1100px) {
  .portal-frame { grid-template-columns: minmax(0,1fr) !important; width: 100%; }
  .portal-body { width: 100%; max-width: 100%; min-width: 0; }
  .sidebar {
    position: fixed !important;
    left: 0;
    top: 0;
    width: min(var(--sidebar-width),86vw);
    transform: translateX(-105%);
    transition: transform .22s ease;
  }
  .sidebar.open { transform: translateX(0); }
  .mobile-only { display: grid; }
  .portal-main { max-width: none; width: 100%; }
}

@media (max-width: 720px) {
  .topbar { width: 100%; min-width: 0; }
  .command-trigger { min-width: 0; width: 44px; flex: 0 0 44px; border-radius: 12px; }
  .command-trigger span,.command-trigger kbd { display: none; }
  .topbar-actions { min-width: 0; margin-left: auto; }
  .topbar .profile-chip { display: none; }
  .student-hero { gap: 10px; border-radius: 13px; box-shadow: none; overflow: visible; }
  .student-welcome { min-height: 0; padding: 19px 17px 18px; }
  .student-welcome h1 { font-size: clamp(1.75rem,9vw,2.25rem); line-height: 1.02; margin-bottom: 10px; overflow-wrap: anywhere; }
  .student-welcome .muted { font-size: .88rem; line-height: 1.55; max-width: 44ch; }
  .student-meta-line { margin-top: 15px; }
  .student-status-panel { gap: 9px; }
  .status-block { min-height: 0; }
  .admission-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .admission-summary-card { padding: 12px; }
  .admission-summary-card strong { font-size: 1.35rem; }
  .bulk-action-bar { position: static; padding: 12px; gap: 10px; }
  .bulk-action-controls { grid-template-columns: 1fr; }
  .bulk-action-controls .field,.bulk-action-controls .btn { width: 100%; }
  .admission-queue-table .table.mobile-cards td.select-column { justify-content: flex-start; }
  .admission-queue-table .table.mobile-cards td.select-column::before { min-width: 76px; }
}

@media (max-width: 430px) {
  .portal-main { padding-left: 10px; padding-right: 10px; }
  .student-welcome { padding: 18px 15px 16px; }
  .student-welcome h1 { font-size: 1.9rem; }
  .student-metrics { grid-template-columns: 1fr 1fr; }
  .admission-summary-grid { grid-template-columns: 1fr 1fr; }
}

/* ========================================================================== */
/* Student dashboard, focused home workspace                                  */
/* ========================================================================== */
.student-dashboard-v2{display:grid;gap:14px;max-width:1500px;margin:0 auto}
.student-overview-card{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 24px;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-xs)}
.student-overview-copy{min-width:0}.student-overview-copy .eyebrow{margin:0 0 5px;color:color-mix(in srgb,var(--primary) 76%,var(--muted))}.student-overview-copy h1{margin:0 0 9px;font-size:clamp(1.55rem,2.2vw,2.1rem);letter-spacing:-.035em}.student-context-list{display:flex;align-items:center;flex-wrap:wrap;gap:7px 13px;color:var(--muted);font-size:.76rem}.student-context-list span{position:relative}.student-context-list span:not(:last-child)::after{content:"";position:absolute;right:-8px;top:50%;width:3px;height:3px;border-radius:50%;background:var(--border-strong)}
.student-overview-states{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:7px;max-width:460px}.student-state-pill{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:7px 10px;border-radius:999px;border:1px solid var(--border);background:var(--surface-2);font:600 .67rem Montserrat,sans-serif;white-space:nowrap}.student-state-pill svg{width:15px;height:15px}.student-state-pill.success{color:var(--success);background:color-mix(in srgb,var(--success) 7%,var(--surface));border-color:color-mix(in srgb,var(--success) 25%,var(--border))}.student-state-pill.warning{color:var(--warning);background:color-mix(in srgb,var(--warning) 7%,var(--surface));border-color:color-mix(in srgb,var(--warning) 25%,var(--border))}.student-state-pill.danger{color:var(--danger);background:color-mix(in srgb,var(--danger) 7%,var(--surface));border-color:color-mix(in srgb,var(--danger) 25%,var(--border))}.student-state-pill.neutral{color:var(--text-soft)}.student-state-dot{width:7px;height:7px;border-radius:50%;background:currentColor}
.student-attention-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;padding:15px 17px;border:1px solid color-mix(in srgb,var(--danger) 25%,var(--border));border-radius:13px;background:color-mix(in srgb,var(--danger) 5%,var(--surface));box-shadow:var(--shadow-xs)}.student-attention-card p{margin:3px 0 0;color:var(--muted);font-size:.78rem}.student-attention-card strong{font-family:"Space Grotesk",sans-serif}.student-attention-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:color-mix(in srgb,var(--danger) 10%,var(--surface));color:var(--danger)}.student-attention-icon svg{width:18px}
.student-academic-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-xs);overflow:hidden}.student-academic-strip>div{min-width:0;padding:16px 20px}.student-academic-strip>div+div{border-left:1px solid var(--border)}.student-academic-strip span{display:block;margin-bottom:6px;color:var(--muted);font:600 .62rem Montserrat,sans-serif;text-transform:uppercase;letter-spacing:.075em}.student-academic-strip strong{display:block;font:700 clamp(1.6rem,2.5vw,2.3rem) "Space Grotesk",sans-serif;line-height:1;letter-spacing:-.045em}.student-academic-strip strong em{font:600 .72rem Montserrat,sans-serif;color:var(--muted);letter-spacing:0;font-style:normal}.student-academic-strip small{display:block;margin-top:7px;color:var(--muted);font-size:.69rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.student-action-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.student-action-item{display:flex;align-items:center;gap:11px;min-width:0;min-height:64px;padding:12px 13px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-xs);transition:transform .18s,border-color .18s,box-shadow .18s}.student-action-item:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--primary) 28%,var(--border));box-shadow:var(--shadow-sm)}.student-action-item>span{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;border-radius:10px;background:var(--primary-light);color:var(--primary)}.student-action-item>span svg{width:18px}.student-action-item div{display:grid;min-width:0;gap:1px}.student-action-item strong{font:700 .76rem "Space Grotesk",sans-serif}.student-action-item small{color:var(--muted);font-size:.64rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.student-dashboard-content{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(320px,.6fr);gap:14px;align-items:start}.student-dashboard-side{display:grid;gap:14px}.student-section-header{align-items:center;margin-bottom:14px}.student-section-header .eyebrow{margin:0 0 3px;font-size:.6rem}.student-section-header h2{margin:0;font-size:1.08rem}.student-section-header .link{font-size:.72rem;white-space:nowrap}.student-current-courses,.student-mini-panel{padding:18px}.student-course-list{display:grid}.student-course-row{display:grid;grid-template-columns:78px minmax(0,1fr);gap:12px;align-items:center;padding:12px 2px;border-top:1px solid var(--border)}.student-course-row:first-child{border-top:0;padding-top:3px}.student-course-row>strong{font:700 .73rem Montserrat,sans-serif;color:var(--text)}.student-course-row>div{min-width:0;display:grid;gap:2px}.student-course-row>div>span{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.student-course-row small{color:var(--muted);font-size:.68rem}.student-card-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:13px;margin-top:3px;border-top:1px solid var(--border);color:var(--muted);font-size:.7rem}.student-empty-compact{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:15px;border:1px dashed var(--border-strong);border-radius:11px;background:var(--surface-2)}.student-empty-compact>div:first-child{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:var(--surface);color:var(--primary)}.student-empty-compact>div:nth-child(2){min-width:0}.student-empty-compact strong{font-size:.78rem}.student-empty-compact p{margin:2px 0 0;color:var(--muted);font-size:.69rem}
.student-class-list{display:grid}.student-class-row{display:grid;grid-template-columns:74px minmax(0,1fr);gap:12px;padding:11px 0;border-top:1px solid var(--border)}.student-class-row:first-child{padding-top:2px;border-top:0}.student-class-row time,.student-class-row>div{display:grid;align-content:start;gap:2px}.student-class-row time strong{font:700 .7rem Montserrat,sans-serif;color:var(--primary)}.student-class-row time span,.student-class-row>div span{color:var(--muted);font-size:.67rem}.student-class-row>div strong{font-size:.76rem}.student-notice-list{display:grid}.student-notice-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 0;border-top:1px solid var(--border)}.student-notice-row:first-child{padding-top:2px;border-top:0}.student-notice-row>div{min-width:0;display:grid;gap:3px}.student-notice-row strong{font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.student-notice-row span{color:var(--muted);font-size:.65rem}.student-notice-row.urgent{border-left:2px solid var(--primary);padding-left:10px}.student-panel-empty{margin:0;font-size:.72rem}
@media(max-width:980px){.student-dashboard-content{grid-template-columns:1fr}.student-dashboard-side{grid-template-columns:1fr 1fr}.student-overview-card{align-items:flex-start}.student-overview-states{max-width:360px}}
@media(max-width:720px){.student-dashboard-v2{gap:10px}.student-overview-card{display:grid;gap:14px;padding:17px}.student-overview-copy h1{font-size:1.55rem}.student-context-list{gap:5px 11px;font-size:.7rem}.student-overview-states{justify-content:flex-start;max-width:none}.student-state-pill{min-height:31px;padding:6px 9px;font-size:.61rem}.student-attention-card{grid-template-columns:auto minmax(0,1fr);padding:13px}.student-attention-card .btn{grid-column:1/-1;width:100%}.student-academic-strip>div{padding:13px 11px}.student-academic-strip strong{font-size:1.55rem}.student-academic-strip small{font-size:.6rem}.student-action-grid{grid-template-columns:1fr 1fr;gap:8px}.student-action-item{min-height:59px;padding:10px}.student-action-item>span{width:34px;height:34px;flex-basis:34px}.student-dashboard-side{grid-template-columns:1fr}.student-current-courses,.student-mini-panel{padding:15px}.student-course-row{grid-template-columns:68px minmax(0,1fr);padding:10px 0}.student-course-row>div>span{font-size:.75rem}.student-empty-compact{grid-template-columns:auto minmax(0,1fr)}.student-empty-compact .btn{grid-column:1/-1;width:100%}.student-section-header h2{font-size:1rem}}
@media(max-width:390px){.student-academic-strip>div{padding:12px 8px}.student-academic-strip strong{font-size:1.42rem}.student-academic-strip strong em{display:none}.student-academic-strip small{font-size:.56rem}.student-action-item small{display:none}.student-action-item{min-height:54px}.student-context-list span:nth-child(4){display:none}}

/* ========================================================================== */
/* EduQuill unified portal composition                                        */
/* Carries the lean student-dashboard language across every authenticated UI. */
/* ========================================================================== */
.portal-shell {
  --workspace-gap: 14px;
  --workspace-pad: 22px;
  --workspace-radius: 16px;
}
.portal-shell .portal-main {
  max-width: 1500px;
  padding: 24px clamp(18px,2.6vw,36px) 52px;
}
.portal-shell .portal-main > * + * { margin-top: var(--workspace-gap); }
.portal-shell .portal-main > .page-header,
.portal-shell .management-dashboard > .page-header {
  min-height: 118px;
  margin: 0 0 var(--workspace-gap);
  padding: 20px 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--workspace-radius);
  box-shadow: var(--shadow-xs);
}
.portal-shell .page-header > div:first-child { min-width: 0; max-width: 850px; }
.portal-shell .page-header .eyebrow {
  margin: 0 0 8px;
  color: color-mix(in srgb,var(--primary) 72%,var(--muted));
  font-size: .63rem;
  letter-spacing: .11em;
}
.portal-shell .page-header h1 {
  margin: 0;
  font-size: clamp(1.65rem,2.3vw,2.25rem);
  line-height: 1.02;
  letter-spacing: -.035em;
}
.portal-shell .page-header h1 + p,
.portal-shell .page-header > div > p:last-child {
  max-width: 760px;
  margin: 8px 0 0;
  color: var(--muted);
  font-size: .82rem;
  line-height: 1.55;
}
.portal-shell .page-header > .btn,
.portal-shell .page-header > form,
.portal-shell .page-header > .actions { flex: 0 0 auto; }
.portal-shell .page-header > form .btn { min-width: 128px; }

/* Cards, sections and dashboard blocks */
.portal-shell .card,
.portal-shell .registration-card,
.portal-shell .clearance-panel,
.portal-shell .document-toolbar,
.portal-shell .filters,
.portal-shell .table-wrap,
.portal-shell .management-command,
.portal-shell .quick-action,
.portal-shell .student-metric,
.portal-shell .fee-breakdown-item,
.portal-shell .auth-card {
  border-color: var(--border);
  border-radius: var(--workspace-radius);
  box-shadow: var(--shadow-xs);
}
.portal-shell .card {
  padding: var(--workspace-pad);
  transition: border-color .18s ease,box-shadow .18s ease;
}
.portal-shell .card:hover { border-color: var(--border-strong); }
.portal-shell .card-header {
  margin-bottom: 16px;
  padding-bottom: 0;
  align-items: flex-start;
}
.portal-shell .card-header h2,
.portal-shell .card-header h3 { margin: 0; }
.portal-shell .card-header h2 { font-size: 1.12rem; }
.portal-shell .card-header h3 { font-size: .98rem; }
.portal-shell .card-header p { margin: 4px 0 0; font-size: .76rem; }
.portal-shell .card > h2:first-child,
.portal-shell .card > h3:first-child { font-size: 1.12rem; margin-bottom: 16px; }

/* Compact overview metrics, same rhythm as the student academic strip */
.portal-shell .bento { gap: 10px; margin-bottom: 0; }
.portal-shell .metric {
  min-height: 112px;
  justify-content: flex-start;
  gap: 14px;
  padding: 18px 19px;
}
.portal-shell .metric .label {
  color: var(--muted);
  font-size: .61rem;
  letter-spacing: .09em;
}
.portal-shell .metric .value {
  margin-top: auto;
  font-size: clamp(1.55rem,2.2vw,2.05rem);
  line-height: .95;
  letter-spacing: -.04em;
}
.portal-shell .metric .meta { margin-top: -8px; font-size: .68rem; }
.portal-shell .metric-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--primary-light);
  color: var(--primary);
}
.portal-shell .primary-card.metric { background: var(--surface); color: var(--text); border-color: var(--border); }
.portal-shell .primary-card.metric .label,
.portal-shell .primary-card.metric .meta { color: var(--muted) !important; }
.portal-shell .primary-card.metric .value { color: var(--text); }
.portal-shell .primary-card.metric .metric-icon { background: var(--primary-light); color: var(--primary); }
.portal-shell .gold-card,.portal-shell .academic-milestone { border-top-width: 1px; }

/* Management shortcuts become the staff equivalent of student action tiles */
.portal-shell .management-dashboard { gap: var(--workspace-gap); }
.portal-shell .management-commandbar { gap: 10px; }
.portal-shell .management-command {
  min-height: 76px;
  padding: 13px 14px;
  gap: 11px;
  background: var(--surface);
}
.portal-shell .management-command:hover {
  transform: none;
  border-color: color-mix(in srgb,var(--primary) 30%,var(--border));
  box-shadow: var(--shadow-sm);
}
.portal-shell .management-command > span {
  width: 38px;
  height: 38px;
  flex-basis: 38px;
  border-radius: 10px;
  background: var(--primary-light);
  color: var(--primary);
}
.portal-shell .management-command strong { font-size: .78rem; }
.portal-shell .management-command small { font-size: .64rem; line-height: 1.35; }
.portal-shell .management-activity { padding: 11px 0; }

/* Lists, tables and operational queues */
.portal-shell .table-wrap {
  overflow: auto;
  background: var(--surface);
}
.portal-shell .table th {
  position: static;
  padding: 11px 13px;
  background: var(--surface-2);
  color: var(--muted);
  font-size: .61rem;
  letter-spacing: .075em;
}
.portal-shell .table td {
  padding: 12px 13px;
  border-bottom-color: var(--border);
  font-size: .77rem;
}
.portal-shell .table td strong { color: var(--text); }
.portal-shell .table tbody tr:hover { background: color-mix(in srgb,var(--primary) 2.5%,var(--surface)); }
.portal-shell .table .actions { gap: 6px; }
.portal-shell .table .btn-sm { min-height: 33px; padding: 6px 9px; }
.portal-shell details > summary.btn { list-style: none; }
.portal-shell details > summary.btn::-webkit-details-marker { display: none; }
.portal-shell details[open] > summary.btn { border-color: color-mix(in srgb,var(--primary) 30%,var(--border)); color: var(--primary); }
.portal-shell details > form,
.portal-shell details > .card {
  padding: 12px !important;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}

/* Search, filter and segmented controls */
.portal-shell .filters {
  margin: 0 0 var(--workspace-gap);
  padding: 12px;
  gap: 9px;
  align-items: end;
  background: var(--surface);
}
.portal-shell .filters .field { margin: 0; min-width: 150px; }
.portal-shell .filters .field label { font-size: .63rem; }
.portal-shell .filters .input,
.portal-shell .filters .select { min-height: 40px; }
.portal-shell .filters .btn { min-height: 40px; }
.portal-shell .segmented {
  min-height: 42px;
  margin: 0 0 var(--workspace-gap) !important;
  padding: 4px;
  border-radius: 12px;
  background: var(--surface);
  box-shadow: var(--shadow-xs);
}
.portal-shell .segmented a,
.portal-shell .segmented button { min-height: 32px; display: inline-flex; align-items: center; }
.portal-shell .segmented .active { background: var(--primary-light); color: var(--primary); box-shadow: none; }

/* Forms use the same calm spacing and contained blocks as dashboard cards */
.portal-shell .form-grid { gap: 14px 18px; }
.portal-shell .field { gap: 6px; margin-bottom: 14px; }
.portal-shell .field label { font-size: .66rem; color: var(--text-soft); }
.portal-shell .input,
.portal-shell .select,
.portal-shell .textarea {
  min-height: 45px;
  padding: 10px 12px;
  border-radius: 10px;
  background: var(--surface);
}
.portal-shell .textarea { min-height: 108px; }
.portal-shell .form-section {
  margin-top: 22px;
  padding-top: 22px;
}
.portal-shell .form-section-heading { margin-bottom: 15px; }
.portal-shell .form-section-heading h3 { font-size: 1.06rem; }
.portal-shell .checkbox-row,
.portal-shell .check-row {
  padding: 11px 12px !important;
  border-radius: 11px;
  background: var(--surface-2);
}
.portal-shell .crud-editor { margin-bottom: var(--workspace-gap); }
.portal-shell .crud-form-actions {
  gap: 8px;
  padding-top: 14px;
}

/* Alerts, notices, messages and empty states */
.portal-shell .alert-card {
  margin: 0 0 var(--workspace-gap);
  padding: 14px 15px;
  border-radius: 13px;
  background: var(--surface);
}
.portal-shell .alert-card strong { font-size: .82rem; }
.portal-shell .alert-card p { margin-top: 3px; font-size: .75rem; }
.portal-shell .announcement {
  margin: 0;
  padding: 15px 0;
  border-bottom: 1px solid var(--border);
}
.portal-shell .announcement:last-child { border-bottom: 0; }
.portal-shell .announcement.urgent {
  margin: 5px 0;
  padding: 14px;
  border: 1px solid color-mix(in srgb,var(--primary) 20%,var(--border));
  border-left: 3px solid var(--primary);
  border-radius: 12px;
  background: color-mix(in srgb,var(--primary) 3%,var(--surface));
}
.portal-shell .announcement-meta { gap: 8px; font-size: .63rem; }
.portal-shell .empty-state {
  min-height: 180px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  padding: 28px 20px;
  border: 1px dashed var(--border-strong);
  border-radius: 13px;
  background: var(--surface-2);
}
.portal-shell .empty-state h3 { margin: 0; font-size: 1rem; }
.portal-shell .empty-state p { margin: 0; font-size: .75rem; }

/* Finance, registration, schedules and document centres */
.portal-shell .fee-breakdown-list { gap: 10px; }
.portal-shell .fee-breakdown-item { padding: 16px; }
.portal-shell .fee-breakdown-head h3 { font-size: .98rem; }
.portal-shell .fee-amount strong { font-size: 1.08rem; }
.portal-shell .installment-row { padding: 9px 0; }
.portal-shell .course-picker { gap: 8px; }
.portal-shell .course-row {
  min-height: 62px;
  padding: 11px 12px;
  border-radius: 12px;
  background: var(--surface);
}
.portal-shell .course-row:has(input:checked) {
  background: color-mix(in srgb,var(--primary) 3%,var(--surface));
  border-color: color-mix(in srgb,var(--primary) 35%,var(--border));
}
.portal-shell .schedule { gap: 8px; }
.portal-shell .schedule-item {
  padding: 13px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}
.portal-shell .document-toolbar { padding: 9px; }
.portal-shell .document-sheet { border-radius: var(--workspace-radius); }

/* Shared account/auth pages */
.portal-shell .auth-card { padding: 22px; }
.portal-shell .auth-heading h1 { font-size: clamp(2rem,4vw,3rem); }
.portal-shell .auth-heading p { font-size: .82rem; }

/* Shell chrome */
.portal-shell .topbar {
  height: 68px;
  padding: 0 clamp(14px,2vw,24px);
}
.portal-shell .command-trigger {
  height: 40px;
  min-width: 280px;
  border-radius: 11px;
  background: var(--surface-2);
}
.portal-shell .profile-chip > span { width: 36px; height: 36px; }
.portal-shell .sidebar-brand { height: 68px; padding: 11px 18px; }
.portal-shell .sidebar-brand img { width: 38px; height: 42px; }
.portal-shell .sidebar nav { padding-top: 12px; }
.portal-shell .nav-group { margin-bottom: 13px; }
.portal-shell .nav-group > p { padding: 7px 10px 5px; font-size: .59rem; letter-spacing: .1em; }
.portal-shell .nav-group a,
.portal-shell .sidebar-logout {
  min-height: 39px;
  padding: 9px 10px;
  border-radius: 9px;
  font-size: .69rem;
}
.portal-shell .nav-group a.active {
  background: rgba(255,255,255,.075);
  box-shadow: inset 2px 0 var(--primary);
}
.portal-shell .nav-group a:hover { background: rgba(255,255,255,.055); }

/* Mobile: preserve the same hierarchy instead of merely stacking desktop UI */
@media (max-width: 720px) {
  .portal-shell { --workspace-gap: 10px; --workspace-pad: 15px; }
  .portal-shell .portal-main {
    padding: 14px 10px calc(82px + env(safe-area-inset-bottom));
  }
  .portal-shell .portal-main > .page-header,
  .portal-shell .management-dashboard > .page-header {
    min-height: 0;
    margin-bottom: 10px;
    padding: 16px;
    gap: 14px;
    align-items: flex-start;
    border-radius: 15px;
  }
  .portal-shell .page-header h1 { font-size: 1.55rem; }
  .portal-shell .page-header h1 + p,
  .portal-shell .page-header > div > p:last-child { margin-top: 6px; font-size: .74rem; line-height: 1.45; }
  .portal-shell .page-header > .btn,
  .portal-shell .page-header > form,
  .portal-shell .page-header > .actions { width: 100%; }
  .portal-shell .page-header > .btn { justify-content: center; }
  .portal-shell .page-header > form .btn { width: 100%; }
  .portal-shell .page-header .actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }

  .portal-shell .card { padding: 15px; border-radius: 15px; }
  .portal-shell .card-header { margin-bottom: 13px; gap: 10px; }
  .portal-shell .card-header h2 { font-size: 1rem; }
  .portal-shell .bento { gap: 8px; }
  .portal-shell .metric { min-height: 96px; padding: 14px; gap: 9px; }
  .portal-shell .metric .value { font-size: 1.55rem; }
  .portal-shell .metric .meta { margin-top: -4px; font-size: .62rem; }

  .portal-shell .management-commandbar { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .portal-shell .management-command { min-height: 64px; padding: 10px; }
  .portal-shell .management-command > span { width: 34px; height: 34px; flex-basis: 34px; }
  .portal-shell .management-command small { display: none; }

  .portal-shell .filters { padding: 10px; gap: 8px; }
  .portal-shell .filters .field { width: 100%; min-width: 0; }
  .portal-shell .filters .btn { flex: 1; }

  .portal-shell .table-wrap {
    border: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
  }
  .portal-shell .table.mobile-cards tbody { display: grid; gap: 8px; }
  .portal-shell .table.mobile-cards tr {
    margin: 0;
    padding: 11px 12px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--surface);
    box-shadow: var(--shadow-xs);
  }
  .portal-shell .table.mobile-cards tr:first-child { border-top: 1px solid var(--border); }
  .portal-shell .table.mobile-cards td {
    padding: 6px 0;
    gap: 16px;
    border-bottom: 1px solid var(--surface-2);
    text-align: right;
    font-size: .73rem;
  }
  .portal-shell .table.mobile-cards td:last-child { border-bottom: 0; }
  .portal-shell .table.mobile-cards td::before {
    min-width: 90px;
    color: var(--muted);
    font-size: .59rem;
    letter-spacing: .035em;
    text-transform: uppercase;
  }
  .portal-shell .table.mobile-cards td .actions { justify-content: flex-end; }
  .portal-shell .table.mobile-cards td .select { width: auto !important; min-width: 116px; }

  .portal-shell .form-grid { gap: 0; }
  .portal-shell .field { margin-bottom: 12px; }
  .portal-shell .input,.portal-shell .select,.portal-shell .textarea { min-height: 44px; }
  .portal-shell .checkbox-row,.portal-shell .check-row { padding: 10px !important; }

  .portal-shell .announcement.urgent { padding: 12px; }
  .portal-shell .empty-state { min-height: 150px; }

  .portal-shell .topbar { height: 62px; padding: 0 10px; }
  .portal-shell .command-trigger { min-width: 40px; width: 40px; height: 40px; border-radius: 11px; }
  .portal-shell .icon-button { width: 40px; height: 40px; border-radius: 11px; }
  .portal-shell .mobile-bottom-nav {
    height: calc(62px + env(safe-area-inset-bottom));
    padding: 0 4px env(safe-area-inset-bottom);
    background: var(--surface);
    box-shadow: 0 -8px 24px rgba(17,24,39,.05);
  }
  .portal-shell .mobile-bottom-nav a,
  .portal-shell .mobile-bottom-nav button { gap: 2px; color: var(--muted); font-size: .56rem; }
  .portal-shell .mobile-bottom-nav a.active { color: var(--primary); }
  .portal-shell .mobile-bottom-nav svg { width: 18px; height: 18px; }
}

@media (max-width: 430px) {
  .portal-shell .page-header .actions { grid-template-columns: 1fr; }
  .portal-shell .management-commandbar { grid-template-columns: 1fr 1fr; }
  .portal-shell .management-command { min-height: 58px; }
  .portal-shell .metric { min-height: 90px; }
}

@media print {
  .portal-shell .portal-main { padding: 0; max-width: none; }
  .portal-shell .page-header { box-shadow: none; border: 0; padding: 0 0 10mm; }
  .portal-shell .card,.portal-shell .table-wrap { box-shadow: none; }
}
