:root {
  color-scheme: light;
  --ink: #17233b;
  --muted: #6d778a;
  --line: #e2e7ef;
  --paper: #ffffff;
  --canvas: #f4f6f9;
  --navy: #17233b;
  --blue: #2f67d8;
  --blue-soft: #eaf1ff;
  --green: #1c936a;
  --green-soft: #e6f7f0;
  --amber: #c47a13;
  --shadow: 0 18px 50px rgba(23, 35, 59, .08);
  font-family: Tahoma, "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--canvas); color: var(--ink); min-height: 100vh; }
button, select, input { font: inherit; }
button, select { cursor: pointer; }
.shell { width: min(1480px, calc(100% - 32px)); margin: 0 auto 64px; display: grid; grid-template-columns: 230px minmax(0, 1fr); column-gap: 24px; }
.shell > .topbar, .shell > main { grid-column: 2; }
.sidebar { grid-column: 1; grid-row: 1 / 3; position: sticky; top: 16px; height: calc(100vh - 32px); margin-top: 16px; padding: 22px 16px; border-radius: 22px; background: var(--navy); color: white; display: flex; flex-direction: column; z-index: 20; }
.sidebar-brand { padding: 0 8px 24px; border-bottom: 1px solid #ffffff18; }
.sidebar-brand .brand-mark { background: white; color: var(--navy); }
.sidebar-brand small { color: #96a5bd; }
.sidebar-nav { display: grid; gap: 7px; margin-top: 24px; }
.sidebar-nav a { display: flex; align-items: center; gap: 11px; padding: 12px 13px; border-radius: 12px; color: #b8c3d5; text-decoration: none; font-size: 12px; font-weight: 700; }
.sidebar-nav a span { width: 24px; text-align: center; font-size: 17px; }
.sidebar-nav a:hover, .sidebar-nav a.active { color: white; background: #ffffff12; }
.sidebar-footer { margin-top: auto; padding: 18px 8px 4px; border-top: 1px solid #ffffff18; display: grid; gap: 10px; }
.sidebar-footer small { color: #7f90ac; direction: ltr; text-align: right; }
.sidebar-logout { border: 0; border-radius: 10px; padding: 10px; color: #ffd4d4; background: #ffffff0c; text-align: right; }
.topbar { height: 84px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.brand-mark { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; color: white; background: var(--navy); font-size: 22px; font-weight: 800; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 17px; }
.brand small { margin-top: 3px; color: var(--muted); direction: ltr; letter-spacing: .02em; }
.status { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; }
.status-dot { width: 9px; height: 9px; background: #38b986; border-radius: 50%; box-shadow: 0 0 0 5px #ddf7ec; }

.hero { min-height: 240px; padding: 42px 48px; border-radius: 28px; background: var(--navy); color: white; display: flex; align-items: center; justify-content: space-between; overflow: hidden; position: relative; }
.hero h1 { margin: 8px 0 12px; font-size: clamp(32px, 5vw, 58px); line-height: 1.2; letter-spacing: -.03em; }
.hero-copy { max-width: 630px; color: #c7d0df; line-height: 2; margin: 0; }
.eyebrow { margin: 0; color: var(--blue); font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hero .eyebrow { color: #8fb3ff; }
.hero-art { direction: ltr; width: 240px; height: 150px; position: relative; flex: 0 0 auto; }
.hero-art span { position: absolute; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.07); backdrop-filter: blur(8px); border-radius: 22px; font-weight: 800; }
.hero-art span:nth-child(1) { width: 92px; height: 92px; left: 0; top: 28px; font-size: 28px; transform: rotate(-8deg); }
.hero-art span:nth-child(2) { width: 116px; height: 116px; left: 72px; top: 0; color: #62dcae; font-size: 48px; transform: rotate(7deg); }
.hero-art span:nth-child(3) { width: 76px; height: 76px; right: 0; bottom: 0; font-size: 22px; transform: rotate(-4deg); }

.card { background: var(--paper); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); }
.controls { margin: -20px 28px 26px; position: relative; z-index: 2; padding: 22px; display: grid; grid-template-columns: 1.2fr .8fr 1fr auto; gap: 14px; align-items: end; }
.controls label { display: grid; gap: 8px; color: var(--muted); font-size: 12px; font-weight: 700; }
select, .search { min-height: 48px; border: 1px solid var(--line); border-radius: 13px; background: #fbfcfe; color: var(--ink); }
select { width: 100%; padding: 0 14px; outline: none; }
select:focus, .search:focus-within { border-color: #9bb7ee; box-shadow: 0 0 0 4px var(--blue-soft); }
.primary-button, .ghost-button { border: 0; border-radius: 13px; min-height: 48px; padding: 0 22px; font-weight: 800; }
.primary-button { color: white; background: var(--blue); }
.primary-button:hover { background: #2459bf; }
.ghost-button { color: var(--blue); background: var(--blue-soft); }
.eid-lookup { margin-bottom: 26px; padding: 18px 20px; display: grid; grid-template-columns: 1.1fr 1.4fr auto; gap: 15px; align-items: center; }
.eid-copy { display: flex; gap: 12px; align-items: center; }
.eid-copy strong, .eid-copy small { display: block; }
.eid-copy small { margin-top: 5px; color: var(--muted); font-size: 11px; line-height: 1.6; }
.eid-icon { display: grid; place-items: center; flex: 0 0 auto; width: 42px; height: 42px; border-radius: 13px; color: var(--blue); background: var(--blue-soft); font-size: 20px; }
.eid-input { min-height: 48px; display: flex; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 13px; background: #fbfcfe; padding: 0 13px; }
.eid-input:focus-within { border-color: #9bb7ee; box-shadow: 0 0 0 4px var(--blue-soft); }
.eid-input span { color: var(--blue); font-size: 11px; font-weight: 800; }
.eid-input input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; direction: ltr; text-align: left; color: var(--ink); }
.compare-button { min-height: 48px; border: 0; border-radius: 13px; padding: 0 19px; color: white; background: var(--green); font-weight: 800; }
.compare-button:hover { background: #167b59; }
.local-import { margin-bottom: 26px; padding: 22px; box-shadow: none; border-right: 4px solid var(--green); }
.local-import-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.local-import-heading h2 { margin: 6px 0; font-size: 21px; }
.local-import-heading p:last-child { margin: 0; color: var(--muted); font-size: 11px; }
.local-server-state { display: inline-flex; align-items: center; gap: 7px; padding: 8px 11px; border-radius: 999px; color: #176b51; background: var(--green-soft); font-size: 10px; font-weight: 800; }
.local-server-state i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.local-import-controls { display: grid; grid-template-columns: 1fr auto auto auto; gap: 10px; align-items: end; margin-top: 18px; }
.local-import-controls label { display: grid; gap: 7px; color: var(--muted); font-size: 10px; font-weight: 800; }
.local-import-controls input { min-height: 48px; width: 100%; border: 1px solid var(--line); border-radius: 13px; outline: none; padding: 0 13px; background: #fbfcfe; }
.local-import-controls input:focus { border-color: #9bb7ee; box-shadow: 0 0 0 4px var(--blue-soft); }
.preview-button, .commit-button { min-height: 48px; border: 0; border-radius: 13px; padding: 0 17px; font-weight: 800; }
.preview-button { color: var(--navy); background: #edf0f5; }
.commit-button { color: white; background: var(--green); }
.local-import-status { margin-top: 13px; padding: 11px 13px; border-radius: 10px; color: var(--muted); background: #f7f9fc; font-size: 11px; }
.local-import-status.success { color: #176b51; background: var(--green-soft); }
.local-import-status.error { color: #a23c3c; background: #ffeded; }
.local-import-results { margin-top: 14px; }
.local-import-table { min-width: 880px; }
.local-import-table td { font-size: 11px; }
.local-import-table .eid-cell { direction: ltr; font: 10px Consolas, monospace; }
.section-tags { display: flex; gap: 5px; flex-wrap: wrap; }
.section-tag { padding: 5px 7px; border-radius: 7px; color: #4c628a; background: #f1f5fc; font-size: 9px; }
.raw-score { direction: ltr; white-space: nowrap; font-weight: 800; }
.hidden { display: none !important; }

.overview { display: grid; gap: 22px; }
.exam-heading { padding: 16px 6px 0; display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.exam-export-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }

.dashboard-products { padding: 24px; }
.dashboard-products-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.dashboard-products-heading h2 { margin: 3px 0 5px; }
.dashboard-products-heading p { margin: 0; color: var(--muted); }
.dashboard-products-heading > a { color: var(--primary); font-weight: 700; text-decoration: none; white-space: nowrap; }
.dashboard-product-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; }
.dashboard-product { border: 1px solid #e2e8f0; border-radius: 18px; padding: 18px; background: #fff; display: grid; gap: 10px; }
.dashboard-product-featured { border-color: #0ca5aa; background: linear-gradient(145deg, #effdfd, #fff); box-shadow: 0 10px 30px rgba(12,165,170,.1); }
.dashboard-product > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.dashboard-product-code { display: inline-flex; padding: 5px 10px; border-radius: 999px; background: #e8f7f7; color: #07858a; font-weight: 800; direction: ltr; }
.dashboard-product small, .dashboard-product p { color: var(--muted); }
.dashboard-product strong { font-size: 17px; direction: ltr; text-align: right; }
.dashboard-product p { margin: 0; min-height: 24px; }
.dashboard-product button { border: 0; border-radius: 10px; padding: 10px 12px; background: #f1f5f9; color: #17233b; font: inherit; font-weight: 700; cursor: pointer; }
.dashboard-product-featured button { background: #0ca5aa; color: white; }
.dashboard-products-loading { color: var(--muted); }
@media (max-width: 680px) { .dashboard-products-heading { align-items: flex-start; flex-direction: column; } }
.exam-heading h2 { margin: 7px 0; font-size: 30px; }
.muted { color: var(--muted); margin: 0; }
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.stats article { background: var(--paper); border: 1px solid var(--line); border-radius: 18px; padding: 20px 22px; display: flex; align-items: center; justify-content: space-between; }
.stats span { color: var(--muted); font-size: 13px; }
.stats strong { font-size: 27px; direction: ltr; }
.record-panel { display: grid; gap: 18px; }
.record-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.record-card { min-width: 0; padding: 21px; background: var(--paper); border: 1px solid var(--line); border-radius: 18px; }
.record-card-heading { display: flex; align-items: center; gap: 10px; padding-bottom: 15px; border-bottom: 1px solid var(--line); }
.record-card-heading span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; color: var(--blue); background: var(--blue-soft); font-size: 10px; font-weight: 800; direction: ltr; }
.record-card-heading h3 { margin: 0; font-size: 15px; }
.info-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; margin: 12px 0 0; max-height: 305px; overflow: auto; }
.info-row { min-width: 0; padding: 9px 0; border-bottom: 1px dashed var(--line); }
.info-row dt { color: var(--muted); font-size: 10px; }
.info-row dd { margin: 5px 0 0; direction: ltr; text-align: right; overflow-wrap: anywhere; font-size: 12px; font-weight: 700; }
.report-card.current { border-top: 3px solid #9aa7bc; }
.report-card.proposed { border-top: 3px solid var(--green); }
.report-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; padding-top: 14px; }
.report-metric { padding: 11px; border-radius: 11px; background: #f7f9fc; }
.report-metric span, .report-metric strong { display: block; }
.report-metric span { color: var(--muted); font-size: 10px; }
.report-metric strong { margin-top: 5px; direction: ltr; font-size: 16px; }
.report-empty { grid-column: 1 / -1; padding: 26px; text-align: center; color: var(--muted); }
.report-editor { padding: 22px; box-shadow: none; border-top: 3px solid var(--blue); }
.editor-heading { display: flex; justify-content: space-between; align-items: end; gap: 24px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.editor-heading h3 { margin: 6px 0; font-size: 19px; }
.editor-heading p:last-child { margin: 0; color: var(--muted); font-size: 11px; }
.editor-heading label { display: grid; gap: 7px; min-width: 240px; color: var(--muted); font-size: 10px; font-weight: 800; }
.editor-form { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; padding: 19px 0; }
.editor-form label { display: grid; gap: 7px; color: var(--muted); font-size: 10px; font-weight: 800; }
.editor-form input, .editor-form textarea { width: 100%; border: 1px solid var(--line); border-radius: 11px; outline: 0; background: #fbfcfe; color: var(--ink); padding: 11px; font-size: 12px; font-weight: 400; }
.editor-form input { min-height: 44px; direction: ltr; text-align: left; }
.editor-form textarea { resize: vertical; line-height: 1.8; }
.editor-form input:focus, .editor-form textarea:focus { border-color: #9bb7ee; box-shadow: 0 0 0 4px var(--blue-soft); }
.editor-wide { grid-column: 1 / -1; }
.editor-actions { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-top: 16px; border-top: 1px solid var(--line); }
.editor-actions > div { display: flex; gap: 8px; }
.editor-status { color: var(--muted); font-size: 11px; }
.editor-status.success { color: var(--green); }
.editor-status.error { color: #a23c3c; }
.save-report-button { min-height: 48px; border: 0; border-radius: 13px; padding: 0 20px; color: white; background: var(--blue); font-weight: 800; }
.save-report-button:hover { background: #2459bf; }
.report-difference { padding: 22px; box-shadow: none; }
.difference-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 16px; }
.difference-heading h3 { margin: 6px 0 0; font-size: 18px; }
.difference-count { padding: 8px 11px; border-radius: 9px; color: #a23c3c; background: #ffeded; font-size: 11px; font-weight: 800; }
.difference-table { min-width: 620px; }
.difference-table td { direction: ltr; text-align: right; }
.difference-table td:first-child { direction: rtl; }
.change-state { display: inline-block; padding: 6px 8px; border-radius: 8px; font-size: 10px; font-weight: 800; }
.change-state.changed { color: #a23c3c; background: #ffeded; }
.change-state.same { color: #176b51; background: var(--green-soft); }
.raw-reports { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.raw-reports details { min-width: 0; border: 1px solid var(--line); border-radius: 12px; background: #fbfcfe; }
.raw-reports summary { cursor: pointer; padding: 13px; color: var(--blue); font-size: 11px; font-weight: 800; }
.raw-reports pre { max-height: 440px; overflow: auto; margin: 0; padding: 15px; border-top: 1px solid var(--line); direction: ltr; text-align: left; font: 11px/1.7 Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; }
.tabs { display: flex; flex-wrap: wrap; gap: 9px; }
.tab { border: 1px solid var(--line); background: var(--paper); color: var(--muted); border-radius: 999px; padding: 10px 17px; font-weight: 700; }
.tab.active { background: var(--navy); border-color: var(--navy); color: white; }
.tab-count { display: inline-grid; place-items: center; min-width: 22px; height: 22px; margin-right: 7px; padding: 0 5px; border-radius: 999px; background: rgba(255,255,255,.13); font-size: 11px; direction: ltr; }

.workspace { padding: 26px; }
.workspace-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 22px; padding-bottom: 22px; border-bottom: 1px solid var(--line); }
.workspace-toolbar h3 { margin: 6px 0 0; font-size: 24px; }
.search { width: min(360px, 100%); display: flex; align-items: center; gap: 8px; padding: 0 13px; }
.search span { color: var(--muted); font-size: 21px; }
.search input { border: 0; outline: 0; background: transparent; width: 100%; color: var(--ink); }
.categories { display: flex; flex-wrap: wrap; gap: 9px; padding: 18px 0 4px; }
.category { padding: 8px 11px; border: 1px solid #dbe5f8; background: #f5f8ff; color: #4c628a; border-radius: 10px; font-size: 11px; }

.part { margin-top: 24px; }
.part-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 11px; }
.part-heading h4 { margin: 0; font-size: 15px; }
.part-heading span { color: var(--muted); font-size: 12px; direction: ltr; }
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 16px; }
table { width: 100%; border-collapse: collapse; min-width: 660px; }
th, td { padding: 14px 16px; text-align: right; border-bottom: 1px solid var(--line); vertical-align: top; }
th { background: #f8f9fb; color: var(--muted); font-size: 11px; font-weight: 800; }
tr:last-child td { border-bottom: 0; }
tbody tr:hover { background: #fbfcff; }
.question-number { display: inline-grid; place-items: center; min-width: 34px; height: 34px; padding: 0 7px; border-radius: 10px; background: var(--navy); color: white; direction: ltr; font-weight: 800; }
.answer-pills { display: flex; flex-wrap: wrap; gap: 7px; direction: ltr; justify-content: flex-end; }
.answer-pill { padding: 7px 10px; border-radius: 9px; color: #176b51; background: var(--green-soft); border: 1px solid #c7ebdc; font-size: 12px; cursor: copy; }
.answer-pill:hover { transform: translateY(-1px); box-shadow: 0 5px 14px rgba(23, 35, 59, .08); }
.answer-pill.primary { color: #174d9e; background: var(--blue-soft); border-color: #d5e2ff; }
.type-pill { display: inline-block; color: var(--amber); background: #fff6e8; border: 1px solid #f6dfba; padding: 6px 8px; border-radius: 8px; font-size: 10px; direction: ltr; }
.candidate-answer { display: inline-block; max-width: 330px; direction: ltr; text-align: left; color: var(--ink); background: #f3f5f8; border: 1px solid var(--line); border-radius: 9px; padding: 8px 10px; overflow-wrap: anywhere; }
.candidate-answer.empty { direction: rtl; color: var(--muted); font-style: italic; }
.result-pill { display: inline-flex; align-items: center; gap: 5px; padding: 7px 9px; border-radius: 9px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.result-pill.correct { color: #176b51; background: var(--green-soft); }
.result-pill.incorrect { color: #a23c3c; background: #ffeded; }
.result-pill.unanswered { color: #7d6470; background: #f5edf1; }
.row-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.accept-button, .custom-answer-button { border: 0; border-radius: 8px; padding: 7px 9px; font-size: 10px; font-weight: 800; white-space: nowrap; }
.accept-button { color: white; background: var(--green); }
.custom-answer-button { color: var(--blue); background: var(--blue-soft); }
.manual-panel { margin-top: 22px; border: 1px dashed #cad3e2; border-radius: 16px; padding: 28px; text-align: center; color: var(--muted); }
.manual-panel strong { display: block; color: var(--ink); margin-bottom: 8px; }
.manual-panel > p { margin: 0; }
.manual-task { margin-top: 18px; padding: 16px; border-radius: 13px; background: #f8f9fb; text-align: right; }
.manual-task h4 { margin: 0 0 10px; color: var(--ink); }
.manual-task p { display: inline-block; margin: 4px 0 4px 18px; font-size: 12px; }
.manual-task p span { color: var(--muted); }
.manual-task p b { color: var(--ink); font-weight: 700; }
.empty-state, .error-state { padding: 52px 24px; text-align: center; }
.empty-icon { margin: 0 auto 16px; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; background: var(--green-soft); color: var(--green); font-size: 28px; }
.empty-state h2 { margin: 0 0 9px; }
.empty-state p, .error-state { color: var(--muted); }
.no-results { padding: 42px; text-align: center; color: var(--muted); }
.toast { position: fixed; bottom: 24px; left: 24px; padding: 11px 16px; border-radius: 11px; color: white; background: var(--navy); box-shadow: var(--shadow); font-size: 12px; z-index: 10; }
button:disabled, input:disabled { cursor: not-allowed; opacity: .58; }
.topbar-user { display: flex; align-items: center; gap: 10px; font-size: 12px; }
.role-pill { padding: 6px 9px; border-radius: 999px; color: #176b51; background: var(--green-soft); font-weight: 800; }
.link-button { border: 0; background: transparent; color: var(--muted); font: inherit; }
.management { margin: -34px 10px 22px; padding: 24px; position: relative; }
.management-heading h2, .management-form h3 { margin: 4px 0 8px; }
.management-heading p { margin: 0; color: var(--muted); }
.management-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 20px; }
.role-management { grid-column: 1 / -1; }
.role-management > p { color: var(--muted); font-size: 11px; margin-top: 0; }
.management-form { padding: 20px; background: #f8f9fb; border: 1px solid var(--line); border-radius: 16px; }
.management-form > label, .management-form .form-grid label { display: grid; gap: 7px; margin-bottom: 12px; color: var(--muted); font-size: 12px; font-weight: 700; }
.management-form input, .management-form select { width: 100%; border: 1px solid var(--line); background: white; border-radius: 11px; padding: 11px 12px; color: var(--ink); }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.form-status { min-height: 20px; color: var(--green); direction: rtl; overflow-wrap: anywhere; }

.login-page { min-height: 100vh; background: #eef2f8; }
.login-layout { min-height: 100vh; display: grid; grid-template-columns: 1.2fr .8fr; }
.login-intro { padding: clamp(42px, 8vw, 110px); color: white; background: radial-gradient(circle at 20% 20%, #304b78, transparent 38%), linear-gradient(145deg, #101b31, #1e3154); display: flex; flex-direction: column; justify-content: center; }
.login-brand { color: white; margin-bottom: 72px; }
.login-intro h1 { font-size: clamp(38px, 5vw, 66px); line-height: 1.25; margin: 14px 0; }
.login-intro > p { color: #c7d2e8; max-width: 600px; }
.login-features { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.login-features span { border: 1px solid #ffffff2b; background: #ffffff0d; border-radius: 999px; padding: 9px 13px; font-size: 12px; }
.login-card { align-self: center; margin: clamp(24px, 6vw, 80px); padding: clamp(28px, 5vw, 54px); background: white; border-radius: 24px; box-shadow: var(--shadow); }
.login-card h2 { font-size: 32px; margin: 5px 0; }
.login-card > div > p:last-child, .login-help { color: var(--muted); }
.login-card form { display: grid; gap: 17px; margin: 34px 0 22px; }
.login-card label { display: grid; gap: 8px; color: var(--muted); font-size: 12px; font-weight: 800; }
.login-card input { border: 1px solid var(--line); border-radius: 12px; padding: 14px; font-size: 15px; outline: none; }
.login-card input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-soft); }
.form-error { color: #a23c3c; background: #ffeded; padding: 10px 12px; border-radius: 10px; margin: 0; }

@media (max-width: 820px) {
  .login-layout { grid-template-columns: 1fr; }
  .login-intro { min-height: 36vh; padding: 38px 28px; }
  .login-brand { margin-bottom: 26px; }
  .login-card { margin: -28px 18px 28px; position: relative; }
  .management-grid { grid-template-columns: 1fr; }
  .shell { width: min(100% - 20px, 1240px); display: block; padding-bottom: 70px; }
  .sidebar { position: fixed; inset: auto 10px 10px; width: auto; height: 62px; margin: 0; padding: 7px; border-radius: 17px; display: block; }
  .sidebar-brand, .sidebar-footer { display: none; }
  .sidebar-nav { margin: 0; height: 100%; grid-template-columns: repeat(5, 1fr); gap: 3px; }
  .sidebar-nav a { justify-content: center; padding: 8px; font-size: 0; }
  .sidebar-nav a span { font-size: 20px; }
  .hero { padding: 34px 26px 54px; }
  .hero-art { display: none; }
  .controls { margin-inline: 10px; grid-template-columns: 1fr 1fr; }
  .controls label:first-child { grid-column: 1 / -1; }
  .eid-lookup { grid-template-columns: 1fr; }
  .local-import-heading { align-items: flex-start; flex-direction: column; }
  .local-import-controls { grid-template-columns: 1fr 1fr; }
  .local-import-controls label { grid-column: 1 / -1; }
  .stats { grid-template-columns: 1fr 1fr; }
  .record-grid, .raw-reports { grid-template-columns: 1fr; }
  .editor-heading, .editor-actions { align-items: stretch; flex-direction: column; }
  .editor-heading label { min-width: 0; }
  .editor-form { grid-template-columns: 1fr 1fr; }
  .exam-heading, .workspace-toolbar { align-items: stretch; flex-direction: column; }
  .search { width: 100%; }
}

@media (max-width: 520px) {
  .topbar { height: 72px; }
  .status { display: none; }
  .hero { border-radius: 20px; }
  .hero h1 { font-size: 34px; }
  .controls { grid-template-columns: 1fr; padding: 17px; }
  .controls label:first-child { grid-column: auto; }
  .stats { grid-template-columns: 1fr; }
  .local-import-controls { grid-template-columns: 1fr; }
  .local-import-controls label { grid-column: auto; }
  .info-list, .report-summary { grid-template-columns: 1fr; }
  .editor-form { grid-template-columns: 1fr; }
  .workspace { padding: 18px; }
}
/* Login shell aligned with the IELTS Daily client panel */
.cp-login-layout{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#fff;direction:ltr;overflow:hidden}
.cp-login-visual{position:relative;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#02a6ad,#087f88);color:#fff}
.orbit{position:absolute;width:900px;height:900px;border:1px solid rgba(255,255,255,.28);border-radius:50%;animation:login-orbit 18s linear infinite}
.orbit:after{content:"";position:absolute;inset:80px;border:2px dashed rgba(255,255,255,.16);border-radius:50%}.orbit-two{width:680px;height:680px;animation-duration:26s;animation-direction:reverse}.orbit-three{width:480px;height:480px;animation-duration:12s}
@keyframes login-orbit{to{transform:rotate(360deg)}}
.visual-copy{position:relative;z-index:2;width:min(78%,520px);direction:rtl;text-align:right}.visual-badge{display:inline-block;padding:7px 12px;border:1px solid rgba(255,255,255,.45);border-radius:999px;font-size:11px;letter-spacing:1.8px}.visual-copy h1{margin:25px 0 12px;font-size:clamp(32px,4vw,54px);line-height:1.45}.visual-copy>p{color:rgba(255,255,255,.8);font-size:16px}
.visual-illustration{width:260px;margin:52px auto 0;padding:28px;display:grid;text-align:center;border:1px solid rgba(255,255,255,.48);border-radius:26px;background:rgba(255,255,255,.16);box-shadow:0 24px 60px rgba(0,69,75,.28);backdrop-filter:blur(8px)}.visual-illustration span{width:58px;height:58px;margin:0 auto 14px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#079da5;font-size:30px}.visual-illustration strong{font-size:20px}.visual-illustration small{margin-top:6px;color:rgba(255,255,255,.78)}
.cp-login-form-side{display:grid;place-items:center;padding:42px;direction:rtl}.cp-auth-card{width:min(100%,470px);padding:36px;border:1px solid #e2e8f0;border-radius:18px;background:#fff;box-shadow:0 18px 60px rgba(15,23,42,.08)}
.cp-brand{display:flex;align-items:center;gap:11px;margin-bottom:42px}.cp-brand>span:last-child{display:grid}.cp-brand strong{font-size:17px;color:#17233b}.cp-brand small{font-size:11px;color:#84909f}.cp-logo{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#079da5;color:#fff;font-weight:800;letter-spacing:-1px}
.cp-auth-heading h2{margin:6px 0 10px;font-size:25px;color:#17233b}.cp-auth-heading>p:last-child{margin:0 0 24px;color:#778396;line-height:1.9;font-size:13px}.sso-button{width:100%;min-height:50px;display:flex;align-items:center;justify-content:center;gap:10px;border-radius:12px;background:#079da5}.sso-button:hover{background:#078b93}.button-icon{font-size:23px}.sso-trust{display:flex;justify-content:center;gap:14px;margin-top:18px;color:#8b95a4;font-size:11px}.sso-trust span+span:before{content:'•';margin-left:14px;color:#079da5}.cp-auth-card .login-help{display:block;margin-top:28px;text-align:center;color:#9aa3b0}
@media(max-width:850px){.cp-login-layout{grid-template-columns:1fr}.cp-login-visual{display:none}.cp-login-form-side{min-height:100vh;padding:22px;background:linear-gradient(160deg,#f0fbfb,#fff 45%)}.cp-auth-card{padding:28px 22px}.cp-brand{margin-bottom:32px}}

/* Exact client-panel login composition */
.client-auth-page{margin:0;background:#fff;color:#30343b}.client-auth-layout{height:100vh;display:flex;direction:ltr;background:#fff;overflow:hidden}.client-auth-art,.client-auth-content{width:50%;height:100%;position:relative;z-index:1;display:flex;align-items:center;justify-content:center}.client-auth-art{overflow:hidden}.client-auth-art .circle-fill{width:100%;position:fixed;top:-50%;left:-50%;z-index:-1;animation:client-fill 30s infinite linear}.client-auth-art .circle-line{width:100%;position:fixed;top:-50%;left:-45%;z-index:-2;opacity:.3}.client-auth-art .circle-line1{animation:client-line 20s infinite alternate}.client-auth-art .circle-line2{animation:client-line 8s infinite alternate}.client-auth-art .circle-line3{left:-50%;animation:client-line-back 14s infinite alternate}.client-auth-art .circle-line4{left:-50%;animation:client-line-back 16s infinite alternate}.client-auth-art .circle-line5{left:-50%;animation:client-line 12s infinite alternate}.client-auth-art .circle-line6{left:-50%;animation:client-line-back 7s infinite alternate}.client-auth-art .circle-line7{left:-50%;animation:client-line-back 15s infinite alternate}.client-auth-art .circle-line8{left:-43%;animation:client-line-back 5s infinite alternate}@keyframes client-fill{to{transform:rotate(360deg)}}@keyframes client-line{to{transform:rotate(50deg)}}@keyframes client-line-back{to{transform:rotate(-40deg)}}
.client-auth-art .login-visual{display:flex;flex-direction:column;align-items:center;gap:18px}.client-auth-art .login-visual-image{max-width:min(78%,520px);height:auto;pointer-events:none;user-select:none}.client-auth-content{flex-direction:column;direction:rtl;gap:30px}.client-auth-card{width:50%;min-width:390px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:20px;border:1px solid #e5e7eb;border-radius:12px;box-sizing:border-box;background:#fff}.client-auth-logo{max-width:145px;height:auto;margin-bottom:10px}.client-auth-card .auth-signing{display:flex;width:100%;flex-direction:column;gap:14px}.auth-title{margin:0;font-size:22px;font-weight:700}.auth-description{margin:8px 0 0;color:#8791a2;font-size:14px;line-height:1.8}.client-blue-button{width:100%;min-height:42px;border:0;border-radius:8px;background:#079da5;color:#fff;font:inherit;font-size:14px;cursor:pointer}.client-blue-button:hover{background:#078f97}.client-blue-button:disabled{opacity:.65;cursor:wait}.client-auth-card .social-divider{display:flex;align-items:center;gap:12px;color:#8a94a6;font-size:12px}.client-auth-card .social-divider:before,.client-auth-card .social-divider:after{content:'';height:1px;flex:1;background:#e2e8f0}.terms-copy{margin:0;text-align:center;color:#8791a2;font-size:12px}.terms-copy span{color:#079da5}.client-start-card{width:66.666%;display:flex;direction:rtl;align-items:flex-start;gap:10px}.client-start-card>div:last-child{flex:1;padding:16px;border-radius:12px;background:#fff;box-shadow:0 4px 18px rgba(15,23,42,.1)}.client-start-card strong{font-size:18px}.client-start-card p{margin:8px 0 0;color:#8791a2;font-size:12px;line-height:1.8}.client-start-card .prof-shock{width:60px;height:60px;flex:0 0 60px;border-radius:50%;position:relative}.client-start-card .prof-shock img{width:100%;height:100%;object-fit:cover;border:2px solid #079da5;border-radius:50%}.start-arrow{margin-top:14px;color:#079da5;font-size:22px}
@media(max-width:800px){.client-auth-layout{display:block;height:auto;min-height:100vh}.client-auth-art{display:none}.client-auth-content{width:100%;min-height:100vh;padding:24px;box-sizing:border-box;background:#fff}.client-auth-card{width:min(100%,430px);min-width:0}.client-start-card{display:none}}

.client-auth-card{width:50%;min-width:480px;padding:34px 60px 28px;border-radius:16px}.client-auth-logo{display:block;width:178px;max-width:70%;margin:0 auto 8px}.client-auth-card .auth-title{text-align:right;font-size:28px}.client-auth-card .auth-description{text-align:right;font-size:14px}.client-float-field{position:relative;display:block;width:100%;margin-top:4px}.client-float-field input{width:100%;height:53px;padding:0 18px;border:1px solid #91a4bf;border-radius:5px;background:#fff;box-sizing:border-box;font:inherit;direction:rtl}.client-float-field span{position:absolute;right:18px;top:15px;color:#4f596b;background:#fff;transition:.18s}.client-float-field input:focus{outline:2px solid rgba(7,157,165,.16);border-color:#079da5}.client-float-field input:focus+span,.client-float-field input:not(:placeholder-shown)+span{top:-9px;padding:0 5px;font-size:11px;color:#079da5}.client-blue-button{height:53px;margin-top:14px;font-size:17px;font-weight:700}.client-auth-card .social-button{height:55px;border-radius:12px;font-size:17px}.client-auth-card .social-button svg{width:22px;height:22px}.client-auth-card .apple-button{position:relative}.client-auth-card .apple-button small{position:absolute;right:14px;padding:4px 9px;border-radius:12px;background:#edf0f4;color:#9aa3b0}.client-auth-card .support-toggle{height:60px;margin-top:6px;border-radius:14px;text-decoration:none;font-size:18px}.frontend-version{margin:0;text-align:center;color:#a0a8b5;font-size:11px}.client-auth-content{gap:30px}.client-start-card{margin-top:0}.client-auth-art .login-visual{width:100%}.client-auth-art .login-visual-image{width:92%;max-width:880px}.client-auth-art .app-download-link{min-width:350px;box-sizing:border-box;direction:rtl}.client-auth-art .app-download-link svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8}.client-auth-art .app-download-link span{display:flex;flex-direction:column}.client-auth-art .app-download-link small{font-size:11px;opacity:.85}
@media(max-width:1100px){.client-auth-card{min-width:420px;padding:28px 38px}.client-auth-art .login-visual-image{width:94%}}@media(max-width:800px){.client-auth-card{min-width:0;width:min(100%,480px);padding:28px 25px}.client-auth-card .auth-title{font-size:23px}}

.client-auth-page{font-family:EnglishNumbers,Dana,Yekan,YekanNum,sans-serif!important;background:#fff!important}.client-auth-art .app-download-link{min-width:350px;display:flex;align-items:center;justify-content:center;gap:12px;padding:10px 20px;border:1px solid rgba(255,255,255,.75);border-radius:14px;background:rgba(255,255,255,.14);box-shadow:0 8px 22px rgba(0,75,80,.18);color:#fff!important;text-decoration:none!important;transition:.2s}.client-auth-art .app-download-link:hover{background:#fff;color:#018f96!important;transform:translateY(-2px)}.client-auth-card .support-toggle{display:flex;align-items:center;justify-content:center;width:100%;padding:0 18px;border:1px solid #079da5;background:#079da5;color:#fff!important;box-shadow:0 4px 12px rgba(7,157,165,.18)}.client-auth-card .support-toggle:hover{background:#078f97;border-color:#078f97}.client-auth-card .social-button{display:flex!important;align-items:center!important;justify-content:center!important;gap:10px!important;width:100%!important;padding:0 14px!important;border:1px solid #d8dee9!important;background:#fff!important;color:#202124!important}.client-auth-card .apple-button{background:#f8fafc!important;color:#8b8f96!important}.client-start-card>div:last-child{box-shadow:0 10px 32px rgba(15,23,42,.09)!important}.client-auth-content{background:#fff!important}

@media(min-width:801px){.client-auth-art,.client-auth-content{width:50%}.client-auth-content{padding:5%;box-sizing:border-box}.client-auth-card{width:100%;max-width:480px;min-width:0;padding:30px 38px}.client-start-card{width:100%;max-width:520px}}
.client-auth-card .support-heading-icon{width:23px;height:23px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7;flex:0 0 auto}.client-auth-card .support-toggle{gap:9px;min-height:60px;border-radius:14px;font-weight:700}

.client-auth-art{z-index:2;overflow:visible;pointer-events:none}.client-auth-content{z-index:1}.client-auth-art .app-download-link{pointer-events:auto}

.modal-open{overflow:hidden!important}.support-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;direction:rtl}.support-modal.hidden{display:none!important}.support-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.52)}.support-dialog{position:relative;width:min(92vw,575px);overflow:hidden;border-radius:6px;background:#fff;box-shadow:0 22px 60px rgba(0,0,0,.28)}.support-dialog header{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 24px 0 20px;background:#079da5;color:#fff}.support-dialog header h2{margin:0;font-size:25px;font-weight:700}.support-dialog header button{width:42px;height:42px;border:0;background:transparent;color:#be3b3b;font-size:38px;font-weight:200;line-height:1}.support-dialog-body{padding:20px 22px 25px}.support-dialog-body>p{margin:0 0 20px;text-align:center;color:#8a94a6;font-size:13px}.support-groups{display:grid;grid-template-columns:1fr 1fr;border:1px solid #d7e0eb;border-radius:18px;overflow:hidden}.support-groups>section{padding:18px 16px}.support-groups>section+section{border-right:1px solid #d7e0eb}.support-groups h3{margin:0 0 20px;text-align:center;font-size:17px;font-weight:500;color:#30343b}.support-channels{display:flex;justify-content:center;gap:54px}.support-channels a{display:grid;justify-items:center;gap:7px;color:#7d8797!important;text-decoration:none!important}.support-channels small{font-size:12px}.bale-icon,.telegram-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;color:#fff;font-family:Arial,sans-serif;font-size:25px;font-weight:700}.bale-icon{background:#10cba0}.telegram-icon{background:#2fb4df;transform:none;padding-right:3px}@media(max-width:520px){.support-groups{grid-template-columns:1fr}.support-groups>section+section{border-right:0;border-top:1px solid #d7e0eb}.support-dialog header{height:72px}.support-dialog header h2{font-size:21px}}
.support-channels img{display:block;width:44px;height:44px;object-fit:contain}
.auth-back,.auth-resend{align-self:flex-start;border:0;background:transparent;color:#079da5;cursor:pointer;font:inherit;font-size:12px;padding:0}.auth-resend{align-self:center}.client-float-field input[type=password],.client-float-field input[inputmode=numeric]{direction:ltr;text-align:left}.google-button:disabled{opacity:.6;cursor:wait}

/* Management workspace — IELTS Daily design system */
@font-face{font-family:Dana;src:url('/assets/client-panel-runtime/media/DanaFaNum-Regular-FKZ7ELEB.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Dana;src:url('/assets/client-panel-runtime/media/DanaFaNum-Medium-6GFNX2ZE.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Dana;src:url('/assets/client-panel-runtime/media/DanaFaNum-Bold-KQWEDFAA.woff2') format('woff2');font-weight:800;font-display:swap}
:root{--ink:#172333;--muted:#738095;--line:#e6eaf0;--canvas:#f6f8fb;--navy:#172333;--blue:#079da5;--blue-soft:#e8f8f8;--green:#12a77c;--green-soft:#e8f8f2;--amber:#ed9b24;--shadow:0 8px 28px rgba(24,39,60,.055);font-family:Dana,Tahoma,sans-serif}
body:not(.login-page){background:var(--canvas);font-family:Dana,Tahoma,sans-serif}
.shell{width:100%;min-height:100vh;margin:0;grid-template-columns:264px minmax(0,1fr);column-gap:0}
.shell>.topbar,.shell>main{grid-column:2}.shell>main{width:min(100% - 64px,1400px);margin:0 auto 64px}
.sidebar{top:0;height:100vh;margin:0;padding:26px 18px 20px;border-radius:0;background:linear-gradient(180deg,#142536 0%,#11202f 100%);box-shadow:12px 0 38px rgba(16,31,47,.08)}
.sidebar-brand{gap:13px;padding:0 6px 24px;border-bottom:1px solid rgba(255,255,255,.09)}
.sidebar-logo-wrap{width:49px;height:49px;display:grid;place-items:center;overflow:hidden;border-radius:14px;background:#fff}.sidebar-logo-wrap img{width:43px;height:auto}.sidebar-brand strong{font-size:15px;color:#fff}.sidebar-brand small{margin-top:4px;color:#8395a8;direction:rtl;font-size:9px}
.sidebar-nav{gap:5px;margin-top:20px}.nav-label{margin:16px 12px 6px;color:#607488;font-size:9px;font-weight:600}.sidebar-nav a{min-height:46px;gap:12px;padding:11px 13px;border-radius:11px;color:#aab7c5;font-size:11px;font-weight:600;transition:.18s ease}.sidebar-nav a span{width:27px;height:27px;display:grid;place-items:center;border-radius:8px;background:rgba(255,255,255,.055);font-size:15px}.sidebar-nav a:hover{background:rgba(255,255,255,.06);transform:translateX(-2px)}.sidebar-nav a.active{color:#fff;background:linear-gradient(90deg,rgba(7,157,165,.28),rgba(7,157,165,.13));box-shadow:inset -3px 0 #16bdc5}.sidebar-nav a.active span{background:#079da5}
.sidebar-footer{padding:17px 5px 0;gap:13px}.sidebar-user{display:flex;align-items:center;gap:10px;min-width:0}.user-avatar,.profile-avatar{display:grid;place-items:center;border-radius:12px;background:#dff6f5;color:#087f86;font-weight:800}.user-avatar{width:38px;height:38px;flex:0 0 auto}.sidebar-user>div{min-width:0}.sidebar-user strong{display:block;overflow:hidden;color:#f7fafc;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.sidebar-user small{display:block;margin-top:3px;color:#6f8294;font-size:8px}.sidebar-logout{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;color:#e5a8a8;background:rgba(255,255,255,.04);font-size:10px}
.topbar{height:82px;padding:0 32px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.92);backdrop-filter:blur(14px);position:sticky;top:0;z-index:15}.page-heading{display:grid;gap:3px}.page-heading small{color:#94a0b0;font-size:9px}.page-heading strong{font-size:16px}.topbar-user{gap:16px}.online-state{display:flex;align-items:center;gap:7px;color:#708093;font-size:9px}.online-state i{width:7px;height:7px;border-radius:50%;background:#18b981;box-shadow:0 0 0 4px #e2f7ef}.topbar-profile{display:flex;align-items:center;gap:9px;padding-right:16px;border-right:1px solid var(--line)}.profile-avatar{width:35px;height:35px}.topbar-profile>div{display:grid;gap:3px}.topbar-profile #currentUser{max-width:180px;overflow:hidden;font-size:10px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.role-pill{width:max-content;padding:2px 7px;color:#07858c;background:#e6f7f7;font-size:8px}.link-button{padding:7px 10px;border-radius:8px;color:#9a5960;background:#fff3f3;font-size:9px}
.hero{min-height:174px;margin-top:28px;padding:32px 38px;border-radius:20px;background:linear-gradient(125deg,#123443,#087e84 62%,#079da5);box-shadow:0 16px 36px rgba(8,83,91,.14)}.hero:before{content:'';position:absolute;width:330px;height:330px;left:-90px;top:-210px;border:55px solid rgba(255,255,255,.06);border-radius:50%}.hero h1{margin:7px 0 8px;font-size:30px;letter-spacing:0}.hero-copy{max-width:700px;color:#d3e7e9;font-size:11px;line-height:1.9}.hero .eyebrow{color:#7ee2e5}.hero-art{width:190px;height:110px}.hero-art span{border-radius:16px}.hero-art span:nth-child(1){width:83px;height:65px;top:26px;font-size:13px}.hero-art span:nth-child(2){width:82px;height:82px;left:61px;font-size:34px}.hero-art span:nth-child(3){width:62px;height:53px;font-size:12px}
.card{border-color:var(--line);border-radius:16px;box-shadow:var(--shadow)}
.controls{margin:-15px 20px 22px;padding:18px;gap:11px;border-radius:15px}.controls label,.management-form>label,.management-form .form-grid label{font-size:10px;font-weight:600}select,.search,.eid-input,.local-import-controls input{min-height:45px;border-radius:10px;background:#fff}.primary-button,.ghost-button,.compare-button,.preview-button,.commit-button{min-height:45px;border-radius:10px;font-size:10px;font-weight:700}.primary-button{background:#079da5}.primary-button:hover{background:#078890}.ghost-button{color:#078890;background:#e8f8f8}
.management{margin:0 0 22px;padding:24px}.management-heading{padding-bottom:18px;border-bottom:1px solid var(--line)}.management-heading h2{font-size:20px}.management-heading p{font-size:10px}.management-grid{gap:14px;margin-top:18px}.management-form{padding:19px;border-radius:14px;background:#fafbfc}.management-form h3{font-size:14px}.management-form input,.management-form select{min-height:44px;border-radius:9px;background:#fff}.form-grid{gap:0 10px}.central-role-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.eid-lookup{margin-bottom:22px;padding:16px 18px;grid-template-columns:1.15fr 1.4fr auto}.eid-copy strong{font-size:11px}.eid-icon{color:#078890;background:#e8f8f8}.compare-button{background:#12a77c}.local-import{padding:20px;border-right-color:#079da5}.local-server-state{color:#087e84;background:#e8f8f8}.local-server-state i{background:#079da5}
.exam-heading h2{font-size:24px}.stats{gap:11px}.stats article{padding:17px 18px;border-radius:14px;box-shadow:var(--shadow)}.stats article:before{content:'';width:4px;height:34px;margin-left:12px;border-radius:99px;background:#079da5}.stats span{font-size:10px}.stats strong{margin-right:auto;font-size:23px}.record-card,.report-editor,.report-difference,.workspace{border-radius:15px}.workspace{padding:22px}.workspace-toolbar h3{font-size:20px}.tabs{gap:7px}.tab{padding:9px 14px;border-radius:9px;font-size:10px}.tab.active{background:#079da5;border-color:#079da5}.table-wrap{border-radius:12px}th{background:#f7f9fb}th,td{padding:12px 14px}.question-number{background:#173247}.answer-pill.primary{color:#087f86;background:#e8f8f8;border-color:#c8ecec}.empty-state{margin-top:0;padding:42px}.empty-icon{color:#078f96;background:#e8f8f8}.toast{background:#173247}
button,input,select,textarea,a{transition:border-color .18s,box-shadow .18s,background-color .18s,transform .18s}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(7,157,165,.22);outline-offset:2px}
@media(max-width:1050px){.shell{grid-template-columns:218px minmax(0,1fr)}.shell>main{width:min(100% - 36px,1400px)}.sidebar{padding-inline:12px}.hero-art{display:none}.management-grid{grid-template-columns:1fr}.role-management{grid-column:auto}.eid-lookup{grid-template-columns:1fr 1fr}.eid-copy{grid-column:1/-1}.local-import-controls{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.shell{display:block;padding-bottom:76px}.shell>.topbar,.shell>main{width:100%;margin-inline:0}.shell>main{padding:0 14px}.sidebar{position:fixed;inset:auto 10px 10px;height:64px;width:auto;margin:0;padding:7px;border-radius:16px;z-index:50;box-shadow:0 12px 35px rgba(12,31,47,.3)}.sidebar-brand,.sidebar-footer,.nav-label{display:none}.sidebar-nav{height:100%;margin:0;display:flex;align-items:center;justify-content:space-around}.sidebar-nav a{width:50px;height:50px;min-height:0;padding:0;justify-content:center;font-size:0}.sidebar-nav a span{font-size:16px}.sidebar-nav a:hover{transform:none}.topbar{height:68px;padding:0 15px}.page-heading small,.online-state,.link-button{display:none}.topbar-user{gap:8px}.topbar-profile{border:0;padding:0}.hero{min-height:160px;margin-top:16px;padding:25px 22px}.hero h1{font-size:24px}.hero-copy{font-size:10px}.controls{margin:-10px 8px 18px;grid-template-columns:1fr 1fr}.controls label:first-child{grid-column:1/-1}.controls button{grid-column:1/-1}.eid-lookup{grid-template-columns:1fr}.eid-copy{grid-column:auto}.management{padding:17px}.form-grid,.stats,.record-grid,.raw-reports{grid-template-columns:1fr}.local-import-controls{grid-template-columns:1fr}.local-import-controls label{grid-column:auto}.editor-form{grid-template-columns:1fr}.topbar-profile #currentUser{max-width:120px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.page-hidden{display:none!important}.dashboard-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0}.dashboard-actions>a{min-width:0;display:flex;align-items:center;gap:13px;padding:18px;border:1px solid var(--line);border-radius:15px;background:#fff;color:var(--ink);box-shadow:var(--shadow);text-decoration:none}.dashboard-actions>a:hover{border-color:#b8dfe1;box-shadow:0 12px 30px rgba(24,39,60,.09);transform:translateY(-2px)}.dashboard-actions .action-icon{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:12px;color:#087f86;background:#e8f8f8;font-size:20px;font-weight:700}.dashboard-actions div{min-width:0}.dashboard-actions strong,.dashboard-actions small{display:block}.dashboard-actions strong{font-size:11px}.dashboard-actions small{margin-top:5px;color:var(--muted);font-size:9px;line-height:1.6}.dashboard-actions b{margin-right:auto;color:#9badb6;font-size:18px}.dashboard-guide{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:24px}.dashboard-guide h2{margin:6px 0 0;font-size:17px}.dashboard-guide ol{display:flex;flex:1;justify-content:flex-end;gap:10px;margin:0;padding:0;list-style:none}.dashboard-guide li{min-width:0;display:flex;align-items:center;gap:9px;padding:12px 14px;border-radius:12px;background:#f7f9fb}.dashboard-guide li>span{width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;border-radius:9px;color:#087f86;background:#ddf3f3;font-size:10px;font-weight:800}.dashboard-guide li strong,.dashboard-guide li small{display:block}.dashboard-guide li strong{font-size:9px}.dashboard-guide li small{margin-top:3px;color:var(--muted);font-size:8px;line-height:1.5}
@media(max-width:1050px){.dashboard-actions{grid-template-columns:1fr}.dashboard-guide{align-items:flex-start;flex-direction:column}.dashboard-guide ol{width:100%;display:grid;grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.dashboard-guide ol{grid-template-columns:1fr}.dashboard-actions{gap:9px}.dashboard-actions>a{padding:14px}}
.users-page{margin-top:28px;overflow:hidden}.page-section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 26px;border-bottom:1px solid var(--line)}.page-section-heading h2{margin:5px 0;font-size:21px}.page-section-heading p:last-child{margin:0;color:var(--muted);font-size:10px}.users-toolbar{display:flex;align-items:end;justify-content:space-between;gap:16px;padding:18px 26px;background:#fafbfc}.users-search{width:min(520px,100%);min-height:45px;display:flex;align-items:center;gap:9px;padding:0 13px;border:1px solid var(--line);border-radius:10px;background:#fff}.users-search:focus-within{border-color:#86cdd1;box-shadow:0 0 0 4px #e8f8f8}.users-search span{color:#93a0af;font-size:20px}.users-search input{width:100%;border:0;outline:0;background:transparent;font:inherit;font-size:10px}.page-size-label{display:grid;grid-template-columns:auto 82px;align-items:center;gap:9px;color:var(--muted);font-size:9px}.page-size-label select{min-height:40px}.users-table-wrap{margin:0 26px;border-radius:11px}.users-table{min-width:760px}.users-table th{padding:12px 15px}.users-table td{padding:13px 15px;font-size:10px;vertical-align:middle}.user-identity{display:flex;align-items:center;gap:10px}.user-identity>span{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;color:#087f86;background:#e8f8f8;font-weight:800}.user-identity strong,.user-identity small{display:block}.user-identity strong{font-size:10px}.user-identity small{margin-top:3px;color:var(--muted);font-size:8px}.user-role{display:inline-flex;padding:5px 9px;border-radius:99px;font-size:8px;font-weight:700}.user-role-candidate{color:#526477;background:#edf1f5}.user-role-examiner{color:#087f86;background:#e8f8f8}.user-role-manager{color:#976319;background:#fff4dd}.user-role-super_admin{color:#7042a0;background:#f3eaff}.user-edit-button{min-height:32px;padding:0 12px;border:1px solid #cce6e7;border-radius:8px;color:#087f86;background:#f5fbfb;font:inherit;font-size:9px;font-weight:600}.user-edit-button:hover{background:#e8f8f8}.users-empty{padding:42px!important;text-align:center;color:var(--muted)}.users-loading{margin:12px 26px;padding:9px;border-radius:8px;color:#087f86;background:#e8f8f8;text-align:center;font-size:9px}.users-pagination{display:flex;align-items:center;justify-content:space-between;padding:18px 26px;color:var(--muted);font-size:9px}.users-pagination>div{display:flex;align-items:center;gap:10px}.users-pagination button{min-height:34px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:#fff;font:inherit;font-size:9px}.exam-assignment-form{max-width:760px;margin:20px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:12px}.exam-assignment-form>label:nth-child(3),.exam-assignment-form .form-status{grid-column:1/-1}.admin-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:18px}.admin-modal-backdrop{position:absolute;inset:0;background:rgba(12,26,40,.58);backdrop-filter:blur(3px)}.admin-dialog{position:relative;width:min(94vw,650px);overflow:hidden;border-radius:17px;background:#fff;box-shadow:0 28px 80px rgba(9,25,40,.28)}.admin-dialog>header{display:flex;align-items:center;justify-content:space-between;padding:21px 24px;border-bottom:1px solid var(--line)}.admin-dialog h2{margin:4px 0 0;font-size:19px}.admin-dialog>header>button{width:36px;height:36px;border:0;border-radius:9px;color:#8d5960;background:#fff1f2;font-size:25px}.user-dialog-form{padding:22px 24px}.user-dialog-form label{display:grid;gap:7px;margin-bottom:12px;color:var(--muted);font-size:10px;font-weight:600}.user-dialog-form input,.user-dialog-form select{width:100%;min-height:44px;padding:0 12px;border:1px solid var(--line);border-radius:9px;background:#fff;outline:0}.user-dialog-form input:focus,.user-dialog-form select:focus{border-color:#86cdd1;box-shadow:0 0 0 4px #e8f8f8}.user-dialog-form footer{display:flex;justify-content:flex-end;gap:9px;padding-top:16px;border-top:1px solid var(--line)}.modal-cancel{min-height:45px;padding:0 18px;border:1px solid var(--line);border-radius:10px;background:#fff;font:inherit;font-size:10px}.form-status{min-height:18px;color:#9a5960;font-size:9px}
@media(max-width:760px){.users-page{margin-top:16px}.page-section-heading,.users-toolbar,.users-pagination{align-items:stretch;flex-direction:column;padding:17px}.users-table-wrap{margin:0 17px}.page-size-label{grid-template-columns:1fr}.admin-dialog{max-height:94vh;overflow:auto}.user-dialog-form .form-grid,.exam-assignment-form{grid-template-columns:1fr}.exam-assignment-form>label:nth-child(3){grid-column:auto}}