/* Flycoded Enterprise UI — progressive design layer, 2026-10-25.
   Loaded after existing CSS. Non-destructive: does not replace business logic,
   selectors used as JS hooks, role guards, or existing responsive navigation. */
:root {
  --fc-navy:#0a1b3d; --fc-navy-2:#15305c; --fc-orange:#ff6a00; --fc-orange-hover:#c94d00;
  --fc-page:#f4f7fb; --fc-panel:#fff; --fc-panel-muted:#f8fafc;
  --fc-ink:#17243b; --fc-subtle:#52617a; --fc-line:#d9e1ec;
  --fc-focus:#ff9b55; --fc-danger:#ae2d2d; --fc-success:#16744a; --fc-warning:#8b510d;
  --fc-radius-sm:8px; --fc-radius:12px; --fc-radius-lg:16px;
  --fc-shadow:0 2px 10px rgba(10,27,61,.045);
  --fc-space-1:4px; --fc-space-2:8px; --fc-space-3:12px; --fc-space-4:16px;
  --fc-space-5:20px; --fc-space-6:24px; --fc-space-7:32px; --fc-space-8:40px;
  --fc-container:1240px;
  --font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-xs:13px; --font-sm:14px; --font-base:16px; --font-md:17px;
  --font-lg:20px; --font-xl:24px; --font-2xl:30px; --font-3xl:36px;
  --space-4:16px; --space-5:20px; --space-6:24px;
  --radius-lg:var(--fc-radius-lg); --border:var(--fc-line);
}
html {scroll-padding-top:100px; -webkit-text-size-adjust:100%;}
body {font-size:16px;line-height:1.58;color:var(--fc-ink);overflow-wrap:break-word}
:is(main,section,article,aside,div,form,fieldset,table){min-width:0}
:is(a,button,input,select,textarea,summary,[role="button"],[tabindex="0"]):focus-visible {
  outline:3px solid var(--fc-focus);outline-offset:3px;
}
:is(a,button){touch-action:manipulation}
:is(button,input,select,textarea){font-size:16px}
:is(input,select,textarea){max-width:100%}
:is(img,video,iframe){max-width:100%;height:auto}
svg.site-icon,.portal-nav-svg,.portal-mobile-icon,.mini-inline-icon{flex-shrink:0;vertical-align:middle}
:where(.container,.home-container){max-width:var(--fc-container)}
:where(.public-body,.auth-focus-body) :is(.container,.home-container){width:min(calc(100% - 40px),var(--fc-container))}
/* Harmonised display and reading hierarchy. Page classes keep control of their branding. */
:where(.public-body,.auth-focus-body,.portal-body) :is(p,li,blockquote){line-height:1.62}
:where(.public-body,.auth-focus-body) :is(.page-hero,.public-page-hero,.inner-v2-hero,.inner-v3-hero) h1 {
  font-size:clamp(28px,3.2vw,40px);line-height:1.16;letter-spacing:-.035em;
}
:where(.public-body,.auth-focus-body) :is(.section-heading,.public-heading) h2 {
  font-size:clamp(22px,2.15vw,28px);letter-spacing:-.025em;line-height:1.25;
}
:where(.public-body,.portal-body,.auth-focus-body) :is(.eyebrow,.portal-kicker,.kicker){letter-spacing:.07em}
:where(.public-body,.portal-body) :is(.lead,.section-description,.muted,.portal-page-head p,.dashboard-head p){font-size:15px;line-height:1.65;color:var(--fc-subtle)}
:where(.public-body,.portal-body,.auth-focus-body) :is(small,.meta,.caption,.helper-text){line-height:1.5}
:where(.public-body,.portal-body,.auth-focus-body) :is(h1,h2,h3,h4){overflow-wrap:break-word;text-wrap:pretty}
/* Cards, grids, and images across all public modules, Academy and portals. */
:where(.public-body,.portal-body) :is(.card,.inner-card,.mini-card,.course-card,.service-card,.blog-card,.portfolio-card,.portal-panel,.portal-stat-card,.portal-action-card,.table-card) {
  max-width:100%;min-width:0;border-radius:var(--fc-radius-lg);
}
:where(.public-body,.portal-body) :is(.card,.inner-card,.mini-card,.course-card,.service-card,.blog-card,.portal-panel,.table-card){box-shadow:var(--fc-shadow)}
:where(.public-body,.portal-body) :is(.card-grid,.fit-card-grid,.portal-grid,.dashboard-grid,.portal-action-grid,.portal-stat-grid){align-items:stretch}
:where(.public-body,.portal-body) :is(.card,.course-card,.service-card,.blog-card,.portfolio-card,.portal-panel) :is(h2,h3,h4){line-height:1.28}
:where(.public-body,.portal-body) :is(.card,.course-card,.service-card,.blog-card,.portfolio-card) :is(p,small){overflow-wrap:anywhere}
:where(.public-body,.portal-body) :is(.course-card,.blog-card,.portfolio-card) img{object-fit:cover}
:where(.public-body,.portal-body) :is(.card-actions,.hero-actions,.inline-actions){flex-wrap:wrap;gap:10px}
/* Touch-friendly interactive controls without changing route/action semantics. */
:where(.public-body,.portal-body,.auth-focus-body) :is(.btn,.home-btn,.auth-primary-btn,.auth-clean-submit,button[type="submit"]){
  min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:9px;
  line-height:1.3;font-weight:650;border-radius:10px;text-align:center;
}
:where(.public-body,.portal-body,.auth-focus-body) :is(.btn,.home-btn,.auth-primary-btn,.auth-clean-submit) :is(svg,img){width:18px;height:18px}
:where(.public-body,.portal-body,.auth-focus-body) :is(.btn,.home-btn,button):disabled {
  opacity:.56;cursor:not-allowed;box-shadow:none;
}
:where(.public-body,.portal-body,.auth-focus-body) :is(.btn,.home-btn,button).fc-is-submitting{cursor:progress}
.fc-is-submitting::after{content:"";width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;display:inline-block;animation:fc-spin .7s linear infinite}
@keyframes fc-spin{to{transform:rotate(360deg)}}
/* Form fields & validation: leave names, CSRF, autocomplete and server errors intact. */
:where(.public-body,.portal-body,.auth-focus-body) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),select,textarea){
  min-height:44px;line-height:1.4;border-radius:9px;max-width:100%;
}
:where(.public-body,.portal-body,.auth-focus-body) :is(textarea){height:auto;min-height:100px;resize:vertical}
:where(.public-body,.portal-body,.auth-focus-body) :is(input,select,textarea)[aria-invalid="true"]{border-color:var(--fc-danger)}
:where(.public-body,.portal-body,.auth-focus-body) :is(input,select,textarea)::placeholder{color:#687890;opacity:1}
:where(.public-body,.portal-body,.auth-focus-body) :is(label,.field-label){font-size:14px;font-weight:650}
:where(.public-body,.portal-body,.auth-focus-body) :is(.form-grid,.auth-form-grid) > *{min-width:0}
:where(.public-body,.portal-body,.auth-focus-body) :is(input[type="checkbox"],input[type="radio"]){accent-color:var(--fc-orange);min-width:16px;min-height:16px}
:where(.public-body,.portal-body,.auth-focus-body) :is(input[type="file"]){width:100%;max-width:100%;padding:10px}
:where(.public-body,.portal-body,.auth-focus-body) :is(.flash,.alert,.notice,.form-error){border-radius:10px;line-height:1.55;overflow-wrap:anywhere}
/* Never overlay an input with a decorative icon; password visibility stays separate. */
:where(.auth-focus-body,.public-body) .auth-clean .auth-clean-input{display:flex;align-items:center;min-width:0}
:where(.auth-focus-body,.public-body) .auth-clean .auth-clean-input input{min-width:0;flex:1;font-size:16px}
:where(.auth-focus-body,.public-body) .auth-clean .auth-clean-field{min-width:0}
:where(.auth-focus-body,.public-body) .auth-clean .password-toggle{position:relative;flex:0 0 auto;min-width:55px;height:44px;min-height:44px;inset:auto;transform:none;white-space:nowrap}
:where(.auth-focus-body,.public-body) .auth-clean :is(.auth-clean-field-help,.auth-clean-switch,.auth-clean-support){font-size:14px;line-height:1.55}
:where(.auth-focus-body,.public-body) .auth-clean :is(.auth-clean-field,.auth-clean-field-label){margin-bottom:14px}
:where(.auth-focus-body,.public-body) .auth-clean .auth-clean-tabs a{min-height:44px;display:inline-flex;align-items:center}
:where(.auth-focus-body,.public-body) .auth-clean .auth-clean-panel{min-width:0}
/* Auth and utility screens share the same polished form surfaces. */
:where(.auth-focus-body,.public-body) :is(.auth-clean-panel,.auth-modern-form-panel,.auth-v4-panel){border-radius:var(--fc-radius-lg)}
/* Public navigation, footers and page scroll margin. */
:where(.public-body) :is(.home-site-header,.site-header){z-index:100}
:where(.public-body) .home-site-nav :is(a,button){min-height:44px}
:where(.public-body) .site-nav .drop-menu{max-width:min(400px,calc(100vw - 24px))}
:where(.public-body) .home-footer :is(a,button){min-height:38px}
:where(.public-body) .home-footer :is(.footer-contact-card,.home-footer-column){min-width:0}
:where(.public-body) .home-footer :is(strong,a,p){overflow-wrap:anywhere}
/* Authenticated workspace: actual operations first, steady surfaces, clearer stats. */
.portal-body{
  --portal-bg:var(--fc-page);--portal-card:var(--fc-panel);
  --portal-border:var(--fc-line);--portal-muted:var(--fc-subtle);
}
.portal-body .portal-workspace{min-width:0}
.portal-body .portal-main{max-width:100%;min-width:0}
.portal-body .portal-main :is(.page-hero,.portal-page-head,.dashboard-head) h1{font-size:clamp(26px,2.3vw,36px);line-height:1.2;letter-spacing:-.025em}
.portal-body .portal-main :is(.portal-panel,.portal-action-card,.portal-stat-card){min-width:0}
.portal-body .portal-main :is(.portal-panel-head h2,.admin-section-heading h2){font-size:clamp(18px,1.7vw,23px);line-height:1.3}
.portal-body .portal-main :is(.portal-stat-card,.stat-grid>div,.stat-grid>a){min-height:116px;align-items:center}
.portal-body .portal-main :is(.portal-stat-card strong,.stat-grid strong){font-variant-numeric:tabular-nums}
.portal-body .portal-main :is(.portal-stat-card small,.stat-grid span,.admin-overview-kpi small){font-size:14px;line-height:1.45}
.portal-body .portal-main :is(.portal-panel,.portal-chart-panel,.portal-workflow-illustration){height:auto;max-width:100%}
.portal-body .portal-main :is(.portal-chart-panel svg,.portal-line-chart,.portal-bar-chart){max-width:100%;height:auto}
.portal-body .portal-nav-group a{gap:11px;min-height:40px;line-height:1.35}
.portal-body .portal-nav-group p{font-size:12px;letter-spacing:.08em}
.portal-body .portal-sidebar :is(a,button){touch-action:manipulation}
.portal-body .portal-sidebar .portal-nav-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex:0 0 20px}
.portal-body .portal-sidebar .portal-nav-icon svg{width:17px;height:17px;stroke-width:1.8}
.portal-body .portal-topbar{gap:12px}
.portal-body .portal-profile-button{min-height:44px}
.portal-body .portal-topbar .portal-search-wrap{min-width:0}
.portal-body .portal-topbar input[type="search"]{max-width:100%}
.portal-body .portal-main .portal-page-head .hero-actions{max-width:100%;flex-wrap:wrap}
.portal-body .portal-main :is(.portal-action-card,.dashboard-quick-links a,.admin-overview-kpi) {transition:border-color .15s ease,box-shadow .15s ease}
.portal-body .portal-main :is(.portal-action-card,.dashboard-quick-links a,.admin-overview-kpi):hover{border-color:#afc1d8;box-shadow:0 5px 15px rgba(10,27,61,.075)}
/* Tables remain actual tables: scroll their own region on narrow screens. */
.fc-table-scroller{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin;border-radius:9px}
.fc-table-scroller:focus-visible{outline:3px solid var(--fc-focus);outline-offset:2px}
.fc-table-scroller table{max-width:none;min-width:max(620px,100%);width:100%;border-collapse:separate;border-spacing:0}
.fc-table-scroller :is(td,th){vertical-align:middle;line-height:1.45;white-space:normal}
.fc-table-scroller thead th{position:relative;white-space:nowrap;font-weight:700;font-size:13px;letter-spacing:.018em}
.fc-table-scroller tbody td{font-size:14px}
.fc-table-scroller tbody tr:hover td{background:rgba(10,27,61,.022)}
.fc-table-scroller :is(.btn,.btn-small){white-space:normal;min-width:0}
.fc-table-help{font-size:13px!important;color:var(--fc-subtle);margin:4px 0 8px;line-height:1.4}
/* Alerts, empty states, info banners, pagination, and status labels. */
:where(.public-body,.portal-body,.auth-focus-body) :is(.empty,.portal-empty,.empty-state,.empty-cell){line-height:1.6;max-width:100%}
:where(.public-body,.portal-body) :is(.badge,.status-badge){min-height:22px;display:inline-flex;align-items:center;gap:4px;padding:3px 8px;font-size:13px;line-height:1.3;border-radius:999px;font-weight:650}
:where(.public-body,.portal-body) :is(.pagination,.page-navigation,.table-pagination){display:flex;gap:8px;align-items:center;flex-wrap:wrap}
:where(.public-body,.portal-body) :is(.pagination a,.pagination button){min-height:38px;min-width:38px;display:inline-grid;place-items:center}
:where(.public-body,.portal-body) .flash{border-inline-start:4px solid var(--fc-navy);padding:12px 16px}
:where(.public-body,.portal-body) .flash-success{border-inline-start-color:var(--fc-success)}
:where(.public-body,.portal-body) :is(.flash-error,.flash-danger){border-inline-start-color:var(--fc-danger)}
:where(.public-body,.portal-body) .flash-warning{border-inline-start-color:var(--fc-warning)}
:where(.public-body,.portal-body,.auth-focus-body) [role="alert"]{max-width:100%;overflow-wrap:anywhere}
/* Details/accordion and dialogs: keyboard focus visible, no decorative animations. */
:where(.public-body,.portal-body) summary{cursor:pointer;min-height:42px;display:list-item;scroll-margin-top:100px}
:where(.public-body,.portal-body) dialog{max-width:min(680px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow:auto;border-radius:var(--fc-radius-lg)}
:where(.public-body,.portal-body) dialog::backdrop{background:rgba(10,27,61,.55)}
/* Client, Student, Instructor, Staff and Admin retain the same component scale. */
.portal-body .portal-main :is(.dashboard-quick-links,.portal-grid,.portal-action-grid,.student-dashboard-grid){gap:16px}
.portal-body .portal-main :is(.dashboard-quick-links a,.portal-action-card){min-height:92px}
.portal-body .portal-main :is(.dashboard-quick-links strong,.portal-action-card b,.portal-action-card strong){font-size:15px;line-height:1.4}
.portal-body .portal-main :is(.dashboard-quick-links small,.portal-action-card small){font-size:13px;line-height:1.5}
.portal-body.portal-role-admin .portal-main .admin-feature-hero{gap:22px;border-radius:var(--fc-radius-lg)}
.portal-body.portal-role-admin .portal-main .admin-overview-kpi{min-width:0}
.portal-body.portal-role-admin .portal-main .admin-overview-kpi strong{overflow-wrap:anywhere}
/* Admin email campaign inherits dashboard spacing and input controls. */
.portal-body.portal-role-admin .portal-main :is(.campaign-panel,.campaign-card,.admin-campaigns-panel){min-width:0;max-width:100%}
.portal-body.portal-role-admin .portal-main :is(.campaign-panel,.campaign-card) :is(input,textarea,select){max-width:100%}
/* Skeletons may appear only for genuine in-flight AJAX operations (never default to visible). */
.fc-skeleton[hidden]{display:none}
.fc-skeleton{background:linear-gradient(90deg,#edf1f7 25%,#f6f8fb 40%,#edf1f7 55%);background-size:220% 100%;border-radius:8px;animation:fc-shimmer 1.4s linear infinite}
@keyframes fc-shimmer{to{background-position-x:-220%}}
@media(max-width:1024px){
 .portal-body .portal-main{padding:22px 20px 88px}
 .portal-body.portal-role-admin .admin-feature-hero{grid-template-columns:minmax(0,1fr) minmax(180px,.6fr)}
}
@media(max-width:768px){
 :where(.public-body,.auth-focus-body) :is(.container,.home-container){width:min(calc(100% - 28px),var(--fc-container))}
 :where(.public-body) .home-footer :is(.footer-contact-strip,.home-footer-main){gap:14px}
 .portal-body .portal-topbar{padding-inline:12px}
 .portal-body .portal-main{padding:20px 14px 96px}
 .portal-body .portal-main :is(.portal-page-head,.dashboard-head){gap:12px}
 .portal-body .portal-main :is(.portal-stat-grid,.stat-grid,.dashboard-quick-links,.portal-action-grid){grid-template-columns:repeat(2,minmax(0,1fr))}
 .portal-body.portal-role-admin .admin-feature-hero{grid-template-columns:1fr;padding:22px}
 .portal-body .portal-main :is(.portal-panel,.portal-action-card){padding:18px}
}
@media(max-width:480px){
 :root{--fc-space-7:24px;--fc-space-8:32px}
 :where(.public-body,.auth-focus-body) :is(.container,.home-container){width:min(calc(100% - 24px),var(--fc-container))}
 :where(.public-body,.auth-focus-body) :is(.page-hero,.public-page-hero,.inner-v2-hero,.inner-v3-hero) h1{font-size:clamp(27px,7.4vw,32px)}
 .portal-body .portal-main{padding:16px 12px 96px}
 .portal-body .portal-main :is(.portal-stat-grid,.stat-grid,.dashboard-quick-links,.portal-action-grid){grid-template-columns:1fr}
 .portal-body .portal-main :is(.portal-panel,.portal-action-card,.portal-stat-card){padding:16px}
 .portal-body .portal-main :is(.portal-page-head,.dashboard-head) h1{font-size:clamp(26px,7.5vw,31px)}
 .portal-body .portal-main :is(.hero-actions,.inline-actions) .btn{max-width:100%}
 :where(.auth-focus-body,.public-body) .auth-clean .auth-clean-panel{padding:22px 16px}
 .fc-table-scroller table{min-width:620px}
 .portal-body .portal-main :is(.portal-section-tabs,.admin-tabs,.course-filter-bar){max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
}
@media(max-width:360px){
 .portal-body .portal-topbar-actions{gap:5px}
 .portal-body .portal-topbar :is(.portal-profile-button,.topbar-icon){min-width:36px}
 .portal-body .portal-main{padding-inline:10px}
 .portal-body .portal-main :is(.portal-panel,.portal-action-card,.portal-stat-card){padding:14px}
 :where(.public-body,.auth-focus-body) :is(.container,.home-container){width:calc(100% - 20px)}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media print{.fc-table-scroller{overflow:visible}.fc-table-help{display:none}}

/* Consistent informational error screens, without leaking internals. */
.fc-error-page{min-height:48dvh;display:grid;place-items:center;padding:48px 16px}
.fc-error-card{width:min(100%,620px);padding:clamp(24px,5vw,44px);text-align:left;border:1px solid var(--fc-line);background:#fff;border-radius:var(--fc-radius-lg);box-shadow:var(--fc-shadow)}
.fc-error-card h1{font-size:clamp(26px,3vw,36px);line-height:1.2}
.fc-error-card>p{font-size:16px;color:var(--fc-subtle)}
.fc-error-actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 10px}
.fc-error-help{border-top:1px solid var(--fc-line);padding-top:14px;font-size:14px!important}
.portal-body.portal-dark .fc-table-scroller tbody tr:hover td{background:rgba(255,255,255,.04)}
.portal-body.portal-dark .portal-main :is(.portal-stat-card,.portal-panel,.portal-action-card){color:var(--text-primary)}
