﻿/* Tracked UI skin — deep teal + slate */
/* =========================================================
   01. GLOBAL VARIABLES / DESIGN TOKENS
   Main colors, spacing, borders, shadows, and reusable values.
   ========================================================= */
   :root{
    /* Palette from design reference (minimal deep teal + slate) */
    --primary:#0d6a72;
    --primary-dark:#084a50;
    --primary-light:#e7f2f3;
    --secondary:#4a7c82;
    --accent:#0d6a72;
    --button:#0d6a72;
    --button-hover:#084a50;
    --background:#f3f5f6;
    --surface:#ffffff;
    --border:#d4dee0;
    --text-primary:#1b2c30;
    --text-secondary:#5c6c71;
    --hover:#084a50;
    --active:#084a50;
    --primary-color:var(--primary);
    --secondary-color:var(--secondary);
    --accent-color:var(--accent);
    --background-color:var(--background);
    --surface-color:var(--surface);
    --border-color:var(--border);
    --hover-color:var(--hover);
    --active-color:var(--active);
    --success:#2a7a54;
    --warning:#a65f12;
    --danger:#b03c36;
    --status-completed:#1f7a4d;
    --status-completed-bg:#e7f5ee;
    --status-pending:#a67c00;
    --status-pending-bg:#fff8e5;
    --status-overdue:#c0453d;
    --status-overdue-bg:#fceeee;
    --status-discrepancy:#c9651a;
    --status-discrepancy-bg:#fff2e6;
    --status-disapproved:#c0453d;
    --status-disapproved-bg:#fceeee;
    --status-responded:#3f7378;
    --status-responded-bg:#e7f2f3;
    --info:#2c6a86;
    --primary-rgb:13,106,114;
    --primary-dark-rgb:8,74,80;

    --brand-teal:var(--primary);
    --brand-teal-dark:var(--primary-dark);
    --brand-teal-deep:var(--primary-dark);
    --brand-teal-soft:rgba(var(--primary-rgb),.16);
    --brand-mint:var(--primary-light);
    --bg:var(--background);
    --sidebar:var(--primary-dark);
    --sidebar-deep:var(--primary-dark);
    --sidebar-deeper:#042f33;
    --sidebar-deepest:#031f22;
    --sidebar-ink:#f3f7f7;
    --card:var(--surface);
    --text:var(--text-primary);
    --muted:var(--text-secondary);
    --radius-sm:8px;
    --radius-md:10px;
    --radius-lg:12px;
    --radius-xl:12px;
    --radius-modal:16px;
    --shadow-card:0 1px 2px rgba(27,44,48,.06);
    --space-xs:8px;
    --space-sm:12px;
    --space-md:16px;
    --space-section:16px;
    --space-stack:14px;
    --control-h:36px;
    --search-bar-w:360px;
    --search-bar-min:220px;
    --search-bar-max:420px;
    --search-bar-h:44px;
    --page-padding-x:24px;
    --page-padding-y:20px;
    --app-sidebar-width:248px;
    --font-sans:"Poppins",system-ui,-apple-system,"Segoe UI",sans-serif;
    --type-title-size:1.5rem;
    --type-title-weight:700;
    --type-heading-size:1.125rem;
    --type-heading-weight:700;
    --type-label-size:.8125rem;
    --type-label-weight:600;
    --type-body-size:.9375rem;
    --type-support-size:.8125rem;
    --type-support-weight:500;
    --type-btn-size:.84375rem;
    --type-btn-weight:700;
    --type-link-weight:600;
    --text-heading:var(--brand-teal-deep);
    --text-body:var(--text-primary);
    --text-subtle:var(--text-secondary);
    --text-accent:var(--brand-teal);
    --icon-size:22px;
    --icon-size-nav:22px;
    --icon-size-action:20px;
    --icon-size-ui:20px;
  }

  html,body,
  button,input,select,textarea{
    font-family:var(--font-sans);
  }
  
  /* Shared icon scale â€” slightly larger, consistent stroke boxes across pages */
  body.app .nav-ico,
  body.app .nav-ico svg{
    width:var(--icon-size-nav);
    height:var(--icon-size-nav);
  }
  body.app .nav-link .nav-lock svg{
    width:var(--icon-size-ui);
    height:var(--icon-size-ui);
  }
  body.app .register-icon-btn svg,
  body.app .tf-filter-ico svg,
  body.app .qa-btn .qa-ico svg,
  body.app .register-primary-btn .qa-ico svg{
    width:var(--icon-size-action);
    height:var(--icon-size-action);
    display:block;
  }
  body.app .qa-btn .qa-ico,
  body.app .register-primary-btn .qa-ico{
    width:var(--icon-size-action);
    height:var(--icon-size-action);
    flex:0 0 var(--icon-size-action);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:0;
  }
  body.app .search-ico svg,
  body.app .topbar-search-slot .search-ico svg,
  body.app .register-search .search-ico svg{
    width:var(--icon-size-ui);
    height:var(--icon-size-ui);
  }
  body.app .topbar-bell svg{
    width:var(--icon-size);
    height:var(--icon-size);
  }
  body.app .topbar-notif-ico svg{
    width:var(--icon-size-ui);
    height:var(--icon-size-ui);
  }
  
  body.app{
    font-family:var(--font-sans);
    background:var(--bg);
    color:var(--text);
    font-size:var(--type-body-size);
    line-height:1.5;
    --tracked-btn-h:36px;
    --tracked-btn-r:10px;
    --tracked-btn-px:14px;
    --tracked-btn-fs:var(--type-btn-size);
    --tracked-btn-fw:var(--type-btn-weight);
    --control-h:36px;
    --search-bar-w:360px;
    --search-bar-min:220px;
    --search-bar-max:420px;
    --search-bar-h:44px;
  }

  /* Page title / subtitle in topbar */
  body.app .topbar-heading{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:0;
  }
  body.app .topbar-heading .topbar-title{
    margin:0;
    font-size:var(--type-title-size);
    line-height:1.25;
  }
  body.app .topbar-heading .topbar-subtitle{
    margin:0;
    max-width:52rem;
    font-size:var(--type-support-size);
    line-height:1.45;
  }

  /* =========================================================
     TYPOGRAPHY â€” Poppins scale only (no new font family)
     Title > heading > labels > supporting text > buttons/links
     ========================================================= */
  body.login-page{
    font-family:var(--font-sans);
    font-size:var(--type-body-size);
    line-height:1.5;
  }
  body.app .topbar-title,
  body.app .page-title h1,
  body.login-page .login-panel--brand .login-heading,
  body.login-page .login-card-title,
  body.login-page .login-shell--simple .login-heading{
    font-family:var(--font-sans);
    font-size:var(--type-title-size);
    font-weight:var(--type-title-weight);
    line-height:1.2;
    letter-spacing:-.02em;
    color:var(--text-heading);
  }
  body.login-page .login-panel--brand .login-heading{
    color:#fff !important;
    font-size:clamp(1.2rem, 2.1vw, 1.55rem) !important;
    font-weight:700 !important;
    line-height:1.35 !important;
    letter-spacing:.01em !important;
    max-width:100% !important;
    text-shadow:0 1px 2px rgba(0,0,0,.18);
  }
  body.login-page .login-panel--brand .login-tagline{
    color:#fff !important;
    font-size:15px !important;
    font-weight:500 !important;
    line-height:1.5 !important;
    opacity:1 !important;
    max-width:100% !important;
    text-shadow:0 1px 2px rgba(0,0,0,.16);
  }
  body.login-page .login-panel--brand{
    justify-content:flex-end;
  }
  body.login-page .login-panel--brand .login-brand{
    max-width:100% !important;
    width:100%;
    margin-top:auto;
  }
  body.login-page .login-panel--brand::before{
    background-size:min(118%,540px) !important;
  }
  body.app .panel-head h2,
  body.app .modal-head h2,
  body.app h2,
  body.app .chart h3,
  body.app .h3-spaced,
  body.app .notice-title,
  body.app .doc-title,
  body.app .doc-view-title,
  body.app .shared-info-modal-head h2,
  body.app .confirm-modal .modal-head h2,
  body.login-page .login-modal h2{
    font-family:var(--font-sans);
    font-size:var(--type-heading-size);
    font-weight:var(--type-heading-weight);
    line-height:1.3;
    letter-spacing:-.015em;
    color:var(--text-heading);
  }
  body.app .field-label,
  body.app label.field-label,
  body.app .kpi-label,
  body.app .login-label,
  body.login-page .login-label,
  body.app .table th{
    font-family:var(--font-sans);
    font-size:var(--type-label-size);
    font-weight:var(--type-label-weight);
    line-height:1.35;
    letter-spacing:.01em;
    color:var(--text-heading);
  }
  body.app .nav-label{
    font-family:var(--font-sans);
    font-size:.875rem;
    font-weight:600;
    letter-spacing:0;
    color:inherit;
  }
  body.app .kpi.kpi--solid .kpi-label,
  body.app .kpi.kpi--solid .kpi-value{
    color:inherit;
  }
  body.app .muted,
  body.app .topbar-subtitle,
  body.app .panel-head p,
  body.app .panel-intro,
  body.app .modal-intro,
  body.app .register-panel-sub,
  body.app .notif-card-body,
  body.app .topbar-notif-body,
  body.app .login-hint,
  body.app .doc-meta,
  body.app .chart-caption,
  body.app .checklist-due,
  body.login-page .login-sub,
  body.login-page .login-hint,
  body.login-page .login-tagline,
  body.login-page .muted{
    font-family:var(--font-sans);
    font-size:var(--type-support-size);
    font-weight:var(--type-support-weight);
    line-height:1.45;
    color:var(--text-subtle);
  }
  body.app .btn,
  body.app .qa-btn,
  body.app .modal-btn,
  body.app .register-primary-btn,
  body.app .shared-drive-upload-btn,
  body.app a.btn,
  body.login-page .login-submit,
  body.login-page button{
    font-family:var(--font-sans);
    font-size:var(--type-btn-size);
    font-weight:var(--type-btn-weight);
    letter-spacing:.01em;
  }
  body.app .page a:not(.btn):not(.qa-btn):not(.nav-link):not(.modal-btn):not(.modal-close):not(.folder-card):not(.notif-card):not(.kpi):not(.topbar-notif-card):not(.topbar-dropdown-link):not(.notif-tab),
  body.app .modal a:not(.btn):not(.modal-btn):not(.modal-close),
  body.app .activity-log-table a,
  body.app .notif-card-action,
  body.login-page a{
    font-family:var(--font-sans);
    font-weight:var(--type-link-weight);
  }
  body.app .password-field .input--password,
  body.app input,
  body.app select,
  body.app textarea,
  body.login-page input,
  body.login-page select,
  body.login-page textarea{
    font-family:var(--font-sans);
  }
  
  /* â€”â€” Sidebar â€”â€” */
  body.app /* =========================================================
     03. MAIN APP LAYOUT / SHELL
     ========================================================= */
  .shell{min-height:100vh;gap:0;background:var(--bg)}
  body.app .shell{
    padding-left:var(--app-sidebar-width);
    box-sizing:border-box;
    min-height:100vh;
  }
  body.app /* ===== SIDEBAR NAVIGATION ===== */
  .sidebar{
    width:248px;
    position:relative;
    background-color:var(--sidebar);
    background-image:none;
    color:#fff;
    padding:16px 12px 14px;
    gap:12px;
    box-shadow:1px 0 0 rgba(var(--primary-rgb),.12);
    overflow:hidden;
  }
  body.app .sidebar-art{
    position:absolute;
    inset:0;
    z-index:0;
    pointer-events:none;
    overflow:hidden;
  }
  body.app .sidebar-art__bottom{
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:auto;
    display:block;
    max-width:none;
    object-fit:contain;
    object-position:left bottom;
    pointer-events:none;
    user-select:none;
    -webkit-user-drag:none;
  }
  body.app .sidebar-brand,
  body.app .nav,
  body.app .sidebar-footer{
    position:relative;
    z-index:1;
  }
  body.app .sidebar-brand{
    align-items:center;
    flex-direction:column;
    justify-content:center;
    gap:0;
    padding:6px 8px 14px;
    text-align:center;
  }
  body.app .logo,
  body.app .logo.logo--brand{
    width:84px;
    height:84px;
    border-radius:0;
    background:transparent;
    border:none;
    box-shadow:none;
    padding:0;
    overflow:visible;
  }
  body.app .logo-img{
    border-radius:0;
    background:transparent;
  }
  body.app .brand-text{
    color:#fff;
    font-size:1.15rem;
    font-weight:700;
    letter-spacing:.02em;
  }
  body.app .nav{gap:8px}
  body.app .nav-sep{
    flex-shrink:0;
    height:0;
    margin:6px 8px 8px;
    border-top:1px solid rgba(255,255,255,.18);
  }
  body.app .nav-link{
    background:transparent;
    color:rgba(255,255,255,.92);
    border-radius:10px;
    padding:12px 14px;
    min-height:44px;
    font-size:14.5px;
    font-weight:500;
    border:none;
    gap:12px;
  }
  body.app .nav-link:hover{background:rgba(0,0,0,.12);color:#fff}
  body.app .nav-link.is-active{
    background:rgba(255,255,255,.95);
    color:var(--brand-teal-deep);
    box-shadow:none;
    font-weight:600;
  }
  body.app .nav-link.logout{
    margin-top:auto;
    background:#042f33;
    background-color:#042f33;
    border:1.5px solid #042f33;
    color:#fff;
    text-align:left;
    opacity:1;
    box-shadow:none;
  }
  body.app .nav-link.logout:hover,
  body.app .nav-link.logout:focus-visible{
    background:#031f22;
    background-color:#031f22;
    border-color:#031f22;
    color:#fff;
    opacity:1;
  }
  body.app .sidebar-footer button.nav-link.pwa-install-btn,
  body.app .sidebar-footer a.nav-link.logout,
  body.app .sidebar-footer .nav-link.pwa-install-btn,
  body.app .sidebar-footer .nav-link.logout{
    background:#042f33;
    background-color:#042f33;
    border:1.5px solid #042f33;
    color:#fff;
    opacity:1;
    box-shadow:none;
  }
  body.app .sidebar-footer button.nav-link.pwa-install-btn:hover,
  body.app .sidebar-footer button.nav-link.pwa-install-btn:focus-visible,
  body.app .sidebar-footer a.nav-link.logout:hover,
  body.app .sidebar-footer a.nav-link.logout:focus-visible,
  body.app .sidebar-footer .nav-link.pwa-install-btn:hover,
  body.app .sidebar-footer .nav-link.pwa-install-btn:focus-visible,
  body.app .sidebar-footer .nav-link.logout:hover,
  body.app .sidebar-footer .nav-link.logout:focus-visible{
    background:#031f22;
    background-color:#031f22;
    border-color:#031f22;
    color:#fff;
    opacity:1;
  }

  /* â€”â€” Main + topbar â€”â€” */
  body.app /* =========================================================
     05. MAIN CONTENT AREA
     ========================================================= */
  .main{
    background:var(--bg);
    flex:1;
    min-width:0;
  }
  body.app .main::before,
  body.app .main::after{display:none !important}
  body.app /* ===== ADMIN DASHBOARD HEADER ===== */
  .topbar{
    min-height:64px;
    height:auto;
    background:#fff;
    border:none;
    border-bottom:1px solid var(--border);
    padding:14px var(--page-padding-x);
    position:sticky;
    top:0;
    z-index:2050;
    overflow:visible;
  }
  body.app .topbar-period-filters{
    display:flex;
    align-items:center;
    gap:8px;
    flex-shrink:0;
  }
  body.app .topbar-period-filters .shared-drive-filter{
    margin:0;
  }
  body.app .topbar-period-filters .shared-drive-filter-select,
  body.app .topbar-period-filters .sy-combo-trigger{
    min-width:132px;
    width:148px;
    max-width:170px;
    height:36px;
    min-height:36px;
    box-sizing:border-box;
  }
  body.app .sy-combo{
    position:relative;
    display:block;
  }
  body.app .sy-combo--select{
    width:100%;
  }
  body.app .sy-combo--compact,
  body.app .shared-drive-filter .sy-combo,
  body.app .analytics-filter-form .sy-combo,
  body.app .tf-filter-form .sy-combo,
  body.app .register-sort .sy-combo,
  body.app .topbar-period-filters .sy-combo{
    width:auto;
    display:inline-block;
    min-width:132px;
    max-width:188px;
    vertical-align:middle;
  }
  body.app .sy-combo--compact .sy-combo-menu,
  body.app .shared-drive-filter .sy-combo-menu,
  body.app .analytics-filter-form .sy-combo-menu,
  body.app .topbar-period-filters .sy-combo-menu{
    left:0;
    right:0;
    min-width:100%;
    width:100%;
  }
  body.app .analytics-panel,
  body.app .shared-drive-panel,
  body.app .analytics-toolbar,
  body.app .shared-drive-toolbar,
  body.app .tf-filter-icons{
    overflow:visible;
  }
  body.app select.sy-combo-native-hidden{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
    opacity:0 !important;
    pointer-events:none !important;
  }
  body.app .sy-combo--select .sy-combo-menu{
    left:0;
    right:auto;
    min-width:100%;
    width:max(100%, 188px);
  }
  body.app .sy-combo-option.is-disabled{
    opacity:.45;
    cursor:default;
    pointer-events:none;
  }
  body.app .topbar-period-filters .sy-combo{
    width:148px;
    min-width:132px;
    max-width:170px;
  }
  body.app .sy-combo-trigger,
  body.app button.sy-combo-trigger,
  body.app .input.sy-combo-trigger,
  body.app .shared-drive-filter-select.sy-combo-trigger,
  body.app .register-sort-select.sy-combo-trigger,
  body.app .topbar-period-filters .sy-combo-trigger{
    display:flex !important;
    align-items:center;
    justify-content:space-between !important;
    gap:8px;
    width:100%;
    padding-right:10px !important;
    background-image:none !important;
    text-align:left;
    appearance:none;
    -webkit-appearance:none;
  }
  body.app .sy-combo-trigger-text{
    flex:1 1 auto;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-weight:600;
    color:var(--brand-teal-deep);
    text-align:left;
  }
  body.app .sy-combo-chevron{
    display:flex;
    margin-left:auto;
    color:var(--muted);
    flex-shrink:0;
  }
  body.app .sy-combo-trigger[aria-expanded="true"] .sy-combo-chevron{
    transform:rotate(180deg);
  }
  body.app .sy-combo-menu{
    position:absolute;
    top:calc(100% + 6px);
    right:0;
    z-index:4000;
    margin:0;
    padding:8px 0 6px;
    min-width:188px;
    width:max-content;
    background:#fff;
    border:1px solid var(--border);
    border-radius:12px;
    box-shadow:0 12px 28px rgba(15,61,66,.14);
  }
  body.app .modal:has(.sy-combo-trigger[aria-expanded="true"]){
    overflow:visible;
  }
  body.app .sy-combo-head,
  body.app .sy-combo-check{
    display:none !important;
  }
  body.app .sy-combo-list{
    list-style:none;
    margin:0;
    padding:4px 6px;
    max-height:240px;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  body.app .sy-combo-list::-webkit-scrollbar{
    width:8px;
  }
  body.app .sy-combo-list::-webkit-scrollbar-thumb{
    background:rgba(var(--primary-rgb),.32);
    border-radius:8px;
  }
  body.app .sy-combo-list::-webkit-scrollbar-track{
    background:transparent;
  }
  body.app .sy-year-menu{
    width:280px;
    min-width:280px;
    max-width:min(320px, calc(100vw - 16px));
    padding:8px 8px 6px;
  }
  body.app .sy-year-nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    padding:2px 4px 8px;
  }
  body.app .sy-year-nav-label{
    flex:1;
    text-align:center;
    font-size:13px;
    font-weight:700;
    color:var(--brand-teal-deep);
    white-space:nowrap;
  }
  body.app .sy-year-nav-btn{
    width:28px;
    height:28px;
    border:none;
    border-radius:8px;
    background:transparent;
    color:var(--brand-teal-deep);
    font-size:20px;
    line-height:1;
    cursor:pointer;
  }
  body.app .sy-year-nav-btn:hover{
    background:rgba(var(--primary-rgb),.10);
  }
  body.app .sy-year-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:4px;
    max-height:none;
    overflow:visible;
    padding:0 4px 6px;
  }
  body.app .sy-year-grid .sy-combo-option{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:10px 4px;
    border-radius:999px;
    font-size:13px;
    font-weight:600;
    white-space:nowrap;
  }
  body.app .sy-year-grid .sy-combo-option.is-outside{
    color:var(--muted);
    font-weight:500;
  }
  body.app .sy-year-grid .sy-combo-option[aria-selected="true"]{
    background:var(--brand-teal);
    color:#fff;
  }
  body.app .sy-combo-option{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:10px;
    margin:0;
    padding:7px 10px;
    border-radius:8px;
    font-size:13px;
    font-weight:500;
    color:#334155;
    cursor:pointer;
    white-space:nowrap;
  }
  body.app .sy-combo-option:hover{
    background:rgba(var(--primary-rgb),.08);
  }
  body.app .sy-combo-option[aria-selected="true"]{
    background:var(--brand-teal);
    color:#fff;
  }
  body.app .sy-combo-manage{
    display:flex;
    align-items:center;
    gap:8px;
    width:calc(100% - 12px);
    margin:6px 6px 2px;
    padding:8px 10px 4px;
    border:none;
    border-top:1px solid var(--border);
    border-radius:0;
    background:transparent;
    color:var(--brand-teal);
    font-size:13px;
    font-weight:600;
    cursor:pointer;
    text-align:left;
  }
  body.app .sy-combo-manage:hover{
    color:var(--brand-teal-deep);
  }
  body.app .sy-manage-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:8px;
    max-height:220px;
    overflow:auto;
  }
  body.app .sy-manage-list li{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:8px 10px;
    border:1px solid var(--border);
    border-radius:10px;
    background:#fff;
  }
  @media (max-width:1100px){
    body.app .topbar-period-filters .shared-drive-filter-select,
    body.app .topbar-period-filters .sy-combo-trigger,
    body.app .topbar-period-filters .sy-combo{
      width:128px;
      min-width:120px;
    }
  }
  body.app .topbar-search-slot{
    display:flex;
    align-items:center;
    min-width:0;
  }
  body.app .topbar-search-slot:empty{display:none}
  body.app .topbar-search-slot .search-form,
  body.app .topbar-search-slot .search-form.register-search{
    display:flex;
    align-items:center;
    margin:0;
    width:280px;
    max-width:280px;
    flex:0 0 auto;
    flex-wrap:nowrap;
    gap:0;
  }
  body.app .topbar-search-slot .search,
  body.app .topbar-search-slot .search.search--grow,
  body.app .topbar-search-slot .register-search .search{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
    width:100%;
    flex:none;
    height:38px;
    min-height:38px;
    margin:0;
    padding:0 16px 0 14px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:999px;
    box-shadow:none;
  }
  body.app .topbar-search-slot .search:focus-within,
  body.app .topbar-search-slot .register-search .search:focus-within{
    border-color:var(--brand-teal);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.14);
  }
  body.app .topbar-search-slot .search-ico{color:#94a3b8}
  body.app .topbar-search-slot .search-ico svg{
    width:var(--icon-size-ui);
    height:var(--icon-size-ui);
    display:block;
  }
  body.app .topbar-search-slot .input--search,
  body.app .topbar-search-slot .register-search .input--search{
    border:none !important;
    box-shadow:none !important;
    background:transparent;
    padding:0;
    font-size:13.5px;
  }
  body.app .topbar-search-slot .input--search::placeholder{color:#94a3b8}
  body.app mark.search-hit{
    background:#ffe08a;
    color:inherit;
    padding:0 1px;
    border-radius:2px;
    font:inherit;
    font-weight:700;
  }
  body.app .topbar-menu{
    position:relative;
    z-index:2060;
    overflow:visible;
  }
  body.app .page{
    position:relative;
    z-index:1;
  }
  body.app.page-teachers-record .main{
    overflow:hidden;
  }
  body.app.page-teachers-record .page{
    overflow:hidden;
    display:flex;
    flex-direction:column;
    min-height:0;
    flex:1 1 auto;
  }
  body.app .topbar-bell{
    width:44px;
    height:44px;
    border-radius:0;
    background:transparent;
    color:var(--brand-teal-deep);
    border:none;
    box-shadow:none;
    display:grid;
    place-items:center;
    cursor:pointer;
    position:relative;
  }
  body.app .topbar-bell:hover{background:transparent;border:none;color:var(--brand-teal)}
  body.app .topbar-bell svg{width:var(--icon-size);height:var(--icon-size)}
  body.app .topbar-badge{
    position:absolute;
    top:-5px;
    right:-5px;
    min-width:18px;
    height:18px;
    padding:0 5px;
    border-radius:999px;
    background:var(--danger);
    color:#fff;
    border:2px solid #fff;
    font-size:10px;
    font-weight:700;
    line-height:1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  body.app .topbar-badge[hidden]{display:none !important}
  body.app .topbar-avatar-btn{
    width:44px;
    height:44px;
    padding:0;
    border:none;
    background:transparent;
    border-radius:999px;
    cursor:pointer;
    display:grid;
    place-items:center;
  }
  body.app .avatar.avatar--profile{
    width:38px;
    height:38px;
    border-radius:999px;
    background:var(--brand-mint);
    border:2px solid rgba(var(--primary-rgb),.35);
    display:grid;
    place-items:center;
    overflow:hidden;
    color:var(--brand-teal-deep);
    font-size:12px;
    font-weight:700;
    letter-spacing:.02em;
    line-height:1;
  }
  body.app .topbar-avatar-btn .avatar.avatar--profile{
    width:44px;
    height:44px;
    font-size:14px;
  }
  body.app .avatar--photo,
  body.app .profile-avatar.avatar--photo{
    padding:0;
    overflow:hidden;
  }
  body.app .avatar--photo img,
  body.app .profile-avatar.avatar--photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    border-radius:50%;
    display:block;
  }
  body.app .topbar-dropdown{
    position:absolute;
    right:0;
    top:calc(100% + 8px);
    z-index:9999;
    background:#fff;
    border:1px solid var(--border);
    border-radius:12px;
    box-shadow:0 12px 28px rgba(17,24,39,.12);
    min-width:260px;
    overflow:hidden;
  }

  body.app .page{
    max-width:none;
    width:100%;
    padding:var(--page-padding-y) var(--page-padding-x) 28px;
    margin:0;
  }
  body.app .page-title h1,
  body.app .topbar-title{
    color:var(--text);
    font-size:var(--type-title-size);
    font-weight:var(--type-title-weight);
    line-height:1.2;
    letter-spacing:-.02em;
    margin:0;
  }
  body.app .page > section + section{margin-top:var(--space-section)}
  body.app .page > :first-child{margin-top:0}
  body.app .page > [hidden] + *{margin-top:0}

  /*
   * Page stack rhythm â€” nav/toolbars between sections skip `section + section`.
   * One coherent gap for: title area â†’ controls â†’ KPIs â†’ tabs â†’ primary panel.
   */
  body.app .page > .flash + *,
  body.app .page > .toolbar + section,
  body.app .page > .toolbar + nav,
  body.app .page > .compliance-search-bar + nav,
  body.app .page > .compliance-search-bar + section,
  body.app .page > .grid.kpis + nav,
  body.app .page > .grid.kpis + section,
  body.app .page > .kpis + nav,
  body.app .page > .kpis + section,
  body.app .page > nav.compliance-tabs + section,
  body.app .page > nav.compliance-tabs + form,
  body.app .page > nav.compliance-tabs + .add-document-split,
  body.app .page > nav.compliance-tabs + .assign-task-form,
  body.app .page > nav.compliance-tabs + .compliance-monitor-wrap,
  body.app .page > nav.compliance-tabs + .school-year-panel,
  body.app .page > nav.compliance-tabs + .school-cal-card,
  body.app .page > .compliance-tabs-wrap + section,
  body.app .page > .compliance-tabs-wrap + form,
  body.app .page > .compliance-tabs-wrap + .add-document-split,
  body.app .page > .compliance-tabs-wrap + .assign-task-form,
  body.app .page > .compliance-tabs-wrap + .compliance-monitor-wrap,
  body.app .page > .compliance-tabs-wrap + .school-year-panel,
  body.app .page > .compliance-tabs-wrap + .school-cal-card,
  body.app .page > .compliance-tabs-wrap + .activity-log-panel,
  body.app .page > .notice-mgmt-tabs + section,
  body.app .page > section.grid.kpis + .notice-mgmt-tabs{
    margin-top:var(--space-section);
  }

  /* Shared panel header â€” comfortable original TRACKED padding */
  body.app .panel-head{
    padding:16px 18px 12px;
  }
  body.app .panel-head h2{
    margin:0;
  }
  body.app .panel-head > .muted,
  body.app .panel-head p.muted{
    margin:6px 0 0;
  }
  body.app .panel-head--row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:var(--space-sm) var(--space-md);
    flex-wrap:wrap;
  }

  /* Page search lives in content toolbars (topbar search is disabled). */
  body.app .page > .compliance-search-bar,
  body.app .page > .toolbar.toolbar--between,
  body.app .register-page > .register-toolbar{
    position:relative;
  }

  body.app /* =========================================================
     08. CARDS / PANELS
     ========================================================= */
  .card{
    background:#fff;
    border:1px solid var(--border);
    border-radius:12px;
    box-shadow:0 2px 8px rgba(15,61,66,.04);
  }
  body.app /* =========================================================
     13. BUTTONS
     ========================================================= */
  .btn{
    border-radius:8px;
    font-weight:600;
  }
  body.app .btn-primary{
    background:var(--primary-color);
    border:none;
    color:#fff;
    box-shadow:none;
  }
  body.app .btn-primary:hover{background:var(--hover-color)}
  body.app .btn-secondary{
    background:var(--surface-color);
    border:1px solid var(--border-color);
    color:var(--active-color);
    box-shadow:none;
  }
  body.app .search{
    background:#fff;
    border:1.5px solid rgba(var(--primary-rgb),.2);
    border-radius:8px;
    padding:9px 12px;
  }
  body.app .register-search .search{
    height:var(--search-bar-h);
    min-height:var(--search-bar-h);
    padding:0 16px;
    border-radius:10px;
  }
  body.app .search-form.register-search:not(.topbar-search-default){
    flex:0 1 var(--search-bar-w);
    flex-grow:0;
    width:var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
    margin:0;
  }
  body.app .page .toolbar .search-form.register-search,
  body.app .page .compliance-search-bar .search-form.register-search{
    position:static;
    clip:auto;
    overflow:visible;
    height:auto;
    flex:0 1 var(--search-bar-w);
    width:var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
  }
  body.app .search-form.register-search:not(.topbar-search-default) .search{
    width:100%;
    height:var(--search-bar-h);
    min-height:var(--search-bar-h);
    box-sizing:border-box;
    padding:0 16px;
    border-radius:10px;
  }
  body.app .register-primary-btn{
    height:var(--control-h);
    min-height:var(--control-h);
    border-radius:8px;
    font-size:13px;
  }
  body.app /* =========================================================
     12. INPUT FIELDS
     ========================================================= */
  .input{
    background:#fff;
    border:1.5px solid rgba(var(--primary-rgb),.24);
    border-radius:8px;
  }
  body.app .input:focus{
    border-color:var(--brand-teal);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12);
  }
  body.app .table th{
    background:#f7f9fa;
    color:var(--muted);
    font-weight:700;
  }
  body.app .subtab{
    border-radius:8px;
    border:1px solid var(--border);
    background:#fff;
  }
  body.app .subtab.is-active{
    background:var(--button);
    background-color:#0d6a72;
    color:#fff;
    border-color:#0d6a72;
  }

  /* KPI cards â€” soft tinted status surfaces (original TRACKED proportions) */
  body.app .kpis{gap:14px}
  body.app .kpi.kpi--solid,
  body.app .card.kpi.kpi--solid{
    background:var(--primary-light);
    color:var(--text);
    border:1px solid rgba(var(--primary-rgb),.18);
    border-radius:12px;
    box-shadow:none;
    padding:22px 18px;
    min-height:108px;
    min-width:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  body.app .kpi.kpi--solid .kpi-label{color:var(--muted);font-size:13px}
  body.app .kpi.kpi--solid .kpi-value{color:var(--text);margin-top:10px;font-size:2.1rem;line-height:1.1;font-weight:750}
  body.app .kpi.kpi--solid.kpi--completed,
  body.app .card.kpi.kpi--solid.kpi--completed{
    background:var(--status-completed-bg);
    border-color:#b7dfc8;
  }
  body.app .kpi.kpi--solid.kpi--completed .kpi-label,
  body.app .kpi.kpi--solid.kpi--completed .kpi-value{color:var(--status-completed)}
  body.app .kpi.kpi--solid.kpi--pending,
  body.app .card.kpi.kpi--solid.kpi--pending{
    background:var(--status-pending-bg);
    border-color:#f0e0a8;
  }
  body.app .kpi.kpi--solid.kpi--pending .kpi-label,
  body.app .kpi.kpi--solid.kpi--pending .kpi-value{color:var(--status-pending)}
  body.app .kpi.kpi--solid.kpi--overdue,
  body.app .card.kpi.kpi--solid.kpi--overdue{
    background:var(--status-overdue-bg);
    border-color:#f0c7c3;
  }
  body.app .kpi.kpi--solid.kpi--overdue .kpi-label,
  body.app .kpi.kpi--solid.kpi--overdue .kpi-value{color:var(--status-overdue)}
  body.app .kpi.kpi--solid.kpi--discrepancy,
  body.app .card.kpi.kpi--solid.kpi--discrepancy{
    background:var(--status-discrepancy-bg);
    border-color:#f0d2b0;
  }
  body.app .kpi.kpi--solid.kpi--discrepancy .kpi-label,
  body.app .kpi.kpi--solid.kpi--discrepancy .kpi-value{color:var(--status-discrepancy)}
  body.app .kpi.kpi--solid.kpi--total,
  body.app .card.kpi.kpi--solid.kpi--total{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.18);
  }
  body.app .kpi.kpi--solid.kpi--total .kpi-label{color:var(--muted)}
  body.app .kpi.kpi--solid.kpi--total .kpi-value{color:var(--text)}
  /* Shared Files summary cards */
  body.app .kpi.kpi--solid.kpi--soft-teal,
  body.app .card.kpi.kpi--solid.kpi--soft-teal{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.18);
  }
  body.app .kpi.kpi--solid.kpi--soft-teal .kpi-label,
  body.app .card.kpi.kpi--solid.kpi--soft-teal .kpi-label{
    color:var(--muted);
  }
  body.app .kpi.kpi--solid.kpi--soft-teal .kpi-value,
  body.app .card.kpi.kpi--solid.kpi--soft-teal .kpi-value{
    color:var(--text);
  }
  body.app .kpi.kpi--solid.kpi--soft-blue,
  body.app .card.kpi.kpi--solid.kpi--soft-blue{
    background:#e8f0f6;
    border-color:#c5d6e6;
  }
  body.app .kpi.kpi--solid.kpi--soft-purple,
  body.app .card.kpi.kpi--solid.kpi--soft-purple{
    background:#efeaf6;
    border-color:#d4cce4;
  }
  body.app .kpi.kpi--solid.kpi--soft-amber,
  body.app .card.kpi.kpi--solid.kpi--soft-amber{
    background:var(--status-pending-bg);
    border-color:#f0e0a8;
  }
  body.app .kpi.kpi--solid.kpi--soft-orange,
  body.app .card.kpi.kpi--solid.kpi--soft-orange{
    background:var(--status-discrepancy-bg);
    border-color:#f0d2b0;
  }
  body.app .kpi.kpi--solid.kpi--soft-orange .kpi-label,
  body.app .card.kpi.kpi--solid.kpi--soft-orange .kpi-label,
  body.app .kpi.kpi--solid.kpi--soft-orange .kpi-value,
  body.app .card.kpi.kpi--solid.kpi--soft-orange .kpi-value{
    color:var(--status-discrepancy);
  }
  body.app a.kpi.kpi--solid{
    text-decoration:none;
    color:var(--text);
    cursor:pointer;
  }
  body.app a.kpi.kpi--solid:visited,
  body.app a.kpi.kpi--solid:hover,
  body.app a.kpi.kpi--solid:focus{
    color:var(--text);
    text-decoration:none;
  }
  body.app a.kpi.kpi--solid:hover,
  body.app .kpi.kpi--solid:has(> a.kpi-hit:hover){
    box-shadow:0 4px 12px rgba(27,44,48,.10);
  }
  body.app a.kpi.kpi--solid:focus-visible,
  body.app a.kpi-hit:focus-visible{
    outline:2px solid var(--primary);
    outline-offset:2px;
  }
  body.app a.kpi-hit{
    display:flex;
    flex-direction:column;
    justify-content:center;
    flex:1 1 auto;
    min-width:0;
    color:inherit;
    text-decoration:none;
  }
  body.app a.kpi-hit:visited,
  body.app a.kpi-hit:hover,
  body.app a.kpi-hit:focus{color:inherit;text-decoration:none}
  body.app .page a.kpi-hit{color:inherit}
  body.app .page-period-filters{
    display:flex;
    align-items:center;
    gap:10px 14px;
    flex-wrap:wrap;
    margin:0 0 14px;
  }
  body.app .page-period-filters .page-period-label{
    position:absolute !important;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0, 0, 0, 0);
    white-space:nowrap;
    border:0;
  }
  body.app .page-period-filters .shared-drive-filter{
    display:flex;
    flex-direction:column;
    gap:0;
    margin:0;
  }
  body.app .page-period-filters .shared-drive-filter-select,
  body.app .page-period-filters .sy-combo-input,
  body.app .page-period-filters .sy-combo-trigger{
    min-width:148px;
    height:36px;
  }
  body.app .page-period-filters--inline{
    margin:0 0 0 auto;
    flex-shrink:0;
    align-items:flex-end;
  }
  body.app .toolbar.toolbar--between,
  body.app .compliance-search-bar{
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
    gap:10px;
    flex-wrap:wrap;
    background:transparent;
    border:none;
    border-radius:0;
    padding:0;
    box-shadow:none;
    margin:0;
  }
  /* Period-only bar is never used â€” chrome belongs to combined toolbars only. */
  body.app .toolbar.toolbar--between:not(:has(.search-form)):not(:has(.analytics-filter-form)),
  body.app .compliance-search-bar:not(:has(.search-form)){
    background:transparent;
    border:none;
    box-shadow:none;
    padding:0;
    margin:0;
  }
  body.app .toolbar.toolbar--between .search-form,
  body.app .compliance-search-bar .search-form{
    flex:0 1 var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
    width:var(--search-bar-w);
    margin:0;
  }
  body.app .toolbar.toolbar--between .page-period-filters--inline,
  body.app .compliance-search-bar .page-period-filters--inline,
  body.app .analytics-toolbar .page-period-filters--inline,
  body.app .compliance-tabs .page-period-filters--inline,
  body.app .tf-filter-icons .page-period-filters--inline,
  body.app .teacher-compliance-head .page-period-filters--inline,
  body.app .school-cal-page-intro .page-period-filters--inline{
    margin-left:auto;
  }
  body.app .analytics-toolbar{
    display:flex;
    align-items:flex-end;
    justify-content:flex-end;
    gap:var(--space-sm);
    flex-wrap:wrap;
  }
  body.app .analytics-toolbar .page-period-filters--inline{
    margin:0 0 0 auto;
  }

  /* Shared control height in content toolbars */
  body.app .toolbar .register-search .search,
  body.app .compliance-search-bar .register-search .search,
  body.app .page-controls .register-search .search,
  body.app .register-panel-actions .register-search .search,
  body.app .shared-drive-toolbar .register-search .search,
  body.app .teacher-disc-panel-tools .register-search .search{
    height:var(--search-bar-h);
    min-height:var(--search-bar-h);
    padding:0 16px;
    border-radius:10px;
  }
  body.app .register-panel-actions .register-primary-btn,
  body.app .register-panel-actions .register-sort-select{
    height:var(--control-h);
    min-height:var(--control-h);
    max-height:var(--control-h);
  }

  /* Compact page control row â€” not a second white card. */
  body.app .page-controls{
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
    gap:var(--space-sm);
    flex-wrap:wrap;
    margin:0;
    padding:0;
    background:transparent;
    border:none;
    box-shadow:none;
  }
  body.app .page-controls .search-form{
    flex:0 1 var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
    width:var(--search-bar-w);
    margin:0;
  }
  body.app .page-controls .page-period-filters--inline{
    margin-left:auto;
  }
  body.app .page-controls .page-period-filters .shared-drive-filter-select,
  body.app .page-controls .page-period-filters .sy-combo-input,
  body.app .page-controls .page-period-filters .sy-combo-trigger,
  body.app .toolbar .page-period-filters .shared-drive-filter-select,
  body.app .toolbar .page-period-filters .sy-combo-input,
  body.app .toolbar .page-period-filters .sy-combo-trigger{
    min-width:132px;
    height:var(--control-h);
  }

  /* Summary KPIs â€” original-scale presence, still secondary to content */
  body.app .grid.kpis.kpis--summary{
    margin:0;
    gap:14px;
    align-items:stretch;
  }
  body.app .grid.kpis.kpis--summary > .kpi,
  body.app .grid.kpis.kpis--summary > .card.kpi{
    min-height:96px;
    padding:18px 16px;
    box-shadow:none;
    height:100%;
  }
  body.app .grid.kpis.kpis--summary .kpi-label{
    font-size:13px;
    line-height:1.3;
  }
  body.app .grid.kpis.kpis--summary .kpi-value{
    font-size:1.85rem;
    margin-top:8px;
  }
  body.app .grid.kpis.kpis--teacher-lite{
    margin:0;
  }
  body.app .grid.kpis.kpis--teacher-lite > .kpi,
  body.app .grid.kpis.kpis--teacher-lite > .card.kpi{
    min-height:88px;
    padding:16px 14px;
    border-radius:12px;
  }
  body.app .grid.kpis.kpis--teacher-lite .kpi-value{
    font-size:1.7rem;
    margin-top:6px;
  }

  /* Controls inside existing panels (Discrepancy / Files) */
  body.app .notice-mgmt-panel-tools,
  body.app .teacher-files-tools{
    display:flex;
    align-items:center;
    gap:var(--space-sm);
    flex-wrap:wrap;
    padding:14px 18px;
    border-bottom:1px solid rgba(var(--primary-rgb),.1);
    margin:0;
  }
  body.app .panel-head.teacher-files-tools,
  body.app .teacher-files-tools{
    justify-content:flex-start;
  }
  body.app .notice-mgmt-panel-tools .search-form{
    flex:0 1 var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
    width:var(--search-bar-w);
    margin:0;
  }
  body.app .teacher-files-tools .search-form{
    flex:0 1 var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
    width:var(--search-bar-w);
    margin:0 auto 0 0;
  }
  body.app .notice-mgmt-panel-tools .page-period-filters{
    margin:0 0 0 auto;
  }
  body.app .teacher-files-tools .teacher-files-dept-filter{
    margin:0 0 0 auto;
    flex-shrink:0;
  }
  body.app .teacher-files-tools .page-period-filters,
  body.app .teacher-files-tools .page-period-filters--inline{
    margin:0;
  }
  body.app .teacher-files-tools .teacher-files-dept-filter .shared-drive-filter,
  body.app .teacher-files-tools .teacher-files-dept-filter .shared-drive-filter-select{
    margin:0;
  }
  body.app .teacher-files-tools .teacher-files-dept-filter .shared-drive-filter-select{
    height:var(--control-h);
    min-height:var(--control-h);
    min-width:132px;
  }
  body.app .teacher-files-tools .tf-filter-form{
    margin:0;
    flex-shrink:0;
  }
  body.app .notice-mgmt-panel-tools .register-search .search,
  body.app .teacher-files-tools .register-search .search{
    height:var(--search-bar-h);
    min-height:var(--search-bar-h);
    padding:0 16px;
  }
  body.app .teacher-files-tools .register-search,
  body.app .teacher-files-tools .register-search .search{
    width:100%;
  }
  body.app .notice-mgmt-panel-tools .page-period-filters .shared-drive-filter-select,
  body.app .notice-mgmt-panel-tools .page-period-filters .sy-combo-input,
  body.app .notice-mgmt-panel-tools .page-period-filters .sy-combo-trigger,
  body.app .teacher-files-tools .page-period-filters .shared-drive-filter-select,
  body.app .teacher-files-tools .page-period-filters .sy-combo-input,
  body.app .teacher-files-tools .page-period-filters .sy-combo-trigger,
  body.app .teacher-files-tools .shared-drive-filter-select{
    height:var(--control-h);
    min-width:120px;
  }

  /* Directory / Admins: Search lives in existing panel actions. */
  body.app .register-panel-actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    margin-left:auto;
    min-width:0;
  }
  body.app .register-panel-actions .search-form.register-search{
    flex:0 1 var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
    width:var(--search-bar-w);
    margin:0;
  }
  body.app .register-panel-actions .register-sort-form,
  body.app .register-panel-actions .register-primary-btn{
    flex-shrink:0;
  }
  body.app .register-panel .panel-head--row{
    align-items:center;
    gap:12px 16px;
  }
  body.app .register-panel .panel-head{
    padding:16px 18px 14px;
  }
  body.app .register-panel-sub{
    margin:6px 0 0;
  }
  body.app .register-panel .table--register th,
  body.app .register-panel .table--register td{
    padding:12px 14px;
  }
  body.app .register-panel .table-wrap--register{
    padding:4px 8px 12px;
  }

  /* Dashboard panel rhythm */
  body.app .dashboard-submissions .panel-head,
  body.app .dashboard-notifications .panel-head,
  body.app .dashboard-mini-cal .panel-head{
    padding:14px 18px 12px;
  }
  body.app .dashboard-teacher-row{
    margin-top:var(--space-stack);
    gap:var(--space-stack);
  }

  /* Shared drive: Search | School Year | Term | Filter | Upload (right). */
  body.app .shared-drive-toolbar{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:var(--space-sm);
    flex-wrap:wrap;
  }
  body.app .shared-drive-toolbar .shared-drive-search{
    flex:0 1 var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
    width:var(--search-bar-w);
    margin:0;
  }
  body.app .shared-drive-toolbar-right{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:var(--space-sm);
    flex-wrap:wrap;
    margin-left:auto;
    min-width:0;
  }
  body.app .shared-drive-toolbar-right .page-period-filters,
  body.app .shared-drive-toolbar-right .page-period-filters--inline{
    margin:0;
    display:inline-flex;
    align-items:center;
    gap:var(--space-sm);
    flex-wrap:wrap;
  }
  body.app .shared-drive-toolbar .shared-drive-upload-btn{
    flex-shrink:0;
    height:var(--control-h);
    min-height:var(--control-h);
    margin:0;
  }
  body.app .shared-drive-toolbar .shared-drive-filter-form{
    margin:0;
  }
  body.app .shared-drive-toolbar .shared-drive-filter-select{
    height:var(--control-h);
    min-height:var(--control-h);
  }

  /* Admin calendar: period filters belong with calendar tools, not tabs. */
  body.app .school-cal-top-left{
    display:flex;
    align-items:flex-end;
    gap:var(--space-sm);
    flex-wrap:wrap;
    min-width:0;
  }
  body.app .school-cal-top-left .page-period-filters{
    margin:0;
  }
  body.app .school-cal-top-left .page-period-filters .page-period-label{
    font-size:10px;
  }
  body.app .school-cal-top-left .page-period-filters .shared-drive-filter-select,
  body.app .school-cal-top-left .page-period-filters .sy-combo-input,
  body.app .school-cal-top-left .page-period-filters .sy-combo-trigger{
    min-width:120px;
    height:var(--control-h);
  }

  /* Teacher discrepancy: Search | Period | Filter in existing panel head. */
  body.app .teacher-disc-panel-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-md);
    flex-wrap:wrap;
    padding:16px 18px 14px;
  }
  body.app .teacher-disc-panel-tools{
    display:flex;
    align-items:flex-end;
    gap:var(--space-sm);
    flex-wrap:wrap;
    margin-left:auto;
    min-width:0;
  }
  body.app .teacher-disc-panel-tools .search-form{
    flex:0 1 var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
    width:var(--search-bar-w);
    margin:0;
  }
  body.app .teacher-disc-panel-tools .page-period-filters{
    margin:0;
  }
  body.app .teacher-disc-panel-tools .page-period-filters .shared-drive-filter-select,
  body.app .teacher-disc-panel-tools .page-period-filters .sy-combo-input,
  body.app .teacher-disc-panel-tools .page-period-filters .sy-combo-trigger,
  body.app .teacher-disc-panel-tools .shared-drive-filter-select{
    height:var(--control-h);
    min-width:120px;
  }
  body.app .teacher-disc-panel-tools .teacher-disc-filter-form{
    margin:0;
  }
  body.app .teacher-disc-panel .notice-mgmt-table-wrap{
    padding:12px 16px 16px;
  }
  body.app .compliance-tabs .page-period-filters{
    margin:0 4px 0 10px;
    flex:0 0 auto;
    align-self:center;
  }
  body.app .compliance-tabs .page-period-filters .page-period-label{
    font-size:10px;
  }
  body.app .compliance-tabs .page-period-filters .shared-drive-filter-select,
  body.app .compliance-tabs .page-period-filters .sy-combo-input,
  body.app .compliance-tabs .page-period-filters .sy-combo-trigger{
    min-width:124px;
    height:32px;
  }
  body.app .teacher-compliance-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px 16px;
    flex-wrap:wrap;
  }
  body.app .teacher-compliance-head .compliance-tabs{
    flex:1 1 280px;
    min-width:0;
  }
  body.app .teacher-compliance-head .page-period-filters{
    margin:0 0 0 auto;
    flex:0 1 auto;
    gap:10px 14px;
    align-items:flex-end;
  }
  body.app .teacher-compliance-head .page-period-filters .page-period-label{
    font-size:11px;
    margin:0 0 4px;
  }
  body.app .teacher-compliance-head .page-period-filters .shared-drive-filter-select,
  body.app .teacher-compliance-head .page-period-filters .sy-combo-input,
  body.app .teacher-compliance-head .page-period-filters .sy-combo-trigger{
    height:var(--control-h);
    min-height:var(--control-h);
    min-width:132px;
  }
  body.app .tf-filter-icons{
    display:flex;
    align-items:flex-end;
    justify-content:flex-start;
    gap:12px;
    flex-wrap:wrap;
  }
  body.app .tf-filter-icons .page-period-filters{
    margin:0;
  }
  body.app .school-cal-page-intro{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
    margin:0 0 12px;
  }
  body.app .school-cal-page-intro > .muted{
    margin:0;
    flex:1 1 200px;
  }
  body.app .school-cal-page-intro .page-period-filters{
    margin:0;
  }
  body.app .dashboard-req-period-bar{
    display:flex;
    justify-content:flex-end;
    align-items:flex-end;
    gap:10px;
    flex-wrap:wrap;
    width:100%;
    margin:0 0 12px;
  }
  body.app .dashboard-req-period-bar + .dashboard-grid{
    margin-top:0;
  }
  body.app .dashboard-req-period-bar .page-period-filters{
    margin:0;
    justify-content:flex-end;
  }
  body.app .dashboard-req-period-bar .page-period-filters .shared-drive-filter-select,
  body.app .dashboard-req-period-bar .page-period-filters .sy-combo-input,
  body.app .dashboard-req-period-bar .page-period-filters .sy-combo-trigger{
    min-width:136px;
    height:36px;
    font-size:13px;
  }
  body.app .dashboard-panel-tools{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex-wrap:wrap;
    margin-left:auto;
    min-width:0;
  }
  body.app .dashboard-panel-tools .dash-view-all.btn-primary{
    background:var(--button);
    background-color:#0d6a72;
    border-color:#0d6a72;
    color:#fff;
  }
  body.app .dashboard-panel-tools .dash-view-all.btn-primary:hover,
  body.app .dashboard-panel-tools .dash-view-all.btn-primary:focus-visible{
    background:var(--button-hover);
    background-color:#0a555c;
    border-color:#0a555c;
    color:#fff;
  }
  body.app .dashboard-panel-tools .page-period-filters.dashboard-period-filters--panel{
    margin:0;
    gap:8px 10px;
  }
  body.app .dashboard-panel-tools .page-period-filters .page-period-label{
    font-size:10px;
    margin:0 0 3px;
  }
  body.app .dashboard-panel-tools .page-period-filters .shared-drive-filter-select,
  body.app .dashboard-panel-tools .page-period-filters .sy-combo-input,
  body.app .dashboard-panel-tools .page-period-filters .sy-combo-trigger{
    min-width:128px;
    height:32px;
    font-size:12.5px;
  }
  body.app .dashboard-panel-tools > .btn{
    flex-shrink:0;
    align-self:flex-end;
  }
  body.app .dashboard-submissions > .panel-head--row{
    align-items:flex-end;
    gap:10px 12px;
  }
  body.app .dashboard-mini-cal .dash-mini-month{
    flex:1 1 auto;
    padding:0 16px 14px;
  }
  body.app .dashboard-mini-cal{
    margin-bottom:0;
    padding:0;
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:0;
  }
  /* Teacher dashboard mini calendar — minimal card */
  body.app.page-teacher-dashboard .dashboard-mini-cal,
  body.app.page-teacher-dashboard .dashboard-mini-cal--modern{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:12px;
    box-shadow:var(--shadow-card);
    overflow:hidden;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .panel-head{
    background:transparent;
    border-bottom:0;
    gap:10px;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .panel-head h2{
    margin:0;
    font-size:1.05rem;
    font-weight:700;
    color:var(--text);
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-month{
    background:rgba(247,251,251,.96);
    border:1px solid rgba(var(--primary-rgb),.10);
    border-radius:14px;
    margin:0 12px 12px;
    padding:12px 12px 10px;
    gap:10px;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-month-bar{
    gap:8px;
    padding:0 2px;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-month-title{
    color:var(--brand-teal-deep);
    font-size:14px;
    font-weight:800;
    letter-spacing:.01em;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-month-nav{
    width:30px;
    height:30px;
    border-radius:999px;
    color:var(--brand-teal-deep);
    border:1px solid rgba(var(--primary-rgb),.16);
    background:#fff;
    box-shadow:0 1px 2px rgba(15,61,66,.04);
    transition:background .15s ease, border-color .15s ease, transform .15s ease;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-month-nav:hover{
    background:rgba(var(--primary-rgb),.08);
    border-color:rgba(var(--primary-rgb),.35);
    color:var(--brand-teal-deep);
    transform:translateY(-1px);
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-month-dow{
    gap:4px;
    margin:0 0 2px;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-month-dow span{
    font-size:10px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#6b7f84;
    padding:2px 0;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-month-grid{
    gap:5px;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-day{
    aspect-ratio:1 / 1;
    width:100%;
    max-height:34px;
    min-height:28px;
    padding:0;
    gap:0;
    justify-content:center;
    align-items:center;
    line-height:1;
    border-radius:999px;
    border:1px solid transparent;
    background:transparent;
    transition:background .12s ease, box-shadow .12s ease, color .12s ease;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-day:not(.is-empty):not(.is-holiday):not(.is-event):not(.is-term):not(.is-deadline){
    background:#fff;
    border-color:rgba(var(--primary-rgb),.08);
    color:var(--text-primary);
    box-shadow:0 1px 2px rgba(15,61,66,.03);
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-day:not(.is-empty):hover{
    background:rgba(var(--primary-rgb),.08);
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-day.is-today{
    background:var(--primary) !important;
    border-color:transparent !important;
    box-shadow:none;
    color:#fff !important;
    font-weight:800;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-day.is-today .dash-mini-day-num{
    color:#fff !important;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-day.is-today .dash-mini-dot{
    background:#fff;
    box-shadow:none;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-day-num{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    line-height:1;
    font-size:12px;
    font-weight:600;
    font-variant-numeric:tabular-nums;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-day-dots{
    position:absolute;
    left:50%;
    bottom:3px;
    transform:translateX(-50%);
    height:4px;
    gap:2px;
    pointer-events:none;
  }
  body.app.page-teacher-dashboard .dashboard-mini-cal .dash-mini-day.has-event .dash-mini-day-num{
    transform:translateY(-2px);
  }
  body.app .dashboard-mini-cal .panel-head{
    margin:0;
  }
  body.app .dashboard-mini-cal .panel-head h2{
    margin:0;
  }
  body.app .dashboard-mini-cal .panel-head .btn{
    flex-shrink:0;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal .dashboard-mini-cal .panel-head,
  body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal .dashboard-notifications .panel-head{
    align-items:center;
    min-height:52px;
    padding:14px 16px 10px;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal .dashboard-mini-cal .panel-head .dash-view-all,
  body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal .dashboard-notifications .panel-head .dash-view-all{
    height:30px;
    padding:0 10px;
    font-size:12px;
    font-weight:600;
    line-height:1;
    display:inline-flex;
    align-items:center;
  }
  body.app .dash-mini-month{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0;
  }
  body.app .dash-mini-month-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:6px;
  }
  body.app .dash-mini-month-title{
    flex:1 1 auto;
    text-align:center;
    font-size:13px;
    font-weight:700;
    color:var(--text);
    line-height:1.2;
  }
  body.app .dash-mini-month-nav{
    width:28px;
    height:28px;
    border:1px solid var(--border);
    border-radius:8px;
    background:#fff;
    color:var(--primary);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    padding:0;
  }
  body.app .dash-mini-month-nav:hover{
    border-color:rgba(var(--primary-rgb),.45);
    background:var(--primary-light);
  }
  body.app .dash-mini-month-dow{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:2px;
    text-align:center;
    font-size:10px;
    font-weight:600;
    color:var(--muted);
    line-height:1.2;
  }
  body.app .dash-mini-month-grid{
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:2px;
  }
  body.app .dash-mini-day{
    aspect-ratio:1 / 1;
    max-height:34px;
    border-radius:7px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:1px;
    font-size:11px;
    font-weight:600;
    color:var(--text);
    background:transparent;
    position:relative;
  }
  body.app .dash-mini-day.is-empty{
    visibility:hidden;
  }
  body.app .dash-mini-day.is-today{
    box-shadow:inset 0 0 0 1.5px rgba(var(--primary-rgb),.55);
  }
  body.app .dash-mini-day.is-today:not(.is-holiday):not(.is-event):not(.is-term):not(.is-deadline){
    background:var(--primary-light);
    color:var(--primary-dark);
  }
  body.app .dash-mini-day.is-holiday{
    background:#fceeee;
  }
  body.app .dash-mini-day.is-holiday .dash-mini-day-num{
    color:#b03c36;
  }
  body.app .dash-mini-day.is-event:not(.is-holiday){
    background:#e7f2f3;
  }
  body.app .dash-mini-day.is-event:not(.is-holiday) .dash-mini-day-num{
    color:var(--primary-color);
  }
  body.app .dash-mini-day.is-term:not(.is-holiday):not(.is-event){
    background:#eef3f4;
  }
  body.app .dash-mini-day.is-term:not(.is-holiday):not(.is-event) .dash-mini-day-num{
    color:#4a7c82;
  }
  body.app .dash-mini-day.is-term-2:not(.is-holiday):not(.is-event){
    background:#fff2e6;
  }
  body.app .dash-mini-day.is-term-2:not(.is-holiday):not(.is-event) .dash-mini-day-num{
    color:#c9651a;
  }
  body.app .dash-mini-day.is-term-3:not(.is-holiday):not(.is-event){
    background:#e8f1f4;
  }
  body.app .dash-mini-day.is-term-3:not(.is-holiday):not(.is-event) .dash-mini-day-num{
    color:var(--primary-color);
  }
  body.app .dash-mini-day.is-deadline:not(.is-holiday):not(.is-event):not(.is-term){
    background:#e7f5ee;
  }
  body.app .dash-mini-day.is-deadline:not(.is-holiday):not(.is-event):not(.is-term) .dash-mini-day-num{
    color:#1f7a4d;
  }
  body.app .dash-mini-day-dots{
    display:flex;
    gap:2px;
    height:4px;
    align-items:center;
    justify-content:center;
  }
  body.app .dash-mini-day-dots i,
  body.app .dash-mini-dot{
    width:4px;
    height:4px;
    border-radius:999px;
    background:var(--status-discrepancy, #c9651a);
    display:inline-block;
  }
  body.app .dash-mini-dot--holiday{background:#b03c36}
  body.app .dash-mini-dot--event{background:var(--primary-color)}
  body.app .dash-mini-dot--term{background:#4a7c82}
  body.app .dash-mini-dot--deadline{background:#1f7a4d}
  body.app .dash-mini-month-legend{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px 10px;
    font-size:11px;
    color:var(--muted);
  }
  body.app .dash-mini-month-legend span{
    display:inline-flex;
    align-items:center;
    gap:4px;
  }
  body.app .dash-mini-month-legend .dash-mini-dot{
    margin-right:0;
    vertical-align:middle;
  }
  body.app .dashboard-mini-cal-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:8px;
  }
  body.app .dashboard-mini-cal-item{
    display:flex;
    gap:10px;
    align-items:flex-start;
    min-width:0;
  }
  body.app .dashboard-mini-cal-date{
    flex:0 0 auto;
    min-width:0;
    max-width:42%;
    font-size:11.5px;
    font-weight:600;
    color:var(--muted);
    line-height:1.35;
  }
  body.app .dashboard-mini-cal-copy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:2px;
  }
  body.app .dashboard-mini-cal-copy strong{
    font-size:13px;
    color:var(--text);
    line-height:1.3;
  }
  body.app .dashboard-teacher-row--req-cal,
  body.app .dashboard-teacher-row--notice-cal{
    display:grid;
    grid-template-columns:minmax(0,7fr) minmax(0,3fr);
    gap:14px;
    align-items:stretch;
    margin-bottom:var(--space-section);
  }
  body.app .dashboard-teacher-row--req-cal .dashboard-submissions,
  body.app .dashboard-teacher-row--req-cal .dashboard-wlp-checklist,
  body.app .dashboard-teacher-row--notice-cal .dashboard-notifications,
  body.app .dashboard-teacher-row--notice-cal .dashboard-mini-cal{
    grid-column:auto;
    min-width:0;
    width:auto;
    max-width:none;
    height:100%;
    display:flex;
    flex-direction:column;
  }
  body.app .dashboard-teacher-row--req-cal .dashboard-submissions,
  body.app .dashboard-teacher-row--notice-cal .dashboard-notifications{
    grid-column:1;
  }
  body.app .dashboard-teacher-row--req-cal .dashboard-wlp-checklist,
  body.app .dashboard-teacher-row--notice-cal .dashboard-mini-cal{
    grid-column:2;
  }
  body.app .dashboard-teacher-row--req-cal .dashboard-submissions .table--dashboard{
    min-width:0;
  }
  body.app .dashboard-teacher-row--req-cal .dashboard-wlp-checklist{
    min-width:0;
    max-width:none;
  }
  @media (max-width:720px){
    body.app .dashboard-teacher-row--req-cal,
    body.app .dashboard-teacher-row--notice-cal,
    body.app.page-teacher-dashboard .dashboard-teacher-row--req-cal,
    body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal{
      grid-template-columns:1fr;
    }
    body.app .dashboard-teacher-row--req-cal .dashboard-submissions,
    body.app .dashboard-teacher-row--req-cal .dashboard-wlp-checklist,
    body.app .dashboard-teacher-row--notice-cal .dashboard-notifications,
    body.app .dashboard-teacher-row--notice-cal .dashboard-mini-cal,
    body.app.page-teacher-dashboard .dashboard-teacher-row--req-cal .dashboard-submissions,
    body.app.page-teacher-dashboard .dashboard-teacher-row--req-cal .dashboard-wlp-checklist,
    body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal .dashboard-notifications,
    body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal .dashboard-mini-cal{
      grid-column:auto;
    }
  }
  @media (max-width:640px){
    body.app .page-period-filters{width:100%}
    body.app .page-period-filters .shared-drive-filter{flex:1 1 100%}
    body.app .dashboard-mini-cal-item{flex-direction:column;gap:4px}
    body.app .dashboard-mini-cal-date{min-width:0;max-width:none}
  }
  body.app .all-compliance-status-form .input{min-width:148px;max-width:100%}
  @media (max-width:640px){
    body.app .individual-compliance-head{flex-wrap:wrap}
    body.app .all-compliance-status-form{margin-left:0;width:100%}
    body.app .all-compliance-status-form .input{width:100%}
  }

  body.app .page-title--row{
    display:flex;align-items:center;justify-content:space-between;
    gap:16px;flex-wrap:wrap;margin-bottom:14px;
  }
  body.app .page-title--row h1{margin-bottom:0}
  body.app .page-title--row .quick-actions{margin-bottom:0}
  body.app .dashboard-grid{
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:var(--space-sm);
    margin-bottom:var(--space-stack);
    align-items:stretch;
  }
  body.app .dashboard-submissions{
    grid-column:1 / 5;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-self:stretch;
    height:100%;
    min-height:0;
  }
  body.app .dashboard-submissions .table-wrap--scroll{
    flex:1 1 auto;
    min-height:320px;
    height:min(420px,48vh);
    max-height:min(420px,48vh);
    overflow:hidden;
  }
  body.app .dashboard-submissions .table-wrap--scroll:has(.table--dashboard-overview){
    overflow:hidden;
  }
  body.app .dashboard-submissions .table--dashboard{
    width:100%;
    min-width:720px;
  }
  body.app .dashboard-submissions .table--dashboard.table--dashboard-overview{
    min-width:0;
    width:100%;
    table-layout:fixed;
  }
  body.app .dashboard-submissions .table--dashboard.table--dashboard-lite{
    min-width:0;
    table-layout:fixed;
    width:100%;
  }
  body.app .dashboard-submissions .table--dashboard th,
  body.app .dashboard-submissions .table--dashboard td{
    padding:14px 16px;
    font-size:13.5px;
    white-space:nowrap;
  }
  body.app .dashboard-submissions .table--dashboard-lite th,
  body.app .dashboard-submissions .table--dashboard-lite td{
    white-space:normal;
    vertical-align:middle;
    padding:10px 12px;
    font-size:13.5px;
  }
  body.app .dashboard-submissions .table--dashboard-lite thead th{
    padding:8px 12px;
    font-size:12px;
  }
  /* Balanced columns: Requirement Â· Deadline Â· Status Â· Actions */
  body.app .dashboard-submissions .table--dashboard-lite .col-req,
  body.app .dashboard-submissions .table--dashboard-lite th.col-req,
  body.app .dashboard-submissions .table--dashboard-lite td.col-req{
    width:38%;
    min-width:0;
  }
  body.app .dashboard-submissions .table--dashboard-lite .col-deadline,
  body.app .dashboard-submissions .table--dashboard-lite th.col-deadline,
  body.app .dashboard-submissions .table--dashboard-lite td.col-deadline{
    width:22%;
    white-space:nowrap;
  }
  body.app .dashboard-submissions .table--dashboard-lite .col-status,
  body.app .dashboard-submissions .table--dashboard-lite .col-key,
  body.app .dashboard-submissions .table--dashboard-lite th.col-status,
  body.app .dashboard-submissions .table--dashboard-lite td.col-status{
    width:22%;
    white-space:nowrap;
  }
  body.app .dashboard-submissions .table--dashboard-lite .col-action,
  body.app .dashboard-submissions .table--dashboard-lite td.td-action{
    width:18%;
    text-align:center;
    padding-left:8px;
    padding-right:10px;
  }
  body.app .dashboard-submissions .table--dashboard-lite .dash-req-actions{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100%;
  }
  body.app .dashboard-submissions .table--dashboard-lite .dash-req-label.teacher-req-label{
    color:var(--text);
    font-weight:600;
  }
  body.app .dashboard-submissions .table--dashboard-lite .dash-req-deadline{
    color:var(--muted);
    font-size:13px;
    font-weight:500;
  }
  body.app .dash-req-main{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:1px;
  }
  body.app .dash-req-teacher{
    font-size:13.5px;
    font-weight:700;
    line-height:1.2;
    color:var(--text);
  }
  body.app .dash-req-label{
    font-weight:500;
    font-size:13px;
    color:var(--muted);
    line-height:1.25;
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
  }
  body.app .dash-req-key{
    display:inline-flex;
    align-items:center;
    gap:8px;
    flex-wrap:nowrap;
  }
  body.app .dash-req-sep{
    color:var(--muted);
    font-weight:600;
    line-height:1;
  }
  body.app .dash-req-deadline{
    font-size:12.5px;
    white-space:nowrap;
  }
  body.app .dash-req-actions{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
  }
  body.app .dash-req-go{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:var(--muted);
    text-decoration:none;
  }
  body.app .dash-req-go:hover,
  body.app .dash-req-go:focus-visible{
    color:var(--brand-teal);
  }
  body.app tr.dash-req-row.is-clickable{
    cursor:pointer;
  }
  body.app tr.dash-req-row.is-clickable:hover td{
    background:rgba(var(--primary-rgb),.04);
  }
  body.app tr.dash-req-row.is-clickable:focus-visible{
    outline:2px solid rgba(var(--primary-rgb),.45);
    outline-offset:-2px;
  }
  body.app .dashboard-submissions .table--dashboard-overview thead th{
    padding:8px 8px;
    font-size:11px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .dashboard-submissions .table--dashboard-overview th,
  body.app .dashboard-submissions .table--dashboard-overview td{
    padding:8px 8px;
    vertical-align:middle;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .dashboard-submissions .table--dashboard-overview .col-teacher{width:18%}
  body.app .dashboard-submissions .table--dashboard-overview .col-req{width:28%}
  body.app .dashboard-submissions .table--dashboard-overview .col-date{width:13%}
  body.app .dashboard-submissions .table--dashboard-overview .col-status{width:12%}
  body.app .dashboard-submissions .table--dashboard-overview .col-attachment{width:16%}
  body.app .dashboard-submissions .table--dashboard-overview .dash-req-teacher{
    text-decoration:none;
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    max-width:100%;
    font-weight:700;
    color:var(--text);
  }
  body.app .dashboard-submissions .table--dashboard-overview .col-req{
    max-width:none;
  }
  body.app .dashboard-submissions .table--dashboard-overview .col-req .dash-req-main{
    max-width:100%;
  }
  body.app .dashboard-submissions .table--dashboard-overview .col-req .dash-req-label{
    color:var(--text);
    max-width:100%;
  }
  body.app .dashboard-submissions .table--dashboard-overview .col-action,
  body.app .dashboard-submissions .table--dashboard-overview td.td-action{
    width:36px;
    max-width:36px;
    padding-left:2px;
    padding-right:6px;
    text-align:right;
    overflow:visible;
    white-space:nowrap;
    text-overflow:clip;
  }
  body.app .dashboard-submissions .table--dashboard-overview td.col-attachment{
    max-width:none;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .dashboard-submissions .table--dashboard-overview .td-user-inner{
    max-width:100%;
    min-width:0;
    overflow:hidden;
  }
  body.app .dashboard-submissions .table--dashboard-overview .td-user-name,
  body.app .dashboard-submissions .table--dashboard-overview .dash-req-teacher{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.app .dashboard-submissions .table--dashboard-overview td:last-child{
    max-width:36px;
    white-space:nowrap;
    overflow:visible;
    text-overflow:clip;
  }
  body.app .dashboard-submissions .table--dashboard td.td-user{
    display:table-cell;
    vertical-align:middle;
  }
  body.app .dashboard-submissions .table--dashboard .td-user-inner{
    display:inline-flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
  }
  body.app .dashboard-submissions .table--dashboard td:last-child{
    white-space:normal;
    max-width:220px;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .dashboard-submissions .table--dashboard-lite td:last-child,
  body.app .dashboard-submissions .table--dashboard-lite td.td-action{
    max-width:none;
    overflow:visible;
    text-overflow:clip;
    white-space:nowrap;
  }
  body.app .dashboard-notifications{
    grid-column:5 / 6;
    min-width:0;
    display:flex;
    flex-direction:column;
    align-self:stretch;
    height:100%;
    min-height:0;
  }
  body.app .dashboard-notifications .panel-head--row{
    gap:6px;
    align-items:center;
  }
  body.app .dashboard-notifications .panel-head h2{
    font-size:1rem;
    line-height:1.25;
  }
  body.app .dashboard-notifications .panel-head .btn,
  body.app .dashboard-submissions .panel-head .btn,
  body.app .dashboard-mini-cal .panel-head .btn{
    flex-shrink:0;
    padding:0 8px;
    height:30px;
    font-size:12px;
    font-weight:600;
    color:#fff;
    border-color:var(--brand-teal);
    background:var(--brand-teal);
  }
  body.app .dashboard-notifications .scroll-panel--notifications{
    flex:1 1 auto;
    min-height:320px;
    height:min(420px,48vh);
    max-height:min(420px,48vh);
    overflow:hidden;
    display:flex;
    flex-direction:column;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  body.app .dashboard-notifications .scroll-panel--notifications::-webkit-scrollbar{
    width:0;
    height:0;
    display:none;
  }
  body.app .dashboard-notifications .notif-stack{
    gap:8px;
    padding:10px 10px 12px;
  }
  body.app .dashboard-notifications .notif-card--compact{
    padding:10px 10px;
    gap:5px;
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.14);
  }
  body.app .dashboard-notifications .notif-card-title{
    font-size:12.5px;
    font-weight:700;
    margin-bottom:2px;
    line-height:1.3;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  body.app .dashboard-notifications .notif-card-body{
    font-size:12px;
    line-height:1.4;
    color:#4b5563;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  body.app .dashboard-notifications .notif-time{
    display:block;
    margin-top:2px;
    font-size:11px;
    color:#6b7280;
  }
  body.app .dashboard-notifications .notif-empty{
    flex:1 1 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:0;
    padding:28px 10px;
    font-size:12.5px;
  }
  body.app .dashboard-notifications .notif-empty .muted{
    margin:0;
    font-size:12.5px;
    line-height:1.4;
  }
  @media (max-width:1200px){
    body.app .dashboard-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
    body.app .dashboard-submissions{grid-column:1 / 3}
    body.app .dashboard-notifications{grid-column:3 / 4}
  }
  @media (max-width:1100px){
    body.app .dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    body.app .dashboard-submissions,
    body.app .dashboard-notifications{grid-column:1 / -1}
  }
  @media (max-width:640px){
    body.app .dashboard-grid{grid-template-columns:1fr}
  }
  body.app .dashboard-grid--teacher{
    grid-template-columns:repeat(6,minmax(0,1fr));
    margin-bottom:14px;
  }
  body.app .dashboard-grid--teacher > .kpi{
    padding:18px 14px;
    min-height:96px;
  }
  body.app .dashboard-grid--teacher .kpi-label{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .dashboard-grid--teacher .kpi-value{
    font-size:1.85rem;
    margin-top:8px;
  }
  body.app .dashboard-teacher-row{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    align-items:stretch;
    margin-bottom:var(--space-section);
  }
  /* Must follow .dashboard-teacher-row so 70/30 is not overwritten by 1fr. */
  body.app .dashboard-teacher-row.dashboard-teacher-row--req-cal,
  body.app .dashboard-teacher-row.dashboard-teacher-row--notice-cal{
    display:grid;
    grid-template-columns:minmax(0,7fr) minmax(0,3fr);
    gap:14px;
    align-items:stretch;
  }
  body.app .dashboard-teacher-row.dashboard-teacher-row--req-cal > .dashboard-submissions,
  body.app .dashboard-teacher-row.dashboard-teacher-row--notice-cal > .dashboard-notifications{
    grid-column:1;
    min-width:0;
    height:100%;
  }
  body.app .dashboard-teacher-row.dashboard-teacher-row--req-cal > .dashboard-wlp-checklist,
  body.app .dashboard-teacher-row.dashboard-teacher-row--notice-cal > .dashboard-mini-cal{
    grid-column:2;
    min-width:0;
    max-width:none;
    height:100%;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row.dashboard-teacher-row--req-cal > .dashboard-wlp-checklist,
  body.app.page-teacher-dashboard .dashboard-teacher-row.dashboard-teacher-row--notice-cal > .dashboard-mini-cal{
    height:100%;
    align-self:stretch;
    overflow:hidden;
  }
  body.app .dashboard-teacher-row .dashboard-submissions,
  body.app .dashboard-teacher-row .dashboard-notifications{
    grid-column:auto;
    min-width:0;
  }
  body.app .dashboard-teacher-row .dashboard-submissions .table-wrap--scroll{
    min-height:0;
    max-height:none;
    overflow:visible;
  }
  body.app .dashboard-teacher-row .table--dashboard{
    min-width:0;
    width:100%;
  }
  body.app .dashboard-teacher-row .table--dashboard th,
  body.app .dashboard-teacher-row .table--dashboard td{
    padding:10px 8px;
    white-space:nowrap;
  }
  body.app .dashboard-teacher-row .table--dashboard th:nth-child(1),
  body.app .dashboard-teacher-row .table--dashboard td:nth-child(1){
    white-space:nowrap;
  }
  body.app .dashboard-teacher-row .table--dashboard td.td-action{
    width:1%;
    white-space:nowrap;
    overflow:visible;
    max-width:none;
    text-align:center;
  }
  body.app .dashboard-teacher-row .td-action .register-icon-btn{
    text-decoration:none;
  }
  body.app .dashboard-teacher-row .dashboard-notifications{
    overflow:hidden;
    display:flex;
    flex-direction:column;
    min-width:0;
  }
  body.app .dashboard-teacher-row .dashboard-notifications .disc-list{
    flex:1 1 auto;
    gap:8px;
    padding:10px 12px 12px;
    min-height:0;
    min-width:0;
    overflow:hidden;
  }
  body.app .dashboard-teacher-row .dashboard-notifications .disc-card,
  body.app .dashboard-teacher-row .dashboard-notifications .disc-card--dash{
    min-width:0;
    width:100%;
    box-sizing:border-box;
    padding:10px 12px;
    border-radius:12px;
    overflow:hidden;
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:8px;
    flex-wrap:nowrap;
  }
  body.app .dashboard-teacher-row .dashboard-notifications .disc-card-title{
    font-size:13.5px;
    line-height:1.3;
    margin:0;
    min-width:0;
    flex:1 1 auto;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.app .dashboard-teacher-row .dashboard-notifications .disc-card .pill,
  body.app .dashboard-teacher-row .dashboard-notifications .disc-card-days,
  body.app .dashboard-teacher-row .dashboard-notifications .disc-card .register-icon-btn{
    flex:0 0 auto;
    white-space:nowrap;
  }
  body.app .dashboard-teacher-row .dashboard-notifications .notif-empty{
    padding:36px 12px;
    text-align:center;
  }
  @media (max-width:1200px){
    body.app .dashboard-grid--teacher{grid-template-columns:repeat(3,minmax(0,1fr))}
  }
  @media (max-width:1100px){
    body.app .dashboard-grid--teacher{grid-template-columns:repeat(3,minmax(0,1fr))}
  }
  @media (max-width:900px){
    body.app .dashboard-teacher-row:not(.dashboard-teacher-row--req-cal):not(.dashboard-teacher-row--notice-cal){grid-template-columns:1fr}
  }
  @media (max-width:640px){
    body.app .dashboard-grid--teacher{grid-template-columns:1fr}
    body.app .dashboard-teacher-row:not(.dashboard-teacher-row--req-cal):not(.dashboard-teacher-row--notice-cal){grid-template-columns:1fr}
  }
  html:has(body.app.page-teacher-dashboard),
  body.app.page-teacher-dashboard{
    height:auto;
    min-height:0;
  }
  body.app.page-teacher-dashboard .shell{
    height:auto;
    min-height:0;
    max-height:none;
    overflow:visible;
  }
  body.app.page-teacher-dashboard .main{
    min-height:0;
    overflow:visible;
    display:flex;
    flex-direction:column;
  }
  body.app.page-teacher-dashboard .topbar{
    flex-shrink:0;
  }
  body.app.page-teacher-dashboard .page{
    flex:0 0 auto;
    min-height:0;
    overflow:visible;
    display:block;
    padding-bottom:16px;
  }
  body.app.page-teacher-dashboard .dashboard-grid--teacher{
    flex-shrink:0;
    margin-bottom:14px;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row--req-cal,
  body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal{
    display:grid;
    grid-template-columns:minmax(0,7fr) minmax(0,3fr);
    gap:14px;
    align-items:stretch;
    margin-bottom:var(--space-section);
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row:not(.dashboard-teacher-row--req-cal):not(.dashboard-teacher-row--notice-cal){
    flex:0 0 auto;
    min-height:0;
    margin-bottom:0;
    align-items:stretch;
    grid-template-columns:1fr;
    grid-template-rows:auto;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .dashboard-submissions,
  body.app.page-teacher-dashboard .dashboard-teacher-row .dashboard-notifications,
  body.app.page-teacher-dashboard .dashboard-teacher-row .dashboard-wlp-checklist,
  body.app.page-teacher-dashboard .dashboard-teacher-row .dashboard-mini-cal{
    display:flex;
    flex-direction:column;
    min-height:0;
    height:100%;
    overflow:hidden;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row--req-cal .dashboard-submissions,
  body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal .dashboard-notifications{
    height:100%;
    min-height:0;
    overflow:hidden;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row--req-cal .dashboard-wlp-checklist,
  body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal .dashboard-mini-cal{
    height:100%;
    max-height:none;
    min-height:0;
    overflow:hidden;
    align-self:stretch;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row--req-cal .dashboard-submissions .table-wrap--scroll{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;
  }
  /* Month stays natural height; extra card height is empty padding below (no clipped weeks). */
  body.app.page-teacher-dashboard .dashboard-teacher-row--notice-cal .dash-mini-month{
    flex:0 0 auto;
    margin-bottom:auto;
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist{
    max-width:none;
    min-width:0;
    width:100%;
    height:100%;
    max-height:none;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:12px;
    background:var(--surface);
    box-shadow:var(--shadow-card);
  }
  /* Match Recent requirements panel-head so both titles sit on one line. */
  body.app.page-teacher-dashboard .dashboard-teacher-row--req-cal > .dashboard-submissions > .panel-head--row{
    align-items:center;
    min-height:52px;
    padding:14px 16px 10px;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row--req-cal > .dashboard-submissions > .panel-head--row .dashboard-panel-tools > .btn{
    align-self:center;
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist .wlp-checklist-head{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    min-height:52px;
    box-sizing:border-box;
    padding:14px 16px 10px;
    border-bottom:1px solid rgba(var(--primary-rgb),.1);
    background:transparent;
    border-radius:12px 12px 0 0;
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist .wlp-checklist-head h2{
    font-size:1rem;
    font-weight:700;
    line-height:1.25;
    margin:0;
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist > .wlp-week-stepper,
  body.app.page-teacher-dashboard .dashboard-wlp-checklist > .wlp-week-form,
  body.app.page-teacher-dashboard .dashboard-wlp-checklist > .wlp-checklist-meta{
    flex:0 0 auto;
    margin-top:8px;
    margin-bottom:8px;
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist > .wlp-checklist-progress-block{
    flex:0 0 auto;
    margin-bottom:8px;
  }
  /* Fill remaining height under progress; scroll if many subjects. */
  body.app.page-teacher-dashboard .dashboard-wlp-checklist > .wlp-subject-list{
    flex:1 1 auto;
    min-height:0;
    overflow-x:hidden;
    overflow-y:auto;
    margin-left:14px;
    margin-right:14px;
    margin-bottom:14px;
    gap:8px;
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist .wlp-subject-check{
    padding:12px 14px;
    border-radius:12px;
    align-items:center;
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist .wlp-subject-box{
    width:22px;
    height:22px;
    margin-top:0;
    border-radius:999px;
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist .wlp-subject-check input:checked + .wlp-subject-box{
    background:var(--brand-teal-deep);
    border-color:var(--brand-teal-deep);
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist .wlp-subject-check input:checked + .wlp-subject-box::after{
    left:7px;
    top:3px;
    width:5px;
    height:10px;
  }
  body.app.page-teacher-dashboard .dashboard-wlp-checklist .wlp-subject-item.is-missing .wlp-subject-status{
    color:#dc2626;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .panel-head{
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:52px;
    padding:14px 16px 10px;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .panel-head h2{
    margin:0;
    font-size:1rem;
    font-weight:700;
    line-height:1.25;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table-wrap--scroll{
    flex:0 0 auto;
    min-height:0;
    max-height:none;
    overflow:visible;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard{
    table-layout:fixed;
    width:100%;
    min-width:0;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard th,
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard td{
    padding:12px 14px;
    vertical-align:middle;
    overflow:visible;
    text-overflow:clip;
    white-space:nowrap;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .register-pagination{
    flex-shrink:0;
    margin-top:auto;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard th{
    font-size:11px;
    font-weight:600;
    letter-spacing:0;
    line-height:1.25;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard .col-req,
  body.app.page-teacher-dashboard .table--dash-notices .col-req{
    width:auto;
    overflow:hidden;
    text-align:left;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table-wrap--scroll{
    padding:0 6px 4px;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite th,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite td{
    padding:12px 16px;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite th.col-req,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite td.col-req{
    width:38%;
    min-width:0;
    padding-left:20px;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite th.col-action,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite td.td-action,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite td.col-action{
    padding-right:18px;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite .col-req,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite th.col-req,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite td.col-req{
    width:38%;
    min-width:0;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite .col-deadline,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite th.col-deadline,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite td.col-deadline{
    width:22%;
    white-space:nowrap;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite .col-status,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite .col-key,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite th.col-status,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard-lite td.col-status{
    width:22%;
    white-space:nowrap;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard .col-deadline,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard .col-submitted,
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard .col-status,
  body.app.page-teacher-dashboard .table--dash-notices .col-issued,
  body.app.page-teacher-dashboard .table--dash-notices .col-completed,
  body.app.page-teacher-dashboard .table--dash-notices .col-status{
    overflow:visible;
    text-align:left;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .table--dashboard .col-attachment{
    width:16%;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .teacher-req-label{
    min-width:0;
    white-space:normal;
    overflow:hidden;
    display:-webkit-box;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
    font-size:13.5px;
    font-weight:650;
    line-height:1.25;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite{
    table-layout:fixed;
    min-width:0;
    width:100%;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite th,
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite td{
    white-space:normal;
    padding:10px 8px;
    font-size:13.5px;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite thead th{
    padding:8px 8px;
    font-size:12px;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite th:nth-child(1),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite td:nth-child(1){
    width:38%;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite th:nth-child(2),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite td:nth-child(2){
    width:22%;
    white-space:nowrap;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite th:nth-child(3),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite td:nth-child(3){
    width:22%;
    white-space:nowrap;
    text-align:left;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite th:nth-child(4),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite td:nth-child(4),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite th.col-action,
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite td.col-action,
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite td.td-action{
    width:18%;
    text-align:center;
    white-space:nowrap;
    overflow:visible;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard.table--dashboard-lite .dash-req-actions{
    justify-content:center;
    width:100%;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices th:nth-child(1),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices td:nth-child(1){width:36%}
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices th:nth-child(2),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices td:nth-child(2){width:18%}
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices th:nth-child(3),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices td:nth-child(3){width:18%}
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices th:nth-child(4),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices td:nth-child(4){width:16%}
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices th:nth-child(5),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices td:nth-child(5),
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices th.col-action,
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices td.col-action,
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices td.td-action{
    width:12%;
    text-align:center;
    white-space:nowrap;
    overflow:visible;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dash-notices{
    table-layout:fixed;
    width:100%;
    max-width:100%;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard th,
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard td{
    padding:12px 14px;
    overflow:visible;
    white-space:nowrap;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .teacher-disc-req{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    word-break:normal;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .table--dashboard .pill{
    white-space:nowrap;
    max-width:none;
    overflow:visible;
    text-overflow:clip;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .register-actions{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .register-icon-btn,
  body.app.page-teacher-dashboard .dashboard-teacher-row .register-icon-btn:hover,
  body.app.page-teacher-dashboard .dashboard-teacher-row .register-icon-btn:focus-visible,
  body.app .dashboard-teacher-row .register-icon-btn.register-icon-btn--neutral,
  body.app .dashboard-teacher-row .td-action .register-icon-btn{
    width:34px;
    height:34px;
    min-width:34px;
    min-height:34px;
    padding:0;
    border:1px solid rgba(var(--primary-rgb),.22);
    border-radius:10px;
    background:#f3faf9;
    box-shadow:none;
    color:var(--brand-teal-deep);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:0;
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .register-icon-btn:hover,
  body.app.page-teacher-dashboard .dashboard-teacher-row .register-icon-btn:focus-visible,
  body.app .dashboard-teacher-row .register-icon-btn.register-icon-btn--neutral:hover,
  body.app .dashboard-teacher-row .register-icon-btn.register-icon-btn--neutral:focus-visible,
  body.app .dashboard-teacher-row .td-action .register-icon-btn:hover,
  body.app .dashboard-teacher-row .td-action .register-icon-btn:focus-visible{
    background:rgba(var(--primary-rgb),.14);
    border-color:var(--brand-teal-deep);
    color:var(--brand-teal-deep);
  }
  body.app.page-teacher-dashboard .dashboard-teacher-row .register-icon-btn svg,
  body.app .dashboard-teacher-row .register-icon-btn svg,
  body.app .dashboard-teacher-row .td-action .register-icon-btn svg{
    width:18px;
    height:18px;
    display:block;
    flex:0 0 auto;
    margin:0;
  }
  body.app.page-teacher-dashboard .dashboard-submissions .teacher-compliance-inline-upload{
    margin:0;
    display:inline-flex;
  }
  body.app.page-teacher-dashboard .is-empty-row td{
    text-align:center;
  }
  body.app .dashboard-panels{
    gap:16px;
    margin-bottom:var(--space-section);
    align-items:stretch;
  }
  body.app .quick-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
  body.app .dashboard-toolbar{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:12px 16px;
    flex-wrap:wrap;
    margin:0 0 16px;
  }
  body.app .dashboard-toolbar .quick-actions{
    margin:0;
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:1fr;
    gap:8px;
  }
  body.app .dashboard-toolbar .quick-actions .qa-btn{
    width:100%;
    min-width:0;
    height:42px;
    min-height:42px;
    gap:8px;
  }
  body.app .dashboard-toolbar .quick-actions .qa-btn .qa-ico{
    width:20px;
    height:20px;
    flex:0 0 20px;
  }
  body.app .dashboard-toolbar .quick-actions .qa-btn .qa-ico svg{
    width:20px;
    height:20px;
  }
  @media (max-width:720px){
    body.app .dashboard-toolbar .quick-actions{
      grid-auto-flow:row;
      grid-template-columns:repeat(2,minmax(0,1fr));
      width:100%;
    }
  }
  body.app .dashboard-period-filters{
    display:flex;
    align-items:center;
    gap:8px;
    margin-left:auto;
    flex-shrink:0;
  }
  body.app .dashboard-period-filters .shared-drive-filter-select{
    min-width:148px;
    height:36px;
  }
  body.app .dashboard-toolbar .page-period-filters.dashboard-period-filters--toolbar{
    margin:0 0 0 auto;
    align-items:center;
    gap:8px;
  }
  body.app .dashboard-toolbar .page-period-filters .sy-combo-trigger{
    height:42px;
    min-height:42px;
  }
  body.app .folder-card{
    border-radius:12px;
    border:1px solid var(--border);
    background:#fff;
    box-shadow:0 2px 8px rgba(15,61,66,.04);
  }
  body.app .stat-box,
  body.app .stat-boxes .card.stat-box{
    border-radius:12px;
    background:#fff;
    border:1px solid var(--border);
    color:var(--text);
    box-shadow:0 2px 8px rgba(15,61,66,.04);
  }
  body.app .stat-box-value{color:var(--text)}
  body.app .stat-box-label{color:var(--muted)}
  
  /* =========================================================
     34. COMPLIANCE SECTION
     Teacher compliance cards, checklist, and status controls.
     ========================================================= */
  body.app .compliance-search-bar{
    margin:0;
    width:100%;
  }

  /* Add Document â€” separate cards */
  body.app .add-document-split{
    display:grid;
    grid-template-columns:minmax(280px, .92fr) minmax(0, 1.18fr);
    align-items:start;
    gap:16px;
    min-width:0;
    margin-bottom:16px;
  }
  body.app .add-document-panel{
    margin-bottom:0;
    overflow:hidden;
  }
  body.app .add-document-create{
    min-width:0;
  }
  body.app .add-document-panel .panel-head{
    padding:16px 18px 12px;
    text-align:left;
  }
  body.app .add-document-panel .panel-head--row,
  body.app .assign-task-panel .panel-head--row{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px 16px;
    flex-wrap:wrap;
  }
  body.app .add-document-panel .panel-head--row > div:first-child,
  body.app .assign-task-panel .panel-head--row > div:first-child{
    min-width:0;
    flex:1 1 12rem;
  }
  body.app .add-document-panel .panel-head--row .page-period-filters,
  body.app .assign-task-panel .panel-head--row .page-period-filters,
  body.app .compliance-monitor-head .page-period-filters{
    margin:0 0 0 auto;
    flex:0 1 auto;
    align-items:flex-end;
  }
  body.app .add-document-panel .panel-head--row .page-period-filters .shared-drive-filter-select,
  body.app .add-document-panel .panel-head--row .page-period-filters .sy-combo-input,
  body.app .add-document-panel .panel-head--row .page-period-filters .sy-combo-trigger,
  body.app .assign-task-panel .panel-head--row .page-period-filters .shared-drive-filter-select,
  body.app .assign-task-panel .panel-head--row .page-period-filters .sy-combo-input,
  body.app .assign-task-panel .panel-head--row .page-period-filters .sy-combo-trigger,
  body.app .compliance-monitor-head .page-period-filters .shared-drive-filter-select,
  body.app .compliance-monitor-head .page-period-filters .sy-combo-input,
  body.app .compliance-monitor-head .page-period-filters .sy-combo-trigger{
    height:var(--control-h);
    min-height:var(--control-h);
    min-width:132px;
  }
  body.app .add-document-page-form{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
    width:100%;
    max-width:none;
    margin:0;
    padding:12px 24px 24px;
    box-sizing:border-box;
    align-items:stretch;
  }
  body.app .add-document-page-form .field-label{
    display:flex;
    flex-direction:column;
    gap:8px;
    margin:0;
    min-width:0;
    font-weight:600;
    font-size:13px;
    color:var(--muted);
    white-space:nowrap;
  }
  body.app .add-document-span{
    grid-column:1 / -1;
  }
  body.app .add-document-page-form .input{
    width:100%;
    min-height:46px;
    padding:0 14px;
    box-sizing:border-box;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    border-radius:12px;
    background:#fff;
  }
  body.app .add-document-page-form .input:focus{
    outline:none;
    border-color:var(--brand-teal);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.14);
  }
  body.app .add-document-page-form .deadline-rule-extra[hidden]{
    display:none !important;
  }
  body.app .deadline-rule-builder [hidden]{
    display:none !important;
  }
  body.app .add-document-page-form .deadline-rule-extra{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:14px 16px;
    border:1.5px solid rgba(var(--primary-rgb),.18);
    border-radius:12px;
    background:rgba(var(--primary-rgb),.04);
    box-sizing:border-box;
  }
  body.app .add-document-page-form .deadline-md-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:16px 20px;
  }
  body.app .add-document-page-form .deadline-rule-extra .field-label{
    white-space:normal;
  }
  body.app .add-document-page-form .deadline-rule-pick{
    display:flex;
    align-items:flex-end;
    gap:12px;
    min-width:0;
  }
  body.app .add-document-page-form .deadline-rule-pick .field-label{
    flex:1;
    min-width:0;
  }
  body.app .add-document-page-form [data-delete-custom-rule]{
    flex:0 0 auto;
  }
  body.app .add-document-page-form [data-delete-custom-rule][hidden]{
    display:none !important;
  }
  body.app .form .deadline-rule-pick{
    display:flex;
    align-items:flex-end;
    gap:12px;
  }
  body.app .form .deadline-rule-pick .field-label{
    flex:1;
    min-width:0;
  }
  body.app .form [data-delete-custom-rule][hidden]{
    display:none !important;
  }
  body.app .add-document-page-form .add-document-actions{
    grid-column:1 / -1;
    display:block;
    width:100%;
    margin-top:8px;
  }
  body.app .form .deadline-rule-extra[hidden]{
    display:none !important;
  }
  body.app .form .deadline-md-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:12px 16px;
  }
  body.app .add-document-submit{
    width:100%;
    min-width:0;
    min-height:48px;
    height:48px;
    border-radius:12px;
    font-size:15px;
    font-weight:700;
    letter-spacing:.02em;
  }
  body.app .add-document-library{
    margin:0;
    padding:0;
    min-width:0;
  }
  body.app .add-document-library .panel-head{
    padding:16px 24px 8px;
  }
  body.app .add-document-library .table-wrap{
    padding:0 16px 16px;
  }
  body.app .add-document-empty{
    text-align:center;
  }
  @media (max-width:980px){
    body.app .add-document-split{
      grid-template-columns:1fr;
    }
    body.app .add-document-page-form{
      grid-template-columns:1fr;
    }
  }
  body.app .add-document-form .field-label{
    margin:0;
    font-weight:600;
    font-size:12.5px;
    color:var(--muted);
  }
  body.app .add-document-form .field-label + .input,
  body.app .add-document-form .field-label + textarea.input{
    margin-bottom:8px;
  }
  body.app .add-document-form .input,
  body.app .add-document-form textarea.input{
    width:100%;
    max-width:none;
    box-sizing:border-box;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    border-radius:10px;
    min-height:44px;
  }
  body.app .add-document-form .input:focus,
  body.app .add-document-form textarea.input:focus{
    outline:none;
    border-color:var(--brand-teal);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.14);
  }
  body.app .add-document-form textarea.input{
    min-height:110px;
    resize:vertical;
    padding-top:12px;
  }
  body.app .add-document-actions{
    margin-top:8px;
  }
  body.app .add-document-submit{
    width:100%;
    min-width:0;
    min-height:48px;
    height:48px;
    border-radius:12px;
    font-size:15px;
    font-weight:700;
  }
  body.app .add-document-library .panel-head{
    padding:16px 18px 8px;
  }
  body.app .add-document-library .table-wrap{
    padding:0 16px 8px;
    flex:0 1 auto;
    overflow:hidden;
  }
  body.app .add-document-library .library-pager,
  body.app .add-document-library .register-pagination{
    margin:0 16px 16px;
    padding:10px 0 4px;
  }
  body.app .add-document-library tbody tr.is-off-page{
    display:none !important;
  }
  body.app .add-document-library .table{
    width:100%;
  }
  body.app .add-document-library .table th{
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--muted);
    padding:12px 14px;
  }
  body.app .add-document-library .table td{
    padding:14px;
    vertical-align:middle;
  }
  body.app .add-document-library .doc-lib-name{
    font-weight:600;
    color:var(--text);
  }
  body.app .add-document-library .col-action{
    width:120px;
    min-width:120px;
    text-align:right;
    white-space:nowrap;
  }
  body.app .add-document-library .doc-lib-actions .btn{
    min-width:0;
  }
  body.app .add-document-library .doc-lib-icon-btn{
    box-sizing:border-box;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:auto;
    height:auto;
    min-width:28px;
    min-height:28px;
    padding:0;
    border:none;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    color:var(--brand-teal-deep);
    text-decoration:none;
    cursor:pointer;
  }
  body.app .add-document-library .doc-lib-icon-btn:hover,
  body.app .add-document-library .doc-lib-icon-btn:focus-visible{
    background:transparent;
    border:none;
    box-shadow:none;
    color:var(--brand-teal);
  }
  body.app .add-document-library .doc-lib-icon-btn--danger{
    color:var(--danger);
  }
  body.app .add-document-library .doc-lib-icon-btn--danger:hover,
  body.app .add-document-library .doc-lib-icon-btn--danger:focus-visible{
    background:transparent;
    border:none;
    color:#991b1b;
  }
  body.app .add-document-library .table-action-form{
    justify-content:flex-end;
  }
  body.app .add-document-library .doc-lib-actions{
    display:flex;
    flex-direction:row;
    flex-wrap:nowrap;
    gap:8px;
    justify-content:flex-end;
    align-items:center;
  }
  body.app .add-document-library .doc-lib-actions form{
    display:inline-flex;
    margin:0;
  }
  body.app .school-year-panel .panel-head,
  body.app .add-document-panel .panel-head{
    padding:16px 18px 12px;
  }
  body.app .school-cal-card{
    padding:20px 22px 18px;
    background:linear-gradient(180deg,#f7fbfb 0%,#fff 120px);
    border:1px solid #e4eef1;
    border-radius:20px;
    box-shadow:0 10px 28px rgba(8, 52, 58, .05);
  }
  /* Admin + teacher full calendar: keep the month visible (page scrolls, board not clipped). */
  body.app:has(.page .school-cal-card) .main{
    overflow:hidden;
    min-height:0;
  }
  body.app:has(.page .school-cal-card) .page{
    overflow:auto;
    min-height:0;
    padding-bottom:24px;
  }
  body.app:has(.page .school-cal-card) .school-cal-card{
    margin-bottom:8px;
  }
  body.app:has(.page .school-cal-card) .school-cal-board{
    overflow:visible;
  }
  body.app:has(.page .school-cal-card) .school-cal-grid{
    grid-auto-rows:86px;
  }
  body.app:has(.page .school-cal-card) .school-cal-cell{
    min-height:0;
    height:100%;
  }
  @media (max-height:900px){
    body.app:has(.page .school-cal-card) .school-cal-grid{
      grid-auto-rows:72px;
    }
    body.app:has(.page .school-cal-card) .school-cal-cell{
      min-height:0;
      height:100%;
      padding:7px 7px 6px;
    }
    body.app:has(.page .school-cal-card) .school-cal-num{
      min-width:24px;
      height:24px;
      font-size:12px;
    }
    body.app:has(.page .school-cal-card) .school-cal-card{
      padding:14px 16px 12px;
    }
  }
  body.app .school-cal-card .school-cal{
    margin:0;
    gap:16px;
  }
  body.app .school-cal{
    display:flex;
    flex-direction:column;
    gap:16px;
  }
  body.app .school-cal-top{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:12px 16px;
    position:relative;
    z-index:5;
    padding:4px 2px 2px;
    overflow:visible;
  }
  @media (max-width: 1100px){
    body.app .school-cal-top{
      flex-direction:column;
      align-items:stretch;
    }
    body.app .school-cal-top-left{
      justify-content:flex-start;
    }
    body.app .school-cal-legend{
      margin-left:0;
    }
  }
  body.app .school-cal-top-left{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex-wrap:wrap;
    min-width:0;
    margin-left:auto;
  }
  body.app .school-cal-back.modal-close,
  body.app a.school-cal-back.modal-close{
    flex:0 0 auto;
    margin-left:4px;
    width:38px;
    height:38px;
    min-width:38px;
    padding:0;
    border-radius:12px;
    border:1.5px solid #dce8eb;
    background:#fff;
    color:#6b8790;
    font-size:0;
    line-height:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    box-shadow:0 1px 2px rgba(8,52,58,.04);
    transition:background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
  }
  body.app .school-cal-back.modal-close:hover,
  body.app a.school-cal-back.modal-close:hover{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.35);
    color:var(--brand-teal-deep);
    box-shadow:0 3px 8px rgba(8,52,58,.08);
  }
  body.app .school-cal-edit-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    box-sizing:border-box;
    width:132px;
    min-width:132px;
    max-width:132px;
    height:38px;
    padding:0 12px;
    border-radius:10px;
    white-space:nowrap;
    font-size:13px;
    font-weight:700;
    line-height:1;
    background:#fff;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    color:var(--brand-teal-deep);
    box-shadow:none;
    transition:background .15s ease, border-color .15s ease, color .15s ease;
  }
  body.app .school-cal-edit-btn:hover{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.45);
    color:var(--brand-teal-deep);
  }
  body.app .school-cal-edit-btn.is-active,
  body.app .school-cal-edit-btn[aria-pressed="true"],
  body.app .school-cal-edit-btn.is-active:hover,
  body.app .school-cal-edit-btn[aria-pressed="true"]:hover{
    background:var(--button);
    background-color:#0d6a72;
    border-color:#0d6a72;
    color:#fff;
    opacity:1;
    box-shadow:none;
  }
  body.app .school-cal-hint{
    display:flex;
    align-items:flex-start;
    gap:8px;
    padding:8px 12px;
    border-radius:14px;
    background:#e8f4f6;
    color:var(--brand-teal-deep);
    font-size:12px;
    line-height:1.25;
    min-width:0;
  }
  body.app .school-cal-hint span span{
    display:block;
    color:#4d6b70;
    font-weight:500;
  }
  body.app .school-cal-hint strong{
    display:block;
    font-size:12.5px;
    font-weight:700;
    color:var(--brand-teal-deep);
  }
  body.app .school-cal-hint-ico{
    flex-shrink:0;
    width:16px;
    height:16px;
    margin-top:1px;
    border-radius:50%;
    background:#7eb8bf;
    color:#fff;
    font-size:11px;
    font-weight:800;
    font-style:normal;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  body.app .school-cal-mode-chip{
    display:flex;
    flex-direction:column;
    gap:1px;
    padding:8px 12px;
    border-radius:14px;
    background:#fff7ed;
    color:#9a3412;
    font-size:12px;
    line-height:1.25;
  }
  body.app .school-cal-mode-chip strong{
    font-size:12.5px;
  }
  body.app .school-cal.is-editing .school-cal-board{
    box-shadow:inset 0 0 0 2px rgba(245,158,11,.55);
    background:linear-gradient(180deg,#fffaf0 0%,#f4f8f9 48px);
  }
  body.app .school-cal-upload-status{
    font-size:12px;
    color:var(--brand-teal-deep);
    max-width:220px;
    line-height:1.3;
  }
  body.app .school-cal-upload-status.is-error{color:#b91c1c}
  body.app .school-cal-modal-tabs{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:stretch;
    gap:10px;
    width:100%;
    margin:0 0 16px;
  }
  body.app .school-cal-modal-tab{
    -webkit-appearance:none;
    appearance:none;
    width:100%;
    height:44px;
    margin:0;
    padding:0 12px;
    border-radius:12px;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    background:#fff;
    color:var(--brand-teal-deep);
    font:inherit;
    font-size:14px;
    font-weight:700;
    line-height:1;
    cursor:pointer;
    box-shadow:none;
  }
  body.app .school-cal-modal-tab:hover{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.45);
    color:var(--brand-teal-deep);
  }
  body.app .school-cal-modal-tab:focus,
  body.app .school-cal-modal-tab:focus-visible{
    outline:none;
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12);
  }
  body.app .school-cal-modal-tab.is-active,
  body.app .school-cal-modal-tab[aria-selected="true"]{
    background:var(--brand-teal-dark,#084a50);
    border-color:transparent;
    color:#fff;
    box-shadow:0 8px 18px rgba(8,74,80,.22);
  }
  body.app .school-cal-modal-tab.is-active:hover,
  body.app .school-cal-modal-tab[aria-selected="true"]:hover{
    background:var(--sidebar-deeper);
    color:#fff;
    border-color:transparent;
  }
  body.app .school-event-modal form[hidden],
  body.app .school-event-modal [hidden]{
    display:none !important;
  }
  body.app .school-cal-assigned{
    margin:0 0 16px;
    padding:12px;
    border:1px solid #e6eef2;
    border-radius:14px;
    background:#f7fbfb;
  }
  body.app .school-cal-assigned .school-event-existing{
    margin:0 0 10px;
    font-size:13px;
    font-weight:700;
    color:var(--brand-teal-deep);
  }
  body.app .school-cal-assigned .school-event-list{
    margin:0;
    gap:8px;
  }
  body.app .school-event-item--assigned{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:12px 14px;
    border:1px solid #e6eef2;
    border-radius:12px;
    background:#fff;
  }
  body.app .school-event-item--assigned .school-event-item-main{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
    min-width:0;
    flex:1;
  }
  body.app .school-event-item--assigned .school-cal-kind{
    margin:0;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
    color:var(--muted);
  }
  body.app .school-event-item--assigned strong{
    font-size:15px;
    font-weight:700;
    color:var(--text);
    line-height:1.4;
  }
  body.app .school-event-item-actions{
    display:flex;
    align-items:center;
    gap:8px;
    flex-shrink:0;
  }
  body.app .school-cal-mini-btn{
    height:34px;
    min-width:72px;
    padding:0 12px;
    border-radius:10px;
    font-size:13px;
    font-weight:700;
  }
  body.app .school-cal-legend{
    display:flex;
    align-items:center;
    gap:16px;
    margin-left:auto;
    font-size:13px;
    font-weight:600;
    color:#334155;
  }
  body.app .school-cal-legend span{
    display:inline-flex;
    align-items:center;
    gap:7px;
    white-space:nowrap;
  }
  body.app .school-cal-dot{
    width:8px;
    height:8px;
    border-radius:50%;
    display:inline-block;
  }
  body.app .school-cal-dot--holiday{background:#b03c36}
  body.app .school-cal-dot--event{background:var(--primary-color)}
  body.app .school-cal-dot--term{background:#4a7c82}
  body.app .school-cal-dot--deadline{background:#1f7a4d}
  body.app .school-cal-monthbar{
    display:inline-flex;
    align-items:center;
    gap:10px;
    position:relative;
    z-index:6;
    padding:0;
    border-radius:0;
    background:transparent;
    border:none;
    overflow:visible;
  }
  body.app .school-cal-month-picker{
    position:relative;
    z-index:7;
    overflow:visible;
  }
  body.app .school-cal-month-select{
    min-width:0;
    width:auto;
    height:42px;
    border-radius:12px;
    font-weight:800;
    font-size:18px;
    letter-spacing:-.01em;
    text-align:left;
    background:transparent;
    border:none;
    box-shadow:none;
    appearance:none;
    -webkit-appearance:none;
    padding:0 28px 0 4px;
    color:var(--brand-teal-deep);
    cursor:pointer;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23084a50' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 6px center;
    transition:color .15s ease, background .15s ease;
  }
  body.app .school-cal-month-select:hover{
    color:var(--brand-teal);
    background-color:rgba(var(--primary-rgb),.06);
    border-radius:10px;
  }
  body.app .school-cal-month-select[aria-expanded="true"]{
    color:var(--brand-teal);
    background-color:rgba(var(--primary-rgb),.1);
    border-radius:10px;
    box-shadow:none;
  }
  body.app .school-cal-month-panel{
    position:absolute;
    top:calc(100% + 8px);
    left:0;
    right:auto;
    transform:none;
    width:min(280px, calc(100vw - 48px));
    padding:12px;
    border-radius:16px;
    background:#fff;
    border:1px solid #e2ecee;
    box-shadow:0 16px 36px rgba(8,52,58,.16);
    z-index:80;
  }
  body.app .school-cal-month-panel.is-year-mode{
    width:min(300px, calc(100vw - 48px));
  }
  body.app .school-cal-month-panel.is-year-mode .school-cal-picker-grid{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
  body.app .school-cal-month-panel.is-year-mode .school-cal-picker-cell{
    height:36px;
    font-size:12.5px;
  }
  body.app .school-cal-month-panel-head{
    display:flex;
    align-items:center;
    gap:6px;
    margin:0 0 10px;
    padding:0 2px 8px;
    border-bottom:1px solid #eef3f4;
  }
  body.app .school-cal-picker-nav{
    width:34px;
    height:34px;
    padding:0;
    border:1px solid #e4eef1;
    border-radius:10px;
    background:#fff;
    color:var(--brand-teal-deep);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:background .15s ease, border-color .15s ease;
  }
  body.app .school-cal-picker-nav:hover{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.3);
    color:var(--brand-teal-deep);
  }
  body.app .school-cal-picker-year{
    flex:1 1 auto;
    height:34px;
    border:none;
    border-radius:10px;
    background:transparent;
    color:var(--brand-teal-deep);
    font-weight:800;
    font-size:15px;
    cursor:pointer;
  }
  body.app .school-cal-picker-year:hover{
    background:var(--primary-light);
  }
  body.app .school-cal-picker-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:6px;
  }
  body.app .school-cal-picker-cell{
    height:40px;
    border:none;
    border-radius:10px;
    background:#f4f8f9;
    color:#2f4a50;
    font-weight:700;
    font-size:13px;
    cursor:pointer;
    transition:background .15s ease, color .15s ease;
  }
  body.app .school-cal-picker-cell:hover{
    background:var(--primary-light);
    color:var(--brand-teal-deep);
  }
  body.app .school-cal-picker-cell.is-selected{
    background:var(--brand-teal);
    color:#fff;
  }
  body.app .school-cal-picker-cell.is-selected:hover{
    background:var(--brand-teal-dark,#084a50);
    color:#fff;
  }
  body.app .school-cal-nav{
    min-width:38px;
    min-height:38px;
    height:38px;
    width:38px;
    padding:0;
    border-radius:12px;
    border:1.5px solid #dce8eb;
    background:#fff;
    color:var(--brand-teal-deep);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 1px 2px rgba(8,52,58,.04);
    transition:background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
  }
  body.app .school-cal-nav:hover{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.35);
    color:var(--brand-teal);
    box-shadow:0 3px 8px rgba(8,52,58,.08);
  }
  body.app .school-cal-nav:active{
    transform:translateY(1px);
  }
  body.app .school-cal-top-left .btn.school-cal-nav,
  body.app .school-cal-monthbar .btn.school-cal-nav,
  body.app .school-cal-monthbar .btn.btn-secondary.school-cal-nav{
    min-width:38px;
    width:38px;
    height:38px;
    padding:0;
    border-radius:12px;
  }
  body.app .school-cal-board{
    background:#eef5f8;
    border:none;
    border-radius:18px;
    padding:6px 8px 10px;
    overflow:hidden;
    box-shadow:none;
  }
  body.app .school-cal-dow,
  body.app .school-cal-grid{
    display:grid;
    grid-template-columns:repeat(7, minmax(0, 1fr));
    gap:0;
  }
  body.app .school-cal-grid{
    grid-auto-rows:98px;
    align-items:stretch;
  }
  body.app .school-cal-dow{
    margin:0 0 8px;
  }
  body.app .school-cal-dow span{
    text-align:center;
    font-size:11px;
    font-weight:700;
    color:var(--muted);
    letter-spacing:.06em;
    text-transform:uppercase;
    padding:10px 0 8px;
    text-shadow:none;
  }
  body.app .school-cal-cell{
    -webkit-appearance:none;
    appearance:none;
    width:100%;
    height:100%;
    min-height:0;
    max-height:100%;
    box-sizing:border-box;
    border:1px solid transparent;
    background:#fff;
    padding:10px 9px 8px;
    text-align:left;
    cursor:default;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
    font:inherit;
    color:inherit;
    box-shadow:0 1px 2px rgba(8,52,58,.03);
    border-radius:14px;
    overflow:hidden;
    min-width:0;
    transition:background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
  }
  body.app .school-cal.is-editing .school-cal-cell{
    cursor:pointer;
  }
  body.app .school-cal-cell:hover{
    border-color:rgba(var(--primary-rgb),.22);
    box-shadow:0 4px 12px rgba(8,52,58,.07);
  }
  body.app .school-cal.is-editing .school-cal-cell:hover{
    transform:translateY(-1px);
    border-color:rgba(var(--primary-rgb),.35);
  }
  body.app .school-cal-cell.is-muted{
    background:#f3f5f6;
    box-shadow:none;
  }
  body.app .school-cal-cell.is-muted .school-cal-num{
    color:#5f7f85;
    font-weight:600;
    background:transparent;
  }
  body.app .school-cal-cell.is-outside{
    background:#f3f5f6;
    box-shadow:none;
  }
  body.app .school-cal-cell.is-today{
    border-color:rgba(var(--primary-rgb),.45);
    box-shadow:0 0 0 2px rgba(var(--primary-rgb),.12), 0 4px 12px rgba(8,52,58,.06);
  }
  body.app .school-cal-cell.is-today .school-cal-num{
    background:#0d6a72;
    color:#fff;
  }
  body.app .school-cal-cell.is-selected{
    border-color:#0d6a72;
    box-shadow:0 0 0 2px rgba(13,106,114,.16), 0 6px 14px rgba(8,52,58,.08);
  }
  body.app .school-cal-cell.is-holiday{
    background:#fceeee;
    border-color:#e2c4c2;
  }
  body.app .school-cal-cell.is-holiday .school-cal-num{
    color:#fff;
    background:#b03c36;
  }
  /* School events: one shared teal color */
  body.app .school-cal-cell.is-event:not(.is-holiday):not(.is-term){
    background:#e7f2f3;
    border-color:#d4dee0;
  }
  body.app .school-cal-cell.is-event:not(.is-holiday):not(.is-term) .school-cal-num{
    color:#fff;
    background:var(--primary-color);
  }
  /* Term dates: distinct color per term */
  body.app .school-cal-cell.is-term-1:not(.is-holiday){
    background:#eef3f4;
    border-color:#d4dee0;
  }
  body.app .school-cal-cell.is-term-1:not(.is-holiday) .school-cal-num{
    color:#fff;
    background:#4a7c82;
  }
  body.app .school-cal-cell.is-term-2:not(.is-holiday){
    background:#fff2e6;
    border-color:#f0d2b0;
  }
  body.app .school-cal-cell.is-term-2:not(.is-holiday) .school-cal-num{
    color:#fff;
    background:#c9651a;
  }
  body.app .school-cal-cell.is-term-3:not(.is-holiday){
    background:#e8f1f4;
    border-color:#c5d6de;
  }
  body.app .school-cal-cell.is-term-3:not(.is-holiday) .school-cal-num{
    color:#fff;
    background:var(--primary-color);
  }
  body.app .school-cal-cell.is-deadline:not(.is-holiday):not(.is-event):not(.is-term){
    background:#e7f5ee;
    border-color:#b7dfc8;
  }
  body.app .school-cal-cell.is-deadline:not(.is-holiday):not(.is-event):not(.is-term) .school-cal-num{
    color:#fff;
    background:#1f7a4d;
  }
  body.app .school-cal-num{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:28px;
    height:28px;
    padding:0 7px;
    border-radius:999px;
    font-size:13px;
    font-weight:800;
    color:#3d5a63;
    line-height:1;
    background:rgba(8,52,58,.05);
  }
  body.app .school-cal-chip{
    font-size:10.5px;
    line-height:1.3;
    font-weight:700;
    white-space:normal;
    overflow:hidden;
    display:flex;
    align-items:flex-start;
    max-width:100%;
    gap:6px;
    width:100%;
    padding:4px 7px;
    border-radius:8px;
    background:rgba(255,255,255,.72);
  }
  body.app .school-cal-chip::before{
    content:"";
    width:6px;
    height:6px;
    border-radius:50%;
    flex-shrink:0;
    background:currentColor;
    margin-top:4px;
    display:inline-block;
  }
  body.app .school-cal-chip--holiday{
    color:#b03c36;
    font-weight:700;
    background:rgba(255,255,255,.78);
  }
  body.app .school-cal-chip--event{color:var(--primary-color);background:rgba(255,255,255,.78)}
  body.app .school-cal-chip--term{color:#4a7c82;background:rgba(255,255,255,.78)}
  body.app .school-cal-chip--term.is-term-1,
  body.app .school-cal-summary-item .school-cal-chip--term.is-term-1{color:#4a7c82}
  body.app .school-cal-chip--term.is-term-2,
  body.app .school-cal-summary-item .school-cal-chip--term.is-term-2{color:#c9651a}
  body.app .school-cal-chip--term.is-term-3,
  body.app .school-cal-summary-item .school-cal-chip--term.is-term-3{color:var(--secondary-color)}
  body.app .school-cal-chip--deadline{color:#1f7a4d;background:rgba(255,255,255,.78)}
  body.app .school-cal-chip--more{
    color:#6b8790;
    font-weight:650;
    background:transparent;
    padding:2px 2px 0;
  }
  body.app .school-cal-chip--more::before{display:none}
  body.app .school-cal-foot{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:16px;
    padding:8px 2px 2px;
  }
  body.app .school-cal-month-summary{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:12px 14px;
    width:100%;
    min-width:0;
  }
  body.app .school-cal-summary-group{
    min-width:0;
    padding:14px 16px;
    border-radius:16px;
    background:#fff;
    border:1px solid #e6eef1;
    box-shadow:0 2px 8px rgba(8,52,58,.03);
  }
  body.app .school-cal-summary-group--holiday{background:#fceeee;border-color:#e2c4c2}
  body.app .school-cal-summary-group--term{background:#eef3f4;border-color:#d4dee0}
  body.app .school-cal-summary-group--event{background:#e7f2f3;border-color:#d4dee0}
  body.app .school-cal-summary-group--deadline{background:#e7f5ee;border-color:#b7dfc8}
  body.app .school-cal-summary-heading{
    display:flex;
    align-items:center;
    gap:8px;
    margin:0 0 10px;
    font-size:12px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:#334155;
  }
  body.app .school-cal-summary-empty{
    margin:0;
    font-size:12.5px;
  }
  body.app .school-cal-summary-item{
    display:block;
    padding:8px 0;
    border-top:1px solid rgba(15,40,50,.06);
    font-size:13px;
  }
  body.app .school-cal-summary-item:first-of-type{padding-top:0;border-top:none}
  body.app .school-cal-summary-copy{
    display:flex;
    flex-direction:column;
    gap:2px;
    min-width:0;
  }
  body.app .school-cal-summary-item strong{
    display:block;
    font-size:13.5px;
    font-weight:700;
    line-height:1.35;
    white-space:normal;
  }
  body.app .school-cal-summary-item strong::before{display:none}
  @media (max-width: 1100px){
    body.app .school-cal-month-summary{
      grid-template-columns:repeat(2, minmax(0, 1fr));
    }
  }
  @media (max-width: 900px){
    body.app .school-cal-month-summary{
      grid-template-columns:1fr;
    }
    body.app .school-cal-card{
      padding:14px 12px 12px;
    }
    body.app .school-cal-board{
      padding:10px;
    }
    body.app .school-cal-dow,
    body.app .school-cal-grid{
      gap:5px;
    }
    body.app .school-cal-grid{
      grid-auto-rows:78px;
    }
    body.app .school-cal-cell{
      min-height:0;
      height:100%;
      padding:7px 6px 6px;
      border-radius:12px;
    }
    body.app .school-cal-num{
      min-width:24px;
      height:24px;
      font-size:12px;
    }
    body.app .school-cal-chip{
      font-size:9.5px;
      padding:3px 5px;
    }
    body.app .school-cal-edit-btn,
    body.app .school-cal-top-left .btn.school-cal-edit-btn:not(.btn-danger):not(.btn-success){
      flex:1 1 0;
      width:auto;
      min-width:0;
      max-width:none;
      border-radius:10px;
    }
  }
  body.app .school-cal-summary-item .muted{font-size:12px;color:#94a3b8}
  body.app .school-cal-summary-item .school-cal-chip--holiday{color:#b03c36}
  body.app .school-cal-summary-item .school-cal-chip--event{color:var(--primary-color)}
  body.app .school-cal-summary-item .school-cal-chip--term{color:#4a7c82}
  body.app .school-cal-summary-item .school-cal-chip--deadline{color:#1f7a4d}
  body.app .school-cal-detail{
    border:1px solid var(--border);
    border-radius:10px;
    background:#f7fbfb;
    padding:12px 14px;
  }
  body.app .school-cal-detail p{margin:6px 0 0}
  body.app .school-cal-kind{
    display:inline-flex;
    align-items:center;
    margin:0 0 2px;
    font-size:10px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.05em;
  }
  body.app .school-cal-kind.school-cal-chip--holiday::before,
  body.app .school-cal-kind.school-cal-chip--event::before,
  body.app .school-cal-kind.school-cal-chip--deadline::before{
    display:none;
  }
  body.app .school-event-modal{
    width:min(520px,100%);
    max-height:min(86vh,740px);
    overflow:auto;
  }
  body.app .school-event-error{
    margin:0 0 10px;
    color:#b42318;
    font-size:13px;
  }
  body.app .school-event-existing{
    margin:0 0 12px;
    font-size:13px;
    font-weight:700;
    color:var(--brand-teal-deep);
  }
  body.app .school-event-group-title{
    display:flex;
    align-items:center;
    gap:8px;
    margin:14px 0 8px;
    font-size:11px;
    font-weight:800;
    letter-spacing:.05em;
    text-transform:uppercase;
    color:#64748b;
  }
  body.app .school-event-group-title:first-child{margin-top:0}
  body.app .school-event-list{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin:0;
  }
  body.app .school-event-item{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:12px 14px;
    border:1px solid #e8eef2;
    border-radius:14px;
    background:#f8fafc;
  }
  body.app .school-event-item--holiday{background:#fff7f7;border-color:#fecdd3}
  body.app .school-event-item--event,
  body.app .school-event-item--term{background:#eef3f4;border-color:#d4dee0}
  body.app .school-event-item--deadline{background:var(--status-completed-bg);border-color:#b7dfc8}
  body.app .school-event-item-main{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
    min-width:0;
    flex:1;
  }
  body.app .school-event-item-main strong{
    display:block;
    font-size:15px;
    font-weight:700;
    line-height:1.4;
    color:var(--text-primary);
  }
  body.app .school-event-meta{
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    gap:4px 10px;
    margin:2px 0 0;
    font-size:13px;
  }
  body.app .school-event-meta dt{
    margin:0;
    color:var(--muted);
    font-weight:700;
  }
  body.app .school-event-meta dd{
    margin:0;
    color:#475569;
  }
  body.app .school-event-note{
    margin:0;
    font-size:12.5px;
    line-height:1.4;
  }
  body.app .school-event-item-actions{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    flex-shrink:0;
  }
  body.app .school-cal-settings{
    margin-top:8px;
  }
  body.app .school-cal-settings-toggle{
    list-style:none;
    display:inline-flex;
    cursor:pointer;
  }
  body.app .school-cal-settings-toggle::-webkit-details-marker{display:none}
  body.app .school-cal-settings-body{
    margin-top:12px;
    padding-top:8px;
    border-top:1px solid var(--border);
    display:grid;
    gap:8px;
  }
  @media (max-width:700px){
    body.app .school-cal-board{
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
    }
    body.app .school-cal-dow,
    body.app .school-cal-grid{
      min-width:560px;
    }
    body.app .school-cal-grid{grid-auto-rows:56px}
    body.app .school-cal-cell{min-height:0;height:100%;padding:4px}
    body.app .school-cal-chip{font-size:9px}
    body.app .school-cal-dow span{font-size:10px}
  }
  @media (max-width:700px){
    body.app .deadline-md-row{grid-template-columns:1fr}
    body.app .calendar-term-row,
    body.app .calendar-exam-grid{grid-template-columns:1fr}
  }

  body.app .compliance-tabs-wrap{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin:0;
  }
  body.app .compliance-tabs-period{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
  }
  body.app .compliance-tabs-period .btn{
    height:var(--control-h);
    min-height:var(--control-h);
    flex:0 0 auto;
  }
  body.app .compliance-tabs-period .page-period-filters{
    margin:0;
  }
  body.app .compliance-search-bar + .compliance-tabs-wrap{
    margin-top:0;
  }
  body.app .compliance-tabs{
    display:flex;
    align-items:center;
    gap:0;
    margin:0;
    background:#fff;
    border-radius:var(--radius-md);
    padding:6px;
    box-shadow:var(--shadow-card);
    border:1px solid var(--border);
    width:100%;
    max-width:100%;
    flex-wrap:wrap;
  }
  body.app .compliance-tab{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:1 1 0;
    min-width:0;
    padding:11px 14px;
    border-radius:10px;
    text-decoration:none;
    color:var(--brand-teal-deep);
    font-weight:700;
    font-size:14px;
    text-align:center;
    background:transparent;
    border:none;
    transition:background .15s,color .15s;
  }
  body.app .compliance-tab:hover{
    background:rgba(var(--primary-rgb),.1);
  }
  body.app .compliance-tab.is-active{
    background:var(--button);
    background-color:#0d6a72;
    color:#fff;
    box-shadow:none;
  }

  body.app .compliance-doc-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
    gap:10px;
    margin-top:8px;
  }
  body.app .compliance-doc-option{
    display:flex;
    gap:10px;
    align-items:flex-start;
    padding:12px 14px;
    border:1.5px solid rgba(var(--primary-rgb),.22);
    border-radius:10px;
    background:#fff;
    cursor:pointer;
  }
  body.app .compliance-doc-option:has(input:checked){
    border-color:var(--brand-teal);
    background:rgba(var(--primary-rgb),.06);
  }
  body.app .compliance-doc-option input{
    margin-top:3px;
  }
  body.app .compliance-doc-option-body{
    display:flex;
    flex-direction:column;
    gap:2px;
    min-width:0;
  }
  body.app .compliance-doc-source{
    font-size:12px;
  }
  body.app .compliance-teacher-pick{
    max-height:none;
    overflow:visible;
    padding:4px 2px;
  }

  /* Assign Task â€” separate cards */
  body.app .main:has(.assign-task-form){
    min-height:100vh;
  }
  body.app .page:has(.assign-task-form){
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    min-height:0;
    padding-bottom:16px;
  }
  body.app .page:has(.assign-task-form) > .compliance-tabs{
    flex-shrink:0;
  }
  body.app .assign-task-split{
    display:grid;
    grid-template-columns:minmax(280px, .92fr) minmax(0, 1.18fr);
    align-items:stretch;
    gap:16px;
    min-width:0;
    margin-bottom:0;
    flex:1 1 auto;
    min-height:0;
  }
  body.app .assign-task-form{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    max-width:none;
    width:100%;
    margin:0;
    padding:0;
    box-sizing:border-box;
  }
  body.app .assign-task-panel{
    margin-bottom:0;
    overflow:hidden;
    min-width:0;
    height:100%;
    display:flex;
    flex-direction:column;
  }
  body.app .assign-task-panel .panel-head{
    padding:16px 18px 12px;
    flex-shrink:0;
  }
  body.app .assign-task-create-body{
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
    align-items:stretch;
    gap:16px;
    padding:12px 24px 24px;
    box-sizing:border-box;
    flex:1 1 auto;
  }
  body.app .assign-task-create-body > *{
    flex:0 0 auto;
  }
  body.app .assign-task-panel.assign-task-create,
  body.app .assign-task-create-body,
  body.app .assign-task-form .field-label,
  body.app .assign-task-form .sy-combo{
    overflow:visible;
  }
  body.app .assign-task-form .sy-combo-menu{
    width:100%;
    min-width:100%;
  }
  body.app .assign-task-targets-body{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:12px 24px 24px;
    box-sizing:border-box;
    flex:1 1 auto;
    min-height:0;
  }
  body.app .assign-task-form .field-label{
    display:flex;
    flex-direction:column;
    gap:8px;
    margin:0;
    min-width:0;
    font-weight:600;
    font-size:13px;
    color:var(--muted);
  }
  body.app .assign-task-form .input,
  body.app .assign-task-form #assign-deadline{
    width:100%;
    max-width:none;
    min-height:46px;
    padding:0 14px;
    box-sizing:border-box;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    border-radius:12px;
    background:#fff;
  }
  body.app .assign-task-form .input:focus,
  body.app .assign-task-form #assign-deadline:focus{
    outline:none;
    border-color:var(--brand-teal);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.14);
  }
  body.app .assign-deadline-hint{
    margin:0;
    font-size:13px;
  }
  body.app .assign-deadline-result{
    margin:0;
    font-size:15px;
    font-weight:600;
    color:var(--brand-teal-deep);
  }
  body.app .assign-deadline-result strong{
    font-weight:700;
  }
  body.app .assign-field-note{
    display:block;
    margin-top:6px;
    font-size:12.5px;
    font-weight:500;
    line-height:1.4;
  }
  body.app .assign-task-form .sy-combo-chevron svg{
    display:none;
  }
  body.app .assign-task-form .sy-combo-chevron::before{
    content:"";
    display:block;
    width:7px;
    height:7px;
    border-right:2px solid currentColor;
    border-bottom:2px solid currentColor;
    transform:rotate(45deg) translateY(-2px);
  }
  body.app .assign-rule-context[hidden],
  body.app .assign-rule-context .field-label[hidden],
  body.app .assign-task-form #teacher-pick[hidden],
  body.app #assign-all-note[hidden]{
    display:none !important;
  }
  body.app .assign-rule-context{
    display:grid;
    grid-template-columns:1fr;
    gap:16px;
    width:100%;
  }
  body.app .assign-deadline-multi-list{
    display:grid;
    gap:12px;
    margin-top:8px;
  }
  body.app .assign-deadline-row{
    display:grid;
    grid-template-columns:minmax(0,1.4fr) minmax(160px,0.8fr);
    gap:12px;
    align-items:end;
  }
  body.app .assign-deadline-row-copy{
    display:flex;
    flex-direction:column;
    gap:2px;
    min-width:0;
  }
  body.app .assign-deadline-row-copy strong{
    font-size:14.5px;
  }
  body.app .assign-task-form .compliance-doc-grid{
    grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));
    width:100%;
  }
  body.app .assign-task-form .compliance-scope-options{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px 24px;
    margin:0;
  }
  body.app .assign-task-form #teacher-pick{
    width:100%;
    min-height:0;
    padding:12px 14px;
    border:1.5px solid rgba(var(--primary-rgb),.18);
    border-radius:12px;
    background:#fff;
    box-sizing:border-box;
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
  }
  body.app .assign-task-form .compliance-teacher-pick{
    max-height:none;
    overflow:hidden;
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));
    gap:8px 16px;
    flex:1 1 auto;
    min-height:0;
    align-content:start;
  }
  body.app .assign-task-form .compliance-teacher-pick > label.radio{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:28px;
  }
  body.app .assign-task-form .compliance-teacher-pick input[type="checkbox"]{
    width:20px;
    height:20px;
    min-width:20px;
    min-height:20px;
    margin:0;
    flex:0 0 20px;
    accent-color:var(--brand-teal);
    cursor:pointer;
  }
  body.app .assign-task-form .compliance-teacher-pick > label.is-off-page{
    display:none !important;
  }
  body.app .teacher-pick-toolbar{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:8px 16px;
    flex-wrap:wrap;
    margin:0 0 8px;
  }
  body.app .teacher-pick-toolbar p{
    margin:0;
  }
  body.app .teacher-pick-count{
    font-weight:700;
    color:var(--brand-teal-deep);
    white-space:nowrap;
  }
  body.app .teacher-pick-pager{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:6px;
    margin-top:auto;
    margin-bottom:0;
    padding:10px 0 0;
    border-top:1px solid rgba(var(--primary-rgb),.12);
    flex-shrink:0;
  }
  body.app .teacher-pick-pager .register-page-btn{
    min-height:36px;
    min-width:36px;
    padding:0 10px;
    cursor:pointer;
    font:inherit;
    font-weight:700;
    font-size:13px;
    color:var(--brand-teal-deep);
    background:#fff;
    border:1.5px solid rgba(var(--primary-rgb),.22);
    border-radius:10px;
  }
  body.app .teacher-pick-pager .register-page-btn:hover{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.4);
    color:var(--brand-teal-deep);
  }
  body.app .teacher-pick-pager .register-page-btn.is-active{
    background:var(--button);
    background-color:#0d6a72;
    border-color:#0d6a72;
    color:#fff;
  }
  body.app .teacher-pick-pager .register-page-btn.is-active:hover{
    background:var(--button-hover);
    background-color:#0a555c;
    color:#fff;
  }
  body.app .teacher-pick-pager .register-page-btn.is-disabled,
  body.app .teacher-pick-pager .teacher-pick-ellipsis{
    opacity:.4;
    cursor:default;
    pointer-events:none;
    background:#fff;
    border-color:rgba(var(--primary-rgb),.16);
  }
  body.app .teacher-pick-pager .teacher-pick-ellipsis{
    border:none;
    min-width:20px;
    opacity:.7;
  }
  body.app .teacher-pick-pager .register-page-btn--icon{
    min-width:36px;
    font-size:16px;
    font-weight:800;
    line-height:1;
  }
  @media (max-width:720px){
    body.app .assign-task-form .compliance-teacher-pick{
      grid-template-columns:1fr;
    }
  }
  @media (max-width:420px){
    body.app .teacher-pick-pager .register-page-btn{
      min-width:0;
      padding:0 8px;
      font-size:12px;
    }
  }
  body.app .assign-task-actions{
    display:block;
    width:100%;
    margin-top:auto;
    flex-shrink:0;
  }
  body.app .assign-task-submit{
    width:100%;
    min-width:0;
    min-height:48px;
    height:48px;
    border-radius:12px;
    font-size:15px;
    font-weight:700;
    letter-spacing:.02em;
  }
  @media (max-width:980px){
    body.app .assign-task-split,
    body.app .assign-deadline-row{
      grid-template-columns:1fr;
    }
  }
  body.app .teacher-card--compliance .teacher-card-stats{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    margin-top:8px;
  }
  body.app .teacher-card--compliance .teacher-card-pct{
    font-weight:700;
    color:var(--brand-teal-deep);
    font-size:14px;
  }

  body.app .main:has(.compliance-monitor-wrap){
    min-height:100vh;
  }
  body.app .page:has(.compliance-monitor-wrap){
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    min-height:0;
    padding-bottom:16px;
  }
  body.app .page:has(.compliance-monitor-wrap) > .compliance-tabs{
    flex-shrink:0;
  }
  body.app .compliance-monitor-wrap{
    display:flex;
    flex-direction:column;
    gap:16px;
    min-width:0;
    margin-bottom:0;
    flex:1 1 auto;
    min-height:0;
  }
  body.app .compliance-monitor-wrap .compliance-monitor-head{
    padding:0 4px;
    align-items:center;
    justify-content:flex-end;
    flex-shrink:0;
  }
  body.app .compliance-split{
    display:grid;
    grid-template-columns:minmax(220px, 28%) minmax(0, 1fr);
    align-items:stretch;
    gap:16px;
    min-width:0;
    flex:1 1 auto;
    min-height:0;
  }
  body.app .compliance-split-col{
    min-width:0;
    min-height:0;
    height:100%;
    margin:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app .compliance-split-folders{
    background:#fff;
    display:flex;
    flex-direction:column;
  }
  body.app .compliance-split-folders .table-wrap{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    padding:0;
  }
  body.app .compliance-split-detail .table-wrap{
    padding:0;
    overflow:auto;
  }
  body.app .compliance-folder-table tbody tr.is-off-page{
    display:none !important;
  }
  body.app .folder-pager{
    margin-top:auto;
    margin-bottom:0;
    padding:10px 8px 12px;
    flex-shrink:0;
    background:#fff;
    border-top:1px solid rgba(var(--primary-rgb),.12);
  }
  body.app .compliance-folder-table{
    margin:0;
    width:100%;
  }
  body.app .compliance-folder-table thead th{
    background:#eef6f6;
    font-size:12px;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--muted);
    padding:12px 16px;
  }
  body.app .compliance-folder-table td{
    padding:0;
  }
  body.app .compliance-folder-link{
    display:flex;
    align-items:center;
    gap:10px;
    padding:12px 16px;
    text-decoration:none;
    color:var(--text);
    font-weight:700;
    font-size:14px;
  }
  body.app .compliance-folder-link .tf-folder-ico{
    width:32px;
    height:32px;
    flex-shrink:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    background:rgba(var(--primary-rgb),.1);
    color:var(--brand-teal);
  }
  body.app .compliance-folder-link .folder-name{
    min-width:0;
    word-break:break-word;
  }
  body.app .compliance-folder-table tbody tr:hover .compliance-folder-link{
    background:var(--primary-light);
  }
  body.app .compliance-folder-table tbody tr.is-active .compliance-folder-link,
  body.app .compliance-folder-table tbody tr.is-active .compliance-folder-link .folder-name{
    background:var(--brand-teal);
    color:#fff;
  }
  body.app .compliance-folder-table tbody tr.is-active .tf-folder-ico,
  body.app .compliance-folder-table tbody tr.is-active .tf-folder-ico svg{
    background:rgba(255,255,255,.16);
    color:#fff;
  }
  body.app .compliance-split-detail{
    padding:16px 16px 18px;
    background:#fff;
    min-width:0;
    overflow:hidden;
  }
  body.app .compliance-split-detail .table-wrap{
    flex:1 1 auto;
    min-width:0;
    width:100%;
    overflow:auto;
    padding:0;
  }
  body.app .compliance-split-detail .compliance-folder-req-table,
  body.app .compliance-split-detail .individual-compliance-table{
    width:100%;
    min-width:720px;
    table-layout:fixed;
    border-collapse:collapse;
  }
  body.app .compliance-split-detail .compliance-folder-req-table col.col-req{width:26%;}
  body.app .compliance-split-detail .compliance-folder-req-table col.col-deadline{width:13%;}
  body.app .compliance-split-detail .compliance-folder-req-table col.col-submitted{width:16%;}
  body.app .compliance-split-detail .compliance-folder-req-table col.col-status{width:14%;}
  body.app .compliance-split-detail .compliance-folder-req-table col.col-attachment{width:23%;}
  body.app .compliance-split-detail .compliance-folder-req-table col.col-action{width:8%;}
  body.app .compliance-split-detail .compliance-folder-req-table th,
  body.app .compliance-split-detail .compliance-folder-req-table td{
    padding:12px 10px;
    font-size:13px;
    vertical-align:middle;
    box-sizing:border-box;
    border:1px solid rgba(15, 61, 61, .18);
  }
  body.app .compliance-split-detail .compliance-folder-req-table thead th{
    background:#eef6f6;
    color:var(--muted);
    font-size:11px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    line-height:1.3;
  }
  body.app .compliance-split-detail .compliance-folder-req-table tbody td{
    color:var(--text);
    background:#fff;
    word-break:break-word;
    overflow-wrap:anywhere;
    white-space:normal;
  }
  body.app .compliance-split-detail .compliance-folder-req-table tbody td:nth-child(2),
  body.app .compliance-split-detail .compliance-folder-req-table tbody td:nth-child(3){
    white-space:nowrap;
    word-break:normal;
    overflow-wrap:normal;
  }
  /* Keep Status borders intact â€” pills must stay inside the cell */
  body.app .compliance-split-detail .compliance-folder-req-table thead th:nth-child(4),
  body.app .compliance-split-detail .compliance-folder-req-table tbody td:nth-child(4){
    text-align:center;
    white-space:nowrap;
    word-break:normal;
    overflow-wrap:normal;
    overflow:hidden;
  }
  body.app .compliance-split-detail .compliance-folder-req-table tbody td:nth-child(4) .pill{
    max-width:100%;
    box-sizing:border-box;
    justify-content:center;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.app .compliance-split-detail .compliance-folder-req-table tbody td:nth-child(5) a{
    display:inline;
    white-space:normal;
    word-break:break-word;
    overflow-wrap:anywhere;
  }
  body.app .compliance-split-detail .compliance-folder-req-table th.col-action,
  body.app .compliance-split-detail .compliance-folder-req-table td.col-action,
  body.app .compliance-split-detail .compliance-folder-req-table .col-action{
    width:8%;
    min-width:64px;
    max-width:76px;
    padding-left:4px;
    padding-right:4px;
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
  }
  body.app .compliance-split-detail-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:0 0 12px;
  }
  body.app .compliance-split-detail-head h3{
    margin:0;
    font-size:16px;
    color:var(--brand-teal-deep);
    min-width:0;
  }
  body.app .compliance-split-status-form{
    flex:0 0 auto;
    margin:0;
  }
  body.app .compliance-split-status-form .shared-drive-filter,
  body.app .compliance-split-status-form .sy-combo{
    min-width:148px;
    max-width:180px;
  }
  body.app .compliance-split-detail .register-actions{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:2px;
  }
  body.app .compliance-split-detail .register-actions form{
    display:inline-flex;
    margin:0;
  }
  body.app .compliance-split-detail .register-icon-btn{
    width:28px;
    min-width:28px;
    height:28px;
    padding:0;
  }
  body.app .compliance-split-empty{
    margin:48px 12px;
    text-align:center;
  }
  @media (max-width:980px){
    body.app .compliance-split{
      grid-template-columns:1fr;
    }
    body.app .compliance-split-folders{
      max-height:none;
      min-height:280px;
    }
  }
  body.app .compliance-monitor-head{
    align-items:flex-start;
    padding:16px 18px 8px;
    gap:12px 16px;
    flex-wrap:wrap;
  }
  body.app .compliance-monitor-head h2{
    margin:0;
  }
  body.app .compliance-monitor-head .btn{
    flex-shrink:0;
    white-space:nowrap;
  }
  body.app .compliance-monitor-head .row.gap{
    flex:1 1 auto;
    min-width:0;
  }

  /* Teacher files â€” view filter above folders */
  body.app .tf-filter-icons{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    padding:12px 16px 0;
  }
  body.app .tf-filter-form{
    margin:0;
  }
  body.app .toolbar .tf-filter-form{
    margin-left:0;
    flex-shrink:0;
  }
  body.app .toolbar .tf-filter-form .shared-drive-filter-select{
    min-width:148px;
    height:var(--control-h);
  }
  body.app .tf-filter-form .shared-drive-filter-select{
    min-width:160px;
    height:var(--control-h);
  }
  body.app .tf-filter-ico{
    width:auto;
    height:auto;
    min-width:28px;
    min-height:28px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:0;
    color:var(--muted);
    text-decoration:none;
    background:transparent;
    border:none;
    padding:0;
    box-shadow:none;
    transition:color .15s;
  }
  body.app .tf-filter-ico:hover{
    color:var(--brand-teal-deep);
    background:transparent;
  }
  body.app .tf-filter-ico.is-active{
    color:var(--brand-teal);
    background:transparent;
    border:none;
  }
  body.app .tf-filter-ico svg{
    display:block;
  }

  /* Shared folder cards (Teacher files + Teacher compliance) */
  body.app .teacher-files-panel,
  body.app .compliance-monitor-panel{
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app .main:has(.teacher-files-panel){
    min-height:0;
  }
  body.app .page:has(.teacher-files-panel){
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    min-height:0;
    padding-bottom:16px;
  }
  body.app .page:has(.teacher-files-panel) > .teacher-files-panel{
    flex:1 1 auto;
    min-height:0;
  }
  body.app .teacher-files-panel .tf-filter-icons{
    flex-shrink:0;
  }
  body.app .tf-folder-grid-wrap{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }
  body.app .folder-grid--teacher-files{
    display:grid;
    grid-template-columns:repeat(5, minmax(0, 1fr));
    gap:16px 12px;
    padding:16px 18px 12px;
    width:100%;
    box-sizing:border-box;
    min-height:0;
    align-content:start;
    overflow:hidden;
  }
  body.app .folder-grid--teacher-files .folder-card--teacher-file.is-off-page{
    display:none !important;
  }
  body.app .teacher-files-panel .teacher-files-pager{
    margin-top:auto;
    margin-bottom:0;
    padding:10px 20px 18px;
    justify-content:center;
    flex-shrink:0;
    background:#fff;
    border-top:1px solid rgba(var(--primary-rgb),.12);
  }
  body.app .folder-card--teacher-file{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:8px;
    min-height:0;
    min-width:0;
    padding:6px 4px 8px;
    background:transparent;
    border:none;
    border-radius:0;
    box-shadow:none;
    text-decoration:none;
    color:inherit;
    cursor:pointer;
  }
  body.app .folder-card--teacher-file:hover{
    border:none;
    box-shadow:none;
  }
  body.app .folder-card--teacher-file .tf-folder-visual{
    position:relative;
    width:86px;
    height:66px;
    flex-shrink:0;
    filter:drop-shadow(0 3px 6px rgba(8,74,80,.16));
    transition:transform .15s ease;
  }
  body.app .folder-card--teacher-file:hover .tf-folder-visual{
    transform:translateY(-2px);
  }
  body.app .folder-card--teacher-file .tf-folder-tab{
    position:absolute;
    top:0;
    left:8px;
    width:36px;
    height:14px;
    background:#4a7c82;
    border-radius:7px 10px 0 0;
  }
  body.app .folder-card--teacher-file .tf-folder-pocket{
    position:absolute;
    left:0;
    right:0;
    top:10px;
    bottom:0;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#0d6a72;
    border-radius:8px;
    color:#e7f6f7;
  }
  body.app .folder-card--teacher-file .tf-folder-pocket svg{
    display:block;
    opacity:.9;
  }
  body.app .folder-card--teacher-file .tf-folder-count{
    position:absolute;
    right:2px;
    bottom:4px;
    z-index:2;
    min-width:20px;
    height:20px;
    padding:0 5px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:#fff;
    color:var(--brand-teal-deep);
    font-size:11px;
    font-weight:800;
    line-height:1;
    box-shadow:0 1px 3px rgba(8,74,80,.22);
  }
  body.app .folder-card--teacher-file .folder-name{
    font-size:12.5px;
    font-weight:700;
    line-height:1.3;
    color:var(--text);
    text-align:center;
    word-break:break-word;
    max-width:100%;
  }
  body.app .folder-card--teacher-file .folder-meta{
    display:none;
  }
  body.app .tf-breadcrumb{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
    margin:0 0 10px;
    padding:0 18px;
    font-size:13px;
    font-weight:600;
    color:var(--muted);
    flex-shrink:0;
  }
  body.app .tf-breadcrumb a{
    color:var(--brand-teal-deep);
    text-decoration:none;
  }
  body.app .tf-breadcrumb a:hover{
    text-decoration:underline;
  }
  body.app .tf-breadcrumb-sep{
    color:var(--muted);
  }
  body.app .tf-breadcrumb-current{
    color:var(--text);
  }
  body.app .tf-breadcrumb--modal{
    margin:0 0 4px;
    font-size:12px;
  }
  body.app .tf-view-head{
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:10px;
    padding:14px 18px 10px;
    flex-shrink:0;
  }
  body.app .tf-back-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    flex-shrink:0;
    color:var(--brand-teal-deep);
    text-decoration:none;
    border-radius:8px;
  }
  body.app .tf-back-link:hover{
    background:rgba(var(--primary-rgb),.1);
  }
  body.app .tf-back-ico{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  body.app .tf-view-title{
    margin:0;
    font-size:1.35rem;
    font-weight:800;
    color:var(--text);
    line-height:1.25;
  }
  body.app .tf-doc-list-wrap{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    margin:4px 18px 0;
    border:1px solid rgba(var(--primary-rgb),.14);
    border-radius:12px;
    background:#fff;
  }
  body.app .tf-doc-list-wrap.tf-folder-drive-wrap{
    border:none;
    background:transparent;
    margin:0;
    border-radius:0;
  }
  body.app .tf-folder-plain > .tf-wlp-files > .tf-doc-list-wrap.tf-folder-drive-wrap{
    margin:0 4px;
  }
  body.app .tf-folder-plain .tf-folder-file-grid{
    padding-left:14px;
    padding-right:14px;
  }
  body.app .tf-doc-list-wrap > .shared-drive-grid.tf-folder-file-grid{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    align-content:start;
  }
  body.app .tf-folder-file-grid > .shared-drive-card.is-off-page{
    display:none !important;
  }
  body.app .tf-file-type-ico{
    position:relative;
    width:72px;
    height:72px;
    border-radius:16px;
  }
  body.app .tf-file-type-ico svg{
    display:block;
  }
  body.app .tf-file-type-badge{
    position:absolute;
    left:50%;
    bottom:8px;
    transform:translateX(-50%);
    min-width:34px;
    padding:2px 6px;
    border-radius:4px;
    background:#fff;
    color:inherit;
    font-size:9px;
    font-weight:800;
    letter-spacing:.04em;
    line-height:1.2;
    text-align:center;
    box-shadow:0 1px 3px rgba(0,0,0,.12);
  }
  body.app .tf-file-type-ico--pdf{
    color:#c5221f;
    background:rgba(197,34,31,.12);
  }
  body.app .tf-file-type-ico--doc{
    color:var(--primary-color);
    background:rgba(24,90,189,.12);
  }
  body.app .tf-file-type-ico--sheet{
    color:#0f7b3a;
    background:rgba(15,123,58,.12);
  }
  body.app .tf-file-type-ico--slide{
    color:#c43e1c;
    background:rgba(196,62,28,.12);
  }
  body.app .tf-file-type-ico--image{
    color:#7b1fa2;
    background:rgba(123,31,162,.12);
  }
  body.app .tf-file-type-ico--zip{
    color:#5f6368;
    background:rgba(95,99,104,.12);
  }
  body.app .tf-file-type-ico--file{
    color:var(--brand-teal);
    background:rgba(var(--primary-rgb),.12);
  }
  body.app .shared-file-info-ico.tf-file-type-ico{
    width:48px;
    height:48px;
    border-radius:12px;
  }
  body.app .tf-folder-plain{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
  }
  body.app .tf-wlp-files{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
  }
  body.app .teacher-files-panel .tf-doc-list-wrap + .register-pagination,
  body.app .tf-wlp-files > .register-pagination.teacher-files-pager,
  body.app .tf-doc-list-wrap .register-pagination{
    margin-top:auto;
    margin-bottom:0;
    padding:10px 16px 14px;
    justify-content:center;
    flex-shrink:0;
    border-top:1px solid rgba(var(--primary-rgb),.1);
    background:#fff;
  }
  @media (max-width:1100px){
    body.app .folder-grid--teacher-files{
      grid-template-columns:repeat(4, minmax(0, 1fr));
    }
  }
  @media (max-width:820px){
    body.app .folder-grid--teacher-files{
      grid-template-columns:repeat(3, minmax(0, 1fr));
    }
  }
  @media (max-width:560px){
    body.app .folder-grid--teacher-files{
      grid-template-columns:repeat(2, minmax(0, 1fr));
    }
  }

  /* Teacher folder page fill */
  html:has(body.app.page-teacher-files),
  body.app.page-teacher-files{
    height:100%;
  }
  body.app.page-teacher-files .shell{
    height:100vh;
    height:100dvh;
    max-height:100dvh;
    overflow:hidden;
  }
  body.app.page-teacher-files .main{
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app.page-teacher-files .page{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app.page-teacher-files .teacher-files-panel{
    flex:1 1 auto;
    min-height:0;
  }
  body.app.page-teacher-files .page > .toolbar,
  body.app.page-teacher-files .teacher-files-tools{
    flex-shrink:0;
  }
  body.app .tf-folder-files-viewport{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }
  body.app #teacher-folder-modal .tf-folder-drive-wrap{
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }
  body.app .tf-file-list-wrap--page{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }
  body.app .tf-file-list-wrap{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:12px;
    background:#fff;
  }
  body.app .tf-folder-drive-wrap{
    border:none;
    background:transparent;
  }
  body.app .tf-folder-file-grid{
    padding:12px 14px 14px;
    gap:12px;
  }
  body.app .tf-file-empty{
    margin:0 auto;
    padding:48px 20px;
    text-align:center;
    font-size:14px;
  }
  body.app .tf-file-list{
    list-style:none;
    margin:0;
    padding:8px;
    display:flex;
    flex-direction:column;
    gap:4px;
  }
  body.app .tf-file-item{
    margin:0;
  }
  body.app .tf-file-link{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 14px;
    border-radius:10px;
    text-decoration:none;
    color:var(--text);
    font-weight:600;
    font-size:14px;
  }
  body.app .tf-file-link:hover{
    background:rgba(var(--primary-rgb),.08);
    color:var(--brand-teal-deep);
  }
  body.app .tf-file-ico{
    width:36px;
    height:36px;
    flex-shrink:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    background:rgba(var(--primary-rgb),.1);
    color:var(--brand-teal);
  }
  body.app .tf-file-name{
    min-width:0;
    word-break:break-word;
  }
  body.app .tf-file-list-wrap--page{
    margin:0;
    flex:1 1 auto;
    min-height:220px;
    overflow:auto;
    padding:4px 0 8px;
  }
  body.app .tf-file-meta{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:2px;
  }
  body.app .tf-file-date{
    font-size:12px;
    font-weight:500;
  }

  /* Individual compliance modal: cover MAIN AREA only (after sidebar), never the sidebar.
     Root cause of overlap: base .modal-overlay uses width:100vw + .modal--wide uses 96vw,
     so a â€œcenteredâ€ dialog was still sized to the full viewport and spilled left. */
  body.app{
    --app-sidebar-width:248px;
    --app-topbar-height:64px;
    /* Dialogs cover full main column including topbar (sidebar stays clear). */
    --app-modal-top:0px;
    /* List modals: sit a bit below the topbar so they don't crowd the header. */
    --app-modal-list-top:calc(var(--app-topbar-height) + 14px);
  }
  /* Keep content controls above list-modal dim region without reintroducing white cards. */
  body.app .page > .toolbar.toolbar--between,
  body.app .page > .compliance-search-bar,
  body.app .register-page > .register-toolbar,
  body.app .teacher-files-tools,
  body.app .notice-mgmt-panel-tools{
    position:relative;
    z-index:2;
  }
  body.app .modal-overlay.modal-overlay--main,
  body.app .modal-overlay{
    position:fixed;
    top:var(--app-modal-top);
    right:0;
    bottom:0;
    left:var(--app-sidebar-width);
    inset:var(--app-modal-top) 0 0 var(--app-sidebar-width);
    width:auto !important;
    max-width:none;
    height:auto !important;
    min-height:0 !important;
    margin:0;
    padding:16px 20px 20px;
    box-sizing:border-box;
    display:flex;
    /* Form dialogs: centered in the overlay. */
    align-items:center;
    justify-content:center;
    /* Above topbar (2050), below sidebar (2100) so dim covers header but not nav. */
    z-index:2080;
    /* Shared modal wash â€” soft gray dim + light blur (all modals). */
    background:rgba(26,43,46,.42);
    backdrop-filter:blur(2px);
    -webkit-backdrop-filter:blur(2px);
  }
  body.app .modal-overlay .modal{
    margin:auto;
    max-height:calc(100vh - var(--app-modal-top) - 32px);
    background:#fff;
    border-radius:16px;
    border:1px solid rgba(var(--primary-rgb),.16);
    box-shadow:0 24px 56px rgba(26,43,46,.18);
  }
  /* List modals (teacher folder / all compliance / etc.): below search, fill the pane. */
  body.app .modal-overlay--main:has(.individual-compliance-modal){
    top:var(--app-modal-list-top);
    inset:var(--app-modal-list-top) 0 0 var(--app-sidebar-width);
    align-items:stretch;
    padding-top:18px;
  }
  body.app .modal-overlay--main .individual-compliance-modal.modal,
  body.app .modal-overlay--main .individual-compliance-modal{
    width:100% !important;
    max-width:none !important;
    height:auto;
    max-height:none;
    margin:0 !important;
    padding:22px 24px 24px;
    flex:1 1 auto;
    align-self:stretch;
    box-sizing:border-box;
    display:flex;
    flex-direction:column;
  }
  body.app .individual-compliance-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
    flex-shrink:0;
    overflow:visible;
    position:relative;
    z-index:2;
  }
  body.app .individual-compliance-head-tools{
    display:flex;
    align-items:center;
    gap:8px;
    margin-left:auto;
    flex-shrink:0;
  }
  body.app .individual-compliance-head-tools .all-compliance-status-form{
    margin:0;
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:nowrap;
  }
  body.app .individual-compliance-head-tools .all-compliance-status-form .shared-drive-filter{
    margin:0;
  }
  body.app .individual-compliance-head-tools .all-compliance-status-form .sy-combo{
    position:relative;
  }
  body.app .individual-compliance-head-tools .all-compliance-status-form .sy-combo-trigger{
    min-width:132px;
  }
  body.app .individual-compliance-head-tools .shared-drive-filter-select{
    height:var(--control-h);
    min-height:var(--control-h);
    min-width:132px;
  }
  body.app .individual-compliance-head h2{
    margin:0;
    font-size:1.15rem;
    color:var(--text);
  }
  body.app .individual-compliance-head .modal-intro{
    margin:6px 0 0;
  }
  body.app .modal-close,
  body.app a.modal-close,
  body.app button.modal-close{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:36px;
    height:36px;
    padding:0;
    margin:0;
    border:none;
    border-radius:10px;
    box-sizing:border-box;
    line-height:0;
    font-size:0;
    color:var(--brand-teal-deep);
    text-decoration:none;
    background:transparent;
  }
  body.app .modal-close:hover,
  body.app a.modal-close:hover,
  body.app button.modal-close:hover{
    background:rgba(var(--primary-rgb),.1);
    color:var(--brand-teal-dark);
  }
  body.app .modal-close::before,
  body.app a.modal-close::before,
  body.app button.modal-close::before{
    content:"\00d7";
    display:block;
    font-size:22px;
    font-weight:500;
    line-height:1;
    width:1em;
    height:1em;
    text-align:center;
  }
  body.app .individual-compliance-head .modal-close{
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:0;
  }
  body.app .individual-compliance-table-wrap{
    padding:0;
    border:1px solid var(--border);
    border-radius:12px;
    overflow:hidden;
    flex:1 1 auto;
    min-height:0;
    max-height:none;
  }
  body.app .individual-compliance-table{
    margin:0;
    width:100%;
  }
  body.app .individual-compliance-table thead th{
    background:#f7f9fa;
    color:var(--muted);
  }
  body.app .individual-compliance-table .td-action,
  body.app .individual-compliance-table .col-action{
    width:1%;
    white-space:nowrap;
    vertical-align:middle;
  }
  body.app .individual-compliance-empty{
    text-align:center;
    color:var(--muted);
    border-bottom:none;
  }
  @media (max-width:640px){
    body.app .modal-overlay.modal-overlay--main,
    body.app .modal-overlay{
      left:0;
      top:var(--app-modal-top);
      inset:var(--app-modal-top) 0 0 0;
      width:auto !important;
      padding:12px;
    }
    body.app .modal-overlay--main:has(.individual-compliance-modal){
      top:var(--app-modal-list-top);
      inset:var(--app-modal-list-top) 0 0 0;
    }
    body.app .modal-overlay--main .individual-compliance-modal.modal,
    body.app .modal-overlay--main .individual-compliance-modal{
      width:100% !important;
      max-width:100% !important;
    }
  }

  body.app textarea.input{
    resize:vertical;
    min-height:84px;
    line-height:1.45;
  }

  @media (max-width:640px){
    body.app .compliance-tabs{
      flex-wrap:wrap;
    }
    body.app .compliance-tab{
      flex:1 1 calc(50% - 4px);
      font-size:13px;
      padding:10px 8px;
    }
  }
  
  /* Teacher cards grid â€” fill width, not stuck left */
  body.app .teacher-card-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
    gap:16px;
    padding:16px 18px 22px;
    width:100%;
  }
  body.app .teacher-card{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:16px 18px;
    border-radius:16px;
    background:#fff;
    border:1px solid rgba(var(--primary-rgb),.16);
    box-shadow:0 4px 14px rgba(var(--primary-rgb),.06);
    min-width:0;
  }
  body.app .teacher-card-left{
    display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
    flex:1;
  }
  body.app .teacher-card-meta{
    display:flex;
    flex-direction:column;
    gap:2px;
    min-width:0;
  }
  body.app .teacher-card-name{
    font-size:15px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .teacher-card-email{
    font-size:12px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .teacher-card .btn{flex-shrink:0}
  
  /* Sidebar: pinned to the viewport so height never follows page content */
  body.app .sidebar{
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    align-self:auto;
    flex-shrink:0;
    width:var(--app-sidebar-width);
    height:100vh;
    height:100dvh;
    max-height:none;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    z-index:2100;
    background-color:var(--sidebar);
    background-image:none;
  }
  body.app .sidebar-brand{flex-shrink:0}
  body.app .sidebar-brand a.logo-home-link{
    cursor:pointer;
    text-decoration:none;
    transition:transform .15s ease, opacity .15s ease;
  }
  body.app .sidebar-brand a.logo-home-link:hover{transform:scale(1.04)}
  body.app .sidebar-brand a.logo-home-link:focus-visible{
    outline:2px solid rgba(255,255,255,.7);
    outline-offset:4px;
    border-radius:50%;
  }
  body.app .nav{
    flex:1 1 auto;
    overflow:hidden;
    min-height:0;
    padding-right:0;
    gap:8px;
    scrollbar-width:none;
  }
  body.app .nav::-webkit-scrollbar{
    display:none;
    width:0;
    height:0;
  }
  body.app .sidebar-footer{
    flex-shrink:0;
    padding-top:10px;
    margin-top:6px;
    border-top:1px solid rgba(255,255,255,.18);
  }
  body.app .nav-link.logout{
    margin-top:0;
    background:#042f33;
    background-color:#042f33;
    border:1.5px solid #042f33;
    color:#fff;
    opacity:1;
    box-shadow:none;
  }
  body.app .nav-link.logout:hover,
  body.app .nav-link.logout:focus-visible{
    background:#031f22;
    background-color:#031f22;
    border-color:#031f22;
    color:#fff;
  }
  body.app .sidebar-footer .nav-link.logout{
    background:#042f33;
    background-color:#042f33;
    border:1.5px solid #042f33;
    color:#fff;
  }

  body.app .topbar-dropdown--profile{
    width:288px;
    min-width:288px;
    padding:0;
  }
  body.app .topbar-profile-info{
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 14px 12px;
    background:#f6fbfb;
    border-bottom:1px solid #e8eef0;
  }
  body.app .topbar-profile-copy{
    min-width:0;
    flex:1;
  }
  body.app .topbar-profile-name{
    font-size:14px;
    font-weight:700;
    color:var(--brand-teal-deep);
    line-height:1.3;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.app .topbar-profile-email{
    margin-top:2px;
    font-size:12px;
    color:var(--muted);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.app .topbar-profile-role{
    display:inline-flex;
    margin-top:6px;
    padding:2px 8px;
    border-radius:999px;
    font-size:11px;
    font-weight:700;
    background:rgba(var(--primary-rgb),.12);
    color:var(--brand-teal-deep);
  }
  body.app .avatar.avatar--menu{
    width:42px;
    height:42px;
    flex-shrink:0;
    font-size:13px;
  }
  body.app .topbar-profile-actions{
    display:flex;
    flex-direction:column;
    padding:6px;
  }
  body.app .topbar-dropdown-link{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0;
    padding:10px 12px;
    border-radius:10px;
    text-decoration:none;
    color:var(--brand-teal-deep);
    font-weight:600;
    font-size:13.5px;
  }
  body.app .topbar-dropdown-link:hover{
    background:rgba(var(--primary-rgb),.08);
  }
  body.app .topbar-dropdown-ico{
    width:18px;
    height:18px;
    color:var(--brand-teal);
    flex-shrink:0;
    display:grid;
    place-items:center;
  }
  body.app .topbar-dropdown-ico svg{
    width:18px;
    height:18px;
    display:block;
  }
  body.app .topbar-dropdown-link--danger{
    color:#b42318;
    margin-top:4px;
    border-top:1px solid #eef0f3;
    border-radius:0 0 10px 10px;
  }
  body.app .topbar-dropdown-link--danger .topbar-dropdown-ico{color:#b42318}
  body.app .topbar-dropdown-link--danger:hover{background:#fef2f2}
  body.app .topbar-dropdown--notif{width:min(380px,92vw);padding:0}
  body.app .topbar-dropdown-head{
    background:#fff;
    padding:14px 16px 10px;
    border-bottom:1px solid #eef2f3;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  body.app .topbar-dropdown-head-title{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-width:0;
  }
  body.app .topbar-dropdown-head-actions{
    display:inline-flex;
    align-items:center;
    gap:12px;
    flex-shrink:0;
  }
  body.app .topbar-dropdown-head strong{color:var(--brand-teal-deep);font-size:15px}
  body.app .topbar-notif-count{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:22px;
    height:22px;
    padding:0 7px;
    border-radius:999px;
    background:#0d6a72;
    color:#fff;
    font-size:12px;
    font-weight:700;
    line-height:1;
  }
  body.app .topbar-notif-mark-all{
    border:0;
    background:transparent;
    color:var(--brand-teal);
    font-weight:600;
    font-size:12.5px;
    padding:0;
    cursor:pointer;
    white-space:nowrap;
  }
  body.app .topbar-notif-mark-all:hover{text-decoration:underline}
  body.app .topbar-dropdown-head a{
    color:var(--brand-teal);
    font-weight:600;
    font-size:13px;
  }
  body.app .notif-page-head-actions{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
  }
  body.app .topbar-dropdown--notif .topbar-dropdown-body{
    max-height:min(420px,70vh);
    overflow:auto;
  }
  body.app .topbar-notif-card{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:14px 16px;
    background:#fff;
    border-bottom:1px solid #f0f4f5;
    transition:background .12s;
  }
  body.app .topbar-notif-card:last-child{border-bottom:none}
  body.app .topbar-notif-card:hover{background:#f7fbfb}
  body.app .topbar-notif-ico{
    width:36px;
    height:36px;
    border-radius:999px;
    display:grid;
    place-items:center;
    flex-shrink:0;
    background:rgba(var(--primary-rgb),.12);
    color:var(--brand-teal-deep);
  }
  body.app .topbar-notif-ico svg{width:var(--icon-size-ui);height:var(--icon-size-ui);display:block}
  body.app .topbar-notif-card.notif-kind-shared .topbar-notif-ico{
    background:#e4f0fb;
    color:#2f6b90;
  }
  body.app .topbar-notif-card.notif-kind-discrepancy .topbar-notif-ico,
  body.app .topbar-notif-card.notif-kind-deadline .topbar-notif-ico{
    background:#fff3d6;
    color:#c47a22;
  }
  body.app .topbar-notif-card.notif-kind-overdue .topbar-notif-ico{
    background:#fceeee;
    color:#c0453d;
  }
  body.app .topbar-notif-content{min-width:0;flex:1}
  body.app .topbar-notif-title{font-weight:700;font-size:13.5px;margin-bottom:3px;color:#1f2a2e;line-height:1.35}
  body.app .topbar-notif-body{
    font-size:12px;color:var(--muted);line-height:1.45;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }
  body.app .topbar-notif-time{font-size:11px;color:#8a969b;margin-top:6px}
  body.app .topbar-notif-go{
    color:#9aa7ab;
    flex-shrink:0;
    margin-top:8px;
    width:16px;
    height:16px;
  }
  body.app .topbar-notif-go svg{width:16px;height:16px;display:block}
  body.app .notif-empty-mini{padding:32px 16px;text-align:center}
  body.app .notif-empty-ico{
    width:52px;height:52px;margin:0 auto 12px;border-radius:999px;
    background:#e7f2f3;
    position:relative;
  }
  body.app .notif-empty-ico::before{
    content:"";
    position:absolute;inset:14px 16px 12px;
    border:2.5px solid var(--brand-teal-deep);
    border-radius:10px 10px 12px 12px;
    border-top-width:3px;
  }
  body.app .notif-empty-ico::after{
    content:"";
    position:absolute;top:10px;left:50%;width:10px;height:8px;
    margin-left:-5px;border:2.5px solid var(--brand-teal-deep);
    border-bottom:none;border-radius:10px 10px 0 0;
  }
  
  /* View all + wide modal */
  body.app .btn-view-all{
    border-radius:999px !important;
    padding:8px 18px !important;
    font-size:13px !important;
    box-shadow:none;
  }
  body.app .modal--wide{width:min(920px,96vw)}
  body.app .table-wrap--modal{
    max-height:min(55vh,480px);
    overflow:auto;
    border:1px solid rgba(var(--primary-rgb),.15);
    border-radius:12px;
  }
  
  /* =========================================================
     35. FOLDER ACTIONS
     ========================================================= */
  /* Folder cards */
  body.app .folder-icon{
    width:36px;height:28px;display:inline-block;position:relative;flex-shrink:0;
    background:var(--brand-teal);border-radius:4px 4px 6px 6px;
    box-shadow:none;
  }
  body.app .folder-icon::before{
    content:"";
    position:absolute;left:0;top:-7px;width:14px;height:10px;
    background:var(--brand-teal-dark);border-radius:3px 3px 0 0;
  }
  
  body.app .kpi--approved-folder{
    position:relative;
  }
  body.app .disc-forms-ico{
    width:auto;
    height:auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:0;
    color:var(--brand-teal);
    background:transparent;
    border:none;
    box-shadow:none;
    text-decoration:none;
    transition:color .15s;
  }
  body.app .disc-forms-ico:hover{
    background:transparent;
    border:none;
    color:var(--brand-teal-deep);
  }
  body.app .disc-forms-ico svg{display:block}
  body.app .kpi--approved-folder .disc-forms-ico.disc-forms-ico--on-kpi{
    position:absolute;
    z-index:2;
    right:10px;
    bottom:10px;
    width:42px;
    height:42px;
    color:var(--status-completed) !important;
    background:transparent;
    border:none;
    box-shadow:none;
  }
  body.app .kpi--approved-folder .disc-forms-ico.disc-forms-ico--on-kpi:hover{
    background:transparent;
    color:var(--status-completed) !important;
  }
  body.app .kpi--approved-folder .disc-forms-ico.disc-forms-ico--on-kpi svg,
  body.app .kpi--approved-folder .disc-forms-ico.disc-forms-ico--on-kpi svg path{
    width:22px;
    height:22px;
    stroke:currentColor !important;
    color:inherit !important;
  }
  body.app .notice-mgmt-tabs{
    margin:0;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    padding:6px;
  }
  body.app .notice-mgmt-tabs .compliance-tab{
    padding:11px 14px;
    font-size:14px;
  }
  body.app .notice-management-panel{
    margin-top:0;
  }
  body.app .notice-mgmt-table-wrap{
    padding:14px 16px 16px;
    overflow-x:auto;
  }
  body.app .notice-mgmt-table{
    width:100%;
  }
  body.app .notice-mgmt-table th,
  body.app .notice-mgmt-table td{
    vertical-align:middle;
    padding:12px 14px;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin{
    table-layout:fixed;
    min-width:0;
    width:100%;
    border-collapse:collapse;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin th,
  body.app .notice-mgmt-table.notice-mgmt-table--admin td{
    padding:9px 8px;
    font-size:12.5px;
    line-height:1.3;
    vertical-align:middle;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin thead th{
    padding:8px;
    font-size:10.5px;
    letter-spacing:0.03em;
    white-space:normal;
    line-height:1.25;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin .col-dr{width:11%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin .col-teacher{width:13%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin .col-req{width:18%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin .col-date{width:11%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin .col-issued{width:12%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin .col-status{width:14%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin .col-action{width:7%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin .col-approved-by{width:12%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin.notice-mgmt-table--approved .col-req{width:16%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin.notice-mgmt-table--approved .col-status{width:12%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin.notice-mgmt-table--approved .col-approved-by{width:13%;}
  body.app .notice-mgmt-table.notice-mgmt-table--admin td.col-dr,
  body.app .notice-mgmt-table.notice-mgmt-table--admin td.col-date,
  body.app .notice-mgmt-table.notice-mgmt-table--admin td.col-action{
    white-space:nowrap;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin td.col-teacher,
  body.app .notice-mgmt-table.notice-mgmt-table--admin td.col-req,
  body.app .notice-mgmt-table.notice-mgmt-table--admin td.col-status,
  body.app .notice-mgmt-table.notice-mgmt-table--admin td.col-issued,
  body.app .notice-mgmt-table.notice-mgmt-table--admin td.col-approved-by{
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin td.col-approved-by .nod-approved-by-name{
    display:block;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin .nod-cell-stack{
    display:flex;
    flex-direction:column;
    gap:2px;
    min-width:0;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin .nod-list-sub{
    max-width:100%;
    white-space:normal;
    font-size:11px;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin .nod-list-sub--warn{
    color:#a8332c;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin .nod-list-sub--responded{
    color:#b8860b;
    font-weight:600;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin .nod-list-sub--approved{
    color:var(--success);
    font-weight:600;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin .nod-action-muted{
    font-size:12px;
  }
  body.app .notice-mgmt-table.notice-mgmt-table--admin .pill{
    display:inline-flex;
    max-width:100%;
    white-space:normal;
    text-align:center;
    line-height:1.25;
    height:auto;
    min-height:0;
    padding:4px 8px;
    font-size:11.5px;
  }
  body.app .notice-mgmt-table .col-action{
    white-space:nowrap;
  }
  body.app .notice-mgmt-table .col-action form{
    display:inline-block;
    margin-left:6px;
  }
  body.app .nod-list-sub{
    margin-top:0;
    font-size:11.5px;
    line-height:1.3;
    max-width:280px;
  }
  body.app .nod-dr-no{
    font-weight:600;
    font-variant-numeric:tabular-nums;
    letter-spacing:0.02em;
    white-space:nowrap;
  }
  body.app .notice-mgmt-table td:first-child .nod-dr-no{
    color:inherit;
  }
  body.app .notice-mgmt-response{
    max-width:280px;
    white-space:pre-wrap;
    word-break:break-word;
    font-size:13px;
    line-height:1.4;
  }
  body.app #disc-forms-modal .disc-forms-filters{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    align-items:center;
    justify-content:flex-end;
    padding:0 18px 14px;
    border-bottom:1px solid rgba(var(--primary-rgb),.1);
    background:#fff;
  }
  body.app #disc-forms-modal .disc-forms-filters .shared-drive-filter{
    margin:0;
    min-width:0;
  }
  body.app #disc-forms-modal .disc-forms-filters .shared-drive-filter-select,
  body.app #disc-forms-modal .disc-forms-filters .sy-combo-trigger{
    min-width:150px;
    max-width:220px;
  }
  body.app #disc-forms-modal .disc-forms-filters .sy-combo{
    min-width:150px;
    max-width:220px;
  }
  @media (max-width:720px){
    body.app #disc-forms-modal .disc-forms-filters .shared-drive-filter,
    body.app #disc-forms-modal .disc-forms-filters .shared-drive-filter-select{
      width:100%;
      max-width:none;
    }
  }
  body.app .disc-forms-list-wrap{
    padding:0;
    background:#fff;
  }
  body.app .disc-forms-list,
  body.app .disc-forms-file-grid{
    list-style:none;
    margin:0;
    padding:14px 16px 16px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  body.app .disc-file-card{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0;
    padding:12px 12px 12px 14px;
    border:1px solid rgba(var(--primary-rgb),.14);
    border-radius:14px;
    background:#fff;
    box-shadow:0 1px 0 rgba(8,74,80,.04);
    transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;
  }
  body.app .disc-file-card:hover{
    border-color:rgba(var(--primary-rgb),.28);
    box-shadow:0 8px 20px rgba(8,74,80,.08);
    transform:translateY(-1px);
  }
  body.app .disc-file-card.is-open{
    border-left:4px solid #ef9443;
  }
  body.app .disc-file-card.is-review{
    border-left:4px solid #c9a227;
  }
  body.app .disc-file-card.is-approved{
    border-left:4px solid #86c7a2;
  }
  body.app .disc-file-card-main{
    flex:1 1 auto;
    min-width:0;
    display:flex;
    align-items:center;
    gap:14px;
    text-decoration:none;
    color:inherit;
  }
  body.app .disc-file-ico{
    width:48px;
    height:56px;
    flex-shrink:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:#e7f2f3;
    color:var(--brand-teal-deep);
    border:1px solid rgba(var(--primary-rgb),.16);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
  }
  body.app .disc-file-card.is-open .disc-file-ico{
    background:var(--status-discrepancy-bg);
    color:var(--status-discrepancy);
    border-color:#f0d2b0;
  }
  body.app .disc-file-card.is-review .disc-file-ico{
    background:var(--status-pending-bg);
    color:var(--status-pending);
    border-color:#f0e0a8;
  }
  body.app .disc-file-card.is-approved .disc-file-ico{
    background:var(--status-completed-bg);
    color:var(--status-completed);
    border-color:#b7dfc8;
  }
  body.app .disc-file-meta{
    min-width:0;
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    gap:3px;
  }
  body.app .disc-file-name{
    font-size:15px;
    font-weight:700;
    color:var(--brand-teal-deep);
    line-height:1.25;
    word-break:break-word;
  }
  body.app .disc-file-sub,
  body.app .disc-file-dates{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
    font-size:12.5px;
    color:var(--muted);
    line-height:1.35;
  }
  body.app .disc-file-teacher{
    font-weight:600;
    color:#3f5b5f;
  }
  body.app .disc-file-dr{
    font-variant-numeric:tabular-nums;
    font-weight:600;
  }
  body.app .disc-file-sep{
    opacity:.55;
  }
  body.app .disc-file-status{
    flex-shrink:0;
    margin-left:auto;
  }
  body.app .disc-file-actions{
    display:flex;
    align-items:center;
    gap:6px;
    flex-shrink:0;
    padding-left:4px;
    border-left:1px solid rgba(var(--primary-rgb),.1);
  }
  @media (max-width:720px){
    body.app .disc-file-card{
      flex-wrap:wrap;
      align-items:stretch;
    }
    body.app .disc-file-card-main{
      width:100%;
      flex-wrap:wrap;
    }
    body.app .disc-file-status{
      margin-left:0;
    }
    body.app .disc-file-actions{
      width:100%;
      justify-content:flex-end;
      border-left:none;
      border-top:1px solid rgba(var(--primary-rgb),.1);
      padding:10px 0 0;
    }
  }
  /* Legacy stacked form cards (kept for safety) */
  body.app .disc-form-item{
    border:1px solid rgba(var(--primary-rgb),.16);
    border-radius:14px;
    padding:14px 16px;
    background:linear-gradient(180deg,#fff 0%,#f8fcfc 100%);
  }
  body.app .disc-form-item-top{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:flex-start;
    flex-wrap:wrap;
  }
  body.app .disc-form-teacher{
    display:block;
    color:var(--brand-teal-deep);
    font-size:15px;
  }
  body.app .disc-form-title{
    margin-top:4px;
    font-size:13px;
    color:var(--muted);
  }
  body.app .disc-form-body{
    margin-top:12px;
    padding:12px;
    border-radius:10px;
    background:#e8f5f6;
    font-size:14px;
    line-height:1.45;
  }
  body.app .disc-form-body p{margin:0}
  body.app .disc-form-foot{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top:12px;
  }

  body.app .shared-drive-panel{
    margin-top:0;
    min-height:320px;
  }
  body.app .shared-top-panel{
    padding:16px 18px 18px;
    margin-bottom:var(--space-section);
  }
  body.app .shared-top-head{
    display:flex;
    flex-direction:column;
    gap:2px;
    margin-bottom:12px;
  }
  body.app .shared-top-head h3{
    margin:0;
    font-size:1rem;
    color:var(--brand-teal-deep);
  }
  body.app .shared-top-head .muted{
    margin:0;
    font-size:13px;
  }
  body.app .shared-top-table td:first-child,
  body.app .shared-top-table th:first-child{
    width:40px;
    font-weight:700;
    color:var(--brand-teal-deep);
  }
  body.app .shared-drive-toolbar{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:10px;
    flex-wrap:wrap;
    padding:10px 14px;
    border-bottom:1px solid rgba(var(--primary-rgb),.1);
  }
  body.app .shared-drive-toolbar .shared-drive-search{
    flex:0 1 200px;
    min-width:140px;
    max-width:240px;
    margin:0;
  }
  body.app .shared-drive-toolbar-right{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    flex-wrap:wrap;
    margin-left:auto;
    min-width:0;
  }
  body.app .shared-drive-toolbar-right .page-period-filters,
  body.app .shared-drive-toolbar-right .page-period-filters--inline{
    margin:0;
    display:inline-flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
  }
  body.app .shared-drive-filter-form{
    margin:0;
  }
  body.app .shared-drive-filter{
    display:inline-flex;
    align-items:center;
    margin:0;
  }
  body.app .shared-drive-filter-select{
    min-width:150px;
    height:40px;
    padding:8px 36px 8px 12px;
    border-radius:10px;
    border:1.5px solid rgba(var(--primary-rgb),.22);
    background:#fff;
    color:var(--brand-teal-deep);
    font-size:13px;
    font-weight:600;
    cursor:pointer;
  }
  body.app .shared-drive-filter-select:focus{
    outline:none;
    border-color:var(--brand-teal);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12);
  }
  body.app .shared-drive-sy-input{
    cursor:text;
    padding-right:12px;
  }
  body.app .shared-drive-upload-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 16px;
    border-radius:999px;
    border:none;
    background:var(--brand-teal);
    color:#fff;
    font-weight:700;
    font-size:14px;
    cursor:pointer;
    box-shadow:0 4px 14px rgba(var(--primary-rgb),.28);
    transition:background .15s, transform .15s;
  }
  body.app .shared-drive-upload-btn:hover{
    background:var(--brand-teal-deep, #084a50);
  }
  body.app .shared-drive-upload-btn svg{display:block}
  body.app .shared-drive-hint{
    margin:0;
    font-size:13px;
    flex:1 1 220px;
  }
  body.app .shared-drive-empty{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:56px 20px;
    text-align:center;
  }
  body.app .shared-drive-empty-ico{
    width:auto;
    height:auto;
    border-radius:0;
    display:grid;
    place-items:center;
    color:var(--brand-teal);
    background:transparent;
    margin-bottom:6px;
  }
  body.app .shared-drive-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(240px, 1fr));
    gap:14px;
    padding:14px 16px 18px;
    align-items:stretch;
  }
  body.app .shared-drive-card{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:10px;
    padding:12px 12px 14px;
    border-radius:12px;
    border:1.5px solid rgba(var(--primary-rgb),.16);
    background:linear-gradient(180deg,#fff 0%,#f8fcfb 100%);
    /* One fixed card size for every file format. */
    height:268px;
    min-height:268px;
    max-height:268px;
    box-sizing:border-box;
    transition:border-color .15s, box-shadow .15s;
    /* Keep visible so the â‹¯ menu can open outside the card. */
    overflow:visible;
  }
  body.app .shared-drive-card:hover{
    border-color:var(--brand-teal);
    box-shadow:0 8px 20px rgba(var(--primary-rgb),.1);
  }
  body.app .shared-drive-card-top{
    display:flex;
    align-items:flex-start;
    gap:8px;
    flex:0 0 40px;
    height:40px;
    min-height:40px;
    max-height:40px;
  }
  body.app .shared-drive-card-title{
    flex:1 1 auto;
    min-width:0;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
    font-size:14px;
    font-weight:600;
    line-height:1.35;
    max-height:calc(1.35em * 2);
    color:var(--brand-teal-deep);
    text-decoration:none;
    word-break:break-word;
  }
  body.app .shared-drive-card-title:hover{text-decoration:underline}
  body.app .shared-drive-menu{
    position:relative;
    flex:0 0 auto;
  }
  body.app .shared-drive-dots{
    width:32px;
    height:32px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:none;
    border-radius:50%;
    background:transparent;
    color:var(--muted);
    cursor:pointer;
    padding:0;
  }
  body.app .shared-drive-dots:hover,
  body.app .shared-drive-dots[aria-expanded="true"]{
    background:rgba(var(--primary-rgb),.12);
    color:var(--brand-teal-deep);
  }
  body.app .shared-drive-menu-pop{
    position:absolute;
    top:calc(100% + 4px);
    right:0;
    z-index:40;
    min-width:220px;
    padding:8px 0;
    border-radius:10px;
    background:#fff;
    border:1px solid #e3e7ea;
    box-shadow:0 8px 28px rgba(32,33,36,.18);
  }
  body.app .shared-drive-menu-pop[hidden]{display:none !important}
  body.app .shared-drive-menu-item{
    width:100%;
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 16px;
    border:none;
    background:transparent;
    color:var(--text);
    font:inherit;
    font-size:14px;
    text-align:left;
    text-decoration:none;
    cursor:pointer;
  }
  body.app .shared-drive-menu-item:hover{
    background:#f1f3f4;
  }
  body.app .shared-drive-menu-item--danger{color:#c5221f}
  body.app .shared-drive-menu-item--danger:hover{
    background:rgba(197,34,31,.08);
  }
  body.app .shared-drive-menu-ico{
    width:20px;
    height:20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:var(--muted);
    flex:0 0 auto;
  }
  body.app .shared-drive-menu-item--danger .shared-drive-menu-ico{color:#c5221f}
  body.app .shared-drive-menu-sep{
    height:1px;
    margin:6px 0;
    background:#e8eaed;
  }
  body.app .shared-drive-menu form{margin:0}
  body.app .shared-drive-card-preview{
    display:flex;
    align-items:center;
    justify-content:center;
    flex:1 1 auto;
    min-height:0;
    height:132px;
    max-height:132px;
    border-radius:10px;
    background:rgba(var(--primary-rgb),.05);
    text-decoration:none;
    overflow:hidden;
  }
  body.app .shared-drive-card-ico{
    width:72px;
    height:72px;
    min-width:72px;
    min-height:72px;
    max-width:72px;
    max-height:72px;
    border-radius:16px;
    display:grid;
    place-items:center;
    color:var(--brand-teal);
    background:rgba(var(--primary-rgb),.12);
    position:relative;
    flex:0 0 72px;
  }
  body.app .shared-drive-card-ico.tf-file-type-ico{
    width:72px !important;
    height:72px !important;
    min-width:72px;
    min-height:72px;
  }
  body.app .shared-drive-card-ico.tf-file-type-ico svg{
    width:36px;
    height:36px;
    display:block;
  }
  body.app .shared-drive-card-meta{
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    gap:4px;
    flex:0 0 52px;
    height:52px;
    min-height:52px;
    max-height:52px;
    overflow:hidden;
  }
  body.app .shared-drive-card-meta-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    font-size:12px;
    min-height:22px;
    max-height:22px;
  }
  body.app .shared-drive-card-meta-row .muted{
    min-width:0;
    flex:1 1 auto;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    line-height:1.35;
  }
  body.app .shared-drive-access-pill{
    flex:0 0 auto;
    font-size:11px;
    padding:3px 8px;
  }
  body.app .shared-drive-card-foot{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    margin-top:2px;
  }
  body.app .shared-drive-card-foot .nod-doc-btn{
    flex:1 1 auto;
    min-width:0;
    width:auto;
  }
  body.app .shared-drive-card-dl-form{
    margin:0;
    flex:1 1 auto;
    min-width:0;
    display:flex;
  }
  body.app .shared-drive-card-dl-form .nod-doc-btn{
    width:100%;
  }
  body.app .shared-drive-card-foot .nod-doc-btn--dl,
  body.app .shared-drive-card-foot .nod-doc-btn--dl:visited{
    color:#fff !important;
  }
  /* Editor copy workspace (teacher shared files) */
  body.app .shared-edit-panel{
    padding:18px 20px 22px;
  }
  body.app .shared-edit-hero{
    display:flex;
    align-items:center;
    gap:14px;
    margin:4px 0 16px;
    padding:14px 16px;
    border-radius:14px;
    border:1.5px solid rgba(var(--primary-rgb),.18);
    background:#fff;
  }
  body.app .shared-edit-hero-text{
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:0;
  }
  body.app .shared-edit-hero-text strong{
    color:var(--brand-teal-deep);
    font-size:15px;
    word-break:break-word;
  }
  body.app .shared-edit-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:4px;
  }

  body.app .shared-info-modal{
    width:min(440px, 94vw);
    padding:0;
    overflow:hidden;
    border:1.5px solid rgba(var(--primary-rgb),.2);
    background:#fff;
    box-shadow:0 18px 40px rgba(0,107,114,.18);
  }
  body.app .shared-info-modal-head{
    padding:16px 18px 12px;
    margin:0;
    border-bottom:1px solid rgba(var(--primary-rgb),.12);
    background:#fff;
  }
  body.app .shared-info-modal-head h2{
    margin:0;
    font-size:1.05rem;
    font-weight:700;
    color:var(--brand-teal-deep);
    letter-spacing:.01em;
  }
  body.app .shared-file-info{
    padding:16px 18px 20px;
    display:flex;
    flex-direction:column;
    gap:16px;
    background:transparent;
  }
  body.app .shared-file-info-hero{
    display:flex;
    align-items:center;
    gap:14px;
    padding:14px;
    border-radius:14px;
    border:1.5px solid rgba(var(--primary-rgb),.16);
    background:#f7fbfb;
  }
  body.app .shared-file-info-ico{
    width:52px;
    height:52px;
    border-radius:12px;
    flex:0 0 auto;
    display:grid;
    place-items:center;
    color:#fff;
    background:var(--primary);
    border:1px solid rgba(13,106,114,.35);
    box-shadow:none;
  }
  body.app .shared-file-info-hero-text{
    flex:1 1 auto;
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:3px;
  }
  body.app .shared-file-info-title{
    font-size:15px;
    font-weight:700;
    color:var(--text);
    line-height:1.3;
    word-break:break-word;
  }
  body.app .shared-file-info-sub{
    font-size:12.5px;
    color:var(--muted);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .shared-file-info-hero .pill{
    flex:0 0 auto;
    font-size:11px;
    font-weight:700;
    padding:4px 10px;
    border-radius:999px;
    background:rgba(var(--primary-rgb),.18);
    color:var(--brand-teal-deep);
    border:1px solid rgba(var(--primary-rgb),.28);
  }
  body.app .shared-file-info-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
  body.app .shared-file-info-tile{
    display:flex;
    flex-direction:column;
    gap:4px;
    padding:12px 12px 11px;
    border-radius:12px;
    background:#fff;
    border:1px solid rgba(var(--primary-rgb),.14);
    min-width:0;
  }
  body.app .shared-file-info-tile--wide{
    grid-column:1 / -1;
  }
  body.app .shared-file-info-label{
    font-size:11px;
    font-weight:600;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--brand-teal-dark);
    opacity:.8;
  }
  body.app .shared-file-info-tile strong{
    font-size:13.5px;
    font-weight:600;
    color:var(--brand-teal-deep);
    word-break:break-word;
    line-height:1.35;
  }
  /* Legacy row layout fallback */
  body.app .shared-file-info-row{
    display:grid;
    grid-template-columns:110px 1fr;
    gap:10px;
    align-items:start;
    font-size:14px;
  }
  body.app .shared-file-info-row span{color:var(--muted)}
  body.app .shared-file-info-row strong{
    font-weight:600;
    color:var(--brand-teal-deep);
    word-break:break-word;
  }
  @media (max-width:480px){
    body.app .shared-file-info-grid{grid-template-columns:1fr}
    body.app .shared-file-info-hero{flex-wrap:wrap}
  }
  body.app .shared-drive-card-meta,
  body.app .shared-drive-card-owner{
    font-size:12px;
    margin-top:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .shared-drive-card-foot{
    margin-top:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    flex-wrap:wrap;
    padding-top:8px;
    border-top:1px solid #eef2f3;
  }
  body.app .shared-drive-access-form{margin:0}
  body.app .shared-drive-access{
    min-width:110px;
    padding:6px 10px;
    font-size:13px;
    height:auto;
  }
  body.app .shared-drive-actions{
    display:inline-flex;
    align-items:center;
    gap:4px;
  }
  body.app .shared-drive-action-form{margin:0;display:inline-flex}
  body.app .shared-drive-action{
    width:34px;
    height:34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    border:1px solid transparent;
    background:transparent;
    color:var(--brand-teal-deep);
    text-decoration:none;
    cursor:pointer;
    padding:0;
  }
  body.app .shared-drive-action:hover{
    background:rgba(var(--primary-rgb),.1);
    border-color:rgba(var(--primary-rgb),.18);
  }
  body.app .shared-drive-action--danger:hover{
    background:rgba(220,38,38,.1);
    border-color:rgba(220,38,38,.2);
    color:#b91c1c;
  }
  body.app #share-upload-modal .modal{
    width:min(440px, 94vw);
    max-width:94vw;
    max-height:min(90vh, 720px);
    overflow-x:hidden;
    overflow-y:auto;
    padding:18px 18px 16px;
    box-sizing:border-box;
  }
  body.app #share-upload-modal .form--register{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:visible;
  }
  body.app #share-upload-modal .field-label,
  body.app #share-upload-modal .input,
  body.app #share-upload-modal .tracked-file,
  body.app #share-upload-modal .tracked-file-openbar,
  body.app #share-upload-modal .modal-btn-row{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }
  body.app #share-upload-modal .share-teachers-list{
    max-height:160px;
    overflow:auto;
    border:1px solid rgba(var(--primary-rgb),.14);
    border-radius:10px;
    padding:8px 10px;
    background:#fff;
  }
  body.app .tracked-file{
    position:relative;
    display:block;
    width:100%;
    min-width:0;
  }
  body.app .tracked-file-input{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    opacity:0;
    cursor:pointer;
    z-index:1;
  }
  body.app .tracked-file-ui{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:36px;
    padding:0 10px;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    border-radius:10px;
    background:#fff;
    box-sizing:border-box;
  }
  body.app .tracked-file:focus-within .tracked-file-ui,
  body.app .tracked-file:focus-within .tracked-file-name-field{
    border-color:var(--brand-teal);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.14);
  }
  body.app .tracked-file-btn{
    flex-shrink:0;
    padding:5px 10px;
    border-radius:8px;
    background:var(--primary-light);
    color:var(--brand-teal-deep);
    font-size:12px;
    font-weight:700;
  }
  body.app .tracked-file-name{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:13px;
    font-weight:500;
    color:var(--muted);
  }
  body.app .tracked-file-openbar{
    display:flex;
    align-items:center;
    gap:8px;
    width:100%;
    min-width:0;
  }
  body.app .tracked-file-name-field{
    flex:1 1 auto;
    min-width:0;
    min-height:40px;
    height:40px;
    padding:0 10px;
    font-size:13px;
  }
  body.app .tracked-file-browse{
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:76px;
    height:40px;
    padding:0 12px;
    border-radius:8px;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    background:#fff;
    color:var(--brand-teal-deep);
    font-size:12.5px;
    font-weight:700;
  }
  body.app .shared-drive-access-form{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin:0;
  }
  body.app .shared-drive-access-label{
    font-size:11px;
    font-weight:700;
    color:var(--muted);
    letter-spacing:.02em;
  }
  body.app .shared-drive-access-readonly{
    font-size:13px;
    font-weight:600;
    color:var(--brand-teal-deep);
  }

  /* Discrepancy cards */
  body.app .nod-digital,
  body.app .nod-review,
  body.app .nod-form{max-width:980px;margin:0 auto;width:100%}
  body.app .nod-review-page{
    max-width:none;
    width:100%;
    margin:0;
  }
  body.app .nod-record{
    max-width:1160px;
    margin:0 auto;
    width:100%;
    display:flex;
    flex-direction:column;
    gap:16px;
  }
  body.app .nod-record-hero{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    padding:4px 2px 2px;
  }
  body.app .nod-record-title{
    margin:0;
    font-size:1.45rem;
    font-weight:700;
    color:var(--brand-teal-deep);
    line-height:1.25;
  }
  body.app .nod-record-lead{
    margin:6px 0 0;
    font-size:14px;
    color:var(--muted);
    line-height:1.45;
  }
  body.app .nod-record-dr{
    margin:8px 0 0;
    font-size:13px;
    font-weight:600;
    color:var(--text-primary);
  }
  body.app .nod-record-dr span{color:var(--brand-teal-deep)}
  body.app .nod-record-status{
    flex-shrink:0;
    font-size:12px;
    letter-spacing:.04em;
  }
  body.app .nod-record-card{
    margin:0;
    padding:18px 20px 20px;
  }
  body.app .nod-record-h{
    margin:0 0 14px;
    font-size:12px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:var(--brand-teal-deep);
  }
  body.app .nod-record-note{
    margin:-6px 0 14px;
    font-size:13px;
    color:var(--muted);
    line-height:1.45;
  }
  body.app .nod-record-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px 28px;
    margin:0;
  }
  body.app .nod-record-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.app .nod-record-grid dt{
    margin:0;
    font-size:11px;
    font-weight:700;
    letter-spacing:.03em;
    text-transform:uppercase;
    color:var(--muted);
  }
  body.app .nod-record-grid dd{
    margin:4px 0 0;
    font-size:14px;
    font-weight:600;
    color:var(--text-primary);
    overflow-wrap:anywhere;
  }
  body.app .nod-record-stack{display:flex;flex-direction:column;gap:12px}
  body.app .nod-record-field{margin:0}
  body.app .nod-record-field--block{margin:0 0 14px}
  body.app .nod-record-k{
    margin:0 0 4px;
    font-size:11px;
    font-weight:700;
    letter-spacing:.03em;
    text-transform:uppercase;
    color:var(--muted);
  }
  body.app .nod-record-v{
    margin:0;
    font-size:14px;
    line-height:1.5;
    color:#1f2937;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
  }
  body.app .nod-record-empty{font-weight:500;color:var(--muted)}
  body.app .nod-record-signbox{
    margin-top:4px;
    padding:12px 14px;
    min-height:96px;
    border:1px dashed #c5d6d8;
    border-radius:12px;
    background:#f8fbfb;
    display:flex;
    align-items:center;
  }
  body.app .nod-record-signimg{
    display:block;
    max-width:280px;
    height:auto;
    background:#fff;
    border-radius:8px;
  }
  body.app .nod-record-approve{margin:0 0 14px}
  body.app .nod-record-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    justify-content:flex-end;
    padding:0 0 4px;
  }
  @media (max-width:800px){
    body.app .nod-record-grid,
    body.app .nod-record-grid--2{grid-template-columns:1fr}
    body.app .nod-record-hero{flex-direction:column}
    body.app .nod-record-actions{justify-content:stretch}
    body.app .nod-record-actions .btn{flex:1 1 auto;justify-content:center}
  }
  body.app .nod-review{display:flex;flex-direction:column;gap:14px}
  body.app .nod-review-card{margin:0;padding:16px 18px 18px}
  body.app .nod-review-card .panel-head{margin:0}
  body.app .nod-review-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
  body.app .nod-review-kicker{margin:0 0 4px;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
  body.app .nod-review-title{margin:0;font-size:1.25rem;color:var(--brand-teal-deep)}
  body.app .nod-review-kind{margin:0 0 6px;font-size:11px;font-weight:700;color:var(--muted);letter-spacing:.04em;text-transform:uppercase}
  body.app .nod-review-label{margin:0 0 4px;font-size:12px;font-weight:700;color:var(--muted)}
  body.app .nod-review-field{margin-top:12px}
  body.app .nod-review-value{font-size:14px;line-height:1.5;color:#1f2937;white-space:pre-wrap;overflow-wrap:anywhere}
  body.app .nod-review-subhead{margin-top:16px}
  body.app .nod-review-table-wrap{padding:0;overflow-x:auto}
  body.app .nod-review-table th,
  body.app .nod-review-table td{padding:8px 10px;vertical-align:top}
  body.app .nod-form--review{
    max-width:none;
    width:100%;
    margin:0;
  }
  body.app .nod-review-page{
    max-width:none;
    width:100%;
    margin:0;
    padding-bottom:24px;
  }
  body.app .nod-form-sheet{
    margin:0;
    padding:0;
    border:1px solid rgba(var(--primary-rgb),.14);
    border-radius:18px;
    background:#fff;
    box-shadow:0 10px 28px rgba(8,74,80,.06);
    overflow:hidden;
  }
  body.app .nod-form-hero{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    padding:22px 24px 20px;
    background:
      linear-gradient(180deg, rgba(var(--primary-rgb),.07) 0%, rgba(255,255,255,0) 100%),
      #fff;
    border-bottom:1px solid rgba(var(--primary-rgb),.10);
  }
  body.app .nod-form-hero--compact{
    align-items:center;
    gap:12px;
    padding:12px 16px;
  }
  body.app .nod-form-hero-lead{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
    flex:1 1 auto;
  }
  body.app .nod-form-hero-copy{min-width:0;flex:1 1 auto}
  body.app .nod-form-kicker{
    margin:0 0 6px;
    font-size:11px;
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--muted);
  }
  body.app .nod-form-hero--compact .nod-form-kicker{margin:0 0 2px}
  body.app .nod-form-title{
    margin:0;
    font-size:1.55rem;
    font-weight:750;
    color:var(--brand-teal-deep);
    line-height:1.2;
    letter-spacing:-.02em;
  }
  body.app .nod-form-hero--compact .nod-form-title{
    font-size:1.2rem;
  }
  body.app .nod-form-drline{
    margin:4px 0 0;
    font-size:13px;
    font-weight:600;
    color:var(--text-primary);
  }
  body.app .nod-form-sub{margin:6px 0 0;font-size:13px;color:var(--text-primary)}
  body.app .nod-form-sub strong{color:var(--brand-teal-deep)}
  body.app .nod-form-chips{
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:14px 0 0;
    padding:0;
  }
  body.app .nod-form-chips li{
    display:inline-flex;
    align-items:baseline;
    gap:6px;
    max-width:100%;
    padding:7px 11px;
    border:1px solid rgba(var(--primary-rgb),.14);
    border-radius:999px;
    background:rgba(255,255,255,.88);
    font-size:13px;
    font-weight:600;
    color:var(--text-primary);
    line-height:1.3;
  }
  body.app .nod-form-chips--wide{
    border-radius:12px;
    flex:1 1 100%;
  }
  body.app .nod-form-chip-k{
    font-size:11px;
    font-weight:700;
    letter-spacing:.03em;
    text-transform:uppercase;
    color:var(--muted);
  }
  body.app .nod-form-section{
    padding:20px 24px;
    border-bottom:1px solid rgba(var(--primary-rgb),.08);
  }
  body.app .nod-form-section--last{
    border-bottom:0;
    padding-bottom:24px;
  }
  body.app .nod-form-section--admin{
    background:linear-gradient(180deg, rgba(var(--primary-rgb),.035) 0%, #fff 48%);
  }
  body.app .nod-form-section-head{margin:0 0 14px}
  body.app .nod-form-h{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0;
    font-size:15px;
    font-weight:750;
    color:var(--brand-teal-deep);
    letter-spacing:.01em;
  }
  body.app .nod-form-h span{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:24px;
    height:24px;
    border-radius:50%;
    background:var(--brand-teal-deep);
    color:#fff;
    font-size:11px;
    font-weight:700;
    flex:0 0 auto;
  }
  body.app .nod-form-hint{
    margin:6px 0 0;
    font-size:13px;
    color:var(--muted);
    line-height:1.45;
  }
  body.app .nod-form-empty{
    margin:0;
    padding:14px 16px;
    border:1px dashed rgba(var(--primary-rgb),.22);
    border-radius:12px;
    background:#f8fbfb;
    color:var(--muted);
    font-size:13.5px;
    line-height:1.45;
  }
  body.app .nod-form-item-k{
    margin:0 0 10px;
    font-size:11px;
    font-weight:700;
    color:var(--muted);
    text-transform:uppercase;
    letter-spacing:.04em;
  }
  body.app .nod-form-detail-list{
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  body.app .nod-form-detail-card,
  body.app .nod-form-plan{
    margin:0;
    padding:16px 16px 14px;
    border:1px solid rgba(var(--primary-rgb),.12);
    border-radius:14px;
    background:#f8fcfc;
  }
  body.app .nod-form-prose{display:flex;flex-direction:column;gap:6px;margin:0 0 12px}
  body.app .nod-form-prose:last-child{margin-bottom:0}
  body.app .nod-form-prose-body{
    margin:0;
    font-size:14px;
    font-weight:500;
    color:#1f2937;
    line-height:1.55;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
  }
  body.app .nod-form-prose-body--boxed{
    min-height:72px;
    padding:12px 14px;
    border:1px solid #d7e4e6;
    border-radius:12px;
    background:#fff;
  }
  body.app .nod-form-fact{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin:0 0 12px;
  }
  body.app .nod-form-fact:last-child{margin-bottom:0}
  body.app .nod-form-fact-v{
    font-size:14px;
    font-weight:650;
    color:var(--text-primary);
    overflow-wrap:anywhere;
  }
  body.app .nod-form-facts{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px 18px;
    margin:0;
    min-width:0;
  }
  body.app .nod-form-facts dt{
    margin:0;
    font-size:11px;
    font-weight:700;
    letter-spacing:.03em;
    text-transform:uppercase;
    color:var(--muted);
  }
  body.app .nod-form-facts dd{
    margin:4px 0 0;
    font-size:14px;
    font-weight:650;
    color:var(--text-primary);
    overflow-wrap:anywhere;
  }
  body.app .nod-form-split{
    display:grid;
    grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
    gap:16px 20px;
    align-items:start;
  }
  body.app .nod-form-split--response{
    grid-template-columns:minmax(0,1.35fr) minmax(180px,.75fr);
  }
  body.app .nod-form-sign-panel{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0;
  }
  body.app .nod-form-body--compact{
    display:flex;
    flex-direction:column;
    gap:12px;
    padding:12px 14px 16px;
  }
  body.app .nod-form-acc{
    margin:0;
    border:1px solid rgba(var(--primary-rgb),.12);
    border-radius:14px;
    background:#fff;
    overflow:hidden;
  }
  body.app .nod-form-acc--admin{
    background:#fff;
  }
  body.app .nod-form-acc-pair{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:12px;
    align-items:start;
  }
  body.app .nod-form-acc-pair > .nod-form-acc{
    min-width:0;
    height:100%;
  }
  body.app .nod-form-acc-sum{
    list-style:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:12px 14px;
    user-select:none;
    background:var(--button);
    background-color:#0d6a72;
    color:#fff;
  }
  body.app .nod-form-acc-sum::-webkit-details-marker{display:none}
  body.app .nod-form-acc-sum .nod-form-h{
    min-width:0;
    flex:1 1 auto;
    font-size:14px;
    font-weight:700;
    color:#fff;
  }
  body.app .nod-form-acc-sum .nod-form-h span{
    width:28px;
    height:22px;
    border-radius:8px;
    font-size:11px;
    background:rgba(255,255,255,.16);
    color:#fff;
  }
  body.app .nod-form-acc-ico{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:28px;
    height:28px;
    flex:0 0 auto;
    color:#fff;
    border-radius:8px;
    background:rgba(255,255,255,.14);
    transition:transform .18s ease, background .18s ease;
  }
  body.app .nod-form-acc-ico svg{
    width:16px;
    height:16px;
    display:block;
  }
  body.app .nod-form-acc[open] > .nod-form-acc-sum .nod-form-acc-ico{
    transform:rotate(90deg);
    background:rgba(255,255,255,.22);
  }
  body.app .nod-form-acc-body{
    padding:14px 14px 16px;
  }
  body.app .nod-form-hero-status{
    flex:0 0 auto;
    display:flex;
    align-items:center;
  }
  body.app .nod-status-chip{
    display:inline-flex;
    align-items:center;
    min-height:30px;
    padding:6px 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:800;
    letter-spacing:.02em;
    line-height:1;
    white-space:nowrap;
  }
  body.app .nod-status-chip.pill-purple,
  body.app .nod-status-chip.pill-review{
    background:var(--status-pending-bg);
    color:var(--status-pending);
    border:1px solid #f0e0a8;
  }
  body.app .pill.pill-review{
    background:var(--status-pending-bg);
    color:var(--status-pending);
    border:1px solid #f0e0a8;
  }
  body.app .nod-status-chip.pill-ok{
    background:var(--status-completed-bg);
    color:var(--status-completed);
    border:1px solid #b7dfc8;
  }
  body.app .nod-status-chip.pill-disapproved{
    background:var(--status-disapproved-bg);
    color:var(--status-disapproved);
    border:1px solid #f0c7c3;
  }
  body.app .nod-status-chip.pill-discrepancy,
  body.app .nod-status-chip.pill-overdue{
    background:var(--status-overdue-bg);
    color:var(--status-overdue);
    border:1px solid #f0c7c3;
  }
  body.app .nod-form-meta-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px 12px;
    margin:0 0 10px;
  }
  body.app .nod-form-meta-grid dt{
    margin:0;
    font-size:11px;
    font-weight:700;
    letter-spacing:.03em;
    text-transform:uppercase;
    color:var(--muted);
  }
  body.app .nod-form-meta-grid dd{
    margin:2px 0 0;
    font-size:13px;
    font-weight:650;
    color:var(--text-primary);
  }
  body.app .nod-form-info-card{
    margin:0;
    padding:10px 12px;
    border:1px solid rgba(var(--primary-rgb),.10);
    border-radius:12px;
    background:#fbfdfe;
  }
  body.app .nod-form-info-card--followup{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px 16px;
  }
  body.app .nod-form-info-card--followup .nod-form-label{margin:0}
  body.app .nod-form-split--compact,
  body.app .nod-form-split--admin-fields{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:10px 14px;
    align-items:start;
  }
  body.app .nod-form-split--response{
    align-items:stretch;
  }
  body.app .nod-admin-stack{
    gap:12px;
  }
  body.app .nod-admin-combined{gap:12px}
  body.app .nod-actions-split{
    align-items:stretch;
  }
  body.app .nod-actions-split > .nod-iap-field{
    height:100%;
  }
  body.app .nod-actions-split .nod-dd-area,
  body.app .nod-actions-split textarea.nod-dd-area{
    flex:1 1 auto;
    min-height:108px;
    height:100%;
    align-self:stretch;
    align-items:flex-start;
    resize:none;
  }
  body.app .nod-admin-action-checks{
    display:flex;
    flex-direction:column;
    gap:8px;
    margin-top:2px;
    flex:1 1 auto;
  }
  body.app .nod-admin-action-checks .nod-form-check{
    margin:0;
    flex:1 1 auto;
    align-items:center;
  }
  body.app .nod-admin-approved-panel{
    display:flex;
    flex-direction:column;
    gap:14px;
    width:100%;
  }
  body.app .nod-admin-approved-panel .nod-form-info-card--sign{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:100%;
    min-height:168px;
    padding:28px 24px 22px;
    text-align:center;
    border:1px solid rgba(var(--primary-rgb),.14);
    border-radius:14px;
    background:#fff;
    box-sizing:border-box;
  }
  body.app .nod-admin-approved-panel .nod-form-info-card--sign .nod-form-empty{
    margin:0;
    width:100%;
    text-align:center;
    color:var(--muted);
    font-size:13px;
    font-weight:600;
  }
  body.app .nod-admin-approved-panel .nod-admin-sign-who{
    margin-top:4px;
    flex:0 0 auto;
    width:100%;
  }
  body.app .nod-admin-approved-panel .nod-admin-sign-foot--date-only{
    margin-top:0;
    padding-top:14px;
    border-top:1px solid rgba(var(--primary-rgb),.10);
  }
  body.app .nod-admin-sign-foot{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px 24px;
    margin-top:4px;
    flex-wrap:wrap;
  }
  body.app .nod-admin-sign-foot--date-only{
    justify-content:flex-end;
    margin-top:12px;
  }
  body.app .nod-admin-sign-who{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    flex:1 1 200px;
    min-width:0;
  }
  body.app .nod-admin-date-completed{
    max-width:260px;
    width:100%;
    margin:0 0 0 auto;
    flex:0 1 260px;
  }
  body.app .nod-iap-control--date{
    position:relative;
    flex-direction:row-reverse;
    justify-content:flex-start;
    gap:10px;
    padding:10px 12px;
  }
  body.app .nod-iap-control--date .nod-iap-ico{
    order:0;
  }
  body.app .nod-iap-control--date .nod-iap-input,
  body.app .nod-iap-control--date .nod-iap-text{
    order:1;
    flex:1 1 auto;
    text-align:left;
  }
  body.app .nod-iap-control--date .nod-iap-input[type="date"]{
    position:relative;
    z-index:1;
    min-width:0;
    color-scheme:light;
  }
  body.app .nod-iap-control--date .nod-iap-input[type="date"]::-webkit-calendar-picker-indicator{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    opacity:0;
    cursor:pointer;
  }
  body.app .nod-admin-stack .nod-tr-control{
    width:100%;
    box-sizing:border-box;
    min-height:42px;
    padding:10px 12px;
    border:1px solid #d7e4e6;
    border-radius:10px;
    background:#fff;
    font-size:14px;
    font-weight:500;
    color:var(--text-primary);
  }
  body.app .nod-iap-body{
    background:#f7fafb;
  }
  body.app .nod-iap,
  body.app .nod-dd{
    display:flex;
    flex-direction:column;
    gap:12px;
    min-width:0;
  }
  body.app .nod-iap--tidy{
    gap:14px;
  }
  body.app .nod-iap-plan,
  body.app .nod-dd-item{margin:0}
  body.app .nod-iap-meta,
  body.app .nod-dd-split{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:12px 16px;
    align-items:stretch;
  }
  body.app .nod-iap-field{
    display:flex;
    flex-direction:column;
    gap:6px;
    margin:0;
    min-width:0;
  }
  body.app .nod-iap-control,
  body.app input.nod-iap-control,
  body.app textarea.nod-iap-control{
    display:flex;
    align-items:center;
    width:100%;
    box-sizing:border-box;
    min-height:46px;
    padding:10px 12px;
    border:1px solid #d7e4e6;
    border-radius:12px;
    background:#fff;
    color:var(--text-primary);
    font-size:14px;
    font-weight:600;
    line-height:1.4;
    outline:none;
    transition:border-color .15s ease, box-shadow .15s ease;
  }
  body.app .nod-form--review input.nod-iap-control:focus,
  body.app .nod-form--review textarea.nod-iap-control:focus,
  body.app .nod-form--review input.nod-iap-input:focus,
  body.app .nod-form--review .nod-iap-control--ico:focus-within,
  body.app .nod-form--review-compact input.input:focus,
  body.app .nod-form--review-compact textarea.input:focus,
  body.app .nod-form--review-compact .nod-tr-control:focus,
  body.app .nod-admin-stack .nod-tr-control:focus{
    border-color:var(--brand-teal-deep, #084a50);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.18);
    background:#fff;
    outline:none;
  }
  body.app .nod-iap-control--area,
  body.app textarea.nod-iap-control--area{
    display:block;
    min-height:110px;
    height:110px;
    resize:vertical;
    white-space:pre-wrap;
    overflow-wrap:anywhere;
    font-weight:500;
    align-items:stretch;
  }
  body.app .nod-iap-control--plan{
    min-height:72px;
    height:auto;
    max-height:160px;
    overflow:auto;
  }
  body.app .nod-dd-area,
  body.app textarea.nod-dd-area{
    min-height:78px;
    height:78px;
  }
  body.app .nod-doc-empty{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:120px;
    padding:22px 18px;
    border:1.5px dashed #c9d7da;
    border-radius:14px;
    background:#fff;
    text-align:center;
  }
  body.app .nod-doc-empty-ico{
    width:36px;
    height:36px;
    border-radius:10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:var(--brand-teal-deep);
    background:rgba(var(--primary-rgb),.08);
    margin-bottom:2px;
  }
  body.app .nod-doc-empty-ico svg{
    width:20px;
    height:20px;
    display:block;
  }
  body.app .nod-doc-empty-title{
    margin:0;
    font-size:14px;
    font-weight:750;
    color:var(--active-color);
  }
  body.app .nod-doc-empty-text{
    margin:0;
    max-width:34em;
    font-size:13px;
    font-weight:500;
    line-height:1.4;
    color:var(--muted);
  }
  body.app .nod-teacher-doc-empty{
    gap:10px;
    padding:28px 20px;
  }
  body.app .nod-teacher-doc-upload{
    margin-top:6px;
  }
  body.app .nod-teacher-doc-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:42px;
    padding:0 16px;
    cursor:pointer;
    margin:0;
  }
  body.app .nod-teacher-doc-btn-ico,
  body.app .nod-teacher-doc-btn-ico svg{
    width:18px;
    height:18px;
    display:inline-flex;
  }
  body.app .nod-teacher-doc-hint{
    margin:0;
    font-size:12px;
    font-weight:500;
    color:var(--muted);
  }
  body.app .nod-doc-btn--replace{
    cursor:pointer;
  }
  body.app .nod-teacher-doc-replace{
    margin:0;
  }
  body.app .nod-iap-control--ico{
    gap:10px;
    padding-left:12px;
  }
  body.app .nod-iap-ico{
    flex:0 0 auto;
    width:18px;
    height:18px;
    color:var(--brand-teal-deep);
    display:inline-flex;
  }
  body.app .nod-iap-ico svg{
    width:18px;
    height:18px;
    display:block;
  }
  body.app .nod-iap-input{
    flex:1 1 auto;
    min-width:0;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    padding:0 !important;
    min-height:0 !important;
    font:inherit;
    font-weight:600;
    color:inherit;
    outline:none;
  }
  body.app .nod-iap-input:focus{
    border:0 !important;
    box-shadow:none !important;
    outline:none;
  }
  body.app .nod-iap-text{
    min-width:0;
    overflow-wrap:anywhere;
  }
  body.app .nod-iap-sign{
    display:flex;
    flex-direction:column;
    gap:8px;
  }
  body.app .nod-iap-sign-panel{
    display:grid;
    grid-template-columns:minmax(120px,.9fr) minmax(0,1.3fr) minmax(120px,.85fr);
    align-items:stretch;
    gap:0 12px;
    min-height:80px;
    padding:12px;
    border:1px solid #d7e4e6;
    border-radius:14px;
    background:#eef4f5;
  }
  body.app .nod-iap-sign-ink{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:64px;
    height:100%;
    padding:8px 10px;
    border:1px solid #d7e4e6;
    border-radius:10px;
    background:#fff;
    box-sizing:border-box;
  }
  body.app .nod-iap-sigimg{
    display:block;
    max-width:100%;
    max-height:52px;
    width:auto;
    height:auto;
    object-fit:contain;
    border:0 !important;
    background:transparent !important;
    box-shadow:none;
  }
  body.app .nod-iap-sign-divider{display:none}
  body.app .nod-iap-sign-who{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    min-width:0;
    padding:4px 0;
  }
  body.app .nod-iap-sign-name{
    margin:0;
    font-size:13px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    text-align:center;
    color:var(--brand-teal-deep);
    overflow-wrap:anywhere;
  }
  body.app .nod-iap-sign-role{
    margin:3px 0 0;
    font-size:12px;
    font-weight:600;
    text-align:center;
    color:var(--muted);
  }
  body.app .nod-iap-sign-date{
    margin:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    min-height:64px;
    height:100%;
    padding:8px 10px;
    border:1px solid #d7e4e6;
    border-radius:10px;
    background:#fff;
    box-sizing:border-box;
    font-size:13px;
    font-weight:700;
    color:var(--brand-teal-deep);
    white-space:nowrap;
  }
  body.app .nod-form-fields--details{
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  body.app .nod-form-field--responsible,
  body.app .nod-form-field--meta{
    display:flex;
    flex-direction:column;
    gap:6px;
    margin-top:0;
    min-width:0;
  }
  body.app .nod-form-plan-meta{
    margin-top:10px;
  }
  body.app .nod-form-plan-meta .nod-form-control-equal,
  body.app .nod-form-plan-meta .nod-form-prose-body--boxed{
    width:100%;
    min-height:42px;
    box-sizing:border-box;
  }
  body.app .nod-form-signbox--empty{
    display:flex;
    align-items:center;
    justify-content:center;
  }
  body.app .nod-form-split--equal{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:12px 14px;
    align-items:stretch;
  }
  body.app .nod-form-split--equal > .nod-form-field{
    display:flex;
    flex-direction:column;
    min-width:0;
    height:100%;
  }
  body.app .nod-form-col{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0;
  }
  body.app .nod-form-field{margin:0 0 8px}
  body.app .nod-form--review-compact .nod-form-field{margin:0}
  body.app .nod-form-field--full{width:100%}
  body.app .nod-form--review-compact .nod-form-control-equal,
  body.app .nod-form--review-compact input.nod-form-control-equal,
  body.app .nod-form--review-compact textarea.nod-form-control-equal{
    width:100%;
    box-sizing:border-box;
    min-height:42px;
    padding:10px 12px;
    border:1px solid #d7e4e6;
    border-radius:10px;
    background:#fff;
    font-size:14px;
    font-weight:500;
    color:var(--text-primary);
    line-height:1.4;
  }
  body.app .nod-form--review-compact textarea.nod-form-control-equal{
    min-height:110px;
    height:110px;
    resize:vertical;
    flex:1 1 auto;
  }
  body.app .nod-form-textarea--compact{
    min-height:72px;
    resize:vertical;
  }
  body.app .nod-form-prose-body--compact{
    font-size:13px;
    line-height:1.4;
    max-height:7.5em;
    overflow:auto;
  }
  body.app .nod-form-facts--inline{
    display:grid;
    grid-template-columns:1fr;
    gap:6px;
    margin:8px 0 0;
  }
  body.app .nod-form-facts--inline dt{
    margin:0;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.03em;
    color:var(--muted);
  }
  body.app .nod-form-facts--inline dd{
    margin:1px 0 0;
    font-size:13px;
    font-weight:650;
    color:var(--text-primary);
  }
  body.app .nod-form-info-card--sign .nod-form-signbox,
  body.app .nod-form-info-card--sign .nod-form-signbox--compact{
    min-height:0;
    flex:0 1 auto;
    width:100%;
    max-width:420px;
    padding:0;
    margin:0 auto;
    border:0;
    border-radius:0;
    background:transparent;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  body.app .nod-form-info-card--sign .nod-digital-sigimg{
    max-height:88px;
    width:auto;
    max-width:100%;
    margin:0 auto;
  }
  body.app .nod-form-doc-list,
  body.app .nod-doc-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  body.app .nod-form-doc-card,
  body.app .nod-form-doc-card--compact{
    margin:0;
    padding:10px 12px;
    border:1px solid rgba(var(--primary-rgb),.12);
    border-radius:12px;
    background:#fbfdfe;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  body.app .nod-doc-card{
    margin:0;
    padding:14px 16px;
    border:1px solid #d7e4e6;
    border-radius:14px;
    background:#fff;
    display:grid;
    grid-template-columns:64px minmax(0,1fr) auto;
    gap:14px 16px;
    align-items:center;
  }
  body.app .nod-doc-type.tf-file-type-ico{
    width:64px;
    height:64px;
    border-radius:14px;
    border:0;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    flex:0 0 64px;
  }
  body.app .nod-doc-type.tf-file-type-ico svg{
    width:32px;
    height:32px;
    display:block;
  }
  body.app .nod-doc-type .tf-file-type-badge{
    bottom:6px;
    min-width:30px;
    font-size:9px;
  }
  body.app .nod-doc-main{min-width:0}
  body.app .nod-doc-title{
    margin:0 0 8px;
    font-size:15px;
    font-weight:750;
    color:var(--active-color);
    overflow-wrap:anywhere;
  }
  body.app .nod-doc-meta-rows{
    display:flex;
    flex-direction:column;
    gap:3px;
  }
  body.app .nod-doc-meta-rows .muted{
    margin:0;
    font-size:12.5px;
    font-weight:500;
    line-height:1.4;
  }
  body.app .nod-doc-actions{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
  }
  body.app .nod-doc-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    box-sizing:border-box;
    min-width:124px;
    width:124px;
    height:40px;
    min-height:40px;
    padding:0 14px;
    border-radius:10px;
    font-size:14px;
    font-weight:700;
    line-height:1;
    text-decoration:none;
    white-space:nowrap;
  }
  body.app .nod-doc-btn-ico{
    width:18px;
    height:18px;
    display:inline-flex;
    flex:0 0 18px;
  }
  body.app .nod-doc-btn-ico svg{
    width:18px;
    height:18px;
    display:block;
  }
  body.app .nod-doc-btn--view{
    border:1.5px solid var(--brand-teal);
    background:#fff;
    color:var(--brand-teal-deep) !important;
  }
  body.app .nod-doc-btn--view:hover{
    background:rgba(var(--primary-rgb),.06);
    color:var(--brand-teal-deep) !important;
  }
  body.app .nod-doc-btn--dl,
  body.app .nod-doc-btn--dl:visited{
    border:1.5px solid var(--brand-teal);
    background:var(--brand-teal);
    color:#fff !important;
  }
  body.app .nod-doc-btn--dl .nod-doc-btn-ico,
  body.app .nod-doc-btn--dl svg{
    color:#fff !important;
  }
  body.app .nod-doc-btn--dl:hover{
    background:var(--brand-teal-deep);
    border-color:var(--brand-teal-deep);
    color:#fff !important;
  }
  body.app .nod-doc-btn--replace{
    min-width:124px;
    width:124px;
    border:1.5px solid #d7e4e6;
    background:#fff;
    color:var(--brand-teal-deep);
  }
  body.app .nod-form-doc-title{
    margin:0;
    font-size:14px;
    font-weight:700;
    color:var(--text-primary);
  }
  body.app .nod-form-doc-meta{
    margin:3px 0 0;
    font-size:12px;
    color:var(--muted);
    display:flex;
    flex-wrap:wrap;
    gap:6px;
  }
  body.app .nod-form-doc-actions{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }
  @media (max-width:700px){
    body.app .nod-doc-card{
      grid-template-columns:64px minmax(0,1fr);
    }
    body.app .nod-doc-actions{
      grid-column:1 / -1;
      justify-content:stretch;
    }
    body.app .nod-doc-btn{
      flex:1 1 auto;
      width:auto;
      min-width:0;
      justify-content:center;
    }
  }
  body.app .nod-form-actions-checks--inline{
    display:flex;
    flex-wrap:wrap;
    gap:10px 16px;
    align-items:center;
  }
  body.app .nod-form-check--esign{margin:6px 0 8px}
  body.app .nod-admin-approve{
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  body.app .nod-admin-toggle-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:52px;
    padding:12px 14px;
    border:1px solid #d7e4e6;
    border-radius:12px;
    background:#fff;
  }
  body.app .nod-admin-toggle-label{
    font-size:14px;
    font-weight:700;
    color:var(--active-color);
  }
  body.app .nod-admin-toggle-controls{
    display:inline-flex;
    align-items:center;
    gap:10px;
    flex:0 0 auto;
  }
  body.app .nod-admin-switch{
    position:relative;
    display:inline-flex;
    width:46px;
    height:26px;
    margin:0;
    cursor:pointer;
  }
  body.app .nod-admin-switch input{
    position:absolute;
    opacity:0;
    width:1px;
    height:1px;
    overflow:hidden;
  }
  body.app .nod-admin-switch-ui{
    width:46px;
    height:26px;
    border-radius:999px;
    background:#c9d7da;
    border:1px solid #b7c8cb;
    position:relative;
    transition:background .18s ease, border-color .18s ease;
  }
  body.app .nod-admin-switch-ui::after{
    content:"";
    position:absolute;
    top:2px;
    left:2px;
    width:20px;
    height:20px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 1px 3px rgba(8,74,80,.18);
    transition:transform .18s ease;
  }
  body.app .nod-admin-switch input:checked + .nod-admin-switch-ui{
    background:var(--brand-teal-deep);
    border-color:var(--brand-teal-deep);
  }
  body.app .nod-admin-switch input:checked + .nod-admin-switch-ui::after{
    transform:translateX(20px);
  }
  body.app .nod-admin-info{
    width:22px;
    height:22px;
    color:#8aa0a4;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  body.app .nod-admin-info svg{
    width:18px;
    height:18px;
    display:block;
  }
  body.app .nod-admin-esign-fields{
    display:flex;
    flex-direction:column;
    gap:8px;
    margin-bottom:8px;
  }
  body.app .nod-admin-esign-fields[hidden]{
    display:none !important;
  }
  body.app .nod-admin-esign-terms{
    margin:0;
    padding:10px 12px;
    border:1px solid #d7e4e6;
    border-radius:12px;
    background:#fff;
    font-size:12.5px;
    line-height:1.4;
    max-height:none;
    overflow:visible;
  }
  body.app .nod-admin-esign-terms .nod-rx-terms-title{
    margin:0 0 6px;
    font-size:13px;
    font-weight:800;
    color:var(--brand-teal-deep);
  }
  body.app .nod-admin-esign-terms .nod-rx-terms-intro{margin:0 0 6px}
  body.app .nod-admin-esign-terms .nod-rx-terms-list{margin:0;padding-left:1.2em}
  body.app .nod-digital-pad--compact{height:96px}
  body.app .nod-form--review-compact .nod-form-empty{margin:0;font-size:13px}
  body.app .nod-form--review-compact .nod-form-aside{margin:6px 0 0;font-size:12px}
  body.app .nod-form--review-compact .nod-form-hint{margin:0 0 6px;font-size:12px}
  body.app .nod-dd-split > .nod-iap-field{
    height:100%;
  }
  body.app .nod-dd-split .nod-dd-area{
    flex:1 1 auto;
  }
  @media (max-width:900px){
    body.app .nod-form-acc-pair,
    body.app .nod-iap-meta,
    body.app .nod-dd-split{grid-template-columns:1fr}
    body.app .nod-iap-sign-panel{
      grid-template-columns:1fr;
      gap:12px;
    }
    body.app .nod-iap-sign-divider{display:none}
    body.app .nod-iap-sign-ink,
    body.app .nod-iap-sign-date{
      min-height:56px;
      height:auto;
    }
  }
  @media (max-width:800px){
    body.app .nod-form-meta-grid,
    body.app .nod-form-split--compact,
    body.app .nod-form-split--admin-fields,
    body.app .nod-form-split--equal{grid-template-columns:1fr}
    body.app .nod-form--review-compact textarea.nod-form-control-equal{
      height:96px;
      min-height:96px;
    }
  }
  body.app .nod-form-sign-name{
    margin:4px 0 0;
    font-size:14px;
    font-weight:800;
    letter-spacing:.04em;
    text-align:center;
    color:var(--active-color);
    text-transform:uppercase;
  }
  body.app .nod-form-sign-date-inline{
    font-weight:500;
    letter-spacing:0;
    text-transform:none;
    color:var(--text-primary);
  }
  body.app .nod-form-sign-role{
    margin:0;
    font-size:12px;
    font-weight:600;
    text-align:center;
    color:var(--muted);
  }
  body.app .nod-form-aside{
    margin:10px 0 0;
    font-size:13px;
    font-weight:600;
    color:var(--text-primary);
    line-height:1.4;
  }
  body.app .nod-form-aside--meta{
    margin:0 0 6px;
    color:var(--muted);
    font-weight:600;
  }
  body.app .nod-form-facts--compact{
    grid-template-columns:1fr;
  }
  body.app .nod-form-approve-block{
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid rgba(var(--primary-rgb),.10);
  }
  body.app .nod-form-response-main{min-width:0}
  body.app .nod-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
  body.app .nod-form-field{display:flex;flex-direction:column;gap:6px;margin:0 0 12px;min-width:0}
  body.app .nod-form-grid > .nod-form-field{margin:0}
  body.app .nod-form-field--wide{grid-column:1 / -1}
  body.app .nod-form-label{font-size:12px;font-weight:700;color:var(--muted)}
  body.app .nod-form-control{
    min-height:42px;padding:10px 12px;border:1px solid #d7e4e6;border-radius:10px;
    background:#f7fbfb;font-size:14px;font-weight:600;color:var(--text-primary);line-height:1.45;
    overflow-wrap:anywhere;
  }
  body.app .nod-form-control--strong{color:var(--brand-teal-deep)}
  body.app .nod-form-control--area{min-height:72px;font-weight:500;white-space:pre-wrap}
  body.app .nod-form-signbox{
    min-height:112px;
    padding:14px 16px;
    border:1px dashed #c5d6d8;
    border-radius:14px;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  body.app .nod-form-admin-grid{
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(220px,.75fr);
    gap:16px 20px;
    align-items:start;
  }
  body.app .nod-form-admin-side{
    display:flex;
    flex-direction:column;
    gap:14px;
    padding:14px;
    border:1px solid rgba(var(--primary-rgb),.12);
    border-radius:14px;
    background:#fff;
  }
  body.app .nod-form-actions{
    display:grid;grid-template-columns:minmax(220px,.9fr) minmax(0,1.2fr);gap:16px 20px;align-items:start;
  }
  body.app .nod-form-actions-checks{display:flex;flex-direction:column;gap:8px}
  body.app .nod-form-check{
    display:flex;align-items:flex-start;gap:10px;margin:0;padding:11px 12px;
    border:1px solid #d7e4e6;border-radius:12px;background:#f7fbfb;
    font-size:13.5px;font-weight:600;color:var(--brand-teal-deep);cursor:pointer;
    transition:border-color .15s ease, background .15s ease;
  }
  body.app .nod-form-check:hover{
    border-color:rgba(var(--primary-rgb),.35);
    background:#eef7f7;
  }
  body.app .nod-form-check input{margin-top:3px;accent-color:var(--brand-teal-deep)}
  body.app .nod-form-check--readonly{cursor:default;opacity:.95}
  body.app .nod-form-textarea{
    min-height:108px;resize:vertical;width:100%;
    border-radius:12px;
  }
  body.app .nod-form-actions-comments{margin:0}
  body.app .nod-form--review .nod-form-admin-grid > .nod-form-field--wide{grid-column:1 / -1}
  body.app .nod-review-back svg{
    width:20px;
    height:20px;
    display:block;
  }
  body.app .nod-review-actions,
  body.app .nod-review-actions--sheet{
    z-index:1;
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
    justify-content:flex-end;
    margin:0;
    max-width:none;
    width:100%;
    padding:14px 16px 16px;
    border:0;
    border-top:1px solid rgba(var(--primary-rgb),.10);
    border-radius:0;
    background:#fff;
    box-shadow:none;
    position:static;
  }
  body.app .nod-review-actions .btn{
    min-width:132px;
    height:42px;
    padding:0 16px;
    box-sizing:border-box;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:14px;
    font-weight:700;
    line-height:1;
  }
  body.app .nod-review-actions .btn:active:not(:disabled):not(.is-disabled),
  body.app .nod-review-actions .btn.btn-secondary:active:not(:disabled):not(.is-disabled),
  body.app .nod-review-actions .btn.btn-primary:active:not(:disabled):not(.is-disabled){
    background:var(--brand-teal-deep) !important;
    border-color:var(--brand-teal-deep) !important;
    color:#fff !important;
  }
  body.app .nod-review-actions .btn.is-disabled,
  body.app .nod-review-actions .btn:disabled{
    opacity:.45;
    cursor:not-allowed;
    pointer-events:none;
  }
  body.app .nod-review-actions-right{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
    justify-content:flex-end;
    width:100%;
  }
  body.app .nod-record-actions-grid{
    display:grid;grid-template-columns:minmax(220px,.9fr) minmax(0,1.2fr);gap:16px 24px;
  }
  body.app .nod-record-checks{display:flex;flex-direction:column;gap:8px}
  body.app .nod-record-check{margin:0;font-size:14px;font-weight:600;color:var(--text-primary)}
  body.app .nod-record-check.is-on{color:var(--brand-teal-deep)}
  @media (max-width:800px){
    body.app .nod-form-split,
    body.app .nod-form-split--response,
    body.app .nod-form-admin-grid,
    body.app .nod-form-facts{grid-template-columns:1fr}
    body.app .nod-form-hero{flex-direction:column;align-items:stretch}
    body.app .nod-form-sheet{border-radius:14px}
    body.app .nod-form-hero,
    body.app .nod-form-section{padding-left:16px;padding-right:16px}
  }
  @media (max-width:720px){
    body.app .nod-form-grid{grid-template-columns:1fr}
    body.app .nod-form-actions,
    body.app .nod-record-actions-grid{grid-template-columns:1fr}
    body.app .nod-review-actions{justify-content:space-between}
    body.app .nod-review-actions-right{width:100%;justify-content:stretch}
    body.app .nod-review-actions-right .btn{flex:1 1 auto;justify-content:center}
  }
  body.app .nod-digital .panel-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:10px}
  body.app .nod-digital .panel-head .muted{flex:1 1 100%}
  body.app .nod-digital-body{padding:4px 18px 22px;display:flex;flex-direction:column;gap:18px}
  body.app .nod-digital-block{display:flex;flex-direction:column;gap:10px}
  body.app .nod-digital-stack{display:flex;flex-direction:column;gap:10px}
  body.app .nod-digital-section{
    margin:0 0 10px;font-size:15px;font-weight:800;color:var(--brand-teal-deep);letter-spacing:.01em;
  }
  body.app .nod-digital-meta{
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;margin:0;
  }
  @media (max-width:700px){body.app .nod-digital-meta{grid-template-columns:1fr}}
  body.app .nod-digital-meta dt{font-size:12px;font-weight:700;color:var(--muted)}
  body.app .nod-digital-meta dd{margin:2px 0 0;font-size:14px;font-weight:600;color:var(--brand-teal-deep);overflow-wrap:anywhere}
  body.app .nod-digital-row,
  body.app .nod-digital-plan{
    display:grid;gap:10px;padding:12px;border:1px solid rgba(var(--primary-rgb),.14);border-radius:12px;background:#f8fcfc;
  }
  body.app .nod-digital-plan{grid-template-columns:minmax(70px,80px) minmax(0,1.4fr) minmax(0,1fr) minmax(0,140px)}
  @media (max-width:800px){body.app .nod-digital-plan{grid-template-columns:1fr}}
  body.app .nod-digital-readonly{
    min-height:38px;padding:8px 10px;border-radius:10px;background:#fff;border:1px solid #e8eef0;
    font-size:14px;color:#1f2937;white-space:pre-wrap;overflow-wrap:anywhere;
  }
  body.app .nod-digital-readonly--strong{font-weight:700;color:var(--brand-teal-deep)}
  body.app .nod-digital-prepared{display:grid;gap:12px}
  body.app .nod-digital-consent{
    padding:12px 14px;border:1px solid rgba(var(--primary-rgb),.16);border-radius:12px;background:#f8fcfc;
  }
  body.app .nod-digital-consent-text{margin:0 0 10px;font-size:14px;line-height:1.5;color:#1f2937}
  body.app .nod-digital-consent-check{
    display:flex;align-items:flex-start;gap:10px;font-size:14px;font-weight:600;color:var(--brand-teal-deep);
  }
  body.app .nod-digital-consent-check input{margin-top:3px}
  body.app .nod-digital-follow{margin-top:12px}
  body.app .nod-digital-flags{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px}
  body.app .nod-digital-submit{max-width:820px;margin:0 auto 18px;width:100%;justify-content:flex-end}
  body.app .nod-digital-pad-wrap{
    border:1px solid #d7e4e6;border-radius:12px;background:#fff;overflow:hidden;
  }
  body.app .nod-digital-pad-wrap.is-disabled{
    opacity:.45;pointer-events:none;background:#f3f4f6;
  }
  body.app .nod-digital-pad-hint{margin:6px 0 8px}
  body.app .nod-digital-pad{display:block;width:100%;height:120px;touch-action:none;cursor:crosshair}
  body.app #nod-response-modal .nod-rx{
    width:min(640px, calc(100vw - 32px));
    max-height:min(920px, calc(100vh - var(--app-modal-top, 64px) - 16px));
    padding:0;
    border-radius:18px;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    background:#fff;
    border:1px solid rgba(var(--primary-rgb),.16);
    box-shadow:0 18px 40px rgba(15,61,66,.14);
  }
  body.app #nod-response-modal .nod-rx-head{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:16px 18px 14px;
    border-bottom:1px solid rgba(var(--primary-rgb),.12);
    background:linear-gradient(180deg, rgba(var(--primary-rgb),.07) 0%, #fff 100%);
    flex-shrink:0;
  }
  body.app #nod-response-modal .nod-rx-head-copy{flex:1;min-width:0}
  body.app #nod-response-modal .nod-rx-head h2{
    margin:0;
    font-size:1.1rem;
    font-weight:750;
    color:var(--brand-teal-deep);
    line-height:1.25;
  }
  body.app #nod-response-modal .nod-rx-head-meta{
    display:flex;
    flex-direction:column;
    gap:2px;
    margin:4px 0 0;
  }
  body.app #nod-response-modal .nod-rx-req{
    font-size:13px;
    font-weight:600;
    color:var(--brand-teal);
  }
  body.app #nod-response-modal .nod-rx-meta-line{
    display:block;
    font-size:12px;
    font-weight:500;
    color:var(--muted);
  }
  body.app #nod-response-modal .nod-rx-head .modal-close{
    width:32px;
    height:32px;
    margin:0;
    flex-shrink:0;
  }
  body.app #nod-response-modal .nod-rx-form{
    display:flex;
    flex-direction:column;
    min-height:0;
    flex:1;
    margin:0;
    gap:0;
  }
  body.app #nod-response-modal .nod-rx-body{
    padding:14px 18px 12px;
    overflow:auto;
    min-height:0;
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  body.app #nod-response-modal .nod-rx-info{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:0;
    padding:0;
  }
  body.app #nod-response-modal .nod-rx-info-item{
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:0;
    padding:12px 14px;
    border:1px solid rgba(var(--primary-rgb),.14);
    border-radius:12px;
    background:rgba(var(--primary-rgb),.05);
  }
  body.app #nod-response-modal .nod-rx-info-label{
    font-size:11px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--brand-teal-deep);
  }
  body.app #nod-response-modal .nod-rx-info-value{
    font-size:13.5px;
    font-weight:650;
    color:var(--text);
    line-height:1.35;
    word-break:break-word;
  }
  body.app #nod-response-modal .nod-rx-card{
    margin:0;
    padding:14px;
    border:1px solid rgba(var(--primary-rgb),.12);
    border-radius:14px;
    background:#fff;
    box-shadow:0 1px 0 rgba(15,61,66,.03);
  }
  body.app #nod-response-modal .nod-rx-card-title{
    margin:0 0 6px;
    font-size:11px;
    font-weight:750;
    letter-spacing:.05em;
    text-transform:uppercase;
    color:var(--brand-teal-deep);
  }
  body.app #nod-response-modal .nod-rx-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px 12px;
    margin:0 0 10px;
  }
  body.app #nod-response-modal .nod-rx-field{display:flex;flex-direction:column;gap:4px;margin:0}
  body.app #nod-response-modal .nod-rx-label{
    font-size:12.5px;
    font-weight:600;
    color:var(--text-primary);
  }
  body.app #nod-response-modal .nod-req{color:#dc2626;font-weight:700}
  body.app #nod-response-modal .nod-rx-field .input{
    margin:0;
    height:38px;
    font-size:13px;
    border-radius:10px;
    border-color:#d7e4e6;
  }
  body.app #nod-response-modal .nod-rx-readonly{
    background:#f5f8f8 !important;
    color:#4b5563;
    pointer-events:none;
  }
  body.app #nod-response-modal .nod-rx-field--action{position:relative}
  body.app #nod-response-modal .nod-rx-action{
    height:auto;
    min-height:88px;
    resize:none;
    padding:10px 12px 22px;
    line-height:1.4;
  }
  body.app #nod-response-modal .nod-rx-count{
    position:absolute;
    right:10px;
    bottom:8px;
    font-size:11px;
    font-weight:600;
    color:var(--muted);
    pointer-events:none;
  }
  body.app #nod-response-modal .nod-rx-terms{
    margin:0 0 10px;
    padding:10px 12px;
    max-height:none;
    overflow:visible;
    border:1px solid #e6eef0;
    border-radius:10px;
    background:#f8fbfb;
  }
  body.app #nod-response-modal .nod-rx-terms-title{
    margin:0 0 4px;
    font-size:12.5px;
    font-weight:700;
    color:var(--brand-teal-deep);
  }
  body.app #nod-response-modal .nod-rx-terms-intro{
    margin:0 0 6px;
    font-size:12px;
    line-height:1.4;
    color:#374151;
  }
  body.app #nod-response-modal .nod-rx-terms-list{
    margin:0;
    padding-left:1.15rem;
    font-size:12px;
    line-height:1.45;
    color:#1f2937;
  }
  body.app #nod-response-modal .nod-rx-terms-list li{margin:0 0 5px}
  body.app #nod-response-modal .nod-rx-consent{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin:0 0 8px;
    font-size:13px;
    font-weight:600;
    line-height:1.4;
    color:var(--text-primary);
  }
  body.app #nod-response-modal .nod-rx-consent input{
    margin-top:2px;
    accent-color:var(--brand-teal-deep);
    flex-shrink:0;
  }
  body.app #nod-response-modal .nod-rx-sign-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-top:6px;
  }
  body.app #nod-response-modal .nod-rx-hint{margin:0;font-size:12px;color:var(--muted);line-height:1.35}
  body.app #nod-response-modal .nod-rx-clear{
    border:0;
    background:transparent;
    color:var(--brand-teal-deep);
    font-size:12px;
    font-weight:600;
    cursor:pointer;
    padding:0;
    flex-shrink:0;
  }
  body.app #nod-response-modal .nod-rx-clear:hover{text-decoration:underline}
  body.app #nod-response-modal .nod-rx-foot{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    padding:12px 18px 16px;
    border-top:1px solid #e6eef0;
    background:#fff;
    flex-shrink:0;
  }
  body.app #nod-response-modal .nod-response-pad{
    position:relative;
    border:1px dashed #c5d6d8;
    border-radius:10px;
    background:#f8fbfb;
    min-height:96px;
  }
  body.app #nod-response-modal .nod-response-pad .nod-digital-pad{height:96px}
  body.app #nod-response-modal .nod-response-pad.is-disabled{
    opacity:.55;
    pointer-events:none;
    background:#f3f5f5;
    cursor:not-allowed;
  }
  body.app #nod-response-modal .nod-response-terms-link{
    border:0;background:none;padding:0;color:var(--brand-teal-deep);font:inherit;font-weight:600;
    text-decoration:underline;cursor:pointer;
  }
  body.app #nod-response-modal .nod-response-cancel,
  body.app #nod-response-modal .nod-response-submit{
    min-height:42px;
    min-width:0;
    width:100%;
    padding:0 16px;
    border-radius:10px;
    font-weight:600;
    font-size:14px;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  body.app #nod-response-modal .nod-response-cancel{
    border:1px solid #d7e4e6;background:#fff;color:#1a2b2e;
  }
  body.app #nod-response-modal .nod-response-submit{
    border:0;background:var(--brand-teal-deep);color:#fff;
  }
  body.app #nod-response-modal .nod-response-submit:disabled{opacity:.42;cursor:not-allowed}
  body.app .modal-overlay#nod-response-modal:not([hidden]),
  body.app .modal-overlay#nod-esign-terms-modal:not([hidden]){
    display:flex !important;
  }
  body.app .modal-overlay#nod-response-modal{z-index:2200}
  body.app .modal-overlay#nod-esign-terms-modal{z-index:2300}
  body.app .nod-esign-terms-modal{width:min(520px,100%)}
  body.app .nod-esign-terms-intro{margin:0 0 10px;font-size:14px;line-height:1.5;color:#1f2937}
  body.app .nod-esign-terms-list{
    margin:0 0 12px;padding-left:1.25rem;font-size:14px;line-height:1.55;color:#1f2937;
  }
  body.app .nod-esign-terms-list li{margin:0 0 8px}
  body.app .nod-esign-terms-agree{margin:0 0 12px;font-size:14px;font-weight:600;color:var(--brand-teal-deep)}
  @media (max-width:640px){
    body.app #nod-response-modal .nod-rx{width:calc(100vw - 20px);max-height:calc(100vh - 20px);border-radius:14px}
    body.app #nod-response-modal .nod-rx-grid{grid-template-columns:1fr}
    body.app #nod-response-modal .nod-rx-info{grid-template-columns:1fr}
    body.app #nod-response-modal .nod-rx-foot{justify-content:stretch}
    body.app #nod-response-modal .nod-response-cancel,
    body.app #nod-response-modal .nod-response-submit{flex:1 1 auto;min-width:0}
  }
  body.app .nod-digital-sigimg{display:block;max-width:280px;height:auto;background:#fff;border:1px solid #e8eef0;border-radius:10px}
  @media screen{
    body.app .nod-official-print-only,
    body.app .nod-official-print-only *{
      display:none !important;
      visibility:hidden !important;
      position:static !important;
      width:0 !important;
      height:0 !important;
      max-width:0 !important;
      max-height:0 !important;
      margin:0 !important;
      overflow:hidden !important;
      pointer-events:none !important;
    }
  }
  @media print{
    body.app .nod-digital-screen,
    body.app .nod-review-page,
    body.app .nod-review-actions{display:none !important}
    body.app .nod-official-print-only{
      display:block !important;
      visibility:visible !important;
      position:static !important;
      left:auto !important;
      width:100% !important;
      height:100% !important;
      box-sizing:border-box !important;
      /* Word Page Setup margins */
      padding:1.27cm 1.27cm 1.14cm 1.59cm !important;
      overflow:hidden !important;
      pointer-events:none !important;
    }
  }
  body.app .form--disc{max-width:720px;padding:16px 18px 20px}
  body.app .form--disc .form-row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  @media (max-width:700px){body.app .form--disc .form-row-2{grid-template-columns:1fr}}
  body.app .disc-list{display:flex;flex-direction:column;gap:14px;padding:14px 18px 22px}
  body.app .disc-card{
    border:1px solid rgba(var(--primary-rgb),.16);
    border-radius:16px;
    padding:16px 18px;
    background:linear-gradient(180deg,#fff 0%,#f8fcfc 100%);
    box-shadow:0 4px 14px rgba(0,80,90,.04);
  }
  body.app .disc-card-top{
    display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap;
  }
  body.app .disc-card-title{margin:0;font-size:1.05rem;color:var(--brand-teal-deep)}
  body.app .disc-card-meta{font-size:13px;margin-top:4px}
  body.app .disc-card-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  body.app .disc-card-note{margin:10px 0 0;color:#374151;font-size:14px;line-height:1.45}
  body.app .disc-card-foot{
    display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;
    margin-top:12px;padding-top:10px;border-top:1px solid #eef2f3;
  }
  body.app .teacher-disc-panel{
    margin-top:0;
  }
  body.app .teacher-disc-panel > .panel-head,
  body.app .teacher-disc-panel-head{
    flex-shrink:0;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:var(--space-md);
    padding:16px 18px 14px;
    border-bottom:1px solid rgba(var(--primary-rgb),.1);
    flex-wrap:wrap;
  }
  body.app .teacher-disc-panel-copy{
    min-width:0;
    flex:1 1 14rem;
  }
  body.app .teacher-disc-panel > .panel-head h2,
  body.app .teacher-disc-panel-head h2{
    margin:0;
    font-size:var(--type-heading-size);
    font-weight:700;
  }
  body.app .teacher-disc-panel > .panel-head .muted,
  body.app .teacher-disc-panel-head .muted{
    margin:6px 0 0;
  }
  body.app .teacher-disc-panel-tools{
    display:flex;
    align-items:flex-end;
    gap:var(--space-sm);
    flex-wrap:wrap;
    margin:0;
    flex:0 1 auto;
  }
  body.app .teacher-disc-filter-form{
    flex:0 0 auto;
    margin:0;
    padding-top:2px;
  }
  body.app .teacher-disc-panel .notice-mgmt-table-wrap{
    padding:4px 0 8px;
  }
  body.app .teacher-disc-panel .notice-mgmt-table{
    margin:0;
  }
  body.app .teacher-disc-panel .notice-mgmt-table th,
  body.app .teacher-disc-panel .notice-mgmt-table td{
    padding:12px 18px;
    vertical-align:middle;
  }
  body.app .teacher-disc-panel .notice-mgmt-table .col-action{
    width:1%;
    min-width:88px;
    text-align:right;
    white-space:nowrap;
  }
  body.app .teacher-disc-panel .notice-mgmt-table .col-approved-by{
    min-width:120px;
  }
  body.app .teacher-disc-panel .notice-mgmt-table .nod-cell-stack{
    display:flex;
    flex-direction:column;
    gap:2px;
    min-width:0;
  }
  body.app .teacher-disc-panel .notice-mgmt-table .nod-approved-by-name{
    display:block;
    font-weight:600;
    color:var(--text-heading);
  }
  body.app .teacher-disc-panel .notice-mgmt-table .nod-list-sub--approved{
    font-size:11px;
  }
  body.app .teacher-disc-req{
    font-weight:600;
    color:var(--text-heading);
  }
  body.app .teacher-disc-panel .register-actions{
    display:inline-flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex-wrap:nowrap;
    width:auto;
    margin:0;
  }
  body.app .teacher-disc-panel .notice-mgmt-table .is-empty-row td{
    text-align:center;
  }
  body.app .disc-response{
    margin-top:12px;padding:12px;border-radius:var(--radius-md);background:#e8f5f6;
  }
  body.app .disc-response p{margin:6px 0 0;font-size:14px}
  body.app .disc-respond,body.app .disc-resolve{margin-top:12px}
  body.app .disc-resolve{display:flex;justify-content:flex-end}
  body.app .days-passed{
    display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;
    background:#fff7e6;color:#b45309;font-size:12px;font-weight:700;
  }
  body.app .empty-state-mark{
    width:48px;height:48px;margin:0 auto 12px;border-radius:12px;
    background:linear-gradient(145deg,#e8f5f6,var(--brand-mint));
    border:2px dashed rgba(var(--primary-rgb),.45);
  }

  /* System-wide: center empty / no-results messages in the content area */
  body.app .empty-state,
  body.app .empty-state--register,
  body.app .folder-empty,
  body.app .tf-file-empty,
  body.app .shared-drive-empty,
  body.app [data-smart-search-empty="1"].empty-state{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:min(52vh,420px);
    margin:0 auto;
    padding:48px 20px;
    text-align:center;
    box-sizing:border-box;
  }

  /* Folder / drive grids: smart-search empty is a grid child â€” force full-area center */
  body.app .tf-folder-grid-wrap:has(.folder-empty),
  body.app .tf-folder-grid-wrap:has(> .folder-grid > .empty-state:not([hidden])),
  body.app .tf-folder-grid-wrap:has(.empty-state:not([hidden])),
  body.app .tf-file-list-wrap:has(.tf-file-empty),
  body.app .tf-folder-drive-wrap:has(.tf-file-empty),
  body.app .tf-folder-drive-wrap:has(.empty-state:not([hidden])),
  body.app .shared-drive-panel:has(> .shared-drive-grid > .empty-state:not([hidden])),
  body.app .teacher-files-panel .tf-folder-grid-wrap:has(.folder-empty),
  body.app .teacher-files-panel .tf-folder-grid-wrap:has(.empty-state:not([hidden])),
  body.app .teacher-files-panel .tf-file-list-wrap:has(.tf-file-empty){
    display:flex;
    align-items:center;
    justify-content:center;
    flex:1 1 auto;
    min-height:min(52vh,420px);
  }
  body.app .folder-grid:has(> .folder-empty),
  body.app .folder-grid:has(> .empty-state:not([hidden])),
  body.app .folder-grid--teacher-files:has(> .folder-empty),
  body.app .folder-grid--teacher-files:has(> .empty-state:not([hidden])),
  body.app .shared-drive-grid:has(> .empty-state:not([hidden])),
  body.app .shared-drive-empty{
    display:flex !important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    align-content:center;
    width:100%;
    min-height:min(52vh,420px);
    flex:1 1 auto;
  }
  body.app .folder-grid > .folder-empty,
  body.app .folder-grid > .empty-state,
  body.app .folder-grid--teacher-files > .folder-empty,
  body.app .folder-grid--teacher-files > .empty-state,
  body.app .shared-drive-grid > .empty-state{
    grid-column:1 / -1;
    width:100%;
    max-width:100%;
    flex:1 1 auto;
    min-height:0;
    height:100%;
  }

  /* Tables: stretch empty row through the viewport and center the message */
  body.app .table-wrap:has(tr.is-empty-row:not([hidden])),
  body.app .notice-mgmt-table-wrap:has(tr.is-empty-row:not([hidden])),
  body.app .activity-log-table-wrap:has(tr.is-empty-row:not([hidden])),
  body.app .individual-compliance-table-wrap:has(tr.is-empty-row:not([hidden])),
  body.app .teacher-compliance-table-wrap:has(tr.is-empty-row:not([hidden])){
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:min(52vh,420px);
  }
  body.app .table-wrap:has(tr.is-empty-row:not([hidden])) > table,
  body.app .notice-mgmt-table-wrap:has(tr.is-empty-row:not([hidden])) > table,
  body.app .activity-log-table-wrap:has(tr.is-empty-row:not([hidden])) > table,
  body.app .individual-compliance-table-wrap:has(tr.is-empty-row:not([hidden])) > table,
  body.app .teacher-compliance-table-wrap:has(tr.is-empty-row:not([hidden])) > table{
    height:100%;
    flex:1 1 auto;
  }
  body.app tr.is-empty-row:not([hidden]){
    height:100%;
  }
  body.app .is-empty-row:not([hidden]) > td,
  body.app td.teacher-compliance-empty,
  body.app td.individual-compliance-empty,
  body.app td.add-document-empty{
    text-align:center !important;
    vertical-align:middle !important;
    padding:48px 20px !important;
    border-bottom:none;
    height:min(46vh,360px);
  }
  /* Keep td as table-cell (flex on td breaks colspan width). Center via inner empty-state. */
  body.app .is-empty-row:not([hidden]) > td .empty-state,
  body.app .is-empty-row:not([hidden]) > td .empty-state--register,
  body.app .is-empty-row[data-smart-search-empty="1"]:not([hidden]) > td .empty-state,
  body.app .is-empty-row:not([hidden]) > td > .muted,
  body.app td.teacher-compliance-empty .empty-state,
  body.app td.individual-compliance-empty .empty-state,
  body.app td.add-document-empty .empty-state{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:100%;
    min-height:min(40vh,320px);
    margin:0 auto;
    padding:24px 12px;
    text-align:center;
    box-sizing:border-box;
  }
  body.app .notice-mgmt-table .is-empty-row:not([hidden]) > td,
  body.app .notice-mgmt-table.notice-mgmt-table--admin .is-empty-row:not([hidden]) > td{
    text-align:center !important;
    vertical-align:middle !important;
    height:min(46vh,360px);
  }
  
  body.app .status-list{
    list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;
  }
  body.app .status-list li{
    display:flex;justify-content:space-between;align-items:center;
    padding:10px 12px;border-radius:10px;background:var(--primary-light);font-size:14px;
  }
  body.app .status-list strong{color:var(--brand-teal-deep)}
  
  body.app .notif-page-list{
    display:flex;
    flex-direction:column;
    min-width:0;
    overflow:hidden;
  }
  body.app .notif-page-head{
    align-items:center;
    gap:16px;
  }
  body.app .notif-filter.shared-drive-filter{
    display:inline-flex;
    align-items:center;
    gap:8px;
    height:var(--control-h, 40px);
    min-height:var(--control-h, 40px);
    padding:0 12px;
    border-radius:12px;
    border:1.5px solid rgba(var(--primary-rgb),.16);
    background:var(--surface,#fff);
    flex-shrink:0;
    box-sizing:border-box;
  }
  body.app .notif-filter-select,
  body.app .notif-filter .shared-drive-filter-select{
    border:0;
    background:transparent;
    font:inherit;
    font-size:13px;
    font-weight:600;
    color:var(--text);
    outline:none;
    min-width:150px;
    max-width:220px;
    height:calc(var(--control-h, 40px) - 2px);
    box-shadow:none;
    padding:0;
    cursor:pointer;
  }
  body.app .page .notif-page-list .notif-stack{
    max-height:none;
    overflow:visible;
    flex:1 1 auto;
    min-height:0;
    display:flex;
    flex-direction:column;
    gap:10px;
    padding:4px 18px 8px;
  }
  body.app .notif-pager{
    margin-top:auto;
    flex-shrink:0;
    border-top:1px solid #eef2f3;
    padding:10px 12px 14px;
    justify-content:center;
  }
  body.app .page .notif-page-list .notif-card{
    display:grid;
    grid-template-columns:44px minmax(0,1fr) auto;
    align-items:center;
    column-gap:14px;
    row-gap:0;
    margin:0;
    padding:14px 16px;
    border-radius:14px;
    border:1px solid #e4ecee;
    border-left:4px solid var(--brand-teal);
    background:#fff;
    box-shadow:none;
    min-width:0;
    text-decoration:none;
    color:inherit;
    cursor:pointer;
  }
  body.app .page .notif-page-list .notif-card:hover{
    filter:brightness(.985);
  }
  body.app .page .notif-page-list .notif-card-ico{
    width:40px;
    height:40px;
    border-radius:999px;
    display:grid;
    place-items:center;
    background:rgba(var(--primary-rgb),.12);
    color:var(--brand-teal-deep);
  }
  body.app .page .notif-page-list .notif-card-ico svg{width:20px;height:20px;display:block}
  /* Kind colors: tinted card + accent stripe + icon + badge */
  body.app .page .notif-page-list .notif-kind-compliance{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.16);
    border-left-color:var(--primary-color);
  }
  body.app .page .notif-page-list .notif-kind-shared{
    background:#eef3f7;
    border-color:rgba(47,107,144,.14);
    border-left-color:#2f6b90;
  }
  body.app .page .notif-page-list .notif-kind-discrepancy,
  body.app .page .notif-page-list .notif-kind-deadline{
    background:var(--status-discrepancy-bg);
    border-color:rgba(201,101,26,.16);
    border-left-color:var(--status-discrepancy);
  }
  body.app .page .notif-page-list .notif-kind-overdue{
    background:var(--status-overdue-bg);
    border-color:rgba(192,69,61,.16);
    border-left-color:var(--status-overdue);
  }
  body.app .page .notif-page-list .notif-kind-other{
    background:var(--background);
    border-color:rgba(91,107,112,.14);
    border-left-color:#6b7c82;
  }
  body.app .page .notif-page-list .notif-kind-compliance .notif-card-ico{
    background:#d7eef0;
    color:var(--primary-color);
  }
  body.app .page .notif-page-list .notif-kind-shared .notif-card-ico{
    background:#e4f0fb;
    color:#2f6b90;
  }
  body.app .page .notif-page-list .notif-kind-discrepancy .notif-card-ico,
  body.app .page .notif-page-list .notif-kind-deadline .notif-card-ico{
    background:#fff3d6;
    color:#c47a22;
  }
  body.app .page .notif-page-list .notif-kind-overdue .notif-card-ico{
    background:#fceeee;
    color:#c0453d;
  }
  body.app .page .notif-page-list .notif-kind-other .notif-card-ico{
    background:#e8ecee;
    color:#5b6b70;
  }
  body.app .page .notif-page-list .notif-kind-compliance .notif-kind-badge{
    background:#d7eef0;
    color:var(--primary-color);
  }
  body.app .page .notif-page-list .notif-kind-shared .notif-kind-badge{
    background:#e4f0fb;
    color:#2f6b90;
  }
  body.app .page .notif-page-list .notif-kind-discrepancy .notif-kind-badge,
  body.app .page .notif-page-list .notif-kind-deadline .notif-kind-badge{
    background:#fff3d6;
    color:#a86412;
  }
  body.app .page .notif-page-list .notif-kind-overdue .notif-kind-badge{
    background:#fceeee;
    color:#c0453d;
  }
  body.app .page .notif-page-list .notif-kind-other .notif-kind-badge{
    background:#e8ecee;
    color:#5b6b70;
  }
  body.app .page .notif-page-list .notif-card-main{min-width:0}
  body.app .page .notif-page-list .notif-card-head{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
    margin-bottom:2px;
  }
  body.app .page .notif-page-list .notif-kind-badge{
    display:inline-flex;
    align-items:center;
    padding:2px 8px;
    border-radius:999px;
    font-size:11px;
    font-weight:700;
    background:rgba(var(--primary-rgb),.12);
    color:var(--brand-teal-deep);
    white-space:nowrap;
  }
  body.app .page .notif-page-list .notif-card-title{
    font-weight:700;
    font-size:15px;
    color:var(--brand-teal-deep);
    line-height:1.35;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.app .page .notif-page-list .notif-card-body{
    margin:2px 0 0;
    font-size:13px;
    color:#5b6b70;
    line-height:1.4;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.app .page .notif-page-list .notif-card-meta{
    display:flex;
    align-items:center;
    gap:6px;
    margin-top:6px;
    color:#8a969b;
  }
  body.app .page .notif-page-list .notif-card-clock{
    width:14px;
    height:14px;
    display:grid;
    place-items:center;
    flex-shrink:0;
  }
  body.app .page .notif-page-list .notif-card-clock svg{width:14px;height:14px;display:block}
  body.app .page .notif-page-list .notif-time{
    margin:0;
    font-size:12px;
    font-weight:500;
    color:#8a969b;
    white-space:nowrap;
  }
  body.app .page .notif-page-list .notif-card-cta{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:8px 14px;
    border-radius:999px;
    border:1px solid rgba(var(--primary-rgb),.28);
    font-size:13px;
    font-weight:600;
    white-space:nowrap;
    background:#fff;
    color:var(--brand-teal-deep);
    flex-shrink:0;
  }
  body.app .page .notif-page-list .notif-card-cta::after{
    content:"";
    width:12px;
    height:12px;
    background:currentColor;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round' d='m9 6 6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  body.app .page .notif-page-list .notif-empty{
    padding:36px 28px;
    text-align:center;
    background:#fff;
    border:1px dashed #d7e2e4;
    border-radius:14px;
  }
  body.app .page .notif-page-list .notif-empty p{margin:0;max-width:420px;margin-inline:auto;line-height:1.5}
  body.app .notif-unread-label{
    display:inline-flex;
    align-items:center;
    padding:2px 7px;
    border-radius:999px;
    font-size:10px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
    background:var(--brand-teal);
    color:#fff;
  }
  body.app .page .notif-page-list .notif-card.is-read,
  body.app .topbar-notif-card.is-read{opacity:1}
  body.app a.notif-card:hover .notif-card-action{text-decoration:underline}
  body.app .dashboard-notifications .notif-card--compact.notif-kind-compliance{
    background:#e7f2f3;
    border-color:rgba(13,106,114,.20);
  }
  body.app .dashboard-notifications .notif-card--compact.notif-kind-discrepancy{
    background:#fff2e6;
    border-color:rgba(201,101,26,.22);
  }
  body.app .dashboard-notifications .notif-card--compact.notif-kind-shared{
    background:#e8f1f4;
    border-color:rgba(44,106,134,.22);
  }
  body.app .notif-kind-compliance .notif-dot,
  body.app .topbar-notif-card.notif-kind-compliance .topbar-notif-dot{
    background:var(--primary-color);
    box-shadow:0 0 0 4px rgba(13,106,114,.16);
  }
  body.app .notif-kind-discrepancy .notif-dot,
  body.app .topbar-notif-card.notif-kind-discrepancy .topbar-notif-dot{
    background:#c47a22;
    box-shadow:0 0 0 4px rgba(196,122,34,.18);
  }
  body.app .notif-kind-shared .notif-dot,
  body.app .topbar-notif-card.notif-kind-shared .topbar-notif-dot{
    background:#3d7ea8;
    box-shadow:0 0 0 4px rgba(61,126,168,.18);
  }
  body.app .topbar-notif-card.notif-kind-compliance,
  body.app .topbar-notif-card.notif-kind-discrepancy,
  body.app .topbar-notif-card.notif-kind-shared{
    background:#fff;
  }
  body.app .topbar-notif-card.notif-kind-compliance:hover,
  body.app .topbar-notif-card.notif-kind-discrepancy:hover,
  body.app .topbar-notif-card.notif-kind-shared:hover{
    background:#f7fbfb;
  }
  
/* Hide obsolete deco if present on other pages */
.login-page .login-deco{display:none}

@media (max-width: 900px){
    body.app .notif-page-head{
      flex-wrap:wrap;
    }
    body.app .page .notif-page-list .notif-card{
      grid-template-columns:40px minmax(0,1fr);
    }
    body.app .page .notif-page-list .notif-card-cta{
      grid-column:2;
      justify-self:start;
      margin-top:8px;
    }
    body.app .page{
      --page-padding-x:18px;
      --page-padding-y:16px;
    }
    body.app .kpis,
    body.app .stat-boxes{
      grid-template-columns:repeat(2,1fr);
      gap:12px;
    }
  }
  /* Mobile shell/sidebar handled in assets/css/responsive.css (off-canvas drawer). */
  @media (max-width: 640px){
    body.app .page-title h1{font-size:1.45rem}
    body.app .kpis,
    body.app .stat-boxes{grid-template-columns:1fr}
  }

  /* Analytics */
  body.app .activity-log-panel{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    padding:16px 18px 12px;
    border-radius:18px;
    background:#fff;
  }
  html:has(body.app.page-activity-log),
  body.app.page-activity-log{
    height:100%;
  }
  body.app.page-activity-log .shell{
    height:100vh;
    height:100dvh;
    max-height:100dvh;
    overflow:hidden;
  }
  body.app.page-activity-log .main{
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app.page-activity-log .page{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app.page-activity-log .activity-log-panel{
    flex:1 1 auto;
    min-height:0;
  }
  body.app.page-activity-log .activity-log-tabs-wrap{
    flex-shrink:0;
    margin:0 0 12px;
  }
  body.app.page-activity-log > .compliance-tabs-wrap.activity-log-tabs-wrap + .activity-log-panel{
    margin-top:0;
  }
  body.app .al-toolbar,
  body.app.page-activity-log .al-toolbar{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:var(--space-sm);
    flex-wrap:wrap;
    width:100%;
    margin:0 0 14px;
    flex-shrink:0;
  }
  body.app .al-toolbar-right,
  body.app.page-activity-log .al-toolbar-right{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:var(--space-sm);
    flex-wrap:wrap;
    margin-left:auto;
    min-width:0;
    max-width:100%;
  }
  body.app .al-toolbar .al-filters,
  body.app.page-activity-log .al-toolbar .al-filters{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:var(--space-sm);
    flex-wrap:wrap;
    width:auto;
    max-width:100%;
    margin:0;
    flex:0 1 auto;
  }
  body.app .al-row--audit{
    cursor:pointer;
  }
  body.app .al-row--audit:hover,
  body.app .al-row--audit:focus-visible{
    background:rgba(var(--primary-rgb),.04);
    outline:none;
  }
  body.app .al-change-list{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    max-width:100%;
  }
  body.app .al-change-chip{
    display:inline-flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
    max-width:100%;
    padding:4px 8px;
    border-radius:8px;
    border:1px solid rgba(15,23,42,.08);
    background:#f8fafc;
    font-size:12px;
    line-height:1.3;
  }
  body.app .al-change-chip--block{
    display:flex;
    width:100%;
    margin-bottom:8px;
  }
  body.app .al-change-chip--set .al-change-new{
    padding:1px 7px;
    border-radius:999px;
    background:var(--status-completed-bg,#e7f5ee);
    color:var(--status-completed,#1f7a4d);
  }
  body.app .al-change-field{
    font-weight:700;
    color:var(--text,#1b2c30);
    min-width:0;
    overflow-wrap:break-word;
  }
  body.app .al-change-field::after{
    content:":";
  }
  body.app .al-change-old{
    color:#b45309;
    text-decoration:line-through;
    text-decoration-thickness:1px;
  }
  body.app .al-change-arrow{
    color:#64748b;
    font-weight:700;
  }
  body.app .al-change-new{
    color:#047857;
    font-weight:700;
  }
  body.app .activity-log-table--audit td.al-change-details,
  body.app .activity-log-table--audit td.al-col-details{
    white-space:normal;
    overflow-wrap:break-word;
    word-break:normal;
  }
  body.app .audit-trail-detail-body{
    display:flex;
    flex-direction:column;
    gap:16px;
  }
  body.app .audit-trail-detail-meta{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px 16px;
    margin:0;
  }
  body.app .audit-trail-detail-meta > div{
    min-width:0;
  }
  body.app .audit-trail-detail-meta dt{
    margin:0 0 2px;
    font-size:11px;
    font-weight:700;
    letter-spacing:.02em;
    text-transform:uppercase;
    color:#64748b;
  }
  body.app .audit-trail-detail-meta dd{
    margin:0;
    font-size:14px;
    font-weight:600;
    color:var(--text-primary);
    word-break:break-word;
  }
  body.app .audit-trail-detail-changes h3{
    margin:0 0 8px;
    font-size:14px;
  }
  body.app .audit-trail-detail-notes{
    margin:0;
    font-size:13px;
  }
  @media (max-width:720px){
    body.app .audit-trail-detail-meta{
      grid-template-columns:1fr;
    }
  }
  body.app .al-filters{
    display:flex;
    align-items:center;
    gap:var(--space-sm);
    flex-wrap:wrap;
    min-width:0;
  }
  body.app .al-filter,
  body.app.page-activity-log .al-filter.shared-drive-filter{
    display:inline-flex;
    align-items:center;
    gap:8px;
    height:var(--control-h, 40px);
    min-height:var(--control-h, 40px);
    padding:0 12px;
    border-radius:12px;
    border:1.5px solid rgba(var(--primary-rgb),.16);
    background:var(--surface,#fff);
    min-width:0;
    box-sizing:border-box;
  }
  body.app .al-filter-ico{
    display:inline-flex;
    color:var(--brand-teal);
    flex-shrink:0;
  }
  body.app .al-filter-ico svg{width:16px;height:16px;display:block}
  body.app .al-filter-select,
  body.app.page-activity-log .al-filter .shared-drive-filter-select{
    border:0;
    background:transparent;
    font:inherit;
    font-size:13px;
    font-weight:600;
    color:var(--text);
    outline:none;
    min-width:118px;
    max-width:170px;
    height:calc(var(--control-h, 40px) - 2px);
    box-shadow:none;
    padding:0;
  }
  body.app.page-activity-log .al-filters .sy-combo{
    min-width:0;
    flex:1 1 auto;
  }
  body.app.page-activity-log .al-filter--period{
    min-width:148px;
  }
  body.app.page-activity-log .al-filter--date{
    min-width:148px;
    padding-right:10px;
  }
  body.app.page-activity-log .al-filter-date,
  body.app.page-activity-log .al-filter .al-filter-date.shared-drive-filter-select{
    min-width:132px;
    max-width:160px;
    color-scheme:light;
    cursor:pointer;
  }
  body.app.page-activity-log .al-filter-date::-webkit-calendar-picker-indicator{
    cursor:pointer;
    opacity:.72;
  }
  body.app.page-activity-log .al-filter .sy-combo-trigger.input,
  body.app.page-activity-log .al-filter .sy-combo-trigger,
  body.app.page-activity-log .al-filter .sy-combo-trigger:hover,
  body.app.page-activity-log .al-filter .sy-combo-trigger:focus,
  body.app.page-activity-log .al-filter .sy-combo-trigger:focus-visible{
    outline:none !important;
    box-shadow:none !important;
    border:none !important;
    background:transparent !important;
    height:calc(var(--control-h, 40px) - 2px);
    min-height:0;
    padding:0 0 0 4px !important;
    min-width:110px;
    max-width:180px;
    font-size:13px;
    font-weight:600;
    color:var(--text) !important;
  }
  body.app.page-activity-log .al-filters .sy-combo-option,
  body.app.page-activity-log .al-filters .sy-combo-option:focus,
  body.app.page-activity-log .al-filters .sy-combo-option:focus-visible{
    outline:none !important;
    box-shadow:none !important;
  }
  body.app.page-activity-log .al-filters .sy-combo-option[aria-selected="true"]{
    background:var(--primary-light);
    color:var(--brand-teal-dark);
  }
  body.app .activity-log-table-wrap{
    flex:1 1 auto;
    min-height:0;
    overflow-x:auto;
    overflow-y:hidden;
    border:none;
    border-radius:14px;
    background:#fff;
    -webkit-overflow-scrolling:touch;
  }
  body.app.page-activity-log .activity-log-panel:has(.register-pagination) > .activity-log-table-wrap,
  body.app.page-activity-log .activity-log-panel:has(.activity-log-pager) > .activity-log-table-wrap{
    overflow-x:auto;
    overflow-y:hidden;
  }
  body.app .activity-log-table{
    width:100%;
    min-width:920px;
    margin:0;
    border-collapse:separate;
    border-spacing:0;
    table-layout:fixed;
  }
  body.app .activity-log-table thead th{
    position:sticky;
    top:0;
    z-index:2;
    background:var(--primary-light,#e7f2f3);
    border-bottom:none;
    color:var(--text-secondary,#5c6c71);
    font-size:11px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    padding:12px 14px;
    text-align:left;
    white-space:nowrap;
  }
  body.app .activity-log-table thead th:first-child{border-radius:12px 0 0 12px}
  body.app .activity-log-table thead th:last-child{border-radius:0 12px 12px 0}
  body.app .al-th{
    display:inline-block;
    line-height:1.2;
  }
  body.app .activity-log-table tbody tr.is-off-page{display:none}
  body.app .activity-log-table tbody td{
    padding:14px 14px;
    border-bottom:1px solid rgba(var(--primary-rgb),.08);
    vertical-align:middle;
    background:var(--surface,#fff);
  }
  body.app .activity-log-table tbody tr:hover td{
    background:rgba(var(--primary-rgb),.03);
  }
  body.app .activity-log-table tbody tr:last-child td{border-bottom:none}
  /* Activity: Date Â· User Â· Role Â· Action Â· Details Â· Record Â· Open */
  body.app .activity-log-table--activity .al-col-when,
  body.app .activity-log-table--activity th.al-col-when,
  body.app .activity-log-table--activity td.al-col-when{width:118px}
  body.app .activity-log-table--activity .al-col-user,
  body.app .activity-log-table--activity th.al-col-user,
  body.app .activity-log-table--activity td.al-col-user{width:22%}
  body.app .activity-log-table--activity .al-col-role,
  body.app .activity-log-table--activity th.al-col-role,
  body.app .activity-log-table--activity td.al-col-role{
    width:100px;
    text-align:left;
  }
  body.app .activity-log-table--activity .al-col-action,
  body.app .activity-log-table--activity th.al-col-action,
  body.app .activity-log-table--activity td.al-col-action{
    width:128px;
    text-align:left;
  }
  body.app .activity-log-table--activity .al-col-details,
  body.app .activity-log-table--activity th.al-col-details,
  body.app .activity-log-table--activity td.al-col-details{
    width:26%;
  }
  body.app .activity-log-table--activity .al-col-record,
  body.app .activity-log-table--activity th.al-col-record,
  body.app .activity-log-table--activity td.al-col-record{width:20%}
  /* Audit: Date Â· User Â· Role Â· Action Â· Record Â· Change details */
  body.app .activity-log-table--audit .al-col-when,
  body.app .activity-log-table--audit th.al-col-when,
  body.app .activity-log-table--audit td.al-col-when{width:118px}
  body.app .activity-log-table--audit .al-col-user,
  body.app .activity-log-table--audit th.al-col-user,
  body.app .activity-log-table--audit td.al-col-user{width:20%}
  body.app .activity-log-table--audit .al-col-role,
  body.app .activity-log-table--audit th.al-col-role,
  body.app .activity-log-table--audit td.al-col-role{width:100px}
  body.app .activity-log-table--audit .al-col-action,
  body.app .activity-log-table--audit th.al-col-action,
  body.app .activity-log-table--audit td.al-col-action{width:130px}
  body.app .activity-log-table--audit .al-col-record,
  body.app .activity-log-table--audit th.al-col-record,
  body.app .activity-log-table--audit td.al-col-record{width:20%}
  body.app .activity-log-table--audit .al-col-details,
  body.app .activity-log-table--audit th.al-col-details,
  body.app .activity-log-table--audit td.al-col-details{width:auto}
  body.app .al-col-go{
    width:44px;
    padding-left:4px !important;
    padding-right:10px !important;
    text-align:center;
  }
  body.app .al-when{display:flex;flex-direction:column;gap:4px}
  body.app .al-when-date{font-weight:700;color:var(--text);font-size:13.5px;white-space:nowrap}
  body.app .al-when-time{font-size:12px;color:var(--muted);font-weight:500}
  body.app .al-user{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-width:0;
    max-width:100%;
  }
  body.app .al-avatar{
    width:32px;
    height:32px;
    border-radius:50%;
    display:grid;
    place-items:center;
    flex-shrink:0;
    font-size:11px;
    font-weight:700;
    letter-spacing:.02em;
  }
  /* Avatars / pills use Tracked status + teal tokens (no purple). */
  body.app .al-avatar--1{background:var(--primary-light);color:var(--brand-teal-dark)}
  body.app .al-avatar--2{background:var(--status-pending-bg);color:var(--status-pending)}
  body.app .al-avatar--3{background:var(--status-completed-bg);color:var(--status-completed)}
  body.app .al-avatar--4{background:var(--status-responded-bg);color:var(--status-responded)}
  body.app .al-person-name{
    font-weight:600;
    font-size:13.5px;
    min-width:0;
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:var(--text);
  }
  body.app .activity-log-table--activity td.al-col-user .al-person-name,
  body.app .activity-log-table--audit td.al-col-user .al-person-name{
    white-space:normal;
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    line-clamp:2;
    text-overflow:ellipsis;
    line-height:1.3;
  }
  body.app .al-role,
  body.app .al-action{
    display:inline-flex;
    align-items:center;
    gap:6px;
    padding:5px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
    white-space:nowrap;
    border:1px solid transparent;
  }
  body.app .al-role--admin{
    background:var(--primary-light);
    color:var(--brand-teal-dark);
    border-color:rgba(var(--primary-rgb),.18);
  }
  body.app .al-role--teacher{
    background:var(--status-responded-bg);
    color:var(--status-responded);
    border-color:rgba(63,115,120,.2);
  }
  body.app .al-role--head{
    background:var(--status-completed-bg);
    color:var(--status-completed);
    border-color:#b7dfc8;
  }
  body.app .al-role--secretary{
    background:var(--primary-light);
    color:var(--brand-teal-deep);
    border-color:rgba(var(--primary-rgb),.16);
  }
  body.app .al-role--system{
    background:#eef2f3;
    color:var(--text-secondary);
    border-color:var(--border);
  }
  body.app .al-action-ico{display:inline-flex}
  body.app .al-action-ico svg{width:14px;height:14px;display:block}
  body.app .al-action--created,
  body.app .al-action--approved,
  body.app .al-action--reactivated{
    background:var(--status-completed-bg);
    color:var(--status-completed);
    border-color:#b7dfc8;
  }
  body.app .al-action--submitted{
    background:var(--brand-teal-dark);
    color:#fff;
    border-color:transparent;
  }
  body.app .al-action--responded,
  body.app .al-action--updated,
  body.app .al-action--uploaded,
  body.app .al-action--shared{
    background:var(--status-responded-bg);
    color:var(--status-responded);
    border-color:rgba(63,115,120,.2);
  }
  body.app .al-action--viewed{
    background:var(--status-pending-bg);
    color:var(--status-pending);
    border-color:#f0e0a8;
  }
  body.app .al-action--deactivated{
    background:var(--status-overdue-bg);
    color:var(--status-overdue);
    border-color:#f0c7c3;
  }
  body.app .al-action--default{
    background:var(--primary-light);
    color:var(--brand-teal-deep);
    border-color:rgba(var(--primary-rgb),.16);
  }
  body.app .activity-log-table tbody td.al-details,
  body.app .activity-log-table tbody td.al-col-details{
    color:var(--text);
    font-size:13.5px;
    line-height:1.45;
    white-space:normal;
    overflow-wrap:break-word;
    word-break:normal;
    hyphens:none;
  }
  body.app .activity-log-table tbody td.al-details .al-details-text,
  body.app .activity-log-table tbody td.al-col-details .al-details-text{
    display:block;
    max-width:100%;
    white-space:normal;
    overflow-wrap:break-word;
    word-break:normal;
    overflow:visible;
  }
  body.app .al-record{
    display:flex;
    align-items:flex-start;
    gap:10px;
    min-width:0;
    max-width:100%;
  }
  body.app .al-record-ico{
    width:28px;
    height:28px;
    margin-top:1px;
    border-radius:8px;
    display:grid;
    place-items:center;
    flex-shrink:0;
    background:var(--primary-light);
    color:var(--brand-teal);
  }
  body.app .al-record-ico--nod{
    background:var(--status-discrepancy-bg);
    color:var(--status-discrepancy);
  }
  body.app .al-record-ico--folder{
    background:var(--status-responded-bg);
    color:var(--status-responded);
  }
  body.app .al-record-ico--user{
    background:var(--primary-light);
    color:var(--brand-teal-dark);
  }
  body.app .al-record-copy{
    display:block;
    min-width:0;
    max-width:100%;
    flex:1 1 auto;
  }
  body.app .al-record-title{
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    line-clamp:2;
    font-weight:700;
    font-size:13px;
    line-height:1.35;
    margin:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:normal;
    color:var(--text);
  }
  body.app .al-record-sub{
    display:block;
    font-size:12px;
    line-height:1.3;
    margin:5px 0 0;
    color:var(--muted);
    white-space:normal;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .al-go{
    display:inline-flex;
    color:#9aa8ae;
    text-decoration:none;
  }
  body.app .al-go svg{width:18px;height:18px}
  body.app .al-go:hover{color:var(--brand-teal)}
  body.app .al-foot{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    gap:12px;
    margin-top:auto;
    flex-shrink:0;
    padding:12px 0 4px;
  }
  body.app .page .al-foot .activity-log-pager.register-pagination,
  body.app .activity-log-pager{
    margin:0 auto;
    padding:0;
    width:auto;
    justify-content:center !important;
  }
  body.app .analytics-panel{
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  body.app .analytics-toolbar{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:12px;
    flex-wrap:wrap;
    margin:0 0 14px;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
  }
  body.app .analytics-card-caption{display:none}
  body.app .analytics-intro{
    margin:0;
    flex:1 1 240px;
    font-size:13px;
  }
  body.app .analytics-filter-form{
    margin:0 0 0 auto;
  }
  body.app .analytics-top-shared-head{
    margin-top:18px;
  }
  body.app .analytics-panel .charts{margin:0}
  body.app .analytics-panel .charts--analytics{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
    align-items:stretch;
  }
  body.app .analytics-panel .charts--analytics .chart--span-full{
    grid-column:1 / -1;
  }
  body.app .analytics-panel .charts--analytics .chart--canvas{
    display:flex;
    flex-direction:column;
    padding:16px 16px 14px;
    border-radius:14px;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    box-shadow:none;
    background:#fff;
    min-height:100%;
    min-width:0;
  }
  body.app .analytics-panel .charts--analytics .chart--analytics-rank{
    background:#fff;
  }
  body.app .analytics-panel .charts--analytics .chart--analytics-rank .analytics-rank-list{
    background:#fff;
  }
  body.app .analytics-panel .charts--analytics .chart--analytics-rank .analytics-rank-row{
    background:#fff;
  }
  body.app .analytics-card-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin:0 0 14px;
    padding:0 0 12px;
    border-bottom:1px solid rgba(var(--primary-rgb),.08);
  }
  body.app .analytics-card-head-main{
    display:flex;
    align-items:flex-start;
    gap:12px;
    min-width:0;
  }
  body.app .analytics-card-icon{display:none}
  body.app .analytics-card-titles{
    min-width:0;
  }
  body.app .analytics-card-titles h3{
    margin:0;
    font-size:1rem;
    font-weight:750;
    color:#0d6a72;
    line-height:1.25;
  }
  body.app .analytics-card-caption{
    margin:4px 0 0;
    font-size:12px;
    line-height:1.4;
    color:#6b7f84;
  }
  body.app .analytics-card-actions{
    flex:0 0 auto;
  }
  body.app .analytics-report-btn{
    display:inline-flex;
    align-items:center;
    gap:7px;
    border-radius:10px;
    padding:8px 12px;
    font-weight:600;
    white-space:nowrap;
    background:var(--button) !important;
    background-color:#0d6a72 !important;
    border-color:#0d6a72 !important;
    color:#fff !important;
    box-shadow:none;
  }
  body.app .analytics-report-btn:hover,
  body.app .analytics-report-btn:focus-visible{
    background:var(--button-hover) !important;
    background-color:#0a555c !important;
    border-color:#0a555c !important;
    color:#fff !important;
  }
  body.app .analytics-report-btn svg{
    flex:0 0 auto;
  }
  body.app .analytics-empty{
    flex:1 1 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0;
    min-height:180px;
    padding:18px 14px;
    text-align:center;
    color:#6b7f84;
    font-size:13px;
    font-weight:600;
    border-radius:12px;
    background:#fff;
    border:1px dashed rgba(var(--primary-rgb),.14);
  }
  body.app .analytics-rank-list{
    list-style:none;
    margin:0;
    padding:10px;
    display:flex;
    flex-direction:column;
    gap:8px;
    flex:1 1 auto;
    min-height:180px;
    border-radius:12px;
    background:#fff;
    border:1px solid rgba(var(--primary-rgb),.08);
  }
  body.app .analytics-rank-row{
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 12px;
    border-radius:10px;
    background:#fff;
    border:1px solid rgba(var(--primary-rgb),.08);
    box-shadow:0 1px 2px rgba(15,61,66,.03);
  }
  body.app .analytics-rank-badge{
    flex:0 0 auto;
    width:28px;
    height:28px;
    border-radius:9px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    font-weight:800;
    color:#fff;
    background:#0d6a72;
  }
  body.app .analytics-rank-body{
    flex:1 1 auto;
    min-width:0;
  }
  body.app .analytics-rank-meta{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:10px;
    margin-bottom:6px;
  }
  body.app .analytics-rank-name{
    font-size:13px;
    font-weight:600;
    color:#17383d;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.app .analytics-rank-value{
    flex:0 0 auto;
    font-size:13px;
    font-weight:800;
    color:#0d6a72;
  }
  body.app .analytics-rank-track{
    height:8px;
    border-radius:999px;
    background:#e7eef0;
    overflow:hidden;
  }
  body.app .analytics-rank-fill{
    display:block;
    height:100%;
    border-radius:inherit;
    background:#0d6a72;
  }
  body.app .analytics-panel .chart-canvas-wrap--analytics{
    flex:1 1 auto;
    height:240px;
    min-height:220px;
    margin-top:2px;
  }
  body.app .analytics-panel .chart-canvas-wrap--trend.chart-canvas-wrap--analytics{
    height:280px;
    min-height:260px;
  }
  @media (max-width:900px){
    body.app .analytics-panel .charts--analytics{
      grid-template-columns:1fr;
    }
    body.app .analytics-card-head{
      flex-wrap:wrap;
    }
    body.app .analytics-toolbar{
      justify-content:flex-start;
    }
  }
  body.app .modal-overlay--main:has(.analytics-report-modal){
    top:var(--app-modal-list-top);
    inset:var(--app-modal-list-top) 0 0 var(--app-sidebar-width);
    align-items:stretch;
    justify-content:center;
    padding:16px 20px 20px;
  }
  body.app .modal-overlay--main .analytics-report-modal.modal,
  body.app .modal-overlay--main .analytics-report-modal{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    align-self:stretch;
    display:flex;
    flex-direction:column;
    min-height:0;
    height:calc(100vh - var(--app-modal-list-top) - 36px) !important;
    max-height:calc(100vh - var(--app-modal-list-top) - 36px) !important;
    overflow:hidden;
    padding:20px 22px 18px;
    box-sizing:border-box;
  }
  body.app .analytics-report-modal .individual-compliance-head{
    flex-shrink:0;
    margin:0 0 14px;
  }
  body.app .analytics-report-period{
    margin:0 0 6px;
    font-size:13px;
    font-weight:600;
    color:var(--muted);
  }
  body.app .analytics-report-letterhead,
  body.app .analytics-report-generated{
    display:none;
  }
  body.app .analytics-report-table-wrap{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    border:1px solid var(--border);
    border-radius:12px;
    background:#fff;
  }
  body.app .analytics-report-table tbody tr.is-off-page{
    display:none;
  }
  body.app .analytics-report-pager{
    flex-shrink:0;
    justify-content:center;
    margin:10px 0 0;
    padding:4px 0 2px;
  }
  body.app .analytics-report-table{
    width:100%;
    margin:0;
    table-layout:fixed;
    border-collapse:separate;
    border-spacing:0;
  }
  body.app .analytics-report-table thead th{
    position:sticky;
    top:0;
    z-index:2;
    background:#e8f3f4;
    color:var(--brand-teal-deep);
    font-size:11px;
    font-weight:700;
    letter-spacing:.03em;
    text-transform:uppercase;
    white-space:normal;
    line-height:1.25;
    padding:12px 10px;
    border-bottom:1px solid rgba(var(--primary-rgb),.16);
    box-shadow:0 1px 0 #e8f3f4;
    vertical-align:middle;
  }
  body.app .analytics-report-table tbody td{
    padding:12px 10px;
    vertical-align:middle;
    font-size:13.5px;
    border-bottom:1px solid #eef0f3;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  body.app .analytics-report-table tbody tr:nth-child(even) td{
    background:#f7fbfb;
  }
  body.app .analytics-report-table tbody tr:hover td{
    background:#f1f8f8;
  }
  /* Teacher Â· Total Â· Completed Â· Pending Â· Overdue Â· Compliance Rate */
  body.app .analytics-report-table--teachers th:nth-child(1),
  body.app .analytics-report-table--teachers td:nth-child(1){
    width:30%;
    text-align:left;
  }
  body.app .analytics-report-table--teachers th:nth-child(2),
  body.app .analytics-report-table--teachers td:nth-child(2){
    width:16%;
    text-align:center;
  }
  body.app .analytics-report-table--teachers th:nth-child(3),
  body.app .analytics-report-table--teachers td:nth-child(3),
  body.app .analytics-report-table--teachers th:nth-child(4),
  body.app .analytics-report-table--teachers td:nth-child(4),
  body.app .analytics-report-table--teachers th:nth-child(5),
  body.app .analytics-report-table--teachers td:nth-child(5){
    width:12%;
    text-align:center;
  }
  body.app .analytics-report-table--teachers th:nth-child(6),
  body.app .analytics-report-table--teachers td:nth-child(6){
    width:18%;
    text-align:center;
  }
  /* Month Â· Due Â· Submitted Â· Pending Â· Overdue Â· Rate */
  body.app .analytics-report-table--monthly th:nth-child(1),
  body.app .analytics-report-table--monthly td:nth-child(1){
    width:18%;
    text-align:left;
  }
  body.app .analytics-report-table--monthly th:nth-child(2),
  body.app .analytics-report-table--monthly td:nth-child(2){
    width:18%;
    text-align:center;
  }
  body.app .analytics-report-table--monthly th:nth-child(3),
  body.app .analytics-report-table--monthly td:nth-child(3),
  body.app .analytics-report-table--monthly th:nth-child(4),
  body.app .analytics-report-table--monthly td:nth-child(4),
  body.app .analytics-report-table--monthly th:nth-child(5),
  body.app .analytics-report-table--monthly td:nth-child(5){
    width:14%;
    text-align:center;
  }
  body.app .analytics-report-table--monthly th:nth-child(6),
  body.app .analytics-report-table--monthly td:nth-child(6){
    width:18%;
    text-align:center;
  }
  /* Rank Â· Teacher Â· Files Shared */
  body.app .analytics-report-table--shared th:nth-child(1),
  body.app .analytics-report-table--shared td:nth-child(1){
    width:12%;
    text-align:center;
  }
  body.app .analytics-report-table--shared th:nth-child(2),
  body.app .analytics-report-table--shared td:nth-child(2){
    width:58%;
    text-align:left;
  }
  body.app .analytics-report-table--shared th:nth-child(3),
  body.app .analytics-report-table--shared td:nth-child(3){
    width:30%;
    text-align:center;
  }
  /* Department Â· Total Â· Completed Â· Rate */
  body.app .analytics-report-table--department th:nth-child(1),
  body.app .analytics-report-table--department td:nth-child(1){
    width:34%;
    text-align:left;
  }
  body.app .analytics-report-table--department th:nth-child(2),
  body.app .analytics-report-table--department td:nth-child(2),
  body.app .analytics-report-table--department th:nth-child(3),
  body.app .analytics-report-table--department td:nth-child(3){
    width:22%;
    text-align:center;
  }
  body.app .analytics-report-table--department th:nth-child(4),
  body.app .analytics-report-table--department td:nth-child(4){
    width:22%;
    text-align:center;
  }
  /* Month Â· Due Â· Completed Â· Rate */
  body.app .analytics-report-table--trend th:nth-child(1),
  body.app .analytics-report-table--trend td:nth-child(1){
    width:28%;
    text-align:left;
  }
  body.app .analytics-report-table--trend th:nth-child(2),
  body.app .analytics-report-table--trend td:nth-child(2),
  body.app .analytics-report-table--trend th:nth-child(3),
  body.app .analytics-report-table--trend td:nth-child(3){
    width:24%;
    text-align:center;
  }
  body.app .analytics-report-table--trend th:nth-child(4),
  body.app .analytics-report-table--trend td:nth-child(4){
    width:24%;
    text-align:center;
  }
  body.app .analytics-report-modal .modal-btn-row{
    flex-shrink:0;
    margin-top:16px;
    display:flex;
    align-items:stretch;
    gap:10px;
    width:100%;
  }
  body.app .analytics-report-modal .modal-btn-row > .modal-btn,
  body.app .analytics-report-modal .modal-btn-row > a.modal-btn{
    flex:1 1 0;
    width:0;
    min-width:0;
    max-width:none;
    box-sizing:border-box;
  }
  @media (max-width:640px){
    body.app .modal-overlay--main:has(.analytics-report-modal){
      inset:var(--app-modal-list-top) 0 0 0;
    }
  }
  /* â€”â€” Teacher full calendar â€”â€” */
  html:has(body.page-teacher-calendar),
  body.page-teacher-calendar{
    height:100%;
    overflow:hidden;
  }
  body.app.page-teacher-calendar .shell{
    height:100vh;
    height:100dvh;
    max-height:100vh;
    max-height:100dvh;
    overflow:hidden;
  }
  body.app.page-teacher-calendar .sidebar{
    height:100vh;
    height:100dvh;
  }
  body.app.page-teacher-calendar .main{
    display:flex;
    flex-direction:column;
    height:100%;
    min-height:0;
    overflow:hidden;
    background:#fff;
  }
  body.app.page-teacher-calendar .topbar{
    flex-shrink:0;
    background:#fff;
    border-bottom-color:rgba(var(--primary-rgb),.12);
  }
  body.app.page-teacher-calendar .page{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;
    display:block;
    padding:12px 20px 20px;
    background:#fff;
  }
  body.app.page-teacher-calendar .school-cal-card{
    margin:0;
    min-height:0;
    padding:16px 18px 14px;
  }
  body.app.page-teacher-calendar .school-cal-card .school-cal{
    gap:14px;
  }
  body.app.page-teacher-calendar .school-cal-top{
    z-index:8;
  }
  body.app.page-teacher-calendar .school-cal-board{
    overflow:visible;
    padding:12px;
  }
  body.app.page-teacher-calendar .school-cal-dow,
  body.app.page-teacher-calendar .school-cal-grid{
    gap:6px;
  }
  body.app.page-teacher-calendar .school-cal-grid{
    grid-auto-rows:86px;
  }
  body.app.page-teacher-calendar .school-cal-dow{
    margin:0 0 6px;
  }
  body.app.page-teacher-calendar .school-cal-cell{
    min-height:0;
    height:100%;
    padding:8px 8px 6px;
    border-radius:12px;
    overflow:hidden;
  }
  body.app.page-teacher-calendar .school-cal-foot{
    margin-top:4px;
    gap:10px;
    padding:0;
  }
  body.app.page-teacher-calendar .school-cal-month-summary{
    gap:8px 10px;
  }
  body.app.page-teacher-calendar .school-cal-summary-group{
    padding:10px 12px;
    border-radius:12px;
  }
  body.app.page-teacher-calendar .school-cal-summary-heading{
    margin:0 0 6px;
    font-size:11px;
  }
  body.app.page-teacher-calendar .school-cal-summary-empty{
    font-size:12px;
  }
  @media (max-height:900px){
    body.app.page-teacher-calendar .school-cal-grid{
      grid-auto-rows:72px;
    }
    body.app.page-teacher-calendar .school-cal-cell{
      min-height:0;
      height:100%;
      padding:7px 7px 6px;
    }
    body.app.page-teacher-calendar .school-cal-num{
      min-width:24px;
      height:24px;
      font-size:12px;
    }
    body.app.page-teacher-calendar .school-cal-card{
      padding:14px 14px 12px;
    }
  }

  /* â€”â€” Teacher compliance table â€”â€” */
  html:has(body.page-teacher-compliance),
  body.page-teacher-compliance{
    height:100%;
    overflow:hidden;
  }
  body.app.page-teacher-compliance .shell{
    height:100vh;
    height:100dvh;
    max-height:100vh;
    max-height:100dvh;
    overflow:hidden;
  }
  body.app.page-teacher-compliance .sidebar{
    height:100vh;
    height:100dvh;
  }
  body.app.page-teacher-compliance .main{
    display:flex;
    flex-direction:column;
    height:100%;
    min-height:0;
    overflow:hidden;
    background:#fff;
  }
  body.app.page-teacher-compliance .topbar{
    flex-shrink:0;
    background:#fff;
    border-bottom-color:rgba(var(--primary-rgb),.12);
  }
  body.app.page-teacher-compliance .page{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    padding:12px 20px 16px;
    background:#fff;
  }
  body.app.page-teacher-compliance .flash{
    flex-shrink:0;
  }
  body.app.page-teacher-compliance .teacher-compliance-page{
    flex:1 1 auto;
    min-height:0;
    display:flex;
    flex-direction:column;
    gap:14px;
  }
  body.app.page-teacher-compliance .teacher-compliance-shell{
    flex:1 1 auto;
    min-height:0;
    display:flex;
    flex-direction:column;
    gap:12px;
    padding:14px;
    border-radius:18px;
    background:
      linear-gradient(180deg, rgba(255,255,255,.96) 0%, #fff 42%),
      radial-gradient(ellipse 80% 50% at 0% 0%, rgba(var(--primary-rgb),.08), transparent 55%);
    border:1px solid rgba(var(--primary-rgb),.14);
    box-shadow:0 10px 28px rgba(15,61,66,.06);
  }
  body.app.page-teacher-compliance .teacher-compliance-toolbar{
    display:flex;
    align-items:flex-end;
    justify-content:flex-end;
    gap:12px 16px;
    flex-wrap:wrap;
    width:100%;
    flex-shrink:0;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
  }
  body.app.page-teacher-compliance .teacher-compliance-head{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:0;
    flex-wrap:nowrap;
    flex-shrink:0;
    margin:0;
    padding:12px 16px 0;
    border:0;
    background:transparent;
  }
  body.app.page-teacher-compliance .teacher-compliance-head.panel-head--row{
    padding:12px 16px 10px;
  }
  body.app.page-teacher-compliance .teacher-compliance-cal-btn{
    flex:0 0 auto;
    align-self:flex-end;
    height:var(--control-h, 36px);
    padding:0 14px;
    font-weight:700;
    border-radius:var(--radius-md, 10px) !important;
    background:var(--button) !important;
    background-color:#0d6a72 !important;
    border:1px solid #0d6a72 !important;
    color:#fff !important;
    box-shadow:none;
  }
  body.app.page-teacher-compliance .teacher-compliance-cal-btn:hover,
  body.app.page-teacher-compliance .teacher-compliance-cal-btn:focus-visible{
    background:var(--button-hover) !important;
    background-color:#0a555c !important;
    border-color:#0a555c !important;
    color:#fff !important;
    box-shadow:none;
  }
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right{
    display:flex;
    align-items:flex-end;
    justify-content:flex-end;
    gap:10px 14px;
    flex-wrap:wrap;
    margin-left:auto;
    min-width:0;
  }
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .dept-filter{
    margin:0;
    flex:0 0 auto;
    align-items:flex-end;
  }
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .dept-filter .shared-drive-filter{
    gap:0;
  }
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters{
    margin:0;
    flex:0 1 auto;
    gap:10px 14px;
    align-items:flex-end;
  }
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .dept-filter .page-period-label,
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .page-period-label{
    font-size:11px;
    font-weight:600;
    margin:0 0 4px;
    line-height:1.2;
  }
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .shared-drive-filter{
    gap:0;
  }
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .dept-filter .shared-drive-filter-select,
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .shared-drive-filter-select,
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .sy-combo-input,
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .sy-combo-trigger{
    height:var(--control-h);
    min-height:var(--control-h);
    min-width:132px;
    border-radius:10px;
    border-color:rgba(var(--primary-rgb),.18);
    background:#fff;
  }
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .dept-filter .shared-drive-filter-select:focus,
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .shared-drive-filter-select:focus,
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .sy-combo-input:focus,
  body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .sy-combo-trigger:focus{
    border-color:var(--brand-teal, var(--primary-color));
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12);
    outline:none;
  }
  /* Segmented filter tabs */
  body.app.page-teacher-compliance .teacher-compliance-tabs.compliance-tabs{
    display:flex;
    align-items:center;
    flex-shrink:0;
    margin:0;
    padding:5px;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
    background:rgba(247,251,251,.98);
    border:1px solid rgba(var(--primary-rgb),.12);
    border-radius:14px;
    box-shadow:none;
    gap:4px;
    flex-wrap:nowrap;
  }
  body.app.page-teacher-compliance .teacher-compliance-tabs .compliance-tab{
    display:inline-flex;
    flex:1 1 0;
    width:auto;
    min-width:0;
    justify-content:center;
    text-align:center;
    padding:10px 12px;
    box-sizing:border-box;
    border-radius:10px;
    font-size:13.5px;
    font-weight:700;
    color:#0d6a72;
    background:transparent;
    transition:background .15s ease, color .15s ease, box-shadow .15s ease;
  }
  body.app.page-teacher-compliance .teacher-compliance-tabs .compliance-tab:hover{
    background:rgba(var(--primary-rgb),.08);
  }
  body.app.page-teacher-compliance .teacher-compliance-tabs .compliance-tab.is-active{
    background:var(--button);
    background-color:#0d6a72;
    color:#fff;
    box-shadow:none;
  }
  body.app.page-teacher-compliance .teacher-compliance-table{
    table-layout:fixed;
    width:100%;
    border-collapse:separate;
    border-spacing:0;
    background:transparent;
  }
  body.app.page-teacher-compliance .teacher-compliance-table col.col-req{width:34%}
  body.app.page-teacher-compliance .teacher-compliance-table col.col-deadline{width:16%}
  body.app.page-teacher-compliance .teacher-compliance-table col.col-submitted{width:16%}
  body.app.page-teacher-compliance .teacher-compliance-table col.col-upload{width:34%}
  body.app.page-teacher-compliance .teacher-compliance-table thead th,
  body.app.page-teacher-compliance .teacher-compliance-table tbody td{
    box-sizing:border-box;
    vertical-align:middle;
    text-align:left;
    overflow:hidden;
  }
  body.app.page-teacher-compliance .teacher-compliance-panel{
    flex:1 1 auto;
    min-height:0;
    display:flex;
    flex-direction:column;
    border:1px solid rgba(var(--primary-rgb),.12);
    border-radius:16px;
    box-shadow:0 4px 16px rgba(15,61,66,.05);
    overflow:hidden;
    background:#fff;
  }
  body.app.page-teacher-compliance .teacher-compliance-table-wrap{
    flex:1 1 auto;
    min-height:0;
    padding:0;
    overflow:auto;
    background:#fff;
  }
  body.app.page-teacher-compliance .teacher-compliance-pager{
    flex-shrink:0;
    margin:0;
    border-top:1px solid rgba(var(--primary-rgb),.08);
    background:linear-gradient(180deg, #fbfefe 0%, #fff 100%);
    padding:10px 14px 12px;
  }
  body.app.page-teacher-compliance .teacher-compliance-table thead th{
    padding:12px 16px;
    font-size:11.5px;
    font-weight:800;
    letter-spacing:.05em;
    text-transform:uppercase;
    color:var(--muted);
    background:linear-gradient(180deg, #f4faf9 0%, #eef6f6 100%);
    border-bottom:1px solid rgba(var(--primary-rgb),.10);
    position:sticky;
    top:0;
    z-index:1;
  }
  body.app.page-teacher-compliance .teacher-compliance-table tbody td{
    padding:14px 16px;
    font-size:13.5px;
    background:#fff;
    border-bottom:1px solid rgba(var(--primary-rgb),.07);
    transition:background .12s ease;
  }
  body.app.page-teacher-compliance .teacher-compliance-table tbody tr:last-child td{
    border-bottom:0;
  }
  body.app.page-teacher-compliance .teacher-compliance-table tbody tr:hover td{
    background:#f7fbfb;
  }
  body.app.page-teacher-compliance .teacher-compliance-table tbody tr.is-overdue:hover td{
    background:#fff7f6;
  }
  body.app.page-teacher-compliance .teacher-compliance-table .td-upload{
    text-align:left;
  }
  body.app.page-teacher-compliance .teacher-compliance-req{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
    min-width:0;
  }
  body.app.page-teacher-compliance .teacher-compliance-req-main{
    min-width:0;
    font-weight:600;
    color:var(--text);
    line-height:1.35;
  }
  body.app.page-teacher-compliance .teacher-compliance-req .pill{
    font-size:11px;
    font-weight:700;
    padding:3px 9px;
    border-radius:999px;
  }
  body.app.page-teacher-compliance .td-deadline,
  body.app.page-teacher-compliance .td-submitted{
    color:#3d5559;
    font-weight:500;
    white-space:nowrap;
  }
  body.app.page-teacher-compliance .teacher-compliance-upload-cell{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
    width:100%;
  }
  body.app.page-teacher-compliance .teacher-compliance-file-link{
    display:inline-block;
    max-width:100%;
    min-width:0;
    padding:5px 8px;
    border-radius:8px;
    background:rgba(var(--primary-rgb),.08);
    border:1px solid rgba(var(--primary-rgb),.14);
    color:var(--brand-teal-deep, #084a50);
    font-size:12.5px;
    font-weight:600;
    text-decoration:none;
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
    line-height:1.3;
  }
  body.app.page-teacher-compliance .teacher-compliance-file-link:hover{
    background:rgba(var(--primary-rgb),.14);
    text-decoration:none;
  }
  body.app.page-teacher-compliance .teacher-compliance-inline-upload{
    display:inline-flex;
    margin:0;
  }
  body.app.page-teacher-compliance .teacher-compliance-upload-btn.register-icon-btn,
  body.app.page-teacher-compliance .teacher-compliance-upload-btn.register-icon-btn:hover,
  body.app.page-teacher-compliance .teacher-compliance-upload-btn.register-icon-btn:focus-visible{
    width:34px;
    height:34px;
    min-width:34px;
    min-height:34px;
    padding:0;
    border-radius:8px;
    border:1px solid rgba(13,106,114,.28);
    background:#f3faf9;
    color:#0d6a72;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    line-height:0;
    box-shadow:none;
  }
  body.app.page-teacher-compliance .teacher-compliance-upload-btn.register-icon-btn:hover,
  body.app.page-teacher-compliance .teacher-compliance-upload-btn.register-icon-btn:focus-visible{
    background:rgba(13,106,114,.14);
    border-color:#0d6a72;
    color:#0d6a72;
  }
  body.app.page-teacher-compliance .teacher-compliance-upload-btn svg{
    width:18px;
    height:18px;
    display:block;
  }
  body.app.page-teacher-compliance .teacher-compliance-empty{
    padding:36px 18px !important;
    text-align:center;
    color:var(--muted);
    font-weight:600;
  }
  @media (max-width:900px){
    body.app.page-teacher-compliance .teacher-compliance-shell{padding:12px}
    body.app.page-teacher-compliance .teacher-compliance-toolbar{
      align-items:stretch;
    }
    body.app.page-teacher-compliance .teacher-compliance-toolbar-right{
      width:100%;
      margin-left:0;
      justify-content:flex-start;
    }
  }
  @media (max-width:640px){
    body.app.page-teacher-compliance .page{
      padding:12px 14px 14px;
    }
    body.app.page-teacher-compliance .teacher-compliance-shell{
      padding:10px;
      border-radius:14px;
      gap:10px;
    }
    body.app.page-teacher-compliance .teacher-compliance-toolbar,
    body.app.page-teacher-compliance .teacher-compliance-toolbar-right{
      width:100%;
      justify-content:flex-start;
    }
    body.app.page-teacher-compliance .teacher-compliance-tabs.compliance-tabs{
      flex-wrap:wrap;
    }
    body.app.page-teacher-compliance .teacher-compliance-tabs .compliance-tab{
      flex:1 1 calc(50% - 4px);
      font-size:12.5px;
      padding:9px 8px;
    }
    body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters{
      margin:0;
      width:100%;
      justify-content:flex-start;
    }
    body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .shared-drive-filter{
      flex:1 1 calc(50% - 8px);
      min-width:0;
    }
    body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .shared-drive-filter-select,
    body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .sy-combo-input,
    body.app.page-teacher-compliance .teacher-compliance-toolbar-right .page-period-filters .sy-combo-trigger{
      width:100%;
      min-width:0;
    }
    body.app.page-teacher-compliance .teacher-compliance-req{
      flex-direction:row;
      flex-wrap:wrap;
      align-items:center;
      justify-content:space-between;
      width:100%;
    }
  }
  body.app .teacher-compliance-page{
    display:grid;
    gap:16px;
  }
  body.app .teacher-compliance-panel{
    border:1px solid rgba(var(--primary-rgb),.12);
    box-shadow:0 4px 16px rgba(15,61,66,.05);
    overflow:hidden;
  }
  body.app .teacher-compliance-detail-head{
    padding:16px 18px 8px;
    align-items:flex-start;
  }
  body.app .teacher-compliance-detail-head h2{
    margin:0 0 4px;
    font-size:1.05rem;
  }
  body.app .teacher-compliance-detail-head .muted{
    margin:0;
    font-size:13px;
  }
  body.app .teacher-compliance-inline-upload{
    margin:0;
    display:inline-flex;
    align-items:center;
  }
  body.app .teacher-compliance-inline-upload .register-icon-btn{
    cursor:pointer;
    margin:0;
  }
  body.app .teacher-compliance-table-wrap{
    padding:0;
    overflow:auto;
  }
  body.app .teacher-compliance-table{
    width:100%;
    margin:0;
    table-layout:fixed;
  }
  body.app .teacher-compliance-table thead th{
    background:linear-gradient(180deg, #f4faf9 0%, #eef6f6 100%);
    color:var(--muted);
    font-weight:800;
    font-size:11.5px;
    letter-spacing:.05em;
    text-transform:uppercase;
    padding:12px 16px;
    white-space:nowrap;
    vertical-align:middle;
  }
  body.app .teacher-compliance-table tbody td{
    padding:13px 16px;
    vertical-align:middle;
    font-size:14px;
  }
  body.app .teacher-compliance-table col.col-req,
  body.app .teacher-compliance-table .th-req,
  body.app .teacher-compliance-table .td-req{
    width:34%;
  }
  body.app .teacher-compliance-table col.col-deadline,
  body.app .teacher-compliance-table .th-deadline,
  body.app .teacher-compliance-table .td-deadline,
  body.app .teacher-compliance-table col.col-submitted,
  body.app .teacher-compliance-table .th-submitted,
  body.app .teacher-compliance-table .td-submitted{
    width:16%;
  }
  body.app .teacher-compliance-table col.col-upload,
  body.app .teacher-compliance-table .th-upload,
  body.app .teacher-compliance-table .td-upload,
  body.app .teacher-compliance-table .th-file,
  body.app .teacher-compliance-table .td-file,
  body.app .teacher-compliance-table .th-status,
  body.app .teacher-compliance-table .td-status,
  body.app .teacher-compliance-table .th-action,
  body.app .teacher-compliance-table .td-action{
    width:34%;
  }
  body.app .teacher-compliance-table .td-upload{
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  body.app .teacher-compliance-table .td-req{
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  body.app .teacher-compliance-table .th-deadline,
  body.app .teacher-compliance-table .td-deadline,
  body.app .teacher-compliance-table .th-submitted,
  body.app .teacher-compliance-table .td-submitted{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  body.app .teacher-compliance-table .td-upload,
  body.app .teacher-compliance-table .td-action{
    text-align:left;
  }
  body.app.page-teacher-compliance .teacher-compliance-inline-upload{
    justify-content:flex-start;
    width:auto;
  }
  body.app .teacher-compliance-file-link{
    display:inline-block;
    max-width:100%;
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  body.app .teacher-compliance-empty{
    text-align:center;
    color:var(--muted);
    border-bottom:none;
  }
  @media (max-width:720px){
    body.app .teacher-compliance-table{
      table-layout:fixed;
      min-width:560px;
    }
  }

  /* â€”â€” Profile (admin + teacher) â€”â€” */
  body.app .page:has(.profile-page){
    display:flex;
    flex-direction:column;
    background:var(--background);
    max-width:none;
    width:100%;
  }
  body.app .profile-page{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:20px;
    max-width:none;
    width:100%;
    flex:1 1 auto;
    align-items:stretch;
  }
  body.app .profile-panel{
    display:flex;
    flex-direction:column;
    min-width:0;
    border:1px solid rgba(27,44,48,.08);
    border-radius:18px;
    box-shadow:0 10px 28px rgba(27,44,48,.06);
    background:#fff;
    overflow:hidden;
  }
  body.app .profile-panel--identity{
    background:#fff;
  }
  body.app .profile-panel--security{
    background:#fff;
  }
  body.app .profile-panel-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    padding:18px 22px 0;
    border:none;
  }
  body.app .profile-panel-head h2{
    margin:0 0 4px;
    font-size:1.05rem;
    font-weight:700;
    color:var(--text);
  }
  body.app .profile-panel-head .muted{
    margin:0;
    font-size:13px;
  }
  body.app .profile-form-kicker{
    margin:6px 0 0;
    font-size:15px;
    font-weight:700;
    color:var(--text);
  }
  body.app .profile-hero{
    display:flex;
    align-items:center;
    gap:16px;
    margin:0;
    padding:22px 22px 20px;
    border-radius:0;
    background:
      radial-gradient(120% 90% at 0% 0%, rgba(var(--primary-rgb),.14), transparent 55%),
      linear-gradient(160deg,#eef7f8 0%,#f7fbfb 55%,#fff 100%);
    border:none;
    border-bottom:1px solid rgba(var(--primary-rgb),.1);
  }
  body.app .profile-avatar{
    width:72px;
    height:72px;
    border-radius:50%;
    display:grid;
    place-items:center;
    flex-shrink:0;
    background:var(--brand-mint,#d8ecee);
    border:3px solid #fff;
    box-shadow:0 0 0 2px rgba(var(--primary-rgb),.28);
    color:var(--brand-teal-deep);
    font-size:1.35rem;
    font-weight:700;
    letter-spacing:.02em;
    overflow:hidden;
  }
  body.app .profile-hero-copy{min-width:0}
  body.app .profile-eyebrow{
    margin:0 0 4px;
    font-size:11px;
    font-weight:700;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:var(--brand-teal);
  }
  body.app .profile-photo-action{margin:12px 0 0}
  body.app .profile-name{
    margin:0 0 4px;
    font-size:1.35rem;
    font-weight:700;
    color:var(--brand-teal-deep,var(--primary-color));
    line-height:1.2;
    word-break:break-word;
  }
  body.app .profile-email{
    margin:0 0 10px;
    font-size:13.5px;
    color:var(--muted);
    word-break:break-word;
  }
  body.app .profile-hero-tags{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
  }
  body.app .profile-role-badge{
    display:inline-flex;
    align-items:center;
    padding:5px 12px;
    border-radius:999px;
    background:var(--button);
    background-color:#0d6a72;
    border:none;
    color:#fff;
    font-size:12px;
    font-weight:600;
  }
  body.app .profile-scope-chip{
    display:inline-flex;
    align-items:center;
    padding:5px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.85);
    border:1px solid rgba(var(--primary-rgb),.2);
    color:var(--brand-teal-deep);
    font-size:12px;
    font-weight:600;
  }
  body.app .profile-role-badge--inline{
    margin-top:0;
  }
  body.app .profile-section-label{
    margin:0;
    padding:16px 22px 0;
    font-size:12px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--muted);
  }
  body.app .profile-meta{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:12px;
    margin:0;
    padding:12px 22px 6px;
  }
  body.app .profile-meta-item{
    display:flex;
    flex-direction:column;
    gap:6px;
    min-width:0;
    padding:14px 14px;
    border:1px solid rgba(var(--primary-rgb),.1);
    border-radius:12px;
    background:linear-gradient(180deg,#fbfefe 0%,#f5fafb 100%);
  }
  body.app .profile-meta-item dt{
    margin:0;
    font-size:11px;
    font-weight:700;
    letter-spacing:.03em;
    text-transform:uppercase;
    color:var(--muted);
  }
  body.app .profile-meta-item dd{
    margin:0;
    font-size:14.5px;
    font-weight:600;
    color:var(--text);
    word-break:break-word;
    line-height:1.35;
  }
  body.app .profile-panel-footer{
    display:flex;
    justify-content:stretch;
    align-items:stretch;
    margin-top:auto;
    padding:16px 22px 20px;
    width:100%;
    box-sizing:border-box;
  }
  body.app .profile-security-intro{
    display:flex;
    align-items:flex-start;
    gap:14px;
    padding:22px 22px 6px;
  }
  body.app .profile-security-intro h2{
    margin:0 0 4px;
    font-size:1.15rem;
    font-weight:700;
    color:var(--brand-teal-deep,var(--primary-color));
  }
  body.app .profile-security-intro .muted{
    margin:0;
    font-size:13.5px;
    line-height:1.4;
  }
  body.app .profile-security-ico{
    width:44px;
    height:44px;
    border-radius:12px;
    display:grid;
    place-items:center;
    flex-shrink:0;
    background:rgba(var(--primary-rgb),.12);
    color:var(--brand-teal-deep);
  }
  body.app .confirm-modal{
    width:min(420px,100%);
    max-width:420px;
    padding:26px 26px 24px;
  }
  body.app .confirm-modal .modal-head{
    margin-bottom:18px;
  }
  body.app .confirm-modal .modal-head h2{
    font-size:1.25rem;
    font-weight:700;
    color:var(--login-ink,#1a2b2e);
  }
  body.app .confirm-modal-text{
    margin:0 0 18px;
    color:var(--muted);
    font-size:14px;
    font-weight:500;
    line-height:1.45;
  }
  body.app .confirm-modal-actions,
  body.app .confirm-modal-actions--end,
  body.app .modal-btn-row,
  body.app .modal-actions,
  body.app .login-forgot-actions,
  body.app .analytics-report-actions{
    display:flex;
    justify-content:stretch;
    align-items:stretch;
    gap:10px;
    width:100%;
  }
  body.app .confirm-modal-actions .modal-btn,
  body.app .confirm-modal-actions--end .modal-btn,
  body.app .modal-btn-row .modal-btn,
  body.app .modal-actions .modal-btn,
  body.app .login-forgot-actions .modal-btn,
  body.app .analytics-report-actions .modal-btn{
    flex:1 1 0;
    width:0;
    min-width:0;
    min-height:44px;
  }
  body.app .modal-overlay.modal-overlay--viewport{
    inset:0 !important;
    left:0 !important;
    right:0 !important;
    top:0 !important;
    bottom:0 !important;
    width:100% !important;
    z-index:3200;
    align-items:center;
    justify-content:center;
    padding:20px;
  }
  body.app .modal-btn--secondary{
    border-radius:12px;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    background:#fff;
    color:var(--login-ink,#1a2b2e);
    font-weight:600;
    box-shadow:none;
  }
  body.app .modal-btn--secondary:hover{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.45);
  }
  body.app .modal-btn--primary{
    background:var(--brand-teal-dark,#084a50);
    border-color:transparent;
    color:#fff;
    box-shadow:0 8px 18px rgba(8,74,80,.22);
  }
  body.app .modal-btn--primary:hover{
    background:var(--sidebar-deeper);
    color:#fff;
    box-shadow:0 10px 22px rgba(8,74,80,.28);
  }
  body.app .profile-panel-footer .profile-logout-btn.btn,
  body.app a.btn.profile-logout-btn{
    display:flex;
    width:100%;
    max-width:none;
    min-width:0;
    box-sizing:border-box;
    justify-content:center;
    align-items:center;
    min-height:44px;
    height:44px;
    padding:0 24px;
    border-radius:12px;
    font-weight:700;
    color:#dc2626;
    border:1.5px solid rgba(220,38,38,.28);
    background:#fff;
  }
  body.app .profile-panel-footer .profile-logout-btn.btn:hover,
  body.app a.btn.profile-logout-btn:hover{
    background:#fef2f2;
    border-color:rgba(220,38,38,.4);
    color:#b91c1c;
  }
  body.app .form--profile{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:14px 22px 20px;
    max-width:none;
    flex:1 1 auto;
  }
  body.app .form--profile .field-label{
    display:flex;
    flex-direction:column;
    gap:8px;
    font-weight:600;
    font-size:13px;
    color:var(--text);
  }
  body.app .profile-password-grid{
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
  }
  body.app .password-field--profile{
    display:flex;
    align-items:center;
    gap:4px;
    max-width:none;
    width:100%;
    padding:0 8px 0 14px;
    border:1.5px solid rgba(var(--primary-rgb),.14);
    border-radius:12px;
    background:#f8fbfb;
  }
  body.app .password-field--profile:focus-within{
    background:#fff;
    border-color:rgba(var(--primary-rgb),.42);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.1);
  }
  body.app .password-field--profile .input--password{
    flex:1;
    min-width:0;
    height:46px;
    padding:0;
    font-family:var(--font-sans);
    font-size:14px;
    background:transparent;
    border:none;
    box-shadow:none;
  }
  body.app .password-field--profile .input--password:focus{
    outline:none;
    box-shadow:none;
  }
  body.app .password-field--profile .input--password::-ms-reveal,
  body.app .password-field--profile .input--password::-ms-clear,
  body.app .password-field--profile input[type="password"]::-ms-reveal,
  body.app .password-field--profile input[type="password"]::-ms-clear{
    display:none;
    width:0;
    height:0;
  }
  body.app .password-field--profile .password-toggle,
  body.app .password-field--profile .btn.password-toggle,
  body.app .password-field--profile .btn.btn-sm.password-toggle{
    flex-shrink:0;
    min-width:0;
    width:auto;
    min-height:0;
    height:auto;
    padding:4px;
    border:none;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    color:var(--muted);
  }
  body.app .password-field--profile .password-toggle:hover,
  body.app .password-field--profile .btn.password-toggle:hover{
    background:transparent;
    border:none;
    box-shadow:none;
    color:var(--brand-teal-deep);
  }
  body.app .profile-password-hint{
    margin:0;
    padding:12px 14px;
    border-radius:12px;
    background:rgba(var(--primary-rgb),.07);
    border:1px solid rgba(var(--primary-rgb),.12);
    color:var(--brand-teal-deep);
    font-size:12.5px;
    font-weight:500;
    line-height:1.4;
  }
  body.app .profile-security-actions{
    display:flex;
    justify-content:stretch;
    margin-top:auto;
    padding-top:4px;
  }
  body.app .profile-security-actions .btn{
    width:100%;
    max-width:none;
    justify-content:center;
    min-height:44px;
    border-radius:12px;
    font-weight:700;
  }
  @media (max-width:980px){
    body.app .profile-page{
      grid-template-columns:1fr;
      max-width:none;
    }
  }
  @media (max-width:720px){
    body.app .profile-meta,
    body.app .profile-password-grid{
      grid-template-columns:1fr;
    }
    body.app .profile-hero{
      flex-direction:column;
      align-items:flex-start;
      text-align:left;
    }
    body.app .profile-panel-footer{justify-content:stretch}
  }
  /* Teacher profile (shared classes) */
  body.app .profile-identity{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:18px 20px;
    border:1px solid rgba(var(--primary-rgb),.16);
    box-shadow:var(--shadow-card);
    background:#e7f2f3;
  }
  body.app .profile-identity-main,
  body.app .profile-identity-copy{min-width:0}
  body.app .profile-identity-main{display:flex;align-items:center;gap:16px}
  body.app .profile-security{
    display:flex;
    flex-direction:column;
    border:1px solid rgba(var(--primary-rgb),.16);
    box-shadow:var(--shadow-card);
    background:#f3f5f6;
  }
  body.app .profile-security-head{align-items:flex-start;padding-bottom:4px}
  body.app .profile-security-head h2{margin:0 0 4px;color:var(--text)}
  body.app .profile-security-intro{margin:0;font-size:13px}
  body.app .profile-identity-actions{flex-shrink:0}
  @media (max-width:720px){
    body.app .profile-identity{flex-direction:column;align-items:flex-start}
    body.app .profile-identity-actions,
    body.app .profile-identity-actions .btn{width:100%}
  }

  body.app .print-only{display:none}

  @media print{
    /* Margins applied on content (Chrome ignores @page margins reliably). */
    @page{size:A4 portrait;margin:0}
    html:not(:has(#official-discrepancy-report)),
    body:not(:has(#official-discrepancy-report)){
      background:#fff !important;
      height:auto !important;
      overflow:visible !important;
    }
    html:has(#official-discrepancy-report),
    body.app:has(#official-discrepancy-report){
      background:#fff !important;
      height:100% !important;
      overflow:hidden !important;
    }
    body.app .sidebar,
    body.app .topbar,
    body.app .no-print,
    body.app .flash,
    body.app .account-success,
    body.app .analytics-panel,
    body.app .analytics-toolbar,
    body.app .analytics-report-actions,
    body.app .sy-combo-menu,
    body.app .modal-close,
    body.app .modal-btn-row{
      display:none !important;
    }
    body.app .shell,
    body.app .page,
    body.app .main{
      display:block !important;
      width:100% !important;
      max-width:none !important;
      padding:0 !important;
      margin:0 !important;
      box-shadow:none !important;
      background:#fff !important;
      overflow:visible !important;
      min-height:0 !important;
      height:auto !important;
    }
    body.app .print-only{display:inline !important}
    body.app .analytics-report-letterhead.print-only{display:block !important}
    body.app .analytics-report-logo.print-only,
    body.app .analytics-report-letterhead .analytics-report-logo{display:block !important}
    body.app .kpi{break-inside:avoid}

    body.app .modal-overlay.modal-overlay--main[hidden]{
      display:none !important;
    }
    body.app .modal-overlay.modal-overlay--main:not([hidden]):has(.analytics-report-modal){
      display:block !important;
      position:static !important;
      inset:auto !important;
      left:auto !important;
      top:auto !important;
      right:auto !important;
      bottom:auto !important;
      padding:0 !important;
      margin:0 !important;
      background:#fff !important;
      overflow:visible !important;
      align-items:stretch !important;
      height:auto !important;
      min-height:0 !important;
      box-shadow:none !important;
    }
    body.app .modal-overlay--main:not([hidden]) .analytics-report-modal.modal,
    body.app .modal-overlay--main:not([hidden]) .analytics-report-modal,
    body.app .modal-overlay--main .individual-compliance-modal{
      display:block !important;
      box-shadow:none !important;
      border:2px solid #084a50 !important;
      background:#fff !important;
      max-height:none !important;
      height:auto !important;
      min-height:0 !important;
      width:100% !important;
      max-width:none !important;
      margin:0 !important;
      padding:1.1cm 1.2cm 1.2cm !important;
      overflow:visible !important;
      box-sizing:border-box !important;
    }
    /* Outer page margin: keep sides/bottom, raise container toward the top */
    body.app:has(.modal-overlay--main:not([hidden]) .analytics-report-modal) .page{
      padding:0.35cm 0.9cm 0.9cm !important;
      box-sizing:border-box !important;
    }
    body.app .modal-overlay--main:not([hidden]) .analytics-report-modal.modal,
    body.app .modal-overlay--main:not([hidden]) .analytics-report-modal{
      margin-top:0 !important;
    }
    body.app .analytics-report-letterhead{
      display:block !important;
      margin:0 0 12px;
      padding:0 0 10px;
      border-bottom:1.5px solid var(--primary-color);
      text-align:center;
      white-space:normal;
    }
    body.app .analytics-report-letterhead-row{
      display:flex !important;
      align-items:center;
      justify-content:space-between;
      gap:14px;
      width:100%;
    }
    body.app .analytics-report-logo{
      display:block !important;
      width:68px;
      height:68px;
      object-fit:contain;
      flex:0 0 auto;
    }
    body.app .analytics-report-letterhead-text{
      flex:1 1 auto;
      min-width:0;
      text-align:center;
    }
    body.app .analytics-report-org,
    body.app .analytics-report-dept{
      display:block !important;
      margin:0;
      font-size:13px;
      font-weight:700;
      letter-spacing:.02em;
      text-transform:none;
      color:var(--primary-color);
      line-height:1.3;
    }
    body.app .analytics-report-dept{
      margin-top:2px;
      font-size:12px;
      font-weight:600;
      color:#475569;
    }
    body.app .analytics-report-dept::before{content:none !important}
    body.app .analytics-report-modal .individual-compliance-head{
      display:block !important;
      margin:0 0 10px !important;
    }
    body.app .analytics-report-modal h2{
      margin:0 0 4px;
      font-size:16px;
      line-height:1.25;
      text-align:center;
      color:var(--primary-color);
      white-space:nowrap;
    }
    body.app .analytics-report-period,
    body.app .analytics-report-generated{
      display:inline !important;
      text-align:center;
      margin:0;
      font-size:11px;
      font-weight:600;
      color:#475569;
      white-space:nowrap;
    }
    body.app .analytics-report-period{
      display:block !important;
      text-align:center;
    }
    body.app .analytics-report-table-wrap{
      overflow:visible !important;
      max-height:none !important;
      height:auto !important;
      border:1px solid #cbd5e1 !important;
      border-radius:0 !important;
      background:#fff !important;
    }
    body.app .analytics-report-table tbody tr.is-off-page{
      display:table-row !important;
    }
    body.app .analytics-report-pager{
      display:none !important;
    }
    body.app .analytics-report-table{
      table-layout:fixed !important;
      width:100% !important;
      font-size:10px !important;
      border-collapse:collapse !important;
      border:1px solid #334155 !important;
    }
    body.app .analytics-report-table thead th{
      position:static !important;
      background:#e8f3f4 !important;
      color:var(--primary-color) !important;
      white-space:normal !important;
      overflow:visible !important;
      text-overflow:clip !important;
      letter-spacing:.02em !important;
      line-height:1.25 !important;
      padding:8px 10px !important;
      border:1px solid #334155 !important;
      -webkit-print-color-adjust:exact;
      print-color-adjust:exact;
    }
    body.app .analytics-report-table tbody td{
      white-space:nowrap !important;
      overflow:hidden;
      text-overflow:ellipsis;
      padding:7px 10px !important;
      border:1px solid #64748b !important;
    }
    body.app .analytics-report-table--teachers th:nth-child(1),
    body.app .analytics-report-table--teachers td:nth-child(1){
      width:28% !important;
      text-align:left !important;
    }
    body.app .analytics-report-table--teachers th:nth-child(6),
    body.app .analytics-report-table--teachers td:nth-child(6){
      width:16% !important;
      text-align:center !important;
    }
    body.app .analytics-report-table tbody tr{break-inside:avoid}
  }

  /* =========================================================
     BUTTON SYSTEM â€” master: Compliance â€œSee all complianceâ€
     (.btn.btn-primary). Shape/size/type shared; color is semantic.
     ========================================================= */
  body.app .btn,
  body.app .qa-btn,
  body.app .register-primary-btn,
  body.app .shared-drive-upload-btn,
  body.app .register-sort-select{
    box-sizing:border-box;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    min-height:var(--tracked-btn-h);
    height:var(--tracked-btn-h);
    padding:0 var(--tracked-btn-px);
    border-radius:var(--tracked-btn-r);
    font-family:inherit;
    font-size:var(--tracked-btn-fs);
    font-weight:var(--tracked-btn-fw);
    line-height:1;
    white-space:nowrap;
    box-shadow:none;
    cursor:pointer;
    text-decoration:none;
    transition:background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
  }
  body.app .btn.btn-sm,
  body.app .btn.sm{
    min-height:var(--tracked-btn-h);
    height:var(--tracked-btn-h);
    padding:0 var(--tracked-btn-px);
    font-size:var(--tracked-btn-fs);
    font-weight:var(--tracked-btn-fw);
    border-radius:var(--tracked-btn-r);
  }
  body.app .password-field--profile .btn.btn-sm.password-toggle,
  body.app .password-field--profile .btn.sm.password-toggle{
    min-width:0;
    width:auto;
    min-height:0;
    height:auto;
    padding:4px;
    border:none;
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  body.app .btn-primary,
  body.app .qa-btn.btn-primary,
  body.app .register-primary-btn,
  body.app .shared-drive-upload-btn,
  body.app .add-document-submit,
  body.app .dashboard-notifications .panel-head .btn,
  body.app .dashboard-submissions .panel-head .btn,
  body.app .modal-btn--primary,
  body.app .login-submit{
    background:var(--button);
    background-color:#0d6a72;
    border:none;
    color:#fff;
    box-shadow:none;
  }
  body.app .btn-primary:hover,
  body.app .qa-btn.btn-primary:hover,
  body.app .register-primary-btn:hover,
  body.app .shared-drive-upload-btn:hover,
  body.app .add-document-submit:hover,
  body.app .dashboard-notifications .panel-head .btn:hover,
  body.app .dashboard-submissions .panel-head .btn:hover,
  body.app .modal-btn--primary:hover,
  body.app .login-submit:hover{
    background:var(--button-hover);
    background-color:#0a555c;
    color:#fff;
    border:none;
    box-shadow:none;
  }
  body.app .page .register-pagination .register-page-btn.is-active,
  body.app .register-page-btn.is-active{
    background:var(--button);
    background-color:#0d6a72;
    color:#fff;
  }
  body.app .page .register-pagination .register-page-btn.is-active:hover,
  body.app .register-page-btn.is-active:hover{
    background:var(--button-hover);
    background-color:#0a555c;
    color:#fff;
  }
  body.app .panel-head .btn.btn-primary.dash-view-all{
    background:var(--button);
    background-color:#0d6a72;
    border-color:#0d6a72;
    color:#fff;
  }
  body.app .panel-head .btn.btn-primary.dash-view-all:hover,
  body.app .panel-head .btn.btn-primary.dash-view-all:focus-visible{
    background:var(--button-hover);
    background-color:#0a555c;
    color:#fff;
  }
  body.app .register-sort-select{
    appearance:none;
    -webkit-appearance:none;
    width:auto;
    min-width:168px;
    max-height:var(--tracked-btn-h);
    padding:0 36px 0 var(--tracked-btn-px);
    border:1.5px solid rgba(var(--primary-rgb),.28);
    background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%23084a50' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;
    color:var(--brand-teal-deep);
    cursor:pointer;
  }
  body.app .register-sort-select:focus{
    outline:none;
    border-color:var(--brand-teal);
    box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12);
  }
  body.app .btn:not(.btn-primary):not(.btn-danger):not(.btn-success):not(.password-toggle),
  body.app .btn-secondary:not(.password-toggle),
  body.app .qa-btn:not(.btn-primary){
    background:#fff;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    color:var(--brand-teal-deep);
    box-shadow:none;
  }
  body.app .btn:not(.btn-primary):not(.btn-danger):not(.btn-success):not(.password-toggle):hover,
  body.app .btn-secondary:not(.password-toggle):hover,
  body.app .qa-btn:not(.btn-primary):hover{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.45);
    color:var(--brand-teal-deep);
  }
  body.app .school-cal-top-left .btn.school-cal-edit-btn:not(.btn-danger):not(.btn-success){
    width:132px;
    min-width:132px;
    max-width:132px;
    height:38px;
    padding:0 12px;
    border-radius:10px;
    font-size:13px;
    font-weight:700;
    background:#fff;
    border:1.5px solid rgba(var(--primary-rgb),.28);
    color:var(--brand-teal-deep);
    box-shadow:none;
  }
  body.app .school-cal-top-left .btn.school-cal-edit-btn:not(.btn-danger):not(.btn-success):hover{
    background:var(--primary-light);
    border-color:rgba(var(--primary-rgb),.45);
    color:var(--brand-teal-deep);
  }
  body.app .school-cal-top-left .btn.school-cal-edit-btn.is-active:not(.btn-danger):not(.btn-success),
  body.app .school-cal-top-left .btn.school-cal-edit-btn[aria-pressed="true"]:not(.btn-danger):not(.btn-success),
  body.app .school-cal-top-left .btn.school-cal-edit-btn.is-active:not(.btn-danger):not(.btn-success):hover,
  body.app .school-cal-top-left .btn.school-cal-edit-btn[aria-pressed="true"]:not(.btn-danger):not(.btn-success):hover{
    background:var(--button);
    background-color:#0d6a72;
    border-color:#0d6a72;
    color:#fff;
    box-shadow:none;
  }
  body.app .btn-danger{
    background:#fff;
    border:1.5px solid #e2c4c2;
    color:var(--danger);
    box-shadow:none;
  }
  body.app .btn-danger:hover{
    background:#f8efee;
    border-color:#d4a8a5;
    color:var(--danger);
  }
  body.app .btn-success{
    background:var(--success);
    border:none;
    color:#fff;
    box-shadow:none;
  }
  body.app .btn-success:hover{
    background:#246b4a;
    color:#fff;
  }
  body.app .btn:focus-visible,
  body.app .qa-btn:focus-visible,
  body.app .register-primary-btn:focus-visible,
  body.app .shared-drive-upload-btn:focus-visible,
  body.app .register-icon-btn:focus-visible,
  body.app .tf-filter-ico:focus-visible{
    outline:2px solid var(--brand-teal);
    outline-offset:2px;
  }
  body.app .btn:disabled,
  body.app .btn[disabled],
  body.app .qa-btn:disabled{
    opacity:.5;
    cursor:not-allowed;
    box-shadow:none;
  }
  body.app .register-icon-btn,
  body.app .tf-filter-ico{
    width:auto;
    height:auto;
    min-width:28px;
    min-height:28px;
    padding:0;
    border:none;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    box-sizing:border-box;
    transition:color .15s ease;
  }
  body.app .register-icon-btn:hover,
  body.app .register-icon-btn:focus-visible,
  body.app .register-icon-btn--resend,
  body.app .register-icon-btn--ok,
  body.app .register-icon-btn--ok:hover,
  body.app .register-icon-btn--ok:focus-visible,
  body.app .register-icon-btn--danger:hover,
  body.app .register-icon-btn--danger:focus-visible,
  body.app .register-icon-btn--neutral,
  body.app .register-icon-btn--neutral:hover,
  body.app .register-icon-btn--neutral:focus-visible{
    border:none;
    background:transparent;
    box-shadow:none;
  }
  body.app.page-teachers-record .table--register .register-icon-btn,
  body.app.page-teachers-record .table--register .register-icon-btn:hover,
  body.app.page-teachers-record .table--register .register-icon-btn:focus-visible,
  body.app.page-teachers-record .table--register .register-icon-btn--resend,
  body.app.page-teachers-record .table--register .register-icon-btn--ok,
  body.app.page-teachers-record .table--register .register-icon-btn--ok:hover,
  body.app.page-teachers-record .table--register .register-icon-btn--ok:focus-visible,
  body.app.page-teachers-record .table--register .register-icon-btn--danger:hover,
  body.app.page-teachers-record .table--register .register-icon-btn--danger:focus-visible{
    width:auto;
    height:auto;
    min-width:28px;
    min-height:28px;
    padding:0;
    border:none;
    background:transparent;
    border-radius:0;
    box-shadow:none;
  }
  body.app.page-teachers-record .table--register .register-icon-btn:hover,
  body.app.page-teachers-record .table--register .register-icon-btn:focus-visible{
    color:var(--brand-teal);
  }
  body.app.page-teachers-record .table--register .register-icon-btn--danger:hover,
  body.app.page-teachers-record .table--register .register-icon-btn--danger:focus-visible{
    color:#991b1b;
  }
  body.app.page-teachers-record .table--register .register-icon-btn--ok:hover,
  body.app.page-teachers-record .table--register .register-icon-btn--ok:focus-visible{
    color:#065f46;
  }
  body.app .assign-task-actions .btn{
    min-height:var(--tracked-btn-h);
  }
  body.app .shared-drive-upload-btn{
    transform:none;
  }
  body.app .compliance-tab{
    border-radius:var(--tracked-btn-r);
    font-weight:700;
    font-size:14px;
    padding:11px 14px;
    transition:background .15s ease, color .15s ease;
  }
  body.app .compliance-tab.is-active,
  body.app .profile-tabs .compliance-tab.is-active,
  body.app .notice-mgmt-tabs .compliance-tab.is-active{
    background:var(--button);
    background-color:#0d6a72;
    color:#fff;
    box-shadow:none;
  }
  body.app .notice-mgmt-tabs .compliance-tab{
    padding:11px 14px;
    font-size:14px;
  }
  body.app .compliance-tabs.profile-tabs{
    flex-shrink:0;
    width:100%;
    align-self:stretch;
    margin:0;
  }
  body.app .profile-tabs .compliance-tab{
    flex:1 1 0;
  }
  body.app.page-teachers-record .register-panel .panel-head--row{
    flex-wrap:nowrap;
    align-items:center;
  }
  body.app.page-teachers-record .register-panel .panel-head--row > div:first-child{
    flex:1 1 auto;
    min-width:0;
  }
  body.app.page-teachers-record .register-panel-actions{
    gap:12px;
    flex-wrap:nowrap;
    align-items:center;
    flex:0 1 auto;
    min-width:0;
  }
  body.app.page-teachers-record .register-panel-actions > *{
    margin:0;
  }
  body.app.page-teachers-record .register-panel-actions .search-form.register-search{
    flex:0 1 var(--search-bar-w);
    min-width:var(--search-bar-min);
    max-width:var(--search-bar-max);
    width:var(--search-bar-w);
  }
  body.app.page-teachers-record .register-panel-actions .register-sort-form{
    display:flex;
    align-items:center;
    margin:0;
  }
  body.app.page-teachers-record .register-panel-actions .register-primary-btn{
    white-space:nowrap;
  }
  body.app.page-teachers-record .modal--register .form--register input.input,
  body.app.page-teachers-record .modal--register .form--register select.input,
  body.app.page-teachers-record .modal--register .form--register .sy-combo-trigger,
  body.app.page-teachers-record .modal--register .form--register .modal-btn-row .modal-btn,
  body.app.page-teachers-record .modal--register .form--register .modal-btn-row .btn{
    box-sizing:border-box;
    height:44px;
    min-height:44px;
    max-height:44px;
  }
  body.app.page-teachers-record .table.table--register{
    table-layout:fixed;
    width:100%;
  }
  body.app.page-teachers-record .table--register th.th-num,
  body.app.page-teachers-record .table--register td.td-num{width:56px;text-overflow:clip}
  body.app.page-teachers-record .table--register th.th-name{width:20%}
  body.app.page-teachers-record .table--register th.th-email{width:24%}
  body.app.page-teachers-record .table--register th.th-level,
  body.app.page-teachers-record .table--register th.th-position{width:13%}
  body.app.page-teachers-record .table--register th.th-role,
  body.app.page-teachers-record .table--register th.th-scope{width:11%}
  body.app.page-teachers-record .table--register th.th-status{width:10%}
  body.app.page-teachers-record .table--register th.th-credentials{width:11%}
  body.app.page-teachers-record .table--register th.th-actions,
  body.app.page-teachers-record .table--register td.td-actions{width:120px;text-align:right}
  body.app.page-teachers-record .table--register td.td-actions .register-actions{
    justify-content:flex-end;
  }
  body.app.page-teachers-record .table--register th,
  body.app.page-teachers-record .table--register td{
    text-align:left;
  }
  body.app.page-teachers-record .table--register th.th-actions{
    text-align:right;
  }
  @media (max-width:900px){
    body.app.page-teachers-record .register-panel .panel-head--row,
    body.app.page-teachers-record .register-panel-actions{
      flex-wrap:wrap;
    }
  }
  body.app.page-teachers-record .register-panel-actions .register-search .search{
    height:var(--search-bar-h);
    min-height:var(--search-bar-h);
    padding:0 16px;
    border-radius:10px;
  }
  body.app.page-teachers-record .register-panel-actions .register-search .input--search{
    font-size:14px;
  }
  body.app.page-teachers-record .register-panel-actions .register-sort-select,
  body.app.page-teachers-record .register-panel-actions .register-primary-btn{
    height:42px;
    min-height:42px;
    max-height:42px;
    font-size:14px;
  }
  body.app.page-teachers-record .register-panel-actions .register-sort-select{
    min-width:190px;
  }
  body.app.page-teachers-record .register-panel-actions .register-primary-btn{
    padding:0 20px;
  }
  body.app .add-document-page-form .btn.btn-primary.add-document-submit{
    display:flex;
    width:100%;
    max-width:none;
    height:48px;
    min-height:48px;
    padding:0 24px;
    border-radius:12px;
    font-size:15px;
    font-weight:700;
    letter-spacing:.02em;
  }

  /* â€”â€” System-wide type & ink (content surfaces) â€”â€” */
  body.app .main,
  body.app .page,
  body.app .modal,
  body.app .topbar{
    font-family:var(--font-sans);
    color:var(--text);
  }
  body.app .page h1,
  body.app .page h2,
  body.app .page h3,
  body.app .modal h2,
  body.app .modal h3,
  body.app .al-head-copy h2,
  body.app .profile-name,
  body.app .shared-drive-card-title,
  body.app .disc-card-title{
    font-family:var(--font-sans);
    color:var(--text-heading);
  }
  body.app .table td,
  body.app .input,
  body.app select,
  body.app textarea,
  body.app .password-field .input--password,
  body.app .password-field--profile .input--password{
    font-family:var(--font-sans);
    color:var(--text);
  }
  body.app .page a:not(.btn):not(.qa-btn):not(.nav-link):not(.modal-btn):not(.modal-close):not(.folder-card):not(.notif-card):not(.kpi):not(.kpi-hit):not(.topbar-notif-card):not(.topbar-dropdown-link):not(.al-activity-link):not(.al-go):not(.compliance-tab):not(.register-page-btn):not(.compliance-folder-link):not(.notif-tab):not(.nod-doc-btn){
    color:var(--text-accent);
  }
  body.app .page ::placeholder,
  body.app .modal ::placeholder,
  body.app .topbar ::placeholder{
    color:var(--muted);
    opacity:1;
  }
  body.app .al-th svg,
  body.app .al-when-time,
  body.app .al-go{
    color:var(--muted);
  }
  body.app .al-person-name,
  body.app .al-details,
  body.app .al-when-date{
    color:var(--text);
    font-family:var(--font-sans);
  }
  body.app .al-person-ico{
    color:var(--muted);
  }

  /* Keep pagination docked at the bottom of the list, including short last pages.
     Dashboards are excluded: they contain .register-pagination but must use normal page scroll. */
  html:has(body.app .page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)),
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard){
    height:100%;
  }
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard) .shell{
    height:100vh;
    height:100dvh;
    max-height:100dvh;
    overflow:hidden;
  }
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard) .main{
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard) .topbar{
    flex-shrink:0;
  }
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard) .page{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    padding-bottom:16px;
  }
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard) .page > .flash,
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard) .page > .toolbar,
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard) .page > .grid.kpis,
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard) .page > .compliance-tabs,
  body.app:has(.page .register-pagination:not([hidden]):not(.analytics-report-pager)):not(:has(.dashboard-grid)):not(:has(.dashboard-grid--teacher)):not(.page-teacher-dashboard) .page > nav{
    flex-shrink:0;
  }
  body.app .page .register-pagination{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:nowrap;
    gap:6px;
    margin-top:auto;
    flex-shrink:0;
    position:relative;
    z-index:2;
  }
  body.app .page .register-pagination .register-page-btn{
    flex:0 0 auto;
  }

  /* Dashboards must use normal document scrolling.
     The pagination viewport-lock above traps Admin dashboard because it
     contains .register-pagination inside submissions/notifications panels. */
  html:has(body.app .dashboard-grid),
  html:has(body.app .dashboard-grid--teacher),
  html:has(body.app.page-teacher-dashboard),
  body.app:has(.dashboard-grid),
  body.app:has(.dashboard-grid--teacher),
  body.app.page-teacher-dashboard{
    height:auto;
  }
  body.app:has(.dashboard-grid) .shell,
  body.app:has(.dashboard-grid--teacher) .shell,
  body.app.page-teacher-dashboard .shell{
    height:auto;
    max-height:none;
    min-height:100vh;
    overflow:visible;
  }
  body.app:has(.dashboard-grid) .main,
  body.app:has(.dashboard-grid--teacher) .main,
  body.app.page-teacher-dashboard .main{
    overflow:visible;
    min-height:0;
    height:auto;
  }
  body.app:has(.dashboard-grid) .page,
  body.app:has(.dashboard-grid--teacher) .page,
  body.app.page-teacher-dashboard .page{
    flex:0 0 auto;
    height:auto;
    max-height:none;
    min-height:0;
    overflow:visible;
    display:block;
  }
  body.app:has(.dashboard-grid) .dashboard-submissions,
  body.app:has(.dashboard-grid) .dashboard-notifications,
  body.app:has(.dashboard-grid--teacher) .dashboard-submissions,
  body.app:has(.dashboard-grid--teacher) .dashboard-notifications,
  body.app.page-teacher-dashboard .dashboard-submissions,
  body.app.page-teacher-dashboard .dashboard-notifications{
    flex:0 0 auto;
  }
  body.app:has(.dashboard-grid) .dashboard-submissions .table-wrap--scroll,
  body.app:has(.dashboard-grid) .dashboard-notifications .scroll-panel--notifications,
  body.app:has(.dashboard-grid) .dashboard-notifications .disc-list,
  body.app:has(.dashboard-grid--teacher) .dashboard-submissions .table-wrap--scroll,
  body.app.page-teacher-dashboard .dashboard-submissions .table-wrap--scroll,
  body.app.page-teacher-dashboard .dashboard-notifications .table-wrap--scroll{
    max-height:none;
    overflow:visible;
    flex:0 0 auto;
  }
  /* Admin Compliance Overview + Notifications: same card height, same viewport. */
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-submissions,
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-notifications{
    align-self:stretch;
    height:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
  }
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-submissions .table-wrap--scroll,
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-notifications .scroll-panel--notifications,
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-notifications .disc-list{
    flex:1 1 auto;
    min-height:320px;
    height:min(420px,48vh);
    max-height:min(420px,48vh);
    overflow:hidden;
    scrollbar-width:none;
    -ms-overflow-style:none;
  }
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-submissions .table-wrap--scroll::-webkit-scrollbar,
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-notifications .scroll-panel--notifications::-webkit-scrollbar,
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-notifications .disc-list::-webkit-scrollbar{
    width:0;
    height:0;
    display:none;
  }
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-notifications .scroll-panel--notifications{
    display:flex;
    flex-direction:column;
  }
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-notifications .notif-empty{
    flex:1 1 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:0;
    padding:28px 10px;
  }
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-submissions .table-wrap--scroll .empty-state{
    min-height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
  }
  body.app .page :is(
    .card,
    .panel,
    .register-panel,
    .register-page,
    .add-document-library,
    .assign-task-targets,
    .compliance-monitor-wrap,
    .compliance-split-detail,
    .compliance-split-folders,
    .notice-management-panel,
    .activity-log-panel,
    .teacher-files-panel,
    .shared-drive-panel,
    .teacher-compliance-page,
    .teacher-compliance-panel,
    .notif-page-list,
    .tf-file-list-wrap--page
  ):not(.dashboard-submissions):not(.dashboard-notifications):has(.register-pagination:not([hidden])){
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
  }
  body.app .page :is(.add-document-split, .compliance-split):has(.register-pagination:not([hidden])){
    flex:1 1 auto;
    min-height:0;
    align-items:stretch;
  }
  body.app .page :is(
    .card,
    .panel,
    .register-panel,
    .compliance-split-detail,
    .compliance-split-folders,
    .notice-management-panel,
    .teacher-files-panel,
    .shared-drive-panel,
    .tf-file-list-wrap--page
  ):has(> .register-pagination:not([hidden])) > :is(
    .table-wrap,
    .folder-grid,
    .shared-drive-grid,
    .scroll-panel,
    .tf-file-list-wrap,
    .tf-folder-drive-wrap,
    .notif-stack,
    .disc-list
  ){
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }
  body.app .page .activity-log-panel:has(.register-pagination) > .activity-log-table-wrap,
  body.app .page .activity-log-panel:has(> .register-pagination) > .activity-log-table-wrap,
  body.app .page .activity-log-panel:has(> .register-pagination) > .table-wrap{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }
  body.app .add-document-library > .table-wrap{
    flex:0 1 auto;
    min-height:0;
    overflow:hidden;
  }
  body.app .page:has(> .notif-page-list .notif-pager) > .notif-page-list{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }
  body.app .page:has(> .notif-page-list .notif-pager){
    overflow:hidden;
  }
  body.app #teacher-pick:has(.register-pagination:not([hidden])){
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
  }
  body.app #teacher-pick:has(> .register-pagination:not([hidden])) > .compliance-teacher-pick{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
  }
  body.app .analytics-report-pager{
    margin-top:auto;
  }
  body.app .is-off-page{
    display:none !important;
  }
  body.app .dashboard-submissions:has(.register-pagination) .table-wrap--scroll,
  body.app .dashboard-notifications:has(.register-pagination) .scroll-panel--notifications,
  body.app .dashboard-notifications:has(.register-pagination) .disc-list{
    max-height:min(420px,48vh);
    overflow:hidden;
  }
  /* Dashboard pages: grow with content and use document scroll instead of a locked pane. */
  body.app:has(.dashboard-grid) .dashboard-submissions:has(.register-pagination) .table-wrap--scroll,
  body.app:has(.dashboard-grid) .dashboard-notifications:has(.register-pagination) .scroll-panel--notifications,
  body.app:has(.dashboard-grid) .dashboard-notifications:has(.register-pagination) .disc-list,
  body.app.page-teacher-dashboard .dashboard-submissions .table-wrap--scroll,
  body.app.page-teacher-dashboard .dashboard-notifications .table-wrap--scroll{
    max-height:none;
    overflow:visible;
  }
  /* Admin only: fixed list viewport so fit-page paginates to screen size (no inner scroll). */
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-submissions:has(.register-pagination) .table-wrap--scroll,
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-notifications:has(.register-pagination) .scroll-panel--notifications,
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-notifications:has(.register-pagination) .disc-list{
    max-height:min(420px,48vh);
    min-height:280px;
    overflow:hidden;
  }
  body.app:has(.dashboard-grid):not(:has(.dashboard-grid--teacher)) .dashboard-submissions:has(.register-pagination) .table-wrap--scroll{
    min-height:320px;
    overflow-x:hidden;
    overflow-y:hidden;
  }
  body.app .dashboard-teacher-row .dashboard-submissions:has(.register-pagination) .table-wrap--scroll,
  body.app .dashboard-teacher-row .dashboard-notifications:has(.register-pagination) .disc-list{
    overflow:visible;
    flex:0 0 auto;
    min-height:0;
    max-height:none;
  }
  body.app.page-teacher-dashboard .dashboard-submissions:has(.register-pagination) .table-wrap--scroll,
  body.app.page-teacher-dashboard .dashboard-notifications:has(.register-pagination) .table-wrap--scroll{
    max-height:none;
    overflow:visible;
    flex:0 0 auto;
    min-height:0;
  }
  body.app .analytics-report-modal .table-wrap,
  body.app .individual-compliance-table-wrap,
  body.app .disc-forms-list-wrap{
    overflow:hidden;
  }

  /* Teacher Discrepancy LIST only (.teacher-disc-panel).
     Completes the viewport fill chain so the white card cannot collapse/clip
     the table. Does not apply to Teacher ?form= review (no .teacher-disc-panel). */
  html:has(body.app.page-teacher-discrepancy .teacher-disc-panel),
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel){
    height:100%;
  }
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .shell{
    height:100vh;
    height:100dvh;
    max-height:100dvh;
    overflow:hidden;
  }
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .main{
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .page{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .page > .flash,
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .page > .page-controls,
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .page > .toolbar,
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .page > .grid.kpis,
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .page > .notice-mgmt-tabs{
    flex-shrink:0;
  }
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .page > .notice-mgmt-tabs{
    width:100%;
    max-width:100%;
    box-sizing:border-box;
  }
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .teacher-disc-panel{
    display:flex;
    flex-direction:column;
    flex:1;
    min-height:0;
    overflow:hidden;
  }
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .teacher-disc-panel .panel-head,
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) #teacher-disc-pager{
    flex-shrink:0;
  }
  body.app.page-teacher-discrepancy:has(.teacher-disc-panel) .page .teacher-disc-panel .notice-mgmt-table-wrap.table-wrap{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;
    padding:16px 18px 20px;
  }
  body.app #teacher-folder-modal .tf-folder-grid-wrap{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;
  }
  body.app #teacher-folder-modal .folder-grid--teacher-files{
    overflow:visible;
    height:auto;
  }
  body.app #teacher-folder-modal .tf-wlp-folder{
    flex:1 1 auto;
    min-height:0;
    width:100%;
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(300px, 360px);
    gap:16px;
    align-items:start;
    overflow:auto;
    padding-top:8px;
  }
  body.app #teacher-folder-modal .tf-wlp-main{
    min-width:0;
  }
  body.app #teacher-folder-modal .tf-folder-plain{
    flex:1 1 auto;
    min-height:0;
    min-width:0;
    display:flex;
    flex-direction:column;
    overflow:hidden;
  }
  body.app #teacher-folder-modal .tf-wlp-files{
    min-width:0;
    min-height:0;
    overflow:hidden;
    display:flex;
    flex-direction:column;
  }
  body.app #teacher-folder-modal .tf-wlp-files > .tf-file-list-wrap,
  body.app #teacher-folder-modal .tf-folder-plain > .tf-wlp-files > .tf-file-list-wrap{
    flex:1 1 auto;
    min-height:0;
    height:auto;
    overflow:hidden;
  }
  body.app .tf-wlp-folder{
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(300px, 360px);
    gap:14px;
    align-items:stretch;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    padding:8px 18px 12px;
  }
  body.app .tf-wlp-main{
    min-width:0;
    display:flex;
    flex-direction:column;
    min-height:0;
    overflow:hidden;
  }
  body.app .tf-wlp-folder .tf-view-head--wlp{
    padding:4px 0 10px;
    flex-shrink:0;
  }
  body.app .tf-wlp-folder .tf-wlp-files{
    min-width:0;
    min-height:0;
    flex:1 1 auto;
    overflow:auto;
  }
  body.app .tf-folder-plain > .tf-wlp-main{
    flex:1 1 auto;
    min-height:0;
  }
  body.app .wlp-checklist-side{
    width:100%;
    min-width:300px;
    max-width:360px;
    box-sizing:border-box;
    display:flex;
    flex-direction:column;
    min-height:0;
    max-height:100%;
    height:100%;
    overflow:hidden;
    border:1px solid rgba(var(--primary-rgb),.14);
    border-radius:16px;
    background:linear-gradient(180deg,#fff 0%, #f7fbfa 100%);
    box-shadow:0 10px 28px rgba(8,52,58,.07);
    padding:0;
    align-self:stretch;
    margin-top:0;
  }
  body.app .wlp-checklist-head{
    padding:12px 14px 10px;
    border-bottom:1px solid rgba(var(--primary-rgb),.1);
    background:linear-gradient(135deg, rgba(var(--primary-rgb),.1) 0%, rgba(var(--primary-rgb),.03) 100%);
    border-radius:16px 16px 0 0;
    flex-shrink:0;
  }
  body.app .wlp-checklist-side h2{
    margin:0;
    font-size:1.02rem;
    font-weight:800;
    line-height:1.25;
    color:var(--brand-teal-deep);
    word-break:break-word;
  }
  body.app .wlp-checklist-meta{
    margin:0;
    font-size:12.5px;
    color:var(--muted);
    word-break:break-word;
  }
  body.app .wlp-checklist-side > .wlp-week-form,
  body.app .wlp-checklist-side > .wlp-week-stepper,
  body.app .wlp-checklist-side > .wlp-checklist-progress-block,
  body.app .wlp-checklist-side > .wlp-subject-list,
  body.app .wlp-checklist-side > .wlp-checklist-meta{
    margin-left:12px;
    margin-right:12px;
  }
  body.app .wlp-checklist-side > .wlp-week-form,
  body.app .wlp-checklist-side > .wlp-week-stepper{
    margin-top:10px;
    margin-bottom:8px;
    flex-shrink:0;
  }
  body.app .wlp-week-stepper{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    min-width:0;
  }
  body.app .wlp-week-month{
    font-size:1.05rem;
    font-weight:800;
    color:var(--brand-teal-deep);
    line-height:1.2;
    text-align:center;
  }
  body.app .wlp-week-step{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-width:0;
  }
  body.app .wlp-week-step-label{
    min-width:4.5rem;
    text-align:center;
    font-size:13.5px;
    font-weight:750;
    color:var(--text);
  }
  body.app .wlp-week-step-btn{
    width:28px;
    height:28px;
    border:1px solid rgba(var(--primary-rgb),.2);
    border-radius:8px;
    background:#fff;
    color:var(--brand-teal-deep);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
    flex:0 0 auto;
  }
  body.app a.wlp-week-step-btn:hover{
    border-color:rgba(var(--primary-rgb),.45);
    background:rgba(var(--primary-rgb),.08);
  }
  body.app .wlp-week-step-btn.is-disabled{
    opacity:.35;
    cursor:default;
  }
  body.app .wlp-checklist-side > .wlp-checklist-progress-block{
    flex-shrink:0;
  }
  body.app .wlp-checklist-side > .wlp-subject-list{
    flex:1 1 auto;
    min-height:0;
    overflow-x:hidden;
    overflow-y:auto;
    margin-bottom:10px;
    padding-right:2px;
    -webkit-overflow-scrolling:touch;
  }
  body.app .wlp-checklist-progress-block{
    margin:0 12px 8px;
    padding:8px 10px;
    border-radius:12px;
    background:rgba(var(--primary-rgb),.06);
    border:1px solid rgba(var(--primary-rgb),.08);
  }
  body.app .wlp-checklist-progress-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    margin-bottom:8px;
  }
  body.app .wlp-checklist-progress{
    margin:0;
    font-size:12px;
    font-weight:700;
    color:var(--brand-teal-deep);
    letter-spacing:.02em;
    text-transform:uppercase;
  }
  body.app .wlp-checklist-progress-count{
    font-size:13px;
    font-weight:800;
    color:var(--brand-teal-deep);
  }
  body.app .wlp-progress-track{
    height:8px;
    border-radius:999px;
    background:rgba(var(--primary-rgb),.12);
    overflow:hidden;
  }
  body.app .wlp-progress-fill{
    display:block;
    height:100%;
    border-radius:inherit;
    background:var(--brand-teal);
    transition:width .25s ease;
  }
  body.app .wlp-checklist-progress-sub{
    margin:6px 0 0;
    font-size:11.5px;
    color:var(--muted);
    font-weight:500;
  }
  body.app .wlp-week-form{
    min-width:0;
    max-width:100%;
  }
  body.app .wlp-week-form .field-label,
  body.app .wlp-week-label{
    display:block;
    min-width:0;
    max-width:100%;
    font-size:12px;
    font-weight:700;
    color:var(--muted);
    margin:0;
  }
  body.app .wlp-week-form .input,
  body.app .wlp-week-form select.input,
  body.app .wlp-week-select{
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:38px;
    box-sizing:border-box;
    margin-top:6px;
    border-radius:10px;
    border:1px solid rgba(var(--primary-rgb),.18);
    background:#fff;
    color:var(--text);
    font-size:13px;
    padding:8px 10px;
  }
  body.app .wlp-subject-list{
    list-style:none;
    margin:0;
    padding:0;
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:6px;
  }
  body.app .wlp-subject-item{
    padding:0;
    border:none;
    min-width:0;
  }
  body.app .wlp-subject-row{
    display:flex;
    align-items:center;
    gap:6px;
    min-width:0;
  }
  body.app .wlp-subject-row > .wlp-subject-check{
    flex:1 1 auto;
    min-width:0;
  }
  body.app .wlp-subject-actions{
    flex:0 0 auto;
    align-self:center;
  }
  body.app .wlp-subject-actions .register-icon-btn{
    width:32px;
    height:32px;
  }
  body.app .wlp-week-label--bare{
    gap:0;
  }
  body.app .wlp-subject-check{
    display:flex;
    align-items:flex-start;
    gap:8px;
    font-weight:650;
    min-width:0;
    padding:7px 10px;
    border-radius:10px;
    border:1px solid rgba(var(--primary-rgb),.1);
    background:#fff;
    cursor:default;
  }
  body.app .wlp-subject-item.is-submitted .wlp-subject-check{
    border-color:rgba(var(--primary-rgb),.22);
    background:rgba(var(--primary-rgb),.05);
  }
  body.app .wlp-subject-item.is-overdue .wlp-subject-check{
    border-color:rgba(180,83,9,.28);
    background:rgba(180,83,9,.06);
  }
  body.app .wlp-subject-check input{
    position:absolute;
    opacity:0;
    pointer-events:none;
    width:1px;
    height:1px;
  }
  body.app .wlp-subject-box{
    flex:0 0 auto;
    width:18px;
    height:18px;
    margin-top:1px;
    border-radius:6px;
    border:1.7px solid rgba(var(--primary-rgb),.35);
    background:#fff;
    box-sizing:border-box;
    position:relative;
  }
  body.app .wlp-subject-check input:checked + .wlp-subject-box{
    background:var(--brand-teal);
    border-color:var(--brand-teal);
  }
  body.app .wlp-subject-check input:checked + .wlp-subject-box::after{
    content:"";
    position:absolute;
    left:5px;
    top:2px;
    width:5px;
    height:9px;
    border:solid #fff;
    border-width:0 2px 2px 0;
    transform:rotate(45deg);
  }
  body.app .wlp-subject-copy{
    min-width:0;
    flex:1 1 auto;
    display:flex;
    flex-direction:column;
    gap:3px;
  }
  body.app .wlp-subject-label{
    min-width:0;
    word-break:break-word;
    line-height:1.3;
    font-size:13.5px;
    font-weight:750;
    color:var(--text);
  }
  body.app .wlp-subject-status{
    margin:0;
    font-size:11.5px;
    font-weight:600;
    word-break:break-word;
    color:var(--muted);
  }
  body.app .wlp-subject-item.is-missing .wlp-subject-status{
    color:#9a3412;
  }
  body.app .wlp-subject-item.is-overdue .wlp-subject-status{
    color:#b45309;
  }
  body.app .wlp-subject-item.is-submitted .wlp-subject-status{
    color:var(--brand-teal-deep);
  }
  body.app .wlp-subject-item.is-overdue-completed .wlp-subject-check{
    border-color:rgba(180,83,9,.28);
    background:rgba(15,118,110,.05);
  }
  body.app .wlp-subject-item.is-overdue-completed .wlp-subject-status{
    color:#b45309;
  }
  body.app .teacher-subjects-fieldset{
    border:1px solid rgba(var(--primary-rgb),.14);
    border-radius:10px;
    padding:10px 12px 12px;
    margin:0 0 12px;
  }
  body.app .teacher-subjects-fieldset legend{
    padding:0 4px;
    font-weight:700;
  }
  body.app .teacher-subjects-fieldset .req-star{
    color:#b45309;
  }
  body.app .teacher-subjects-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:8px 10px;
  }
  body.app .teacher-subject-check{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:13px;
    font-weight:600;
  }
  body.app .teacher-compliance-wlp-subject{
    display:block;
    min-width:120px;
    max-width:160px;
    margin:0 0 6px;
    font-size:12px;
  }
  @media (max-width: 720px){
    body.app .tf-wlp-folder{
      grid-template-columns:minmax(0, 1fr);
      grid-template-rows:minmax(160px, 1fr) minmax(220px, 45vh);
      overflow:hidden;
    }
    body.app .wlp-checklist-side{
      width:100%;
      min-width:0;
      max-width:none;
      min-height:0;
      height:auto;
      max-height:none;
      order:2;
    }
    body.app .tf-wlp-main{
      order:1;
      min-height:0;
    }
  }

  /* =========================================================
     GLOBAL PAGE RHYTHM â€” same as Compliance on every page:
     header â†’ first block = page padding-top, then one
     --space-section gap between each visible top-level block.
     Hidden blocks, modals, and scripts never add a gap.
     ========================================================= */
  @media screen{
    body.app .page,
    body.app.page-teacher-compliance .page{
      padding-top:var(--page-padding-y);
    }
    body.app .page > :is(.compliance-search-bar, .toolbar):not(:has(> :not(.search-form))){
      position:absolute;
      width:1px;
      height:1px;
      overflow:hidden;
      clip:rect(0,0,0,0);
      margin:0;
    }
    body.app .page > :not([hidden]):not(.modal-overlay):not(script):not(style):not(template){
      margin-bottom:0;
    }
    body.app .page > :not([hidden]):not(.modal-overlay):not(script):not(style):not(template):first-child,
    body.app .page > :is([hidden], .modal-overlay, script, style, template, :is(.compliance-search-bar, .toolbar):not(:has(> :not(.search-form)))) + :not([hidden]):not(.modal-overlay):not(script):not(style):not(template){
      margin-top:0;
    }
    body.app .page > :not([hidden]):not(.modal-overlay):not(script):not(style):not(template):not(:is(.compliance-search-bar, .toolbar):not(:has(> :not(.search-form)))) ~ :not([hidden]):not(.modal-overlay):not(script):not(style):not(template){
      margin-top:var(--space-section);
    }
  }

  /* =========================================================
     FEATURE ACCESS â€” locked sidebar items, restriction modal,
     registration checkboxes, Access Management tables.
     ========================================================= */
  body.app .nav-link.is-locked{
    color:rgba(255,255,255,.55);
    cursor:pointer;
  }
  body.app .nav-link.is-locked:hover{
    background:rgba(0,0,0,.12);
    color:rgba(255,255,255,.8);
  }
  body.app .nav-link.is-locked .nav-label{flex:1 1 auto;min-width:0}
  body.app .nav-link .nav-lock{
    display:inline-flex;
    flex-shrink:0;
    width:16px;
    height:16px;
    margin-left:auto;
    opacity:.85;
  }
  body.app .nav-link .nav-lock svg{width:var(--icon-size-ui);height:var(--icon-size-ui)}

  .pill-locked{
    background:#eef1f3;
    color:#5b6770;
    border:1px solid #d8dee2;
  }

  body.app .feature-locked-body{
    display:flex;
    align-items:flex-start;
    gap:12px;
  }
  body.app .feature-locked-ico{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    width:40px;
    height:40px;
    border-radius:10px;
    background:var(--primary-light);
    color:var(--primary-dark);
  }
  body.app .feature-locked-ico svg{width:22px;height:22px}
  body.app .feature-locked-body .confirm-modal-text{margin:0;align-self:center}
  body.app .feature-locked-status{
    margin:12px 0 0;
    padding:8px 12px;
    border-radius:8px;
    font-size:13px;
    background:var(--status-pending-bg);
    color:var(--status-pending);
    border:1px solid #f0e0a8;
  }
  body.app .feature-locked-status[data-state="rejected"]{
    background:var(--status-overdue-bg);
    color:var(--status-overdue);
    border-color:#f0c7c3;
  }
  body.app .feature-locked-status[data-state="revoked"]{
    background:var(--status-discrepancy-bg);
    color:var(--status-discrepancy);
    border-color:#f0d2b0;
  }
  body.app #feature-locked-submit:disabled{opacity:.6;cursor:not-allowed}

  body.app .feature-access-box{
    margin:4px 0 8px;
    padding:0;
    border:0;
    min-width:0;
  }
  body.app .feature-access-box legend{padding:0;margin-bottom:4px}
  body.app .feature-access-list{
    display:flex;
    flex-direction:column;
    gap:8px;
  }
  body.app .feature-access-list--grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px 16px;
  }
  body.app .feature-access-item{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:40px;
    padding:8px 12px;
    border:1px solid var(--border, #dfe5e8);
    border-radius:10px;
    background:#fff;
    font-size:14px;
    font-weight:500;
    cursor:pointer;
  }
  body.app .feature-access-item:has(input:checked){
    border-color:rgba(var(--primary-rgb),.45);
    background:var(--primary-light);
  }
  body.app .feature-access-item input{margin:0;accent-color:var(--primary)}
  body.app .feature-access-label{flex:1 1 auto;min-width:0}
  body.app .feature-access-state{margin-left:auto}

  body.app.page-teachers-record .table--register.table--access-requests th.th-name{width:20%}
  body.app.page-teachers-record .table--register.table--access-requests th.th-position{width:13%}
  body.app.page-teachers-record .table--register.table--access-requests th.th-feature{width:13%}
  body.app.page-teachers-record .table--register.table--access-requests th.th-date,
  body.app.page-teachers-record .table--register.table--access-requests th.th-processed{width:12%}
  body.app.page-teachers-record .table--register.table--access-requests th.th-status{width:10%}
  body.app.page-teachers-record .table--register.table--access-requests td.td-processed{
    white-space:nowrap;
    color:var(--muted);
  }
  body.app.page-teachers-record .table--register.table--access-requests th.th-actions,
  body.app.page-teachers-record .table--register.table--access-requests td.td-actions{
    width:88px !important;
    min-width:88px !important;
    max-width:none;
    text-align:right;
    vertical-align:middle;
    white-space:nowrap;
    overflow:visible;
    padding-top:10px;
    padding-bottom:10px;
  }
  body.app.page-teachers-record .table--register.table--access-requests .access-actions{
    display:inline-flex;
    flex-direction:row;
    flex-wrap:nowrap;
    align-items:center;
    justify-content:flex-end;
    gap:4px;
    width:auto;
    margin:0;
    padding:0;
    line-height:1;
  }
  body.app.page-teachers-record .table--register.table--access-requests .access-actions form,
  body.app.page-teachers-record .table--register.table--access-requests .access-action-form{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin:0;
    padding:0;
    border:0;
    line-height:0;
  }

  body.app.page-teachers-record .table--access-perms th.th-name{width:16%}
  body.app.page-teachers-record .table--access-perms th.th-position{width:13%}
  body.app.page-teachers-record .table--access-perms th.th-actions,
  body.app.page-teachers-record .table--access-perms td.td-actions{width:80px}
  body.app .table--access-perms th.th-feature-col{
    white-space:normal;
    line-height:1.25;
    text-align:center;
  }
  body.app.page-teachers-record .table--access-perms td.td-feature-col{
    text-align:center;
    padding-left:4px;
    padding-right:4px;
  }

  /* =========================================================
     DEPARTMENTS â€” JHS / SHS filters, pills, assignment fields.
     ========================================================= */
  body.app [data-teaching-field][hidden],
  body.app .compliance-teacher-pick > label.is-dept-hidden,
  body.app [data-share-teachers][hidden],
  body.app .share-teachers-list > label[hidden]{display:none !important}
  body.app .pill-dept{margin-left:6px;font-size:11px;padding:1px 8px;vertical-align:middle}
  body.app .dept-filter{display:inline-flex;align-items:center;gap:8px;margin:0}
  body.app .dept-filter .input{min-height:34px;padding-top:4px;padding-bottom:4px;width:auto;min-width:160px}
  body.app .dept-section-title{display:flex;align-items:center;gap:8px;margin:18px 0 8px;font-size:15px;font-weight:600}
  body.app .dept-section-title:first-child{margin-top:0}
  body.app .share-teachers-list{max-height:180px;overflow:auto;display:grid;gap:4px;padding:8px;border:1px solid var(--border, #e2e8f0);border-radius:8px}
  
