:root{
  --blue:#6A1B9A;
  --blue-dark:#4A148C;
  --blue-light:#F3E5F5;
  --blue-mid:#6A1B9A;
  --orange:#7A4D00;
  --light-orange:#B77B16;
  --orange-soft:#FFF4D7;
  --magenta-soft:#FDF2F8;
  --purple-soft:#FBF5FF;
  --green:#4A148C;
  --green-bg:#F1E8FA;
  --red:#8A1C3A;
  --red-bg:#FCEBF0;
  --yellow:#7A4D00;
  --yellow-bg:#FFF4D7;
  --cyan:#4B0082;
  --cyan-bg:#F1E8FA;
  --gray:#9E9E9E;
  --bg:#f5f6f8;
  --card:#fff;
  --surface-alt:#f8fafc;
  --border:#e2e8f0;
  --border-strong:#cbd5e1;
  --text:#0f172a;
  --muted:#616161;
  --sidebar-bg:#4A148C;
  --sidebar-txt:#F3E5F5;
  --sidebar-w:256px;
  --topbar-h:64px;
  --r:8px;
  --focus:0 0 0 3px rgba(106,27,154,.16);
  --shadow:0 1px 2px rgba(15,23,42,.06),0 8px 22px rgba(15,23,42,.05);
  --shadow-lg:0 22px 60px rgba(15,23,42,.22);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:15px;scroll-behavior:smooth}
body{
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  background:linear-gradient(180deg,#fff8ef 0,#faf5ff 155px,var(--bg) 430px);
  color:var(--text);
  line-height:1.6;
  text-rendering:optimizeLegibility;
}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;display:block}
ul{list-style:none}
input,select,textarea,button{font:inherit}
button,input,select,textarea{max-width:100%}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:none;
  box-shadow:var(--focus);
}

/* Layout */
.app-layout{display:flex;min-height:100vh}
.main-content{
  flex:1;
  min-width:0;
  margin-left:var(--sidebar-w);
  display:flex;
  flex-direction:column;
  min-height:100vh;
  transition:margin .25s;
}
.page-body{padding:26px;flex:1;min-width:0;width:100%}

/* Sidebar */
.sidebar{
  width:var(--sidebar-w);
  background:linear-gradient(180deg,var(--blue-dark) 0%,var(--blue) 58%,#360a66 100%);
  display:flex;
  flex-direction:column;
  position:fixed;
  top:0;
  left:0;
  bottom:0;
  height:100vh;
  z-index:300;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  transition:transform .25s ease;
  box-shadow:8px 0 30px rgba(74,20,140,.28);
}
.sidebar-brand{
  display:flex;
  align-items:center;
  gap:10px;
  padding:20px;
  border-bottom:1px solid rgba(255,255,255,.11);
  min-height:70px;
}
.brand-icon{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  background:linear-gradient(135deg,var(--orange),var(--light-orange));
  color:var(--blue-dark);
  font-size:1.05rem;
  font-weight:900;
  flex-shrink:0;
  box-shadow:0 8px 18px rgba(251,140,0,.28);
}
.brand-text{font-size:1.02rem;font-weight:800;color:#fff;line-height:1.15}
.brand-text small{
  display:block;
  font-size:.65rem;
  font-weight:500;
  color:var(--sidebar-txt);
  opacity:.82;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sidebar-close{
  display:none;
  background:rgba(255,255,255,.1);
  border:none;
  color:#fff;
  cursor:pointer;
  font-size:1.1rem;
  margin-left:auto;
  padding:4px 8px;
  border-radius:6px;
}
.sidebar-user{
  display:flex;
  align-items:center;
  gap:12px;
  padding:17px 20px;
  border-bottom:1px solid rgba(255,255,255,.11);
  background:rgba(255,255,255,.04);
}
.avatar{
  width:40px;
  height:40px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--blue-mid),var(--orange));
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.95rem;
  font-weight:800;
  color:#fff;
  flex-shrink:0;
  border:2px solid rgba(255,255,255,.28);
}
.avatar-photo{object-fit:cover}
.sidebar-user-name{font-size:.86rem;font-weight:700;color:#fff;line-height:1.25}
.sidebar-user-role{font-size:.72rem;color:var(--sidebar-txt);opacity:.8;margin-top:1px}
.sidebar-nav{padding:10px 0;flex:1}
.nav-section{
  padding:15px 20px 5px;
  font-size:.62rem;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:rgba(233,213,242,.62);
}
.nav-link{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:39px;
  padding:9px 20px;
  color:var(--sidebar-txt);
  font-size:.88rem;
  font-weight:560;
  transition:background .15s,color .15s,transform .15s;
  text-decoration:none;
  border-radius:0;
  position:relative;
}
.nav-link:hover,.nav-link.active{
  background:rgba(255,255,255,.11);
  color:#fff;
  text-decoration:none;
}
.nav-link:hover{transform:translateX(2px)}
.nav-link.active::before{
  content:'';
  position:absolute;
  left:0;
  top:7px;
  bottom:7px;
  width:4px;
  background:var(--orange);
  border-radius:0 4px 4px 0;
}
.nav-icon{
  width:22px;
  text-align:center;
  flex-shrink:0;
  font-size:1rem;
  opacity:.95;
}
.sidebar-footer{
  padding:14px 20px;
  border-top:1px solid rgba(255,255,255,.11);
  display:flex;
  flex-direction:column;
  gap:5px;
  background:rgba(0,0,0,.08);
}
.sidebar-footer .nav-link{padding:8px 0;font-size:.8rem}
.nav-link-danger{color:#fecaca}
.nav-link-danger:hover{color:#fff;background:rgba(220,38,38,.2)}
.tour-restart{
  width:100%;
  border:0;
  background:transparent;
  cursor:pointer;
  text-align:left;
}
.sidebar-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.58);
  z-index:250;
  backdrop-filter:blur(3px);
}

/* Topbar */
.topbar{
  height:var(--topbar-h);
  background:rgba(255,255,255,.92);
  border-bottom:1px solid rgba(226,232,240,.9);
  display:flex;
  align-items:center;
  padding:0 26px;
  gap:16px;
  position:sticky;
  top:0;
  z-index:100;
  box-shadow:0 1px 0 rgba(15,23,42,.03);
  backdrop-filter:blur(10px);
}
.topbar::after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:2px;
  background:linear-gradient(90deg,var(--orange),var(--blue-mid),transparent 68%);
  opacity:.58;
}

.announcement-dock{
  margin:18px 26px 0;
  display:grid;
  grid-template-columns:minmax(170px,220px) 1fr;
  gap:14px;
  align-items:start;
}
.announcement-dock-head{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  border:1px solid rgba(251,140,0,.24);
  border-radius:8px;
  background:linear-gradient(135deg,#fff7ed,#fff);
  box-shadow:var(--shadow);
}
.announcement-icon{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  background:#fff;
  color:var(--orange);
  border:1px solid rgba(251,140,0,.2);
  flex-shrink:0;
}
.announcement-kicker{
  font-size:.68rem;
  color:var(--muted);
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.announcement-stack{
  display:grid;
  gap:10px;
}
.announcement-note{
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:start;
  padding:14px 16px;
  border:1px solid var(--border);
  border-left:4px solid var(--border-strong);
  border-radius:8px;
  background:rgba(255,255,255,.9);
  box-shadow:var(--shadow);
}
.announcement-note.is-unread{
  border-left-color:var(--orange);
  background:#fff;
}
.announcement-note h3{
  font-size:.96rem;
  margin:0 0 4px;
}
.announcement-note p{
  margin:0;
  color:var(--muted);
  font-size:.88rem;
  line-height:1.45;
}
.announcement-note form{
  margin:0;
}
.announcement-read{
  color:var(--muted);
  font-size:.74rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.ldtp-tour-overlay{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(15,23,42,.42);
  pointer-events:auto;
}
.ldtp-tour-highlight{
  position:relative;
  z-index:10000!important;
  outline:3px solid rgba(251,140,0,.7);
  outline-offset:4px;
  box-shadow:0 0 0 9999px rgba(15,23,42,.38);
}
.ldtp-tour-popover{
  position:fixed;
  width:min(360px,calc(100vw - 32px));
  padding:18px;
  border-radius:8px;
  background:#fff;
  color:var(--text);
  box-shadow:var(--shadow-lg);
  z-index:10001;
}
.ldtp-tour-kicker{
  font-size:.68rem;
  color:var(--orange);
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:6px;
}
.ldtp-tour-popover h3{
  font-size:1.05rem;
  margin:0 0 8px;
}
.ldtp-tour-popover p{
  margin:0;
  color:var(--muted);
  line-height:1.5;
}
.ldtp-tour-footer{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  margin-top:16px;
}
.ldtp-tour-count{
  font-size:.78rem;
  color:var(--muted);
  font-weight:700;
}
.ldtp-tour-actions{
  display:flex;
  gap:8px;
}
.hamburger{
  display:none;
  background:#fff;
  border:1px solid var(--border);
  cursor:pointer;
  padding:7px 10px;
  color:var(--blue-dark);
  font-size:1.25rem;
  line-height:1;
  border-radius:8px;
  transition:background .15s,border-color .15s;
}
.hamburger:hover{background:var(--purple-soft);border-color:var(--blue-light)}
.topbar-title{
  font-size:1.08rem;
  font-weight:800;
  color:var(--text);
  flex:1;
  letter-spacing:0;
}
.topbar-right{display:flex;align-items:center;gap:10px}
.topbar-cohort{
  font-size:.75rem;
  font-weight:800;
  padding:5px 11px;
  background:var(--blue-light);
  color:var(--blue-dark);
  border:1px solid rgba(106,27,154,.12);
  border-radius:999px;
  white-space:nowrap;
}
.context-switcher select{min-height:34px}

/* Cards */
.card{
  background:rgba(255,255,255,.96);
  border:1px solid rgba(226,232,240,.95);
  border-radius:var(--r);
  box-shadow:var(--shadow);
  padding:21px;
  margin-bottom:20px;
}
.card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:16px;
  padding-bottom:12px;
  border-bottom:1px solid var(--border);
}
.card-title{font-size:1.02rem;font-weight:800;color:var(--text);letter-spacing:0}
.card-header .btn{margin-left:auto}

/* Stats */
.stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
  grid-template-columns:repeat(auto-fit,minmax(178px,1fr))!important;
  gap:16px;
  margin-bottom:22px;
}
.stat-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  min-height:116px;
  background:linear-gradient(180deg,#fff 0%,#fbf7ff 100%);
  border:1px solid var(--border);
  border-radius:var(--r);
  box-shadow:var(--shadow);
  padding:20px;
  border-top:4px solid var(--blue);
}
.stat-card:nth-child(2){border-top-color:var(--green)}
.stat-card:nth-child(3){border-top-color:var(--yellow)}
.stat-card:nth-child(4){border-top-color:var(--cyan)}
.stat-card:nth-child(5){border-top-color:var(--orange)}
.stat-value{
  display:block;
  font-size:1.9rem;
  font-weight:900;
  color:var(--text);
  line-height:1.08;
  margin-bottom:0;
  overflow-wrap:anywhere;
}
.stat-label{
  display:block;
  font-size:.72rem;
  font-weight:800;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
  line-height:1.25;
  min-height:1.8em;
}

/* Tables */
.table-wrap{
  overflow-x:auto;
  border:1px solid var(--border);
  border-radius:var(--r);
  background:var(--card);
}
.card .table-wrap{border-radius:0 0 var(--r) var(--r);border-left:0;border-right:0;border-bottom:0}
table{width:100%;border-collapse:collapse;font-size:.875rem}
thead{background:linear-gradient(180deg,#fff7ed 0%,#f3e5f5 100%)}
table th{
  color:var(--blue-dark);
  font-size:.7rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  padding:11px 14px;
  text-align:left;
  border-bottom:1px solid var(--border-strong);
  white-space:nowrap;
}
table td{
  padding:12px 14px;
  border-bottom:1px solid var(--border);
  vertical-align:middle;
  color:var(--text);
}
table tbody tr:hover{background:var(--purple-soft)}
table tbody tr:last-child td{border-bottom:none}
.finance-table{min-width:1080px}
.attendance-table{min-width:560px}
.oversight-table{min-width:1040px}
.finance-table th:nth-child(1),
.finance-table td:nth-child(1),
.attendance-table th:nth-child(1),
.attendance-table td:nth-child(1){width:48px;text-align:center}
.finance-table th:nth-child(2),
.finance-table td:nth-child(2){width:220px}
.finance-table th:nth-child(3),
.finance-table td:nth-child(3){width:120px}
.finance-table th:nth-child(n+4):nth-child(-n+8),
.finance-table td:nth-child(n+4):nth-child(-n+8){
  text-align:right;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
  width:112px;
}
.finance-table th:nth-child(9),
.finance-table td:nth-child(9),
.finance-table th:nth-child(10),
.finance-table td:nth-child(10){text-align:center;white-space:nowrap;width:110px}
.finance-table td:nth-child(10) .btn{min-width:72px;margin:2px 0}
.attendance-table th:nth-child(3),
.attendance-table th:nth-child(4),
.attendance-table td:nth-child(3),
.attendance-table td:nth-child(4){
  text-align:center;
  width:18%;
}
.attendance-table th:nth-child(2),
.attendance-table td:nth-child(2){width:56%;white-space:nowrap}
.oversight-table th:nth-child(n+3),
.oversight-table td:nth-child(n+3){
  text-align:center;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.oversight-table th:first-child,
.oversight-table td:first-child{text-align:left;min-width:150px}
.oversight-table th:nth-child(2),
.oversight-table td:nth-child(2){text-align:left;min-width:110px}
.oversight-table th:last-child,
.oversight-table td:last-child{width:92px}
.att-dot{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  transition:background .15s,border-color .15s,opacity .15s,transform .15s;
}
.att-dot:hover{transform:scale(1.06)}

/* Badges */
.badge{
  display:inline-block;
  padding:3px 10px;
  border-radius:999px;
  font-size:.7rem;
  font-weight:800;
  line-height:1.6;
  white-space:nowrap;
}
.badge-primary{background:var(--blue-light);color:var(--blue-dark)}
.badge-success{background:var(--green-bg);color:var(--green)}
.badge-danger{background:var(--red-bg);color:var(--red)}
.badge-warning{background:var(--yellow-bg);color:var(--yellow)}
.badge-info{background:var(--cyan-bg);color:var(--cyan)}
.badge-muted{background:#f1f5f9;color:var(--muted)}

/* Alerts */
.alert{
  padding:13px 16px;
  border-radius:var(--r);
  border:1px solid transparent;
  font-size:.9rem;
  margin-bottom:16px;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.alert-success{background:var(--green-bg);border-color:#bbf7d0;color:#166534}
.alert-danger{background:var(--red-bg);border-color:#fecaca;color:#991b1b}
.alert-warning{background:var(--yellow-bg);border-color:#fde68a;color:#92400e}
.alert-info{background:var(--cyan-bg);border-color:#a5f3fc;color:#155e75}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:38px;
  padding:8px 18px;
  border-radius:7px;
  border:1px solid transparent;
  font-size:.875rem;
  font-weight:750;
  cursor:pointer;
  line-height:1.35;
  transition:background .15s,border-color .15s,color .15s,box-shadow .15s,transform .15s;
  text-decoration:none;
  white-space:nowrap;
}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-primary{
  background:linear-gradient(135deg,var(--blue) 0%,var(--blue-mid) 100%);
  color:#fff;
  border-color:transparent;
  box-shadow:0 8px 18px rgba(106,27,154,.18);
}
.btn-primary:hover{
  background:linear-gradient(135deg,var(--blue-dark) 0%,var(--blue-mid) 100%);
  color:#fff;
  box-shadow:0 8px 18px rgba(74,20,140,.18);
}
.btn-success{background:var(--green);color:#fff}
.btn-success:hover{background:var(--blue-dark);color:#fff}
.btn-danger{background:var(--red);color:#fff}
.btn-danger:hover{background:#b91c1c;color:#fff}
.btn-warning{background:var(--yellow);color:#fff}
.btn-warning:hover{background:#b45309;color:#fff}
.btn-outline,
.btn-outline-primary,
.btn-outline-secondary{
  background:#fff;
  color:var(--blue-dark);
  border-color:var(--border-strong);
}
.btn-outline:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover{
  background:var(--purple-soft);
  border-color:var(--blue-light);
  color:var(--blue-dark);
}
.btn-outline-danger{background:#fff;color:var(--red);border-color:#fecaca}
.btn-outline-danger:hover{background:var(--red-bg);color:var(--red);border-color:#fca5a5}
.btn-outline-warning{background:#fff;color:var(--yellow);border-color:#fde68a}
.btn-outline-warning:hover{background:var(--yellow-bg);color:#92400e;border-color:#facc15}
.btn-secondary{background:#475569;color:#fff;border-color:#475569}
.btn-secondary:hover{background:#334155;color:#fff;border-color:#334155}
.btn-info{background:var(--cyan);color:#fff;border-color:var(--cyan)}
.btn-info:hover{background:#0e7490;color:#fff;border-color:#0e7490}
.btn-sm{min-height:32px;padding:5px 12px;font-size:.8rem}
.btn-lg{min-height:46px;padding:11px 24px;font-size:1rem}
.btn:disabled{opacity:.52;cursor:not-allowed;pointer-events:none;transform:none}
.btn-block{width:100%;justify-content:center;padding:11px;font-size:1rem;margin-top:4px}

/* Forms */
.form-group{margin-bottom:17px}
.form-group label,
.form-label,
.mb-3 > label,
form > label{
  display:block;
  font-size:.84rem;
  font-weight:800;
  color:#334155;
  margin-bottom:7px;
}
.form-control,
form input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),
form select,
form textarea{
  display:block;
  width:100%;
  min-height:42px;
  padding:10px 13px;
  border:1.5px solid var(--border-strong);
  border-radius:8px;
  background:#fff;
  color:var(--text);
  font-size:.9rem;
  transition:border-color .15s,box-shadow .15s,background .15s;
}
.form-control:hover,
form input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):hover,
form select:hover,
form textarea:hover{border-color:#b8c2d0}
.form-control:focus,
form input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):focus,
form select:focus,
form textarea:focus{
  outline:none;
  border-color:var(--blue);
  box-shadow:var(--focus);
  background:#fff;
}
textarea.form-control,
form textarea{resize:vertical;min-height:110px;line-height:1.55}
.form-text{font-size:.78rem;color:var(--muted);margin-top:5px}
.form-hint{font-size:.75rem;color:var(--muted);margin-top:5px;font-style:italic}
form input[type=file]{
  display:block;
  width:100%;
  padding:11px;
  border:1.5px dashed rgba(106,27,154,.28);
  border-radius:8px;
  background:linear-gradient(180deg,#fff 0%,var(--purple-soft) 100%);
  font-size:.85rem;
  cursor:pointer;
}
form input[type=checkbox],
form input[type=radio]{accent-color:var(--blue)}
.check-row{
  display:flex!important;
  align-items:flex-start;
  gap:10px;
  margin-bottom:4px!important;
  color:var(--text)!important;
  line-height:1.35;
}
.check-row input{margin-top:3px;flex:0 0 auto}
fieldset{
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:14px;
  margin-bottom:16px;
}

/* Progress */
.progress{height:8px;background:var(--border);border-radius:999px;overflow:hidden}
.progress-bar{height:100%;background:var(--blue);border-radius:999px;transition:width .4s ease}
.progress-bar.success{background:var(--green)}
.progress-bar.warning{background:var(--yellow)}
.progress-bar.danger{background:var(--red)}

/* Modal */
.modal-backdrop{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.64);
  backdrop-filter:blur(5px);
  z-index:1055;
  align-items:flex-start;
  justify-content:center;
  padding:clamp(12px,4vh,34px) 14px;
  overflow-y:auto;
}
.modal-backdrop.open{display:flex!important}
.modal,
.modal-box{
  display:flex!important;
  flex-direction:column;
  position:relative!important;
  inset:auto!important;
  margin:0 auto!important;
  background:var(--card);
  border:1px solid rgba(106,27,154,.16);
  border-radius:12px;
  box-shadow:var(--shadow-lg);
  width:100%;
  max-width:640px;
  max-height:92vh;
  max-height:calc(100dvh - 32px);
  overflow:hidden!important;
  animation:modalIn .2s ease;
}
.modal-sm{max-width:440px}
.modal-lg{max-width:760px}
.modal-xl{max-width:980px}
.modal-backdrop.open .modal,
.modal-backdrop.open .modal-box{
  display:flex!important;
  position:relative!important;
  inset:auto!important;
  margin:0 auto!important;
}
@keyframes modalIn{
  from{opacity:0;transform:translateY(-14px) scale(.98)}
  to{opacity:1;transform:none}
}
.modal-header{
  flex:0 0 auto;
  padding:18px 22px;
  border-bottom:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  position:sticky;
  top:0;
  background:linear-gradient(135deg,var(--blue-dark) 0%,var(--blue) 58%,var(--blue-mid) 100%);
  color:#fff;
  z-index:3;
}
.modal-header::after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:3px;
  background:linear-gradient(90deg,var(--orange),rgba(255,255,255,.24),transparent);
}
.modal-title,
.modal-header strong{font-size:1.05rem;font-weight:850;color:#fff;letter-spacing:0}
.modal-close{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  cursor:pointer;
  font-size:1.15rem;
  color:#fff;
  padding:0;
  border-radius:8px;
  transition:background .15s,border-color .15s;
}
.modal-close:hover{background:rgba(255,255,255,.24);border-color:rgba(255,255,255,.34)}
.modal-body,
.modal > form,
.modal-box > form{
  flex:1 1 auto;
  padding:22px;
  overflow-y:auto;
  min-height:0;
}
.modal > form.modal-body,
.modal-box > form.modal-body{padding:22px}
.modal > p,
.modal-box > p{
  margin:18px 22px 0;
  color:var(--muted);
}
.modal > div:not(.modal-header):not(.modal-body):not(.modal-footer):not(.table-wrap),
.modal-box > div:not(.modal-header):not(.modal-body):not(.modal-footer):not(.table-wrap){
  margin-left:22px;
  margin-right:22px;
}
.modal > .table-wrap,
.modal-box > .table-wrap{margin:16px 22px 22px}
.modal-footer,
.modal form > [style*="justify-content:flex-end"],
.modal form > [style*="justify-content: flex-end"],
.modal-box form > [style*="justify-content:flex-end"],
.modal-box form > [style*="justify-content: flex-end"]{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  position:sticky;
  bottom:0;
  z-index:2;
  margin:18px -22px -22px!important;
  padding:14px 22px 16px!important;
  border-top:1px solid var(--border);
  background:linear-gradient(180deg,rgba(255,255,255,.94) 0%,#fff 35%);
  box-shadow:0 -10px 20px rgba(15,23,42,.04);
}
.modal-footer{margin:0!important}
.modal .form-group:last-child{margin-bottom:0}
.modal [style*="max-height"]{scrollbar-width:thin}

/* Pagination */
.pagination{display:flex;align-items:center;gap:4px;margin-top:20px;flex-wrap:wrap}
.pagination a,.pagination span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:36px;
  height:36px;
  padding:0 10px;
  border:1px solid var(--border);
  border-radius:7px;
  font-size:.85rem;
  background:var(--card);
  text-decoration:none;
  color:var(--text);
  transition:background .15s,border-color .15s;
}
.pagination a:hover{background:var(--purple-soft);border-color:var(--blue-light)}
.pagination span.current{background:var(--blue);color:#fff;border-color:var(--blue);font-weight:800}
.pagination span.disabled{opacity:.42;cursor:not-allowed}

/* Auth */
.auth-page{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    linear-gradient(135deg,rgba(74,20,140,.96) 0%,rgba(106,27,154,.96) 52%,rgba(142,36,170,.94) 100%),
    linear-gradient(90deg,var(--orange) 0%,var(--orange) 22%,transparent 22%);
  padding:20px;
}
.auth-card{
  background:var(--card);
  border:1px solid rgba(255,255,255,.36);
  border-top:5px solid var(--orange);
  border-radius:12px;
  box-shadow:0 28px 75px rgba(0,0,0,.28);
  padding:44px 40px;
  width:100%;
  max-width:420px;
}
.auth-logo{text-align:center;margin-bottom:30px}
.auth-logo-icon{
  width:46px;
  height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--orange-soft);
  color:var(--orange);
  border-radius:10px;
  margin-bottom:10px;
  font-size:1.3rem;
}
.logo-name,.auth-logo h1{font-size:1.5rem;font-weight:900;color:var(--blue);line-height:1.15}
.logo-tagline,.auth-logo p{font-size:.82rem;color:var(--muted);margin-top:5px}
.logo-org,.auth-logo small{font-size:.75rem;color:var(--muted)}
.auth-card h2{font-size:1.25rem;font-weight:850;margin-bottom:24px;text-align:center;color:var(--text)}
.auth-footer{font-size:.8rem;color:var(--muted);text-align:center}
.input-icon-wrap{position:relative}
.input-icon-wrap input{padding-right:44px}
.toggle-pw{
  position:absolute;
  right:9px;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--surface-alt);
  border:1px solid var(--border);
  cursor:pointer;
  font-size:1rem;
  color:var(--muted);
  padding:0;
  line-height:1;
  border-radius:8px;
}
.toggle-pw:hover{background:var(--purple-soft);color:var(--blue)}

/* Utilities */
.flex{display:flex}
.flex-between{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}
.gap-2{gap:8px}
.gap-3{gap:12px}
.text-muted{color:var(--muted)!important}
.text-primary{color:var(--blue)!important}
.text-center{text-align:center!important}
.text-right{text-align:right!important}
.fw-bold{font-weight:800!important}
.mb-0{margin-bottom:0!important}
.mb-1{margin-bottom:4px!important}
.mb-2{margin-bottom:8px!important}
.mb-3{margin-bottom:16px!important}
.mb-4{margin-bottom:24px!important}
.mt-2{margin-top:8px!important}
.mt-3{margin-top:16px!important}
.w-100{width:100%!important}
.text-small{font-size:.8rem!important}

/* Content helpers */
.submission-box{
  background:linear-gradient(180deg,#fff 0%,var(--surface-alt) 100%);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:15px 16px;
  font-size:.875rem;
  white-space:pre-wrap;
  word-break:break-word;
  max-height:280px;
  overflow-y:auto;
  line-height:1.7;
}
.empty-state{
  text-align:center;
  padding:48px 24px;
  color:var(--muted);
}
.empty-state-icon{
  width:58px;
  height:58px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:14px;
  border-radius:14px;
  background:var(--orange-soft);
  color:var(--orange);
  font-size:2rem;
}
.empty-state h3{font-size:1.05rem;font-weight:850;color:var(--text);margin-bottom:6px}
.empty-state p{font-size:.9rem}
.quick-actions{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(145px,1fr));
  gap:12px;
  margin-bottom:24px;
}
.quick-action{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:17px;
  text-align:center;
  text-decoration:none;
  color:var(--text);
  transition:box-shadow .15s,border-color .15s,transform .15s,background .15s;
  display:block;
}
.quick-action:hover{
  box-shadow:0 12px 26px rgba(106,27,154,.12);
  border-color:rgba(106,27,154,.24);
  background:linear-gradient(180deg,#fff 0%,var(--purple-soft) 100%);
  text-decoration:none;
  color:var(--text);
  transform:translateY(-2px);
}
.quick-action-icon{font-size:1.8rem;margin-bottom:8px}
.quick-action span{font-size:.82rem;font-weight:800;display:block}

/* CIP stage tracker */
.cip-stages{display:flex;gap:8px;flex-wrap:wrap;padding:8px 0}
.cip-stage{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:72px;
  height:72px;
  border-radius:12px;
  border:2px solid var(--border);
  background:var(--card);
  font-size:.75rem;
  font-weight:750;
  color:var(--text);
  text-decoration:none;
  transition:all .15s;
  cursor:pointer;
}
.cip-stage:hover{border-color:var(--blue-mid);box-shadow:var(--shadow);text-decoration:none;color:var(--text)}
.cip-stage .stage-no{font-size:1.1rem;font-weight:900;line-height:1}
.cip-stage.approved{border-color:var(--green);background:var(--green-bg);color:var(--green)}
.cip-stage.submitted{border-color:var(--blue);background:var(--blue-light);color:var(--blue)}
.cip-stage.revision{border-color:var(--yellow);background:var(--yellow-bg);color:var(--yellow)}
.cip-stage.locked{border-color:var(--border);background:#f8fafc;color:var(--muted);opacity:.62;cursor:not-allowed}

/* CSS custom properties used in inline styles */
:root{
  --clr-primary:var(--blue);
  --clr-primary-dark:var(--blue-dark);
  --clr-primary-light:var(--blue-mid);
  --clr-primary-faint:var(--blue-light);
  --clr-accent:var(--orange);
  --clr-success:var(--green);
  --clr-danger:var(--red);
  --clr-warning:var(--yellow);
  --clr-info:var(--cyan);
  --clr-text:var(--text);
  --clr-text-muted:var(--muted);
  --clr-border:var(--border);
  --clr-surface:var(--card);
  --clr-surface-alt:var(--surface-alt);
  --clr-bg:var(--bg);
  --radius:var(--r);
  --font-mono:ui-monospace,SFMono-Regular,"Cascadia Code",monospace;
}

/* Responsive */
@media(max-width:768px){
  .sidebar{transform:translateX(-100%)}
  .sidebar.open{transform:translateX(0)}
  .sidebar-close{display:block}
  .sidebar-overlay.open{display:block}
  .main-content{margin-left:0}
  .hamburger{display:block}
  .topbar{padding:0 16px;min-height:var(--topbar-h)}
  .main-content{max-width:100vw;overflow-x:hidden}
  .topbar-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1rem}
  .topbar-right{min-width:0;gap:6px;flex-wrap:wrap;justify-content:flex-end}
  .topbar-cohort{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .announcement-dock{
    margin:14px 16px 0;
    grid-template-columns:1fr;
  }
  .announcement-note{
    grid-template-columns:1fr;
  }
  .page-body{padding:16px}
  .stats-grid{grid-template-columns:repeat(2,1fr)!important}
  .card{padding:16px;margin-bottom:16px}
  .card-header{align-items:flex-start;gap:10px;flex-wrap:wrap}
  .card-header .btn{margin-left:0}
  .flex-between{align-items:flex-start;gap:10px}
  .table-wrap{max-width:100%;overflow-x:auto}
  table th,table td{padding:10px}
  .modal-backdrop{padding:8px}
  .modal,.modal-box{
    border-radius:10px;
    max-height:calc(100dvh - 16px);
  }
  .modal-header{padding:16px}
  .modal-body,
  .modal > form,
  .modal-box > form,
  .modal > form.modal-body,
  .modal-box > form.modal-body{padding:16px}
  .modal > p,.modal-box > p{margin:16px 16px 0}
  .modal > div:not(.modal-header):not(.modal-body):not(.modal-footer):not(.table-wrap),
  .modal-box > div:not(.modal-header):not(.modal-body):not(.modal-footer):not(.table-wrap){
    margin-left:16px;
    margin-right:16px;
  }
  .modal > .table-wrap,.modal-box > .table-wrap{margin:16px}
  .modal form > [style*="justify-content:flex-end"],
  .modal form > [style*="justify-content: flex-end"],
  .modal-box form > [style*="justify-content:flex-end"],
  .modal-box form > [style*="justify-content: flex-end"]{
    margin:18px -16px -16px!important;
    padding:13px 16px 14px!important;
    flex-wrap:wrap;
  }
  [style*="grid-template-columns:2fr 1fr"],
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns:300px 1fr"],
  [style*="grid-template-columns:280px 1fr"],
  [style*="grid-template-columns:260px 1fr"],
  [style*="grid-template-columns:200px 1fr"],
  [style*="grid-template-columns:1fr auto"]{
    grid-template-columns:1fr!important;
    overflow:visible!important;
  }
  .page-body [style*="grid-template-columns:repeat(3"]:not(.stats-grid),
  .page-body [style*="grid-template-columns:repeat(4"]:not(.stats-grid),
  .page-body [style*="grid-template-columns:repeat(5"]:not(.stats-grid),
  .page-body [style*="grid-template-columns:repeat(6"]:not(.stats-grid),
  .page-body [style*="grid-template-columns:repeat(7"]:not(.stats-grid){
    grid-template-columns:1fr!important;
  }
  [style*="height:calc(100vh"]{
    height:auto!important;
    overflow:visible!important;
  }
  [style*="border-left:1px solid"]{
    border-left:none!important;
    padding-left:0!important;
    border-top:1px solid var(--border);
    padding-top:16px;
  }
  [style*="width:220px"],
  [style*="width:280px"],
  [style*="width:300px"]{width:100%!important}
  .auth-card{padding:32px 24px}
  .btn{padding:10px 18px;font-size:.95rem;min-height:44px}
  .btn-sm{padding:8px 14px;font-size:.85rem;min-height:40px}
  .nav-link{padding:12px 20px;font-size:.95rem}
  .form-group label,form > label{font-size:.95rem;margin-bottom:8px}
  .form-control,
  form input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),
  form select,
  form textarea{font-size:1rem;padding:12px 14px;min-height:46px}
  .alert{font-size:.95rem;padding:14px 18px}
  .stat-value{font-size:1.62rem}
  .stat-label{font-size:.75rem}
}
@media(max-width:480px){
  .stats-grid{grid-template-columns:1fr!important}
  .announcement-dock-head{
    padding:12px;
  }
  .announcement-note{
    padding:12px;
  }
  .quick-actions{grid-template-columns:repeat(2,1fr)}
  .quick-action{padding:14px 10px}
  .modal-footer,
  .modal form > [style*="justify-content:flex-end"],
  .modal form > [style*="justify-content: flex-end"],
  .modal-box form > [style*="justify-content:flex-end"],
  .modal-box form > [style*="justify-content: flex-end"]{
    justify-content:stretch;
  }
  .modal-footer .btn,
  .modal form > [style*="justify-content:flex-end"] .btn,
  .modal form > [style*="justify-content: flex-end"] .btn,
  .modal-box form > [style*="justify-content:flex-end"] .btn,
  .modal-box form > [style*="justify-content: flex-end"] .btn{
    flex:1 1 140px;
  }
}

/* Product UI overhaul: crisp LMS workspace */
:root{
  --blue:#5b1f8f;
  --blue-dark:#2f1446;
  --blue-mid:#6f2dbd;
  --blue-light:#f2ecfb;
  --orange:#7A4D00;
  --light-orange:#B77B16;
  --orange-soft:#FFF4D7;
  --purple-soft:#f6f1ff;
  --green:#4A148C;
  --green-bg:#F1E8FA;
  --red:#8A1C3A;
  --red-bg:#FCEBF0;
  --yellow:#7A4D00;
  --yellow-bg:#fff7e6;
  --cyan:#0369a1;
  --cyan-bg:#e8f5ff;
  --bg:#f6f7fb;
  --card:#ffffff;
  --surface-alt:#f9fafb;
  --border:#dfe5ee;
  --border-strong:#b8c2d1;
  --text:#101828;
  --muted:#667085;
  --sidebar-bg:#ffffff;
  --sidebar-txt:#344054;
  --sidebar-w:268px;
  --topbar-h:66px;
  --r:6px;
  --focus:0 0 0 3px rgba(91,31,143,.18);
  --shadow:0 1px 2px rgba(16,24,40,.05);
  --shadow-lg:0 18px 44px rgba(16,24,40,.18);
  --action:#4A148C;
  --action-dark:#4B0082;
}

html{font-size:15px}
body{
  background:var(--bg);
  color:var(--text);
  letter-spacing:0;
}
a{color:var(--blue)}
a:hover{color:var(--blue-dark)}

.app-icon{
  width:18px;
  height:18px;
  display:block;
  flex:0 0 auto;
}
.brand-icon .app-icon,
.auth-logo-icon .app-icon{
  width:20px;
  height:20px;
}

.main-content{background:var(--bg)}
.page-body{
  max-width:1480px;
  width:100%;
  padding:28px 30px 42px;
}

.sidebar{
  background:var(--sidebar-bg);
  color:var(--sidebar-txt);
  border-right:1px solid var(--border);
  box-shadow:none;
}
.sidebar-brand{
  min-height:72px;
  padding:18px 18px;
  border-bottom:1px solid var(--border);
}
.brand-icon{
  width:36px;
  height:36px;
  border-radius:8px;
  background:var(--blue);
  color:#fff;
  box-shadow:none;
}
.brand-text{
  color:var(--text);
  font-weight:850;
}
.brand-text small{color:var(--muted)}
.sidebar-close{
  background:var(--surface-alt);
  color:var(--text);
  border:1px solid var(--border);
}
.sidebar-user{
  padding:16px 18px;
  border-bottom:1px solid var(--border);
  background:#fff;
}
.avatar{
  background:var(--blue-light);
  color:var(--blue);
  border:1px solid rgba(91,31,143,.18);
}
.sidebar-user-name{color:var(--text)}
.sidebar-user-role{color:var(--muted);opacity:1}
.sidebar-nav{padding:12px 10px}
.nav-section{
  padding:18px 10px 6px;
  color:#8a94a6;
  letter-spacing:.08em;
}
.nav-link{
  min-height:40px;
  padding:9px 10px;
  margin:1px 0;
  border-radius:6px;
  color:var(--sidebar-txt);
  border-left:3px solid transparent;
  font-weight:650;
  gap:10px;
}
.nav-link:hover,
.nav-link.active{
  background:var(--blue-light);
  color:var(--blue-dark);
  transform:none;
}
.nav-link.active{
  border-left-color:var(--blue);
}
.nav-link.active::before{display:none}
.nav-icon{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:inherit;
  opacity:1;
}
.sidebar-footer{
  padding:12px 10px 16px;
  border-top:1px solid var(--border);
  background:#fff;
}
.sidebar-footer .nav-link{
  padding:9px 10px;
  font-size:.82rem;
}
.nav-link-danger{color:var(--red)}
.nav-link-danger:hover{background:var(--red-bg);color:var(--red)}
.sidebar-overlay{background:rgba(16,24,40,.42);backdrop-filter:none}

.topbar{
  background:#fff;
  border-bottom:1px solid var(--border);
  box-shadow:none;
  backdrop-filter:none;
  padding:0 30px;
}
.topbar::after{display:none}
.topbar-title{
  font-size:1.18rem;
  font-weight:850;
  color:var(--text);
}
.hamburger{
  border-radius:6px;
  color:var(--text);
  background:#fff;
}
.hamburger:hover{background:var(--surface-alt);border-color:var(--border-strong)}
.topbar-cohort,
.context-switcher select,
.form-select-sm{
  border-radius:6px;
  border-color:var(--border);
  background-color:#fff;
}

.card,
.modal,
.modal-box,
.table-wrap,
.quick-action,
.stat-card{
  border-radius:var(--r);
  border:1px solid var(--border);
  background:var(--card);
  box-shadow:var(--shadow);
}
.card{
  padding:20px;
  margin-bottom:18px;
}
.card-header{
  padding-bottom:14px;
  margin-bottom:14px;
  border-bottom:1px solid var(--border);
}
.card-title{
  font-size:1rem;
  font-weight:850;
}
.page-body > .card[style*="linear-gradient"],
.page-body > div[style*="linear-gradient"],
.card[style*="linear-gradient"]{
  background:#fff!important;
  color:var(--text)!important;
  border:1px solid var(--border)!important;
  box-shadow:var(--shadow)!important;
}
.page-body > .card[style*="linear-gradient"] *,
.page-body > div[style*="linear-gradient"] *,
.card[style*="linear-gradient"] *{
  color:inherit!important;
}

.stats-grid{
  gap:14px;
  margin-bottom:22px;
}
.stat-card{
  border-top:0;
  padding:18px;
  background:#fff;
  position:relative;
}
.stat-card::before{
  content:'';
  position:absolute;
  left:18px;
  top:0;
  width:42px;
  height:3px;
  border-radius:0 0 3px 3px;
  background:var(--blue);
}
.stat-card:nth-child(2)::before{background:var(--green)}
.stat-card:nth-child(3)::before{background:var(--orange)}
.stat-card:nth-child(4)::before{background:var(--cyan)}
.stat-card:nth-child(5)::before{background:var(--red)}
.stat-value{
  color:var(--text);
  font-size:1.9rem;
  font-weight:850;
}
.stat-label{
  color:var(--muted);
  font-size:.76rem;
  letter-spacing:.04em;
}
.stat-subtitle,
.text-muted,
.text-small{color:var(--muted)!important}

.table-wrap{
  overflow:auto;
}
table{
  border-collapse:separate;
  border-spacing:0;
}
thead{
  background:var(--surface-alt);
}
table th{
  color:#475467;
  background:var(--surface-alt);
  border-bottom:1px solid var(--border);
  font-size:.72rem;
  letter-spacing:.04em;
}
table td{
  border-bottom:1px solid #edf1f6;
}
table tbody tr:hover{
  background:#fbfcff;
}

.btn{
  border-radius:6px;
  border-width:1px;
  box-shadow:none;
  font-weight:750;
  letter-spacing:0;
  transform:none!important;
}
.btn-primary{
  background:var(--action);
  border-color:var(--action);
  color:#fff;
}
.btn-primary:hover,
.btn-primary:focus{
  background:var(--action-dark);
  border-color:var(--action-dark);
  color:#fff;
}
.btn-outline,
.btn-outline-primary,
.btn-outline-secondary{
  background:#fff;
  color:var(--text);
  border-color:var(--border-strong);
}
.btn-outline:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover{
  background:var(--surface-alt);
  border-color:var(--border-strong);
  color:var(--text);
}
.btn-success{background:var(--green);border-color:var(--green)}
.btn-warning{background:var(--yellow);border-color:var(--yellow)}
.btn-danger{background:var(--red);border-color:var(--red)}
.btn-info{background:var(--cyan);border-color:var(--cyan)}

.badge{
  border-radius:999px;
  font-weight:750;
  letter-spacing:0;
}
.badge-primary{background:var(--blue-light);color:var(--blue)}
.badge-success{background:var(--green-bg);color:var(--green)}
.badge-warning{background:var(--yellow-bg);color:var(--yellow)}
.badge-danger{background:var(--red-bg);color:var(--red)}
.badge-info{background:var(--cyan-bg);color:var(--cyan)}
.badge-muted{background:#eef2f7;color:var(--muted)}

input,
select,
textarea,
.form-control{
  border-radius:6px!important;
  border-color:var(--border)!important;
  background:#fff;
}
input:focus,
select:focus,
textarea:focus,
.form-control:focus{
  border-color:var(--blue)!important;
  box-shadow:var(--focus)!important;
}
label{
  color:#344054;
  font-weight:750;
}
.form-hint,
.form-text{color:var(--muted)}

.alert{
  border-radius:6px;
  border-width:1px;
  box-shadow:none;
}
.alert-info{background:var(--cyan-bg);border-color:#b9e6fe;color:#075985}
.alert-success{background:var(--green-bg);border-color:#bbf7d0;color:#166534}
.alert-warning{background:var(--yellow-bg);border-color:#fed7aa;color:#92400e}
.alert-danger{background:var(--red-bg);border-color:#fecaca;color:#991b1b}

.quick-actions{gap:12px}
.quick-action{
  padding:16px;
  text-align:left;
}
.quick-action:hover{
  background:#fff;
  border-color:rgba(91,31,143,.26);
  box-shadow:0 8px 22px rgba(16,24,40,.08);
  transform:none;
}
.quick-action-icon{
  color:var(--blue);
  font-size:1.2rem;
}
.empty-state-icon{
  background:var(--blue-light);
  color:var(--blue);
  border-radius:8px;
}

.cip-stage{
  border-radius:6px;
  background:#fff;
  box-shadow:none;
}
.cip-stage:hover{
  box-shadow:var(--shadow);
  border-color:var(--blue);
}
.cip-stage.approved{background:var(--green-bg)}
.cip-stage.submitted{background:var(--cyan-bg)}
.cip-stage.revision{background:var(--yellow-bg)}

.auth-page{
  background:var(--bg);
  min-height:100vh;
}
.auth-page::before{
  content:'';
  position:fixed;
  left:0;
  top:0;
  bottom:0;
  width:7px;
  background:var(--blue);
}
.auth-card{
  border-radius:10px;
  border:1px solid var(--border);
  box-shadow:0 18px 50px rgba(16,24,40,.12);
}
.auth-logo-icon{
  background:var(--blue);
  color:#fff;
  border-radius:8px;
  box-shadow:none;
}
.logo-name,
.auth-logo h1{color:var(--text)}
.role-option-icon{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--blue);
  background:var(--blue-light);
  border-radius:8px;
  flex:0 0 auto;
}
.role-option-icon .app-icon{
  width:18px;
  height:18px;
}
.role-option-button{
  width:100%;
  display:flex;
  align-items:center;
  gap:14px;
  padding:15px 18px;
  border:1px solid var(--border);
  border-radius:8px;
  background:#fff;
  cursor:pointer;
  text-align:left;
  color:var(--text);
  font-size:.98rem;
  font-weight:750;
  transition:border-color .15s,background .15s,box-shadow .15s;
}
.role-option-button:hover,
.role-option-button:focus-visible{
  border-color:var(--blue);
  background:var(--blue-light);
  box-shadow:var(--focus);
}
.role-option-action{
  margin-left:auto;
  font-size:.76rem;
  font-weight:750;
  color:var(--muted);
}

.pagination,
.pagination-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-top:16px;
  color:var(--muted);
}
.pagination a,
.pagination span,
.pagination-bar a,
.pagination-bar span{
  min-width:34px;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px;
  border-radius:6px;
  border:1px solid var(--border);
  background:#fff;
  color:var(--text);
  font-size:.84rem;
  text-decoration:none;
}
.pagination a:hover,
.pagination-bar a:hover{
  border-color:var(--blue);
  background:var(--blue-light);
  color:var(--blue-dark);
}
.pagination span.current,
.pagination-bar span.current{
  background:var(--blue);
  border-color:var(--blue);
  color:#fff;
}
.pagination span.disabled,
.pagination-bar span.disabled{
  opacity:.45;
}

.member-filter-row,
.filter-row{
  display:flex;
  align-items:end;
  gap:10px;
  flex-wrap:wrap;
  margin:0 0 14px;
}
.member-filter-row input,
.filter-row input{
  min-width:min(320px,100%);
}
.review-entry{
  border:1px solid var(--border);
  border-radius:6px;
  padding:16px;
  margin-bottom:12px;
  background:#fff;
}
.status-dot{
  width:9px;
  height:9px;
  display:inline-block;
  border-radius:50%;
  background:var(--muted);
  margin-right:6px;
}
.status-dot.ok{background:var(--green)}
.status-dot.warn{background:var(--yellow)}
.status-dot.bad{background:var(--red)}

.resource-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.resource-item{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:12px 0;
  border-bottom:1px solid var(--border);
}
.resource-item:last-child{border-bottom:0}
.resource-title{
  font-weight:700;
  font-size:.92rem;
  color:var(--text);
}
.resource-desc{
  margin-top:4px;
  font-size:.82rem;
  line-height:1.55;
  color:var(--text);
}
.resource-meta{
  margin-top:5px;
  font-size:.72rem;
  color:var(--muted);
}

@media(max-width:768px){
  .page-body{padding:18px}
  .topbar{padding:0 16px}
  .sidebar{
    box-shadow:18px 0 42px rgba(16,24,40,.18);
  }
  .nav-link{
    padding:11px 12px;
  }
}

/* Print */
@media print{
  .sidebar,.topbar,.hamburger,.sidebar-overlay,.btn{display:none!important}
  .main-content{margin-left:0!important}
  .page-body{padding:0!important}
  .card{box-shadow:none!important;border:1px solid #ccc!important}
}

/* Designer-grade workspace layer */
:root{
  --ink:#182230;
  --ink-soft:#344054;
  --paper:#f7f8fb;
  --panel:#ffffff;
  --panel-soft:#fbfcfe;
  --line:#d9e0ea;
  --line-strong:#b9c4d2;
  --muted:#667085;
  --violet:#5a3d91;
  --violet-soft:#f1edfb;
  --teal:#0f766e;
  --teal-soft:#e7f6f3;
  --coral:#c65f46;
  --coral-soft:#fff0eb;
  --leaf:#2f855a;
  --leaf-soft:#e9f7ef;
  --gold:#a36212;
  --gold-soft:#fff5df;
  --sky:#286fa8;
  --sky-soft:#eaf5ff;
  --danger:#b42318;
  --danger-soft:#fff1f0;
  --blue:var(--violet);
  --blue-dark:#332650;
  --blue-mid:#7057ad;
  --blue-light:var(--violet-soft);
  --orange:var(--coral);
  --light-orange:#d98a72;
  --orange-soft:var(--coral-soft);
  --green:var(--leaf);
  --green-bg:var(--leaf-soft);
  --red:var(--danger);
  --red-bg:var(--danger-soft);
  --yellow:var(--gold);
  --yellow-bg:var(--gold-soft);
  --cyan:var(--sky);
  --cyan-bg:var(--sky-soft);
  --bg:var(--paper);
  --card:var(--panel);
  --surface-alt:var(--panel-soft);
  --border:var(--line);
  --border-strong:var(--line-strong);
  --text:var(--ink);
  --sidebar-w:276px;
  --topbar-h:70px;
  --r:8px;
  --focus:0 0 0 3px rgba(15,118,110,.16);
  --shadow:0 1px 2px rgba(16,24,40,.05),0 10px 24px rgba(16,24,40,.04);
  --shadow-lg:0 24px 70px rgba(16,24,40,.20);
  --action:var(--teal);
  --action-dark:#0b5f59;
}

body.ldtp-shell{
  background:
    linear-gradient(180deg,#ffffff 0,#ffffff 72px,var(--paper) 72px,var(--paper) 100%);
  color:var(--ink);
}

.app-layout{
  background:var(--paper);
}

.page-body{
  padding:30px 34px 46px;
}

.sidebar{
  background:#fff;
  border-right:1px solid var(--line);
}
.sidebar-brand{
  gap:12px;
  padding:18px 20px;
}
.brand-icon{
  background:var(--ink);
  border-radius:8px;
}
.brand-text{
  display:block;
  font-size:1rem;
  line-height:1.05;
}
.brand-text small{
  margin-top:4px;
  font-size:.67rem;
  color:var(--muted);
  max-width:170px;
}
.sidebar-user{
  margin:10px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--panel-soft);
}
.avatar{
  border-radius:8px;
  background:var(--teal-soft);
  color:var(--teal);
  border-color:#b8e1da;
}
.sidebar-nav{
  padding:8px 10px 14px;
}
.nav-section{
  padding:17px 10px 7px;
  font-size:.64rem;
  color:#98a2b3;
}
.nav-link{
  border-radius:7px;
  border-left:0;
  color:#344054;
  font-size:.88rem;
  font-weight:680;
}
.nav-link:hover{
  background:#f4f7fa;
  color:var(--ink);
}
.nav-link.active{
  background:var(--teal-soft);
  color:#0b5f59;
}
.nav-link.active .nav-icon{
  color:var(--teal);
}
.nav-link .badge{
  box-shadow:0 0 0 2px #fff;
}
.sidebar-footer{
  padding:12px 10px 18px;
}

.topbar{
  height:var(--topbar-h);
  padding:0 34px;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--line);
}
.topbar-title{
  font-size:1.18rem;
  font-weight:820;
}
.topbar-right .badge-info{
  background:var(--violet-soft);
  color:var(--violet);
}
.context-switcher select,
.topbar .form-select,
.topbar-cohort{
  min-height:36px;
  border-radius:999px!important;
  background:#fff;
  border:1px solid var(--line);
}

.announcement-dock{
  margin:20px 34px 0;
  grid-template-columns:minmax(180px,230px) 1fr;
}
.announcement-dock-head{
  background:#fff;
  border-color:var(--line);
  border-left:4px solid var(--coral);
}
.announcement-icon{
  background:var(--coral-soft);
  color:var(--coral);
  border:0;
}
.announcement-note{
  border-color:var(--line);
  border-left-color:#c9d3e1;
  box-shadow:var(--shadow);
}
.announcement-note.is-unread{
  border-left-color:var(--teal);
}

.card{
  padding:22px;
  border-color:var(--line);
}
.card-header{
  border-bottom-color:#edf1f6;
}
.card-title{
  color:var(--ink);
}

.stats-grid{
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr))!important;
}
.stat-card{
  min-height:124px;
  padding:20px;
  background:#fff;
}
.stat-card::before{
  left:20px;
  width:36px;
  background:var(--teal);
}
.stat-card:nth-child(2)::before{background:var(--violet)}
.stat-card:nth-child(3)::before{background:var(--coral)}
.stat-card:nth-child(4)::before{background:var(--sky)}
.stat-card:nth-child(5)::before{background:var(--leaf)}
.stat-value{
  font-size:2rem;
  letter-spacing:0;
}
.stat-label{
  color:#667085;
  font-weight:820;
}

.btn{
  border-radius:7px;
  min-height:40px;
  font-weight:760;
}
.btn-primary{
  background:var(--teal);
  border-color:var(--teal);
}
.btn-primary:hover,
.btn-primary:focus{
  background:var(--action-dark);
  border-color:var(--action-dark);
}
.btn-light{
  background:#fff;
  border-color:var(--line);
  color:var(--ink-soft);
}
.btn-light:hover{
  background:var(--panel-soft);
  border-color:var(--line-strong);
}
.btn-outline,
.btn-outline-primary,
.btn-outline-secondary{
  border-color:var(--line-strong);
  color:var(--ink);
}
.btn-outline:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover{
  background:var(--teal-soft);
  border-color:#99d6ce;
  color:#0b5f59;
}

.badge{
  padding:4px 9px;
  font-size:.69rem;
}
.badge-primary{background:var(--violet-soft);color:var(--violet)}
.badge-success{background:var(--leaf-soft);color:var(--leaf)}
.badge-warning{background:var(--gold-soft);color:var(--gold)}
.badge-danger{background:var(--danger-soft);color:var(--danger)}
.badge-info{background:var(--sky-soft);color:var(--sky)}

.table-wrap{
  border-color:var(--line);
}
table{
  font-size:.88rem;
}
table th{
  background:#f8fafc;
  color:#475467;
}
table td{
  color:var(--ink);
}
table tbody tr:hover{
  background:#f7fbfb;
}

.form-control,
form input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),
form select,
form textarea{
  min-height:44px;
  border-radius:7px!important;
  border-color:var(--line-strong)!important;
}
.form-control:focus,
form input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):focus,
form select:focus,
form textarea:focus{
  border-color:var(--teal)!important;
}
form input[type=file]{
  border-color:#afd9d3;
  background:#f7fcfb;
}

.progress{
  height:9px;
  background:#e8edf3;
}
.progress-bar{background:var(--teal)}
.progress-bar.success{background:var(--leaf)}
.progress-bar.warning{background:var(--gold)}
.progress-bar.danger{background:var(--danger)}

.modal-header{
  background:var(--ink);
}
.modal-header::after{
  background:linear-gradient(90deg,var(--teal),var(--coral),transparent);
}

.auth-page{
  background:
    linear-gradient(90deg,var(--ink) 0 38%,transparent 38%),
    var(--paper);
}
.auth-page::before{
  width:0;
}
.auth-card{
  border-top:0;
  border-radius:12px;
  box-shadow:0 26px 70px rgba(16,24,40,.16);
}
.auth-logo-icon{
  background:var(--teal-soft);
  color:var(--teal);
}

.quick-actions{
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
}
.quick-action{
  border-color:var(--line);
  background:#fff;
}
.quick-action:hover{
  border-color:#9bd6cf;
  background:#fbfefd;
}
.quick-action-icon{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  background:var(--teal-soft);
  color:var(--teal);
  margin-bottom:10px;
}

.empty-state{
  border:1px dashed transparent;
}
.empty-state-icon{
  background:var(--panel-soft);
  color:var(--teal);
  border:1px solid var(--line);
}

.resource-list{
  gap:12px;
}
.resource-item{
  padding:14px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
}
.resource-item:last-child{
  border-bottom:1px solid var(--line);
}
.resource-title{
  font-size:.94rem;
  font-weight:780;
}
.resource-meta{
  color:#7c8798;
}

.submission-box{
  background:#fbfcfe;
  border-color:var(--line);
}

.ldtp-tour-popover{
  border-radius:10px;
}
.ldtp-tour-kicker{
  color:var(--teal);
}
.ldtp-tour-highlight{
  outline-color:rgba(15,118,110,.72);
}

@media(max-width:768px){
  .page-body{padding:18px 16px 30px}
  .topbar{padding:0 16px}
  .announcement-dock{
    margin:16px 16px 0;
    grid-template-columns:1fr;
    gap:10px;
  }
  .announcement-stack{
    grid-template-columns:1fr;
  }
  .announcement-note{
    min-height:auto;
    padding:15px;
  }
  .sidebar-user{margin:8px 10px}
  .stats-grid{grid-template-columns:1fr 1fr!important}
}

@media(max-width:520px){
  .topbar{
    height:auto;
    min-height:82px;
    align-items:flex-start;
    flex-wrap:wrap;
    gap:8px 10px;
    padding-top:12px;
    padding-bottom:12px;
  }
  .hamburger{
    flex:0 0 40px;
  }
  .topbar-title{
    flex:1 1 calc(100% - 56px);
    min-height:40px;
    display:flex;
    align-items:center;
  }
  .topbar-right{
    flex:1 1 100%;
    width:100%;
    min-width:0;
    margin-left:50px;
    justify-content:flex-start;
    flex-wrap:nowrap;
  }
  .topbar .form-select,
  .topbar-cohort{
    max-width:min(250px,calc(100vw - 92px));
  }
  .stats-grid,
  .quick-actions{grid-template-columns:1fr!important}
  .auth-page{
    background:var(--paper);
  }
  .auth-card{
    padding:30px 22px;
  }
}

/* LDTP final product polish */
:root{
  --ldtp-primary:#4B0082;
  --ldtp-deep:#4A148C;
  --ldtp-ink:#21152f;
  --ldtp-ink-soft:#4d425f;
  --ldtp-paper:#f8f6fb;
  --ldtp-paper-strong:#f1ebf8;
  --ldtp-soft:#f3eafd;
  --ldtp-soft-2:#eadcf8;
  --ldtp-line:#ddd3ea;
  --ldtp-line-strong:#c7b4da;
  --ldtp-white:#ffffff;
  --ldtp-success:#227a4f;
  --ldtp-warning:#9a5b00;
  --ldtp-danger:#b42318;
  --ldtp-info:#285f8f;
  --ink:var(--ldtp-ink);
  --ink-soft:var(--ldtp-ink-soft);
  --paper:var(--ldtp-paper);
  --panel:var(--ldtp-white);
  --panel-soft:#fcfbfe;
  --line:var(--ldtp-line);
  --line-strong:var(--ldtp-line-strong);
  --muted:#70647d;
  --violet:var(--ldtp-primary);
  --violet-soft:var(--ldtp-soft);
  --blue:var(--ldtp-primary);
  --blue-dark:var(--ldtp-deep);
  --blue-mid:#6f2dbd;
  --blue-light:var(--ldtp-soft);
  --teal:var(--ldtp-primary);
  --teal-soft:var(--ldtp-soft);
  --green:var(--ldtp-success);
  --green-bg:#eaf7f0;
  --yellow:var(--ldtp-warning);
  --yellow-bg:#fff4dc;
  --red:var(--ldtp-danger);
  --red-bg:#fff1f0;
  --cyan:var(--ldtp-info);
  --cyan-bg:#eaf4ff;
  --bg:var(--ldtp-paper);
  --card:var(--ldtp-white);
  --surface-alt:#faf8fd;
  --border:var(--ldtp-line);
  --border-strong:var(--ldtp-line-strong);
  --text:var(--ldtp-ink);
  --action:var(--ldtp-primary);
  --action-dark:var(--ldtp-deep);
  --focus:0 0 0 3px rgba(75,0,130,.18);
  --shadow:0 1px 2px rgba(33,21,47,.06),0 14px 32px rgba(33,21,47,.06);
  --shadow-lg:0 28px 80px rgba(33,21,47,.22);
  --clr-primary:var(--ldtp-primary);
  --clr-primary-dark:var(--ldtp-deep);
  --clr-primary-faint:var(--ldtp-soft);
  --clr-border:var(--ldtp-line);
  --clr-text:var(--ldtp-ink);
  --clr-text-muted:var(--muted);
}

html{
  scrollbar-color:var(--ldtp-line-strong) var(--ldtp-paper);
}
body.ldtp-shell{
  background:
    linear-gradient(180deg,#fff 0,#fff 70px,var(--ldtp-paper) 70px,var(--ldtp-paper) 100%);
  color:var(--ldtp-ink);
}
body.ldtp-shell::before{
  content:'';
  position:fixed;
  inset:0 auto 0 0;
  width:4px;
  background:var(--ldtp-primary);
  z-index:2200;
  pointer-events:none;
}
.main-content{
  background:var(--ldtp-paper);
}
.page-body{
  padding:32px 36px 52px;
}

.sidebar{
  background:var(--ldtp-white);
  border-right:1px solid var(--ldtp-line);
  box-shadow:1px 0 0 rgba(75,0,130,.03);
}
.sidebar-brand{
  min-height:72px;
  border-bottom:1px solid var(--ldtp-line);
}
.brand-icon{
  background:var(--ldtp-primary);
  color:#fff;
  box-shadow:0 10px 24px rgba(75,0,130,.22);
}
.brand-text{
  color:var(--ldtp-ink);
  font-weight:860;
}
.brand-text small{
  color:var(--muted);
}
.sidebar-user{
  background:#fff;
  border-color:var(--ldtp-line);
  box-shadow:0 1px 2px rgba(33,21,47,.03);
}
.avatar{
  background:var(--ldtp-soft);
  color:var(--ldtp-primary);
  border-color:var(--ldtp-line-strong);
}
.sidebar-user-name{
  color:var(--ldtp-ink);
  font-weight:780;
}
.sidebar-user-role{
  color:var(--muted);
}
.nav-section{
  color:#9688a6;
  font-weight:850;
  letter-spacing:.08em;
}
.nav-link{
  border-radius:8px;
  color:#3f354e;
  font-weight:720;
}
.nav-link:hover{
  background:var(--ldtp-paper-strong);
  color:var(--ldtp-deep);
}
.nav-link.active{
  background:var(--ldtp-primary);
  color:#fff;
  box-shadow:0 10px 24px rgba(75,0,130,.16);
}
.nav-link.active .nav-icon{
  color:#fff;
}
.nav-link-danger{
  color:var(--ldtp-danger);
}
.sidebar-footer{
  border-top-color:var(--ldtp-line);
}

.topbar{
  min-height:70px;
  background:rgba(255,255,255,.98);
  border-bottom:1px solid var(--ldtp-line);
  box-shadow:0 1px 0 rgba(75,0,130,.03);
}
.topbar-title{
  color:var(--ldtp-ink);
  font-size:1.2rem;
  font-weight:860;
}
.hamburger{
  color:var(--ldtp-primary);
  border-color:var(--ldtp-line);
  background:#fff;
}
.hamburger:hover{
  background:var(--ldtp-soft);
  border-color:var(--ldtp-line-strong);
}
.topbar-right .badge-info{
  background:var(--ldtp-soft);
  color:var(--ldtp-deep);
}
.context-switcher select,
.topbar .form-select,
.topbar-cohort{
  border-color:var(--ldtp-line);
  color:var(--ldtp-ink);
  box-shadow:0 1px 2px rgba(33,21,47,.04);
}

.announcement-dock{
  margin:18px 36px 0;
  gap:12px;
  grid-template-columns:minmax(190px,240px) minmax(0,1fr);
}
.announcement-dock-head,
.announcement-note{
  border-radius:8px;
  background:#fff;
  border:1px solid var(--ldtp-line);
  box-shadow:var(--shadow);
}
.announcement-dock-head{
  border-left:4px solid var(--ldtp-primary);
}
.announcement-icon{
  background:var(--ldtp-soft);
  color:var(--ldtp-primary);
}
.announcement-kicker{
  color:var(--muted);
}
.announcement-note{
  border-left:0;
  border-top:3px solid var(--ldtp-primary);
}
.announcement-note.is-unread{
  border-top-color:var(--ldtp-primary);
}
.announcement-note h3{
  color:var(--ldtp-ink);
}
.announcement-note p{
  color:var(--ldtp-ink-soft);
}
.announcement-read{
  color:var(--ldtp-primary);
}

.card,
.modal-box,
.table-wrap,
.stat-card,
.quick-action{
  border-radius:8px;
  border-color:var(--ldtp-line);
  background:#fff;
  box-shadow:var(--shadow);
}
.card{
  padding:24px;
}
.card-header{
  background:#fbf9fd;
  border-bottom:1px solid var(--ldtp-line);
  border-radius:6px;
  padding:14px 16px;
  margin-bottom:16px;
}
.card-title{
  color:var(--ldtp-ink);
  font-size:1rem;
  font-weight:860;
}
.stats-grid{
  gap:16px;
}
.stat-card{
  min-height:128px;
  padding:22px;
  overflow:hidden;
}
.stat-card::before{
  height:4px;
  width:42px;
  background:var(--ldtp-primary);
}
.stat-card:nth-child(2)::before{background:var(--ldtp-deep)}
.stat-card:nth-child(3)::before{background:#7b2cbf}
.stat-card:nth-child(4)::before{background:#9d4edd}
.stat-card:nth-child(5)::before{background:var(--ldtp-info)}
.stat-value{
  color:var(--ldtp-ink);
  font-weight:880;
}
.stat-label{
  color:#5f526f;
  font-weight:840;
}

.btn{
  border-radius:8px;
  min-height:40px;
  font-weight:780;
}
.btn-primary{
  background:var(--ldtp-primary);
  border-color:var(--ldtp-primary);
  color:#fff;
}
.btn-primary:hover,
.btn-primary:focus{
  background:var(--ldtp-deep);
  border-color:var(--ldtp-deep);
  color:#fff;
}
.btn-light,
.btn-outline,
.btn-outline-primary,
.btn-outline-secondary{
  background:#fff;
  border-color:var(--ldtp-line-strong);
  color:var(--ldtp-ink);
}
.btn-light:hover,
.btn-outline:hover,
.btn-outline-primary:hover,
.btn-outline-secondary:hover{
  background:var(--ldtp-soft);
  border-color:var(--ldtp-primary);
  color:var(--ldtp-deep);
}

.badge-primary,
.badge-info{
  background:var(--ldtp-soft);
  color:var(--ldtp-deep);
}
.badge-success{background:var(--green-bg);color:var(--ldtp-success)}
.badge-warning{background:var(--yellow-bg);color:var(--ldtp-warning)}
.badge-danger{background:var(--red-bg);color:var(--ldtp-danger)}
.badge-muted{background:#f0edf4;color:var(--muted)}

input,
select,
textarea,
.form-control,
form input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),
form select,
form textarea{
  border-color:var(--ldtp-line-strong)!important;
  color:var(--ldtp-ink);
  background:#fff;
}
input:focus,
select:focus,
textarea:focus,
.form-control:focus,
form input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):focus,
form select:focus,
form textarea:focus{
  border-color:var(--ldtp-primary)!important;
  box-shadow:var(--focus)!important;
}
label{
  color:var(--ldtp-ink);
}

.progress{
  background:#ece5f3;
}
.progress-bar{
  background:var(--ldtp-primary);
}
.progress-bar.success{
  background:var(--ldtp-success);
}
.progress-bar.warning{
  background:var(--ldtp-warning);
}
.progress-bar.danger{
  background:var(--ldtp-danger);
}

.quick-actions{
  gap:12px;
}
.quick-action{
  min-height:78px;
  padding:16px;
  display:flex;
  align-items:center;
  gap:12px;
  text-align:left;
}
.quick-action:hover{
  border-color:var(--ldtp-primary);
  background:#fff;
  box-shadow:0 16px 34px rgba(75,0,130,.12);
}
.quick-action-icon{
  width:40px;
  height:40px;
  margin:0;
  border-radius:8px;
  background:var(--ldtp-soft);
  color:var(--ldtp-primary);
  flex:0 0 auto;
}
.quick-action span{
  color:var(--ldtp-ink);
  font-size:.9rem;
}

.resource-list{
  gap:12px;
}
.resource-item{
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  padding:16px;
  transition:border-color .16s, box-shadow .16s, transform .16s;
}
.resource-item:hover{
  border-color:var(--ldtp-line-strong);
  box-shadow:0 12px 26px rgba(75,0,130,.08);
  transform:translateY(-1px);
}
.resource-title{
  color:var(--ldtp-ink);
  font-weight:820;
}
.resource-desc{
  color:var(--ldtp-ink-soft);
}
.resource-meta{
  color:#776985;
}

.table-wrap{
  overflow:auto;
}
table th{
  background:#faf8fd;
  color:#5d526b;
}
table tbody tr:hover{
  background:#fcf9ff;
}

.empty-state-icon,
.auth-logo-icon,
.role-option-icon{
  background:var(--ldtp-soft);
  color:var(--ldtp-primary);
}
.auth-page{
  background:
    linear-gradient(90deg,var(--ldtp-primary) 0 34%,transparent 34%),
    var(--ldtp-paper);
}
.auth-card{
  border:1px solid var(--ldtp-line);
}
.role-option-button:hover,
.role-option-button:focus-visible{
  border-color:var(--ldtp-primary);
  background:var(--ldtp-soft);
}

.page-body > div[style*="grid-template-columns:1fr 1fr"]{
  grid-template-columns:minmax(0,1.04fr) minmax(320px,.96fr)!important;
}
.page-body > div[style*="grid-template-columns:repeat(2,1fr)"]{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.page-body > div[style*="grid-template-columns:repeat(3,1fr)"]{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}
.page-body > div[style*="grid-template-columns:repeat(4,1fr)"]{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

.ldtp-tour-overlay{
  z-index:2147482000;
  background:rgba(33,21,47,.54);
  backdrop-filter:blur(2px);
}
body.ldtp-tour-active{
  overflow-x:hidden;
}
.ldtp-tour-highlight{
  z-index:2147482500!important;
  outline:3px solid rgba(75,0,130,.82);
  outline-offset:5px;
  box-shadow:0 0 0 6px rgba(75,0,130,.14);
  pointer-events:none;
}
#sidebar.ldtp-tour-highlight,
.sidebar.ldtp-tour-highlight{
  outline-offset:-5px;
  box-shadow:inset 0 0 0 5px rgba(75,0,130,.2);
}
.ldtp-tour-popover{
  z-index:2147483000;
  border:1px solid var(--ldtp-line);
  border-top:4px solid var(--ldtp-primary);
  border-radius:10px;
  box-shadow:0 30px 90px rgba(33,21,47,.28);
}
.ldtp-tour-kicker{
  color:var(--ldtp-primary);
}
.ldtp-tour-popover h3{
  color:var(--ldtp-ink);
}
.ldtp-tour-actions .btn{
  min-height:34px;
}

@media(max-width:960px){
  .page-body{
    padding:22px 18px 42px;
  }
  .announcement-dock{
    grid-template-columns:1fr;
    margin:16px 18px 0;
  }
  .announcement-stack{
    grid-template-columns:1fr;
  }
  .page-body > div[style*="grid-template-columns:1fr 1fr"],
  .page-body > div[style*="grid-template-columns:repeat(2,1fr)"],
  .page-body > div[style*="grid-template-columns:repeat(3,1fr)"],
  .page-body > div[style*="grid-template-columns:repeat(4,1fr)"]{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:768px){
  body.ldtp-shell::before{
    width:3px;
  }
  .sidebar{
    box-shadow:22px 0 60px rgba(33,21,47,.22);
  }
  .topbar{
    padding-left:16px;
    padding-right:16px;
  }
  .stat-card{
    min-height:118px;
  }
}

@media(max-width:520px){
  .topbar{
    min-height:104px;
  }
  .topbar-title{
    font-size:1.08rem;
  }
  .topbar-right{
    margin-left:50px;
    overflow:hidden;
  }
  .topbar .form-select,
  .topbar-cohort{
    max-width:min(248px,calc(100vw - 92px));
  }
  .announcement-dock{
    margin:14px 14px 0;
  }
  .page-body{
    padding:18px 14px 38px;
  }
  .card{
    padding:18px;
  }
  .card-header{
    padding:12px;
  }
  .resource-item{
    flex-direction:column;
  }
  .resource-item .btn{
    width:100%;
  }
  .auth-page{
    background:var(--ldtp-paper);
  }
  .ldtp-tour-popover{
    width:calc(100vw - 28px);
  }
  .ldtp-tour-footer{
    align-items:flex-start;
    flex-direction:column;
  }
  .ldtp-tour-actions{
    width:100%;
    justify-content:flex-end;
    flex-wrap:wrap;
  }
}

/* LDTP workspace template refinement: purple + white operational LMS */
:root{
  --ldtp-success:var(--ldtp-deep);
  --green:var(--ldtp-deep);
  --green-bg:var(--ldtp-soft);
  --clr-success:var(--ldtp-deep);
}

.workspace-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:18px;
}
.workspace-actions{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.segmented-tabs{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}
.segmented-tabs label{
  margin:0 4px 0 0;
  color:var(--ldtp-ink);
  font-size:.88rem;
  font-weight:820;
}
.segment-tab{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:9px 14px;
  border:1px solid var(--ldtp-line-strong);
  border-radius:8px;
  color:var(--ldtp-deep);
  background:#fff;
  font-size:.83rem;
  font-weight:780;
  text-decoration:none;
  transition:background .16s,border-color .16s,box-shadow .16s,color .16s;
}
.segment-tab:hover{
  color:var(--ldtp-primary);
  background:var(--ldtp-soft);
  border-color:var(--ldtp-primary);
}
.segment-tab.is-active{
  color:#fff;
  background:var(--ldtp-primary);
  border-color:var(--ldtp-primary);
  box-shadow:0 10px 24px rgba(75,0,130,.16);
}

.announcement-dock.is-empty .announcement-dock-head{
  border-left-color:var(--ldtp-line-strong);
}
.announcement-empty{
  border-top-color:var(--ldtp-line-strong);
  background:#fff;
}
.announcement-empty h3{
  color:var(--ldtp-ink);
}
.announcement-empty p{
  color:var(--muted);
}

.badge-success,
.bg-success{
  background:var(--ldtp-soft)!important;
  color:var(--ldtp-deep)!important;
}
.btn-success{
  background:var(--ldtp-primary)!important;
  border-color:var(--ldtp-primary)!important;
  color:#fff!important;
}
.btn-success:hover,
.btn-success:focus{
  background:var(--ldtp-deep)!important;
  border-color:var(--ldtp-deep)!important;
}
.alert-success{
  background:var(--ldtp-soft)!important;
  border-color:var(--ldtp-line-strong)!important;
  color:var(--ldtp-deep)!important;
}
.progress-bar.success,
.progress-bar.bg-success{
  background:var(--ldtp-primary)!important;
}
.text-success{
  color:var(--ldtp-deep)!important;
}
.status-dot.ok{
  background:var(--ldtp-primary)!important;
}
.cip-stage.approved{
  background:var(--ldtp-soft)!important;
  border-color:var(--ldtp-primary)!important;
  color:var(--ldtp-deep)!important;
}

@media(max-width:520px){
  .workspace-toolbar{
    align-items:stretch;
  }
  .segmented-tabs,
  .workspace-actions{
    width:100%;
  }
  .segment-tab{
    flex:1 1 calc(50% - 8px);
  }
}

/* LDTP complete UI overhaul: shared product design system */
:root{
  --ldtp-primary:#4A148C;
  --ldtp-deep:#4B0082;
  --ldtp-white:#FFFFFF;
  --ldtp-ink:#171321;
  --ldtp-text:#2E2738;
  --ldtp-muted:#70667D;
  --ldtp-faint:#F8F5FC;
  --ldtp-soft:#F1E8FA;
  --ldtp-soft-2:#FBF9FE;
  --ldtp-line:#E5DCEF;
  --ldtp-line-strong:#CDB9E2;
  --ldtp-danger:#8A1C3A;
  --ldtp-danger-soft:#FCEBF0;
  --ldtp-warning:#7A4D00;
  --ldtp-warning-soft:#FFF4D7;
  --ldtp-radius:8px;
  --ldtp-radius-sm:6px;
  --ldtp-shadow-sm:0 8px 22px rgba(41,24,59,.08);
  --ldtp-shadow:0 18px 48px rgba(41,24,59,.12);
  --ldtp-focus:0 0 0 3px rgba(74,20,140,.18);
  --clr-primary:var(--ldtp-primary);
  --clr-primary-dark:var(--ldtp-deep);
  --clr-primary-faint:var(--ldtp-soft);
  --clr-border:var(--ldtp-line);
  --clr-text:var(--ldtp-ink);
  --clr-text-muted:var(--ldtp-muted);
  --clr-success:var(--ldtp-primary);
  --clr-danger:var(--ldtp-danger);
  --clr-warning:var(--ldtp-warning);
  --green:var(--ldtp-primary);
  --green-bg:var(--ldtp-soft);
  --blue:var(--ldtp-deep);
  --blue-bg:var(--ldtp-soft);
  --cyan:var(--ldtp-primary);
  --cyan-bg:var(--ldtp-soft);
  --yellow:var(--ldtp-warning);
  --yellow-bg:var(--ldtp-warning-soft);
  --orange:var(--ldtp-warning);
  --orange-bg:var(--ldtp-warning-soft);
  --red:var(--ldtp-danger);
  --red-bg:var(--ldtp-danger-soft);
  --border:var(--ldtp-line);
  --muted:var(--ldtp-muted);
  --text:var(--ldtp-ink);
  --bg:var(--ldtp-faint);
  --gray-light:var(--ldtp-faint);
  --radius:var(--ldtp-radius);
}

*{
  letter-spacing:0!important;
}

body,
body.ldtp-shell,
.auth-page{
  color:var(--ldtp-text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:
    linear-gradient(180deg,#fff 0,var(--ldtp-soft-2) 52%,var(--ldtp-faint) 100%);
}

body.ldtp-shell::before{
  background:linear-gradient(180deg,var(--ldtp-primary),var(--ldtp-deep));
}

a{
  color:var(--ldtp-primary);
}

a:hover{
  color:var(--ldtp-deep);
}

:focus-visible{
  outline:2px solid var(--ldtp-primary);
  outline-offset:2px;
  box-shadow:var(--ldtp-focus);
}

.app-layout{
  background:transparent;
}

.main-content{
  background:linear-gradient(180deg,#fff 0,var(--ldtp-soft-2) 42%,var(--ldtp-faint) 100%);
  min-width:0;
}

.sidebar{
  width:272px;
  background:#fff;
  border-right:1px solid var(--ldtp-line);
  box-shadow:10px 0 34px rgba(41,24,59,.07);
}

.sidebar-brand{
  min-height:92px;
  padding:22px 18px;
  border-bottom:1px solid var(--ldtp-line);
}

.brand-icon,
.auth-logo-icon{
  background:linear-gradient(135deg,var(--ldtp-primary),var(--ldtp-deep));
  border-radius:8px;
  color:#fff;
  box-shadow:0 14px 30px rgba(75,0,130,.22);
}

.brand-text{
  color:var(--ldtp-ink);
  font-size:1rem;
  font-weight:850;
}

.brand-text small{
  display:block;
  color:var(--ldtp-muted);
  font-size:.7rem;
  font-weight:650;
  margin-top:2px;
}

.sidebar-user{
  margin:12px 10px 16px;
  padding:14px;
  background:linear-gradient(180deg,#fff,var(--ldtp-soft-2));
  border:1px solid var(--ldtp-line);
  border-radius:8px;
}

.avatar{
  background:var(--ldtp-soft);
  border:1px solid var(--ldtp-line-strong);
  color:var(--ldtp-deep);
  font-weight:850;
}

.sidebar-user-name{
  color:var(--ldtp-ink);
  font-weight:820;
}

.sidebar-user-role{
  color:var(--ldtp-muted);
}

.sidebar-nav{
  padding:0 10px 16px;
}

.nav-section{
  color:#82758F;
  font-size:.68rem;
  font-weight:850;
  margin:18px 10px 8px;
  text-transform:uppercase;
}

.nav-link{
  min-height:42px;
  border-radius:8px;
  color:#392F48;
  font-weight:720;
  gap:10px;
  padding:10px 12px;
}

.nav-link:hover{
  background:var(--ldtp-soft-2);
  color:var(--ldtp-primary);
}

.nav-link.active{
  background:var(--ldtp-primary);
  color:#fff;
  box-shadow:0 14px 28px rgba(74,20,140,.18);
}

.nav-link.active .nav-icon,
.nav-link.active .badge{
  color:#fff!important;
}

.nav-icon svg{
  width:18px;
  height:18px;
}

.sidebar-footer{
  background:#fff;
  border-top:1px solid var(--ldtp-line);
}

.topbar{
  min-height:92px;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--ldtp-line);
  padding:20px 34px;
}

.topbar-title{
  color:var(--ldtp-ink);
  font-size:1.24rem;
  font-weight:850;
}

.hamburger{
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  color:var(--ldtp-primary);
}

.topbar-cohort,
.topbar .form-select{
  border:1px solid var(--ldtp-line-strong)!important;
  border-radius:999px!important;
  color:var(--ldtp-deep);
  font-weight:720;
}

.page-body{
  max-width:1280px;
  margin:0 auto;
  padding:28px 34px 48px;
}

.announcement-dock{
  max-width:1280px;
  margin:22px auto 0;
  padding:0 34px;
  display:grid;
  grid-template-columns:minmax(220px,260px) 1fr;
  gap:14px;
}

.announcement-dock-head,
.announcement-note{
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  background:#fff;
  box-shadow:var(--ldtp-shadow-sm);
}

.announcement-dock-head{
  border-left:4px solid var(--ldtp-primary);
}

.announcement-icon{
  background:var(--ldtp-soft);
  color:var(--ldtp-primary);
}

.announcement-kicker{
  color:#746584;
  font-size:.68rem;
  font-weight:850;
  text-transform:uppercase;
}

.announcement-note h3{
  color:var(--ldtp-ink);
  font-size:.94rem;
  font-weight:820;
}

.announcement-note p{
  color:var(--ldtp-muted);
  font-size:.85rem;
}

.announcement-read{
  color:var(--ldtp-muted);
  font-size:.78rem;
  font-weight:750;
}

.workspace-hero{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin-bottom:22px;
  padding:24px 26px;
  background:
    radial-gradient(circle at 94% 18%,rgba(74,20,140,.10),transparent 30%),
    linear-gradient(135deg,#fff,var(--ldtp-soft-2));
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  box-shadow:var(--ldtp-shadow-sm);
}

.workspace-eyebrow{
  display:block;
  color:var(--ldtp-primary);
  font-size:.72rem;
  font-weight:850;
  margin-bottom:6px;
  text-transform:uppercase;
}

.workspace-hero h2,
.payment-toolbar h3,
.attendance-toolbar h3{
  color:var(--ldtp-ink);
  font-size:clamp(1.25rem,2vw,1.85rem);
  font-weight:900;
  margin:0 0 6px;
}

.workspace-hero p,
.payment-toolbar p,
.attendance-toolbar p{
  color:var(--ldtp-muted);
  font-size:.92rem;
  margin:0;
}

.workspace-hero-metrics,
.workspace-hero-tags{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.workspace-hero-metrics div{
  min-width:126px;
  padding:13px 16px;
  background:#fff;
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  text-align:left;
}

.workspace-hero-metrics strong{
  display:block;
  color:var(--ldtp-deep);
  font-size:1.35rem;
  font-weight:900;
}

.workspace-hero-metrics span{
  color:var(--ldtp-muted);
  font-size:.74rem;
  font-weight:750;
}

.card,
.stat-card,
.modal{
  border:1px solid var(--ldtp-line)!important;
  border-radius:8px!important;
  background:#fff!important;
  box-shadow:var(--ldtp-shadow-sm)!important;
}

.card{
  padding:20px;
}

.card-header{
  align-items:flex-start;
  border-bottom:1px solid var(--ldtp-line);
  margin:-20px -20px 18px;
  padding:16px 20px;
  background:linear-gradient(180deg,#fff,var(--ldtp-soft-2));
  border-radius:8px 8px 0 0;
}

.card-title{
  color:var(--ldtp-ink);
  font-size:1rem;
  font-weight:850;
}

.card-subtitle{
  color:var(--ldtp-muted);
  font-size:.82rem;
  margin:4px 0 0;
}

.stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(184px,1fr));
  gap:14px;
  margin-bottom:20px;
}

.stat-card{
  min-height:132px;
  padding:20px;
  border-top:4px solid var(--ldtp-primary)!important;
}

.stat-value{
  color:var(--ldtp-deep)!important;
  font-size:clamp(1.6rem,3vw,2.2rem);
  font-weight:950;
}

.stat-label{
  color:#5C506A;
  font-size:.74rem;
  font-weight:850;
  text-transform:uppercase;
}

.progress{
  background:var(--ldtp-soft)!important;
  border-radius:999px;
  height:9px;
}

.progress-bar,
.progress-bar.success,
.progress-bar.warning,
.progress-bar.danger{
  background:linear-gradient(90deg,var(--ldtp-primary),var(--ldtp-deep))!important;
  border-radius:999px;
}

.btn{
  border-radius:8px!important;
  font-weight:780!important;
  min-height:38px;
  padding:9px 14px;
  transition:background .16s,border-color .16s,color .16s,box-shadow .16s,transform .16s;
}

.btn:hover{
  transform:none;
}

.btn-primary{
  background:var(--ldtp-primary)!important;
  border-color:var(--ldtp-primary)!important;
  color:#fff!important;
  box-shadow:0 10px 24px rgba(74,20,140,.18);
}

.btn-primary:hover,
.btn-primary:focus{
  background:var(--ldtp-deep)!important;
  border-color:var(--ldtp-deep)!important;
}

.btn-outline,
.btn-outline-primary,
.btn-light{
  background:#fff!important;
  border:1px solid var(--ldtp-line-strong)!important;
  color:var(--ldtp-deep)!important;
}

.btn-outline:hover,
.btn-outline-primary:hover,
.btn-light:hover{
  background:var(--ldtp-soft)!important;
  color:var(--ldtp-deep)!important;
}

.btn-danger,
.badge-danger{
  background:var(--ldtp-danger-soft)!important;
  border-color:var(--ldtp-danger-soft)!important;
  color:var(--ldtp-danger)!important;
}

.badge{
  border-radius:999px!important;
  font-weight:820!important;
  padding:.38rem .62rem!important;
}

.badge-primary,
.badge-info{
  background:var(--ldtp-soft)!important;
  color:var(--ldtp-deep)!important;
}

.badge-success{
  background:var(--ldtp-soft)!important;
  color:var(--ldtp-deep)!important;
}

.badge-warning{
  background:var(--ldtp-warning-soft)!important;
  color:var(--ldtp-warning)!important;
}

.badge-muted{
  background:#F3F0F7!important;
  color:#5F526C!important;
}

input,
select,
textarea,
.form-control,
.form-select{
  border:1px solid var(--ldtp-line-strong)!important;
  border-radius:8px!important;
  color:var(--ldtp-ink)!important;
  font-size:.92rem!important;
  min-height:42px;
}

textarea{
  min-height:auto;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus{
  border-color:var(--ldtp-primary)!important;
  box-shadow:var(--ldtp-focus)!important;
}

label,
.form-label{
  color:#3B3049;
  font-size:.82rem;
  font-weight:820;
  margin-bottom:6px;
}

.form-text,
.form-hint{
  color:var(--ldtp-muted);
  font-size:.78rem;
}

.form-group{
  margin-bottom:16px;
}

.form-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:18px;
}

.toolbar-form{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.toolbar-form .form-control,
.toolbar-form .form-select{
  width:auto;
  min-width:180px;
}

.payment-toolbar,
.attendance-toolbar,
.resource-controls{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-bottom:20px;
}

.workspace-actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.table-wrap{
  width:100%;
  overflow-x:auto;
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  background:#fff;
}

table,
.attendance-table,
.payment-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:760px;
}

th{
  position:sticky;
  top:0;
  z-index:1;
  background:var(--ldtp-soft-2)!important;
  border-bottom:1px solid var(--ldtp-line)!important;
  color:#51455F!important;
  font-size:.74rem!important;
  font-weight:880!important;
  padding:12px 14px!important;
  text-transform:uppercase;
}

td{
  border-bottom:1px solid var(--ldtp-line)!important;
  color:#332A40;
  font-size:.86rem;
  padding:13px 14px!important;
  vertical-align:middle;
}

tbody tr:hover td{
  background:var(--ldtp-soft-2);
}

.empty-state{
  border:1px dashed var(--ldtp-line-strong);
  border-radius:8px;
  background:linear-gradient(180deg,#fff,var(--ldtp-soft-2));
  color:var(--ldtp-muted);
  padding:38px 24px;
}

.empty-state-icon{
  width:58px;
  height:58px;
  margin:0 auto 14px;
  display:grid;
  place-items:center;
  background:var(--ldtp-soft);
  border:1px solid var(--ldtp-line-strong);
  border-radius:8px;
  color:var(--ldtp-primary);
  font-size:.82rem!important;
  font-weight:900;
}

.empty-state h3{
  color:var(--ldtp-ink);
  font-size:1.05rem;
  font-weight:850;
}

.empty-state p{
  color:var(--ldtp-muted);
  font-size:.9rem;
}

.auth-page{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:30px;
}

.auth-shell{
  width:min(1120px,100%);
  min-height:680px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);
  overflow:hidden;
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  background:#fff;
  box-shadow:0 28px 80px rgba(41,24,59,.16);
}

.auth-brand-panel{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:42px;
  color:#fff;
  background:
    radial-gradient(circle at 78% 18%,rgba(255,255,255,.16),transparent 34%),
    linear-gradient(145deg,var(--ldtp-primary),var(--ldtp-deep));
}

.auth-brand-mark{
  display:flex;
  align-items:center;
  gap:12px;
}

.auth-brand-mark span{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.28);
  border-radius:8px;
}

.auth-brand-mark strong{
  display:block;
  color:#fff;
  font-size:1.05rem;
  font-weight:900;
}

.auth-brand-mark small{
  display:block;
  color:rgba(255,255,255,.78);
  font-size:.78rem;
  margin-top:2px;
}

.auth-welcome{
  max-width:560px;
}

.auth-eyebrow{
  color:rgba(255,255,255,.78);
  font-size:.75rem;
  font-weight:850;
  text-transform:uppercase;
}

.auth-welcome h1{
  color:#fff;
  font-size:clamp(2rem,4.2vw,3.75rem);
  font-weight:950;
  line-height:1.02;
  margin:12px 0 18px;
}

.auth-welcome p{
  color:rgba(255,255,255,.84);
  font-size:1rem;
  line-height:1.7;
  max-width:500px;
}

.auth-highlights{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.auth-highlights span{
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  color:#fff;
  font-size:.78rem;
  font-weight:760;
  padding:8px 11px;
}

.auth-panel{
  display:grid;
  place-items:center;
  padding:42px;
  background:#fff;
}

.auth-card{
  width:100%;
  max-width:420px;
  background:#fff;
  border:0;
  box-shadow:none;
}

.auth-card-header{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:22px;
}

.auth-card-header h2{
  color:var(--ldtp-ink);
  font-size:1.6rem;
  font-weight:900;
  margin:0;
}

.auth-card-header p{
  color:var(--ldtp-muted);
  margin:2px 0 0;
}

.input-icon-wrap{
  position:relative;
}

.toggle-pw{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--ldtp-primary);
}

.auth-links{
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-top:16px;
  color:var(--ldtp-muted);
  font-size:.86rem;
}

.resource-controls{
  align-items:center;
}

.resource-search{
  flex:1 1 320px;
}

.resource-search label{
  display:block;
}

.resource-filter-tabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.resource-filter-btn{
  min-height:38px;
  padding:8px 13px;
  border:1px solid var(--ldtp-line-strong);
  border-radius:8px;
  color:var(--ldtp-deep);
  background:#fff;
  font-weight:800;
}

.resource-filter-btn.is-active,
.resource-filter-btn:hover{
  background:var(--ldtp-primary);
  border-color:var(--ldtp-primary);
  color:#fff;
}

.resource-layout{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  align-items:start;
}

.resource-list{
  display:grid;
  gap:10px;
}

.resource-item{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  gap:12px;
  align-items:start;
  padding:14px;
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  background:#fff;
}

.resource-item:hover{
  border-color:var(--ldtp-line-strong);
  box-shadow:var(--ldtp-shadow-sm);
}

.resource-icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:var(--ldtp-soft);
  color:var(--ldtp-deep);
  font-weight:900;
}

.resource-title{
  color:var(--ldtp-ink);
  font-size:.95rem;
  font-weight:850;
}

.resource-desc{
  color:var(--ldtp-muted);
  font-size:.84rem;
  line-height:1.55;
  margin-top:3px;
}

.resource-meta{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}

.resource-meta span,
.resource-meta{
  color:#746584;
  font-size:.74rem;
  font-weight:720;
}

.resource-meta span{
  background:var(--ldtp-soft-2);
  border:1px solid var(--ldtp-line);
  border-radius:999px;
  padding:4px 8px;
}

.profile-layout{
  display:grid;
  grid-template-columns:minmax(240px,320px) minmax(0,1fr);
  gap:20px;
  align-items:start;
}

.profile-summary-card{
  text-align:center;
  position:sticky;
  top:112px;
}

.profile-avatar-wrap{
  display:flex;
  justify-content:center;
  margin-bottom:14px;
}

.profile-avatar{
  width:128px;
  height:128px;
  object-fit:cover;
  border:4px solid #fff;
  border-radius:50%;
  box-shadow:0 0 0 1px var(--ldtp-line-strong),0 16px 36px rgba(41,24,59,.16);
}

.profile-avatar-fallback{
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,var(--ldtp-primary),var(--ldtp-deep));
  color:#fff;
  font-size:2rem;
  font-weight:900;
}

.profile-summary-card h2{
  color:var(--ldtp-ink);
  font-size:1.18rem;
  font-weight:900;
  margin:8px 0 4px;
}

.profile-summary-card p{
  color:var(--ldtp-muted);
  margin:0 0 18px;
}

.profile-photo-form{
  display:grid;
  gap:9px;
  padding:16px;
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  background:var(--ldtp-soft-2);
  text-align:left;
}

.profile-meta-list{
  display:grid;
  gap:8px;
  margin:16px 0 0;
  text-align:left;
}

.profile-meta-list div{
  padding:10px 0;
  border-bottom:1px solid var(--ldtp-line);
}

.profile-meta-list dt{
  color:var(--ldtp-muted);
  font-size:.74rem;
  font-weight:780;
}

.profile-meta-list dd{
  color:var(--ldtp-ink);
  font-size:.88rem;
  font-weight:760;
  margin:2px 0 0;
  overflow-wrap:anywhere;
}

.profile-form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.certificate-preview{
  margin-top:10px;
  padding:14px;
  border:1px solid var(--ldtp-line);
  border-left:4px solid var(--ldtp-primary);
  border-radius:8px;
  background:var(--ldtp-soft-2);
}

.certificate-preview span,
.certificate-preview small{
  display:block;
  color:var(--ldtp-muted);
  font-size:.75rem;
}

.certificate-preview strong{
  display:block;
  color:var(--ldtp-deep);
  font-size:1rem;
  margin:4px 0;
}

.staff-diary-layout{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(320px,.98fr);
  gap:20px;
  align-items:start;
}

.staff-diary-compose textarea{
  resize:vertical;
}

.diary-list-header{
  margin:0 0 12px;
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  background:#fff;
}

.staff-diary-entry{
  margin-bottom:12px;
}

.submission-box{
  border:1px solid var(--ldtp-line);
  border-radius:8px;
  background:var(--ldtp-soft-2);
  color:#3B3049;
  line-height:1.55;
  padding:12px;
}

.attendance-toolbar,
.payment-toolbar{
  align-items:center;
}

.attendance-summary-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-bottom:18px;
}

.status-present{
  border-top-color:var(--ldtp-primary)!important;
}

.status-absent{
  border-top-color:var(--ldtp-danger)!important;
}

.status-absent .stat-value{
  color:var(--ldtp-danger)!important;
}

.attendance-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:12px;
}

.attendance-choice{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  margin:0;
}

.attendance-choice input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.att-dot{
  width:28px;
  height:28px;
  display:inline-block;
  border:2px solid var(--ldtp-line-strong);
  border-radius:50%;
  transition:transform .15s,box-shadow .15s,background .15s,border-color .15s;
}

.attendance-choice input:focus-visible + .att-dot{
  box-shadow:var(--ldtp-focus);
}

.attendance-choice:hover .att-dot{
  transform:scale(1.05);
}

.payment-table-card .card-header{
  align-items:center;
}

.payment-table td:last-child{
  white-space:nowrap;
}

.admin-dashboard-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}

.simple-list{
  display:grid;
  gap:0;
  list-style:none;
  margin:0;
  padding:0;
}

.simple-list li{
  border-bottom:1px solid var(--ldtp-line);
  color:var(--ldtp-text);
  font-size:.86rem;
  padding:11px 0;
}

.simple-list li:last-child{
  border-bottom:0;
}

.modal-backdrop{
  background:rgba(33,21,47,.52);
  backdrop-filter:blur(3px);
  z-index:1200;
}

.modal{
  max-width:620px;
  padding:0!important;
  overflow:hidden;
}

.modal-header{
  background:linear-gradient(180deg,#fff,var(--ldtp-soft-2));
  border-bottom:1px solid var(--ldtp-line);
  padding:18px 20px;
}

.modal-title{
  color:var(--ldtp-ink);
  font-weight:880;
}

.modal form{
  padding:20px;
}

.pagination,
.pagination-links{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

.page-btn,
.pagination-current{
  min-width:36px;
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--ldtp-line-strong);
  border-radius:8px;
  color:var(--ldtp-deep);
  background:#fff;
  font-size:.84rem;
  font-weight:800;
  text-decoration:none;
}

.page-btn.active{
  background:var(--ldtp-primary);
  color:#fff;
  border-color:var(--ldtp-primary);
}

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.ldtp-tour-overlay{
  position:fixed;
  inset:0;
  z-index:2147482000;
  background:rgba(33,21,47,.50);
  backdrop-filter:blur(2px);
}

.ldtp-tour-popover{
  position:fixed;
  width:min(360px,calc(100vw - 32px));
  border:1px solid var(--ldtp-line)!important;
  border-top:4px solid var(--ldtp-primary)!important;
  border-radius:8px!important;
  background:#fff!important;
  box-shadow:0 30px 90px rgba(33,21,47,.28)!important;
}

.ldtp-tour-highlight{
  outline:3px solid rgba(74,20,140,.84)!important;
  outline-offset:5px!important;
  box-shadow:0 0 0 7px rgba(74,20,140,.14)!important;
  pointer-events:none;
}

@media(max-width:1100px){
  .resource-layout,
  .staff-diary-layout,
  .admin-dashboard-grid{
    grid-template-columns:1fr;
  }
  .profile-summary-card{
    position:static;
  }
}

@media(max-width:960px){
  .sidebar{
    transform:translateX(-100%);
  }
  .sidebar.open{
    transform:translateX(0);
  }
  .sidebar-close{
    display:block;
  }
  .sidebar-overlay.open{
    display:block;
  }
  .main-content{
    margin-left:0;
    max-width:100vw;
    overflow-x:hidden;
  }
  .hamburger{
    display:block;
  }
  .page-body{
    padding:22px 18px 44px;
  }
  .announcement-dock{
    grid-template-columns:1fr;
    padding:0 18px;
  }
  .workspace-hero,
  .payment-toolbar,
  .attendance-toolbar,
  .resource-controls{
    align-items:stretch;
    flex-direction:column;
  }
  .workspace-hero-metrics{
    width:100%;
  }
  .workspace-hero-metrics div{
    flex:1 1 150px;
  }
  .toolbar-form,
  .toolbar-form .form-control,
  .toolbar-form .form-select,
  .workspace-actions{
    width:100%;
  }
}

@media(max-width:760px){
  .auth-page{
    padding:18px;
  }
  .auth-shell{
    grid-template-columns:1fr;
    min-height:0;
  }
  .auth-brand-panel{
    padding:28px;
    min-height:340px;
  }
  .auth-panel{
    padding:28px;
  }
  .profile-layout,
  .profile-form-grid{
    grid-template-columns:1fr;
  }
  .attendance-summary-grid{
    grid-template-columns:1fr;
  }
  .resource-item{
    grid-template-columns:42px minmax(0,1fr);
  }
  .resource-item .btn{
    grid-column:1 / -1;
    width:100%;
  }
  .topbar{
    min-height:84px;
    padding:14px 16px;
  }
}

@media(max-width:420px){
  .page-body{
    padding:18px 12px 38px;
  }
  .announcement-dock{
    padding:0 12px;
  }
  .card{
    padding:16px;
  }
  .card-header{
    margin:-16px -16px 16px;
    padding:14px 16px;
  }
  .auth-brand-panel,
  .auth-panel{
    padding:22px;
  }
  .auth-welcome h1{
    font-size:2rem;
  }
  .stat-card{
    min-height:116px;
  }
  .btn{
    width:auto;
  }
  .workspace-actions .btn,
  .toolbar-form .btn{
    flex:1 1 auto;
  }
}

/* Privacy policy and data map */
.app-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  padding:16px 26px 22px;
  border-top:1px solid var(--ldtp-line,var(--border));
  color:var(--ldtp-muted,var(--muted));
  background:rgba(255,255,255,.78);
  font-size:.82rem;
}

.app-footer a{
  color:var(--ldtp-primary,var(--blue-dark));
  font-weight:800;
}

.privacy-public-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 0 0, rgba(74,20,140,.10), transparent 36vw),
    linear-gradient(180deg,#fff 0,#fbf7ff 360px,#f6f3fa 100%);
  color:var(--ldtp-text,var(--text));
}

.privacy-shell{
  width:min(1180px,calc(100% - 32px));
  margin:0 auto;
  padding:34px 0 42px;
}

.privacy-hero{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(74,20,140,.14);
  border-radius:18px;
  background:
    linear-gradient(135deg,rgba(74,20,140,.96),rgba(75,0,130,.92)),
    #4A148C;
  color:#fff;
  padding:34px;
  box-shadow:0 26px 70px rgba(45,18,74,.22);
}

.privacy-back-link{
  position:absolute;
  top:22px;
  right:24px;
  color:#fff;
  border:1px solid rgba(255,255,255,.32);
  border-radius:999px;
  padding:7px 13px;
  font-size:.82rem;
  font-weight:800;
}

.privacy-back-link:hover{
  color:#fff;
  background:rgba(255,255,255,.12);
  text-decoration:none;
}

.privacy-brand{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:46px;
}

.privacy-brand-mark{
  width:46px;
  height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:#fff;
  color:#4A148C;
  font-weight:950;
  letter-spacing:0;
}

.privacy-brand strong{
  display:block;
  font-size:1.08rem;
  font-weight:900;
}

.privacy-brand span:last-child{
  display:block;
  color:rgba(255,255,255,.78);
  font-size:.82rem;
}

.privacy-hero-copy{
  max-width:820px;
}

.privacy-kicker{
  color:rgba(255,255,255,.78);
  font-weight:900;
  font-size:.78rem;
  letter-spacing:.09em;
  text-transform:uppercase;
  margin-bottom:10px;
}

.privacy-hero h1{
  color:#fff;
  font-size:clamp(2.2rem,6vw,4.7rem);
  line-height:.98;
  letter-spacing:0;
  margin:0 0 18px;
}

.privacy-hero p{
  color:rgba(255,255,255,.86);
  max-width:760px;
  font-size:1rem;
}

.privacy-reviewed{
  margin-top:18px;
  font-weight:800;
}

.privacy-section{
  margin-top:18px;
  border:1px solid rgba(74,20,140,.11);
  border-radius:14px;
  background:#fff;
  padding:24px;
  box-shadow:0 14px 40px rgba(45,18,74,.08);
}

.privacy-section h2{
  color:var(--ldtp-ink,var(--text));
  font-size:1.15rem;
  font-weight:900;
  margin:0 0 10px;
}

.privacy-section p{
  color:var(--ldtp-text,var(--text));
  margin-bottom:10px;
}

.privacy-section p:last-child{
  margin-bottom:0;
}

.privacy-table-wrap{
  overflow:auto;
  border:1px solid rgba(74,20,140,.12);
  border-radius:12px;
}

.privacy-data-table{
  min-width:1120px;
  border-collapse:separate;
  border-spacing:0;
  font-size:.84rem;
}

.privacy-data-table th{
  position:sticky;
  top:0;
  background:#f3eafe;
  color:#2b1744;
  font-weight:900;
  text-align:left;
  padding:13px 14px;
  border-bottom:1px solid rgba(74,20,140,.15);
  vertical-align:top;
}

.privacy-data-table td{
  padding:14px;
  border-bottom:1px solid #eee8f6;
  color:#261d30;
  vertical-align:top;
}

.privacy-data-table tbody tr:nth-child(even) td{
  background:#fcfaff;
}

.privacy-data-table tbody tr:last-child td{
  border-bottom:0;
}

.privacy-data-table td:first-child{
  color:#4A148C;
  font-weight:900;
}

.privacy-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.privacy-grid article{
  min-width:0;
}

.privacy-grid ul{
  list-style:disc;
  padding-left:20px;
  color:#261d30;
}

.privacy-grid li{
  margin:8px 0;
}

.privacy-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
  margin-top:18px;
  color:#4b4158;
  font-size:.9rem;
}

.privacy-footer div{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.privacy-footer a{
  color:#4A148C;
  font-weight:850;
}

@media(max-width:900px){
  .app-footer{
    padding:14px 18px 20px;
  }
  .privacy-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:640px){
  .privacy-shell{
    width:min(100% - 20px,1180px);
    padding:12px 0 28px;
  }
  .privacy-hero{
    border-radius:14px;
    padding:24px;
  }
  .privacy-back-link{
    position:static;
    display:inline-flex;
    margin-bottom:26px;
  }
  .privacy-brand{
    margin-bottom:30px;
  }
  .privacy-section{
    padding:18px;
  }
  .privacy-footer{
    align-items:flex-start;
    flex-direction:column;
  }
}

/* Stable guided tour overlay. The spotlight is separate from the target element so
   sidebars, scroll containers, and transformed parents cannot misalign the frame. */
.ldtp-tour-overlay{
  position:fixed!important;
  inset:0!important;
  z-index:2147482000!important;
  background:transparent!important;
  backdrop-filter:none!important;
  pointer-events:auto!important;
}
.ldtp-tour-spotlight{
  position:fixed;
  z-index:2147482500;
  pointer-events:none;
  border:2px solid var(--ldtp-primary,#4A148C);
  background:rgba(255,255,255,.08);
  box-shadow:0 0 0 9999px rgba(22,15,31,.52),0 18px 55px rgba(74,20,140,.22);
  transition:left .16s ease,top .16s ease,width .16s ease,height .16s ease;
}
.ldtp-tour-highlight{
  outline:0!important;
  box-shadow:none!important;
  pointer-events:auto!important;
}
.ldtp-tour-popover{
  z-index:2147483000!important;
  max-height:calc(100vh - 36px);
  overflow:auto;
  border:1px solid var(--ldtp-line,#e7dff0)!important;
  border-top:4px solid var(--ldtp-primary,#4A148C)!important;
  border-radius:8px!important;
  background:#fff!important;
  color:var(--ldtp-ink,#1f1728)!important;
  box-shadow:0 30px 90px rgba(33,21,47,.28)!important;
}
.ldtp-tour-kicker{
  color:var(--ldtp-primary,#4A148C)!important;
}
.ldtp-tour-popover h3{
  color:var(--ldtp-ink,#1f1728)!important;
}
.ldtp-tour-popover p,
.ldtp-tour-count{
  color:var(--ldtp-muted,#62566f)!important;
}
@media(max-width:520px){
  .ldtp-tour-popover{
    width:calc(100vw - 28px)!important;
  }
}

.brand-wordmark,
.auth-wordmark,
.ldtp-mark-text{
  font-family:var(--font, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
  font-weight:900;
  letter-spacing:0;
  line-height:1;
}

.brand-icon.brand-wordmark,
.auth-logo-icon.auth-wordmark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
}

.ldtp-mark-text{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:48px;
  height:48px;
  border-radius:14px;
  background:rgba(255,255,255,.14);
  color:#fff;
  font-size:.78rem;
}
/* Resource manager production polish */
.resource-list {
  width: 100%;
  min-width: 0;
}

.resource-item {
  min-width: 0;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-4, 16px);
  align-items: start;
}

.resource-title,
.resource-desc,
.resource-meta {
  min-width: 0;
  overflow-wrap: anywhere;
}

.resource-item .btn,
.resource-item form {
  flex-shrink: 0;
}

@media (max-width: 760px) {
  .resource-item {
    grid-template-columns: 1fr;
  }

  .resource-item > div:last-child {
    justify-content: flex-start !important;
  }
}

/* Calm official system feedback */
.alert{
  display:block;
  position:relative;
  padding:14px 16px 14px 18px!important;
  border-radius:8px!important;
  border:1px solid var(--ldtp-line,#e7dff0)!important;
  border-left:4px solid var(--ldtp-primary,#4A148C)!important;
  background:#fff!important;
  color:var(--ldtp-ink,#1f1728)!important;
  box-shadow:0 8px 24px rgba(31,23,40,.06)!important;
  font-size:.94rem!important;
  line-height:1.55!important;
}
.alert-success{
  border-left-color:var(--ldtp-primary,#4A148C)!important;
  background:linear-gradient(90deg,rgba(250,246,255,.96),#fff 42%)!important;
}
.alert-info{
  border-left-color:var(--ldtp-deep,#4B0082)!important;
  background:linear-gradient(90deg,rgba(250,246,255,.92),#fff 42%)!important;
}
.alert-warning{
  border-left-color:#8a5b00!important;
  background:linear-gradient(90deg,rgba(255,250,235,.9),#fff 46%)!important;
}
.alert-danger{
  border-left-color:#b42318!important;
  background:linear-gradient(90deg,rgba(255,245,245,.92),#fff 46%)!important;
}

/* Email queue admin */
.email-queue-layout{
  display:grid;
  grid-template-columns:minmax(280px,360px) minmax(0,1fr);
  gap:20px;
  align-items:start;
}
.email-queue-control .card-header{
  align-items:flex-start;
}
.queue-mode-pill{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border:1px solid var(--ldtp-line,#e7dff0);
  border-radius:8px;
  background:linear-gradient(90deg,rgba(250,246,255,.96),#fff);
  color:var(--ldtp-ink,#1f1728);
  font-weight:800;
  margin:12px 0;
}
.technical-details{
  margin-top:16px;
  border-top:1px solid var(--ldtp-line,#e7dff0);
  padding-top:12px;
}
.technical-details summary{
  cursor:pointer;
  color:var(--ldtp-primary,#4A148C);
  font-weight:800;
}
.technical-details-body{
  margin-top:12px;
  display:grid;
  gap:12px;
}
.technical-details code{
  white-space:normal;
  overflow-wrap:anywhere;
}
@media(max-width:920px){
  .email-queue-layout{
    grid-template-columns:1fr;
  }
}