:root {
  --primary: #0e6cf1;
  --primary-dark: #0757c7;
  --primary-soft: #eaf3ff;
  --green-950: #063c31;
  --green-900: #074e3e;
  --green-800: #0b6252;
  --green-700: #167364;
  --green-100: #dff3ed;
  --gold: #ddb326;
  --gold-soft: #fff7d8;
  --ink: #162033;
  --muted: #5f6d82;
  --line: #dce5f0;
  --surface: #ffffff;
  --canvas: #f3f6fb;
  --danger: #b4233f;
  --danger-soft: #fff0f3;
  --warning: #986a00;
  --warning-soft: #fff8df;
  --blue: #0e6cf1;
  --blue-soft: #eaf3ff;
  --shadow: 0 16px 42px rgba(27, 73, 134, .11);
}

* { box-sizing: border-box; }
html { min-height: 100%; font-size: 16px; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  background: var(--canvas);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
.eyebrow {
  margin: 0 0 .35rem;
  color: var(--primary);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.login-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(320px, 1.1fr) minmax(340px, .9fr);
  background:
    radial-gradient(circle at 18% 20%, rgba(255, 255, 255, .18), transparent 28%),
    linear-gradient(135deg, #0a5ddd 0 51%, #f5f8fc 51% 100%);
}
.login-brand {
  align-self: center;
  max-width: 720px;
  padding: 8vw;
  color: white;
}
.login-brand .eyebrow { color: #dfeaff; }
.login-brand h1 { margin: 0; font-size: clamp(3rem, 7vw, 5.6rem); font-weight: 850; line-height: .95; letter-spacing: -.045em; }
.login-brand > p:not(.eyebrow) { max-width: 560px; margin: 1.5rem 0; color: #e9f1ff; font-size: 1.08rem; line-height: 1.7; }
.brand-mark {
  width: 76px; height: 76px; margin-bottom: 2rem;
  display: grid; place-items: center;
  border: 2px solid rgba(255,255,255,.5); border-radius: 22px;
  color: white; font-size: 1.4rem; font-weight: 900;
  box-shadow: inset 0 0 0 5px rgba(255,255,255,.08);
}
.brand-mark.small { width: 42px; height: 42px; margin: 0; border-radius: 12px; font-size: .86rem; }
.login-points { display: flex; flex-wrap: wrap; gap: .65rem; }
.login-points span { padding: .7rem .95rem; border: 1px solid rgba(255,255,255,.18); border-radius: 99px; background: rgba(255,255,255,.08); font-size: .86rem; }
.login-card {
  width: min(440px, calc(100% - 3rem));
  align-self: center; justify-self: center;
  padding: 2.2rem;
  background: white; border: 1px solid var(--line); border-radius: 24px;
  box-shadow: var(--shadow);
}
.login-card h2 { margin: 0; font-size: 2rem; }
.login-card label, .form-grid label { display: grid; gap: .45rem; color: #34425a; font-size: .88rem; font-weight: 750; }
.login-card label { margin-top: 1.15rem; }
.login-help { margin: 1rem 0 0; color: var(--muted); font-size: .78rem; line-height: 1.55; }
.form-error { min-height: 1.2rem; margin: .75rem 0 0; color: var(--danger); font-size: .86rem; }

input, select, textarea {
  width: 100%;
  min-height: 44px;
  padding: .7rem .82rem;
  border: 1px solid #cad8d3;
  border-radius: 10px;
  color: var(--ink);
  background: white;
  outline: none;
  transition: border-color .15s, box-shadow .15s;
}
textarea { min-height: 100px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(14,108,241,.13); }

.btn {
  min-height: 42px;
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  padding: .65rem 1rem;
  border: 1px solid transparent; border-radius: 10px;
  font-weight: 750; font-size: .88rem;
  transition: transform .15s, background .15s, border-color .15s;
}
.btn:hover { transform: translateY(-1px); }
.btn.primary { background: var(--primary); color: white; box-shadow: 0 7px 16px rgba(14,108,241,.18); }
.btn.primary:hover { background: var(--primary-dark); }
.btn.gold { background: var(--gold); color: #15352d; }
.btn.ghost { border-color: var(--line); background: white; color: var(--ink); }
.btn.danger { background: var(--danger-soft); color: var(--danger); border-color: #f3cbd4; }
.btn.small { min-height: 34px; padding: .45rem .7rem; font-size: .78rem; }
.btn.wide { width: 100%; margin-top: 1.25rem; }
.icon-btn, .menu-btn {
  width: 38px; height: 38px; display: grid; place-items: center;
  border: 1px solid var(--line); border-radius: 10px; background: white; color: var(--ink); font-size: 1.25rem;
}

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 278px minmax(0,1fr); }
.sidebar {
  position: sticky; top: 0; height: 100vh;
  display: flex; flex-direction: column;
  padding: 1.05rem;
  border-right: 1px solid var(--line);
  background: #ffffff;
  color: var(--ink);
  z-index: 20;
  box-shadow: 8px 0 28px rgba(30,68,120,.055);
}
.side-brand { display: flex; align-items: center; gap: .8rem; padding: .5rem .45rem 1.2rem; border-bottom: 1px solid var(--line); }
.side-brand .brand-mark { border-color: transparent; background: var(--primary); color: white; box-shadow: none; }
.side-brand strong { display: block; font-size: 1.12rem; font-weight: 850; }
.side-brand span { display: block; margin-top: .16rem; color: var(--muted); font-size: .73rem; }
#main-nav { flex: 1; overflow-y: auto; padding: 1rem 0; }
.nav-section-label { margin: 1rem .7rem .5rem; color: #8a97aa; font-size: .67rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.nav-btn {
  width: 100%; min-height: 43px; margin: .13rem 0; padding: .65rem .75rem;
  display: flex; align-items: center; gap: .75rem;
  border: 0; border-radius: 10px; background: transparent; color: #42506a;
  text-align: left; font-size: .9rem; font-weight: 720;
}
.nav-btn:hover { background: var(--primary-soft); color: var(--primary-dark); }
.nav-btn.active { background: var(--primary); color: white; box-shadow: 0 8px 20px rgba(14,108,241,.22); }
.nav-icon { width: 24px; text-align: center; font-size: 1rem; }
.nav-badge { margin-left: auto; min-width: 24px; padding: .15rem .4rem; border-radius: 99px; background: #ffbc1f; color: #263044; text-align: center; font-size: .7rem; }
.nav-btn.active .nav-badge { background: white; color: var(--primary-dark); }
.side-user { display: flex; align-items: center; gap: .7rem; padding: .85rem .45rem .15rem; border-top: 1px solid var(--line); }
.avatar { width: 38px; height: 38px; display: grid; place-items: center; flex: none; border-radius: 50%; background: var(--primary-soft); color: var(--primary); font-weight: 900; }
.side-user-text { min-width: 0; flex: 1; }
.side-user-text strong, .side-user-text span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.side-user-text strong { font-size: .82rem; }
.side-user-text span { margin-top: .1rem; color: var(--muted); font-size: .7rem; }
.side-user .icon-btn { border-color: var(--line); background: #f8faff; color: var(--primary); }

.main-area { min-width: 0; }
.topbar {
  min-height: 90px;
  display: flex; align-items: center; gap: 1rem;
  padding: 1rem 2rem;
  border-bottom: 0; background: linear-gradient(100deg, #0c62df, #1378f5);
  color: white;
  position: sticky; top: 0; z-index: 10; backdrop-filter: blur(12px);
  box-shadow: 0 8px 24px rgba(14,83,179,.18);
}
.topbar h1 { margin: 0; font-size: 1.55rem; font-weight: 850; letter-spacing: -.025em; }
.topbar .eyebrow { color: #dce9ff; font-size: .67rem; }
.menu-btn { display: none; }
.top-actions { margin-left: auto; display: flex; align-items: center; gap: .65rem; }
.topbar .btn.ghost { border-color: rgba(255,255,255,.48); background: rgba(255,255,255,.10); color: white; }
.topbar .btn.ghost:hover { background: rgba(255,255,255,.19); }
.topbar .menu-btn { border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.12); color: white; }
.date-chip { padding: .6rem .82rem; border-radius: 9px; background: white; color: var(--primary-dark); font-size: .8rem; font-weight: 800; }
.page-content { max-width: 1620px; margin: 0 auto; padding: 2rem 2rem 3rem; }
.dashboard-loading { min-height: 55vh; display: flex; align-items: center; justify-content: center; gap: 14px; color: var(--muted); font-size: 1.08rem; }
.loading-spinner { width: 30px; height: 30px; border: 4px solid #dbeafe; border-top-color: var(--primary); border-radius: 50%; animation: dashboard-spin .8s linear infinite; }
@keyframes dashboard-spin { to { transform: rotate(360deg); } }

.scope-bar {
  display: grid;
  grid-template-columns: minmax(150px, .8fr) repeat(4, minmax(135px, 1fr)) auto;
  gap: .65rem;
  align-items: end;
  margin-bottom: 1.25rem;
  padding: .85rem;
  border: 1px solid #d7e3f2;
  border-radius: 14px;
  background: white;
  box-shadow: 0 7px 22px rgba(27,73,134,.055);
}
.scope-bar label { display: grid; gap: .3rem; color: #52617a; font-size: .7rem; font-weight: 850; }
.scope-bar input, .scope-bar select { min-height: 38px; padding: .5rem .62rem; font-size: .78rem; }
.scope-title { align-self: center; padding: 0 .35rem; }
.scope-title span, .scope-title strong { display: block; }
.scope-title span { color: var(--muted); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.scope-title strong { margin-top: .25rem; color: var(--primary-dark); font-size: .9rem; }
.scope-actions { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }

.page-head { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: 1.45rem; }
.page-head h2 { margin: 0; font-size: 2.05rem; font-weight: 850; letter-spacing: -.035em; }
.page-head p { margin: .35rem 0 0; color: var(--muted); line-height: 1.5; }
.actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(190px, 1fr)); gap: 1rem; }
.metric-card, .panel, .stake-card, .mom-card {
  border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: 0 10px 30px rgba(27,73,134,.07);
}
.metric-card { min-height: 145px; padding: 1.35rem 1.4rem; }
.metric-top { display: flex; align-items: start; justify-content: space-between; gap: .7rem; }
.metric-card .metric-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: var(--primary-soft); color: var(--primary); font-size: 1.15rem; }
.metric-card.warning .metric-icon { background: var(--warning-soft); color: var(--warning); }
.metric-card.danger .metric-icon { background: var(--danger-soft); color: var(--danger); }
.metric-card.blue .metric-icon { background: #e9f2ff; color: #0e6cf1; }
.metric-card.amber .metric-icon { background: #fff5d7; color: #d49200; }
.metric-card.cyan .metric-icon { background: #e6f9ff; color: #049ac3; }
.metric-card.green .metric-icon { background: #e7f8ee; color: #138a4b; }
.metric-card.violet .metric-icon { background: #f1ebff; color: #7448d8; }
.metric-card.blue .metric-value { color: #0e6cf1; }
.metric-card.amber .metric-value { color: #e3a000; }
.metric-card.cyan .metric-value { color: #0699bf; }
.metric-card.green .metric-value { color: #138a4b; }
.metric-card.violet .metric-value { color: #7448d8; }
.metric-card.danger .metric-value { color: var(--danger); }
.metric-label { color: #48566d; font-size: .95rem; font-weight: 750; }
.metric-value { margin: .45rem 0 .12rem; font-size: 2.75rem; font-weight: 900; letter-spacing: -.055em; line-height: 1; }
.metric-detail { color: var(--muted); font-size: .78rem; line-height: 1.45; }
.dashboard-grid { margin-top: 1.25rem; display: grid; grid-template-columns: 1.35fr .65fr; gap: 1rem; }
.dashboard-cta { min-height: 48px; padding-inline: 1.2rem; font-size: .94rem; }
.panel { min-width: 0; overflow: hidden; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.1rem; border-bottom: 1px solid var(--line); }
.panel-head h3 { margin: 0; font-size: 1.08rem; font-weight: 850; }
.panel-body { padding: 1.1rem 1.2rem; }
.decision-list { display: grid; gap: .65rem; }
.decision-row { display: grid; grid-template-columns: 7px minmax(0,1fr) auto; gap: .8rem; align-items: center; padding: .9rem; border: 1px solid var(--line); border-radius: 12px; background: #fbfcff; }
.priority-bar { align-self: stretch; border-radius: 9px; background: var(--gold); }
.priority-bar.high { background: #d23f5d; }
.decision-row strong { display: block; font-size: .9rem; }
.decision-row span { display: block; margin-top: .22rem; color: var(--muted); font-size: .74rem; }
.mini-date { color: var(--primary) !important; font-weight: 800; white-space: nowrap; }
.quick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.quick-action { min-height: 104px; padding: .95rem; display: grid; align-content: space-between; border: 1px solid #d9e5f5; border-radius: 14px; background: #f8fbff; color: var(--ink); text-align: left; transition: border-color .15s, transform .15s, box-shadow .15s; }
.quick-action:hover { transform: translateY(-2px); border-color: #9fc2f5; box-shadow: 0 9px 22px rgba(14,108,241,.09); }
.quick-action span { color: var(--primary); font-size: 1.35rem; }
.quick-action strong { font-size: .88rem; }

.toolbar { display: grid; grid-template-columns: minmax(220px, 1.5fr) repeat(4, minmax(130px, .7fr)); gap: .65rem; margin-bottom: 1rem; }
.toolbar.compact { grid-template-columns: minmax(260px, 520px); }
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 820px; }
th { padding: .78rem .85rem; background: #edf4fd; color: #4f5f78; text-align: left; font-size: .72rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
td { padding: .85rem; border-top: 1px solid var(--line); vertical-align: top; font-size: .84rem; }
tr:hover td { background: #f8fbff; }
.title-cell strong { display: block; max-width: 360px; }
.title-cell span { display: block; margin-top: .26rem; max-width: 460px; color: var(--muted); font-size: .74rem; line-height: 1.45; }
.badge { display: inline-flex; align-items: center; padding: .3rem .52rem; border-radius: 99px; background: #edf3f1; color: #50615c; font-size: .7rem; font-weight: 800; white-space: nowrap; }
.badge.high, .badge.overdue, .badge.unread { background: var(--danger-soft); color: var(--danger); }
.badge.medium, .badge.pending, .badge.waiting { background: var(--warning-soft); color: var(--warning); }
.badge.completed, .badge.read, .badge.actioned { background: var(--green-100); color: var(--green-800); }
.badge.in-progress, .badge.in-school { background: var(--blue-soft); color: var(--blue); }
.row-actions { display: flex; gap: .35rem; flex-wrap: wrap; }
.empty { padding: 2.5rem 1rem; color: var(--muted); text-align: center; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .85rem; }
.form-grid .span-2 { grid-column: 1 / -1; }
.form-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: .55rem; margin-top: .35rem; }
.check-line { display: flex !important; grid-template-columns: auto 1fr !important; align-items: center; }
.check-line input { width: 18px; min-height: 18px; }

.calendar-layout { display: grid; grid-template-columns: minmax(520px, 1fr) 360px; gap: 1rem; }
.calendar-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: .8rem; }
.calendar-top h3 { margin: 0; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.weekday { padding: .55rem; background: #edf4f1; color: var(--muted); font-size: .72rem; font-weight: 800; text-align: center; }
.calendar-day { min-height: 92px; padding: .5rem; border: 0; border-top: 1px solid var(--line); border-right: 1px solid var(--line); background: white; color: var(--ink); text-align: left; }
.calendar-day:nth-child(7n) { border-right: 0; }
.calendar-day.outside { background: #f7faf9; color: #a7b1ad; }
.calendar-day.today { box-shadow: inset 0 0 0 2px var(--gold); }
.calendar-day.selected { background: #e9f7f2; }
.day-number { font-weight: 800; }
.task-dots { display: flex; flex-wrap: wrap; gap: 3px; margin-top: .55rem; }
.task-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green-700); }
.task-dot.high { background: #d23f5d; }
.task-dot.meeting { background: #3b75b7; }
.task-dot.invite { background: #d99a12; }
.calendar-legend { display: flex; flex-wrap: wrap; gap: 1rem; margin: -.4rem 0 .9rem; color: var(--muted); font-size: .75rem; font-weight: 750; }
.calendar-legend span { display: inline-flex; align-items: center; gap: .4rem; }
.btn.google { border-color: #c8daf5; background: #f3f7ff; color: #1557a5; }
.agenda { display: grid; gap: .6rem; }
.agenda-item { padding: .75rem; border-left: 4px solid var(--green-700); border-radius: 9px; background: #f7fbfa; }
.agenda-item.high { border-color: #d23f5d; }
.agenda-item strong { display: block; font-size: .84rem; }
.agenda-item span { display: block; margin-top: .25rem; color: var(--muted); font-size: .74rem; }

.stake-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .85rem; }
.stake-card { padding: 1rem; }
.stake-top { display: flex; justify-content: space-between; gap: .8rem; }
.stake-top h3 { margin: 0; font-size: 1rem; }
.stake-owner { margin: .25rem 0 0; color: var(--muted); font-size: .78rem; }
.progress-track { height: 8px; margin: .9rem 0 .45rem; overflow: hidden; border-radius: 99px; background: #e7efec; }
.progress-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--green-700), #2fa084); }
.stake-meta { display: flex; justify-content: space-between; color: var(--muted); font-size: .73rem; }
.stake-remarks { min-height: 42px; margin: .8rem 0; color: #43534e; font-size: .78rem; line-height: 1.5; }

.mom-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .85rem; }
.mom-card { padding: 1rem; }
.mom-card h3 { margin: .5rem 0; font-size: 1rem; }
.mom-card p { color: var(--muted); font-size: .78rem; line-height: 1.55; }
.mom-numbers { display: grid; grid-template-columns: repeat(3,1fr); gap: .45rem; margin-top: .8rem; }
.mom-number { padding: .6rem .45rem; border-radius: 9px; background: #f1f6f4; text-align: center; }
.mom-number strong, .mom-number span { display: block; }
.mom-number strong { font-size: 1.05rem; }
.mom-number span { margin-top: .15rem; color: var(--muted); font-size: .65rem; }

.library-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .85rem; }
.record-card {
  min-width: 0;
  padding: 1rem;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: white;
  box-shadow: 0 8px 26px rgba(16,45,38,.045);
}
.record-top { display: flex; justify-content: space-between; gap: .8rem; }
.record-top h3 { margin: .55rem 0 .3rem; font-size: 1.02rem; line-height: 1.35; }
.record-top > span { color: var(--muted); font-size: .72rem; white-space: nowrap; }
.record-card > p { color: #43534e; font-size: .8rem; line-height: 1.55; }
.record-meta { margin: .8rem 0; padding: .65rem; border-radius: 9px; background: #f3f8f6; color: var(--muted); font-size: .72rem; line-height: 1.5; }
.record-actions { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .85rem; }
.attachment-list { display: grid; gap: .4rem; margin-top: .75rem; }
.attachment-chip { min-width: 0; padding: .52rem .6rem; border: 1px solid var(--line); border-radius: 9px; background: #fbfdfc; color: var(--muted); font-size: .68rem; overflow-wrap: anywhere; }
.attachment-chip b { color: var(--green-900); }
.attachment-chip a { margin-left: .45rem; color: var(--blue); font-weight: 800; text-decoration: none; }
.tag-line { color: var(--blue) !important; font-weight: 700; }
.attention-row td { background: #fff8e6; }

.config-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .75rem; }
.config-grid form { display: grid; align-content: start; gap: .7rem; padding: .85rem; border: 1px solid var(--line); border-radius: 12px; background: #f8fbfa; }
.config-grid h3 { margin: 0; font-size: .95rem; }
.config-grid label { display: grid; gap: .35rem; color: #43534e; font-size: .74rem; font-weight: 750; }
.config-grid .form-error { margin: 0; }
.config-note { margin-top: .9rem; padding: .7rem; border-radius: 9px; background: var(--gold-soft); color: #6f5700; font-size: .76rem; }

.analysis-bars { display: grid; gap: .65rem; margin: 1.2rem 0; padding: 1rem; border: 1px solid var(--line); border-radius: 12px; }
.analysis-bars div { display: grid; grid-template-columns: 130px minmax(80px,1fr) 55px; gap: .65rem; align-items: center; font-size: .76rem; }
.analysis-bars i { display: block; min-width: 2px; height: 11px; border-radius: 99px; background: linear-gradient(90deg,var(--green-700),#36aa8e); }
.analysis-bars b { text-align: right; }

.period-grid { display: grid; grid-template-columns: repeat(4, minmax(130px,1fr)); gap: .75rem; }
.highlight-list { margin: 0; padding-left: 1.15rem; }
.highlight-list li { margin: .6rem 0; line-height: 1.55; }
.report-sheet { padding: 1.4rem; border: 1px solid var(--line); border-radius: 15px; background: white; }
.report-sheet h2 { margin: 0; font-family: Georgia, serif; font-size: 1.75rem; }

.modal { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 1rem; background: rgba(4,28,23,.58); backdrop-filter: blur(4px); }
.modal-card { width: min(720px, 100%); max-height: 90vh; overflow-y: auto; padding: 1.2rem; border-radius: 18px; background: white; box-shadow: 0 25px 80px rgba(0,0,0,.3); }
.modal-head { display: flex; align-items: start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.modal-head h2 { margin: 0; }
.summary-box { padding: 1rem; border-radius: 12px; background: #f3f8f6; line-height: 1.65; }
.toast { position: fixed; right: 1rem; bottom: 1rem; z-index: 200; max-width: 390px; padding: .85rem 1rem; border-radius: 11px; background: var(--green-950); color: white; box-shadow: var(--shadow); transform: translateY(150%); transition: transform .2s; }
.toast.show { transform: translateY(0); }
.toast.error { background: #8e1d35; }

@media (max-width: 1180px) {
  .metric-grid { grid-template-columns: repeat(3, 1fr); }
  .stake-grid, .mom-grid, .library-grid { grid-template-columns: repeat(2, 1fr); }
  .toolbar { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .toolbar input:first-child { grid-column: 1 / -1; }
  .scope-bar { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .scope-title, .scope-actions { align-self: end; }
}
@media (max-width: 900px) {
  .login-shell { grid-template-columns: 1fr; background: linear-gradient(180deg, #0a5ddd 0 43%, #f5f8fc 43% 100%); }
  .login-brand { padding: 3rem 1.5rem 5rem; }
  .login-brand h1 { font-size: 3.2rem; }
  .login-card { margin: -3.4rem auto 3rem; }
  .app-shell { grid-template-columns: 1fr; }
  .sidebar { position: fixed; left: -295px; width: 278px; transition: left .2s; box-shadow: 12px 0 35px rgba(20,51,96,.2); }
  .sidebar.open { left: 0; }
  .menu-btn { display: grid; }
  .dashboard-grid, .calendar-layout { grid-template-columns: 1fr; }
  .calendar-layout { min-width: 0; }
  .config-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .topbar { padding: .85rem 1rem; }
  .topbar .ghost, .date-chip { display: none; }
  .page-content { padding: 1.2rem 1rem 2rem; }
  .metric-grid, .stake-grid, .mom-grid, .library-grid, .period-grid, .scope-bar { grid-template-columns: 1fr; }
  .page-head { align-items: stretch; flex-direction: column; }
  .toolbar, .form-grid { grid-template-columns: 1fr; }
  .toolbar input:first-child, .form-grid .span-2, .form-actions { grid-column: auto; }
  .calendar-layout { display: block; }
  .calendar-grid { margin-bottom: 1rem; }
  .calendar-day { min-height: 62px; }
  .quick-grid { grid-template-columns: 1fr; }
  .analysis-bars div { grid-template-columns: 95px minmax(50px,1fr) 45px; }
}

@media print {
  .sidebar, .topbar, .actions, .btn, .toolbar, .scope-bar { display: none !important; }
  .app-shell { display: block; }
  .page-content { max-width: none; padding: 0; }
  body { background: white; }
  .panel, .report-sheet, .metric-card { box-shadow: none; break-inside: avoid; }
}

/* Executive visual refresh — larger typography and dashboard graphics */
html { font-size: 17px; }
.side-brand strong { font-size: 1.26rem; }
.side-brand span { font-size: .82rem; }
.nav-btn { min-height: 49px; font-size: 1rem; }
.nav-icon { width: 28px; font-size: 1.15rem; }
.topbar { min-height: 98px; }
.topbar h1 { font-size: 1.85rem; }
.topbar .eyebrow { font-size: .76rem; }
.page-head h2 { font-size: 2.45rem; }
.page-head p { font-size: 1rem; }
.btn { min-height: 46px; padding: .72rem 1.08rem; font-size: .96rem; }
.metric-label { font-size: 1.05rem; }
.metric-value { font-size: 3.15rem; }
.metric-detail { font-size: .88rem; }
.panel-head h3 { font-size: 1.25rem; }
.decision-row strong,.quick-action strong { font-size: 1rem; }
.decision-row span,.title-cell span,.record-card>p,.stake-remarks { font-size: .86rem; }
th { font-size: .78rem; }
td { font-size: .92rem; }
.badge { font-size: .78rem; }
input,select,textarea { min-height: 48px; font-size: .95rem; }

.director-hero{position:relative;min-height:270px;margin-bottom:1.25rem;padding:2.4rem 2.6rem;display:grid;grid-template-columns:minmax(0,1fr) 390px;align-items:center;overflow:hidden;border-radius:26px;background:linear-gradient(122deg,#063c74 0%,#0e6cf1 56%,#1a83f3 100%);color:#fff;box-shadow:0 22px 52px rgba(14,82,177,.25)}.director-hero:after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.15) 1.2px,transparent 1.2px);background-size:21px 21px;mask-image:linear-gradient(90deg,transparent 28%,#000)}.director-welcome,.executive-graphic{position:relative;z-index:2}.hero-label{display:inline-flex;padding:.48rem .78rem;border:1px solid rgba(255,255,255,.28);border-radius:99px;background:rgba(255,255,255,.11);font-size:.74rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.director-welcome h2{margin:.85rem 0 .45rem;font-size:clamp(2.15rem,3.6vw,3.55rem);line-height:1.04;letter-spacing:-.045em}.director-welcome p{max-width:710px;margin:0;color:#e6f0ff;font-size:1.04rem;line-height:1.65}.hero-meta{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.25rem}.hero-meta span{padding:.48rem .72rem;border-radius:9px;background:rgba(4,37,82,.27);font-size:.78rem;font-weight:750}.hero-shape{position:absolute;border-radius:50%;opacity:.18}.hero-shape-one{width:250px;height:250px;right:240px;top:-145px;background:#65d6eb}.hero-shape-two{width:190px;height:190px;right:-45px;bottom:-95px;background:#ffd667}
.executive-graphic{height:210px}.graphic-building{position:absolute;right:35px;bottom:22px;width:260px;height:160px;padding:26px 34px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;border:2px solid rgba(255,255,255,.35);border-radius:22px 22px 10px 10px;background:linear-gradient(180deg,rgba(255,255,255,.27),rgba(255,255,255,.1));box-shadow:0 22px 40px rgba(3,34,75,.22);backdrop-filter:blur(8px)}.graphic-building:before{content:"";position:absolute;left:75px;right:75px;top:-35px;height:35px;clip-path:polygon(50% 0,100% 100%,0 100%);background:rgba(255,255,255,.88)}.graphic-building i{border-radius:6px;background:rgba(255,255,255,.82);box-shadow:inset 0 -8px 0 rgba(96,176,240,.28)}.graphic-building b{position:absolute;left:50%;top:-5px;transform:translate(-50%,-50%);color:#0a5fc8;font-size:.84rem}.graphic-line{position:absolute;right:4px;bottom:11px;width:330px;height:3px;border-radius:4px;background:rgba(255,255,255,.42)}.graphic-dot{position:absolute;width:13px;height:13px;border:3px solid #fff;border-radius:50%;background:#ffc94d;box-shadow:0 0 0 6px rgba(255,255,255,.12)}.dot-a{right:332px;bottom:6px}.dot-b{right:170px;top:4px}.dot-c{right:3px;bottom:6px}
.overview-metrics .metric-card{position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}.overview-metrics .metric-card:after{content:"";position:absolute;right:-28px;bottom:-48px;width:125px;height:125px;border-radius:50%;background:currentColor;opacity:.045}.overview-metrics .metric-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(27,73,134,.14)}
.management-pulse{margin-top:1.25rem;padding:1.4rem 1.55rem;display:grid;grid-template-columns:minmax(250px,1fr) 160px minmax(300px,1.2fr);align-items:center;gap:1.4rem;border:1px solid var(--line);border-radius:20px;background:linear-gradient(135deg,#fff,#f5f9ff);box-shadow:0 10px 30px rgba(27,73,134,.07)}.pulse-copy h3{margin:.15rem 0 .35rem;font-size:1.45rem}.pulse-copy p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.5}.pulse-ring{width:132px;height:132px;margin:auto;padding:12px;border-radius:50%;background:conic-gradient(#16a085 var(--pulse),#e1ebf4 0);box-shadow:0 12px 28px rgba(20,133,111,.15)}.pulse-ring>div{width:100%;height:100%;display:grid;place-content:center;text-align:center;border-radius:50%;background:#fff}.pulse-ring b{display:block;color:#08765f;font-size:1.65rem}.pulse-ring span{max-width:76px;color:var(--muted);font-size:.65rem;line-height:1.25}.pulse-bars{display:grid;gap:.85rem}.pulse-bars>div>span{display:flex;justify-content:space-between;align-items:center;margin-bottom:.35rem}.pulse-bars b{font-size:.82rem}.pulse-bars em{color:var(--primary);font-size:.78rem;font-style:normal;font-weight:850}.pulse-bars i{display:block;height:9px;overflow:hidden;border-radius:99px;background:#e5ecf4}.pulse-bars u{display:block;height:100%;min-width:4px;border-radius:99px;background:linear-gradient(90deg,#0e6cf1,#51a2ff);text-decoration:none;animation:director-grow .65s ease-out}.pulse-bars .amber-bar{background:linear-gradient(90deg,#e7a216,#ffcf54)}.pulse-bars .danger-bar{background:linear-gradient(90deg,#bd3150,#ed6983)}@keyframes director-grow{from{width:0}}
@media(max-width:1180px){.director-hero{grid-template-columns:1fr 300px}.management-pulse{grid-template-columns:1fr 150px}.pulse-bars{grid-column:1/-1}.executive-graphic{transform:scale(.82);transform-origin:right center}}
@media(max-width:760px){html{font-size:16px}.director-hero{grid-template-columns:1fr;min-height:auto;padding:2rem 1.5rem}.executive-graphic{display:none}.director-welcome h2{font-size:2.25rem}.management-pulse{grid-template-columns:1fr;text-align:left}.pulse-ring{margin:.5rem auto}.pulse-bars{grid-column:auto}.page-head h2{font-size:2rem}.metric-value{font-size:2.75rem}}