:root{
  --qln-navy:#0b2f46;
  --qln-blue:#176b9a;
  --qln-sky:#e8f5fb;
  --qln-green:#44a642;
  --qln-green-dark:#18703a;
  --qln-gold:#d8a63f;
  --ink:#102033;
  --muted:#64748b;
  --line:#e2e8f0;
  --bg:#f4f8fb;
  --card:#ffffff;
  --brand:var(--qln-navy);
  --brand2:var(--qln-blue);
  --gold:var(--qln-gold);
  --green:#166534;
  --green-bg:#dcfce7;
  --amber:#92400e;
  --amber-bg:#fef3c7;
  --blue:#1e40af;
  --blue-bg:#dbeafe;
  --red:#991b1b;
  --red-bg:#fee2e2;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at top left,#ecf8ff 0,#f7fbfd 34%,var(--bg) 100%);color:var(--ink)}
a{text-decoration:none;color:inherit}
.app-shell{display:flex;min-height:100vh}
.sidebar{width:292px;background:linear-gradient(180deg,#08283d 0%,#0b2f46 58%,#073047 100%);color:#fff;padding:24px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;box-shadow:14px 0 34px rgba(8,40,61,.16)}
.brand{display:flex;gap:14px;align-items:center;margin-bottom:30px}
.brand-logo{width:78px;height:auto;background:#fff;border-radius:16px;padding:7px;box-shadow:0 10px 30px rgba(0,0,0,.18)}
.brand-mark{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,var(--qln-green),#d8f7d3);color:#0f2f44;display:grid;place-items:center;font-weight:900}
.brand strong{letter-spacing:.01em}.brand span,.sidebar-foot span{display:block;color:#bdd5e5;font-size:12px;margin-top:3px}.sidebar nav{display:grid;gap:8px}.sidebar nav a{padding:12px 14px;border-radius:12px;color:#eaf5fb;border:1px solid transparent}.sidebar nav a.active,.sidebar nav a:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.12)}.sidebar-foot{margin-top:auto;border-top:1px solid rgba(255,255,255,.16);padding-top:18px}.sidebar-foot a{display:inline-block;margin-top:10px;color:#fff;text-decoration:underline}main{flex:1;padding:28px;max-width:1400px}.topbar,.page-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:22px}h1{font-size:32px;margin:0 0 6px;color:var(--qln-navy)}h2{font-size:18px;margin:0;color:var(--qln-navy)}.subtitle{color:var(--muted);margin:0}.grid{display:grid;gap:18px}.kpis{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:18px}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 12px 30px rgba(15,47,68,.07)}.kpi strong{font-size:30px;display:block;color:var(--qln-navy)}.kpi span{color:var(--muted)}.content-grid{grid-template-columns:1.4fr .9fr}.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;border-bottom:1px solid var(--line);padding:14px;vertical-align:top}th{font-size:12px;text-transform:uppercase;color:var(--muted);letter-spacing:.05em}.row-sub{color:var(--muted);font-size:13px}.tag{display:inline-flex;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:700}.green{background:var(--green-bg);color:var(--green)}.amber{background:var(--amber-bg);color:var(--amber)}.blue{background:var(--blue-bg);color:var(--blue)}.red{background:var(--red-bg);color:var(--red)}.primary,.secondary,.danger,.link{border:0;border-radius:12px;padding:11px 14px;font-weight:800;cursor:pointer}.primary{background:linear-gradient(135deg,var(--qln-navy),var(--qln-blue));color:#fff;box-shadow:0 8px 18px rgba(23,107,154,.22)}.secondary{background:#eef7fb;color:var(--qln-navy)}.danger{background:var(--red-bg);color:var(--red)}.link{background:transparent;color:var(--brand2);padding:0}.toolbar{display:flex;justify-content:space-between;gap:12px;margin-bottom:14px}.search,input,select,textarea{border:1px solid var(--line);border-radius:12px;padding:12px 13px;font:inherit;background:#fff;width:100%}.search{max-width:420px}input:focus,select:focus,textarea:focus{outline:3px solid rgba(68,166,66,.18);border-color:var(--qln-green)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid .full{grid-column:1/-1}.form-actions{display:flex;gap:10px;margin-top:16px}.alert{border-radius:14px;padding:13px 15px;margin-bottom:16px;font-weight:700}.alert.success{background:var(--green-bg);color:var(--green)}.alert.error{background:var(--red-bg);color:var(--red)}.login-page{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#062437 0%,#0b2f46 48%,#176b9a 100%);position:relative;overflow:hidden}.login-page:before{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 20% 20%,rgba(68,166,66,.35),transparent 24%),radial-gradient(circle at 80% 12%,rgba(255,255,255,.18),transparent 18%)}.login-card{width:min(460px,92vw);background:rgba(255,255,255,.98);border-radius:24px;padding:30px;box-shadow:0 28px 90px rgba(0,0,0,.3);position:relative}.login-card .brand{color:var(--ink);margin-bottom:22px}.login-card .brand-logo{box-shadow:0 8px 24px rgba(15,47,68,.12);border:1px solid var(--line)}.login-card form{display:grid;gap:14px}.muted{color:var(--muted);font-size:13px}.actions{display:flex;gap:8px;flex-wrap:wrap}.programme-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.programme-code{font-size:12px;font-weight:900;color:var(--brand2);letter-spacing:.05em}.programme p{color:var(--muted)}.programme-footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:14px}.timeline{display:grid;gap:14px}.timeline-item{border-left:3px solid var(--qln-green);padding-left:12px}.empty{padding:24px;text-align:center;color:var(--muted)}button.small, .small { padding: 8px 12px; font-size: 12px; border-radius: 10px; }button.secondary { border: 0; background: #eef7fb; color: #12384d; font-weight: 700; cursor: pointer; }button.secondary:hover { filter: brightness(0.96); }.check-grid { border: 1px solid #e5e7eb; border-radius: 14px; padding: 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; }.check-grid legend { padding: 0 8px; font-weight: 700; }.inline-form { display: flex; gap: 8px; align-items: center; }.button.small, .small { padding: 7px 10px; border-radius: 10px; text-decoration: none; display: inline-block; }.question-block { border: 1px solid #e5e7eb; border-radius: 16px; padding: 16px; margin-bottom: 14px; background: #fff; }.question-block label { display:block; margin-bottom:8px; }.question-block input[type="text"], .question-block input:not([type]), .question-block textarea, .question-block input[type="date"] { width:100%; }.required { color: #b91c1c; }.check-line { display:flex !important; gap:10px; align-items:center; }.evidence-card { border-left: 5px solid var(--qln-green); }.answer-review { border-top:1px solid #e5e7eb; padding:12px 0; }
@media(max-width:900px){.app-shell{display:block}.sidebar{width:auto;height:auto;position:relative}.kpis,.content-grid,.programme-grid,.form-grid{grid-template-columns:1fr}.page-head,.toolbar{display:block}.page-head .primary{margin-top:12px}main{padding:18px}.brand-logo{width:68px}}