/* =====================================================================
   GurukripaSteno — one theme for the home site, login, admin and candidate area.
   Palette is taken 1:1 from the home page: deep purple surfaces, lime / coral / cyan accents.
   Built on Bootstrap 5.3 dark mode (html[data-bs-theme="dark"]); the few screens that are
   deliberately "paper" (exam screens, MS Word shell, reports) set data-bs-theme="light" on their wrapper.
   ===================================================================== */
/* ---- palette: dark (default) and white. Same hues, inverted surfaces. ---- */
:root,[data-bs-theme="dark"]{
  --bg:#1b1340; --bg2:#150f33; --card:#271c63; --card2:#2f2478; --line:#3b2d8a; --line2:#5b49c9; --field:#1b1340;
  --ink:#ede9fe; --mute:#b9b0ee; --dim:#a99ee6; --head:#ffffff; --ph:#7f74c9;
  --coral:#ff6b5a; --cyan:#38d9ff; --lime:#c6f432; --sun:#ffd23f; --on-accent:#1b1340;
  --link:#c6f432; --link-h:#dcff6e; --focus:#c6f432; --focus-ring:rgba(198,244,50,.2); --icon:#38d9ff;
  --hl-bg:rgba(198,244,50,.08); --hl-bg2:rgba(198,244,50,.14); --ok-bg:rgba(198,244,50,.10); --glow:rgba(198,244,50,.22);
  --t-ok:#a8ee6a; --t-bad:#ff8b7e; --t-warn:#ffd23f; --t-info:#7de6ff;
  --nav-bg:rgba(27,19,64,.88);
  --select-arrow:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23c6f432' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  --disp:Outfit,"Noto Sans Devanagari","Segoe UI",system-ui,sans-serif;
  --body:Hind,"Noto Sans Devanagari","Segoe UI",system-ui,sans-serif;
  color-scheme:dark;
}
[data-bs-theme="light"]{
  --bg:#f6f4ff; --bg2:#ece8fb; --card:#ffffff; --card2:#f1eeff; --line:#e1dcf6; --line2:#c4baee; --field:#ffffff;
  --ink:#1b1340; --mute:#5b5290; --dim:#7a72a8; --head:#1b1340; --ph:#9a92c8;
  --on-accent:#1b1340;
  --link:#5b49c9; --link-h:#3f2fa8; --focus:#6d4aff; --focus-ring:rgba(109,74,255,.22); --icon:#5b49c9;
  --hl-bg:rgba(91,73,201,.08); --hl-bg2:rgba(91,73,201,.14); --ok-bg:rgba(143,224,74,.18); --glow:rgba(198,244,50,.45);
  --t-ok:#2f7d12; --t-bad:#c4372a; --t-warn:#8a6400; --t-info:#0a7a99;
  --nav-bg:rgba(255,255,255,.9);
  --select-arrow:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%235b49c9' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  color-scheme:light;
}
/* legacy names still used by older pages */
:root{--spro-navy:var(--card);--spro-blue:var(--lime);--spro-bg:var(--bg);--spro-card:var(--card);--spro-border:var(--line);--spro-text:var(--ink);--spro-muted:var(--mute)}
/* map the palette onto Bootstrap 5.3's own variables so every stock component follows the theme */
[data-bs-theme="dark"],[data-bs-theme="light"]{
  --bs-body-bg:var(--bg); --bs-body-color:var(--ink); --bs-emphasis-color:var(--head);
  --bs-secondary-color:var(--mute); --bs-tertiary-color:var(--dim);
  --bs-secondary-bg:var(--card); --bs-tertiary-bg:var(--bg2);
  --bs-border-color:var(--line); --bs-border-color-translucent:var(--line);
  --bs-heading-color:var(--head); --bs-link-color:var(--link); --bs-link-hover-color:var(--link-h);
  --bs-code-color:var(--icon);
  --bs-primary:var(--lime); --bs-success:#8fe04a; --bs-danger:#ff6b5a; --bs-warning:#ffd23f; --bs-info:#38d9ff;
  --bs-primary-bg-subtle:var(--hl-bg); --bs-primary-border-subtle:var(--line2); --bs-primary-text-emphasis:var(--link);
  --bs-success-bg-subtle:var(--ok-bg); --bs-success-border-subtle:var(--line2); --bs-success-text-emphasis:var(--t-ok);
  --bs-danger-bg-subtle:rgba(255,107,90,.15); --bs-danger-border-subtle:rgba(255,107,90,.4); --bs-danger-text-emphasis:var(--t-bad);
  --bs-warning-bg-subtle:rgba(255,210,63,.18); --bs-warning-border-subtle:rgba(255,210,63,.45); --bs-warning-text-emphasis:var(--t-warn);
  --bs-info-bg-subtle:rgba(56,217,255,.14); --bs-info-border-subtle:rgba(56,217,255,.4); --bs-info-text-emphasis:var(--t-info);
  --bs-light-bg-subtle:var(--card2); --bs-dark-bg-subtle:var(--bg2);
}


/* ---------- base ---------- */
html{background:var(--bg);scroll-padding-top:84px}
body{background:var(--bg)!important;color:var(--ink);font-family:var(--body);line-height:1.6;min-height:100vh}
body[lang="hi"],.lang-hi{font-family:'Noto Sans Devanagari',var(--body)}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6,.display-6{font-family:var(--disp);font-weight:800;letter-spacing:-.4px;color:var(--head)}
h1,.h1{letter-spacing:-1px}
a{transition:color .2s}
:focus-visible{outline:3px solid var(--focus)!important;outline-offset:3px;border-radius:8px}
.text-muted,.text-body-secondary,.form-text{color:var(--mute)!important}
.text-dark{color:var(--ink)!important}
.bg-white,.bg-light,.bg-body,.bg-body-tertiary{background-color:var(--card)!important;color:var(--ink)}
.bg-dark{background-color:var(--bg2)!important}
.border,.border-top,.border-bottom,.border-start,.border-end{border-color:var(--line)!important}
hr{border-color:var(--line2);opacity:.5}
code{color:var(--cyan)}
::selection{background:var(--lime);color:var(--on-accent)}

/* ---------- top bar (shared by every page that uses includes/header.php) ---------- */
.navbar.spro-navbar{background:var(--nav-bg)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);position:sticky;top:0;z-index:1030;min-height:68px;padding-top:env(safe-area-inset-top,0)}
.navbar.spro-navbar .navbar-brand{font-family:var(--disp);font-weight:800;font-size:24px;letter-spacing:-.5px;color:var(--ink)}
.navbar.spro-navbar .navbar-brand b{color:var(--link);font-weight:800}
.navbar.spro-navbar .navbar-brand:hover{color:var(--head)}
.spro-role-tag{font:700 12px var(--disp);background:var(--lime);color:var(--on-accent);padding:3px 10px;border-radius:99px;margin-left:2px}
.navbar.spro-navbar .spro-toplink{color:var(--mute);font-weight:500;text-decoration:none}
.navbar.spro-navbar .spro-toplink:hover{color:var(--link)}

/* ---------- buttons ---------- */
.btn{font-family:var(--disp);font-weight:700;border-radius:99px;transition:transform .18s ease,box-shadow .18s ease,background-color .18s,border-color .18s,color .18s}
.btn:not(:disabled):hover{transform:translateY(-1px)}
.btn:not(:disabled):active{transform:scale(.97)}
.btn-lg{padding:.7rem 1.6rem}
.btn-sm{padding:.3rem .85rem;font-size:.84rem}
.btn-primary,.btn-dark,.btn-spro-primary,.btn-success{--bs-btn-color:var(--on-accent);--bs-btn-bg:var(--lime);--bs-btn-border-color:var(--lime);--bs-btn-hover-color:var(--on-accent);--bs-btn-hover-bg:#d8ff55;--bs-btn-hover-border-color:#d8ff55;--bs-btn-active-color:var(--on-accent);--bs-btn-active-bg:#b5e020;--bs-btn-active-border-color:#b5e020;--bs-btn-disabled-color:var(--on-accent);--bs-btn-disabled-bg:var(--lime);--bs-btn-disabled-border-color:var(--lime);--bs-btn-focus-shadow-rgb:198,244,50}
.btn-primary:hover,.btn-dark:hover,.btn-spro-primary:hover,.btn-success:hover{box-shadow:0 10px 24px -10px rgba(198,244,50,.6)}
.btn-danger{--bs-btn-color:#fff;--bs-btn-bg:#ff6b5a;--bs-btn-border-color:#ff6b5a;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#ff8274;--bs-btn-hover-border-color:#ff8274;--bs-btn-active-bg:#ec5645;--bs-btn-active-border-color:#ec5645;--bs-btn-disabled-bg:#ff6b5a;--bs-btn-disabled-border-color:#ff6b5a}
.btn-warning{--bs-btn-color:#3b2a00;--bs-btn-bg:#ffd23f;--bs-btn-border-color:#ffd23f;--bs-btn-hover-color:#3b2a00;--bs-btn-hover-bg:#ffdc66;--bs-btn-hover-border-color:#ffdc66;--bs-btn-active-bg:#f0c020;--bs-btn-active-border-color:#f0c020}
.btn-info{--bs-btn-color:#04323d;--bs-btn-bg:#38d9ff;--bs-btn-border-color:#38d9ff;--bs-btn-hover-color:#04323d;--bs-btn-hover-bg:#68e4ff;--bs-btn-hover-border-color:#68e4ff;--bs-btn-active-bg:#25c4eb;--bs-btn-active-border-color:#25c4eb}
.btn-secondary,.btn-light{--bs-btn-color:var(--ink);--bs-btn-bg:var(--card2);--bs-btn-border-color:var(--line2);--bs-btn-hover-color:var(--head);--bs-btn-hover-bg:var(--line);--bs-btn-hover-border-color:#7a69e0;--bs-btn-active-bg:var(--line);--bs-btn-active-border-color:#7a69e0;--bs-btn-disabled-color:var(--dim);--bs-btn-disabled-bg:var(--card);--bs-btn-disabled-border-color:var(--line)}
.btn-outline-dark,.btn-outline-secondary,.btn-spro-outline,.btn-outline-light{--bs-btn-color:var(--ink);--bs-btn-border-color:var(--line2);--bs-btn-hover-color:var(--link);--bs-btn-hover-bg:var(--hl-bg);--bs-btn-hover-border-color:var(--link);--bs-btn-active-color:var(--link);--bs-btn-active-bg:var(--hl-bg2);--bs-btn-active-border-color:var(--link);--bs-btn-disabled-color:var(--dim);--bs-btn-disabled-border-color:var(--line);border-width:2px}
.btn-outline-primary{--bs-btn-color:var(--link);--bs-btn-border-color:var(--link);--bs-btn-hover-color:var(--on-accent);--bs-btn-hover-bg:var(--lime);--bs-btn-hover-border-color:var(--lime);--bs-btn-active-color:var(--on-accent);--bs-btn-active-bg:var(--lime);border-width:2px}
.btn-outline-success{--bs-btn-color:var(--t-ok);--bs-btn-border-color:#8fe04a;--bs-btn-hover-color:var(--on-accent);--bs-btn-hover-bg:#8fe04a;--bs-btn-hover-border-color:#8fe04a;border-width:2px}
.btn-outline-danger{--bs-btn-color:var(--t-bad);--bs-btn-border-color:#ff6b5a;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#ff6b5a;--bs-btn-hover-border-color:#ff6b5a;border-width:2px}
.btn-outline-warning{--bs-btn-color:var(--t-warn);--bs-btn-border-color:#ffd23f;--bs-btn-hover-color:#3b2a00;--bs-btn-hover-bg:#ffd23f;--bs-btn-hover-border-color:#ffd23f;border-width:2px}
.btn-outline-info{--bs-btn-color:var(--t-info);--bs-btn-border-color:#38d9ff;--bs-btn-hover-color:#04323d;--bs-btn-hover-bg:#38d9ff;--bs-btn-hover-border-color:#38d9ff;border-width:2px}
.btn-link{color:var(--link)}
/* the home-page button set, usable anywhere */
.b{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:50px;padding:0 28px;border-radius:99px;font:700 16px var(--disp);border:0;cursor:pointer;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease}
.b:hover{transform:translateY(-2px)}.b:active{transform:scale(.97)}
.b-lime{background:var(--lime);color:var(--on-accent)}.b-lime:hover{color:var(--on-accent);box-shadow:0 12px 26px -10px rgba(198,244,50,.6)}
.b-coral{background:var(--coral);color:#fff}.b-coral:hover{color:#fff;box-shadow:0 12px 26px -10px rgba(255,107,90,.7)}
.b-line{border:2px solid var(--line2);background:transparent;color:var(--ink)}.b-line:hover{border-color:var(--link);color:var(--link)}

/* ---------- cards & surfaces ---------- */
.card{--bs-card-bg:var(--card);--bs-card-border-color:var(--line);--bs-card-cap-bg:var(--card2);--bs-card-border-radius:20px;--bs-card-inner-border-radius:19px;--bs-card-color:var(--ink);
  border:1px solid var(--line);box-shadow:none;background:var(--card);color:var(--ink)}
.card-header,.card-footer{background:var(--card2);border-color:var(--line);color:var(--ink)}
.card-header{font-family:var(--disp);font-weight:700}
.spro-section-card{background:var(--card);border:1px solid var(--line);border-radius:20px}
.spro-section-title{color:var(--head);font-family:var(--disp);font-weight:700}
.stat-card{min-height:120px}
.list-group{--bs-list-group-bg:var(--card);--bs-list-group-color:var(--ink);--bs-list-group-border-color:var(--line);--bs-list-group-action-hover-bg:var(--card2);--bs-list-group-action-hover-color:var(--head);--bs-list-group-active-bg:var(--lime);--bs-list-group-active-color:var(--on-accent);--bs-list-group-active-border-color:var(--lime)}
.accordion{--bs-accordion-bg:var(--card);--bs-accordion-color:var(--ink);--bs-accordion-border-color:var(--line);--bs-accordion-btn-bg:var(--card);--bs-accordion-btn-color:var(--head);--bs-accordion-active-bg:var(--card2);--bs-accordion-active-color:var(--link)}
.modal{--bs-modal-bg:var(--card);--bs-modal-color:var(--ink);--bs-modal-border-color:var(--line2);--bs-modal-header-border-color:var(--line);--bs-modal-footer-border-color:var(--line);--bs-modal-border-radius:22px}
.modal-backdrop{--bs-backdrop-bg:#0b0725;--bs-backdrop-opacity:.7}
.dropdown-menu{--bs-dropdown-bg:var(--card);--bs-dropdown-color:var(--ink);--bs-dropdown-border-color:var(--line2);--bs-dropdown-link-color:var(--ink);--bs-dropdown-link-hover-color:var(--link);--bs-dropdown-link-hover-bg:var(--hl-bg);--bs-dropdown-link-active-color:var(--on-accent);--bs-dropdown-link-active-bg:var(--lime);--bs-dropdown-divider-bg:var(--line);--bs-dropdown-header-color:var(--dim);--bs-dropdown-border-radius:16px;
  box-shadow:0 24px 50px -18px #0b0725;padding:.5rem}
.dropdown-item{border-radius:10px;font-weight:500}
.popover,.toast{--bs-popover-bg:var(--card);--bs-popover-border-color:var(--line2);--bs-toast-bg:var(--card);--bs-toast-color:var(--ink)}
.progress{--bs-progress-bg:var(--bg2);--bs-progress-bar-bg:var(--lime);--bs-progress-bar-color:var(--on-accent);border-radius:99px}
.nav-tabs{--bs-nav-tabs-border-color:var(--line);--bs-nav-tabs-link-hover-border-color:var(--line2) var(--line2) var(--line);--bs-nav-tabs-link-active-bg:var(--card);--bs-nav-tabs-link-active-color:var(--link);--bs-nav-tabs-link-active-border-color:var(--line) var(--line) var(--card);--bs-nav-link-color:var(--mute);--bs-nav-link-hover-color:var(--head)}
.nav-pills{--bs-nav-pills-link-active-bg:var(--lime);--bs-nav-pills-link-active-color:var(--on-accent);--bs-nav-link-color:var(--mute);--bs-nav-link-hover-color:var(--head)}
.nav-pills .nav-link{border-radius:99px;font-family:var(--disp);font-weight:700}
.pagination{--bs-pagination-bg:var(--card);--bs-pagination-color:var(--ink);--bs-pagination-border-color:var(--line);--bs-pagination-hover-bg:var(--card2);--bs-pagination-hover-color:var(--link);--bs-pagination-hover-border-color:var(--line2);--bs-pagination-active-bg:var(--lime);--bs-pagination-active-color:var(--on-accent);--bs-pagination-active-border-color:var(--lime);--bs-pagination-disabled-bg:var(--bg2);--bs-pagination-disabled-color:var(--dim);--bs-pagination-disabled-border-color:var(--line);--bs-pagination-focus-color:var(--link);--bs-pagination-focus-bg:var(--card2)}
.breadcrumb{--bs-breadcrumb-divider-color:var(--dim);--bs-breadcrumb-item-active-color:var(--mute)}

/* ---------- alerts & badges ---------- */
.alert{border-radius:16px;font-weight:500}
.alert-success{--bs-alert-color:var(--t-ok);--bs-alert-bg:var(--ok-bg);--bs-alert-border-color:rgba(198,244,50,.4)}
.alert-danger{--bs-alert-color:var(--t-bad);--bs-alert-bg:rgba(255,107,90,.13);--bs-alert-border-color:rgba(255,107,90,.45)}
.alert-warning{--bs-alert-color:var(--t-warn);--bs-alert-bg:rgba(255,210,63,.11);--bs-alert-border-color:rgba(255,210,63,.4)}
.alert-info{--bs-alert-color:var(--t-info);--bs-alert-bg:rgba(56,217,255,.10);--bs-alert-border-color:rgba(56,217,255,.4)}
.alert-secondary,.alert-light,.alert-primary,.alert-dark{--bs-alert-color:var(--ink);--bs-alert-bg:var(--card2);--bs-alert-border-color:var(--line2)}
.alert-link{color:inherit;text-decoration:underline}
.badge{font-family:var(--disp);font-weight:700;border-radius:99px;padding:.4em .8em}
.text-bg-success{background:var(--lime)!important;color:var(--on-accent)!important}
.text-bg-danger{background:#ff6b5a!important;color:#fff!important}
.text-bg-warning{background:#ffd23f!important;color:#3b2a00!important}
.text-bg-info{background:#38d9ff!important;color:#04323d!important}
.text-bg-primary{background:var(--lime)!important;color:var(--on-accent)!important}
.text-bg-secondary,.text-bg-light,.text-bg-dark{background:var(--line)!important;color:var(--ink)!important}
.badge.bg-success{background:var(--lime)!important;color:var(--on-accent)}.badge.bg-danger{background:#ff6b5a!important}
.badge.bg-warning{background:#ffd23f!important;color:#3b2a00!important}.badge.bg-info{background:#38d9ff!important;color:#04323d!important}
.badge.bg-secondary,.badge.bg-dark,.badge.bg-light{background:var(--line)!important;color:var(--ink)!important}
.text-success{color:var(--t-ok)!important}.text-danger{color:var(--t-bad)!important}.text-warning{color:var(--t-warn)!important}.text-info{color:var(--t-info)!important}.text-primary{color:var(--link)!important}

/* ---------- tables ---------- */
.table{--bs-table-bg:transparent;--bs-table-color:var(--ink);--bs-table-border-color:var(--line);--bs-table-striped-bg:rgba(91,73,201,.10);--bs-table-striped-color:var(--ink);--bs-table-hover-bg:var(--hl-bg);--bs-table-hover-color:var(--head);--bs-table-active-bg:var(--hl-bg2);--bs-table-active-color:var(--head);vertical-align:middle}
.table>:not(caption)>*>*{padding:.8rem}
.table thead th,.table-light,.table-light>*>*{--bs-table-bg:var(--bg2);--bs-table-color:var(--mute);background:var(--bg2);color:var(--mute);font-family:var(--disp);font-weight:700;font-size:.82rem;white-space:nowrap}
.table-responsive{border:1px solid var(--line);border-radius:18px;background:var(--card)}
.table-responsive>.table{margin-bottom:0}
.card>.table,.card .table-responsive{border:0;border-radius:0;background:transparent}
.table-success,.table-success>*>*{--bs-table-bg:var(--ok-bg);color:var(--ink)}
.table-danger,.table-danger>*>*{--bs-table-bg:rgba(255,107,90,.14);color:var(--ink)}
.table-warning,.table-warning>*>*{--bs-table-bg:rgba(255,210,63,.12);color:var(--ink)}
.table-info,.table-info>*>*{--bs-table-bg:rgba(56,217,255,.10);color:var(--ink)}

/* ---------- forms ---------- */
.form-label{color:var(--mute);font-weight:600;font-size:.9rem}
.form-control,.form-select,.input-group-text{background-color:var(--field);color:var(--ink);border:1px solid var(--line2);border-radius:14px;font-family:var(--body);transition:border-color .2s,box-shadow .2s}
.form-control,.form-select{min-height:46px}
textarea.form-control{min-height:100px}
.form-control-sm,.form-select-sm{min-height:34px;border-radius:10px}
.form-control::placeholder{color:var(--ph)}
.form-control:focus,.form-select:focus{background-color:var(--field);color:var(--head);border-color:var(--focus);box-shadow:0 0 0 3px var(--focus-ring)}
.form-control:disabled,.form-select:disabled,.form-control[readonly]{background-color:var(--bg2);color:var(--dim);opacity:.85}
.form-control[type=file]::file-selector-button{background:var(--card2);color:var(--ink);border:0;border-right:1px solid var(--line2);font-weight:600}
.form-control-color{padding:.3rem;min-height:46px}
.input-group-text{background:var(--card2);color:var(--mute)}
.form-select{--bs-form-select-bg-img:var(--select-arrow)}
.form-select option{background:var(--card);color:var(--ink)}
.form-check-input{background-color:var(--field);border:2px solid var(--line2)}
.form-check-input:checked{background-color:var(--lime);border-color:var(--lime)}
.form-check-input:checked[type=checkbox]{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%231b1340' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")}
.form-check-input:checked[type=radio]{--bs-form-check-bg-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%231b1340'/%3e%3c/svg%3e")}
.form-switch .form-check-input{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23b9b0ee'/%3e%3c/svg%3e")}
.form-switch .form-check-input:checked{--bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%231b1340'/%3e%3c/svg%3e")}
.form-check-input:focus{border-color:var(--focus);box-shadow:0 0 0 3px var(--focus-ring)}
.form-range::-webkit-slider-thumb{background:var(--lime)}.form-range::-moz-range-thumb{background:var(--lime)}
.is-invalid{border-color:var(--coral)!important}

/* ---------- login / register ---------- */
.spro-auth-wrap{min-height:calc(100vh - 140px);display:flex;align-items:center;justify-content:center;padding:24px 0}
.spro-auth-card{background:var(--card);border:1px solid var(--line);border-radius:28px;box-shadow:0 30px 60px -24px #0b0725;position:relative;overflow:hidden}
.spro-auth-card::before{content:"";position:absolute;width:320px;height:320px;right:-110px;top:-150px;border-radius:50%;background:radial-gradient(circle,var(--glow),transparent 65%);pointer-events:none}
.spro-auth-card>*{position:relative}
.spro-auth-card h2{color:var(--head);font-family:var(--disp);font-weight:800;letter-spacing:-.8px}
.spro-auth-card .form-label{color:var(--mute)}
.spro-auth-card .form-control{background:var(--field)}
.spro-auth-lead{color:var(--mute);margin:-6px 0 20px}
.spro-muted-link{color:var(--mute);text-decoration:none}
.spro-muted-link:hover{color:var(--link)}
.spro-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.spro-chips span{padding:5px 13px;border-radius:99px;font:700 12px var(--disp)}
.btn-spro-primary{height:50px;display:inline-flex;align-items:center;justify-content:center}

/* ---------- admin shell ---------- */
.is-admin main.container{max-width:1360px}
.adm-nav{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:28px;padding:8px;background:var(--card);border:1px solid var(--line);border-radius:22px}
.adm-nav .adm-link,.adm-nav .adm-group>button{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 15px;border-radius:99px;border:0;background:transparent;color:var(--mute);font:700 14px var(--disp);text-decoration:none;cursor:pointer;transition:background .2s,color .2s}
.adm-nav .adm-link:hover,.adm-nav .adm-group>button:hover{color:var(--head);background:rgba(91,73,201,.28)}
.adm-nav .adm-link.on,.adm-nav .adm-group.on>button{background:var(--lime);color:var(--on-accent)}
.adm-nav .adm-group>button::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:3px}
.adm-nav .dropdown-item.on{background:var(--hl-bg);color:var(--link)}
.adm-nav .dropdown-item i{width:20px;display:inline-block;color:var(--icon)}
.adm-nav .adm-sp{flex:1}
.adm-title{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.adm-hello{color:var(--mute);margin:0 0 20px}
main h1.mb-4,main h1.h3,main h1.h2{font-size:clamp(28px,3.4vw,38px);letter-spacing:-1px}

/* ---------- candidate area ---------- */
.candidate-nav{position:sticky;top:68px;z-index:20;background:var(--nav-bg)!important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);border-radius:22px!important;box-shadow:none!important;padding:.55rem .7rem!important}
.candidate-nav .btn{border-radius:99px;font-weight:700;padding:.4rem 1rem}
.candidate-nav .btn.btn-outline-dark{background:transparent;border:2px solid transparent;color:var(--mute)}
.candidate-nav .btn.btn-outline-dark:hover{background:rgba(91,73,201,.28);border-color:transparent;color:var(--head);box-shadow:none}
.candidate-nav .btn.btn-dark.active,.candidate-nav .btn.btn-dark{background:var(--lime);border-color:var(--lime);color:var(--on-accent);box-shadow:none}
.typing-box{min-height:260px;font-size:20px;line-height:1.8}
.typing-target{font-size:1.15rem;line-height:2;background:var(--bg2)!important;color:var(--ink);white-space:pre-wrap;font-family:inherit;border:1px solid var(--line);border-radius:16px}
.timer-badge{font-variant-numeric:tabular-nums;font-weight:700;font-size:1.2rem;padding:.5rem .9rem;border:0;border-radius:99px;background:var(--coral);color:#fff;font-family:var(--disp)}
.practice-content{white-space:pre-wrap;line-height:1.8;max-height:55vh;overflow:auto}
/* screens that are intentionally "paper" (exam screens, reports, dashboard) keep their own light look, framed on the dark page */
.paper{background:#f6f4ff;color:#172033;border-radius:26px;padding:20px;border:1px solid var(--line2);box-shadow:0 30px 60px -28px #0b0725}
.paper h1,.paper h2,.paper h3,.paper h4,.paper h5,.paper h6{color:inherit}
.paper .text-muted{color:#64748b!important}
@media(max-width:575.98px){main.container{padding-left:12px;padding-right:12px}.candidate-nav{overflow-x:auto;white-space:nowrap}.candidate-nav .d-flex{flex-wrap:nowrap!important;width:max-content}.typing-box{min-height:220px;font-size:17px}.typing-target{font-size:1rem;line-height:1.8}.display-6{font-size:1.8rem}.paper{padding:12px;border-radius:20px}.adm-nav{border-radius:18px}}

/* ---------- inline-style fallbacks for old pages (not inside a light "paper" area) ---------- */
[style*="background:var(--head)"]:not([data-bs-theme="light"] *):not([data-bs-theme="light"]),
[style*="background: var(--head)"]:not([data-bs-theme="light"] *):not([data-bs-theme="light"]),
[style*="background:#f8fafc"]:not([data-bs-theme="light"] *):not([data-bs-theme="light"]),
[style*="background:#f8f9fa"]:not([data-bs-theme="light"] *):not([data-bs-theme="light"]){background:var(--card)!important;color:var(--ink)!important}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}


/* theme toggle (top bar) */
.spro-theme-btn{width:40px;height:40px;border-radius:50%;border:2px solid var(--line2);background:transparent;color:var(--ink);display:inline-grid;place-items:center;cursor:pointer;font-size:16px;padding:0;transition:border-color .2s,color .2s,transform .18s}
.spro-theme-btn:hover{border-color:var(--link);color:var(--link);transform:rotate(-12deg)}
html[data-bs-theme="dark"] .spro-theme-btn .bi-moon-stars-fill{display:none}
html[data-bs-theme="light"] .spro-theme-btn .bi-sun-fill{display:none}
.navbar.spro-navbar .btn-spro-outline{--bs-btn-color:var(--ink);--bs-btn-border-color:var(--line2)}
html[data-bs-theme="light"] .btn-primary,html[data-bs-theme="light"] .btn-dark,html[data-bs-theme="light"] .btn-spro-primary,html[data-bs-theme="light"] .btn-success{box-shadow:inset 0 0 0 1px rgba(27,19,64,.12)}
html[data-bs-theme="light"] .card,html[data-bs-theme="light"] .table-responsive,html[data-bs-theme="light"] .adm-nav,html[data-bs-theme="light"] .candidate-nav{box-shadow:0 8px 24px -16px rgba(27,19,64,.25)}
html[data-bs-theme="light"] .spro-auth-card{box-shadow:0 30px 60px -30px rgba(27,19,64,.35)}
/* student menu = same pill bar as admin; sticks under the top bar while scrolling */
.usr-nav{position:sticky;top:76px;z-index:1020;background:var(--nav-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.usr-nav .adm-link:last-child{margin-left:auto}
@media(max-width:575.98px){.usr-nav{position:static;gap:4px}.usr-nav .adm-link:last-child{margin-left:0}.usr-nav .adm-link,.usr-nav .adm-group>button{height:38px;padding:0 12px;font-size:13px}}
/* ===== MS Word-style app shell ===== */
.word-app{background:#fff;border:1px solid #c6c9cd;border-radius:.4rem;overflow:hidden;box-shadow:0 4px 16px rgba(0,0,0,.08)}
.word-titlebar{background:linear-gradient(180deg,#1b58c7,#185abf);color:#fff;display:flex;align-items:center;gap:.5rem;padding:.4rem .7rem;font-size:.85rem}
.word-titlebar-icon{width:22px;height:22px;border-radius:4px;background:#fff;color:#185abf;display:inline-flex;align-items:center;justify-content:center;font-size:.9rem;flex:0 0 auto}
.word-titlebar-text{flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.95}
.word-titlebar-dots{display:flex;gap:.35rem;flex:0 0 auto}
.word-titlebar-dots span{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.35);display:inline-block}
.word-titlebar-dots span:last-child{background:rgba(255,255,255,.55)}
.word-tabs{display:flex;flex-wrap:wrap;gap:0;background:#f3f2f1;border-bottom:1px solid #d8dde3;padding:0 .5rem}
.word-tab{padding:.5rem .8rem;font-size:.85rem;color:#444;cursor:default;border-bottom:2px solid transparent;user-select:none}
.word-tab.active{color:#185abf;font-weight:600;border-bottom-color:#185abf;background:#fff}
.word-ribbon{background:#f3f2f1;border-bottom:1px solid #d8dde3;padding:.5rem .5rem .35rem}
.word-ribbon-groups{display:flex;flex-wrap:wrap;align-items:stretch;gap:0}
.word-group{display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:0 .55rem;border-right:1px solid #dcdfe3}
.word-group:last-child{border-right:0}
.word-group-buttons{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem;justify-content:center}
.word-group-label{font-size:.68rem;color:#767676;margin-top:.3rem;letter-spacing:.01em}
.word-ribbon .rbtn{background:#fff;border:1px solid #d8dde3;border-radius:.35rem;min-width:32px;height:30px;display:inline-flex;align-items:center;justify-content:center;font-size:.85rem;cursor:pointer}
.word-ribbon .rbtn:hover{background:#eef2f7}
.word-ribbon .rbtn:active{background:#dfe7f3}
.word-ribbon .rselect{height:30px;border:1px solid #d8dde3;border-radius:.35rem;background:#fff;font-size:.82rem;padding:0 .4rem}
.word-ribbon .rselect-sm{width:64px}
.word-ribbon .rsep{width:1px;align-self:stretch;background:#d8dde3;margin:0 .15rem}
.word-ribbon .rcolor-wrap{position:relative;background:#fff;border:1px solid #d8dde3;border-radius:.35rem;min-width:32px;height:30px;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:.82rem;overflow:hidden}
.word-ribbon .rcolor-wrap input[type=color]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.word-ruler{background:#fbfbfa;border-bottom:1px solid #d8dde3;height:22px;position:relative;background-image:repeating-linear-gradient(90deg,#c7cbd1 0,#c7cbd1 1px,transparent 1px,transparent 12.5%);background-position:center top;background-repeat:repeat-x;background-size:calc(100%/8) 100%;max-width:820px;margin:0 auto}
.word-page-wrap{background:#e9edf2;padding:1.25rem;display:flex;justify-content:center}
.word-page{background:#fff;width:100%;max-width:820px;min-height:520px;box-shadow:0 2px 10px rgba(0,0,0,.12);padding:1in 1in;font-family:Calibri,Arial,sans-serif;font-size:11pt;line-height:1.5;color:#1a1a1a;outline:none}
.word-page:empty:before{content:attr(data-placeholder);color:#9aa4b2}
.word-page h1{font-size:1.8em;font-weight:700;margin:.4em 0}
.word-page h2{font-size:1.4em;font-weight:700;margin:.4em 0}
.word-page h3{font-size:1.15em;font-weight:700;margin:.4em 0}
.word-page blockquote{margin-left:2em;border-left:3px solid #d8dde3;padding-left:.75em;color:#444}
.word-statusbar{background:#185abf;color:#fff;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem;padding:.3rem .8rem;font-size:.75rem}
.word-statusbar .word-zoom{display:flex;align-items:center;gap:.4rem}
.word-statusbar input[type=range]{width:90px;accent-color:#fff}
@media(max-width:575.98px){.word-page{padding:.5in .4in}.word-ribbon .rselect{font-size:.76rem}.word-tab{padding:.4rem .55rem;font-size:.78rem}.word-ruler{display:none}}
.word-app{color-scheme:light;color:#172033}
.word-app .rselect,.word-app .rbtn{color:#172033}
