@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--green:#174b38;--green2:#24664b;--ink:#17251f;--muted:#718078;--line:#e5ebe7;--paper:#f5f8f5;--gold:#d6b36b}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif}button,input{font:inherit}[hidden]{display:none!important}
.login-shell{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff}.brand-panel{position:relative;overflow:hidden;background:radial-gradient(circle at 80% 15%,#2d7153 0,transparent 32%),linear-gradient(145deg,#123b2d,#0c2c22);color:white;padding:clamp(40px,7vw,100px);display:flex;flex-direction:column;justify-content:center}.brand-panel:after{content:"";position:absolute;width:480px;height:480px;border:1px solid #ffffff18;border-radius:50%;right:-180px;bottom:-220px;box-shadow:0 0 0 45px #ffffff08,0 0 0 90px #ffffff05}.brand-mark{width:54px;height:54px;border:1px solid #ffffff65;border-radius:16px;display:grid;place-items:center;font:800 28px Manrope;color:#e6d1a0;margin-bottom:48px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;margin:0 0 14px;color:#c7d9ce}.brand-panel h1{font:800 clamp(42px,5vw,68px)/1.08 Manrope;margin:0 0 24px;letter-spacing:-2px}.brand-panel h1 span{color:#d9c28f}.brand-copy{font-size:15px;line-height:1.8;color:#d0ded5;max-width:380px}.brand-foot{margin-top:90px;font-size:11px;letter-spacing:2px;color:#c2d1c7}.login-panel{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:44px 28px}.login-card{width:min(100%,410px)}.green{color:var(--green2)}.login-card h2{font:800 32px Manrope;margin:0 0 9px;letter-spacing:-1px}.muted{color:var(--muted);font-size:14px;margin:0 0 34px}.login-card label{display:block;font-size:12px;font-weight:700;margin:19px 0 8px}.login-card input{width:100%;height:48px;border:1px solid #dce5df;border-radius:9px;padding:0 14px;outline:none;background:#fbfdfb}.login-card input:focus{border-color:#4e8a6b;box-shadow:0 0 0 3px #2c80551a}.password-wrap{position:relative}.password-wrap input{padding-right:60px}.reveal{position:absolute;right:9px;top:8px;height:32px;border:0;background:none;color:var(--green2);font-size:11px;font-weight:700;cursor:pointer}.primary-btn{width:100%;height:50px;border:0;border-radius:9px;background:var(--green);color:white;display:flex;align-items:center;justify-content:space-between;padding:0 18px;margin-top:25px;font-weight:700;cursor:pointer;transition:.2s}.primary-btn:hover{background:#216346;transform:translateY(-1px)}.primary-btn:disabled{opacity:.65;cursor:wait}.login-note{font-size:11px;color:#89958e;line-height:1.7;margin-top:28px}.form-error{background:#fff0ef;color:#a7352d;border:1px solid #f4d0cc;padding:11px 12px;border-radius:8px;font-size:12px;margin-top:15px}.login-panel footer{font-size:10px;color:#9aa69f;margin-top:70px}.mobile-brand{display:none}
#dashboard-view{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:#123b2d;color:white;padding:28px 18px;display:flex;flex-direction:column;z-index:2}.side-brand{display:flex;gap:12px;align-items:center;color:white;text-decoration:none;padding:0 8px 36px}.brand-mark.small{width:38px;height:38px;border-radius:11px;font-size:20px;margin:0;flex:none}.side-brand b{display:block;font:800 16px Manrope}.side-brand small{display:block;font-size:8px;letter-spacing:1.5px;color:#b6cbbd;margin-top:3px}.side-label{font-size:9px;letter-spacing:1.8px;color:#8eaa99;padding:0 12px 13px}.sidebar nav{display:grid;gap:6px}.nav-link{height:44px;padding:0 12px;display:flex;align-items:center;gap:12px;border-radius:8px;color:#d0ded5;text-decoration:none;font-size:12px}.nav-link span{font-size:17px;width:18px;text-align:center}.nav-link:hover,.nav-link.active{background:#ffffff16;color:white}.sidebar-bottom{margin-top:auto}.security-note{border-top:1px solid #ffffff20;padding:18px 8px;display:flex;align-items:center;gap:10px}.status-dot{width:8px;height:8px;border-radius:50%;background:#75d69a;box-shadow:0 0 0 4px #75d69a20}.security-note b,.security-note small{display:block}.security-note b{font-size:11px}.security-note small{font-size:9px;color:#b6cbbd;margin-top:3px}.logout-btn{width:100%;border:1px solid #ffffff30;background:transparent;color:white;border-radius:8px;padding:11px;text-align:left;cursor:pointer;font-size:12px}.main-area{margin-left:248px;padding:34px clamp(24px,5vw,68px);max-width:1500px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.topbar h1{font:800 27px Manrope;margin:0;letter-spacing:-.8px}.user-chip{display:flex;align-items:center;gap:10px}.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#e1ece4;color:var(--green);font-weight:800}.user-chip b,.user-chip small{display:block}.user-chip b{font-size:11px}.user-chip small{font-size:10px;color:var(--muted);margin-top:3px}.welcome-card{position:relative;overflow:hidden;background:linear-gradient(110deg,#174b38,#24664b);color:white;border-radius:15px;padding:30px 34px;display:flex;justify-content:space-between;align-items:center;min-height:180px}.welcome-card h2{font:800 26px Manrope;margin:0 0 8px}.welcome-card p:not(.eyebrow){font-size:12px;color:#d1e0d6;margin:0}.eyebrow.light{color:#d4c18e}.welcome-symbol{font:800 150px Manrope;color:#ffffff12;line-height:1;margin-right:30px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin:34px 0 17px}.section-heading h2{font:800 20px Manrope;margin:0}.section-heading .eyebrow{margin-bottom:5px}.role-pill{font-size:9px;letter-spacing:1px;font-weight:700;color:#286044;background:#e4efe7;padding:8px 11px;border-radius:30px}.module-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.module-card{background:white;border:1px solid var(--line);border-radius:12px;padding:20px;text-decoration:none;color:inherit;min-height:218px;display:flex;flex-direction:column;transition:.2s}.module-card:hover{border-color:#9fbeaa;transform:translateY(-3px);box-shadow:0 10px 25px #1d50300b}.module-icon{width:38px;height:38px;border-radius:10px;background:#eaf2ec;color:var(--green);display:grid;place-items:center;font-size:19px;margin-bottom:17px}.module-tag{font-size:8px;letter-spacing:1.4px;color:#8a9b90;font-weight:700}.module-card h3{font:800 15px Manrope;margin:6px 0}.module-card p{font-size:11px;line-height:1.65;color:var(--muted);margin:0 0 17px}.module-arrow{font-size:10px;color:var(--green2);font-weight:700;margin-top:auto}.notice-card{display:flex;gap:13px;background:#f0f5f0;border:1px solid #e0eae2;border-radius:10px;padding:16px;margin-top:22px}.notice-icon{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#dceadf;color:var(--green);font-weight:800;flex:none;font-size:12px}.notice-card b{font-size:11px}.notice-card p{font-size:10px;line-height:1.6;color:#68786e;margin:4px 0 0}.main-footer{font-size:9px;color:#9aa69f;margin-top:35px}.main-footer span{padding:0 5px}.toast{position:fixed;right:22px;bottom:22px;background:#173e30;color:white;padding:13px 17px;border-radius:9px;font-size:12px;box-shadow:0 8px 25px #0002;z-index:10}
@media(max-width:1050px){.module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.main-area{padding:28px 25px}}
@media(max-width:700px){.login-shell{grid-template-columns:1fr}.brand-panel{display:none}.login-panel{min-height:100vh;padding:28px 22px}.mobile-brand{display:flex;align-items:center;gap:10px;font:700 12px Manrope;margin-bottom:55px}.mobile-brand .brand-mark{background:var(--green);color:#e6d1a0}.login-panel footer{margin-top:55px}.sidebar{position:relative;width:100%;height:auto;padding:14px 16px}.side-brand{padding:0 4px 14px}.side-label,.sidebar-bottom{display:none}.sidebar nav{display:flex;overflow-x:auto}.nav-link{white-space:nowrap;height:37px;padding:0 9px;font-size:10px}.main-area{margin:0;padding:22px 16px}.topbar{align-items:flex-start}.topbar h1{font-size:23px}.user-chip{gap:7px}.user-chip b{max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.welcome-card{padding:23px;min-height:150px}.welcome-card h2{font-size:21px}.welcome-symbol{font-size:90px;margin:0}.module-grid{gap:10px}.module-card{padding:15px;min-height:205px}.module-card h3{font-size:13px}.module-card p{font-size:10px}.section-heading{margin-top:27px}}

/* AISBa Question Bank */
.questions-heading{display:flex;justify-content:space-between;align-items:center;margin:8px 0 22px}
.questions-heading h2{font:800 25px Manrope;margin:0 0 7px}
.questions-heading .muted{margin:0;font-size:12px}
.secondary-btn{border:1px solid #dce6df;background:white;color:var(--green);border-radius:8px;padding:10px 14px;font-size:11px;font-weight:700;cursor:pointer}
.secondary-btn:hover{background:#edf4ef}
.question-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-bottom:17px}
.question-stats article{background:white;border:1px solid var(--line);border-radius:11px;padding:17px}
.question-stats small,.question-stats strong{display:block}
.question-stats small{font-size:10px;color:var(--muted)}
.question-stats strong{font:800 25px Manrope;color:var(--green);margin-top:6px}
.management-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:16px}
.management-card{background:white;border:1px solid var(--line);border-radius:11px;padding:20px;min-width:0}
.management-card h3{font:800 15px Manrope;margin:0 0 17px}
.management-card label{display:block;font-size:11px;font-weight:700;margin:13px 0 7px}
.management-card input,.management-card select,.management-card textarea,.question-filters input,.question-filters select{width:100%;min-width:0;border:1px solid #dce5df;border-radius:8px;padding:11px 12px;background:#fbfdfb;color:var(--ink);outline:none;font:12px 'DM Sans',sans-serif}
.management-card input:focus,.management-card select:focus,.management-card textarea:focus,.question-filters input:focus,.question-filters select:focus{border-color:#4e8a6b;box-shadow:0 0 0 3px #2c80551a}
.management-card textarea{resize:vertical}
.management-card .primary-btn{margin-top:16px;height:43px;justify-content:center}
.question-list-card{margin-top:16px}
.list-title{display:flex;align-items:center;justify-content:space-between;gap:12px}
.list-title h3{margin-bottom:5px}
.list-title .muted{font-size:11px;margin:0 0 15px}
.question-filters{display:grid;grid-template-columns:1.4fr repeat(4,minmax(120px,1fr));gap:9px;margin:5px 0 16px}
.table-scroll{overflow-x:auto}
.questions-table{width:100%;border-collapse:collapse;font-size:11px;text-align:left}
.questions-table th{background:#f3f7f3;color:#65766b;font-size:9px;text-transform:uppercase;letter-spacing:.6px}
.questions-table th,.questions-table td{padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:top}
.questions-table td{max-width:280px;overflow-wrap:anywhere}
.questions-table tbody tr:hover{background:#fbfdfb}
.status-label{display:inline-block;padding:5px 8px;border-radius:20px;background:#edf2ee;color:#52665a;font-size:9px;font-weight:700}
.inline-message{padding:11px 13px;background:#f0f5f0;border-radius:8px;font-size:11px;margin-bottom:12px;color:var(--green)}
.inline-message.error{background:#fff0ef;color:#a7352d}
.pagination{display:flex;justify-content:space-between;align-items:center;margin-top:16px}
.pagination span{font-size:10px;color:var(--muted)}
@media(max-width:1000px){.question-filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.management-grid{grid-template-columns:1fr}.question-stats{gap:8px}.question-stats article{padding:12px}.question-stats strong{font-size:21px}.questions-heading{align-items:flex-start}.question-filters{grid-template-columns:1fr 1fr}.questions-table{min-width:650px}}

/* =====================================================
   AISBa PREMIUM ACADEMIC DESIGN SYSTEM
   Visual layer only - existing functionality preserved
   ===================================================== */

:root {
  --green: #123b2d;
  --green2: #24664b;
  --ink: #202b25;
  --muted: #78847c;
  --line: #e8ece7;
  --paper: #f7f8f5;
  --gold: #c9a96a;
  --surface: #ffffff;
  --soft-green: #edf3ee;
  --shadow-soft: 0 5px 24px rgba(26, 54, 38, .045);
  --shadow-card: 0 12px 34px rgba(26, 54, 38, .065);
}

body {
  background: var(--paper);
  color: var(--ink);
  font-family: 'DM Sans', sans-serif;
  -webkit-font-smoothing: antialiased;
}

button, input, select, textarea {
  font-family: 'DM Sans', sans-serif;
}

::selection {
  background: #dce9df;
  color: var(--green);
}

/* Sidebar */
.sidebar {
  background:
    radial-gradient(circle at 0% 0%, rgba(201,169,106,.12), transparent 35%),
    linear-gradient(165deg, #153e30 0%, #102f24 100%);
  border-right: 1px solid rgba(255,255,255,.06);
  padding: 30px 19px 22px;
  box-shadow: 8px 0 30px rgba(15, 43, 31, .045);
}

.side-brand {
  padding: 0 9px 39px;
}

.side-brand .brand-mark {
  border-color: rgba(201,169,106,.65);
  color: #e2c58c;
  background: rgba(255,255,255,.035);
  box-shadow: 0 4px 16px rgba(0,0,0,.08);
}

.side-brand b {
  font-size: 17px;
  letter-spacing: -.35px;
}

.side-brand small {
  letter-spacing: 1.7px;
  font-size: 8px;
}

.side-label {
  color: #a5b9aa;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.7px;
}

.sidebar nav {
  gap: 7px;
}

.nav-link {
  height: 46px;
  padding: 0 13px;
  color: #d0ded5;
  font-size: 12px;
  border: 1px solid transparent;
  transition: background .2s, border-color .2s, color .2s;
}

.nav-link span {
  color: #b8cbbb;
}

.nav-link:hover {
  background: rgba(255,255,255,.075);
  color: white;
}

.nav-link.active {
  background: rgba(255,255,255,.105);
  border-color: rgba(255,255,255,.075);
  color: #fff;
  box-shadow: inset 3px 0 0 var(--gold);
}

.nav-link.active span {
  color: #e0c58f;
}

.security-note {
  border-top-color: rgba(255,255,255,.12);
}

.logout-btn {
  border-color: rgba(255,255,255,.19);
  transition: background .2s;
}

.logout-btn:hover {
  background: rgba(255,255,255,.08);
}

/* Main workspace */
.main-area {
  padding: 39px clamp(26px, 4.5vw, 66px);
  max-width: 1600px;
}

.topbar {
  margin-bottom: 31px;
}

.topbar .eyebrow {
  font-size: 9px;
  letter-spacing: 1.8px;
  color: #8b9a8e;
}

.topbar h1 {
  font-size: 29px;
  letter-spacing: -1.1px;
  color: #1b3024;
}

.user-chip {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 40px;
  padding: 6px 13px 6px 6px;
  box-shadow: var(--shadow-soft);
}

.avatar {
  background: #e9efe8;
  color: var(--green);
}

.user-chip b {
  font-size: 11px;
}

.user-chip small {
  color: #89958d;
}

/* Welcome section */
.welcome-card {
  background:
    radial-gradient(ellipse at 90% 10%, rgba(201,169,106,.18), transparent 34%),
    linear-gradient(115deg, #153f30 0%, #20583e 62%, #28674a 100%);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 17px;
  padding: 35px 39px;
  min-height: 195px;
  box-shadow: 0 14px 34px rgba(20,64,44,.11);
}

.welcome-card h2 {
  font-size: 29px;
  letter-spacing: -.8px;
}

.welcome-card p:not(.eyebrow) {
  line-height: 1.8;
  font-size: 12px;
  color: #dce8df;
}

.welcome-symbol {
  color: rgba(255,255,255,.075);
}

/* Section headings */
.section-heading {
  margin: 39px 0 19px;
}

.section-heading .eyebrow {
  font-size: 9px;
  letter-spacing: 1.7px;
  color: #89978c;
}

.section-heading h2 {
  font-size: 21px;
  letter-spacing: -.5px;
  color: #21362a;
}

.role-pill {
  color: #526b55;
  background: #e9f0e8;
  border: 1px solid #dfe8df;
  font-size: 9px;
  letter-spacing: 1.1px;
}

/* Dashboard module cards */
.module-grid {
  gap: 17px;
}

.module-card {
  position: relative;
  overflow: hidden;
  min-height: 225px;
  padding: 22px;
  border: 1px solid #e9ede8;
  border-radius: 14px;
  box-shadow: var(--shadow-soft);
  transition: transform .22s, box-shadow .22s, border-color .22s;
}

.module-card:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--gold);
  transition: width .25s;
}

.module-card:hover {
  transform: translateY(-4px);
  border-color: #cbd9cc;
  box-shadow: var(--shadow-card);
}

.module-card:hover:after {
  width: 100%;
}

.module-icon {
  width: 43px;
  height: 43px;
  border-radius: 12px;
  background: #edf3ed;
  color: var(--green);
  font-size: 20px;
}

.module-tag {
  font-size: 8px;
  letter-spacing: 1.5px;
  color: #9aa69c;
}

.module-card h3 {
  font-size: 16px;
  letter-spacing: -.35px;
  color: #25372c;
}

.module-card p {
  font-size: 11px;
  line-height: 1.8;
  color: #78847c;
}

.module-arrow {
  color: #376c4c;
  font-size: 10px;
}

/* Notices */
.notice-card {
  background: #f0f4ed;
  border: 1px solid #e5ebe1;
  border-radius: 12px;
  padding: 17px 19px;
}

.notice-icon {
  background: #e0eadd;
  color: #315c3c;
}

/* Login */
.login-shell {
  background: #fff;
}

.brand-panel {
  background:
    radial-gradient(circle at 85% 18%, rgba(201,169,106,.16), transparent 32%),
    linear-gradient(145deg, #153f30, #0c2d22);
}

.brand-mark {
  border-color: rgba(201,169,106,.7);
  color: #e2c58c;
}

.brand-panel h1 {
  letter-spacing: -2.4px;
}

.brand-panel h1 span {
  color: #dec58f;
}

.login-card h2 {
  color: #1b3024;
}

.login-card input {
  background: #fafbf9;
  border-color: #e4eae4;
  transition: border-color .2s, box-shadow .2s;
}

.primary-btn {
  background: linear-gradient(105deg, #173f2e, #286548);
  border-radius: 9px;
  box-shadow: 0 5px 13px rgba(23,75,56,.12);
  transition: transform .2s, box-shadow .2s, background .2s;
}

.primary-btn:hover {
  background: linear-gradient(105deg, #20583d, #327451);
  box-shadow: 0 8px 18px rgba(23,75,56,.16);
  transform: translateY(-1px);
}

/* Question bank workspace */
.questions-heading {
  margin: 8px 0 25px;
}

.questions-heading h2 {
  color: #20372a;
  font-size: 27px;
  letter-spacing: -.8px;
}

.questions-heading .eyebrow {
  font-size: 9px;
  letter-spacing: 1.7px;
}

.question-stats {
  gap: 15px;
  margin-bottom: 20px;
}

.question-stats article {
  border: 1px solid #e9ede8;
  border-radius: 13px;
  padding: 20px;
  box-shadow: var(--shadow-soft);
  transition: box-shadow .2s, transform .2s;
}

.question-stats article:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-card);
}

.question-stats small {
  color: #87938a;
  font-size: 10px;
  letter-spacing: .2px;
}

.question-stats strong {
  color: #204c34;
  font-size: 29px;
  letter-spacing: -.8px;
}

.management-grid {
  gap: 16px;
}

.management-card {
  border: 1px solid #e9ede8;
  border-radius: 13px;
  padding: 23px;
  box-shadow: var(--shadow-soft);
}

.management-card h3 {
  color: #26392d;
  font-size: 15px;
  letter-spacing: -.2px;
}

.management-card label {
  color: #4e5d52;
  font-size: 10px;
  letter-spacing: .1px;
}

.management-card input,
.management-card select,
.management-card textarea,
.question-filters input,
.question-filters select {
  background: #fbfcfa;
  border-color: #e4eae3;
  border-radius: 8px;
  color: #26372d;
  transition: border-color .2s, box-shadow .2s;
}

.management-card input::placeholder,
.management-card textarea::placeholder,
.question-filters input::placeholder {
  color: #a1aaa3;
}

.management-card .primary-btn {
  margin-top: 19px;
  min-height: 44px;
}

.secondary-btn {
  background: #fff;
  border-color: #dfe7df;
  color: #315d40;
  border-radius: 8px;
  transition: background .2s, border-color .2s;
}

.secondary-btn:hover:not(:disabled) {
  background: #f0f5ef;
  border-color: #cbd9cc;
}

.secondary-btn:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.question-list-card {
  margin-top: 18px;
  padding: 23px;
}

.list-title h3 {
  margin-bottom: 5px;
}

.question-filters {
  gap: 10px;
  margin: 10px 0 18px;
}

.questions-table {
  border-collapse: separate;
  border-spacing: 0;
}

.questions-table th {
  background: #f4f6f2;
  color: #68786c;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .8px;
}

.questions-table th:first-child {
  border-radius: 7px 0 0 7px;
}

.questions-table th:last-child {
  border-radius: 0 7px 7px 0;
}

.questions-table td {
  color: #46544a;
  line-height: 1.6;
  padding-top: 14px;
  padding-bottom: 14px;
}

.questions-table td b {
  color: #244b33;
}

.questions-table tbody tr:hover td {
  background: #f9fbf8;
}

.status-label {
  background: #edf3ec;
  color: #416449;
  border: 1px solid #e1eade;
  font-size: 9px;
  letter-spacing: .2px;
}

.inline-message {
  border: 1px solid #e2eade;
  background: #f1f6ef;
  color: #315b3d;
  line-height: 1.6;
}

.inline-message.error {
  background: #fff3f1;
  border-color: #f0d9d5;
  color: #a7352d;
}

.pagination {
  padding-top: 14px;
  border-top: 1px solid #edf0ec;
}

.main-footer {
  color: #a1aaa2;
  letter-spacing: .15px;
}

/* Focus visibility and accessible interaction */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(201,169,106,.48);
  outline-offset: 2px;
}

/* Tablet and mobile */
@media(max-width:1050px) {
  .main-area {
    padding: 29px 25px;
  }
}

@media(max-width:700px) {
  .sidebar {
    background: linear-gradient(165deg, #153e30, #102f24);
    padding: 14px 15px;
  }

  .side-brand {
    padding-bottom: 15px;
  }

  .nav-link.active {
    box-shadow: inset 0 -2px 0 var(--gold);
  }

  .main-area {
    padding: 22px 16px;
  }

  .topbar h1 {
    font-size: 23px;
  }

  .welcome-card {
    padding: 24px;
  }

  .welcome-card h2 {
    font-size: 23px;
  }

  .module-grid {
    gap: 11px;
  }

  .module-card {
    border-radius: 12px;
    padding: 16px;
  }

  .question-list-card,
  .management-card {
    padding: 16px;
  }

  .questions-heading h2 {
    font-size: 23px;
  }
}


/* =====================================================
   AISBa PREMIUM LOGIN + BRANDING CUSTOMIZER
   ===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Noto+Naskh+Arabic:wght@400;500;600;700&display=swap');

.login-shell {
  min-height: 100vh;
  grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr);
  background: #f8f8f4;
}
.brand-panel {
  isolation: isolate;
  min-height: 100vh;
  padding: clamp(34px, 5vw, 76px);
  background: var(--brand-primary, #174b38);
}
.brand-photo, .brand-overlay {
  position: absolute;
  inset: 0;
  z-index: -1;
}
.brand-photo {
  background-size: cover;
  background-position: center;
  opacity: .42;
  transition: background-image .25s ease;
}
.brand-overlay {
  background:
    linear-gradient(115deg, rgba(9,35,25,.96) 0%, rgba(15,58,40,.83) 58%, rgba(15,58,40,.48) 100%),
    radial-gradient(circle at 85% 12%, rgba(201,169,106,.24), transparent 34%);
}
.brand-content {
  width: min(100%, 650px);
  margin: auto;
  position: relative;
  z-index: 1;
}
.brand-logo-wrap { min-height: 66px; margin-bottom: 48px; display:flex; align-items:center; }
.brand-logo {
  max-width: 180px;
  max-height: 76px;
  object-fit: contain;
  object-position: left center;
}
.brand-mark {
  border-color: rgba(221,194,139,.7);
  color: #e4cc99;
  background: rgba(255,255,255,.07);
}
.brand-panel .eyebrow {
  color: #d6c28f;
  letter-spacing: 2.2px;
  font-size: 10px;
}
.brand-panel h1 {
  max-width: 620px;
  font-size: clamp(36px, 4.3vw, 61px);
  line-height: 1.13;
  letter-spacing: -2.2px;
  margin: 17px 0 27px;
}
.brand-panel h1 span { color: #ddc58f; }
.brand-quote {
  border-left: 2px solid var(--brand-accent, #c7a66a);
  padding: 4px 0 4px 19px;
  margin: 34px 0 28px;
  max-width: 540px;
}
.arabic-quote {
  color: #fff;
  font: 600 27px/1.8 'Noto Naskh Arabic', serif;
  margin: 0 0 6px;
}
.quote-translation {
  color: #dce7de;
  font-size: 12px;
  line-height: 1.8;
  margin: 0;
}
.brand-vision {
  max-width: 520px;
  margin-top: 38px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.2);
}
.brand-vision span {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 2px;
  color: #d6c28f;
}
.brand-vision p {
  color: #f0f3ed;
  font-size: 13px;
  line-height: 1.8;
  margin: 8px 0 0;
}
.brand-foot {
  margin-top: 42px;
  color: #bdcfc1;
  font-size: 9px;
  letter-spacing: 2px;
}
.login-panel {
  background:
    radial-gradient(circle at 90% 10%, rgba(201,169,106,.09), transparent 28%),
    #fbfbf8;
  padding: 44px clamp(28px, 5vw, 78px);
}
.login-card { width: min(100%, 430px); }
.login-card h2 {
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 35px;
  letter-spacing: -1.4px;
  color: #1c3025;
}
.login-card .eyebrow { letter-spacing: 2px; }
.login-card label {
  font-size: 11px;
  color: #34483b;
}
.login-card input {
  height: 52px;
  border-radius: 10px;
  background: #fff;
  font-size: 13px;
}
.primary-btn {
  background: var(--green);
  border-radius: 10px;
  height: 52px;
  box-shadow: 0 8px 18px rgba(18,59,45,.13);
}
.login-panel footer { margin-top: 54px; }
.mobile-brand { color: var(--green); }
.mobile-brand img { max-width: 42px; max-height: 42px; object-fit:contain; }
.brand-panel[data-layout="centered"] .brand-content { text-align:center; }
.brand-panel[data-layout="centered"] .brand-logo-wrap { justify-content:center; }
.brand-panel[data-layout="centered"] .brand-logo { object-position:center; }
.brand-panel[data-layout="centered"] .brand-vision { margin-left:auto; margin-right:auto; }
.brand-panel[data-layout="centered"] .brand-quote { margin-left:auto; margin-right:auto; border-left:0; border-top:2px solid var(--brand-accent); padding:15px 0 0; }

.branding-layout {
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(360px, .95fr);
  gap:18px;
  align-items:start;
}
.branding-editor { padding:24px; }
.branding-editor h3 { margin-bottom:13px; }
.branding-editor input[type="file"] { padding:9px; background:#fff; }
.branding-editor input[type="color"] { height:43px; padding:4px; cursor:pointer; }
.branding-divider { height:1px; background:var(--line); margin:23px 0; }
.branding-color-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.upload-brand-btn { margin:8px 0 5px; }
.branding-help { color:#87938b; font-size:10px; line-height:1.7; margin:8px 0 15px; }
.preview-heading { display:flex; justify-content:space-between; gap:10px; align-items:center; margin:0 0 12px; }
.preview-heading b { font-size:13px; color:#294333; }
.preview-heading span { font-size:10px; color:#8b978e; }
.branding-preview {
  --preview-primary:#174b38;
  --preview-accent:#c7a66a;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  min-height:390px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid #e2e9e2;
  background:#fbfbf8;
  box-shadow:0 14px 35px rgba(24,55,38,.1);
}
.preview-visual {
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  padding:20px;
  color:white;
  background:var(--preview-primary);
  overflow:hidden;
}
.preview-photo {
  position:absolute;
  inset:0;
  z-index:-2;
  background-size:cover;
  background-position:center;
  opacity:.35;
}
.preview-visual:after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(140deg,rgba(7,35,24,.94),rgba(20,72,49,.72));
}
.preview-visual-content { width:100%; }
.preview-logo {
  width:34px;height:34px;border:1px solid #d5c18c;border-radius:9px;
  display:grid;place-items:center;color:#e5cc94;font-weight:800;margin-bottom:20px;
}
.preview-logo img { width:100%;height:100%;object-fit:contain; }
.preview-visual small { font-size:7px;letter-spacing:1px;color:#e0cc9c; }
.preview-visual h3 { font-size:18px;line-height:1.35;margin:15px 0;color:#fff; }
.preview-visual h3 span { color:#e0c58d; }
.preview-visual-content > p { font-size:9px;line-height:1.6;color:#e0e9e2; }
.preview-form { padding:24px 15px; display:flex; flex-direction:column; justify-content:center; }
.preview-form > small { color:var(--preview-primary);font-size:7px;font-weight:800;letter-spacing:1px; }
.preview-form h3 { font-size:18px;color:#26392d;margin:10px 0 5px; }
.preview-form p { color:#89958c;font-size:9px;line-height:1.6;margin:0 0 17px; }
.preview-input { height:30px;border:1px solid #e1e7e1;border-radius:6px;margin:5px 0; }
.preview-submit { background:var(--preview-primary);color:#fff;border-radius:6px;padding:10px;font-size:9px;margin-top:12px;text-align:center; }
.branding-preview[data-layout="centered"] .preview-visual { text-align:center; }
.branding-preview[data-layout="centered"] .preview-logo { margin-left:auto;margin-right:auto; }
.branding-preview[data-layout="centered"] { grid-template-columns:1fr; }
.branding-preview[data-layout="centered"] .preview-visual { min-height:220px; }
.branding-preview[data-layout="centered"] .preview-form { display:none; }

@media(max-width:1000px) {
  .branding-layout { grid-template-columns:1fr; }
  .branding-preview { max-width:700px; }
}
@media(max-width:700px) {
  .login-shell { grid-template-columns:1fr; }
  .brand-panel { display:flex; min-height:auto; padding:28px 24px; }
  .brand-content { width:100%; }
  .brand-logo-wrap { margin-bottom:22px; }
  .brand-panel h1 { font-size:34px; }
  .brand-vision { margin-top:22px; }
  .brand-foot { margin-top:22px; }
  .login-panel { min-height:auto; padding:35px 22px 25px; }
  .mobile-brand { display:flex; }
  .login-panel footer { margin-top:35px; }
  .branding-preview { grid-template-columns:1fr 1fr; min-height:300px; }
  .preview-visual { padding:12px; }
  .preview-form { padding:13px 9px; }
  .preview-visual h3 { font-size:14px; }
  .preview-visual small { font-size:6px; }
}