/* DESIGN B: task-first, editorial "paper and ink". Everything here is scoped to html[data-ui="b"].
   Thaana: MV Waheed headings, Faruma body (same rule as Design A). English: Newsreader headings, Inter body. */
html[data-ui="b"] {
  --paper: #f6f3ec; --paper-2: #ece6da; --ink: #15110d; --ink-2: #3b332b; --muted: #6f655b; --line: #ddd5c7;
  --brand: #7b3f00; --copper: #b8692a; --gold: #e0a84f; --sand: #f6f3ec; --sand-2: #ece6da;
  --radius: 4px; --shadow: none; --shadow-lg: 0 24px 80px rgba(21, 17, 13, .25);
  --serif: "Newsreader", "MV Waheed", Georgia, serif;
  --font: "Faruma", "Inter", "Faruma", system-ui, sans-serif;
  --display: "MV Waheed", "Faruma", sans-serif;
}
html[data-ui="b"][lang="en"] { --font: "Inter", "Faruma", system-ui, sans-serif; --display: "Newsreader", "MV Waheed", Georgia, serif; }
html[data-ui="b"] body { background: var(--paper); color: var(--ink); }
html[data-ui="b"][lang="en"] :is(h1, h2, h3) { font-family: var(--display); font-weight: 500; letter-spacing: -.015em; }
html[data-ui="b"] a { color: var(--ink); }
html[data-ui="b"] a:hover { color: var(--brand); }
html[data-ui="b"] .wrap { max-width: 1280px; }

/* scam strip */
.b-scam { background: #241508; color: #eadcc6; font-size: 13px; border-bottom: 2px solid var(--gold); }
.b-scam .wrap { display: flex; gap: 12px; align-items: center; padding-block: 8px; }
.b-scam-tag { display: inline-flex; align-items: center; gap: 6px; flex: none; background: var(--gold); color: #241508; font: 700 11px/1 "Inter", "Faruma", sans-serif; letter-spacing: .06em; text-transform: uppercase; padding: 5px 9px; border-radius: 2px; }
html[lang="dv"] .b-scam-tag { font: 400 13px/1.2 "MV Waheed", "Faruma", sans-serif; letter-spacing: 0; padding: 4px 10px; }
.b-scam p { flex: 1; margin: 0; line-height: 1.6; }
.b-scam p a { color: var(--gold) !important; font-weight: 600; white-space: nowrap; border-bottom: 1px solid rgba(224, 168, 79, .5); margin-inline-start: 6px; }
.b-scam p a:hover { border-bottom-color: var(--gold); }
.b-scam button { flex: none; width: 28px; height: 28px; display: grid; place-items: center; background: rgba(255, 255, 255, .08); border: 0; border-radius: 50%; color: #eadcc6; cursor: pointer; }
.b-scam button:hover { background: rgba(255, 255, 255, .18); }

/* header */
.b-head { position: sticky; top: 0; z-index: 40; background: rgba(246, 243, 236, .92); backdrop-filter: blur(14px); border-bottom: 1px solid var(--ink); }
.b-bar { display: flex; align-items: center; gap: 28px; min-height: 76px; }
.b-brand { display: flex; align-items: center; gap: 12px; color: var(--ink) !important; }
.b-brand img { width: 40px; height: 40px; }
.b-brand b { display: block; font-family: var(--display); font-weight: 400; font-size: 21px; line-height: 1.3; }
html[lang="en"] .b-brand b { font-weight: 600; font-size: 19px; }
.b-brand small { display: block; font-size: 11px; color: var(--muted); letter-spacing: .08em; text-transform: uppercase; }
.b-nav { display: flex; gap: 2px; flex: 1; justify-content: center; white-space: nowrap; }
.b-nav a { padding: 8px 12px; font-size: 14px; border-radius: 999px; color: var(--ink-2) !important; }
.b-nav a:hover { background: var(--paper-2); }
.b-nav a.on { background: var(--ink); color: var(--paper) !important; }
.b-tools { display: flex; align-items: center; gap: 8px; }
.b-search { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 6px 8px 6px 14px; cursor: pointer; color: var(--muted); font-size: 14px; min-width: 190px; }
html[dir="rtl"] .b-search { padding: 6px 14px 6px 8px; }
.b-search span { flex: 1; text-align: start; }
.b-search:hover { border-color: var(--ink); }
kbd { font: 600 11px "Inter", "Faruma", sans-serif; background: var(--paper-2); border: 1px solid var(--line); border-radius: 6px; padding: 1px 6px; color: var(--muted); direction: ltr; }
.b-icon { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line); background: #fff; display: grid; place-items: center; cursor: pointer; font: 700 12px "Inter", "Faruma", sans-serif; color: var(--ink) !important; }
.b-icon:hover { border-color: var(--ink); }
.b-me { background: var(--brand); color: #fff !important; border-color: var(--brand); }
.b-menu { display: none; }
.b-sheet { display: none; border-top: 1px solid var(--line); background: var(--paper); max-height: 70vh; overflow: auto; }
.b-sheet.open { display: block; }
.b-sheet .wrap { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 18px; padding-block: 20px; }
.b-sheet a { display: block; font-size: 14px; padding: 3px 0; color: var(--ink-2) !important; }
.b-sheet a.h { font-weight: 700; color: var(--ink) !important; border-bottom: 1px solid var(--line); margin-bottom: 4px; }

/* home: hero */
.b-hero { border-bottom: 1px solid var(--ink); }
.b-hero-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 56px; padding-block: 64px 56px; align-items: start; }
.b-eyebrow { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--brand); font-weight: 700; }
html[lang="dv"] .b-eyebrow { letter-spacing: 0; font-size: 14px; }
.b-eyebrow.light { color: var(--gold); }
.b-h1 { font-size: clamp(38px, 5.2vw, 68px); line-height: 1.05; margin: 14px 0 18px; max-width: 17ch; }
html[lang="dv"] .b-h1 { line-height: 1.55; max-width: none; font-size: clamp(32px, 4.4vw, 54px); }
.b-lead { font-size: 18px; color: var(--ink-2); max-width: 560px; margin: 0 0 40px; }
.b-tasks-t { font-size: 15px !important; font-family: var(--font) !important; font-weight: 700 !important; letter-spacing: 0 !important; margin-bottom: 6px; color: var(--muted); }
.b-tasks { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--ink); }
.b-tasks a { display: grid; grid-template-columns: 40px 34px 1fr 30px; gap: 12px; align-items: center; padding: 16px 4px; border-bottom: 1px solid var(--line); transition: padding .2s, background .2s; }
.b-tasks a:hover { background: #fff; padding-inline: 14px; color: var(--ink); }
.b-n { font: 500 13px "Inter", "Faruma", sans-serif; color: var(--muted); }
.b-ti { color: var(--brand); }
.b-tt b { display: block; font-size: 19px; font-weight: 600; }
html[lang="dv"] .b-tt b { font-family: var(--display); font-weight: 400; font-size: 20px; }
html[lang="en"] .b-tt b { font-family: var(--serif); font-weight: 500; font-size: 22px; }
.b-tt small { color: var(--muted); font-size: 13px; }
.b-go { color: var(--brand); }

/* eligibility check */
.b-check { background: #fff; border: 1px solid var(--ink); padding: 28px; position: sticky; top: 100px; box-shadow: 10px 10px 0 var(--paper-2); }
html[dir="rtl"] .b-check { box-shadow: -10px 10px 0 var(--paper-2); }
.b-check-head h3 { font-size: 30px; margin: 6px 0 12px; }
.b-dots { display: flex; gap: 6px; margin-bottom: 20px; }
.b-dots i { flex: 1; height: 4px; background: var(--paper-2); }
.b-dots i.on { background: var(--brand); }
.b-q { font-size: 19px; margin: 0 0 18px; }
.b-opts { display: flex; gap: 10px; flex-wrap: wrap; }
.b-opts button, .b-opts input { flex: 1; min-width: 120px; border: 1px solid var(--ink); background: #fff; padding: 12px 16px; font-size: 16px; cursor: pointer; border-radius: 0; }
.b-opts button:hover, .b-opts button.primary { background: var(--ink); color: var(--paper); }
.b-result { padding: 18px; border-inline-start: 4px solid var(--green); background: #f1f8f3; margin-bottom: 14px; }
.b-result.warn { border-color: var(--amber); background: #fdf6e9; }
.b-result.bad { border-color: var(--red); background: #fdf0ef; }
.b-result b { font-size: 20px; display: block; }
.b-result p { margin: 6px 0 14px; color: var(--ink-2); }
.b-again { background: none; border: 0; color: var(--muted); text-decoration: underline; cursor: pointer; padding: 0; }

/* hearing board */
.b-board { background: var(--ink); color: #f2e6d4; padding: 56px 0; }
.b-board-head { display: flex; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: 24px; flex-wrap: wrap; }
.b-board h2 { font-size: 40px; color: #fff; }
.b-clock { font: 500 14px "Inter", "Faruma", sans-serif; color: var(--gold); display: flex; align-items: center; gap: 8px; }
.b-clock .dot { width: 8px; height: 8px; border-radius: 50%; background: #3ddc84; box-shadow: 0 0 0 4px rgba(61, 220, 132, .2); animation: pulse 1.6s infinite; }
@keyframes pulse { 50% { opacity: .35; } }
.b-board-rows { border-top: 1px solid #3a322a; }
.b-row { display: grid; grid-template-columns: 90px 70px 190px 1fr 170px 110px; gap: 14px; align-items: center; padding: 14px 6px; border-bottom: 1px solid #3a322a; font-size: 15px; }
.b-date, .b-time, .b-case { font-family: "JetBrains Mono", "Faruma", ui-monospace, Menlo, monospace; color: var(--gold); letter-spacing: .04em; }
.b-time { color: #fff; }
.b-case { color: #f2e6d4; }
.b-room { color: #b9ab97; font-size: 13px; }
.b-st { justify-self: end; font: 700 11px "Inter", "Faruma", sans-serif; letter-spacing: .08em; text-transform: uppercase; padding: 4px 10px; border: 1px solid #5a4e40; color: #d9cbb7; }
.b-row:first-child .b-st { background: var(--gold); border-color: var(--gold); color: var(--ink); }
.b-row.cx { opacity: .55; }
.b-row.cx .b-st { border-color: #e06c5a; color: #ff9a8a; background: none; }
.b-link { display: inline-flex; gap: 6px; align-items: center; font-weight: 600; font-size: 14px; border-bottom: 1px solid currentColor; padding-bottom: 2px; }
.b-link.light { color: var(--gold) !important; margin-top: 22px; }

/* sections */
.b-sec { padding: 64px 0; border-bottom: 1px solid var(--line); }
.b-sec-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 26px; border-bottom: 1px solid var(--ink); padding-bottom: 12px; }
.b-sec-head h2 { font-size: 34px; }
.b-nums { display: grid; grid-template-columns: repeat(4, 1fr); border-inline-start: 1px solid var(--line); }
.b-nums > div { padding: 6px 24px 10px; border-inline-end: 1px solid var(--line); }
.b-nums b { display: block; font: 400 64px/1.1 var(--serif); color: var(--ink); }
.b-nums span { color: var(--muted); font-size: 14px; }
.b-chart { margin-top: 34px; background: #fff; border: 1px solid var(--line); padding: 24px; }
.b-chart .legend { margin-top: 10px; }
.b-two { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; }
.b-dec { display: block; padding: 16px 0; border-bottom: 1px solid var(--line); }
.b-dec b { display: block; font-size: 18px; margin: 8px 0 2px; font-weight: 600; }
html[lang="en"] .b-dec b { font-family: var(--serif); font-weight: 500; font-size: 21px; }
.b-dec small { color: var(--muted); font-size: 13px; }
.b-news { display: grid; grid-template-columns: 74px 1fr; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.b-news time { font: 400 26px/1 var(--serif); color: var(--brand); }
.b-news time small { display: block; font: 500 12px "Inter", "Faruma", sans-serif; color: var(--muted); margin-top: 4px; }
.b-news b { display: block; font-weight: 600; font-size: 17px; }
html[lang="en"] .b-news b { font-family: var(--serif); font-weight: 500; font-size: 20px; }
.b-news small { color: var(--muted); font-size: 13px; }
.b-time-line { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(5, 1fr); counter-reset: d; }
.b-time-line li { border-top: 4px solid var(--ink); padding: 16px 16px 0 0; position: relative; }
html[dir="rtl"] .b-time-line li { padding: 16px 0 0 16px; }
.b-time-line li:nth-child(2) { border-color: var(--brand); }
.b-time-line b { display: block; font-size: 20px; }
html[lang="en"] .b-time-line b { font-family: var(--serif); font-weight: 500; font-size: 24px; }
.b-time-line span { color: var(--muted); font-size: 14px; }
.b-cta { margin-top: 44px; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 30px; background: var(--brand); color: #fff; flex-wrap: wrap; }
.b-cta h3 { font-size: 28px; color: #fff; }
.b-cta p { margin: 4px 0 0; color: #f3dcc0; }
html[data-ui="b"] .b-cta .btn { background: #fff; color: var(--ink); }

/* buttons, cards, tables, forms (shared components restyled) */
html[data-ui="b"] .btn { border-radius: 0; background: var(--ink); color: var(--paper); }
html[data-ui="b"] .btn:hover { background: var(--brand); color: #fff; }
html[data-ui="b"] .btn.ghost { background: transparent; color: var(--ink); border: 1px solid var(--ink); }
html[data-ui="b"] .btn.ghost:hover { background: var(--ink); color: var(--paper); }
html[data-ui="b"] .card { border-radius: 0; border-color: var(--line); box-shadow: none; }
html[data-ui="b"] .chip-btn, html[data-ui="b"] .file-btn { border-radius: 0; }
html[data-ui="b"] .tbl th { background: transparent; border-bottom: 1px solid var(--ink); border-radius: 0 !important; text-transform: uppercase; letter-spacing: .06em; font-size: 11px; }
html[data-ui="b"][lang="dv"] .tbl th { letter-spacing: 0; font-size: 13px; }
html[data-ui="b"] .tbl tbody tr:hover { background: #fff; }
html[data-ui="b"] .toolbar .field, html[data-ui="b"] .form input, html[data-ui="b"] .form select, html[data-ui="b"] .form textarea, html[data-ui="b"] .choice { border-radius: 0; }
html[data-ui="b"] .pill { border-radius: 2px; }
html[data-ui="b"] .tabs button { border-radius: 0; }
html[data-ui="b"] .tabs button.on { background: var(--ink); border-color: var(--ink); }
html[data-ui="b"] .page-hero { background: var(--paper); color: var(--ink); border-bottom: 1px solid var(--ink); padding: 52px 0 36px; }
html[data-ui="b"] .page-hero::after { opacity: .06; filter: none; width: 360px; height: 360px; top: -30px; }
html[data-ui="b"] .page-hero h1 { font-size: 52px; color: var(--ink); }
html[data-ui="b"] .page-hero p { color: var(--ink-2); }
html[data-ui="b"] .crumbs { color: var(--muted); }
html[data-ui="b"] .crumbs a { color: var(--brand); }
html[data-ui="b"] .article-hero .kicker { color: var(--brand) !important; }
html[data-ui="b"] .side { border: 0; border-inline-start: 1px solid var(--ink); border-radius: 0; background: none; padding: 0; top: 100px; }
html[data-ui="b"] .side a { border-radius: 0; padding: 8px 16px; color: var(--ink-2); }
html[data-ui="b"] .side a.on { background: none; color: var(--ink); font-weight: 700; box-shadow: inset 3px 0 0 var(--brand); }
html[data-ui="b"][dir="rtl"] .side a.on { box-shadow: inset -3px 0 0 var(--brand); }
html[data-ui="b"] .stat, html[data-ui="b"] .qcard, html[data-ui="b"] details.acc, html[data-ui="b"] .stepper .s, html[data-ui="b"] .file-slot, html[data-ui="b"] .review, html[data-ui="b"] .verified { border-radius: 0; }
html[data-ui="b"] .avatar { border-radius: 0; background: var(--ink); box-shadow: none; }
html[data-ui="b"] .news-card .img, html[data-ui="b"] .article .cover { filter: grayscale(.35) contrast(1.05); }
html[data-ui="b"] .gate .lock, html[data-ui="b"] .info-row .ic, html[data-ui="b"] .qcard .ic { border-radius: 0; }
html[data-ui="b"] .modal { border-radius: 0; }
html[data-ui="b"] .efaas { border-radius: 999px; } /* eFaas brand shape stays */

/* page feedback + footer */
.b-useful { border-top: 1px solid var(--line); margin-top: 40px; }
.b-useful .wrap { display: flex; gap: 10px; align-items: center; padding-block: 18px; font-size: 14px; }
.b-useful button { border: 1px solid var(--ink); background: none; padding: 4px 16px; cursor: pointer; }
.b-useful button:hover { background: var(--ink); color: var(--paper); }
.b-foot { background: var(--ink); color: #d8cab6; }
.b-foot a { color: #f2e6d4 !important; display: block; padding: 3px 0; font-size: 14px; }
.b-foot a:hover { color: var(--gold) !important; }
.b-foot-big { display: flex; gap: 24px; align-items: center; padding: 56px 0 36px; border-bottom: 1px solid #3a322a; }
.b-foot-big img { width: 64px; filter: brightness(0) invert(1); }
.b-foot-big p { font: 400 30px/1.3 var(--serif); color: #fff; margin: 0; max-width: 820px; }
html[lang="dv"] .b-foot-big p { font-family: var(--display); font-size: 26px; line-height: 1.7; }
.b-foot-cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; padding: 36px 0; }
.b-foot h4 { color: #fff; font-size: 14px; margin-bottom: 10px; }
.b-foot p { font-size: 14px; margin: 0 0 8px; }
.b-foot .social { display: flex; gap: 8px; }
.b-foot .social a { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #3a322a; padding: 0; }
.b-foot-bottom { border-top: 1px solid #3a322a; padding: 16px 0; font-size: 13px; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* command palette + tracker */
.b-cmd-bg { align-items: start; padding-top: 12vh; }
.b-cmd { background: var(--paper, #f6f3ec); width: 100%; max-width: 640px; border: 1px solid var(--ink, #15110d); box-shadow: 0 30px 90px rgba(0, 0, 0, .35); }
.b-cmd-in { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); background: #fff; }
.b-cmd-in input { flex: 1; border: 0; outline: none; font-size: 18px; background: transparent; }
.b-cmd-res { max-height: 50vh; overflow: auto; }
.b-cmd-res a { display: block; padding: 10px 18px; border-bottom: 1px solid var(--line); color: var(--ink) !important; }
.b-cmd-res a small { display: block; font-size: 11px; color: var(--brand); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.b-cmd-res a.on, .b-cmd-res a:hover { background: var(--ink); color: var(--paper) !important; }
.b-cmd-res a.on small, .b-cmd-res a:hover small { color: var(--gold); }
.b-cmd-foot { padding: 8px 16px; font-size: 12px; color: var(--muted); }
.b-track-head { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.b-steps { list-style: none; padding: 0; margin: 0; border-inline-start: 2px solid var(--line); }
.b-steps li { position: relative; padding: 0 0 18px; padding-inline-start: 22px; }
.b-steps li::before { content: ""; position: absolute; inset-inline-start: -7px; top: 6px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 2px solid var(--line); }
.b-steps li.done::before { background: var(--green); border-color: var(--green); }
.b-steps b { display: block; }
.b-steps span { color: var(--muted); font-size: 14px; }
.b-trackbar { display: flex; gap: 12px; align-items: center; background: var(--ink); color: #fff; padding: 18px 22px; margin-bottom: 18px; flex-wrap: wrap; }
.b-trackbar b { font-size: 18px; }
.b-trackbar .btn { background: var(--gold); color: var(--ink); }

/* design switcher (shown in both designs) */
.ui-switch { position: fixed; bottom: 18px; inset-inline-end: 18px; z-index: 80; display: flex; align-items: center; gap: 4px; background: #15110d; color: #e9dcc8; padding: 5px 5px 5px 14px; border-radius: 999px; box-shadow: 0 10px 30px rgba(0, 0, 0, .3); font: 600 12px "Inter", "Faruma", "Plus Jakarta Sans", "Faruma", sans-serif; }
html[dir="rtl"] .ui-switch { padding: 5px 14px 5px 5px; }
.ui-switch span { margin-inline-end: 6px; }
.ui-switch button { width: 34px; height: 34px; border-radius: 50%; border: 0; background: transparent; color: #e9dcc8; font: 800 13px "Inter", "Faruma", sans-serif; cursor: pointer; }
.ui-switch button.on { background: var(--gold, #d9a35b); color: #15110d; }

@media (max-width: 1240px) {
  .b-nav { display: none; }
  .b-menu { display: grid; }
}
@media (max-width: 1100px) {
  .b-menu { display: grid; }
  .b-bar { justify-content: space-between; }
  .b-hero-grid, .b-two { grid-template-columns: 1fr; gap: 36px; }
  .b-check { position: static; }
  .b-row { grid-template-columns: 80px 60px 1fr 100px; }
  .b-party, .b-room { display: none; }
  .b-foot-cols { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .b-search span, .b-search kbd { display: none; }
  .b-search { min-width: 0; padding: 0; width: 40px; height: 40px; justify-content: center; }
  .b-brand small { display: none; }
  .b-nums { grid-template-columns: 1fr 1fr; }
  .b-nums b { font-size: 44px; }
  .b-time-line { grid-template-columns: 1fr; gap: 14px; }
  .b-row { grid-template-columns: 70px 1fr 90px; }
  .b-time { display: none; }
  .b-foot-cols { grid-template-columns: 1fr; }
  .b-foot-big p { font-size: 22px; }
  html[data-ui="b"] .page-hero h1 { font-size: 36px; }
  .b-tools .efaas span { display: none; }
}

/* ===== v2 refinements: home hero, task grid, agenda schedule, publication covers, inner layout ===== */
html[data-ui="b"] .page-hero::after { display: none; }
html[data-ui="b"] .page-hero { background: linear-gradient(180deg, #fff 0%, var(--paper) 100%); }
html[data-ui="b"][lang="dv"] .page-hero h1 { font-size: 44px; line-height: 1.6; }

/* hero */
.b-hero-grid { grid-template-columns: 1.1fr 1fr; gap: 48px; padding-block: 56px 64px; align-items: center; }
html[lang="dv"] .b-h1 { font-size: clamp(28px, 3.4vw, 44px); line-height: 1.7; }
.b-lead { margin-bottom: 26px; }
.b-bigsearch { display: flex; align-items: center; gap: 12px; width: 100%; max-width: 560px; background: #fff; border: 1px solid var(--ink); padding: 16px 18px; cursor: text; color: var(--muted); font-size: 16px; text-align: start; box-shadow: 6px 6px 0 var(--paper-2); }
html[dir="rtl"] .b-bigsearch { box-shadow: -6px 6px 0 var(--paper-2); }
.b-bigsearch span { flex: 1; }
.b-bigsearch:hover { border-color: var(--brand); color: var(--ink); }
.b-facts { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 560px; margin-top: 30px; border-top: 1px solid var(--line); }
.b-facts > div { padding: 14px 14px 0 0; }
html[dir="rtl"] .b-facts > div { padding: 14px 0 0 14px; }
.b-facts b { display: block; font: 400 40px/1 var(--serif); color: var(--brand); }
.b-facts span { font-size: 13px; color: var(--muted); line-height: 1.5; display: block; margin-top: 6px; }
.b-hero-visual { position: relative; padding-bottom: 120px; }
.b-photo { margin: 0; position: relative; aspect-ratio: 4/3.2; overflow: hidden; border: 1px solid var(--ink); }
.b-photo img { width: 100%; height: 100%; object-fit: cover; filter: sepia(.35) saturate(.85) contrast(1.05); }
.b-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(21, 17, 13, 0) 50%, rgba(21, 17, 13, .55)); }
.b-photo figcaption { position: absolute; bottom: 12px; inset-inline-start: 14px; z-index: 1; color: #fff; font-size: 12px; letter-spacing: .06em; }
.b-hero-visual .b-check { position: absolute; bottom: 0; inset-inline-end: -12px; width: min(400px, 92%); top: auto; }
/* task grid */
.b-taskband { border-bottom: 1px solid var(--ink); background: #fff; padding: 34px 0 40px; }
.b-taskgrid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--ink); }
.b-taskgrid li + li { border-inline-start: 1px solid var(--line); }
.b-taskgrid a { display: flex; flex-direction: column; gap: 6px; padding: 22px 20px 20px; height: 100%; position: relative; transition: background .2s, color .2s; }
.b-taskgrid a:hover { background: var(--ink); color: var(--paper); }
.b-taskgrid a:hover small, .b-taskgrid a:hover .b-n { color: #b9ab97; }
.b-taskgrid a:hover .b-ti, .b-taskgrid a:hover .b-go { color: var(--gold); }
.b-taskgrid .b-ti { color: var(--brand); margin: 10px 0 6px; }
.b-taskgrid b { font-size: 19px; line-height: 1.35; }
html[lang="en"] .b-taskgrid b { font-family: var(--serif); font-weight: 500; font-size: 22px; }
html[lang="dv"] .b-taskgrid b { font-family: var(--display); font-weight: 400; line-height: 1.7; }
.b-taskgrid small { color: var(--muted); font-size: 13px; }
.b-taskgrid .b-go { margin-top: auto; padding-top: 14px; color: var(--brand); }

/* inner layout: side menu stays a side column (as before); it only becomes a tab strip on phones (see 860px rule in styles.css) */
@media (max-width: 860px) {
  html[data-ui="b"] .side { border-inline-start: 0; border-bottom: 1px solid var(--ink); }
  html[data-ui="b"] .side a.on { box-shadow: inset 0 -3px 0 var(--brand) !important; }
}

/* agenda schedule */
.ag-layout { display: grid; grid-template-columns: 340px 1fr; gap: 32px; padding-block: 34px 64px; align-items: start; }
.ag-side { position: sticky; top: 100px; display: grid; gap: 18px; align-items: start; }
.ag-tips { border: 1px solid var(--ink); padding: 18px 20px; background: #fff; }
.ag-tips h3 { font-size: 18px; margin-bottom: 8px; }
.ag-tips ul { list-style: none; padding: 0; margin: 0; }
.ag-tips li { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; padding: 6px 0; border-bottom: 1px dashed var(--line); }
.ag-tips li:last-child { border: 0; }
.ag-tips li svg { color: var(--green); flex: none; margin-top: 4px; }
.ag-chips { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-bottom: 18px; }
.ag-chips button { border: 1px solid var(--ink); background: none; padding: 7px 16px; cursor: pointer; font-size: 14px; }
.ag-chips button.on { background: var(--ink); color: var(--paper); }
.ag-daytag { display: inline-flex; align-items: center; gap: 6px; background: var(--brand); color: #fff; padding: 6px 6px 6px 14px; font-size: 14px; }
.ag-daytag button { background: rgba(255, 255, 255, .2); border: 0; color: #fff; width: 24px; height: 24px; cursor: pointer; }
.ag-day { margin-bottom: 26px; }
.ag-day header { display: flex; align-items: baseline; gap: 14px; border-bottom: 2px solid var(--ink); padding-bottom: 8px; margin-bottom: 4px; }
.ag-day header b { font: 400 46px/1 var(--serif); color: var(--brand); min-width: 56px; }
.ag-day header span { flex: 1; font-size: 15px; color: var(--muted); }
.ag-day header em { display: block; font-style: normal; font-weight: 700; color: var(--ink); font-size: 17px; }
.ag-day header small { font: 600 12px "Inter", "Faruma", sans-serif; border: 1px solid var(--line); padding: 2px 8px; color: var(--muted); }
.ag-item { display: grid; grid-template-columns: 80px 1fr auto; gap: 18px; align-items: start; padding: 16px 0; border-bottom: 1px solid var(--line); }
.ag-item time { font: 500 20px/1.2 "JetBrains Mono", "Faruma", ui-monospace, monospace; color: var(--ink); padding-top: 2px; }
.ag-main .caseno { font-size: 15px; }
.ag-main p { margin: 2px 0; }
.ag-main small { display: block; color: var(--muted); font-size: 13px; }
.ag-main .ag-why { color: var(--red); }
.ag-item.cx time, .ag-item.cx .caseno, .ag-item.cx b { text-decoration: line-through; color: var(--muted); }
.ag-act .chip-btn { display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; color: var(--ink); }
.ag-empty { padding: 30px 0; }

/* publications */
.pub-cover { position: relative; aspect-ratio: 3/4; padding: 18px; display: flex; flex-direction: column; color: #fff; overflow: hidden; border: 1px solid var(--ink); }
.pub-cover::before { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .05) 0 14px, transparent 14px 38px); }
.pub-cover.tone0 { background: linear-gradient(160deg, #2a1607, #7b3f00); }
.pub-cover.tone1 { background: linear-gradient(160deg, #15110d, #3b332b); }
.pub-cover.tone2 { background: linear-gradient(160deg, #7b3f00, #c0742e); }
.pub-cover.tone3 { background: #ece6da; color: var(--ink); }
.pub-cover img { width: 30px; height: 30px; filter: brightness(0) invert(1); position: relative; }
.pub-cover.tone3 img { filter: none; }
.pub-cover .k { margin-top: auto; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; opacity: .85; position: relative; }
html[lang="dv"] .pub-cover .k { letter-spacing: 0; font-family: var(--display); font-size: 16px; }
.pub-cover b { font: 400 54px/1 var(--serif); position: relative; margin: 4px 0 10px; }
.pub-cover .o { font-size: 11px; opacity: .75; position: relative; border-top: 1px solid currentColor; padding-top: 8px; }
.pub-cover.big { width: 100%; }
.pub-cover.big b { font-size: 84px; }
.pub-feature { display: grid; grid-template-columns: 240px 1fr; gap: 36px; align-items: center; padding-bottom: 34px; border-bottom: 1px solid var(--ink); }
.pub-feature a { display: block; transition: transform .2s; }
.pub-feature a:hover { transform: translateY(-4px); }
.pub-feature h2 { font-size: 40px; margin: 6px 0 8px; }
.pub-meta { display: flex; gap: 8px; margin: 14px 0 20px; }
.pub-meta span { border: 1px solid var(--line); padding: 2px 10px; font-size: 12px; font-weight: 600; }
.pub-h { font-size: 22px; margin: 30px 0 16px; }
.pub-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 24px; }
.pub-card { display: flex; flex-direction: column; gap: 6px; }
.pub-card .pub-cover { transition: transform .2s, box-shadow .2s; }
.pub-card:hover .pub-cover { transform: translateY(-4px); box-shadow: 8px 8px 0 var(--paper-2); }
.pub-card b { font-size: 16px; margin-top: 8px; }
.pub-card small { color: var(--muted); font-size: 12px; }

@media (max-width: 1100px) {
  .b-hero-grid { grid-template-columns: 1fr; }
  .b-hero-visual { padding-bottom: 0; }
  .b-photo { aspect-ratio: 16/7; }
  .b-hero-grid { gap: 28px; }
  .b-hero-visual .b-check { position: relative; inset: auto; width: auto; margin: -60px 16px 0; }
  .b-taskgrid { grid-template-columns: repeat(2, 1fr); }
  .b-taskgrid li + li { border-inline-start: 0; }
  .b-taskgrid li { border-bottom: 1px solid var(--line); }
  .b-taskgrid li:nth-child(even) { border-inline-start: 1px solid var(--line); }
  .ag-layout { grid-template-columns: 1fr; }
  .ag-side { position: static; grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .b-taskgrid { grid-template-columns: 1fr; }
  .b-taskgrid li:nth-child(even) { border-inline-start: 0; }
  .b-facts b { font-size: 30px; }
  .ag-side { grid-template-columns: 1fr; }
  .ag-item { grid-template-columns: 62px 1fr; }
  .ag-act { grid-column: 2; }
  .pub-feature { grid-template-columns: 1fr; }
  .pub-feature > a { max-width: 220px; }
  .pub-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .b-bigsearch span { font-size: 14px; }
  .b-bigsearch kbd { display: none; }
}

/* header: tools always sit at the far end (also when the menu links are hidden), proper language pill */
.b-tools { margin-inline-start: auto; }
.b-lang { height: 40px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--line); background: #fff; cursor: pointer; color: var(--ink); font: 600 13px "Inter", "Faruma", sans-serif; white-space: nowrap; }
.b-lang:hover { border-color: var(--ink); }
.b-lang[lang="dv"] { font: 400 16px/1 "MV Waheed", "Faruma", sans-serif; padding-top: 2px; }

/* news date column: big day number, month and year below (month in MV Waheed for Dhivehi) */
.b-news { grid-template-columns: 96px 1fr; }
.b-news time { display: flex; flex-direction: column; gap: 2px; }
.b-news time b { font: 400 34px/1 var(--serif); color: var(--brand); }
.b-news time span { font: 600 13px/1.4 "Inter", "Faruma", sans-serif; color: var(--brand); }
html[lang="dv"] .b-news time span { font: 400 15px/1.7 "MV Waheed", "Faruma", sans-serif; }
/* Dhivehi list titles are titles: MV Waheed */
html[lang="dv"] :is(.b-news > span > b, .b-dec > b, .pub-card > b, .ag-day header em) { font-family: "MV Waheed", "Faruma", sans-serif; font-weight: 400; line-height: 1.8; }

.b-news time { align-items: flex-start; line-height: 1; padding-top: 4px; }
.b-news time b { font: 400 34px/1 var(--serif) !important; }
html[lang="dv"] .b-news time span { line-height: 1.5; margin-top: 4px; }
.b-news time small { margin-top: 2px !important; }

/* big numbers keep left-to-right digits but sit at the reading start (right in Dhivehi), in line with their labels */
.b-nums b, .b-facts b { display: inline-block; }
.pub-cover b { align-self: flex-start; }
.b-nums span { display: block; }

/* landing hero: subtle damask wallpaper (after the hearing-room wallpaper), faded under the headline */
.b-hero { position: relative; isolation: isolate; overflow: hidden; }
.b-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("/img/damask.svg") center top / 132px repeat; opacity: .14;
  -webkit-mask-image: linear-gradient(to left, #000 0%, rgba(0, 0, 0, .55) 45%, rgba(0, 0, 0, .9) 100%); mask-image: linear-gradient(to left, #000 0%, rgba(0, 0, 0, .55) 45%, rgba(0, 0, 0, .9) 100%); }
html[dir="rtl"] .b-hero::before { -webkit-mask-image: linear-gradient(to right, #000 0%, rgba(0, 0, 0, .55) 45%, rgba(0, 0, 0, .9) 100%); mask-image: linear-gradient(to right, #000 0%, rgba(0, 0, 0, .55) 45%, rgba(0, 0, 0, .9) 100%); }
.b-hero::after { content: ""; position: absolute; inset: auto 0 0; height: 80px; z-index: -1; background: linear-gradient(to bottom, rgba(246, 243, 236, 0), var(--paper)); }

/* ---------- home stats dashboard ---------- */
.st-kpis { display: grid; grid-template-columns: repeat(4, 1fr) .8fr; border: 1px solid var(--ink); background: #fff; }
.st-kpi { padding: 18px 20px 14px; display: flex; flex-direction: column; gap: 2px; }
.st-kpi + .st-kpi { border-inline-start: 1px solid var(--line); }
.st-l { font-size: 13px; color: var(--muted); }
.st-kpi > b { display: inline-block; align-self: flex-start; font: 400 46px/1.1 var(--serif); color: var(--ink); }
.st-foot { display: flex; justify-content: space-between; align-items: end; gap: 8px; margin-top: 6px; }
.st-foot small { font-size: 12px; color: var(--muted); white-space: nowrap; }
.spark { width: 110px; height: 32px; flex: none; }
.st-grid { display: grid; grid-template-columns: 1.45fr 1fr; gap: 18px; margin-top: 18px; align-items: start; }
.st-card { background: #fff; border: 1px solid var(--line); padding: 18px 20px; }
.st-card h3 { font-size: 16px; margin-bottom: 12px; }
html[lang="en"] .st-card h3 { font-family: "Inter", "Faruma", sans-serif; font-weight: 700; letter-spacing: 0; }
.st-h { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 4px; }
.st-h h3 { margin: 0; }
.st-trend .chart { max-height: 230px; }
.st-side { display: grid; gap: 18px; }
.st-stack { display: flex; height: 14px; gap: 2px; margin-bottom: 12px; }
.st-stack i { display: block; }
.st-legend { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; font-size: 13px; }
.st-legend li { display: flex; align-items: center; gap: 6px; }
.st-legend li i { width: 10px; height: 10px; flex: none; }
.st-legend li b { margin-inline-start: auto; font: 600 13px "Inter", "Faruma", sans-serif; }
.st-legend li span { color: var(--muted); font-size: 12px; min-width: 32px; text-align: end; }
.st-bar { display: grid; grid-template-columns: 130px 1fr 28px; gap: 10px; align-items: center; font-size: 13px; padding: 4px 0; }
.st-bar div { height: 8px; background: var(--paper-2); }
.st-bar div i { display: block; height: 100%; background: var(--brand); }
.st-bar b { font: 600 13px "Inter", "Faruma", sans-serif; text-align: end; }
.st-kpi.st-open { background: var(--ink); color: var(--paper); }
.st-open .st-l, .st-open small { color: #b9ab97 !important; }
.st-kpi.st-open > b { color: var(--gold); }
.st-grid { align-items: stretch; }
.st-trend { display: flex; flex-direction: column; }
.st-trend > div[dir] { flex: 1; display: flex; align-items: center; }
@media (max-width: 1100px) { .st-grid { grid-template-columns: 1fr; } .st-kpis { grid-template-columns: 1fr 1fr; } .st-kpi:nth-child(odd) { border-inline-start: 0; } .st-kpi:nth-child(n+3) { border-top: 1px solid var(--line); } .st-kpi.st-open { grid-column: 1 / -1; } }
@media (max-width: 560px) { .st-kpis { grid-template-columns: 1fr; } .st-kpi + .st-kpi { border-inline-start: 0; border-top: 1px solid var(--line); } .st-bar { grid-template-columns: 100px 1fr 24px; } }

/* ===================== About pages (Design B) ===================== */
.ab { display: grid; gap: 30px; }
.ab-big { font: 400 26px/1.45 var(--serif); color: var(--ink); margin: 0 0 14px; }
html[lang="dv"] .ab-big { font: 400 24px/1.9 "MV Waheed", "Faruma", sans-serif; }
.ab-intro { display: grid; grid-template-columns: 1.5fr 1fr; gap: 36px; align-items: start; }
.ab-lead p:not(.ab-big) { font-size: 17px; color: var(--ink-2); }
.ab-facts { border: 1px solid var(--ink); background: #fff; display: grid; grid-template-columns: 1fr 1fr; }
.ab-facts h3 { grid-column: 1 / -1; font-size: 14px !important; font-family: var(--font) !important; font-weight: 700 !important; padding: 12px 18px; border-bottom: 1px solid var(--ink); margin: 0; letter-spacing: 0 !important; }
.ab-facts > div { padding: 16px 18px; border-bottom: 1px solid var(--line); }
.ab-facts > div:nth-of-type(odd):not(.wide) { border-inline-end: 1px solid var(--line); }
.ab-facts b { display: inline-block; font: 400 34px/1.1 var(--serif); color: var(--brand); }
.ab-facts span { display: block; font-size: 13px; color: var(--muted); }
.ab-facts .wide { grid-column: 1 / -1; display: flex; gap: 10px; align-items: center; border-bottom: 0; background: var(--ink); color: var(--paper); }
.ab-facts .wide span { color: #e6d6c0; font-size: 14px; }
.ab-facts .wide svg { color: var(--gold); }
.ab-explore h3 { font-size: 14px !important; font-family: var(--font) !important; font-weight: 700 !important; color: var(--muted); margin-bottom: 8px; letter-spacing: 0 !important; }
.ab-explore > div { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); }
.ab-explore a { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding: 16px 4px; border-bottom: 1px solid var(--line); font-weight: 600; }
.ab-explore a + a { border-inline-start: 1px solid var(--line); padding-inline-start: 14px; }
.ab-explore a:hover { color: var(--brand); }
.ab-two { display: grid; grid-template-columns: 1fr 300px; gap: 32px; align-items: start; }
.ab-side { display: grid; gap: 16px; position: sticky; top: 100px; }
.ab-box { border: 1px solid var(--line); background: #fff; padding: 18px 20px; }
.ab-box h3 { font-size: 17px; margin-bottom: 10px; }
.ab-box ul { list-style: none; padding: 0; margin: 0; }
.ab-box li { display: flex; gap: 8px; align-items: flex-start; padding: 6px 0; font-size: 14px; border-bottom: 1px dashed var(--line); }
.ab-box li:last-child { border: 0; }
.ab-box li svg { color: var(--green); flex: none; margin-top: 4px; }
.ab-box p { margin: 0 0 6px; font-size: 14px; }
.ab-box.dark { background: var(--ink); border-color: var(--ink); color: #e6d6c0; }
.ab-box.dark h3 { color: #fff; }
.ab-steps { list-style: none; padding: 0; margin: 0; border-inline-start: 1px solid var(--ink); }
.ab-steps li { display: grid; grid-template-columns: 56px 1fr; gap: 6px; padding: 0 0 26px; position: relative; }
.ab-steps li::before { content: ""; position: absolute; inset-inline-start: -6px; top: 8px; width: 11px; height: 11px; background: var(--paper); border: 1px solid var(--ink); }
.ab-steps .n { font: 400 22px/1.4 var(--serif); color: var(--muted); padding-inline-start: 20px; }
.ab-steps h3 { font-size: 21px; margin-bottom: 4px; }
.ab-steps p { margin: 0; color: var(--ink-2); }
.ab-steps li.key::before { background: var(--brand); border-color: var(--brand); }
.ab-steps li.key > div { background: #fff; border: 1px solid var(--brand); padding: 16px 18px; margin-inline-end: 0; }
.ab-steps li.key .n { color: var(--brand); }
.ab-cta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.ab-path { display: flex; align-items: stretch; gap: 10px; }
.ab-node { flex: 1; border: 1px solid var(--line); background: #fff; padding: 18px; }
.ab-node b { display: block; font-size: 19px; }
html[lang="dv"] .ab-node b { font-family: "MV Waheed", "Faruma", sans-serif; font-weight: 400; }
.ab-node small { color: var(--muted); }
.ab-node.on { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.ab-node.on small { color: var(--gold); }
.ab-arrow { display: grid; place-items: center; color: var(--brand); }
.ab-cats { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--ink); }
.ab-cats a { padding: 18px; border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 4px; }
.ab-cats a:nth-child(3n+2), .ab-cats a:nth-child(3n+3) { border-inline-start: 1px solid var(--line); }
.ab-cats a:hover { background: var(--ink); color: var(--paper); }
.ab-cats b { font: 400 36px/1 var(--serif); color: var(--brand); align-self: flex-start; }
.ab-powers { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border: 1px solid var(--ink); background: #fff; }
.ab-power { padding: 28px; position: relative; }
.ab-power + .ab-power { border-inline-start: 1px solid var(--line); }
.ab-power .n { position: absolute; top: 18px; inset-inline-end: 22px; font: 400 44px/1 var(--serif); color: var(--paper-2); }
.ab-power svg { color: var(--brand); }
.ab-power h3 { font-size: 24px; margin: 14px 0 8px; }
.ab-power p { margin: 0; color: var(--ink-2); font-size: 16px; }
.ab-vm { display: grid; gap: 0; border: 1px solid var(--ink); }
.ab-vm .v { background: var(--ink); color: #fff; padding: 40px; position: relative; overflow: hidden; }
.ab-vm .v::after { content: ""; position: absolute; inset: 0; background: url("/img/damask.svg") center/132px; opacity: .06; filter: invert(1); }
.ab-vm .v p { font: 400 40px/1.25 var(--serif); margin: 10px 0 0; max-width: 22ch; position: relative; z-index: 1; }
html[lang="dv"] .ab-vm .v p { font: 400 32px/1.8 "MV Waheed", "Faruma", sans-serif; max-width: none; }
.ab-vm .m { background: #fff; padding: 32px 40px; }
.ab-vm .m p { font-size: 19px; margin: 10px 0 0; color: var(--ink-2); }
/* people */
.ab-photo { width: 100%; aspect-ratio: 4/5; background: linear-gradient(160deg, var(--paper-2), #d8cbb7); display: grid; place-items: center; position: relative; overflow: hidden; }
.ab-photo::after { content: ""; position: absolute; inset-inline: 22%; bottom: -18%; height: 62%; border-radius: 50% 50% 0 0; background: rgba(21, 17, 13, .12); }
.ab-photo::before { content: ""; position: absolute; top: 22%; width: 34%; aspect-ratio: 1; border-radius: 50%; background: rgba(21, 17, 13, .12); }
.ab-photo span { position: absolute; bottom: 10px; inset-inline-start: 12px; font: 700 12px "Inter", sans-serif; color: var(--ink-2); letter-spacing: .08em; z-index: 1; }
.ab-term { display: grid; gap: 22px; }
.ab-lead-m { display: grid; grid-template-columns: 240px 1fr; gap: 30px; align-items: center; border: 1px solid var(--ink); background: #fff; padding: 22px; }
.ab-lead-m h2 { font-size: 36px; margin: 6px 0 8px; }
.ab-lead-m dl { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 16px 0 0; border-top: 1px solid var(--line); padding-top: 12px; }
.ab-lead-m dt { font-size: 12px; color: var(--muted); }
.ab-lead-m dd { margin: 0; font-weight: 600; }
.role { display: inline-block; font: 700 11px "Inter", "Faruma", sans-serif; letter-spacing: .06em; text-transform: uppercase; color: var(--brand); border: 1px solid currentColor; padding: 2px 8px; align-self: flex-start; }
html[lang="dv"] .role { letter-spacing: 0; font: 400 13px/1.7 "Faruma", sans-serif; }
.role.chair { background: var(--brand); color: #fff; border-color: var(--brand); }
.ab-people { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 18px; }
.ab-person { display: flex; flex-direction: column; gap: 6px; }
.ab-person b { font-size: 16px; margin-top: 4px; }
html[lang="dv"] .ab-person b { font-family: "MV Waheed", "Faruma", sans-serif; font-weight: 400; }
.ab-person small { font-size: 12px; color: var(--muted); }
.ab-stools { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
.ab-find { display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--ink); padding: 10px 14px; flex: 1; min-width: 220px; }
.ab-find input { border: 0; outline: none; background: none; flex: 1; font-size: 15px; }
.ab-sort { display: flex; gap: 8px; align-items: center; font-size: 13px; color: var(--muted); }
.ab-sort select { border: 1px solid var(--line); background: #fff; padding: 9px 10px; }
.ab-view { display: flex; border: 1px solid var(--ink); }
.ab-view button { width: 42px; height: 42px; border: 0; background: #fff; cursor: pointer; display: grid; place-items: center; }
.ab-view button.on { background: var(--ink); color: var(--paper); }
.ab-staff { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.ab-scard { display: grid; grid-template-columns: 84px 1fr; gap: 14px; background: #fff; border: 1px solid var(--line); padding: 12px; }
.ab-scard.lead { border-color: var(--ink); }
.ab-scard b { display: block; font-size: 16px; }
html[lang="dv"] .ab-scard b { font-family: "MV Waheed", "Faruma", sans-serif; font-weight: 400; }
.ab-scard span { display: block; font-size: 14px; color: var(--ink-2); }
.ab-scard small { display: block; font-size: 12px; color: var(--brand); margin-top: 2px; }
.ab-scard .meta { display: grid; gap: 2px; margin-top: 8px; font-size: 12px; color: var(--muted); }
.ab-scard .meta a, .ab-scard .meta span { display: inline-flex; gap: 6px; align-items: center; color: var(--muted); font-size: 12px; }
.tbl .ab-photo { width: 40px; }
.tbl .ab-photo span { display: none; }
/* org chart + PDF */
.ab-org { display: grid; justify-items: center; gap: 22px; padding: 26px; border: 1px solid var(--line); background: #fff; }
.ab-org > div { position: relative; }
.ab-org .top, .ab-org .mid { border: 1px solid var(--ink); padding: 12px 22px; text-align: center; background: var(--paper); }
.ab-org .top { background: var(--ink); color: #fff; }
.ab-org .top small { display: block; color: var(--gold); font-size: 12px; }
.ab-org .mid::before, .ab-org .row::before { content: ""; position: absolute; top: -23px; left: 50%; width: 1px; height: 22px; background: var(--ink); }
.ab-org .row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; width: 100%; border-top: 1px solid var(--ink); padding-top: 14px; }
.ab-org .row > div { border: 1px solid var(--line); padding: 10px; text-align: center; background: var(--paper); font-size: 14px; }
.ab-org .row small { display: block; color: var(--muted); font-size: 12px; }
.ab-pdf { border: 1px solid var(--ink); background: #fff; }
.ab-pdf-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--ink); flex-wrap: wrap; }
.ab-pdf-bar > div:first-child { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ab-pdf-bar small { color: var(--muted); font-size: 12px; }
.ab-pdf-acts { display: flex; gap: 6px; }
.ab-pdf-acts .chip-btn { display: inline-flex; gap: 6px; align-items: center; color: var(--ink); }
.ab-pdf iframe { display: block; width: 100%; height: 640px; border: 0; background: #e9e4da; }
/* committees + FAQ */
.ab-cmte { border: 1px solid var(--line); background: #fff; padding: 24px; display: grid; grid-template-columns: 280px 1fr; gap: 28px; }
.ab-cmte h3 { font-size: 24px; margin-bottom: 8px; }
.ab-cmte p { margin: 0; color: var(--ink-2); }
.ab-cmte .ab-people { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.ab-q summary { align-items: center; gap: 14px; justify-content: flex-start; }
.ab-q summary::after { margin-inline-start: auto; }
.ab-q .n { font: 400 18px var(--serif); color: var(--muted); }
.ab-q .a { padding-inline-start: 52px !important; font-size: 16px; color: var(--ink-2) !important; }
#faq-list { margin-top: 14px; }

@media (max-width: 1100px) {
  .ab-intro, .ab-two, .ab-cmte { grid-template-columns: 1fr; }
  .ab-side { position: static; }
  .ab-explore > div { grid-template-columns: 1fr 1fr; }
  .ab-explore a:nth-child(3) { border-inline-start: 0; }
  .ab-org .row { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .ab-path { flex-direction: column; }
  .ab-arrow { transform: rotate(90deg); }
  .ab-cats, .ab-powers { grid-template-columns: 1fr; }
  .ab-cats a { border-inline-start: 0 !important; }
  .ab-power + .ab-power { border-inline-start: 0; border-top: 1px solid var(--line); }
  .ab-lead-m { grid-template-columns: 1fr; }
  .ab-lead-m .ab-photo { max-width: 220px; }
  .ab-vm .v p { font-size: 28px; }
  .ab-pdf iframe { height: 460px; }
  .ab-staff { grid-template-columns: 1fr; }
}

/* ---------- phone header: logo + name on one line, account + menu only; search and language live in the menu ---------- */
.b-sheet-tools { display: none !important; }
@media (max-width: 640px) {
  .b-bar { gap: 10px; min-height: 64px; }
  .b-brand { gap: 8px; min-width: 0; flex: 1; }
  .b-brand img { width: 38px; height: 38px; flex: none; }
  .b-brand > span { min-width: 0; }
  .b-brand b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .b-brand small { display: block !important; }
  .b-tools { gap: 6px; flex: none; }
  .b-tools > .b-search, .b-tools > .b-lang, .b-tools > .b-me, .b-tools > .efaas { display: none; }
  .b-icon { width: 36px; height: 36px; }
  .b-tools .efaas { padding: 4px; }
  .b-sheet-tools { display: flex !important; gap: 8px; padding-block: 14px 0 !important; }
  .b-sheet-tools .b-search { flex: 1; min-width: 0; width: auto; height: 42px; padding: 0 14px; justify-content: flex-start; border-radius: 999px; }
  .b-sheet-tools .b-search span { display: inline; }
  .b-sheet-tools { flex-wrap: wrap; }
  .b-sheet-tools .b-search { flex-basis: 100%; }
  .b-sheet a.b-sheet-me { display: flex; align-items: center; gap: 10px; flex-basis: 100%; min-width: 0; font-weight: 700; padding: 8px 0; order: -1; font-size: 16px; }
  .b-sheet-tools .b-search { order: -2; }
  .b-sheet-tools .b-lang { flex: 1; }
  .b-sheet-me > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .b-sheet-tools .efaas { flex: 1; justify-content: center; }
  .b-scam { font-size: 12.5px; }
  .b-scam .wrap { display: grid; grid-template-columns: 1fr auto; gap: 6px 10px; padding-block: 10px; align-items: start; }
  .b-scam-tag { justify-self: start; }
  .b-scam p { grid-column: 1 / -1; grid-row: 2; }
  .b-scam button { grid-column: 2; grid-row: 1; }
}

/* ===================== inner pages: header + side menu (v3) ===================== */
html[data-ui="b"] .page-hero { position: relative; isolation: isolate; overflow: hidden; padding: 40px 0 34px; background: #fff; }
html[data-ui="b"] .page-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("/img/damask.svg") center top / 132px repeat; opacity: .09;
  -webkit-mask-image: linear-gradient(to left, #000, transparent 70%); mask-image: linear-gradient(to left, #000, transparent 70%); }
html[data-ui="b"][dir="rtl"] .page-hero::before { -webkit-mask-image: linear-gradient(to right, #000, transparent 70%); mask-image: linear-gradient(to right, #000, transparent 70%); }
.ph-grid { display: flex; justify-content: space-between; align-items: end; gap: 24px; }
.ph-eyebrow { margin-top: 14px; font: 700 12px "Inter", "Faruma", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--brand); }
html[lang="dv"] .ph-eyebrow { font: 400 16px/1.6 "MV Waheed", "Faruma", sans-serif; letter-spacing: 0; }
html[data-ui="b"] .page-hero h1 { font-size: 56px; margin-top: 2px; }
html[data-ui="b"][lang="dv"] .page-hero h1 { font-size: 46px; line-height: 1.55; }
html[data-ui="b"] .page-hero p { font-size: 16px; margin-top: 6px; }
.ph-idx { flex: none; display: flex; align-items: baseline; gap: 6px; font-family: var(--serif); color: var(--muted); }
.ph-idx b { font-size: 64px; font-weight: 400; line-height: 1; color: var(--brand); }
.ph-idx span { font-size: 20px; }
html[data-ui="b"] .layout { grid-template-columns: 290px 1fr; gap: 40px; padding-block: 40px 72px; }
html[data-ui="b"] .side { border: 1px solid var(--ink); background: #fff; padding: 0; top: 96px; box-shadow: 8px 8px 0 var(--paper-2); }
html[data-ui="b"][dir="rtl"] .side { box-shadow: -8px 8px 0 var(--paper-2); }
.side-h { background: var(--ink); color: #fff; padding: 12px 18px; font: 700 12px "Inter", "Faruma", sans-serif; letter-spacing: .12em; text-transform: uppercase; }
html[lang="dv"] .side-h { font: 400 17px/1.6 "MV Waheed", "Faruma", sans-serif; letter-spacing: 0; }
html[data-ui="b"] .side a { display: flex; align-items: center; gap: 12px; padding: 10px 18px; border-bottom: 1px solid var(--line); color: var(--ink-2); position: relative; transition: background .15s, padding .15s; }
html[data-ui="b"] .side a:last-child { border-bottom: 0; }
html[data-ui="b"] .side a .si { font: 500 12px "Inter", sans-serif; color: var(--muted); min-width: 20px; }
html[data-ui="b"] .side a:hover { background: var(--paper); color: var(--ink); padding-inline-start: 22px; }
html[data-ui="b"] .side a.on { background: var(--paper-2); color: var(--ink); font-weight: 700; box-shadow: none !important; }
html[data-ui="b"] .side a.on::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 0; width: 4px; background: var(--brand); }
html[data-ui="b"] .side a.on .si { color: var(--brand); font-weight: 700; }
@media (max-width: 1100px) { html[data-ui="b"] .layout { grid-template-columns: 240px 1fr; gap: 28px; } .ph-idx b { font-size: 48px; } }
@media (max-width: 860px) {
  html[data-ui="b"] .layout { grid-template-columns: minmax(0, 1fr); gap: 20px; padding-block: 24px 56px; }
  html[data-ui="b"] .side { box-shadow: none !important; display: flex; overflow-x: auto; position: static; scrollbar-width: none; }
  html[data-ui="b"] .side::-webkit-scrollbar { display: none; }
  html[data-ui="b"] .side a { flex: none; }
  .side-h { display: none; }
  html[data-ui="b"] .side a { border-bottom: 0; border-inline-end: 1px solid var(--line); white-space: nowrap; }
  html[data-ui="b"] .side a.on::before { inset-block: auto 0; inset-inline: 0; width: auto; height: 3px; }
  .ph-idx { display: none; }
  html[data-ui="b"] .page-hero h1 { font-size: 40px; }
  html[data-ui="b"][lang="dv"] .page-hero h1 { font-size: 34px; }
}

/* ===================== mobile menu drawer ===================== */
html.menu-open, html.menu-open body { overflow: hidden; }
.b-drawer { position: fixed; inset: 0; z-index: 95; pointer-events: none; }
.bd-scrim { position: absolute; inset: 0; background: rgba(21, 17, 13, .5); opacity: 0; transition: opacity .25s; }
.bd-panel { position: absolute; top: 0; bottom: 0; inset-inline-start: 0; width: min(420px, 92vw); background: var(--paper); display: flex; flex-direction: column;
  transform: translateX(-100%); transition: transform .3s cubic-bezier(.2, .8, .2, 1), visibility 0s .3s; visibility: hidden; }
html[dir="rtl"] .bd-panel { transform: translateX(100%); }
.b-drawer.open .bd-panel { visibility: visible; transition: transform .3s cubic-bezier(.2, .8, .2, 1); box-shadow: 20px 0 60px rgba(0, 0, 0, .25); }
html[dir="rtl"] .b-drawer.open .bd-panel { box-shadow: -20px 0 60px rgba(0, 0, 0, .25); }
.b-drawer.open { pointer-events: auto; }
.b-drawer.open .bd-scrim { opacity: 1; }
.b-drawer.open .bd-panel { transform: none; }
.bd-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--ink); background: #fff; }
.bd-head .b-brand img { width: 34px; height: 34px; }
.bd-head .b-brand b { font-size: 17px; }
.bd-close { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--line); background: #fff; display: grid; place-items: center; cursor: pointer; flex: none; }
.bd-close:hover { border-color: var(--ink); }
.bd-body { flex: 1; overflow-y: auto; padding: 16px 18px 24px; display: flex; flex-direction: column; gap: 10px; overscroll-behavior: contain; }
.bd-search { display: flex; align-items: center; gap: 10px; width: 100%; background: #fff; border: 1px solid var(--ink); padding: 13px 14px; color: var(--muted); cursor: text; text-align: start; font-size: 14px; }
.bd-me { display: flex; align-items: center; gap: 12px; background: var(--ink); color: var(--paper) !important; padding: 12px 14px; }
.bd-me .b-me { border-color: var(--gold); }
.bd-me > span:nth-child(2) { flex: 1; min-width: 0; }
.bd-me b { display: block; font-size: 15px; }
html[lang="dv"] .bd-me b { font-family: "MV Waheed", "Faruma", sans-serif; font-weight: 400; }
.bd-me small { color: var(--gold); font-size: 12px; }
.bd-signin { border: 1px solid var(--line); background: #fff; padding: 14px; display: grid; gap: 10px; }
.bd-signin p { margin: 0; font-size: 13px; color: var(--muted); line-height: 1.6; }
.bd-signin .efaas { justify-content: center; width: 100%; }
.bd-tasks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 4px 0 8px; }
.bd-tasks a { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; padding: 12px; background: #fff; border: 1px solid var(--line); font-size: 13px; font-weight: 600; line-height: 1.35; min-height: 88px; }
.bd-tasks a svg { color: var(--brand); }
.bd-tasks a:hover { border-color: var(--ink); }
html[lang="dv"] .bd-tasks a span { font-family: "MV Waheed", "Faruma", sans-serif; font-weight: 400; font-size: 14px; line-height: 1.7; }
.bd-top, .bd-sec summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 2px; border-bottom: 1px solid var(--line); font-size: 17px; font-weight: 600; cursor: pointer; list-style: none; color: var(--ink) !important; }
html[lang="dv"] .bd-top, html[lang="dv"] .bd-sec summary { font-family: "MV Waheed", "Faruma", sans-serif; font-weight: 400; font-size: 18px; }
.bd-sec summary::-webkit-details-marker { display: none; }
.bd-top span { color: var(--muted); }
.bd-top.on { color: var(--brand) !important; }
.bd-sec summary i { width: 10px; height: 10px; border-inline-end: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(45deg); transition: transform .2s; margin-inline-end: 4px; }
.bd-sec[open] summary i { transform: rotate(-135deg); }
.bd-sec[open] summary { border-bottom-color: transparent; color: var(--brand) !important; }
.bd-sec > div { display: grid; padding: 0 0 12px; border-bottom: 1px solid var(--line); border-inline-start: 2px solid var(--brand); margin-inline-start: 2px; }
.bd-sec > div a { padding: 8px 14px; font-size: 15px; color: var(--ink-2) !important; }
html[lang="dv"] .bd-sec > div a { font-family: "MV Waheed", "Faruma", sans-serif; font-size: 16px; }
.bd-sec > div a.on { color: var(--brand) !important; font-weight: 700; background: var(--paper-2); }
.bd-foot { border-top: 1px solid var(--ink); background: #fff; padding: 14px 18px calc(14px + env(safe-area-inset-bottom)); display: grid; gap: 12px; }
.bd-lang { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--ink); }
.bd-lang button { padding: 10px; border: 0; background: #fff; cursor: pointer; font: 600 14px "Inter", sans-serif; }
.bd-lang button[lang="dv"] { font: 400 16px "MV Waheed", "Faruma", sans-serif; }
.bd-lang button.on { background: var(--ink); color: var(--paper); }
.bd-contact { display: flex; gap: 14px; flex-wrap: wrap; font-size: 13px; }
.bd-contact a { display: inline-flex; gap: 6px; align-items: center; color: var(--muted) !important; }
.bd-out { background: none; border: 0; padding: 0; text-align: start; color: var(--red); font-weight: 600; cursor: pointer; font-size: 14px; }
@media (min-width: 1241px) { .b-drawer { display: none; } }

@media (max-width: 640px) {
  .b-foot-big { gap: 16px; padding: 40px 0 28px; }
  .b-foot-big img { width: 44px; }
  .b-foot-big p { font-size: 19px !important; line-height: 1.5; }
  html[lang="dv"] .b-foot-big p { font-size: 18px !important; line-height: 1.8; }
}

/* ---------- phones: tables become labelled cards; track bar stacks ---------- */
@media (max-width: 640px) {
  .tbl.resp thead { display: none; }
  .tbl.resp, .tbl.resp tbody { display: block; }
  .tbl.resp tr { display: grid; grid-template-columns: 1fr; border: 1px solid var(--line); background: #fff; padding: 12px 14px; margin-bottom: 10px; }
  .tbl.resp tbody tr:hover { background: #fff; }
  .tbl.resp td { display: flex; justify-content: space-between; align-items: center; gap: 14px; border: 0; padding: 5px 0; text-align: end; white-space: normal !important; }
  .tbl.resp td::before { content: attr(data-l); flex: none; font-size: 12px; color: var(--muted); text-align: start; }
  .tbl.resp td.r-head { justify-content: flex-start; order: -1; border-bottom: 1px solid var(--line); padding-bottom: 8px; margin-bottom: 4px; }
  .tbl.resp td.r-head::before { display: none; }
  .tbl.resp td.r-photo { display: none; }
  html[data-ui="b"] .card.pad:has(> .tbl-wrap > .tbl.resp), #case-table.card { padding: 0; border: 0; background: none; }
  .b-trackbar { display: grid; grid-template-columns: auto 1fr; gap: 8px 10px; padding: 16px; }
  .b-trackbar > span { grid-column: 1 / -1; font-size: 13px; }
  .b-trackbar .btn { grid-column: 1 / -1; justify-content: center; }
  .toolbar .field { flex: 1 1 100%; }
  .toolbar .count { margin-inline-start: 0; }
}
@media (max-width: 640px) {
  .b-bigsearch span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .b-taskgrid a { display: grid; grid-template-columns: 30px 1fr 20px; grid-template-rows: auto auto; column-gap: 12px; row-gap: 0; align-items: center; padding: 14px 16px; }
  .b-taskgrid .b-n { display: none; }
  .b-taskgrid .b-ti { grid-row: 1 / 3; margin: 0; }
  .b-taskgrid b { grid-column: 2; font-size: 17px !important; }
  .b-taskgrid small { grid-column: 2; }
  .b-taskgrid .b-go { grid-column: 3; grid-row: 1 / 3; margin: 0; padding: 0; }
  .b-hero-grid { padding-block: 32px 40px; }
}

/* ---------- document lists (global): small file-type icon, tight title/meta, MV Waheed titles in Dhivehi ---------- */
.ficon { flex: none; display: grid; place-items: center; width: 36px; }
.ficon svg { display: block; filter: drop-shadow(0 1px 1px rgba(21, 17, 13, .08)); }
.doc-row { gap: 14px; padding: 14px 18px; align-items: center; }
.doc-row .t b { display: block; line-height: 1.45; margin: 0; font-weight: 600; }
.doc-row .t > span { display: block; line-height: 1.5; margin-top: 2px; font-size: 12px; }
html[lang="dv"] .doc-row .t b { font-family: "MV Waheed", "Faruma", sans-serif; font-weight: 400; font-size: 17px; line-height: 1.7; }
html[lang="dv"] .doc-row .t > span { margin-top: 0; }
.doc-row .file-btn { flex: none; }
html[data-ui="b"] .doc-row:hover { background: var(--paper); }
/* phone hearings board: keep case numbers on one line */
@media (max-width: 640px) { .b-case { white-space: nowrap; font-size: 13px; } .b-row { grid-template-columns: 64px 1fr 84px; gap: 10px; } }
/* doc lists: keep the meta line under the title on the reading side (LTR numbers inside an RTL page) */
html[dir="rtl"] .doc-row .t > span, html[dir="rtl"] .doc-row .t > b { text-align: right; }
html[dir="rtl"] .doc-row .t > span.ltr { direction: ltr; unicode-bidi: isolate; display: block; text-align: right; }

/* outcome tag sits inline before the decision title; case number stays inline in the meta line */
.doc-row .t b .pill { display: inline-flex; vertical-align: middle; font-size: 11px; padding: 1px 8px; margin-inline-end: 8px; }
html[lang="dv"] .doc-row .t b .pill { font-family: "Faruma", sans-serif; font-size: 12px; line-height: 1.6; }
.doc-row .t > span .caseno { display: inline; font-size: 12px; }

/* ---------- document lists on phones: icon | text (full width) | compact download ---------- */
@media (max-width: 640px) {
  .doc-row { display: grid; grid-template-columns: 30px minmax(0, 1fr) 40px; gap: 4px 12px; align-items: start; padding: 14px; }
  .doc-row .ficon { width: 30px; padding-top: 2px; }
  .doc-row .ficon svg { width: 24px; height: 30px; }
  .doc-row .file-btn { width: 40px; height: 40px; padding: 0; justify-content: center; align-self: start; }
  .doc-row .file-btn .fb-l { display: none; }
  html[lang="dv"] .doc-row .t b { font-size: 16px; line-height: 1.75; }
  .doc-row .t b .pill { display: flex; width: fit-content; margin: 0 0 4px; }
  .doc-row .t > span { font-size: 12px; line-height: 1.7; color: var(--muted); }
  .doc-row .t > span .caseno { display: block; font-size: 12.5px; color: var(--ink-2); }
}
@media (max-width: 640px) { .doc-row .dsep { display: none; } } .dsep { font-style: normal; }
.nw { white-space: nowrap; display: inline !important; }

/* header v4: brand never wraps; compact search; user icon with dropdown (eFaas square sign-in inside) */
.b-brand b, .b-brand small { white-space: nowrap; }
.b-search { min-width: 0; width: 132px; padding: 0 12px; height: 40px; gap: 6px; font-size: 13px; }
html[dir="rtl"] .b-search { padding: 0 12px; }
.b-user { position: relative; }
.b-pop { position: absolute; top: calc(100% + 10px); inset-inline-end: 0; width: 260px; background: #fff; border: 1px solid var(--ink); box-shadow: 8px 8px 0 var(--paper-2); padding: 14px; display: none; z-index: 60; }
.b-pop.open { display: grid; gap: 10px; }
.efaas-sq { display: grid; justify-items: center; gap: 10px; width: 100%; aspect-ratio: 1 / .78; background: #164998; color: #fff; border: 0; border-radius: 14px; cursor: pointer; padding: 18px; align-content: center; font: 600 15px "Inter", "Faruma", sans-serif; }
html[lang="dv"] .efaas-sq span { font: 400 18px/1.6 "MV Waheed", "Faruma", sans-serif; }
.efaas-sq:hover { background: #12407f; }
.bp-note { margin: 0; font-size: 12px; color: var(--muted); line-height: 1.6; }
.bp-me { display: flex; gap: 10px; align-items: center; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.bp-me b { display: block; font-size: 15px; }
html[lang="dv"] .bp-me b { font-family: "MV Waheed", "Faruma", sans-serif; font-weight: 400; }
.bp-me small { color: var(--muted); font-size: 12px; }
.bp-link { display: flex; gap: 10px; align-items: center; padding: 8px 6px; font-size: 14px; background: none; border: 0; cursor: pointer; color: var(--ink) !important; text-align: start; width: 100%; }
.bp-link:hover { background: var(--paper); }
.bp-link.out { color: var(--red) !important; border-top: 1px solid var(--line); padding-top: 10px; }
@media (max-width: 640px) { .b-tools > .b-user { display: none; } }
.b-credit { color: inherit !important; border-bottom: 1px solid rgba(255,255,255,.3); } .b-credit:hover { color: var(--gold) !important; }
/* drawer language switch: compact, sized to content, at the reading start (right in Dhivehi, left in English) */
.bd-lang { display: inline-flex; justify-self: start; width: auto; grid-template-columns: none; }
.bd-lang button { padding: 6px 14px; font-size: 13px; line-height: 1.4; }
.bd-lang button[lang="dv"] { font-size: 15px; padding: 5px 14px; }
.b-credit, .b-credit:hover { border-bottom: 0 !important; text-decoration: none !important; }
/* drawer footer: language switch, phone and email on one line */
.bd-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.bd-foot .bd-lang { flex: none; }
.bd-lang button { padding: 5px 11px; font-size: 12.5px; }
.bd-lang button[lang="dv"] { padding: 4px 11px; font-size: 14px; }
.bd-contact { flex: 1; min-width: 0; flex-wrap: nowrap; gap: 12px; justify-content: flex-end; font-size: 12px; }
.bd-contact a { white-space: nowrap; }
.bd-out { flex-basis: 100%; }

/* stacked layouts must shrink to the screen (1fr alone grows to the widest child's min-content) */
@media (max-width: 1100px) {
  .b-hero-grid, .b-two, .st-grid, .ab-intro, .ab-two, .ab-cmte, .ag-layout { grid-template-columns: minmax(0, 1fr) !important; }
  .b-hero-text, .b-hero-visual, .b-two > *, .st-grid > *, .ab-intro > *, .ab-two > *, .ag-layout > * { min-width: 0; }
}
@media (max-width: 860px) { .appeal-layout, .article-layout, .split, .g2, .g3 { grid-template-columns: minmax(0, 1fr) !important; } .appeal-layout > *, .article-layout > * { min-width: 0; } }
.b-bigsearch { max-width: 100%; min-width: 0; }
.b-facts { max-width: 100%; }
.b-facts > div { min-width: 0; }
.b-facts span { overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .b-row { grid-template-columns: 56px minmax(0, 1fr) auto !important; gap: 8px !important; }
  .b-case { overflow: hidden; text-overflow: ellipsis; }
  .b-st { padding: 3px 7px; font-size: 9.5px; letter-spacing: .04em; }
}
.st-side { grid-template-columns: minmax(0, 1fr); }
.st-card { min-width: 0; }
@media (max-width: 420px) { .st-legend { grid-template-columns: 1fr; } .st-bar { grid-template-columns: 92px minmax(0, 1fr) 22px; } }

.side-wrap { display: contents; } /* desktop: the wrapper adds no box */
/* phone section menu: priority+ (fit what we can, rest under "+n") */
@media (max-width: 860px) {
  html[data-ui="b"] .side.prio { overflow: visible; flex-wrap: nowrap; position: relative; }
  html[data-ui="b"] .side.prio > a[hidden] { display: none !important; }
  .side-more { flex: none; margin-inline-start: auto; display: flex; align-items: center; gap: 6px; padding: 0 14px; border: 0; border-inline-start: 1px solid var(--line); background: var(--paper); cursor: pointer; font: 700 12px "Inter", sans-serif; color: var(--ink); }
  .side-more i { width: 7px; height: 7px; border-inline-end: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: rotate(45deg) translateY(-2px); transition: transform .2s; }
  .side-more[aria-expanded="true"] i { transform: rotate(-135deg) translateY(-1px); }
  .side-more[aria-expanded="true"] { background: var(--ink); color: var(--paper); } .side-more[aria-expanded="true"] i { border-color: var(--paper); }
  .side-pop { position: absolute; top: calc(100% + 1px); inset-inline-end: -1px; min-width: 220px; max-width: calc(100vw - 32px); background: #fff; border: 1px solid var(--ink); box-shadow: 6px 6px 0 var(--paper-2); z-index: 30; display: none; }
  .side-pop.open { display: grid; }
  .side-pop a { padding: 11px 16px; border-bottom: 1px solid var(--line); color: var(--ink-2) !important; font-size: 15px; }
  .side-pop a:last-child { border-bottom: 0; }
  .side-pop a:hover { background: var(--paper); }
  html[lang="dv"] .side-pop a { font-family: "MV Waheed", "Faruma", sans-serif; font-size: 16px; }
}
@media (max-width: 860px) { html[data-ui="b"] .side a .si { display: none; } html[data-ui="b"] .side a { padding: 11px 14px; } }
@media (max-width: 860px) { html[data-ui="b"] .side, html[data-ui="b"] .side.prio { top: auto !important; inset: auto !important; } }

/* phone section menu v2: swipeable strip, half-visible next item, pinned "+n" with fade */
@media (max-width: 860px) {
  html[data-ui="b"] .side.prio { overflow-x: auto; overflow-y: hidden; scroll-behavior: smooth; position: relative; }
  html[data-ui="b"] .side.prio > a { flex: none; }
  .side-wrap { display: block; position: relative; min-width: 0; }
  .side-more { position: absolute; top: 1px; bottom: 1px; margin: 0; z-index: 2; box-shadow: none; }
  html:not([dir="rtl"]) .side-more { right: 1px; }
  html[dir="rtl"] .side-more { left: 1px; }
  .side-more i { border: 0 !important; border-right: 2px solid var(--ink) !important; border-bottom: 2px solid var(--ink) !important; } /* a down chevron in both languages */
  .side-more[aria-expanded="true"] i { border-color: var(--paper) !important; }
  html:not([dir="rtl"]) .side-more { box-shadow: -18px 0 14px -4px rgba(255, 255, 255, .95); }
  html[dir="rtl"] .side-more { box-shadow: 18px 0 14px -4px rgba(255, 255, 255, .95); }
  .side-pop { position: absolute; inset-inline: auto; min-width: 220px; max-width: calc(100vw - 32px); }
  .side-pop a.on { color: var(--brand) !important; font-weight: 700; }
}

/* ---------- tablet home (641–1100px: iPad portrait/landscape) ---------- */
@media (min-width: 641px) and (max-width: 1100px) {
  /* hero: headline full width, then photo and "Can I appeal?" side by side instead of a tall overlapping stack */
  .b-hero-grid { padding-block: 44px 48px; gap: 32px; }
  .b-hero-text { max-width: 720px; }
  .b-hero-visual { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); gap: 0; align-items: stretch; }
  .b-photo { aspect-ratio: auto; height: 100%; min-height: 260px; border-inline-end: 0; }
  .b-hero-visual .b-check { margin: 0; box-shadow: none; border: 1px solid var(--ink); }

  /* tasks: the main task (appeal) is a full-width row, the other four sit 2 × 2 as compact rows; no orphan, no tall empty cards */
  .b-taskgrid { grid-template-columns: 1fr 1fr; }
  .b-taskgrid li { border-bottom: 1px solid var(--line); border-inline-start: 0 !important; }
  .b-taskgrid li:nth-child(odd):not(:first-child) { border-inline-start: 1px solid var(--line) !important; }
  .b-taskgrid li:nth-child(n+4) { border-bottom: 0; }
  .b-taskgrid li:first-child { grid-column: 1 / -1; }
  .b-taskgrid a { display: grid; grid-template-columns: 40px minmax(0, 1fr) 24px; grid-template-rows: auto auto; column-gap: 16px; row-gap: 2px; align-items: center; padding: 20px 22px; }
  .b-taskgrid .b-n { display: none; }
  .b-taskgrid .b-ti { grid-row: 1 / 3; margin: 0; width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--line); }
  .b-taskgrid b { grid-column: 2; align-self: end; }
  .b-taskgrid small { grid-column: 2; align-self: start; }
  .b-taskgrid .b-go { grid-column: 3; grid-row: 1 / 3; margin: 0; padding: 0; }
  .b-taskgrid li:first-child a { background: var(--paper); padding-block: 24px; }
  .b-taskgrid li:first-child a:hover { background: var(--ink); }
  .b-taskgrid li:first-child .b-ti { background: var(--brand); border-color: var(--brand); color: #fff; }
  .b-taskgrid li:first-child a:hover .b-ti { background: var(--gold); border-color: var(--gold); color: var(--ink); }
  html[lang="en"] .b-taskgrid li:first-child b { font-size: 26px; }
  html[lang="en"] .b-taskgrid b { font-size: 21px; }

  /* stats: open-cases strip on one line; the two small cards side by side */
  .st-kpi.st-open { flex-direction: row; align-items: center; gap: 18px; padding-block: 12px; }
  .st-kpi.st-open > b { font-size: 36px; order: -1; align-self: center; }
  .st-kpi.st-open .st-foot { margin: 0 0 0 auto; }
  html[dir="rtl"] .st-kpi.st-open .st-foot { margin: 0 auto 0 0; }
  .st-side { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
  .st-legend { grid-template-columns: 1fr; }
  .st-bar { grid-template-columns: 128px minmax(0, 1fr) 24px; }

  /* deadlines: five steps still fit in one row */
  .b-time-line li { padding-inline-end: 12px; }
  .b-time-line b { font-size: 18px; }
  html[lang="en"] .b-time-line b { font-size: 20px; }
  .b-time-line span { font-size: 13px; }
  .b-cta { padding: 26px 28px; }
}
/* landscape tablet: room for decisions + news side by side, the hearing room, and a 4-column footer */
@media (min-width: 900px) and (max-width: 1100px) {
  .b-two { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 40px; }
  .b-row { grid-template-columns: 74px 56px 1fr 150px 100px; }
  .b-room { display: block; }
  .b-foot-cols { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .b-hero-visual { grid-template-columns: minmax(0, 1fr) 400px; }
}
/* large tablet / small laptop (1101–1240px): desktop layout, a little tighter */
@media (min-width: 1101px) and (max-width: 1240px) {
  .b-hero-grid { gap: 36px; }
  .b-hero-visual .b-check { width: min(340px, 78%); inset-inline-end: -8px; }
  .b-taskgrid a { padding: 20px 16px 18px; }
  html[lang="en"] .b-taskgrid b { font-size: 19px; }
  .b-row { grid-template-columns: 80px 60px 170px 1fr 140px 100px; }
}

/* home: rolling photo gallery in the hero (one photo at a time) + guidance cards */
.b-gal { background: var(--ink); isolation: isolate; } /* slides stack inside the photo, never over the "Can I appeal?" card */
.b-gal .b-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .9s ease; }
.b-gal .b-slide.on { opacity: 1; z-index: 1; }
.b-gal .b-slide img { width: 100%; height: 100%; object-fit: cover; filter: sepia(.35) saturate(.85) contrast(1.05); }
.b-gal .b-slide { overflow: hidden; }
.b-gal .b-slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(21, 17, 13, 0) 50%, rgba(21, 17, 13, .6)); }
.b-gal::after { display: none; }
.b-gal .b-slide figcaption { position: absolute; bottom: 14px; inset-inline-start: 14px; z-index: 2; color: #fff; font-size: 12px; letter-spacing: .06em; }
.b-gdots { position: absolute; top: 14px; inset-inline-end: 14px; z-index: 3; display: flex; gap: 6px; }
.b-gdots button { width: 22px; height: 4px; border: 0; padding: 0; background: rgba(255, 255, 255, .45); cursor: pointer; }
.b-gdots button.on { background: var(--gold); }
@media (prefers-reduced-motion: reduce) { .b-gal .b-slide { transition: none; } }
.b-guide-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--ink); background: #fff; }
.b-guide-grid li { padding: 24px 24px 22px; display: flex; flex-direction: column; gap: 6px; }
.b-guide-grid li + li { border-inline-start: 1px solid var(--line); }
.b-guide-grid .b-n { font: 500 12px "Inter", sans-serif; color: var(--muted); }
.b-guide-grid .b-ti { color: var(--brand); margin: 6px 0 4px; }
.b-guide-grid h3 { font-size: 20px; margin: 0; }
html[lang="en"] .b-guide-grid h3 { font-family: var(--serif); font-weight: 500; font-size: 23px; }
.b-guide-grid p { margin: 0; color: var(--ink-2); font-size: 15px; }
@media (max-width: 760px) { .b-guide-grid { grid-template-columns: minmax(0, 1fr); } .b-guide-grid li + li { border-inline-start: 0; border-top: 1px solid var(--line); } }
.b-hero-visual .b-check { z-index: 2; }