/* =====================================================================
   ESGTrack app theme — the home page's look inside the product.
   Loaded after style.css: it re-defines the design tokens and restyles
   components only (no markup or behaviour changes).
   ===================================================================== */
:root {
  --color-primary: #0f6e46; --color-primary-dark: #0b5737; --color-primary-light: #e7f4ed; --color-primary-soft: #e7f4ed;
  --color-ink: #0b1220; --color-text: #0b1220; --color-text-muted: #4f5b6b; --color-text-secondary: #4f5b6b;
  --color-bg: #f3f6f4; --color-surface: #ffffff; --color-surface-alt: #f7faf8; --color-surface-muted: #f3f6f4;
  --color-border: #e3e8ee; --color-border-strong: #cfd8e0;
  --color-sidebar-bg: #04110b; --color-sidebar-bg-2: #0a1f17; --color-sidebar-text: #a9cdbd; --color-sidebar-active: #4fd68c;
  --topbar-height: 60px;
  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 18px;
  --shadow-sm: 0 1px 2px rgba(11, 18, 32, .05); --shadow-md: 0 1px 2px rgba(11, 18, 32, .05), 0 10px 28px rgba(11, 18, 32, .07);
  --font-base: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  --t-dark: #04110b; --t-dark-2: #0a1f17; --t-dark-line: rgba(167, 243, 208, .14); --t-on-dark: #e9f7f0; --t-on-dark-2: #a9cdbd; --t-mint: #4fd68c; --t-mint-2: #a7f3d0;
  --t-hero: radial-gradient(520px 260px at 12% 0%, rgba(26, 155, 98, .38), transparent 70%), radial-gradient(460px 260px at 95% 110%, rgba(14, 116, 144, .22), transparent 70%), linear-gradient(160deg, #04110b, #0a1f17);
  --t-grid: linear-gradient(rgba(167,243,208,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(167,243,208,.07) 1px, transparent 1px);
}
body { font-family: var(--font-base); background: var(--color-bg); color: var(--color-text); -webkit-font-smoothing: antialiased; }
h1, h2, h3 { letter-spacing: -.02em; }
::selection { background: rgba(79, 214, 140, .35); }
:focus-visible { outline: 3px solid rgba(15, 110, 70, .55); outline-offset: 2px; }

/* ---------- sidebar: the hero's dark field, glow and grid ---------- */
.sidebar { background: var(--t-dark); border-right: 1px solid var(--t-dark-line); position: fixed; overflow: hidden; }
.sidebar::before { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: radial-gradient(260px 220px at 20% 0%, rgba(26, 155, 98, .35), transparent 70%), radial-gradient(240px 260px at 100% 100%, rgba(14, 116, 144, .18), transparent 70%); }
.sidebar::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0; opacity: .5; background-image: var(--t-grid); background-size: 40px 40px;
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 45%); mask-image: linear-gradient(180deg, #000, transparent 45%); }
.sidebar > * { position: relative; z-index: 1; }
.sidebar-head { border-bottom-color: var(--t-dark-line); }
.brand-mark { background: linear-gradient(135deg, #1a9b62, #0b5737) !important; color: var(--t-mint-2) !important; border-radius: 10px !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 6px 18px rgba(26,155,98,.35); }
.brand-text strong { color: var(--t-on-dark); letter-spacing: -.01em; font-weight: 750; }
.brand-text small { color: var(--t-on-dark-2); }
.sidebar-collapse-btn { color: var(--t-on-dark-2); border-radius: 8px; }
.sidebar-collapse-btn:hover { background: rgba(255,255,255,.06); color: var(--t-on-dark); }
.sidebar-user { background: rgba(255,255,255,.04); border: 1px solid var(--t-dark-line); border-radius: 14px; }
.sidebar-user:hover { background: rgba(255,255,255,.07); }
.su-avatar { background: linear-gradient(135deg, #1a9b62, #0f6e46) !important; color: #fff !important; }
.su-meta strong, .su-meta b { color: var(--t-on-dark); }
.sidebar-search { background: rgba(255,255,255,.04); border: 1px solid var(--t-dark-line); border-radius: 12px; }
.sidebar-search input { color: var(--t-on-dark); }
.sidebar-search input::placeholder { color: #86a99a; }
.sidebar-search kbd, .sidebar-search .kbd { background: rgba(255,255,255,.06); border-color: var(--t-dark-line); color: var(--t-on-dark-2); }
.sidebar-section-label { color: #6f9483; letter-spacing: .1em; font-size: 10.5px; font-weight: 700; }
.sidebar-link, .sidebar-sublink { color: var(--t-on-dark-2); border-radius: 10px; border-left: 0 !important; transition: background .15s, color .15s; }
.sidebar-link:hover, .sidebar-sublink:hover { background: rgba(255,255,255,.06); color: var(--t-on-dark); }
.sidebar-link.active, .sidebar-sublink.active, .sidebar-link.has-active { background: rgba(79, 214, 140, .13); color: var(--t-mint) !important; font-weight: 650; box-shadow: inset 3px 0 0 var(--t-mint); }
.sidebar-link.active svg, .sidebar-sublink.active svg { color: var(--t-mint); }
.nav-badge { background: var(--t-mint); color: #04110b; border-radius: 999px; font-weight: 700; }
.sidebar-help { background: linear-gradient(135deg, rgba(26,155,98,.22), rgba(14,116,144,.14)); border: 1px solid var(--t-dark-line); border-radius: 14px; }
.sidebar-help .sh-icon { background: var(--color-primary); border-radius: 10px; }
.sidebar-pins { border-bottom-color: var(--t-dark-line); }

/* ---------- top bar: the home page header ---------- */
.topbar { background: rgba(4, 17, 11, .96); border-bottom: 1px solid var(--t-dark-line); height: var(--topbar-height); color: var(--t-on-dark); backdrop-filter: saturate(160%) blur(12px); -webkit-backdrop-filter: saturate(160%) blur(12px); }
.topbar-left strong { color: var(--t-on-dark); font-weight: 700; letter-spacing: -.01em; }
.topbar .hamburger { color: var(--t-on-dark); }
.entity-switcher-btn { background: rgba(255,255,255,.05); border: 1px solid var(--t-dark-line); color: var(--t-on-dark); border-radius: 10px; }
.entity-switcher-btn:hover { background: rgba(255,255,255,.09); }
.notif-trigger { color: var(--t-on-dark-2); border-radius: 10px; }
.notif-trigger:hover { background: rgba(255,255,255,.07); color: var(--t-on-dark); }
.notif-trigger.is-pinned, .pin-toggle.is-pinned { color: var(--t-mint); }
.topbar .badge-neutral { background: rgba(79,214,140,.12); color: var(--t-mint-2); border: 1px solid var(--t-dark-line); }
.topbar-user, .topbar-user .username { color: var(--t-on-dark); }
.topbar .avatar { background: linear-gradient(135deg, #4fd68c, #1a9b62); color: #04110b; font-weight: 750; }
.notif-dot { background: #f97066; box-shadow: 0 0 0 2px var(--t-dark); }
/* menus that open from the top bar stay light, readable panels */
.entity-switcher-menu, .notif-panel, .profile-menu { background: #fff; color: var(--color-text); border: 1px solid var(--color-border); border-radius: 16px; box-shadow: 0 24px 60px rgba(4, 17, 11, .22); overflow: hidden; }
.entity-switcher-menu a, .profile-menu a, .profile-menu .pm-item, .notif-panel a { color: var(--color-text); }
.breadcrumb-bar { background: rgba(255,255,255,.75); border-bottom: 1px solid var(--color-border); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }

/* ---------- page headers: a compact hero card ---------- */
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) { position: relative; isolation: isolate; overflow: hidden; background: var(--t-hero); color: var(--t-on-dark); border-radius: 20px; padding: 22px 26px; margin-bottom: 20px; box-shadow: 0 18px 40px rgba(4, 17, 11, .18); }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head)::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .55; background-image: var(--t-grid); background-size: 36px 36px;
  -webkit-mask-image: radial-gradient(ellipse at 20% 0%, #000 25%, transparent 75%); mask-image: radial-gradient(ellipse at 20% 0%, #000 25%, transparent 75%); }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) h1, .dash-greeting { color: #fff !important; font-weight: 760; letter-spacing: -.025em; }
.dash-greeting { font-size: 26px; }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) h1 svg { color: var(--t-mint); }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) :is(.subtitle, .dash-sub, .text-muted, .text-sm, .text-xs, p) { color: var(--t-on-dark-2) !important; }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) a:not(.btn) { color: var(--t-mint-2); }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) :is(.btn-secondary, .btn-outline, .btn-ghost, .rp-theme-btn) { background: rgba(255,255,255,.07) !important; color: var(--t-on-dark) !important; border: 1px solid rgba(255,255,255,.18) !important; box-shadow: none !important; }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) :is(.btn-secondary, .rp-theme-btn):hover { background: rgba(255,255,255,.12) !important; }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) .rp-theme-btn * { color: var(--t-on-dark) !important; }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) .badge { background: rgba(255,255,255,.08); color: var(--t-on-dark); border: 1px solid var(--t-dark-line); }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) .form-control { background: rgba(255,255,255,.06); color: var(--t-on-dark); border-color: rgba(255,255,255,.2); }
:is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) .form-control option { color: #0b1220; }
:is(.env-head-icon, .rp-title-icon) { background: rgba(79,214,140,.14) !important; color: var(--t-mint) !important; border: 1px solid var(--t-dark-line) !important; }
.dash-head-right > *:not(.btn) { background: rgba(255,255,255,.06) !important; border: 1px solid var(--t-dark-line) !important; border-radius: 14px !important; color: var(--t-on-dark) !important; box-shadow: none !important; }
.dash-head-right > *:not(.btn) * { color: var(--t-on-dark) !important; }
.dash-head .deadline-badge { background: rgba(79,214,140,.16) !important; color: var(--t-mint) !important; border: 1px solid var(--t-dark-line) !important; }
.dash-head .deadline-badge svg { color: var(--t-mint) !important; }
.dash-head-right .deadline-strip-bar { background: rgba(255,255,255,.12) !important; }
.dash-head-right .deadline-strip-bar * { background: var(--t-mint) !important; }

/* ---------- cards and KPI tiles ---------- */
.card { border-radius: 18px; border: 1px solid var(--color-border); box-shadow: 0 1px 2px rgba(11,18,32,.04), 0 8px 24px rgba(11,18,32,.04); }
.card-title { font-weight: 700; letter-spacing: -.01em; color: var(--color-text); }
.card-title svg, .env-card-title svg { color: var(--color-primary); }
.env-kpi, .stat-card { border-radius: 16px; box-shadow: 0 1px 2px rgba(11,18,32,.04), 0 8px 24px rgba(11,18,32,.04); }
.env-kpi-value, .stat-value { letter-spacing: -.03em; font-weight: 780; }
.env-ws, .env-card { border-radius: 18px; }
.env-ws { transition: transform .2s, box-shadow .2s, border-color .2s; }
.env-ws:hover { transform: translateY(-3px); }
.env-preview { border-radius: 14px; background: linear-gradient(180deg, #f7faf8, #f1f6f3); }
.hub-big { letter-spacing: -.03em; font-weight: 780; }

/* ---------- buttons (the home page's) ---------- */
.btn { border-radius: 12px; font-weight: 650; letter-spacing: -.005em; transition: transform .15s, background .15s, box-shadow .15s, border-color .15s; }
.btn:hover { transform: translateY(-1px); }
.btn-sm { border-radius: 10px; }
.btn-primary { background: var(--color-primary); border-color: var(--color-primary); color: #fff; box-shadow: 0 8px 20px rgba(15, 110, 70, .28); }
.btn-primary:hover { background: #12804f; border-color: #12804f; }
.btn-secondary { background: #fff; border: 1px solid var(--color-border); color: var(--color-text); }
.btn-secondary:hover { border-color: var(--color-border-strong); background: #fff; }
.btn-outline-danger { border-radius: 12px; }
.link-btn { color: var(--color-primary); font-weight: 600; }

/* ---------- forms ---------- */
.form-control { border-radius: 10px; border: 1px solid #d3dbe3; min-height: 40px; transition: border-color .15s, box-shadow .15s; background-color: #fff; }
.form-control:hover { border-color: #b9c4cf; }
.form-control:focus { border-color: var(--color-primary); box-shadow: 0 0 0 4px rgba(15, 110, 70, .14); outline: none; }
.form-label, label.form-label { font-weight: 600; color: #273246; }
.env-seg { border-radius: 12px; } .env-seg label { border-radius: 9px; }
.env-drop { border-radius: 14px; }

/* ---------- tables ---------- */
.data-table th { background: #f7faf8; color: #4f5b6b; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; border-bottom: 1px solid var(--color-border); }
.data-table td { border-bottom-color: #eef2f5; }
.data-table tbody tr { transition: background .12s; }
.data-table tbody tr:hover { background: #f5f9f7; }

/* ---------- badges, alerts ---------- */
.badge { border-radius: 999px; padding: 3px 10px; font-weight: 650; font-size: 12px; letter-spacing: 0; }
.alert { border-radius: 14px; padding: 12px 16px; border-width: 1px; }
.alert-warning { background: #fff8e6; border-color: #f4dfaa; }
.alert-success { background: #e9f7f0; border-color: #bfe6d1; }
.alert-danger { background: #fdeeee; border-color: #f4c7c3; }
.alert-info { background: #eef4ff; border-color: #cbdcfb; }

/* ---------- tabs: the home page's pills ---------- */
.report-tabs, .env-tabs { border-bottom: 0 !important; background: none !important; padding: 0 !important; gap: 6px !important; flex-wrap: wrap; box-shadow: none !important; }
.rt-tab, .env-tabs [role="tab"], .tab-btn { border: 1px solid var(--color-border) !important; background: #fff !important; border-radius: 999px !important; padding: 8px 16px !important; font-weight: 600 !important; color: #273246 !important; margin: 0 !important; }
.rt-tab:hover, .env-tabs [role="tab"]:hover, .tab-btn:hover { border-color: var(--color-border-strong) !important; }
.rt-tab.active, .env-tabs [role="tab"][aria-selected="true"], .tab-btn.active { background: #0b1220 !important; color: #fff !important; border-color: #0b1220 !important; }
.rt-tab.active svg, .env-tabs [role="tab"][aria-selected="true"] svg { color: var(--t-mint); }

/* ---------- modals, palette ---------- */
.modal { border-radius: 20px; box-shadow: 0 30px 80px rgba(4, 17, 11, .3); }
.cmdk-dialog { border-radius: 18px; }

/* ---------- page entrance (subtle; off for reduced motion) ---------- */
@keyframes tUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.page-content > :is(.page-header, .env-head, .dash-head, .rp-header, .rs-head), .page-content > .env-kpis, .page-content > .card, .page-content > .env-layout { animation: tUp .35s ease both; }
.page-content > .env-kpis { animation-delay: .05s; } .page-content > .env-layout { animation-delay: .1s; }
@media (prefers-reduced-motion: reduce) { .page-content > * { animation: none !important; } .btn, .env-ws, .sidebar-link { transition: none !important; } .btn:hover, .env-ws:hover { transform: none; } }

/* ---------- scrollbars ---------- */
* { scrollbar-width: thin; scrollbar-color: #c8d3cd transparent; }
.sidebar * { scrollbar-color: rgba(167,243,208,.2) transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; } ::-webkit-scrollbar-thumb { background: #c8d3cd; border-radius: 10px; border: 2px solid transparent; background-clip: padding-box; }
.sidebar ::-webkit-scrollbar-thumb { background: rgba(167,243,208,.2); background-clip: padding-box; }

/* ---------- sign-in pages ---------- */
.auth-shell { background: var(--t-hero); position: relative; isolation: isolate; }
.auth-shell::before { content: ""; position: fixed; inset: 0; z-index: -1; opacity: .5; background-image: var(--t-grid); background-size: 48px 48px;
  -webkit-mask-image: radial-gradient(ellipse at 50% 20%, #000 30%, transparent 75%); mask-image: radial-gradient(ellipse at 50% 20%, #000 30%, transparent 75%); }
.auth-card { border-radius: 24px !important; border: 1px solid rgba(255,255,255,.4); box-shadow: 0 40px 100px rgba(0, 0, 0, .45) !important; }

/* ---------- small screens and right-to-left ---------- */
@media (max-width: 560px) {
  .env-kpis { grid-template-columns: 1fr 1fr; gap: 10px; }
  .env-kpi { padding: 12px 13px; } .env-kpi-value { font-size: 1.3rem; }
  .alert { display: block; } .alert > svg { vertical-align: -3px; margin-inline-end: 6px; }
  :is(.page-header, .env-head, .dash-head, .rp-header, .rs-head) { padding: 18px; border-radius: 18px; }
}
[dir="rtl"] :is(.sidebar-link.active, .sidebar-sublink.active, .sidebar-link.has-active) { box-shadow: inset -3px 0 0 var(--t-mint); }

/* ---------- app-wide experience (ux.js) ---------- */
.btn.is-loading { position: relative; color: transparent !important; pointer-events: none; }
.btn.is-loading::after { content: ""; position: absolute; inset: 0; margin: auto; width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(255,255,255,.55); border-top-color: #fff; animation: tSpin .7s linear infinite; }
.btn-secondary.is-loading::after, .btn-outline-danger.is-loading::after { border-color: rgba(15,110,70,.25); border-top-color: var(--color-primary); }
@keyframes tSpin { to { transform: rotate(360deg); } }
.toast-region { position: fixed; top: calc(var(--topbar-height) + 14px); right: 18px; z-index: 1500; display: flex; flex-direction: column; gap: 10px; max-width: min(420px, calc(100vw - 36px)); }
[dir="rtl"] .toast-region { right: auto; left: 18px; }
.alert.toast { margin: 0; display: flex; align-items: center; gap: 10px; background: #0b1f17; color: #e9f7f0; border: 1px solid rgba(167,243,208,.18); box-shadow: 0 18px 40px rgba(4,17,11,.3); padding-right: 40px; position: relative; animation: tToast .3s ease both; }
.alert.toast svg { color: var(--t-mint); flex-shrink: 0; }
.toast-close { position: absolute; top: 6px; right: 8px; background: none; border: 0; color: #a9cdbd; font-size: 20px; line-height: 1; cursor: pointer; padding: 4px 6px; border-radius: 6px; }
[dir="rtl"] .toast-close { right: auto; left: 8px; }
.toast-close:hover { color: #fff; background: rgba(255,255,255,.08); }
@keyframes tToast { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.table-scroll, .table-wrap { background: linear-gradient(90deg, #fff 30%, rgba(255,255,255,0)), linear-gradient(270deg, #fff 30%, rgba(255,255,255,0)) 100% 0, radial-gradient(farthest-side at 0 50%, rgba(11,18,32,.14), transparent), radial-gradient(farthest-side at 100% 50%, rgba(11,18,32,.14), transparent) 100% 0;
  background-repeat: no-repeat; background-size: 40px 100%, 40px 100%, 14px 100%, 14px 100%; background-attachment: local, local, scroll, scroll; }
.to-top { position: fixed; bottom: 22px; right: 22px; z-index: 900; width: 44px; height: 44px; border-radius: 14px; border: 1px solid rgba(167,243,208,.2); background: #0b1f17; color: #e9f7f0; font-size: 18px; cursor: pointer; box-shadow: 0 14px 30px rgba(4,17,11,.3); opacity: 0; transform: translateY(10px); pointer-events: none; transition: opacity .2s, transform .2s; }
.to-top.show { opacity: 1; transform: none; pointer-events: auto; }
[dir="rtl"] .to-top { right: auto; left: 22px; }
.empty-state { padding: 36px 20px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.empty-state > svg { width: 56px; height: 56px; padding: 13px; border-radius: 18px; background: var(--color-primary-light); color: var(--color-primary); }
.empty-title { font-weight: 700; font-size: 15px; color: var(--color-text); }
.empty-sub { color: var(--color-text-muted); font-size: 13.5px; max-width: 420px; }
.form-control:user-invalid { border-color: #c2261c; box-shadow: 0 0 0 4px rgba(194, 38, 28, .1); }
.req { color: #c2261c; }
@media (prefers-reduced-motion: reduce) { .alert.toast, .btn.is-loading::after { animation: none !important; } .to-top { transition: none; } }
.env-matrix th[scope="row"] { font-weight: 600; white-space: nowrap; }
.env-matrix td input { min-width: 64px; }
.env-hist { margin-top: 6px; }
.lp-timeline { list-style: none; margin: 10px 0 0; padding: 0; position: relative; }
.lp-timeline::before { content: ""; position: absolute; left: 7px; top: 6px; bottom: 6px; width: 2px; background: #dbe5df; }
.lp-timeline li { position: relative; padding: 0 0 12px 26px; font-size: 13.5px; color: #273246; }
.lp-timeline li::before { content: ""; position: absolute; left: 2px; top: 5px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--color-primary); }
.lp-timeline li small { display: block; color: var(--color-text-muted); font-size: 12px; }
[dir="rtl"] .lp-timeline::before { left: auto; right: 7px; } [dir="rtl"] .lp-timeline li { padding: 0 26px 12px 0; } [dir="rtl"] .lp-timeline li::before { left: auto; right: 2px; }
/* ---------- My Tasks ---------- */
.mt-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.mt-search { position: relative; min-width: 240px; flex: 0 1 320px; } .mt-search svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--color-text-muted); }
.mt-search input { padding-left: 34px; } [dir="rtl"] .mt-search svg { left: auto; right: 12px; } [dir="rtl"] .mt-search input { padding-left: 12px; padding-right: 34px; }
.mt-group { margin-top: 18px; }
.mt-group-title { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #4f5b6b; margin: 0 0 8px; cursor: default; }
.mt-overdue .mt-group-title { color: #b42318; } .mt-group summary.mt-group-title { cursor: pointer; list-style: none; } .mt-group summary::-webkit-details-marker { display: none; }
.mt-count { background: var(--color-surface-alt); border: 1px solid var(--color-border); border-radius: 999px; padding: 1px 8px; font-size: 11.5px; color: #4f5b6b; letter-spacing: 0; }
.mt-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.mt-item { display: grid; grid-template-columns: auto 1fr auto auto; gap: 14px; align-items: center; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: 14px; background: #fff; transition: border-color .15s, box-shadow .15s; }
.mt-item:hover { border-color: var(--color-border-strong); box-shadow: 0 6px 18px rgba(11,18,32,.06); }
.mt-overdue .mt-item { border-left: 3px solid #d92d20; } [dir="rtl"] .mt-overdue .mt-item { border-left: 1px solid var(--color-border); border-right: 3px solid #d92d20; }
.mt-ic { width: 36px; height: 36px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; background: var(--color-primary-light); color: var(--color-primary); }
.mt-ic.section { background: #eef4ff; color: #1f56c4; }
.mt-title { font-weight: 650; } .mt-sub { font-size: 12.5px; color: var(--color-text-muted); margin-top: 2px; }
.mt-meter { margin-top: 8px; max-width: 260px; }
.mt-due { font-size: 12.5px; font-weight: 650; text-align: right; color: #273246; white-space: nowrap; } .mt-due small { display: block; font-weight: 500; color: var(--color-text-muted); }
.mt-due.overdue { color: #b42318; } .mt-due.week { color: #9a5b00; } [dir="rtl"] .mt-due { text-align: left; }
.mt-actions { display: flex; gap: 8px; align-items: center; } .mt-status select { min-width: 140px; }
/* update 103: the work queue */
.mt-group-hint { font-weight: 500; text-transform: none; letter-spacing: 0; color: var(--color-text-muted); font-size: 12px; }
.mt-chip-n { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 2px; border-radius: 999px; background: rgba(15,23,42,.07); font-size: 11px; font-weight: 700; text-align: center; }
.env-seg input:checked + label .mt-chip-n { background: rgba(4,17,11,.32); color: #fff; }   /* (a light chip under white text fell below 4.5:1) */
.mt-ic.k-fix, .mt-ic.k-security, .mt-ic.k-privacy { background: #fdecea; color: #b42318; }
.mt-ic.k-approve, .mt-ic.k-filing, .mt-ic.k-assurer, .mt-ic.k-supplier { background: #fff4e5; color: #9a5b00; }
.mt-ic.k-section, .mt-ic.k-assurance, .mt-ic.k-calendar { background: #eef4ff; color: #1f56c4; }
.mt-ic.k-draft, .mt-ic.k-regulatory, .mt-ic.k-anomaly, .mt-ic.k-setup, .mt-ic.k-control, .mt-ic.k-case { background: #f2f0fb; color: #5b45b0; }
.mt-team-card { margin-top: 16px; } .mt-team-note { margin: -4px 0 10px; } .mt-team .mt-title { font-weight: 600; }
.mt-caught-up { display: flex; gap: 14px; align-items: flex-start; padding: 22px 6px 10px; }
.mt-caught-up h2 { font-size: 16px; margin: 0 0 4px; } .mt-caught-up p { margin: 0; max-width: 640px; }
.mt-caught-ic { width: 44px; height: 44px; border-radius: 14px; background: var(--color-primary-light); color: var(--color-primary); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.btn-ghost { background: transparent; border-color: transparent; color: var(--color-primary); box-shadow: none; } .btn-ghost:hover { background: var(--color-primary-light); }
.badge-muted { background: #f1f3f5; color: #4f5b6b; }
@media (max-width: 760px) { .mt-item { grid-template-columns: auto 1fr; } .mt-due { text-align: left; grid-column: 2; } .mt-actions { grid-column: 1 / -1; flex-wrap: wrap; } }
/* Scroll containers own their absolutely positioned children (e.g. visually hidden labels in table cells), so those
   can't escape the clipping and widen the page on phones. */
.table-scroll, .table-wrap, .env-heat-wrap { position: relative; }
/* Long unbreakable strings (URLs, entity IDs, fingerprints) wrap instead of widening the page */
.page-content { overflow-wrap: break-word; }
.page-content :is(code, kbd, .text-xs, .mono, .copy-field) { overflow-wrap: anywhere; }
.page-content :is(img, svg, iframe, video, canvas) { max-width: 100%; }
/* Small screens: inline two-column grids stack; fixed-width side columns wrap; the report designer stacks and its
   A4 canvas scrolls inside its own area. */
@media (max-width: 900px) {
  .page-content .grid[style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
  .page-content .rd-shell { flex-direction: column; height: auto; }
  .page-content .rd-props { width: 100% !important; max-width: 100%; }
}
.page-content .rd-canvas-wrap { min-width: 0; max-width: 100%; }
@media (max-width: 640px) {
  .page-content :has(> form.no-print[style*="flex-shrink:0"]) { flex-wrap: wrap; }
  .page-content form.no-print[style*="flex-shrink:0"] { min-width: 0 !important; flex: 1 1 100% !important; }
}
/* ---------- questionnaires: navigator, question state, sticky save bar ---------- */
.qnav { position: sticky; top: calc(var(--topbar-height) + 10px); z-index: 30; background: rgba(255,255,255,.94); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid var(--color-border); border-radius: 16px; padding: 10px 14px; margin-bottom: 14px; box-shadow: 0 8px 24px rgba(11,18,32,.06); }
.qnav-head { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.qnav-sum { display: flex; align-items: center; gap: 10px; min-width: 210px; } .qnav-label { font-size: 13.5px; white-space: nowrap; }
.qnav-meter { flex: 1; min-width: 80px; height: 6px; border-radius: 6px; background: #e6ece9; overflow: hidden; } .qnav-meter i { display: block; height: 100%; background: linear-gradient(90deg, #1a9b62, #4fd68c); width: 0; transition: width .3s; }
.qnav-legend { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--color-text-muted); margin-inline-start: auto; }
.qnav-legend .k { width: 10px; height: 10px; border-radius: 3px; display: inline-block; margin-inline-start: 8px; } .qnav-legend .k.answered { background: #12804f; } .qnav-legend .k.edited { background: #d38b0b; } .qnav-legend .k.empty { background: #fff; border: 1.5px solid #b9c4cf; }
.qnav-chips { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; max-height: 76px; overflow-y: auto; padding: 2px; }
.qchip { min-width: 34px; height: 30px; padding: 0 8px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 650; text-decoration: none; border: 1.5px solid #b9c4cf; color: #273246; background: #fff; }
.qchip.answered { background: #12804f; border-color: #12804f; color: #fff; } .qchip.edited { background: #fff4e0; border-color: #d38b0b; color: #7a4a00; }
.qchip.is-current { box-shadow: 0 0 0 3px rgba(15,110,70,.28); } .qchip:hover { border-color: var(--color-primary); }
.brsr-question-block { position: relative; scroll-margin-top: calc(var(--topbar-height) + 150px); transition: background .3s; border-radius: 12px; }
.brsr-question-block.is-pending { box-shadow: inset 3px 0 0 #d38b0b; padding-left: 12px; } [dir="rtl"] .brsr-question-block.is-pending { box-shadow: inset -3px 0 0 #d38b0b; padding-left: 0; padding-right: 12px; }
.brsr-question-block.is-answered .brsr-qno { color: var(--color-primary); }
.brsr-question-block.is-flash { background: #eaf7f0; }
.brsr-savebar { position: sticky; bottom: 12px; z-index: 25; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; box-shadow: 0 -4px 24px rgba(11,18,32,.08), 0 12px 30px rgba(11,18,32,.12); border-color: #d5dde5; }
.savebar-status { margin-inline-end: auto; font-size: 13.5px; color: #273246; } .savebar-status .unsaved { color: #9a5b00; font-weight: 650; }
@media (max-width: 640px) { .qnav-legend { display: none; } .qnav-chips { max-height: 40px; } }
@media print { .qnav, .savebar-status { display: none !important; } .brsr-savebar { position: static; } }
.qchip-group { font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--color-text-muted); align-self: center; padding: 0 4px 0 8px; border-left: 1px solid var(--color-border); margin-left: 4px; }
.qchip-group:first-child { border-left: 0; margin-left: 0; padding-left: 0; }
[dir="rtl"] .qchip-group { border-left: 0; border-right: 1px solid var(--color-border); margin-left: 0; margin-right: 4px; padding: 0 8px 0 4px; } [dir="rtl"] .qchip-group:first-child { border-right: 0; margin-right: 0; }
/* ---------- BRSR Core ---------- */
.bc-method summary { cursor: pointer; list-style: none; display: flex; gap: 8px; align-items: flex-start; } .bc-method summary::-webkit-details-marker { display: none; }
.bc-method summary::after { content: "Details"; margin-inline-start: auto; font-size: 12px; font-weight: 650; text-decoration: underline; white-space: nowrap; }
.bc-method[open] summary::after { content: "Hide"; } .bc-method p { margin-top: 10px; }
.bc-cats .env-ws { min-height: 0; }
.bc-cat { scroll-margin-top: calc(var(--topbar-height) + 16px); }
.bc-val strong { font-variant-numeric: tabular-nums; }
.bc-about summary { cursor: pointer; list-style: none; margin: 0; } .bc-about summary::-webkit-details-marker { display: none; }
.bc-about summary::after { content: "+"; float: right; color: var(--color-primary); font-size: 18px; line-height: 1; } [dir="rtl"] .bc-about summary::after { float: left; }
.bc-about[open] summary::after { content: "−"; } .bc-about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 14px; }
.bc-now td { background: #eef8f2; } .text-danger { color: #b42318; }
@media (max-width: 900px) { .bc-about-grid { grid-template-columns: 1fr; } }
.bc-toolbar { position: sticky; top: calc(var(--topbar-height) + 10px); z-index: 20; padding: 12px 16px; background: rgba(255,255,255,.95); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.bc-toolbar .mt-toolbar { margin-bottom: 0; }
/* ---------- Pending approvals: floating selection bar ---------- */
.bulk-bar-main { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bulk-count { font-size: 14px; margin-inline-end: 6px; }
.bulk-bar-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.bulk-bar-fields .form-group { margin: 0; }
.bulk-note { margin: 8px 0 0; }
.bulk-bar.js-bar { position: fixed; left: 50%; bottom: 18px; transform: translate(-50%, 140%); width: min(980px, calc(100vw - 32px)); z-index: 1200; margin: 0; padding: 12px 16px; background: #0b1f17; color: #e9f7f0; border: 1px solid rgba(167,243,208,.2); box-shadow: 0 24px 60px rgba(4,17,11,.4); transition: transform .25s ease; visibility: hidden; }
.bulk-bar.js-bar.is-active { transform: translate(-50%, 0); visibility: visible; }
.bulk-bar.js-bar .bulk-count strong { color: #4fd68c; }
.bulk-bar.js-bar .btn-secondary { background: rgba(255,255,255,.07); color: #e9f7f0; border-color: rgba(255,255,255,.18); }
.bulk-bar.js-bar .btn-outline-danger { background: rgba(249,112,102,.1); color: #fecdca; border-color: rgba(249,112,102,.45); }
.bulk-bar.js-bar .link-btn { color: #a9cdbd; margin-inline-start: auto; }
.bulk-bar.js-bar label { color: #a9cdbd; font-size: 12.5px; } .bulk-bar.js-bar label .text-muted { color: #7fa898 !important; }
.bulk-bar.js-bar .form-control { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.18); color: #fff; }
.bulk-bar.js-bar .bulk-bar-fields { grid-template-columns: 1fr; margin-top: 10px; }
.bulk-bar.js-bar [data-field="comment"], .bulk-bar.js-bar [data-field="file"], .bulk-bar.js-bar .bulk-note { display: none; }
.bulk-bar.js-bar.need-comment [data-field="comment"], .bulk-bar.js-bar.need-file [data-field="file"] { display: block; }
.pa-fig { font-weight: 600; } .pa-val { white-space: nowrap; }
/* answers and certificates (update 142): a row's own decision, the full answer on request */
.pa-answer { min-width: 220px; max-width: 420px; overflow-wrap: anywhere; }
.pa-full summary { cursor: pointer; color: var(--color-primary); margin-top: 4px; }
.pa-full-body { margin-top: 6px; padding: 8px 10px; border-inline-start: 3px solid var(--color-border); background: var(--color-surface-alt); font-size: 13px; max-height: 320px; overflow: auto; }
.pa-row-act { display: flex; flex-direction: column; gap: 6px; align-items: stretch; min-width: 118px; }
.pa-row-act .btn { justify-content: center; white-space: nowrap; }
.pa-row-act .pa-inline .btn, .pa-row-act .pa-back > summary { width: 100%; }
.pa-inline { margin: 0; }
.pa-back > summary { list-style: none; } .pa-back > summary::-webkit-details-marker { display: none; }
.pa-back[open] { min-width: 240px; }
.pa-back-form { margin-top: 8px; padding: 10px; border: 1px solid var(--color-border); border-radius: 8px; background: #fff; }
.pa-back-form textarea { min-width: 200px; }
/* an answer's review state on the pages where it is given */
.ar-state { display: inline-flex; align-items: center; gap: 5px; margin: 6px 0 0; padding: 3px 9px; border-radius: 999px; font-size: 12.5px; font-weight: 600; line-height: 1.4; }
.ar-state.is-wait { background: #fff6e0; color: #7a4b00; }
.ar-state.is-ok { background: #e7f6ee; color: #11643c; }
.ar-state.is-back { background: #fdecea; color: #9b1c13; border-radius: 8px; font-weight: 500; }
.ar-state.ar-compact { margin: 0 0 0 6px; padding: 2px 8px; font-size: 12px; border-radius: 999px; font-weight: 600; vertical-align: middle; }
.ar-banner { display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; margin: 0 0 14px; border-radius: 10px; background: #fff6e0; color: #5c3a00; font-size: 14px; }
.ar-banner a { font-weight: 600; }
/* the audit trail (update 142): filters on one line, each day's changes under its date — time, kind, what, who — with before and after on request */
.at-filters { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-end; margin-bottom: 16px; }
.at-f { display: flex; flex-direction: column; gap: 4px; flex: 1 1 150px; min-width: 140px; }
.at-f .form-label { margin: 0; }
.at-q { flex: 2 1 220px; }
.at-views { display: inline-flex; align-items: center; gap: 6px; padding-bottom: 9px; font-size: 13.5px; color: var(--color-text-muted); }
.at-list { list-style: none; margin: 0; padding: 0; }
.at-day h3 { margin: 18px 0 4px; font-size: 13px; font-weight: 700; color: var(--color-text-muted); letter-spacing: 0; }
.at-day:first-child h3 { margin-top: 2px; }
.at-item { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-top: 1px solid var(--color-border); }
.at-time { padding-top: 1px; font-size: 13px; color: var(--color-text-muted); font-variant-numeric: tabular-nums; }
.at-what { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.at-kind { display: inline-block; margin-right: 6px; padding: 1px 8px; border: 1px solid var(--color-border); border-radius: 999px; background: var(--color-surface-alt); color: var(--color-text-muted); font-size: 11.5px; font-weight: 600; vertical-align: 1px; }
.at-k-figure .at-kind, .at-k-answer .at-kind, .at-k-kpi .at-kind { background: var(--color-primary-light); border-color: #cfe7da; color: var(--color-primary-dark); }
.at-k-review .at-kind { background: #e7f6ee; border-color: #c7e8d5; color: #11643c; }
.at-k-signin .at-kind, .at-k-people .at-kind, .at-k-settings .at-kind { background: #eef2f7; border-color: #dce3ec; color: #334155; }
.at-meta { margin: 2px 0 0; font-size: 13px; color: var(--color-text-muted); overflow-wrap: anywhere; }
.at-meta b { color: var(--color-text); font-weight: 600; }
.at-evidence { display: flex; align-items: baseline; gap: 5px; } .at-evidence svg { flex-shrink: 0; align-self: center; }   /* the file saved with a change (update 144) */
.at-ba { margin-top: 6px; }
.at-ba > summary { cursor: pointer; font-size: 13px; color: var(--color-primary); }
.at-saves { font-weight: 500; font-size: 12.5px; color: var(--color-text-muted); }   /* a record saved again within minutes: one change with its steps (update 146) */
.at-step-list { margin: 6px 0 0; padding-inline-start: 22px; font-size: 13px; display: grid; gap: 3px; } .at-step-list time { font-variant-numeric: tabular-nums; color: var(--color-text-muted); }
.at-fields { margin-top: 6px; }
.at-fields th[scope="row"] { font-weight: 600; white-space: nowrap; text-transform: none; letter-spacing: 0; font-size: 13px; color: var(--color-text); }
.at-fields td { overflow-wrap: anywhere; }
.at-two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 6px; }
.at-lbl { margin-bottom: 3px; font-size: 12px; font-weight: 700; color: var(--color-text-muted); }
.at-text { max-height: 260px; overflow: auto; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-surface-alt); font-size: 13px; overflow-wrap: anywhere; }
.at-more { margin: 14px 0 0; }
/* a climate risk changed in place (update 142): the form opens under its button, wide enough to read */
.cr-edit > summary { list-style: none; } .cr-edit > summary::-webkit-details-marker { display: none; }
.cr-edit-form { min-width: min(560px, 78vw); margin-top: 8px; padding: 12px; border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-surface); white-space: normal; }
@media (max-width: 640px) { .at-item { grid-template-columns: 1fr; gap: 2px; } .at-two { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .bulk-bar-fields { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .bulk-bar.js-bar { transition: none; } }
@media (min-width: 901px) {
  .bulk-bar.js-bar { left: calc(50% + var(--sidebar-width) / 2); width: min(980px, calc(100vw - var(--sidebar-width) - 40px)); }
  [dir="rtl"] .bulk-bar.js-bar { left: calc(50% - var(--sidebar-width) / 2); }
}
/* ---------- Data requests ---------- */
.dr-views { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.dr-view { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--color-border); text-decoration: none; color: #273246; font-weight: 600; font-size: 13.5px; background: #fff; }
.dr-view span { margin-inline-start: 4px; padding: 0 7px; border-radius: 999px; background: var(--color-surface-alt); font-size: 12px; }
.dr-view.is-on { background: #0b1220; color: #fff; border-color: #0b1220; } .dr-view.is-on span { background: #4fd68c; color: #04110b; }
.dr-view.is-bad:not(.is-on) span { background: #fdeceb; color: #b42318; }
.dr-overdue td:first-child { box-shadow: inset 3px 0 0 #d92d20; } [dir="rtl"] .dr-overdue td:first-child { box-shadow: inset -3px 0 0 #d92d20; }
.dr-who { display: inline-flex; align-items: center; gap: 8px; } .dr-av { width: 26px; height: 26px; border-radius: 50%; background: var(--color-primary-light); color: var(--color-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
/* ---------- Evidence register ---------- */
.ev-doc { display: flex; align-items: center; gap: 8px; min-width: 0; } .ev-name { overflow-wrap: anywhere; } .ev-check-gap { flex: none; width: 13px; }
.ev-type { flex-shrink: 0; font-size: 10px; font-weight: 800; letter-spacing: .04em; padding: 3px 6px; border-radius: 6px; background: #eef2f5; color: #4f5b6b; }
.ev-pdf { background: #fdeceb; color: #b42318; } .ev-img { background: #eef4ff; color: #1f56c4; } .ev-xls { background: #e7f4ed; color: #0b5737; } .ev-word { background: #eef4ff; color: #1f56c4; }
/* ---------- Dashboard: panels grow with their content (no silent clipping); a readable trend chart ---------- */
.page-content .dash-band .dash-panel { min-height: 0 !important; max-height: none !important; overflow: visible !important; }
.page-content .dash-panel > .table-wrap { max-height: 300px; overflow: auto; }
.page-content .emitter-layout { overflow: visible; }
.page-content .trend-canvas { overflow: visible; display: block; }
.page-content .trend-chart { height: auto; display: block; }
.page-content .trend-axis-label { font-size: 12px; }
/* ---------- Bulk import ---------- */
.imp-steps { list-style: none; margin: 0 0 18px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.imp-steps li { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; background: #fff; border: 1px solid var(--color-border); border-radius: 16px; }
.imp-steps li > span { flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; background: var(--color-primary); color: #fff; font-weight: 750; display: inline-flex; align-items: center; justify-content: center; }
.imp-steps strong { display: block; font-size: 14.5px; } .imp-steps small { color: var(--color-text-muted); font-size: 12.5px; }
.imp-layout { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.imp-cat { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: #4f5b6b; margin: 18px 0 6px; }
.imp-list { list-style: none; margin: 0; padding: 0; border: 1px solid var(--color-border); border-radius: 14px; overflow: hidden; }
.imp-item { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 12px; border-bottom: 1px solid #eef2f5; }
.imp-item:last-child { border-bottom: 0; } .imp-item:hover { background: #f7faf8; }
.imp-name { font-weight: 600; font-size: 14px; } .imp-act { display: flex; gap: 6px; flex-shrink: 0; }
.imp-hist { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.imp-hist li { padding: 10px 12px; border: 1px solid var(--color-border); border-radius: 12px; }
.imp-hist-top { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.imp-rows { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; font-size: 12px; } .imp-rows span { padding: 2px 8px; border-radius: 999px; background: #eef2f5; color: #273246; }
.imp-rows .ok { background: #e7f4ed; color: #0b5737; } .imp-rows .warn { background: #fff4e0; color: #7a4a00; } .imp-rows .bad { background: #fdeceb; color: #b42318; }
.imp-tips { margin: 0 0 8px; padding-inline-start: 18px; font-size: 13.5px; color: #273246; display: grid; gap: 6px; }
@media (max-width: 1000px) { .imp-layout, .imp-steps { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .imp-item { flex-direction: column; align-items: flex-start; } }
h2.env-card-title, h3.env-card-title, h2.card-title, h3.card-title { font-size: 15px; line-height: 1.35; margin-top: 0; }
/* ---------- Team ---------- */
.tm-person { display: flex; align-items: center; gap: 10px; } .tm-person strong { font-weight: 650; }
.tm-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.tm-role { align-items: center; } .tm-role select { min-width: 180px; } .tm-role.is-changed select { border-color: #d38b0b; box-shadow: 0 0 0 3px rgba(211,139,11,.15); }
.tm-mfa { color: #0b5737; margin-top: 4px; display: flex; align-items: center; gap: 4px; }
/* Alerts flow as text with the icon beside it. As a flex container, every run of text and every <strong>/<a> inside an
   alert became its own column, so any alert with a link or bold text broke into ragged columns once it wrapped. */
.alert { display: block; }
.alert > svg:first-child { float: left; margin: 2px 8px 0 0; }
.alert::after { content: ""; display: block; clear: both; }
[dir="rtl"] .alert > svg:first-child { float: right; margin: 2px 0 0 8px; }
.alert.undo-bar, .alert.toast { display: flex; }
.alert.undo-bar > svg:first-child, .alert.toast > svg:first-child { float: none; margin: 0; }
.alert.undo-bar::after, .alert.toast::after { content: none; }
details.alert > summary > svg { float: none; }
/* Sync to Reports: the long notes and target labels wrap, so “On record now”, “Status” and the action stay in view */
.rl-table td, .rl-table th { white-space: normal; vertical-align: top; }
.rl-table td:first-child { min-width: 240px; max-width: 380px; }
.rl-table td:nth-child(3) { min-width: 160px; max-width: 230px; overflow-wrap: anywhere; }
.rl-table td:nth-child(2), .rl-table td:nth-child(4) { white-space: nowrap; font-variant-numeric: tabular-nums; }
.bs-why { margin-top: 8px; min-height: 40px; }
.bs-why a { color: var(--color-primary); text-decoration: underline; font-weight: 600; }
.rp-progress { margin-top: 10px; max-width: 520px; } .rp-progress .text-xs { margin-top: 6px; } .rp-soon { color: #9a5b00; }
.loc-hint { color: #9a5b00; margin-top: 6px; display: flex; align-items: center; gap: 4px; }
/* ---------- Full BRSR report: readiness panel ---------- */
@media (min-width: 1101px) { .rp-bottom { grid-template-columns: 1.3fr 1fr; } }   /* narrower: the original rule stacks them */
.rd-panel { background: #fff; border: 1px solid var(--color-border); border-radius: 20px; margin: 0 0 16px; overflow: hidden; box-shadow: 0 1px 2px rgba(11,18,32,.04), 0 10px 28px rgba(11,18,32,.05); }
.rd-verdict { display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--color-border); background: linear-gradient(90deg, #f3f8f5, #fff 60%); }
.rd-blocked .rd-verdict { background: linear-gradient(90deg, #fdf0ef, #fff 60%); }
.rd-progress .rd-verdict { background: linear-gradient(90deg, #fdf6e8, #fff 60%); }
.rd-ring { position: relative; width: 60px; height: 60px; flex-shrink: 0; }
.rd-ring svg { width: 60px; height: 60px; transform: rotate(-90deg); }
.rd-ring circle { fill: none; stroke-width: 5; } .rd-ring .t { stroke: #e6ece9; } .rd-ring .v { stroke: #12804f; stroke-linecap: round; }
.rd-blocked .rd-ring .v { stroke: #d92d20; } .rd-progress .rd-ring .v { stroke: #d38b0b; }
.rd-ring span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 750; color: #0b1220; }
.rd-kicker { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #4f5b6b; }
.rd-head h2 { margin: 2px 0 4px; font-size: 21px; letter-spacing: -.02em; }
.rd-blocked .rd-head h2 { color: #a3180f; } .rd-progress .rd-head h2 { color: #7a4a00; } .rd-ready .rd-head h2, .rd-done .rd-head h2 { color: #0b5737; }
.rd-head p { margin: 0; font-size: 13.5px; color: #273246; }
.rd-dl { display: inline-flex; align-items: center; gap: 4px; } .rd-dl.is-soon { color: #9a5b00; font-weight: 650; } .rd-dl.is-late { color: #b42318; font-weight: 650; }
.rd-body { display: grid; grid-template-columns: minmax(0, 1fr) 260px; }
.rd-checks { list-style: none; margin: 0; padding: 6px 0; border-inline-end: 1px solid var(--color-border); }
.rd-check { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; padding: 10px 20px; border-bottom: 1px solid #eef2f5; }
.rd-check:last-child { border-bottom: 0; }
.rd-state { width: 28px; height: 28px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; }
.rd-check.is-pass .rd-state { background: #e7f4ed; color: #0b5737; } .rd-check.is-todo .rd-state { background: #fff4e0; color: #9a5b00; } .rd-check.is-block .rd-state { background: #fdeceb; color: #b42318; }
.rd-label { font-weight: 650; font-size: 14px; } .rd-value { font-size: 13px; color: var(--color-text-muted); margin-top: 1px; }
.rd-check.is-pass .rd-value { color: #0b5737; }
.rd-note { display: inline-block; margin-inline-start: 6px; font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 999px; background: #fdeceb; color: #a3180f; vertical-align: 1px; }
.rd-link { font-size: 13px; color: var(--color-text-muted); }
.rd-sections { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 6px 14px; margin-top: 8px; }
.rd-sec { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: center; text-decoration: none; color: #273246; font-size: 12.5px; padding: 3px 0; }
.rd-sec:hover .rd-sec-name { text-decoration: underline; } .rd-sec b { font-variant-numeric: tabular-nums; font-size: 12px; }
.rd-sec-meter { height: 6px; border-radius: 6px; background: #e6ece9; overflow: hidden; } .rd-sec-meter i { display: block; height: 100%; border-radius: 6px; }
.rd-sec-meter i.ok { background: #12804f; } .rd-sec-meter i.mid { background: #d38b0b; } .rd-sec-meter i.low { background: #d92d20; }
.rd-flow { padding: 14px 18px; } .rd-flow-title { font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #4f5b6b; margin: 0 0 10px; }
.rd-steps { list-style: none; margin: 0 0 12px; padding: 0; position: relative; }
.rd-steps li { position: relative; padding: 0 0 14px 28px; font-size: 13.5px; color: #4f5b6b; }
.rd-steps li:not(:last-child)::before { content: ""; position: absolute; left: 9px; top: 18px; bottom: 0; width: 2px; background: #dbe5df; }
.rd-steps li.is-done:not(:last-child)::before { background: #12804f; }
.rd-dot { position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; border: 2px solid #b9c4cf; background: #fff; display: inline-flex; align-items: center; justify-content: center; color: #fff; }
.rd-steps li.is-done .rd-dot { background: #12804f; border-color: #12804f; }
.rd-steps li.is-current { color: #0b1220; font-weight: 700; } .rd-steps li.is-current .rd-dot { border-color: #12804f; box-shadow: 0 0 0 4px rgba(18,128,79,.15); }
.rd-steps small { display: block; font-weight: 500; color: var(--color-text-muted); font-size: 12px; }
[dir="rtl"] .rd-steps li { padding: 0 28px 14px 0; } [dir="rtl"] .rd-steps li:not(:last-child)::before { left: auto; right: 9px; } [dir="rtl"] .rd-dot { left: auto; right: 0; }
.tc-panel > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 8px; } .tc-panel > summary::-webkit-details-marker { display: none; }
.tc-panel > summary .tc-sum { margin-inline-start: auto; font-size: 12.5px; font-weight: 600; color: var(--color-text-muted); }
.tc-panel > summary::after { content: "+"; color: var(--color-primary); font-size: 18px; line-height: 1; } .tc-panel[open] > summary::after { content: "−"; }
@media (max-width: 1100px) { .rd-body { grid-template-columns: 1fr; } .rd-checks { border-inline-end: 0; border-bottom: 1px solid var(--color-border); } }
@media (max-width: 640px) { .rd-verdict { grid-template-columns: auto 1fr; } .rd-cta { grid-column: 1 / -1; } .rd-cta .btn { width: 100%; justify-content: center; } .rd-check { padding: 10px 14px; } }
@media (min-width: 1280px) {
  .rd-checks { display: grid; grid-template-columns: 1fr 1fr; padding: 0; }
  .rd-check { border-inline-end: 1px solid #eef2f5; }
  .rd-check:nth-child(2n+1):not([data-key="answers"]) { border-inline-end: 0; }
  .rd-check[data-key="answers"] { grid-column: 1 / -1; border-inline-end: 0; }
  .rd-check:last-child { border-bottom: 1px solid #eef2f5; }
}
/* ---------- Full BRSR report: validation center ---------- */
.vx-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.vx-sum { margin: 0 0 12px; font-size: 13.5px; } .vx-t-high { color: #a3180f; } .vx-t-ok { color: #0b5737; }
.vx-group { margin-top: 14px; } .vx-gt { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #4f5b6b; margin: 0 0 8px; display: flex; align-items: center; gap: 8px; }
.vx-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.vx-item { display: grid; grid-template-columns: 96px 130px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: 12px; background: #fff; }
.vx-item.is-high { box-shadow: inset 3px 0 0 #d92d20; } [dir="rtl"] .vx-item.is-high { box-shadow: inset -3px 0 0 #d92d20; }
.vx-item.is-medium { box-shadow: inset 3px 0 0 #d38b0b; } [dir="rtl"] .vx-item.is-medium { box-shadow: inset -3px 0 0 #d38b0b; }
.vx-sev { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; padding: 3px 9px; border-radius: 999px; justify-self: start; }
.is-high .vx-sev { background: #fdeceb; color: #a3180f; } .is-medium .vx-sev { background: #fff4e0; color: #7a4a00; }
.vx-cat { font-size: 12px; font-weight: 650; color: #4f5b6b; text-transform: uppercase; letter-spacing: .04em; }
.vx-msg { font-size: 14px; color: #0b1220; }
@media (max-width: 760px) { .vx-item { grid-template-columns: auto 1fr; } .vx-msg { grid-column: 1 / -1; } .vx-item .btn { grid-column: 1 / -1; justify-content: center; } }
.tc-panel > summary.tc-title { font-size: 15px !important; margin: 0; white-space: nowrap; } .tc-panel > summary .tc-sum { overflow: hidden; text-overflow: ellipsis; max-width: 55%; }
/* the tab bar stays in reach while scrolling long tabs (Section-wise, Audit) */
.report-tabs { position: sticky; top: calc(var(--topbar-height) + 8px); z-index: 25; background: rgba(243, 246, 244, .94) !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); padding: 6px 0 !important; border-radius: 14px; }
.ex-status { display: block; margin-top: 4px; color: #0b5737; font-weight: 600; }
@media print { .report-tabs { position: static; } }
.tc-layout { margin: 12px 0 6px; } .tc-lay { display: flex; gap: 8px; align-items: flex-start; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: 10px; margin-top: 6px; cursor: pointer; }
.tc-lay.is-on { border-color: var(--color-primary); background: var(--color-primary-light); } .tc-lay input { margin-top: 3px; }
.tc-lay b { display: block; font-size: 13px; } .tc-lay small { display: block; font-size: 11.5px; color: var(--color-text-muted); line-height: 1.35; }
/* ---------- Report builder ---------- */
.rb-bar { padding: 12px 16px; } .rb-bar-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.rb-bar-row select { max-width: 260px; } .rb-bar-row #rbName { max-width: 300px; flex: 1 1 220px; }
.rb-state { margin-inline-start: auto; font-size: 12.5px; color: var(--color-text-muted); } .rb-state.is-dirty { color: #9a5b00; font-weight: 650; }
.rb-hint { margin: 8px 0 0; }
.rb-layout { display: grid; grid-template-columns: minmax(360px, 440px) minmax(0, 1fr); gap: 16px; align-items: start; }
.rb-list { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 6px; }
.rb-item { border: 1px solid var(--color-border); border-radius: 12px; background: #fff; }
.rb-item.is-front { background: var(--color-surface-alt); } .rb-item.is-off { background: #f2f4f6; border-style: dashed; } .rb-item.is-off .rb-txt b { text-decoration: line-through; color: #4b5563; } .rb-item.is-off .rb-txt small { color: #4b5563; }
.rb-item.is-off .rb-txt b::after { content: " · Hidden"; font-size: 11px; font-weight: 600; text-decoration: none; display: inline-block; margin-inline-start: 4px; }
.rb-item.is-drag { opacity: .4; } .rb-item.is-over { box-shadow: 0 -3px 0 var(--color-primary); }
.rb-row { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 10px; }
.rb-grip { cursor: grab; color: #8a95a1; font-size: 12px; letter-spacing: -2px; } .rb-grip.is-locked { cursor: default; letter-spacing: 0; font-size: 11px; }
.rb-ic { width: 28px; height: 28px; border-radius: 8px; background: var(--color-primary-light); color: var(--color-primary); display: inline-flex; align-items: center; justify-content: center; }
.rb-txt b { display: block; font-size: 13.5px; } .rb-txt small { display: block; font-size: 11.5px; color: var(--color-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rb-acts { display: flex; gap: 4px; align-items: center; }
.rb-btn { border: 1px solid var(--color-border); background: #fff; border-radius: 8px; min-width: 28px; height: 28px; padding: 0 7px; font-size: 12px; cursor: pointer; color: #273246; }
.rb-btn:hover:not(:disabled) { border-color: var(--color-primary); } .rb-btn:disabled { opacity: .35; cursor: default; } .rb-del:hover:not(:disabled) { border-color: #d92d20; color: #b42318; }
.rb-switch { position: relative; width: 34px; height: 20px; display: inline-block; } .rb-switch input { opacity: 0; width: 100%; height: 100%; position: absolute; margin: 0; cursor: pointer; z-index: 1; }
.rb-switch span { position: absolute; inset: 0; border-radius: 999px; background: #c5ccd3; transition: background .15s; }
.rb-switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: transform .15s; }
.rb-switch input:checked + span { background: var(--color-primary); } .rb-switch input:checked + span::after { transform: translateX(14px); }
.rb-switch input:focus-visible + span { outline: 3px solid rgba(15,110,70,.45); outline-offset: 2px; } .rb-switch input:disabled + span { opacity: .55; }
[dir="rtl"] .rb-switch span::after { left: auto; right: 3px; } [dir="rtl"] .rb-switch input:checked + span::after { transform: translateX(-14px); }
.rb-editor { border-top: 1px solid var(--color-border); padding: 10px 12px 12px; display: grid; gap: 8px; background: #fbfcfb; border-radius: 0 0 12px 12px; }
.rb-field label { display: block; font-size: 12px; font-weight: 600; margin-bottom: 3px; } .rb-check { display: flex !important; gap: 6px; align-items: center; font-weight: 500 !important; font-size: 12.5px !important; }
.rb-codes { border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 10px; max-height: 190px; overflow: auto; } .rb-codes legend { font-size: 12px; font-weight: 600; }
.rb-palette { border-top: 1px solid var(--color-border); padding-top: 10px; margin-top: 6px; } .rb-pal-t { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: #4f5b6b; margin: 0 0 6px; }
.rb-pal-g { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; } .rb-pal-gl { width: 100%; font-size: 11.5px; color: var(--color-text-muted); }
.rb-add { display: inline-flex; align-items: center; gap: 6px; border: 1px dashed #b9c4cf; background: #fff; border-radius: 9px; padding: 6px 10px; font-size: 12.5px; cursor: pointer; color: #273246; }
.rb-add:hover:not(:disabled) { border-color: var(--color-primary); border-style: solid; } .rb-add:disabled { opacity: .45; cursor: default; }
.rb-preview { position: sticky; top: calc(var(--topbar-height) + 12px); } .rb-prev-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
#rbFrame { width: 100%; height: calc(100vh - var(--topbar-height) - 140px); min-height: 520px; border: 1px solid var(--color-border); border-radius: 12px; background: #e9edf0; }
@media (max-width: 1100px) { .rb-layout { grid-template-columns: minmax(0, 1fr); } .rb-preview { position: static; } #rbFrame { height: 640px; } }
.rb-layout > * { min-width: 0; }
/* a block's buttons go under its name when the list is too narrow for both on one line (the outline column, a phone) — the name kept its
   room only on wide screens and was squeezed to a letter a line on a phone (update 129) */
.rb-list { container: rblist / inline-size; }
@container rblist (max-width: 620px) {
  .rb-row { grid-template-columns: auto auto minmax(0, 1fr); row-gap: 6px; }
  .rb-acts { grid-column: 3 / -1; flex-wrap: wrap; }
}
@container rblist (max-width: 380px) { .rb-acts { grid-column: 1 / -1; } }   /* a phone: the whole width, so the buttons stay on one line */
.rb-design { padding: 12px 16px; } .rb-design > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 8px; margin: 0; } .rb-design > summary::-webkit-details-marker { display: none; }
.rb-design > summary::after { content: "+"; margin-inline-start: 8px; color: var(--color-primary); font-size: 18px; } .rb-design[open] > summary::after { content: "−"; }
.rb-design-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px 14px; margin-top: 12px; }
.rb-accent { display: flex; align-items: center; gap: 10px; } .rb-accent input[type=color] { width: 44px; height: 34px; padding: 2px; border: 1px solid var(--color-border); border-radius: 8px; background: #fff; }
.rb-charts-cta { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 10px 12px; margin: 4px 0 10px; border-radius: 12px; background: var(--color-primary-light); border: 1px solid #b9dfc9; }
.rb-charts-cta.is-empty { background: var(--color-surface-alt); border-color: var(--color-border); }
.rb-charts-cta b { display: flex; align-items: center; gap: 6px; font-size: 13px; } .rb-charts-cta small { display: block; font-size: 12px; color: var(--color-text-muted); margin-top: 2px; }
@media (max-width: 640px) { .rb-charts-cta { flex-direction: column; align-items: stretch; } }
/* ---------- Report builder: image library and media blocks ---------- */
.rb-dlg-back { position: fixed; inset: 0; z-index: 1200; background: rgba(11,18,32,.55); display: flex; align-items: center; justify-content: center; padding: 20px; }
.rb-dlg-back[hidden] { display: none; }
.rb-dlg { background: #fff; border-radius: 18px; width: min(1100px, 100%); max-height: calc(100vh - 40px); display: flex; flex-direction: column; box-shadow: 0 24px 60px rgba(0,0,0,.3); }
.rb-dlg-head { display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--color-border); }
.rb-dlg-head h2 { margin: 0; font-size: 18px; } .rb-dlg-head #rbDlgClose { margin-inline-start: auto; }
.rb-dlg-body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; padding: 16px 18px; overflow: auto; min-height: 0; flex: 1; }
.rb-dlg-body:has(.rb-imgdetail[hidden]) { grid-template-columns: 1fr; }
.rb-dlg-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 18px; border-top: 1px solid var(--color-border); }
.rb-drop { display: flex; align-items: center; gap: 12px; padding: 16px; border: 2px dashed #b9c4cf; border-radius: 14px; cursor: pointer; color: #273246; background: #fafbfb; }
.rb-drop.is-over { border-color: var(--color-primary); background: var(--color-primary-light); }
.rb-drop input { position: absolute; width: 1px; height: 1px; opacity: 0; } .rb-drop:focus-within { outline: 3px solid rgba(15,110,70,.45); outline-offset: 2px; }
.rb-drop small { display: block; font-size: 12px; color: var(--color-text-muted); margin-top: 2px; }
.rb-upmsg { margin: 8px 0; font-size: 13px; display: grid; gap: 4px; } .rb-ok { color: #0b5737; } .rb-bad { color: #b42318; }
.rb-imgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.rb-imgcard { position: relative; text-align: start; border: 2px solid var(--color-border); border-radius: 12px; background: #fff; padding: 6px; cursor: pointer; display: grid; gap: 6px; }
.rb-imgcard img { width: 100%; height: 110px; object-fit: cover; border-radius: 8px; background: #eef1f3; }
.rb-imgcard.is-sel { border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(15,110,70,.18); }
.rb-imgcap { font-size: 12.5px; font-weight: 600; color: #1f2937; display: grid; gap: 2px; } .rb-imgcap small { font-weight: 500; color: var(--color-text-muted); }
.rb-imgorder { position: absolute; top: 10px; inset-inline-start: 10px; background: var(--color-primary); color: #fff; border-radius: 999px; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px; }
.rb-warn { font-style: normal; font-size: 11px; font-weight: 700; color: #9a5b00; }
.rb-imgdetail { border-inline-start: 1px solid var(--color-border); padding-inline-start: 16px; display: grid; gap: 8px; align-content: start; }
.rb-dprev { width: 100%; max-height: 200px; object-fit: contain; border-radius: 10px; background: #eef1f3; }
.rb-flabel { display: block; font-size: 12px; font-weight: 600; margin-bottom: 3px; }
.rb-imgfield { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .rb-imgfield img { width: 64px; height: 44px; object-fit: cover; border-radius: 6px; }
.rb-imgname { font-size: 12.5px; flex: 1; min-width: 120px; }
.rb-gal { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; } .rb-galitem { position: relative; } .rb-galitem img { width: 72px; height: 50px; object-fit: cover; border-radius: 6px; display: block; }
.rb-galitem .rb-btn { position: absolute; top: -8px; inset-inline-end: -8px; min-width: 22px; height: 22px; padding: 0; border-radius: 50%; }
.rb-galadd { height: 50px; padding: 0 10px; }
.rb-statrow { display: grid; grid-template-columns: 1fr 1.6fr; gap: 8px; }
.rb-toolbar { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; margin-bottom: -2px; }
.rb-tb { border: 1px solid var(--color-border); background: #fff; border-radius: 7px; min-width: 30px; height: 28px; font-size: 12.5px; cursor: pointer; color: #273246; } .rb-tb:hover { border-color: var(--color-primary); }
.rb-tbsel { height: 28px; font-size: 12px; border: 1px solid var(--color-border); border-radius: 7px; padding: 0 6px; max-width: 200px; background: #fff; }
@media (max-width: 800px) { .rb-dlg-body { grid-template-columns: 1fr; } .rb-imgdetail { border-inline-start: 0; padding-inline-start: 0; border-top: 1px solid var(--color-border); padding-top: 12px; } }
/* ---------- Report builder: preflight, setup, library tools, focal point ---------- */
.rb-check { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; margin: 0 0 12px; background: #fbfcfb; }
.rb-check-t { margin: 0; font-size: 13px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.rb-check-sum { margin-inline-start: auto; font-size: 12px; font-weight: 700; padding: 2px 10px; border-radius: 999px; }
.rb-check-sum.is-ok { background: #e7f4ed; color: #0b5737; } .rb-check-sum.is-warn { background: #fff4e0; color: #7a4a00; } .rb-check-sum.is-err { background: #fdeceb; color: #a3180f; }
.rb-check-list { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; max-height: 260px; overflow: auto; }
.rb-check-list li { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: start; font-size: 12.5px; line-height: 1.4; }
.rb-sev { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; padding: 2px 7px; border-radius: 6px; margin-top: 1px; }
.is-error .rb-sev { background: #fdeceb; color: #a3180f; } .is-warn .rb-sev { background: #fff4e0; color: #7a4a00; } .is-info .rb-sev { background: #eef2f6; color: #374151; }
.rb-setup { border: 1px solid #f3c1bc; background: #fdf3f2; color: #5c1610; border-radius: 12px; padding: 10px 14px; margin: 10px 0; font-size: 13px; }
.rb-setup.is-warn { border-color: #f1d49a; background: #fffaf0; color: #5a3a00; } .rb-setup ul { margin: 6px 0 0; padding-inline-start: 18px; display: grid; gap: 4px; } .rb-setup p { margin: 4px 0 0; }
.rb-drop.is-off { opacity: .55; pointer-events: none; }
.rb-libtools { display: grid; grid-template-columns: minmax(160px, 1fr) auto auto auto; gap: 8px; margin: 10px 0 4px; align-items: center; }
.rb-focal { position: relative; cursor: crosshair; line-height: 0; } .rb-focal .rb-dprev { display: block; }
.rb-fdot { position: absolute; width: 22px; height: 22px; transform: translate(-50%, -50%); border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 2px #0b1220, 0 2px 8px rgba(0,0,0,.4); background: rgba(15,110,70,.55); pointer-events: none; }
@media (max-width: 800px) { .rb-libtools { grid-template-columns: 1fr 1fr; } .rb-libtools input { grid-column: 1 / -1; } }
.rb-starters { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; }
.rb-starter { border: 1px solid var(--color-border); border-radius: 14px; padding: 14px; display: grid; gap: 8px; align-content: start; background: #fff; }
.rb-starter:hover { border-color: var(--color-primary); box-shadow: 0 6px 20px rgba(11,18,32,.06); }
.rb-starter-h { display: flex; align-items: center; gap: 8px; font-size: 14.5px; } .rb-starter p { margin: 0; font-size: 13px; line-height: 1.45; color: #374151; }
.rb-starter .btn { justify-self: start; }
.rb-dlg-narrow { width: min(760px, 100%); }
.rb-webnew { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 12px; border: 1px solid var(--color-border); border-radius: 12px; background: #fafbfb; }
.rb-weblinks { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; } .rb-weblinks li { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; display: grid; gap: 6px; }
.rb-weblinks li.is-off { background: #f6f7f8; } .rb-webrow { display: flex; gap: 6px; align-items: center; } .rb-weburl { flex: 1; min-width: 0; font-size: 12.5px; }
.rb-webstate { font-size: 11px; font-weight: 800; text-transform: uppercase; padding: 2px 8px; border-radius: 6px; background: #e7f4ed; color: #0b5737; } .is-off .rb-webstate { background: #eceff2; color: #374151; }
.rb-weblinks a.rb-btn { display: inline-flex; align-items: center; text-decoration: none; }
.rb-field-wide { grid-column: 1 / -1; }
/* ---------- Report builder: history, kept changes, undo, insert anywhere, filing layout (update 127) ---------- */
.rb-outline-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; } .rb-outline-head .card-title { margin: 0; }
.rb-undo { display: flex; gap: 4px; }
.rb-filing { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 8px; align-items: start; margin: 0 0 10px; padding: 8px 10px; border-radius: 8px; font-size: 12.5px; line-height: 1.45; background: #eef6f2; border: 1px solid #b7d8c6; color: #183d2c; }
.rb-filing[hidden] { display: none; } .rb-filing > svg { margin-top: 2px; }
.rb-item.is-sebi .rb-ic { box-shadow: inset 0 0 0 1.5px var(--color-primary); }
.rb-pal-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; } .rb-pal-head .rb-pal-t { margin: 0; }
.rb-pal-at { font-size: 12px; color: var(--color-text-muted); margin-inline-start: auto; } .rb-pal-head select { width: auto; max-width: 300px; height: 30px; padding: 0 8px; font-size: 12.5px; }
.rb-codegrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 4px 12px; margin: 4px 0; }
.rb-code { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--color-primary); min-width: 2.2em; display: inline-block; }
.rb-draft { margin: 10px 0 0; padding: 10px 12px; border-radius: 10px; border: 1px solid #f1d49a; background: #fffaf0; display: grid; gap: 8px; }
.rb-draft p { margin: 0; display: flex; gap: 8px; align-items: flex-start; font-size: 13px; line-height: 1.45; color: #4a3200; } .rb-draft.is-conflict { border-color: #f3c1bc; background: #fdf3f2; } .rb-draft.is-conflict p { color: #5c1610; }
.rb-dlg-head [data-close-hist], .rb-dlg-head [data-close-web], .rb-dlg-head [data-close-starter], .rb-dlg-head [data-close-val] { margin-inline-start: auto; }
@media (max-width: 560px) { .rb-dlg-head { flex-wrap: wrap; } .rb-dlg-head h2 { flex: 1 1 auto; } .rb-dlg-head > span { order: 3; flex-basis: 100%; } }   /* a dialog's explanation goes under its title on a phone */
.rb-hist { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; } .rb-hist li { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; display: grid; gap: 4px; } .rb-hist p { margin: 0; }
.rb-hist-h { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; font-size: 13.5px; } .rb-hist-k { font-size: 12px; color: var(--color-text-muted); }
.rb-hist-cur { font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 999px; background: #e7f4ed; color: #0b5737; }
.rb-cmp { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; margin: 0 0 12px; background: #fbfcfb; } .rb-cmp[hidden] { display: none; }
.rb-cmp-list { margin: 4px 0 8px; padding-inline-start: 18px; display: grid; gap: 6px; font-size: 13px; } .rb-cmp-list ul { margin: 2px 0 0; padding-inline-start: 16px; font-size: 12.5px; color: #374151; }
.rb-cmp-k { font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 6px; background: #eef2f6; color: #374151; } .rb-cmp-k.is-added { background: #e7f4ed; color: #0b5737; } .rb-cmp-k.is-removed { background: #fdeceb; color: #a3180f; }
.rb-del-w { background: #fdeceb; color: #8a1c13; text-decoration: line-through; padding: 0 2px; border-radius: 3px; } .rb-add-w { background: #e7f4ed; color: #0b5737; padding: 0 2px; border-radius: 3px; }
/* ---------- Decarbonisation planner ---------- */
.dc-section { margin-bottom: 16px; scroll-margin-top: 80px; }
.dc-sec-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; } .dc-sec-head .card-title { margin: 0; }
.dc-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 12px; } .dc-tabs a { padding: 6px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--color-border); font-size: 13px; font-weight: 600; color: #273246; text-decoration: none; }
.dc-tabs a:hover, .dc-tabs a:focus { border-color: var(--color-primary); color: var(--color-primary); }
.dc-chart { overflow-x: auto; } .dc-chart svg { display: block; height: auto; }
.dc-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 14px; } .dc-h3 { font-size: 14px; margin: 0 0 6px; }
.dc-legend { list-style: none; padding: 0; margin: 8px 0 0; display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 12.5px; color: #374151; }
.dc-legend li { display: flex; align-items: center; gap: 6px; } .dc-legend i { display: inline-block; width: 22px; height: 0; }
.dc-legend i.dc-sw, .dc-sw { display: inline-block; width: 11px; height: 11px; border-radius: 3px; vertical-align: -1px; }
.dc-diamond { width: 10px !important; height: 10px !important; background: #dc2626; transform: rotate(45deg); }
.dc-macc-list { margin: 8px 0 0; padding-inline-start: 22px; font-size: 12.5px; display: grid; gap: 3px; }
.dc-data { margin-top: 8px; } .dc-data summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--color-primary); }
.dc-whatif { border: 1px solid var(--color-border); border-radius: 12px; padding: 12px; margin-bottom: 10px; background: #fafbfb; }
.dc-sliders { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px 18px; } .dc-slider { display: grid; gap: 4px; font-size: 13px; } .dc-slider input { width: 100%; }
.dc-form { border: 1px solid var(--color-border); border-radius: 12px; padding: 14px; margin-bottom: 12px; background: #fcfdfc; }
.dc-form-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 0 14px; } .dc-wide { grid-column: 1 / -1; }
.dc-table td, .dc-table th { vertical-align: top; } .dc-table .num { text-align: right; white-space: nowrap; } .dc-off td { opacity: .55; }
.dc-row-acts { white-space: nowrap; } .dc-row-acts form { display: inline; } .dc-row-acts .btn { margin: 0 2px 4px 0; }
.dc-status { font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; }
.dc-status.is-approved, .dc-status.is-in_progress { background: #e0ecff; color: #1d4ed8; } .dc-status.is-completed { background: #e7f4ed; color: #0b5737; } .dc-status.is-cancelled, .dc-status.is-on_hold { background: #f3f4f6; color: #4b5563; }
.dc-badge { font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; background: #eef2f6; color: #374151; margin-inline-end: 6px; white-space: nowrap; }
.dc-badge.is-adopted { background: #e7f4ed; color: #0b5737; } .dc-badge.is-warn { background: #fff4e0; color: #7a4a00; } .dc-badge.is-muted { background: #f3f4f6; color: #4b5563; }
.dc-targets { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.dc-target { border: 1px solid var(--color-border); border-radius: 12px; padding: 12px; display: grid; gap: 6px; align-content: start; } .dc-target p { margin: 0; }
.dc-target.is-on { border-inline-start: 4px solid #16a34a; } .dc-target.is-off { border-inline-start: 4px solid #d97706; } .dc-target header { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.dc-bar { height: 8px; border-radius: 999px; background: #e5e7eb; overflow: hidden; } .dc-bar span { display: block; height: 100%; background: var(--color-primary); border-radius: 999px; }
.dc-checks { list-style: none; margin: 0; padding: 0; font-size: 12px; display: grid; gap: 2px; } .dc-checks li.ok { color: #0b5737; } .dc-checks li.no { color: #8a4b00; }
.dc-checks li.ok::before { content: '✓ '; } .dc-checks li.no::before { content: '! '; font-weight: 700; }
.dc-plan-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--color-border); } .dc-plan-acts form { display: inline; }
.dc-brsr { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; margin-bottom: 10px; } .dc-brsr-h { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.dc-pre { white-space: pre-wrap; font-family: inherit; font-size: 13px; line-height: 1.5; margin: 8px 0 0; background: #f8fafb; border-radius: 8px; padding: 10px; overflow-wrap: anywhere; }
.dc-steps { margin: 0 0 14px; padding-inline-start: 20px; display: grid; gap: 6px; font-size: 14px; }
.dc-new { margin-top: 12px; } .dc-new > summary { list-style: none; display: inline-flex; cursor: pointer; } .dc-new > summary::-webkit-details-marker { display: none; } .dc-new[open] > summary { margin-bottom: 10px; }
.dc-pick { border: 0; padding: 0; margin: 0 0 10px; display: flex; flex-wrap: wrap; gap: 6px 18px; } .dc-pick legend { margin-bottom: 6px; }
@media (max-width: 900px) { .dc-two { grid-template-columns: 1fr; } }
.dc-views { display: inline-flex; gap: 4px; margin-bottom: 6px; padding: 3px; border-radius: 10px; background: #eef2f4; }
.dc-view { border: 0; background: transparent; padding: 5px 12px; border-radius: 8px; font-size: 12.5px; font-weight: 700; color: #374151; cursor: pointer; } .dc-view.is-on { background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.12); color: #111827; }
.dc-table th { white-space: normal; vertical-align: bottom; font-size: 12px; line-height: 1.25; padding: 8px 10px; } .dc-table td { padding: 8px 10px; }
.dc-table td:first-child { min-width: 240px; } .dc-row-acts { display: grid; gap: 4px; justify-items: start; } .dc-row-acts .btn { margin: 0; white-space: nowrap; }
.dc-prob { margin: 4px 0 0; font-size: 12px; color: #8a4b00; display: flex; gap: 4px; align-items: flex-start; }
/* ---------- GHG inventory ---------- */
.gi-total th, .gi-total td { font-weight: 700; border-top: 2px solid var(--color-border); }
.gi-q { font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; white-space: nowrap; background: #eef2f6; color: #374151; }
.gi-q.is-excellent { background: #e7f4ed; color: #0b5737; } .gi-q.is-good { background: #e8f1fb; color: #1d4ed8; } .gi-q.is-fair { background: #fff4e0; color: #7a4a00; } .gi-q.is-poor { background: #fde8e8; color: #9b1c1c; }
.gi-approaches { border: 0; padding: 0; margin: 0 0 10px; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; }
.gi-approach { display: flex; gap: 8px; align-items: flex-start; border: 1px solid var(--color-border); border-radius: 10px; padding: 10px; cursor: pointer; background: #fff; }
.gi-approach > span { display: grid; gap: 2px; } .gi-approach:has(input:checked) { border-color: var(--color-primary); box-shadow: 0 0 0 1px var(--color-primary); }
.gi-num { max-width: 90px; display: inline-block; } .gi-unit { margin-top: 4px; } .gi-screen td, .gi-screen th { min-width: 120px; } .gi-screen th:first-child { min-width: 220px; }
.gi-link { border: 0; background: none; color: var(--color-primary); font-weight: 700; text-decoration: underline; cursor: pointer; padding: 0; font-size: inherit; }
.gi-checks { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; } .gi-checks li { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--color-border); }
.gi-mark { width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; flex: none; font-size: 12px; }
.gi-checks li.ok .gi-mark { background: #e7f4ed; color: #0b5737; } .gi-checks li.no .gi-mark { background: #fde8e8; color: #9b1c1c; } .gi-checks li.adv .gi-mark { background: #fff4e0; color: #7a4a00; }
.dc-table tbody th[scope="row"] { text-align: start; font-weight: 600; vertical-align: middle; }
/* ---------- Carbon credits ---------- */
.cc-claim { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; margin: 8px 0 10px; }
.cc-claim > div { border: 1px solid var(--color-border); border-radius: 10px; padding: 10px 12px; display: grid; gap: 2px; } .cc-claim b { font-size: 18px; }
.cc-flags { margin-top: 4px; font-size: 11.5px; } .cc-flags summary { cursor: pointer; color: var(--color-primary); font-weight: 600; } .cc-flags ul { margin: 4px 0 0; padding-inline-start: 16px; color: #4b5563; }
.dc-claim-pick { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; } .dc-claim-pick .form-control { width: auto; }
.cc-checks { border: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; } .cc-checks legend { width: 100%; }
/* ---------- Data anomalies ---------- */
.an-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 10px 12px; margin-bottom: 12px; } .an-filters .form-control { width: auto; max-width: 100%; }
.an-bulk { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; } .an-bulk .form-control { flex: 1 1 260px; }
.an-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.an-item { border: 1px solid var(--color-border); border-inline-start: 4px solid #9ca3af; border-radius: 10px; padding: 10px 12px; }
.an-item.sev-high { border-inline-start-color: #dc2626; } .an-item.sev-medium { border-inline-start-color: #d97706; } .an-item.sev-low { border-inline-start-color: #64748b; }
.an-main { display: flex; gap: 10px; align-items: flex-start; } .an-text { flex: 1 1 auto; min-width: 0; } .an-spark { flex: none; } .an-spark svg { display: block; }
.an-sev { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; padding: 1px 7px; border-radius: 999px; background: #f3f4f6; color: #374151; }
.sev-high .an-sev { background: #fde8e8; color: #9b1c1c; } .sev-medium .an-sev { background: #fff4e0; color: #7a4a00; }
.an-act { margin-top: 6px; } .an-act > summary { cursor: pointer; font-size: 13px; font-weight: 700; color: var(--color-primary); } .an-act form { margin-top: 6px; }
.an-rules { margin: 0 0 8px; padding-inline-start: 18px; display: grid; gap: 4px; }
@media (max-width: 600px) { .an-main { flex-wrap: wrap; } .an-spark { width: 100%; } }
/* ---------- Factor import and CBAM ---------- */
.fs-promo { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 14px; }
.fs-map { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; margin-bottom: 10px; } .fs-map label { display: flex; gap: 6px; align-items: center; } .fs-map .form-control { width: auto; max-width: 220px; }
.cb-calc { border: 1px solid var(--color-border); border-radius: 12px; padding: 12px 14px; margin-top: 12px; scroll-margin-top: 80px; }
.cb-calc .cc-claim small { font-size: 12px; font-weight: 600; color: #4b5563; } .cb-pre { margin: 0 0 6px; padding-inline-start: 18px; font-size: 13px; display: grid; gap: 4px; }
.cdp-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-inline-end: 6px; background: #d1d5db; vertical-align: 1px; } .cdp-dot.is-complete { background: #16a34a; } .cdp-dot.is-partial { background: #d97706; } .cdp-dot.is-missing { background: #dc2626; }
/* ---------- Benchmarks ---------- */
.bm-callout { border: 1px solid #bbf7d0; background: #f0fdf4; color: #14532d; border-radius: 10px; padding: 10px 12px; margin-bottom: 10px; font-size: 14px; }
.bm-q { font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; }
.bm-q.is-best { background: #e7f4ed; color: #0b5737; } .bm-q.is-good { background: #e8f1fb; color: #1d4ed8; } .bm-q.is-fair { background: #fff4e0; color: #7a4a00; } .bm-q.is-worst { background: #fde8e8; color: #9b1c1c; }
/* update 121: the company against its sector — a range strip per metric (P25–P75 band, median tick, the company's dot) */
.bm-sector td, .bm-sector th { vertical-align: middle; } .bm-sector .bm-q { white-space: normal; display: inline-block; line-height: 1.35; max-width: 16em; }
.bm-range { display: block; width: 220px; max-width: 100%; height: auto; }
.pl-table th:not(.num) { text-align: start; } .pl-table .num { text-align: end; font-variant-numeric: tabular-nums; }
a.dc-view { text-decoration: none; display: inline-block; }
.dc-views { flex-wrap: wrap; max-width: 100%; }
/* ---------- AI ---------- */
.ai-status { border-radius: 10px; padding: 10px 14px; margin-bottom: 12px; background: #f3f4f6; color: #374151; font-size: 14px; } .ai-status.is-on { background: #e7f4ed; color: #0b5737; }
.ai-share { display: grid; gap: 8px; } .ai-share .form-check { align-items: flex-start; gap: 8px; } .ai-enable { border-top: 1px solid var(--color-border); margin: 12px 0 10px; padding-top: 12px; }
.ai-caps { list-style: none; padding: 0; margin: 0 0 6px; display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 14px; } .ai-caps li.ok { color: #0b5737; } .ai-caps li.no { color: #9b1c1c; }
.ai-panel { border: 1px solid #c7d2fe; background: #f5f7ff; border-radius: 10px; padding: 10px 12px; margin: 8px 0; }
.ai-panel-h { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; } .ai-badge { font-size: 11px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; background: #4338ca; color: #fff; padding: 2px 8px; border-radius: 999px; }
.ai-draft { white-space: normal; background: #fff; border: 1px solid #e0e7ff; border-radius: 8px; padding: 8px 10px; margin-top: 6px; font-size: 13.5px; line-height: 1.5; }
.ai-draft-btn { margin-top: 6px; } .ai-assisted { font-size: 11px; font-weight: 700; color: #4338ca; background: #eef2ff; padding: 1px 7px; border-radius: 999px; }
.topbar-ai { border: 1px solid #c7d2fe; background: #eef2ff; color: #3730a3; font-weight: 700; font-size: 13px; border-radius: 999px; padding: 6px 12px; cursor: pointer; margin-inline-end: 8px; }
.topbar-ai:hover, .topbar-ai:focus-visible { background: #e0e7ff; }
.ai-ask { position: fixed; inset-block: 0; inset-inline-end: 0; width: min(440px, 100vw); background: #fff; box-shadow: -8px 0 30px rgba(15, 23, 42, .18); z-index: 1200; display: flex; flex-direction: column; padding: 12px 14px; gap: 8px; padding-top: calc(12px + env(safe-area-inset-top, 0px)); }
.ai-ask[hidden] { display: none; } .ai-ask-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; } .ai-ask-head h2 { font-size: 17px; margin: 0; }
.ai-msgs { flex: 1 1 auto; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding: 4px 2px; }
.ai-msg { border-radius: 12px; padding: 8px 11px; font-size: 14px; line-height: 1.5; max-width: 92%; } .ai-msg p { margin: 0 0 4px; } .ai-msg ul { margin: 2px 0 4px; padding-inline-start: 18px; }
.ai-msg.is-user { align-self: flex-end; background: #0f6e46; color: #fff; } .ai-msg.is-assistant { align-self: flex-start; background: #f3f4f6; color: #111827; } .ai-msg.is-error { background: #fde8e8; color: #9b1c1c; } .ai-msg.is-wait { opacity: .7; font-style: italic; }
.ai-tools { font-size: 11.5px; color: #4b5563; margin-top: 4px !important; } .ai-hello p { font-size: 14px; color: #374151; } .ai-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ai-chip { border: 1px solid var(--color-border); background: #fff; border-radius: 999px; padding: 5px 10px; font-size: 12.5px; cursor: pointer; text-align: start; } .ai-chip:hover { border-color: #6366f1; }
.ai-ask-form { display: flex; gap: 8px; align-items: flex-end; } .ai-ask-form textarea { flex: 1 1 auto; resize: vertical; } .ai-conv { font-size: 13px; } .ai-foot { margin: 0; }
/* a document handed to the assistant (update 147): the paper clip, the drop target, and the page it opens */
.ai-attach { flex: none; min-width: 38px; font-size: 16px; line-height: 1; padding: 7px 9px; }
.ai-hello p.ai-hello-docs { background: #eef7f2; border-radius: 10px; padding: 8px 10px; color: #14532d; }
.ai-ask.is-drop { outline: 3px dashed #0f6e46; outline-offset: -8px; } .ai-ask.is-drop .ai-msgs { background: #f0fdf4; }
.ai-go { margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(15, 23, 42, .1); } .ai-go-say { font-size: 13px; margin: 0 0 6px !important; } .ai-go-count { color: #4b5563; font-variant-numeric: tabular-nums; }
.ai-go-acts { display: flex; flex-wrap: wrap; gap: 6px; }
/* cards beside an answer (update 148): a chart with its table behind it, figures, a guide with buttons, buttons, a list */
.ai-cards { display: grid; gap: 10px; margin-top: 10px; }
.ai-card { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; background: #fff; }
.ai-card-h { margin: 0 0 6px; font-size: 13.5px; font-weight: 700; color: #111827; } figure.ai-card { margin: 0; }
.ai-card-note { margin: 6px 0 0; font-size: 12px; color: var(--color-text-muted); } .ai-card-acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ai-chart svg { display: block; max-width: 100%; height: auto; font-family: inherit; } .ai-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: #374151; margin-bottom: 4px; }
.ai-legend-i { display: inline-flex; align-items: center; gap: 5px; } .ai-legend-i i { display: inline-block; width: 10px; height: 10px; border-radius: 2px; }
.ai-chart-table { width: 100%; border-collapse: collapse; font-size: 12.5px; margin-top: 8px; } .ai-chart-table caption { text-align: start; font-size: 12px; color: var(--color-text-muted); padding: 0 0 4px; }
.ai-chart-table th, .ai-chart-table td { border-top: 1px solid var(--color-border); padding: 4px 6px; text-align: start; } .ai-chart-table td { text-align: end; font-variant-numeric: tabular-nums; } .ai-chart-table thead th { font-weight: 600; color: #374151; }
.ai-fig-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; }
.ai-fig { border-radius: 10px; padding: 8px 10px; background: #f3f4f6; border-inline-start: 4px solid #9ca3af; } .ai-fig.is-good { background: #e7f4ed; border-color: #0f6e46; } .ai-fig.is-warn { background: #fff4e0; border-color: #d97706; } .ai-fig.is-bad { background: #fde8e8; border-color: #b91c1c; }
.ai-fig-v { font-size: 18px; font-weight: 700; color: #111827; line-height: 1.2; font-variant-numeric: tabular-nums; } .ai-fig-l { font-size: 12px; color: #374151; margin-top: 2px; } .ai-fig-s { font-size: 11.5px; color: var(--color-text-muted); margin-top: 2px; }
.ai-guide-intro { margin: 0 0 8px; font-size: 13px; color: #374151; } .ai-guide-steps { margin: 0; padding-inline-start: 22px; display: grid; gap: 8px; } .ai-guide-steps li { font-size: 13px; color: #1f2937; } .ai-guide-steps li::marker { font-weight: 700; color: #0f6e46; }
.ai-guide-text { display: block; } .ai-guide-acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.ai-list ul { margin: 0; padding-inline-start: 18px; display: grid; gap: 4px; font-size: 13px; } .ai-list li.is-bad::marker { color: #b91c1c; } .ai-list li.is-warn::marker { color: #d97706; } .ai-list li.is-good::marker { color: #0f6e46; }
.ai-actions { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px; }
.ai-msg.is-assistant p > a:only-child { display: inline-block; border: 1px solid #0f6e46; color: #0b5737; border-radius: 999px; padding: 4px 12px; text-decoration: none; font-weight: 600; font-size: 12.5px; }   /* "Open …" at the end of an answer reads as a button */
.ai-msg.is-assistant p > a:only-child:hover { background: #e7f4ed; }
/* a report the assistant prepared (update 149): a cover in the report's colour, its chapters, the drafting's progress, the buttons */
.ai-report { padding: 0; overflow: hidden; --rp: #0f6e46; }
.ai-report-cover { position: relative; padding: 16px 14px 14px; color: #fff; background: var(--rp); background: linear-gradient(rgba(0, 0, 0, .28), rgba(0, 0, 0, .28)), linear-gradient(135deg, color-mix(in srgb, var(--rp) 82%, #000) 0%, var(--rp) 55%, color-mix(in srgb, var(--rp) 70%, #fff) 100%); min-height: 118px; display: flex; flex-direction: column; justify-content: flex-end; gap: 4px; text-shadow: 0 1px 2px rgba(0, 0, 0, .25); }   /* (the dark wash keeps white text readable on every family's colour) */
.ai-report-cover::after { content: ""; position: absolute; inset-inline-end: -30px; top: -40px; width: 150px; height: 150px; border-radius: 50%; background: rgba(255, 255, 255, .14); pointer-events: none; }
.ai-report-kind { font-size: 11.5px; letter-spacing: .02em; font-weight: 600; opacity: .9; margin: 0; }
.ai-report-title { margin: 0; font-size: 17px; line-height: 1.25; font-weight: 700; color: #fff; text-wrap: balance; }
.ai-report-meta { margin: 0; font-size: 12.5px; opacity: .92; }
.ai-report-body { padding: 10px 12px 12px; display: grid; gap: 8px; }
.ai-report-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; } .ai-report-chips li { font-size: 12px; color: #374151; background: #f3f4f6; border-radius: 999px; padding: 2px 9px; }
.ai-report-secs { margin: 0; padding-inline-start: 20px; columns: 2; column-gap: 16px; font-size: 12.5px; color: #374151; } .ai-report-secs li { break-inside: avoid; padding: 1px 0; }
.ai-report-secs-h { margin: 0; font-size: 12px; font-weight: 700; color: #111827; }
.ai-report-prog { margin: 0; font-size: 12.5px; color: #374151; } .ai-report-prog.is-done { color: #0b5737; font-weight: 600; } .ai-report-prog.is-bad { color: #9b1c1c; }
.ai-report-bar { height: 6px; border-radius: 999px; background: #e5e7eb; overflow: hidden; } .ai-report-bar[hidden] { display: none; } .ai-report-bar > i { display: block; height: 100%; width: 0; background: var(--rp); transition: width .4s ease; }
.ai-report-rest { display: grid; gap: 8px; } .ai-report-rest:empty { display: none; }
.ai-report-note { margin: 0; font-size: 12px; color: var(--color-text-muted); } .ai-report-left { margin: 0; padding-inline-start: 18px; font-size: 12px; color: var(--color-text-muted); }
.ai-report-acts { display: flex; flex-wrap: wrap; gap: 6px; }
@media (max-width: 640px) { .ai-report-secs { columns: 1; } }
@media (prefers-reduced-motion: reduce) { .ai-report-bar > i { transition: none; } }
.topbar-ai { flex: none; min-height: 32px; min-width: 32px; display: inline-flex; align-items: center; justify-content: center; gap: 4px; }
@media (max-width: 640px) { .topbar-ai { padding: 6px 9px; margin-inline-end: 4px; } .topbar-ai span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }
.ai-fab { display: none; }
@media (max-width: 640px) {
  .topbar-ai { display: none; }
  .ai-fab { display: flex; align-items: center; justify-content: center; position: fixed; inset-inline-end: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 1100; width: 52px; height: 52px; border-radius: 50%; border: 1px solid #c7d2fe; background: #eef2ff; color: #3730a3; font-size: 20px; box-shadow: 0 6px 18px rgba(55, 48, 163, .3); cursor: pointer; }
}
/* ---------- Document reader ---------- */
.doc-table td, .doc-table th { vertical-align: top; } .doc-table td:last-child { min-width: 260px; } .doc-table select { min-width: 140px; }
.doc-conf { font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: #eef2f6; color: #374151; } .doc-conf.is-high { background: #e7f4ed; color: #0b5737; } .doc-conf.is-low { background: #fde8e8; color: #9b1c1c; } .doc-conf.is-medium { background: #fff4e0; color: #7a4a00; }
.doc-quote { font-style: italic; color: #374151; margin-top: 3px; overflow-wrap: anywhere; } .doc-warn { color: #8a4b00; margin-top: 3px; display: flex; gap: 4px; align-items: flex-start; }
#topbarTools:focus { outline: none; }   /* the skip-link target itself; the controls inside keep their focus rings */
/* ---------- AI in reports ---------- */
.rv-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; } .rv-item { display: flex; gap: 10px; border: 1px solid var(--color-border); border-radius: 10px; padding: 9px 11px; } .rv-item p { margin: 3px 0 0; font-size: 14px; }
.rv-sev { flex: none; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em; padding: 2px 8px; border-radius: 999px; background: #eef2f6; color: #374151; height: fit-content; }
.rv-item.is-high .rv-sev { background: #fde8e8; color: #9b1c1c; } .rv-item.is-medium .rv-sev { background: #fff4e0; color: #7a4a00; }
.tr-table td, .tr-table th { vertical-align: top; } .tr-table td { min-width: 220px; }
.ai-write { margin-top: 6px; } .ai-write > summary { cursor: pointer; font-size: 13px; font-weight: 700; color: #3730a3; } .ai-write-body { display: grid; gap: 6px; margin-top: 6px; } .ai-write-body label { font-size: 12.5px; font-weight: 600; }
/* ---------- Server & Updates (platform admin) ---------- */
.srv-wrap { max-width: 980px; } .srv-h1 { font-size: 22px; margin: 0 0 4px; } .srv-card { padding: 14px 16px; margin-bottom: 12px; } .srv-card h2 { font-size: 16px; margin: 0 0 8px; }
.srv-lead { margin: 0 0 8px; font-size: 14.5px; } .srv-fail { color: #9b1c1c; } .srv-fix { color: #374151; margin-top: 2px; } .srv-details { margin-top: 8px; } .srv-details > summary { cursor: pointer; font-size: 13.5px; font-weight: 600; }
.srv-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; } .srv-list li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; }
.srv-st { flex: none; min-width: 46px; text-align: center; font-size: 11px; font-weight: 800; padding: 2px 6px; border-radius: 999px; background: #eef2f6; color: #374151; }
.srv-st.is-ok { background: #e7f4ed; color: #0b5737; } .srv-st.is-warn { background: #fff4e0; color: #7a4a00; } .srv-st.is-fail { background: #fde8e8; color: #9b1c1c; }
.srv-cron { margin-top: 10px; border-top: 1px solid var(--color-border); padding-top: 10px; } .srv-cmd { background: #0f172a; color: #e2e8f0; padding: 8px 10px; border-radius: 8px; font-size: 12.5px; white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; }
/* ---------- BRSR value chain ---------- */
.vc-table tr.vc-out th, .vc-table tr.vc-out td { color: #6b7280; } .vc-top { font-size: 10.5px; font-weight: 800; background: #eef2ff; color: #3730a3; padding: 1px 6px; border-radius: 999px; }
.vc-st { font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; } .vc-st.is-in_chain, .vc-st.is-included { background: #e7f4ed; color: #0b5737; } .vc-st.is-beyond_cap { background: #fff4e0; color: #7a4a00; } .vc-st.is-excluded { background: #fde8e8; color: #9b1c1c; }
.vc-acts { white-space: nowrap; } .vc-acts details { display: inline-block; vertical-align: top; } .vc-pop { position: relative; min-width: 300px; max-width: 640px; white-space: normal; margin-top: 6px; }
.vc-reqbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin: 8px 0 14px; } .vc-ans { display: grid; grid-template-columns: minmax(160px, 1fr) auto; gap: 2px 12px; font-size: 13px; margin: 0 0 6px; } .vc-ans dt { color: #4b5563; } .vc-ans dd { margin: 0; text-align: end; }
/* update 122: value chain campaigns — a stage bar per campaign (counts by stage), the partner list, provenance in the review */
.vcc { border: 1px solid var(--color-border); border-radius: 12px; padding: 12px 14px; margin: 0 0 14px; }
.vcc-head { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: baseline; margin-bottom: 10px; }
.vcc-kpis { margin-bottom: 10px; }
.vcc-bar { display: flex; height: 12px; border-radius: 999px; overflow: hidden; background: #eef2f6; margin: 2px 0 6px; }
.vcc-bar span { display: block; height: 100%; min-width: 3px; }
.vcc-bar .is-skipped, .vcc-dot.is-skipped { background: #d1d5db; } .vcc-bar .is-not_opened, .vcc-dot.is-not_opened { background: #e5c07b; } .vcc-bar .is-opened, .vcc-dot.is-opened { background: #93c5fd; }
.vcc-bar .is-in_progress, .vcc-dot.is-in_progress { background: #3b82f6; } .vcc-bar .is-submitted, .vcc-dot.is-submitted { background: #7c3aed; } .vcc-bar .is-returned, .vcc-dot.is-returned { background: #f97316; }
.vcc-bar .is-accepted, .vcc-dot.is-accepted { background: #0f6e46; } .vcc-bar .is-cancelled, .vcc-dot.is-cancelled { background: #9ca3af; }
.vcc-legend { list-style: none; padding: 0; margin: 0 0 10px; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12.5px; color: #374151; }
.vcc-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-inline-end: 5px; vertical-align: -1px; }
.vcc-st { font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; }
.vcc-st.is-accepted { background: #e7f4ed; color: #0b5737; } .vcc-st.is-submitted { background: #f1e9fe; color: #5b21b6; } .vcc-st.is-in_progress, .vcc-st.is-opened { background: #e8f1fb; color: #1d4ed8; }
.vcc-st.is-returned { background: #fff0e6; color: #9a3412; } .vcc-st.is-not_opened { background: #fff4e0; color: #7a4a00; }
.vcc-late { font-size: 11px; font-weight: 700; color: #9b1c1c; white-space: nowrap; }
.vcc-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.vcc-before { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 4px 16px; } .vcc-before legend { width: 100%; padding: 0; }
.vc-prov { margin: 0 0 6px; color: #374151; } .vc-ref { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; overflow-wrap: anywhere; } .vc-ok { color: #0b5737; font-weight: 700; } .vc-bad { color: #9b1c1c; font-weight: 700; }
.vc-chk { border-radius: 8px; padding: 6px 9px; font-size: 13px; margin: 0 0 6px; } .vc-chk.is-error { background: #fde8e8; color: #7f1d1d; } .vc-chk.is-warn { background: #fff7e6; color: #6b4100; }
.vc-evs { list-style: none; padding: 0; margin: 0 0 6px; font-size: 13px; } .vc-evs li { overflow-wrap: anywhere; }
/* update 123: Scope 3 — all categories (states, factor finder, product units) */
.s3c-st { font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; }
.s3c-st.is-measured { background: #e7f4ed; color: #0b5737; } .s3c-st.is-not_calculated { background: #fff4e0; color: #7a4a00; } .s3c-st.is-excluded, .s3c-st.is-not_relevant { background: #f3f4f6; color: #4b5563; } .s3c-st.is-not_screened { background: #fde8e8; color: #9b1c1c; }
.s3c-warn { color: #9b1c1c; font-weight: 600; }
.s3c-find { margin-top: 4px; } .s3c-find summary { font-size: 13px; cursor: pointer; min-height: 28px; display: inline-flex; align-items: center; color: var(--color-primary); }
.s3c-results { list-style: none; padding: 0; margin: 6px 0 0; display: grid; gap: 4px; } .s3c-results li { display: flex; gap: 8px; align-items: center; justify-content: space-between; flex-wrap: wrap; border: 1px solid var(--color-border); border-radius: 8px; padding: 6px 8px; font-size: 13px; } .s3c-results li > span { min-width: 0; overflow-wrap: anywhere; }
.s3c-units { max-width: 160px; } .s3c-pub { margin-top: 10px; } .s3c-up td { min-width: 200px; } .s3c-all td:last-child { min-width: 260px; }
.s3c-t thead th:not(.num) { text-align: start; } .s3c-t .num { text-align: end; font-variant-numeric: tabular-nums; } .s3c-t tbody th[scope="row"] { vertical-align: top; }
.s3c-up th:nth-child(3), .s3c-up th:nth-child(4) { width: 34%; }
@media (max-width: 640px) {   /* Scope 3 tables as labelled rows on phones (the EPR pattern) */
  .s3c-stack, .s3c-stack tbody { display: block; width: 100%; } .s3c-stack thead { display: block; position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .s3c-stack tr { display: block; padding: 8px 0; border-bottom: 1px solid var(--color-border); } .s3c-stack th[scope="row"], .s3c-stack td { display: block; min-width: 0 !important; width: auto !important; padding: 3px 10px; border: 0; text-align: start !important; white-space: normal; }
  .s3c-stack td.is-empty { display: none; } .s3c-stack td[data-label]:not([data-label=""])::before { content: attr(data-label); display: block; font-size: 11.5px; font-weight: 700; color: #667085; }
  .s3c-stack .s3c-units { max-width: none; width: 100%; } .s3c-stack .dc-form-grid { grid-template-columns: 1fr; }
}
.vc-basis { background: #f9fafb; border: 1px solid var(--color-border); border-radius: 8px; padding: 10px 12px; line-height: 1.55; } .sp-group { font-size: 15px; margin: 18px 0 6px; padding-top: 10px; border-top: 1px solid var(--color-border); }
/* ---------- CCTS ---------- */
.cc-pos { font-weight: 800; } .cc-pos.is-earn { color: #0b5737; } .cc-pos.is-owe { color: #9b1c1c; } .cc-exp { color: #9b1c1c; font-weight: 700; }
@media (max-width: 900px) { .dc-two { grid-template-columns: minmax(0, 1fr); } }
.dc-two > * { min-width: 0; } .dc-form-grid { grid-template-columns: repeat(auto-fill, minmax(min(200px, 100%), 1fr)); }
/* ---------- Financed emissions ---------- */
.fe-dq { display: inline-block; min-width: 20px; text-align: center; font-size: 11px; font-weight: 800; border-radius: 999px; padding: 1px 6px; background: #eef2f6; color: #374151; }
.fe-dq.is-1, .fe-dq.is-2 { background: #e7f4ed; color: #0b5737; } .fe-dq.is-3 { background: #e8f1fb; color: #1d4ed8; } .fe-dq.is-4, .fe-dq.is-5 { background: #fff4e0; color: #7a4a00; }
.fe-note { color: #8a4b00; } .fe-sens { font-size: 10.5px; font-weight: 700; background: #fff4e0; color: #7a4a00; padding: 1px 6px; border-radius: 999px; } .fe-ok { color: #0b5737; font-weight: 700; } .fe-behind { color: #9b1c1c; font-weight: 700; }
.fe-item { border-top: 1px solid var(--color-border); padding: 10px 0; } .fe-item:first-of-type { border-top: 0; }
/* ---------- Questionnaires ---------- */
.qn-bar { width: 120px; height: 8px; background: #eef2f6; border-radius: 999px; overflow: hidden; display: inline-block; vertical-align: middle; margin-inline-end: 6px; } .qn-bar span { display: block; height: 100%; background: #0f6e46; }
.qn-q { border-top: 1px solid var(--color-border); padding: 12px 0; scroll-margin-top: 80px; } .qn-q:first-of-type { border-top: 0; } .qn-sec { margin-top: 14px; }
.qn-head { display: flex; gap: 8px; align-items: flex-start; flex-wrap: wrap; } .qn-head .form-label { flex: 1 1 320px; } .qn-n { display: inline-block; min-width: 26px; font-weight: 800; color: #4b5563; }
.qn-st { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; } .qn-st.is-approved { background: #e7f4ed; color: #0b5737; } .qn-st.is-needs_input { background: #fde8e8; color: #9b1c1c; } .qn-st.is-drafted { background: #e8f1fb; color: #1d4ed8; }
.qn-lib { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; } .qn-lib li { border: 1px solid var(--color-border); border-radius: 10px; padding: 9px 11px; }
/* ---------- Connectors ---------- */
.cn-st { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #eef2f6; color: #374151; } .cn-st.is-connected { background: #e7f4ed; color: #0b5737; } .cn-st.is-error { background: #fde8e8; color: #9b1c1c; }
.cn-map { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .cn-map .form-control { width: auto; min-width: 0; max-width: 100%; } .cn-map select[name=metric_id] { flex: 1 1 220px; } .cn-f { width: 80px !important; } .cn-steps { padding-inline-start: 18px; } .cn-steps code { font-size: 12px; word-break: break-all; }
/* ---------- Stakeholder surveys ---------- */
.sv-page { background: #f6f7f9; } .sv-main { max-width: 760px; margin: 0 auto; padding: 24px 16px 48px; } .sv-org { color: #4b5563; font-weight: 700; margin: 0; } .sv-h1 { font-size: 26px; margin: 4px 0 10px; } .sv-lead { font-size: 16px; line-height: 1.55; }
.sv-cat { font-size: 18px; margin: 22px 0 8px; } .sv-topic { background: #fff; border: 1px solid var(--color-border); border-radius: 12px; padding: 12px 14px; margin: 0 0 12px; } .sv-topic > legend { font-weight: 800; font-size: 16px; padding: 0 4px; }
.sv-scale { border: 0; padding: 0; margin: 8px 0 0; } .sv-q { font-size: 13px; font-weight: 700; color: #374151; padding: 0; } .sv-opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 6px; margin-top: 4px; }
.sv-opt { display: flex; gap: 6px; align-items: center; border: 1px solid var(--color-border); border-radius: 8px; padding: 7px 9px; cursor: pointer; font-size: 13px; } .sv-opt:has(input:checked) { border-color: #0f6e46; background: #e7f4ed; } .sv-opt input { margin: 0; }
.sv-more { margin-top: 8px; font-size: 13px; } .sv-hp { position: absolute; inset-inline-start: -10000px; width: 1px; height: 1px; overflow: hidden; } .sv-desc { margin: 2px 0 0; }
.sv-picks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 2px 14px; } .sv-pick { border: 0; padding: 0; margin: 10px 0; } .sv-gw { display: flex; gap: 8px; align-items: center; } .sv-w { width: 64px !important; }
.sv-url { font-size: 12px; min-width: 220px; } .sv-bar { height: 5px; background: #eef2f6; border-radius: 999px; margin-top: 3px; overflow: hidden; } .sv-bar span { display: block; height: 100%; background: #0f6e46; }
.sv-q2 { margin: 4px 0 0; padding-inline-start: 10px; border-inline-start: 3px solid #d1d5db; font-size: 13px; color: #374151; } .sv-comments { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 8px; } .sv-comments li { border-top: 1px solid var(--color-border); padding-top: 6px; }
.sv-picks { gap: 4px 16px; } .sv-picks .form-check, .sv-gw .form-check { min-height: 30px; display: flex; align-items: center; gap: 8px; margin: 0; } .sv-picks input[type=checkbox] { width: 18px; height: 18px; flex: 0 0 auto; }
.sv-more > summary { padding: 6px 0; cursor: pointer; }
/* ---------- Consultant mode ---------- */
.ca-banner { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; justify-content: space-between; background: #fff7e6; border: 1px solid #f3c66b; color: #5c3b00; border-radius: 10px; padding: 8px 12px; margin: 0 0 14px; font-size: 14px; }
.ca-banner-acts { display: inline-flex; gap: 10px; align-items: center; } .ca-banner-acts form { margin: 0; } .ca-banner a { color: #5c3b00; font-weight: 700; }
.brand-logo { max-height: 30px; max-width: 120px; object-fit: contain; border-radius: 6px; background: #fff; }
/* ---------- Climate risk ---------- */
.cr-ws { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; white-space: nowrap; } .cr-ws.is-yes { background: #fde8e8; color: #9b1c1c; } .cr-ws.is-no { background: #e7f4ed; color: #0b5737; } .cr-ws.is-unknown { background: #eef2f6; color: #374151; }
.cr-r { display: inline-block; min-width: 24px; text-align: center; border-radius: 6px; font-weight: 700; font-size: 12px; padding: 2px 4px; background: #f3f4f6; color: #4b5563; } .cr-r.is-1, .cr-r.is-2 { background: #e7f4ed; color: #0b5737; } .cr-r.is-3 { background: #fff4e0; color: #7a4a00; } .cr-r.is-4, .cr-r.is-5 { background: #fde8e8; color: #9b1c1c; }
.cr-heat { border-collapse: collapse; font-size: 12px; } .cr-heat th { font-weight: 600; color: #4b5563; padding: 4px 6px; text-align: center; } .cr-heat td { width: 44px; height: 34px; text-align: center; font-weight: 800; border: 2px solid #fff; }
.cr-h.is-low { background: #e7f4ed; color: #0b5737; } .cr-h.is-med { background: #fff4e0; color: #7a4a00; } .cr-h.is-high { background: #fde8e8; color: #9b1c1c; } .cr-total th, .cr-total td { border-top: 2px solid var(--color-border); }
/* ---------- Report review ---------- */
.rr-st, .rr-dec { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; } .rr-st.is-approved, .rr-st.is-signed, .rr-dec.is-approved { background: #e7f4ed; color: #0b5737; } .rr-st.is-changes_requested, .rr-dec.is-changes { background: #fde8e8; color: #9b1c1c; }
.rr-block { border-top: 1px solid var(--color-border); padding: 12px 0; scroll-margin-top: 80px; } .rr-block:first-of-type { border-top: 0; } .rr-bhead { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.rr-c { border-inline-start: 3px solid #d1d5db; padding: 4px 10px; margin: 8px 0; } .rr-c.is-resolved { background: #f6fbf8; border-inline-start-color: #a7d7bd; } .rr-acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; margin-top: 8px; } .rr-acts form { margin: 0; }
.rr-cform { display: flex; gap: 6px; flex: 1 1 280px; } .rr-cform .form-control { flex: 1 1 auto; min-width: 0; } .rr-hash { word-break: break-all; font-size: 11px; } .rr-signed { border-color: #a7d7bd; }
.rr-diff { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; } .rr-diff li { border-inline-start: 3px solid #d1d5db; padding-inline-start: 10px; } .rr-diff li.is-added { border-color: #0f6e46; } .rr-diff li.is-removed { border-color: #9b1c1c; } .rr-diff del { color: #9b1c1c; } .rr-diff ins { color: #0b5737; text-decoration: none; background: #e7f4ed; }
/* frozen review rounds (update 137, RG-17) */
.rr-fz { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 600; color: #374151; background: #eef2f6; border-radius: 999px; padding: 1px 7px; margin-inline-start: 6px; vertical-align: 1px; }
.rr-frozen { border-color: #b9c7d6; } .rr-figs { margin-top: 10px; } .rr-figs > summary, .rr-chg > summary, .rr-ftext > summary { cursor: pointer; }
.rr-figs .table-wrap { margin-top: 8px; } .rr-ser caption { caption-side: top; text-align: start; font-weight: 600; font-size: 12px; color: #374151; padding: 2px 0; }
.rr-changes { border-color: #e3c98a; } .rr-changes caption { caption-side: top; text-align: start; font-weight: 600; color: #374151; padding: 4px 0; }
.rr-chg { margin-top: 8px; } .rr-red { margin-top: 6px; padding: 8px 10px; border: 1px solid var(--color-border); border-radius: 8px; background: #fbfcfd; font-size: 12.5px; line-height: 1.6; overflow-wrap: anywhere; max-height: 520px; overflow-y: auto; }
.rr-red del { color: #a3180f; background: #fde8e6; text-decoration: line-through; text-decoration-thickness: 1px; border-radius: 2px; }
.rr-red ins { color: #0b5737; background: #e3f4ea; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; border-radius: 2px; }
.rr-red.is-new { background: #f6fbf8; } .rr-fold { color: #6b7280; letter-spacing: 2px; }
.rr-diff .rr-chg > summary { font-weight: 600; color: #374151; }
.rr-where { margin: 6px 0 0; } .rr-ftext { margin-top: 4px; }
.rr-look { margin: 8px 0 0; padding-left: 10px; border-left: 3px solid #c7d2de; }
.rr-verify { margin: 4px 0 10px; padding: 6px 10px; border-radius: 8px; background: #f6f7f8; } .rr-verify.is-ok { background: #e7f4ed; color: #0b5737; } .rr-verify.is-bad { background: #fdecea; color: #7a120b; }
.rr-asfrozen.is-asked { padding: 6px 10px; border-radius: 8px; background: #fff8e6; border: 1px solid #e3c98a; }
/* ---------- Maturity and ratings ---------- */
.mt-bars { list-style: none; padding: 0; margin: 0; display: grid; gap: 6px; } .mt-bars li { display: grid; grid-template-columns: minmax(120px, 1fr) 2fr 44px; gap: 8px; align-items: center; }
.mt-bar { height: 10px; background: #eef2f6; border-radius: 999px; overflow: hidden; } .mt-bar span { display: block; height: 100%; background: #0f6e46; } .mt-next li { margin-bottom: 4px; }
.mt-dim { margin-top: 16px; } .mt-q { border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 12px; margin: 0 0 8px; } .mt-q > legend { font-weight: 700; font-size: 14px; padding: 0 4px; }
.mt-ev { display: block; font-weight: 400; font-size: 12px; color: #1d4ed8; } .mt-opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 6px; margin-top: 4px; }
.mt-opt { display: flex; gap: 6px; align-items: flex-start; border: 1px solid var(--color-border); border-radius: 8px; padding: 7px 9px; font-size: 12.5px; cursor: pointer; min-height: 30px; } .mt-opt:has(input:checked) { border-color: #0f6e46; background: #e7f4ed; }
.mt-st { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; } .mt-st.is-ready { background: #e7f4ed; color: #0b5737; } .mt-st.is-partial { background: #fff4e0; color: #7a4a00; } .mt-st.is-missing { background: #fde8e8; color: #9b1c1c; }
.mt-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr)); gap: 8px; } .mt-tile { display: flex; flex-direction: column; gap: 2px; background: #f0f7f3; border-radius: 10px; padding: 9px 11px; } .mt-tile b { font-size: 18px; color: #0b5737; }
.ch-acts { white-space: nowrap; } .ch-acts form { display: inline-block; margin: 0 4px 4px 0; } .bm-job { background: #f6f7f9; border: 1px solid var(--color-border); border-radius: 10px; padding: 10px 12px; margin: 0 0 10px; }
.ri-list { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 8px; } .ri-idea { border: 1px solid var(--color-border); border-radius: 10px; padding: 9px 11px; } .ri-head { display: flex; gap: 6px; align-items: center; }
.fl-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; } .fl-item { display: flex; gap: 12px; align-items: flex-start; border: 1px solid var(--color-border); border-radius: 12px; padding: 10px; } .fl-item.is-off { background: #f3f4f6; border-style: dashed; }
.fl-qr { flex: 0 0 auto; width: 110px; } .fl-qr svg { width: 110px; height: auto; display: block; } .fl-info { flex: 1 1 auto; min-width: 0; }
.fl-mtab td { vertical-align: middle; } .fl-mtab select { min-width: 200px; } .fl-mtab .form-check { margin: 0; min-height: 30px; display: flex; gap: 8px; align-items: center; }
.fl-info .sv-url { min-width: 0; width: 100%; } @media (max-width: 560px) { .fl-item { flex-direction: column; } .fl-qr { width: 140px; } .fl-qr svg { width: 140px; } }
.fl-info .ch-acts { white-space: normal; display: flex; flex-wrap: wrap; gap: 6px; } .fl-info .ch-acts form { margin: 0; } .fl-item { min-width: 0; }
.fl-info { width: 100%; } .fl-info details, .fl-info form, .fl-info .table-wrap, .fl-info .dc-form-grid { max-width: 100%; min-width: 0; } .fl-info .table-wrap { overflow-x: auto; } .fl-mtab select { min-width: 150px; }
/* ---------- Product footprints ---------- */
.pf-bar { display: flex; height: 18px; border-radius: 999px; overflow: hidden; background: #eef2f6; margin: 4px 0 8px; } .pf-bar span { display: block; height: 100%; }
.pf-legend { list-style: none; padding: 0; margin: 0 0 10px; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; } .pf-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-inline-end: 6px; vertical-align: -1px; }
.pf-add { border-top: 1px solid var(--color-border); margin-top: 12px; padding-top: 6px; }
.cb-def, .cb-inst { border-top: 1px solid var(--color-border); padding-top: 10px; margin-top: 10px; } .cb-def:first-of-type, .cb-inst:first-of-type { border-top: 0; margin-top: 0; }
/* ---------- Assurance readiness ---------- */
.as-band { font-weight: 800; padding: 2px 8px; border-radius: 999px; font-size: 12px; } .as-band.is-good { background: #e7f4ed; color: #0b5737; } .as-band.is-fair { background: #fff4e0; color: #7a4a00; } .as-band.is-poor { background: #fde8e8; color: #9b1c1c; }
.as-list { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 8px; } .as-item { border: 1px solid var(--color-border); border-radius: 10px; padding: 9px 11px; }
.as-st, .as-sev { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; } .as-st.is-accepted { background: #e7f4ed; color: #0b5737; } .as-st.is-submitted { background: #e8f1fb; color: #1d4ed8; } .as-st.is-returned, .as-sev.is-major { background: #fde8e8; color: #9b1c1c; } .as-sev.is-minor { background: #fff4e0; color: #7a4a00; }
.as-test { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; } .as-test .form-control { flex: 1 1 110px; min-width: 0; max-width: 160px; }
/* readiness per KPI and the plan; the evidence pack (update 118) */
.as-rd { min-width: 1080px; } .as-rd th, .as-rd td { vertical-align: top; } .as-rd th[scope="row"] { min-width: 230px; white-space: normal; } .as-rd td.text-xs { min-width: 200px; max-width: 280px; white-space: normal; } .as-rd td.text-sm { white-space: normal; } .as-warn { color: #7a4a00; font-weight: 600; }
.as-planform { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; align-items: center; } .as-planform .form-control { flex: 0 1 180px; min-width: 0; } .as-item.is-late { border-color: #e9b4b4; } .as-item.is-done, .as-item.is-dropped { background: #f6f8fa; } .as-item.is-done > .rr-bhead > b, .as-item.is-dropped > .rr-bhead > b { font-weight: 500; }
.ri-panel { margin-top: 6px; } .ri-line { margin: 0 0 4px; font-size: 13px; font-weight: 600; } .ri-h { font-size: 12px; margin: 10px 0 4px; color: #374151; } .ri-list { margin: 0; padding-left: 18px; display: grid; gap: 4px; font-size: 13px; } .ri-list.ri-compact { gap: 2px; font-size: 12.5px; } .ri-details > summary { cursor: pointer; } .ri-frozen { color: #7a4a00; font-weight: 600; } .ri-more { margin-top: 4px; } .ri-more > summary { cursor: pointer; }
.rq-tlist { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; } .rq-late { color: #9b1c1c; font-weight: 700; } .rq-preview td { white-space: normal; }
.doc-notdup { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; font-weight: 600; color: #7a4a00; } .doc-dupbadge { color: #7a4a00; font-weight: 700; } .doc-dup a { font-weight: 700; } .ev-dup { color: #7a4a00; }
.asp-list { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 6px; } .asp-list li { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 10px; } .asp-list code { font-size: 11px; overflow-wrap: anywhere; }
/* ---------- Ask ESGTrack and regulation watch ---------- */
.sr-list { padding-inline-start: 22px; margin: 0; display: grid; gap: 10px; } .sr-list mark { background: #fff1b8; color: inherit; padding: 0 1px; border-radius: 2px; }
.sr-answer { border-color: #a7d7bd; } .sr-cite { font-weight: 700; text-decoration: none; } .sr-warn { background: #fff4e0; color: #7a4a00; padding: 8px 10px; border-radius: 8px; }
.as-item .ch-acts { white-space: normal; display: flex; flex-wrap: wrap; gap: 6px; } .as-item .ch-acts form { margin: 0; } .rr-bhead > span, .rr-bhead > b { min-width: 0; overflow-wrap: anywhere; } .as-item .ch-acts .form-control { min-width: 0; }
.cw-rel { font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 999px; white-space: nowrap; background: #eef2f6; color: #374151; } .cw-rel.is-equivalent, .cw-rel.is-converted { background: #e7f4ed; color: #0b5737; } .cw-rel.is-partial { background: #fff4e0; color: #7a4a00; }
.as-item { min-width: 0; overflow-wrap: anywhere; } .as-item .form-control { max-width: 100%; }
.fr-card { border-color: #a7d7bd; } .fr-card-body { display: flex; gap: 14px; align-items: center; justify-content: space-between; flex-wrap: wrap; } .fr-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.rb-types { margin-bottom: 10px; }
.cw-bad { color: #b42318; } .fr-warn { background: #fdeceb; color: #7a271a; padding: 8px 10px; border-radius: 8px; margin: 8px 0; } .fr-card-body { flex-wrap: wrap; } .fr-card .fr-warn { flex-basis: 100%; }
/* ---------- Reports gallery and preview ---------- */
.rp-ask { margin: 0 0 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; color: #374151; }
.rp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; } .rp-card { border: 1px solid var(--border, #dde3e8); border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; background: #fff; }
.rp-cover { position: relative; display: block; aspect-ratio: 1 / 1.1; background: linear-gradient(160deg, #fff 0 60%, #f1f4f6 60%); text-decoration: none; color: #10202c; border-bottom: 1px solid #e6eaee; overflow: hidden; }
.rp-cover:hover, .rp-cover:focus-visible { box-shadow: inset 0 0 0 3px var(--rp, #0f6e46); } .rp-band { position: absolute; inset: 0 auto 0 0; width: 28%; background: var(--rp, #0f6e46); }
.rp-ctitle { position: absolute; left: 34%; right: 8%; top: 38%; font-weight: 800; font-size: 18px; line-height: 1.15; } .rp-cco { position: absolute; left: 34%; right: 8%; bottom: 18%; font-weight: 700; font-size: 13px; } .rp-cfy { position: absolute; left: 34%; bottom: 10%; font-size: 12px; color: #4b5563; }
.rp-body { padding: 12px 14px 14px; } .rp-h { margin: 0; font-size: 15px; } .rp-acts { display: flex; flex-wrap: wrap; gap: 6px; }
.rp-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; } .rp-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 12px; }
.rp-seg { display: inline-flex; border: 1px solid #c9d2da; border-radius: 999px; overflow: hidden; } .rp-seg a { padding: 8px 16px; min-height: 36px; display: inline-flex; align-items: center; text-decoration: none; color: #1f2d3a; font-weight: 600; font-size: 13px; } .rp-seg a.is-on { background: #0f6e46; color: #fff; }
.rp-what { flex: 1 1 220px; } .rp-tpl .form-control { max-width: 220px; } .rp-frame { background: #e9edf0; border-radius: 10px; padding: 8px; margin: 10px 0 6px; } .rp-viewer { width: 100%; height: 78vh; min-height: 480px; border: 0; border-radius: 6px; background: #fff; display: block; }
.rp-bar2 { display: block; } .rp-bar2 .rp-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 10px; }
.rp-types { display: flex; flex-wrap: wrap; gap: 6px; } .rp-types a { padding: 8px 14px; min-height: 36px; display: inline-flex; align-items: center; border: 1px solid #c9d2da; border-radius: 10px; text-decoration: none; color: #1f2d3a; font-weight: 700; font-size: 13px; background: #fff; }
.rp-types a.is-on { background: #0f2a1f; border-color: #0f2a1f; color: #fff; } .rp-types a:hover:not(.is-on) { border-color: #0f6e46; }
/* ---------- Design families gallery ---------- */
.rf-gallery { display: flex; gap: 8px; align-items: flex-end; overflow-x: auto; padding: 8px 2px 10px; margin: 6px 0; -webkit-overflow-scrolling: touch; } .rf-label { font-size: 12px; font-weight: 700; color: #4b5563; align-self: center; margin-inline-end: 4px; }
.rf-item { flex: 0 0 auto; width: 78px; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px 4px; border: 2px solid transparent; border-radius: 10px; text-decoration: none; color: #1f2d3a; }
.rf-item img { width: 62px; height: 88px; object-fit: cover; border-radius: 3px; box-shadow: 0 2px 6px rgba(0,0,0,.18); background: #fff; } .rf-item:hover { border-color: #c9d2da; } .rf-item.is-on { border-color: #0f6e46; background: #eef7f2; }
.rf-name { font-size: 11px; font-weight: 600; text-align: center; line-height: 1.2; } .rf-none { width: 62px; height: 88px; display: flex; align-items: center; justify-content: center; border: 1px dashed #b9c4cf; border-radius: 3px; font: 700 20px Georgia, serif; color: #4b5563; background: #f7f9fa; }
.rf-apply { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 4px 0 8px; }
.rf-sep { flex: 0 0 auto; align-self: center; writing-mode: vertical-rl; transform: rotate(180deg); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #1f2937; padding: 0 2px; border-inline-start: 1px solid #d5dbe1; margin-inline-start: 4px; }
/* ---------- Your report designs ---------- */
.rf-swatch { width: 62px; height: 88px; border-radius: 3px; box-shadow: 0 2px 6px rgba(0,0,0,.18); display: block; } .rf-new .rf-none { font: 700 26px/1 system-ui, sans-serif; color: #0f6e46; border-color: #0f6e46; }
.rd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; } .rd-card { border: 1px solid #dde3e8; border-radius: 12px; overflow: hidden; background: #fff; } .rd-swatch { display: block; height: 70px; } .rd-body { padding: 10px 12px 12px; }
.rd-motifs { display: flex; flex-wrap: wrap; gap: 8px; border: 0; padding: 0; margin: 10px 0 12px; } .rd-motif { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; width: 84px; padding: 6px 4px; border: 2px solid transparent; border-radius: 10px; cursor: pointer; font-size: 11px; font-weight: 600; text-align: center; }
.rd-motif input { position: absolute; opacity: 0; width: 1px; height: 1px; } .rd-motif img { width: 62px; height: 88px; object-fit: cover; border-radius: 3px; box-shadow: 0 2px 6px rgba(0,0,0,.18); } .rd-motif:has(input:checked) { border-color: #0f6e46; background: #eef7f2; } .rd-motif:has(input:focus-visible) { outline: 3px solid #0f6e46; outline-offset: 2px; }
.rd-row { display: flex; flex-wrap: wrap; gap: 12px; } .rd-row .form-group { min-width: 150px; flex: 1 1 150px; } .rd-color { height: 40px; padding: 2px; max-width: 140px; }
/* ---------- Design studio ---------- */
.rs-studio { padding: 14px 16px; } .rs-head { margin-bottom: 6px; } .rs-sec { border: 0; border-top: 1px solid #e3e8ed; margin: 8px 0 0; padding: 8px 0 0; min-width: 0; } .rs-leg { font-size: 13px; font-weight: 700; color: #1f2d3a; padding: 0; }
.rs-gal { display: flex; gap: 6px; overflow-x: auto; padding: 6px 2px 8px; -webkit-overflow-scrolling: touch; } .rs-opt { position: relative; flex: 0 0 auto; width: 76px; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 5px 3px; border: 2px solid transparent; border-radius: 10px; cursor: pointer; }
.rs-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; } .rs-opt img { width: 62px; height: 88px; object-fit: cover; border-radius: 3px; box-shadow: 0 2px 6px rgba(0,0,0,.18); background: #fff; }
.rs-opt:hover { border-color: #c9d2da; } .rs-opt:has(input:checked) { border-color: #0f6e46; background: #eef7f2; } .rs-opt:has(input:focus-visible) { outline: 3px solid #0f6e46; outline-offset: 2px; }
.rs-inline { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 2px 0 4px; } .rs-seg { display: inline-flex; gap: 12px; flex-wrap: wrap; font-size: 13px; } .rs-seg label { display: inline-flex; align-items: center; gap: 5px; cursor: pointer; }
.rs-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 10px 16px; } .rs-gh { display: block; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; color: #374151; margin-bottom: 4px; }
.rs-chips { display: flex; flex-wrap: wrap; gap: 6px; } .rs-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; padding: 5px 10px; border: 1px solid #cfd8e0; border-radius: 999px; cursor: pointer; background: #fff; }
.rs-chip:has(input:checked) { border-color: #0f6e46; background: #eef7f2; color: #0b4a32; } .rs-chip input { accent-color: #0f6e46; margin: 0; }
.rs-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; padding-top: 10px; border-top: 1px solid #e3e8ed; }
/* ---------- Filing check ---------- */
.fc-hero { display: flex; gap: 14px; align-items: center; border-left: 6px solid #b42318; } .fc-hero.is-ready { border-left-color: #0f6e46; background: #f1f9f4; } .fc-hero.is-blocked { background: #fef6f5; }
.fc-mark { width: 46px; height: 46px; flex: 0 0 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font: 800 24px/1 system-ui, sans-serif; color: #fff; background: #b42318; } .is-ready .fc-mark { background: #0f6e46; }
.fc-state { margin: 0; font-size: 20px; } .fc-core { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; } .fc-radios { border: 0; padding: 0; margin: 0; display: flex; gap: 14px; flex-wrap: wrap; } .fc-radios label { display: inline-flex; gap: 6px; align-items: center; cursor: pointer; }
.fc-cats { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0; } .fc-cat { display: inline-flex; gap: 8px; align-items: center; padding: 6px 12px; border-radius: 999px; border: 1px solid #d5dce3; text-decoration: none; color: #1f2d3a; font-size: 13px; background: #fff; }
.fc-cat b { min-width: 22px; text-align: center; border-radius: 999px; padding: 1px 6px; font-size: 12px; background: #eef2f6; } .fc-cat.is-block b { background: #b42318; color: #fff; } .fc-cat.is-warn b { background: #b54708; color: #fff; } .fc-cat.is-clear b { background: #0f6e46; color: #fff; }
.fc-filter { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0 12px; } .fc-filter button { border: 1px solid #cfd8e0; background: #fff; border-radius: 999px; padding: 6px 12px; font-size: 13px; cursor: pointer; color: #1f2d3a; } .fc-filter button.is-on { background: #1f2d3a; color: #fff; border-color: #1f2d3a; }
.fc-group { font-size: 15px; margin: 18px 0 6px; } .fc-issue { background: #fff; border: 1px solid #e1e6eb; border-left: 5px solid #98a2b3; border-radius: 10px; padding: 10px 14px; margin-bottom: 8px; }
.fc-issue.sev-block { border-left-color: #b42318; } .fc-issue.sev-warn { border-left-color: #b54708; } .fc-issue.is-explained { border-left-color: #0f6e46; } .fc-issue.sev-note { border-left-color: #667085; }
.fc-top { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; } .fc-sev { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #b42318; } .sev-warn .fc-sev { color: #93370d; } .is-explained .fc-sev { color: #0b6b43; } .sev-note .fc-sev { color: #475467; }
.fc-ref { font-size: 12px; color: #475467; } .fc-msg { margin: 4px 0 2px; font-weight: 600; } .fc-why { margin: 0 0 6px; font-size: 13px; color: #475467; } .fc-ack { font-size: 13px; background: #f1f9f4; border-radius: 6px; padding: 6px 8px; margin: 4px 0 6px; } .fc-stale { font-size: 13px; color: #93370d; margin: 4px 0; }
.fc-acts { display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-start; } .fc-form summary { list-style: none; cursor: pointer; } .fc-form summary::-webkit-details-marker { display: none; } .fc-form[open] { flex-basis: 100%; } .fc-form form { margin-top: 6px; display: grid; gap: 6px; max-width: 640px; }
.fc-rules ul { margin: 8px 0 0; padding-left: 18px; } .fc-rules li { margin-bottom: 4px; }
.fc-strip { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 12px; border-radius: 10px; margin: 0 0 12px; border: 1px solid #f4c7c3; background: #fef6f5; font-size: 13.5px; } .fc-strip.is-ready { border-color: #b7e0c8; background: #f1f9f4; }
.fc-strip .btn { margin-left: auto; } .fc-dot { width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 13px; background: #b42318; } .is-ready .fc-dot { background: #0f6e46; }
/* ---------- Final submission ---------- */
.fs-status { font-size: 12.5px; font-weight: 700; padding: 5px 12px; border-radius: 999px; background: #eef2f6; color: #1f2d3a; white-space: nowrap; } .fs-s-frozen, .fs-s-filed { background: #0f6e46; color: #fff; } .fs-s-revising { background: #b54708; color: #fff; } .fs-s-approved, .fs-s-board_approved { background: #dff3e7; color: #0b4a32; }
.fs-steps { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; list-style: none; padding: 0; margin: 10px 0 14px; } .fs-steps li { display: flex; gap: 8px; align-items: flex-start; padding: 8px; border-radius: 10px; background: #fff; border: 1px solid #e1e6eb; min-width: 0; }
.fs-n { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; background: #eef2f6; color: #475467; } .fs-steps li.is-done .fs-n { background: #0f6e46; color: #fff; } .fs-steps li.is-current { border-color: #0f6e46; box-shadow: 0 0 0 2px #dff3e7; } .fs-steps li.is-current .fs-n { background: #1f2d3a; color: #fff; }
.fs-l { font-size: 13px; font-weight: 700; color: #1f2d3a; display: flex; flex-direction: column; min-width: 0; } .fs-l small { font-weight: 500; font-size: 11.5px; color: #475467; overflow-wrap: anywhere; }
.fs-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; } .fs-row .form-group { flex: 1 1 180px; min-width: 160px; } .fs-form { display: grid; gap: 8px; max-width: 760px; }
.fs-table th, .fs-table td { vertical-align: middle; } .fs-table th[scope=row] { font-weight: 600; font-size: 13.5px; text-align: left; min-width: 200px; } .fs-table thead th { text-align: left; }
.fs-assign { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; } .fs-assign select.form-control { width: 150px; height: 32px; min-height: 32px; font-size: 12.5px; padding: 2px 6px; margin: 0; }
.fs-acts { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; } .fs-acts form { margin: 0; } .fs-badge { white-space: nowrap; } .fs-table td:nth-child(3) { min-width: 150px; }
.fs-badge { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 999px; } .fs-b-none { background: #eef2f6; color: #475467; } .fs-b-wait { background: #fef0c7; color: #7a2e0e; } .fs-b-ok { background: #dff3e7; color: #0b4a32; } .fs-b-bad { background: #fee4e2; color: #912018; }
.fs-bl { color: #b42318; } .fs-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; } .fs-box { border: 1px solid #e1e6eb; border-radius: 10px; padding: 12px; background: #fff; display: grid; gap: 8px; align-content: start; }
.fs-decl { margin: 4px 0; padding: 8px 12px; border-left: 3px solid #0f6e46; background: #f1f9f4; font-size: 13px; } .fs-fp { font-size: 12px; } .fs-more { margin-top: 10px; } .fs-more summary { cursor: pointer; padding: 4px 0; }
.fs-checks { list-style: none; padding: 0; margin: 4px 0; font-size: 13px; } .fs-checks li { padding: 3px 0; } .fs-checks li.ok b { color: #0b6b43; } .fs-checks li.bad b { color: #b42318; }
@media (max-width: 900px) { .fs-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* ===================== Full BRSR report — calmer layout ===================== */
.fr-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; background: #fff; border: 1px solid #e3e8ed; border-radius: 14px; padding: 14px 18px; margin: 0 0 12px; }
.fr-id { display: flex; align-items: center; gap: 12px; min-width: 0; } .fr-icon { width: 40px; height: 40px; flex: 0 0 40px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: #eef7f2; color: #0f6e46; }
.fr-title { margin: 0; font-size: 21px; line-height: 1.2; } .fr-meta { margin: 3px 0 0; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; font-size: 13px; color: #344054; } .fr-dim { color: #475467; }
.fr-chip { font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; background: #eef2f6; color: #344054; } .fr-st-in_review { background: #fef0c7; color: #7a2e0e; } .fr-st-approved { background: #dff3e7; color: #0b4a32; } .fr-st-filed { background: #0f6e46; color: #fff; }
.fr-acts { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.fr-menu { position: relative; } .fr-menu > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; } .fr-menu > summary::-webkit-details-marker { display: none; } .fr-menu[open] > summary { background: #eef2f6; }
.fr-pop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 60; min-width: 290px; background: #fff; border: 1px solid #dfe5ea; border-radius: 12px; box-shadow: 0 12px 32px rgba(16,24,40,.14); padding: 6px; display: grid; gap: 2px; }
.fr-pop-r { left: auto; right: 0; } .fr-pop a, .fr-pop button { display: grid; grid-template-columns: auto 1fr; column-gap: 8px; text-align: left; padding: 8px 10px; border-radius: 8px; text-decoration: none; color: #1f2d3a; background: none; border: 0; font: inherit; cursor: pointer; width: 100%; }
.fr-pop a > b, .fr-pop button > b { grid-column: 1 / -1; font-size: 13.5px; } .fr-pop button > .rp-theme-swatch + b { grid-column: 2; } .fr-pop small { grid-column: 1 / -1; color: #475467; font-size: 12px; } .fr-pop button > .rp-theme-swatch { width: 14px; height: 14px; border-radius: 50%; align-self: center; grid-row: 1; }
.fr-pop a:hover, .fr-pop button:hover, .fr-pop a:focus-visible, .fr-pop button:focus-visible { background: #f2f6f9; outline: none; } .fr-pop hr { border: 0; border-top: 1px solid #e8ecf0; margin: 4px 2px; } .fr-pop-foot { font-size: 13px; font-weight: 600; color: #0f6e46 !important; }
.fr-notice { margin: 0 0 10px; padding: 0 4px; background: none; border: 0; font-size: 12.5px; color: #475467; } .fr-notice summary { cursor: pointer; }
.fr-ready { background: #fff; border: 1px solid #e3e8ed; border-radius: 14px; padding: 14px 18px; margin: 0 0 12px; }
.fr-ready-top { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; } .fr-ready-head { flex: 1 1 260px; min-width: 0; } .fr-ready-head h2 { margin: 0; font-size: 17px; } .fr-ready-head p { margin: 2px 0 0; font-size: 13px; color: #344054; } .fr-due { white-space: nowrap; }
.fr-ready.rd-blocked .fr-ready-head h2 { color: #b42318; } .fr-ready.rd-ready .fr-ready-head h2, .fr-ready.rd-done .fr-ready-head h2 { color: #0b6b43; }
.fr-checks { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; padding: 0; } .fr-check { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; border: 1px solid #dfe5ea; text-decoration: none; color: #1f2d3a; font-size: 12.5px; background: #fff; max-width: 100%; }
.fr-check:hover { border-color: #98a2b3; } .fr-ci { display: inline-flex; } .fr-check.is-pass .fr-ci { color: #0f6e46; } .fr-check.is-todo .fr-ci { color: #b54708; } .fr-check.is-block { border-color: #f4c7c3; background: #fef6f5; } .fr-check.is-block .fr-ci { color: #b42318; }
.fr-cl { font-weight: 600; } .fr-cv { color: #475467; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fr-ready-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 12px; padding-top: 10px; border-top: 1px solid #eef1f4; }
.fr-flow { display: flex; gap: 4px; list-style: none; padding: 0; margin: 0; flex-wrap: wrap; } .fr-flow li { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: #475467; padding: 3px 8px 3px 4px; } .fr-flow li + li::before { content: ''; width: 14px; height: 1px; background: #cfd6dd; margin-right: 4px; }
.fr-flow .rd-dot { width: 14px; height: 14px; border-radius: 50%; border: 2px solid #cfd6dd; display: inline-flex; align-items: center; justify-content: center; color: #fff; } .fr-flow .is-done .rd-dot { background: #0f6e46; border-color: #0f6e46; } .fr-flow .is-current { color: #1f2d3a; font-weight: 700; } .fr-flow .is-current .rd-dot { border-color: #0f6e46; }
.fr-links { display: inline-flex; gap: 14px; align-items: center; flex-wrap: wrap; font-size: 13px; } .fr-links a { display: inline-flex; gap: 5px; align-items: center; font-weight: 600; text-decoration: none; color: #0f6e46; }
.fr-ready-more { margin-top: 10px; } .fr-ready-more > summary { cursor: pointer; font-size: 13px; font-weight: 600; color: #344054; padding: 4px 0; } .fr-ready-more[open] > summary { margin-bottom: 6px; } .fr-ready-more .rd-body { display: block; }
.fr-tabs { position: sticky; top: 56px; z-index: 30; display: flex; gap: 2px; overflow-x: auto; background: rgba(247,249,250,.96); backdrop-filter: blur(6px); border-bottom: 1px solid #dfe5ea; margin: 4px 0 14px; padding: 0 2px; scrollbar-width: none; } .fr-tabs::-webkit-scrollbar { display: none; }
.fr-tabs .rt-tab { display: inline-flex; align-items: center; gap: 7px; padding: 11px 14px 10px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: none; color: #475467; font-weight: 600; font-size: 14px; white-space: nowrap; text-decoration: none; box-shadow: none; }
.fr-tabs .rt-tab:hover { color: #1f2d3a; background: none; } .fr-tabs .rt-tab.active { color: #0f6e46; border-bottom-color: #0f6e46; background: none; } .fr-tabs .rt-count { font-size: 11px; padding: 1px 7px; border-radius: 999px; background: #b42318; color: #fff; } .fr-tabs .rt-count-muted { background: #e4e7ec; color: #344054; }
.rp-bar2 { border-radius: 12px; padding: 12px 14px; } .fr-design { margin: 8px 0 0; font-size: 13px; color: #344054; } .fr-design-l { font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #475467; margin-right: 4px; }
.sw-section { border-radius: 12px; } .sw-table thead th { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: #475467; background: #f8fafb; } .sw-table td, .sw-table th { padding-top: 9px; padding-bottom: 9px; } .sw-table tbody tr:hover > td { background: #fafbfc; } .ie-tr > td { background: #fbfcfd; }
.fr-foot { margin: 6px 4px 0; }
@media (max-width: 760px) { .fr-head { padding: 12px; } .fr-acts { width: 100%; } .fr-acts > .btn-primary { flex: 1 1 100%; justify-content: center; } .fr-acts { position: relative; } .fr-menu { position: static; } .fr-pop, .fr-pop-r { left: 0; right: 0; min-width: 0; } .fr-ready-foot { flex-direction: column; align-items: flex-start; } }
/* this page's tab bar: an underline bar (the site-wide pill tabs use !important, so these are scoped and stronger) */
.report-tabs.fr-tabs { border-bottom: 1px solid #dfe5ea !important; background: rgba(247,249,250,.96) !important; padding: 0 2px !important; gap: 2px !important; flex-wrap: nowrap !important; }
.fr-tabs .rt-tab { border: 0 !important; border-bottom: 3px solid transparent !important; border-radius: 0 !important; background: none !important; padding: 11px 14px 10px !important; color: #475467 !important; margin: 0 !important; }
.fr-tabs .rt-tab:hover { color: #1f2d3a !important; } .fr-tabs .rt-tab.active { background: none !important; color: #0f6e46 !important; border-bottom-color: #0f6e46 !important; } .fr-tabs .rt-tab.active svg { color: #0f6e46; }
.sw-table th:nth-child(3), .sw-table td:nth-child(3) { display: none; }   /* approved counts are in each section's header line */
.sw-table td:nth-child(6) { white-space: nowrap; font-size: 12.5px; color: #475467; }
/* ---------- Emission factor library ---------- */
.efl-sources { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; margin: 10px 0 12px; }
.efl-src { display: grid; gap: 2px; padding: 12px 14px; border-radius: 12px; border: 1px solid #e1e6eb; background: #fff; text-decoration: none; color: #1f2d3a; font-size: 13px; }
.efl-src:hover { border-color: #98a2b3; } .efl-src.is-on { border-color: #0f6e46; box-shadow: 0 0 0 2px #dff3e7; } .efl-src b { font-size: 14px; } .efl-src small { color: #475467; } .efl-rg { font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: #0f6e46; }
.efl-add { border-style: dashed; } .efl-add form { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 4px; } .efl-add input[type=file] { max-width: 100%; font-size: 12px; }
.efl-filters { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; padding: 12px 14px; } .efl-filters .form-group { flex: 1 1 150px; margin: 0; } .efl-filters .efl-q { flex: 2 1 240px; } .efl-go { display: flex; gap: 4px; }
.efl-table td { vertical-align: top; } .efl-note { color: #7a4b00; } .efl-use summary { list-style: none; cursor: pointer; } .efl-use summary::-webkit-details-marker { display: none; }
.efl-use form { display: grid; gap: 4px; min-width: 240px; margin-top: 6px; } .efl-new { display: flex; gap: 4px; } .efl-new input:last-child { max-width: 90px; } .efl-pages { display: flex; gap: 10px; align-items: center; justify-content: center; margin: 12px 0; }
/* Emission factor library — views, recommendations, newer editions, change log, private libraries (phase 155) */
.efl-tabs { position: relative; display: flex; gap: 2px; overflow-x: auto; border-bottom: 1px solid #dfe5ea; margin: 8px 0 12px; scrollbar-width: none; } .efl-tabs::-webkit-scrollbar { display: none; }
.efl-tabs a { padding: 10px 14px 9px; border-bottom: 3px solid transparent; color: #475467; font-weight: 600; font-size: 14px; text-decoration: none; white-space: nowrap; } .efl-tabs a:hover { color: #1f2d3a; } .efl-tabs a.is-on { color: #0f6e46; border-bottom-color: #0f6e46; }
.efl-count { display: inline-block; min-width: 18px; padding: 0 6px; border-radius: 999px; background: #fef0c7; color: #7a2e0e; font-size: 11.5px; font-weight: 800; line-height: 18px; text-align: center; }
.efl-sec { margin: 0 0 12px; } .efl-h2 { font-size: 16px; font-weight: 700; color: #1f2d3a; margin: 0 0 4px; } .efl-h3 { font-size: 14px; font-weight: 700; color: #1f2d3a; margin: 14px 0 6px; }
.efl-sec-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.efl-apply { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; } .efl-apply input[type=date] { width: auto; min-width: 140px; } .efl-upd .efl-apply { margin-left: auto; }
.efl-pref { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; } .efl-pref .form-group { flex: 1 1 180px; margin: 0; } .efl-check { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; flex: 1 1 100%; }
.efl-chg { font-size: 12px; font-weight: 700; color: #475467; } .efl-none { margin: 0; padding-left: 18px; } .efl-none li { margin: 4px 0; }
.fc-strip.is-info { border-color: #c7d7fe; background: #f5f8ff; } .is-info .fc-dot { background: #3e4784; }
.fc-strip.is-warn { border-color: #f6d58e; background: #fffbeb; } .is-warn .fc-dot { background: #b54708; }
.efl-table th { text-align: left; vertical-align: bottom; } .efl-table th + th, .efl-table td + td { padding-left: 14px; } .efl-table th.ta-r { text-align: right; } .efl-wrap .text-xs, .efl-sec .text-xs { font-size: 11.5px; line-height: 1.45; }
.efl-rectable td:first-child { min-width: 160px; } .efl-use form { width: 330px; max-width: 78vw; } .efl-use select { max-width: 100%; } .efl-apply { flex-wrap: nowrap; } .efl-apply input[type=date] { width: 148px; min-width: 0; height: 34px; min-height: 34px; padding: 4px 8px; font-size: 13px; }
/* ESG controls (phase 156) */
.ic-inline { display: inline; } .ic-period { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0 0 6px; } .ic-period .form-label { margin: 0; } .ic-period select { width: auto; min-width: 160px; }
.ic-empty p { max-width: 860px; } .ic-back { margin: 0 0 8px; font-size: 13.5px; } .ic-back a { font-weight: 600; text-decoration: none; }
.ic-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; } .ic-head-st { display: grid; gap: 4px; justify-items: end; text-align: right; }
.ic-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; font-weight: 700; color: #344054; background: #f2f4f7; border-radius: 6px; padding: 2px 7px; } .ic-title { margin-top: 6px; }
.ic-key { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: .02em; padding: 2px 7px; border-radius: 6px; background: #ecfdf3; color: #05603a; border: 1px solid #abefc6; }
.ic-st, .ic-sev { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; white-space: nowrap; background: #eef2f6; color: #475467; }
.ic-st.is-effective { background: #dff3e7; color: #0b4a32; } .ic-st.is-exceptions { background: #fee4e2; color: #912018; } .ic-st.is-error { background: #fef0c7; color: #7a2e0e; } .ic-st.is-not_applicable { background: #eff4ff; color: #2d3e8c; }
.ic-sev.is-material { background: #fee4e2; color: #912018; } .ic-sev.is-significant { background: #fef0c7; color: #7a2e0e; } .ic-sev.is-deficiency { background: #eef2f6; color: #344054; }
.ic-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 10px 18px; margin: 10px 0 0; } .ic-facts dt { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #667085; } .ic-facts dd { margin: 2px 0 0; font-size: 13.5px; }
.ic-run { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 6px 0; } .ic-err { color: #912018; } .ic-warn { color: #912018; font-weight: 700; } .ic-ok { color: #05603a; font-weight: 700; }
.ic-hist { display: flex; align-items: center; gap: 3px; flex-wrap: wrap; margin-top: 10px; } .ic-hist .text-xs { margin-right: 6px; } .ic-hist i { width: 10px; height: 18px; border-radius: 3px; background: #d0d5dd; }
.ic-hist i.is-effective { background: #12b76a; } .ic-hist i.is-exceptions { background: #f04438; } .ic-hist i.is-error { background: #f79009; } .ic-hist i.is-not_applicable { background: #b2ccff; }
.ic-att { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 8px; } .ic-att li { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .ic-att a { text-decoration: none; color: #1f2d3a; } .ic-att a:hover b { text-decoration: underline; }
.ic-meter { display: flex; width: 120px; height: 8px; border-radius: 99px; overflow: hidden; background: #eef2f6; } .ic-meter i { display: block; height: 100%; } .ic-meter i.ok { background: #12b76a; } .ic-meter i.bad { background: #f04438; }
.ic-matrix td:first-child { min-width: 280px; } .ic-matrix a { text-decoration: none; color: #1f2d3a; } .ic-matrix a:hover { text-decoration: underline; }
.ic-concl { border: 0; padding: 0; margin: 0 0 10px; display: grid; gap: 8px; } .ic-opt { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; } .ic-opt > span { display: grid; gap: 2px; } .ic-opt.is-off { opacity: .7; }
.ic-checks { border: 0; padding: 0; margin: 0 0 8px; display: flex; flex-wrap: wrap; gap: 6px 14px; } .ic-checks legend { width: 100%; } .ic-checks label, .ic-keychk { font-size: 13px; display: inline-flex; gap: 6px; align-items: center; }
.ic-retire { margin-top: 10px; } .ic-def.is-closed { opacity: .8; }
.ic-exc a { color: var(--color-primary); font-weight: 600; text-decoration: none; } .ic-exc a:hover { text-decoration: underline; } .ic-exc td:first-child { min-width: 260px; }
@media (max-width: 640px) {
  .ic-head-st { justify-items: start; text-align: start; }
  .ic-exc thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .ic-exc tr { display: block; padding: 8px 0; border-bottom: 1px solid var(--color-border); } .ic-exc td { display: block; min-width: 0 !important; padding: 2px 10px; border: 0; }
}
/* EPR compliance (phase 157) */
.epr-sub { margin: 2px 0 8px; font-size: 13px; color: #475467; line-height: 1.45; max-width: 900px; } .epr-muted { color: #667085; } .epr-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; }
.epr-empty p { max-width: 860px; } .epr-list { margin: 6px 0 12px; padding-inline-start: 20px; display: grid; gap: 4px; font-size: 13.5px; }
.epr-tot { margin: 0; font-size: 13px; text-align: end; line-height: 1.5; } .epr-short { color: #b42318; font-weight: 700; }
.epr-table td:first-child { min-width: 260px; } .epr-basis, .epr-src, .epr-gap, .epr-carry { font-size: 12px; line-height: 1.4; color: #667085; margin-top: 3px; white-space: normal; } .epr-gap { color: #7a4a00; } .epr-carry { color: #b42318; }
.epr-table td.num .epr-src, .epr-table td.num .epr-gap { text-align: end; }
.epr-prog { display: flex; align-items: center; gap: 8px; min-width: 120px; } .epr-prog .dc-bar { flex: 1; min-width: 70px; } .epr-prog span:last-child { font-size: 12.5px; font-weight: 700; color: #344054; }
.epr-checks { min-width: 220px; } .dc-checks li.unk { color: #475467; } .dc-checks li.unk::before { content: '? '; font-weight: 700; }
.epr-st, .epr-ans { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; white-space: nowrap; background: #eef2f6; color: #475467; }
.epr-st.is-met { background: #dff3e7; color: #0b4a32; } .epr-st.is-partial { background: #fef0c7; color: #7a2e0e; } .epr-st.is-open { background: #fee4e2; color: #912018; } .epr-st.is-no_target { background: #eff4ff; color: #2d3e8c; }
.epr-ans { white-space: normal; text-align: end; } .epr-ans.is-same { background: #dff3e7; color: #0b4a32; } .epr-ans.is-empty, .epr-ans.is-filled { background: #fef0c7; color: #7a2e0e; } .epr-ans.is-yours { background: #eff4ff; color: #2d3e8c; } .epr-ans.is-locked { background: #f2f4f7; color: #344054; }
.epr-mini th[scope=row] { min-width: 200px; } .epr-mini { margin: 8px 0 0; } .epr-yours { margin-top: 8px; font-size: 13px; } .epr-yours summary { cursor: pointer; color: var(--color-primary); font-weight: 600; }
.epr-fill { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.epr-att { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; } .epr-att li { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; padding: 7px 10px; border-radius: 8px; border-inline-start: 3px solid #f79009; background: #fffaeb; font-size: 13.5px; }
.epr-att li.is-bad { border-inline-start-color: #d92d20; background: #fef3f2; } .epr-att a { font-weight: 600; color: var(--color-primary); text-decoration: none; white-space: nowrap; } .epr-att a:hover { text-decoration: underline; }
.epr-pills { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 10px; } .epr-pills a { padding: 6px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--color-border); font-size: 13px; font-weight: 600; color: #273246; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.epr-pills a:hover { border-color: var(--color-primary); color: var(--color-primary); } .epr-pills a.is-on { background: #0f6e46; border-color: #0f6e46; color: #fff; } .epr-dot { width: 7px; height: 7px; border-radius: 50%; background: #f79009; display: inline-block; }
.epr-qty input.form-control { min-width: 110px; } .epr-qty td:first-child { min-width: 0; } .epr-qty tr.is-cur th { color: #0f6e46; } .epr-qty .epr-new th { font-weight: 400; } .epr-qty .epr-new input[name="new[fy]"] { min-width: 150px; }
.epr-use { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 1px 7px; border-radius: 6px; background: #f2f4f7; color: #344054; margin: 1px 2px 1px 0; white-space: nowrap; } .epr-use.is-cur { background: #dff3e7; color: #0b4a32; }
.epr-qform > .btn { margin-top: 10px; } .epr-table input.form-control { min-width: 120px; }
.epr-cats { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; } .epr-cats li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 7px 10px; border: 1px solid var(--color-border); border-radius: 8px; font-size: 13.5px; } .epr-cats form { margin: 0; }
.epr-addcats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 12px; } .epr-addcats .efl-h3 { margin-top: 0; } .epr-note { margin-top: 12px; }
.efl-count.is-info { background: #eff4ff; color: #2d3e8c; }
.epr-table th, .epr-qty th, .epr-mini thead th { text-align: start; } .epr-table th.num, .epr-mini th.num { text-align: end; } .epr-brsr-h { flex-wrap: wrap; align-items: flex-start; } .epr-brsr-h b { flex: 1 1 320px; }
@media (max-width: 640px) {
  .epr-tot { text-align: start; } .epr-ans { text-align: start; }
  .epr-stack, .epr-stack tbody { display: block; width: 100%; } .epr-stack thead { display: block; position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .epr-stack tr { display: block; padding: 8px 0; border-bottom: 1px solid var(--color-border); } .epr-stack td { display: block; min-width: 0 !important; padding: 3px 10px; border: 0; text-align: start !important; }
  .epr-stack td[data-label]:not([data-label=""])::before { content: attr(data-label); display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: #667085; }
  .epr-stack td.num .epr-src, .epr-stack td.num .epr-gap { text-align: start; } .epr-stack input.form-control { min-width: 0; width: 100%; } .epr-checks, .epr-prog { min-width: 0; }
}
/* CSR — section 135 (phase 158); shares the EPR page's .epr-* table, status and attention styles */
.csr-two { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; align-items: start; } .csr-two > .card { margin-bottom: 16px; }
.csr-ledger { margin: 4px 0 12px; } .csr-ledger th[scope=row] { font-weight: 500; text-align: start; font-size: 13.5px; } .csr-ledger td.num { white-space: nowrap; font-variant-numeric: tabular-nums; }
.csr-ledger tr.csr-total th, .csr-ledger tr.csr-total td { font-weight: 800; border-top: 2px solid var(--color-border); }
.csr-moves, .csr-check { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.csr-moves li { padding: 8px 10px; border-radius: 8px; border-inline-start: 3px solid #98a2b3; background: #f9fafb; font-size: 13.5px; line-height: 1.5; }
.csr-moves li.is-ok { border-inline-start-color: #12b76a; background: #f6fef9; } .csr-moves li.is-bad { border-inline-start-color: #d92d20; background: #fef3f2; } .csr-moves li.is-todo { border-inline-start-color: #f79009; background: #fffaeb; }
.csr-check li { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.45; }
.csr-mark { flex: none; width: 20px; height: 20px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; margin-top: 1px; background: #eef2f6; color: #475467; }
.csr-check li.is-ok .csr-mark { background: #dff3e7; color: #0b4a32; } .csr-check li.is-ok .csr-mark::before { content: '✓'; } .csr-check li.is-warn .csr-mark { background: #fee4e2; color: #912018; } .csr-check li.is-warn .csr-mark::before { content: '!'; }
.csr-check li.is-todo .csr-mark { background: #fef0c7; color: #7a2e0e; } .csr-check li.is-todo .csr-mark::before { content: '○'; } .csr-check li.is-na b { font-weight: 600; color: #475467; } .csr-check li.is-na .csr-mark::before { content: '–'; }
.csr-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; } .csr-tag { display: inline-block; font-size: 11.5px; font-weight: 600; padding: 1px 8px; border-radius: 6px; background: #f2f4f7; color: #344054; white-space: nowrap; }
.csr-tag.is-ongoing { background: #eff4ff; color: #2d3e8c; } .csr-tag.is-asp { background: #fef0c7; color: #7a2e0e; }
.csr-plink { color: #1f2d3a; text-decoration: none; } .csr-plink:hover b { text-decoration: underline; } .csr-kpis { margin: 10px 0 0; } .csr-rule { margin: 10px 0 0; } .csr-note { padding: 8px 10px; border-radius: 8px; background: #fffaeb; }
.csr-others { margin: 10px 0 4px; font-size: 13.5px; } .csr-others summary { cursor: pointer; color: var(--color-primary); font-weight: 600; } .csr-others ul { margin: 6px 0 0; padding-inline-start: 18px; display: grid; gap: 3px; }
.csr-checks { display: grid; gap: 6px; grid-column: 1 / -1; } .csr-checks label { font-size: 13.5px; display: flex; gap: 8px; align-items: flex-start; }
.csr-inline { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; } .csr-row { display: flex; gap: 12px; align-items: flex-start; flex-wrap: wrap; margin-top: 10px; } .csr-row .dc-new { margin-top: 0; }
.csr-meet .form-label { margin: 0; } .csr-meet input { width: 80px; } .csr-dl { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.csrr { border: 1px solid var(--color-border); border-radius: 12px; padding: 18px 22px; background: #fff; max-width: 1040px; font-size: 13.5px; line-height: 1.5; }
.csrr h1 { font-size: 20px; margin: 0 0 6px; color: #0f4c33; } .csrr h2 { font-size: 15px; margin: 18px 0 6px; color: #0f4c33; } .csrr p { margin: 4px 0 8px; }
.csrr-t { width: 100%; border-collapse: collapse; margin: 6px 0 10px; font-size: 12.5px; } .csrr-t th, .csrr-t td { border: 1px solid #d0d5dd; padding: 5px 7px; vertical-align: top; text-align: start; } .csrr-t th { background: #f0f7f3; font-weight: 700; } .csrr-t td[align=right], .csrr-t th[align=right] { text-align: end; font-variant-numeric: tabular-nums; }
.csrr-sign { width: 100%; margin-top: 18px; font-size: 12.5px; } .csrr-sign td { width: 33%; vertical-align: top; padding-inline-end: 12px; }
.csrr { overflow-x: auto; } .csrr a { color: var(--color-primary); text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
@media (max-width: 1100px) { .csr-two { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .csrr { padding: 12px; } .csrr-t { font-size: 11.5px; } .csr-ledger th[scope=row] { font-size: 13px; } }
/* Grievances and POSH (phase 159); shares the EPR and CSR pages' table, status, attention and form styles */
.grv-two { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 16px; align-items: start; } .grv-two > .card { margin-bottom: 16px; }
.grv-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 13.5px; line-height: 1.45; } .grv-list a { color: #1f2d3a; text-decoration: underline; text-decoration-color: #98a2b3; text-underline-offset: 2px; overflow-wrap: anywhere; } .grv-list a:hover { text-decoration-color: currentColor; }
.grv-note { padding: 8px 10px; border-radius: 8px; background: #f2f4f7; color: #344054; margin: 10px 0 0; }
.grv-filters { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(170px, 100%), 1fr)); gap: 0 12px; align-items: end; margin: 6px 0 4px; } .grv-filters .form-group { margin-bottom: 10px; } .grv-fbtn { display: flex; align-items: flex-end; }
.grv-checks { display: grid; gap: 6px; } .grv-checks-grid { grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr)); gap: 6px 16px; } .grv-checks-grid legend { grid-column: 1 / -1; } .grv-women { margin: 0 0 12px; } .grv-women p { margin: 0 0 6px; } .grv-checks label { font-size: 13.5px; display: flex; gap: 8px; align-items: flex-start; } .grv-checks legend { margin-bottom: 4px; } fieldset.grv-checks, fieldset.grv-you, fieldset.grv-remarks { border: 0; padding: 0; margin: 0 0 10px; min-width: 0; }
.grv-inline { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0; } .grv-inline .form-label { margin: 0; } .grv-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 10px 0 0; }
.grv-hist { margin: 0; padding-inline-start: 20px; display: grid; gap: 8px; font-size: 13.5px; line-height: 1.45; overflow-wrap: anywhere; }
.grv-ic { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; margin: 0 0 12px; } .grv-ic > .dc-sec-head { margin-bottom: 4px; } .grv-ic .efl-h3 { margin: 0; }
.grv-past td { color: #667085; } .grv-edit { display: inline-block; } .grv-edit[open] { display: block; margin-bottom: 8px; } .grv-edit > summary { list-style: none; cursor: pointer; display: inline-flex; } .grv-edit > summary::-webkit-details-marker { display: none; }
.grv-figs { list-style: none; margin: 6px 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13.5px; } .grv-figs b { font-size: 18px; color: #1f2d3a; }
.grv-statement { font-size: 13.5px; line-height: 1.55; background: #f8fafb; resize: vertical; }
.grv-mechs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); gap: 12px; } .grv-mech { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; } .grv-mech .efl-h3 { margin-top: 0; }
.grv-remarks legend { font-weight: 700; font-size: 13.5px; margin-bottom: 6px; } .grv-remarks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); gap: 0 12px; }
.grv-cover { padding: 8px 10px; border-radius: 8px; margin: 0 0 8px; } .grv-cover.is-ok { background: #ecfdf3; color: #05603a; } .grv-cover.is-warn { background: #fffaeb; color: #7a2e0e; } .grv-cover-form { margin: 0 0 10px; }
.grv-form { margin: 0 0 4px; } .grv-form .dc-form-grid { margin-bottom: 4px; }
.grv-url { flex: 1 1 320px; min-width: 0; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; } .grv-upload { margin-top: 8px; } .grv-upload input[type=file] { max-width: 100%; } .grv-note-form { margin-top: 14px; }
.grv-public .grv-posh-note { padding: 10px 12px; border-radius: 8px; background: #eff4ff; color: #2d3e8c; } .grv-public .sv-form { background: #fff; border: 1px solid var(--color-border); border-radius: 12px; padding: 16px; }
.grv-keys { display: flex; flex-wrap: wrap; gap: 12px; margin: 10px 0; } .grv-keys div { background: #fff; border: 1px solid var(--color-border); border-radius: 10px; padding: 10px 16px; } .grv-keys dt { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #667085; } .grv-keys dd { margin: 2px 0 0; font: 700 20px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; color: #1f2d3a; }
.grv-found { padding: 14px 16px; } .grv-status { font-size: 20px; margin: 4px 0; }
@media (max-width: 1100px) { .grv-two { grid-template-columns: 1fr; } }
/* Policies and ethics (phase 160); shares the EPR, CSR and grievance pages' table, status, attention and form styles */
.epr-att li.is-note { border-inline-start-color: #2e90fa; background: #eff8ff; }
.eth-chips { display: inline-flex; flex-wrap: wrap; gap: 4px; } .eth-chip { display: inline-block; min-width: 26px; text-align: center; font-size: 11.5px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: #dff3e7; color: #0b4a32; }
.eth-checks { list-style: none; margin: 8px 0 12px; padding: 0; display: grid; gap: 8px; font-size: 13.5px; line-height: 1.4; } .eth-checks li { position: relative; padding-inline-start: 28px; overflow-wrap: anywhere; }
.eth-checks li::before { position: absolute; inset-inline-start: 0; top: 0; width: 19px; height: 19px; border-radius: 50%; font-size: 12px; font-weight: 700; line-height: 19px; text-align: center; } .eth-checks li.is-ok::before { content: "✓"; background: #dff3e7; color: #0b4a32; } .eth-checks li.is-no::before { content: "!"; background: #fee4e2; color: #912018; }
.eth-edit { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; margin: 0 0 14px; background: #fcfcfd; } .eth-edit .efl-h3 { margin-top: 0; }
.eth-review { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin: 6px 0 0; } .eth-review input[type=date] { width: auto; max-width: 160px; padding: 3px 6px; font-size: 12.5px; }
.eth-matrix { font-size: 13px; } .eth-matrix thead th { text-align: center; } .eth-matrix thead th:first-child, .eth-matrix th[scope=row] { text-align: start; } .eth-matrix th[scope=row] { font-weight: 600; min-width: 150px; }
.eth-matrix td { text-align: center; padding: 7px 6px; min-width: 60px; overflow-wrap: anywhere; } .eth-matrix td:first-child { min-width: 60px; } .eth-matrix td.eth-no { color: #912018; font-weight: 600; }
.eth-matrix td.eth-sbcell { font-size: 12.5px; min-width: 76px; text-align: start; } .eth-sbcell.is-empty, .eth-sbcell.is-filled { background: #fffaeb; } .eth-sbcell.is-same { background: #f6fef9; } .eth-sbcell.is-yours { background: #f5f8ff; } .eth-sbcell.is-locked { background: #f2f4f7; }
.eth-prin-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(360px, 100%), 1fr)); gap: 12px; margin: 0 0 12px; }
.eth-prin { border: 1px solid var(--color-border); border-radius: 12px; padding: 8px 12px 4px; margin: 0; min-width: 0; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 0 10px; } .eth-prin legend { font-size: 13.5px; padding: 0 4px; } .eth-prin .form-group { margin-bottom: 8px; } .eth-prin .eth-wide { grid-column: 1 / -1; }
.eth-pgrid { grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }
.eth-docs { margin-top: 12px; } .eth-docs .efl-h3 { margin: 0 0 6px; }
.eth-acr { margin: 0 0 10px; } .eth-acr select { width: auto; max-width: 100%; } .eth-gap { margin-top: 12px; } .eth-notice { font-size: 13.5px; } .eth-notice a { font-weight: 600; }
.eth-thread { list-style: none; margin: 8px 0 12px; padding: 0; display: grid; gap: 8px; font-size: 13.5px; line-height: 1.45; } .eth-thread li { padding: 8px 12px; border-radius: 10px; max-width: 760px; overflow-wrap: anywhere; }
.eth-thread li.is-us { background: #f2f4f7; margin-inline-end: 10%; } .eth-thread li.is-them { background: #e3f3ea; margin-inline-start: 10%; } .eth-thread .epr-muted { color: #475467; }
.eth-vc { border-top: 1px dashed var(--color-border); padding-top: 8px; }
@media (max-width: 640px) { .eth-prin { grid-template-columns: 1fr; } .eth-thread li.is-us, .eth-thread li.is-them { margin-inline: 0; } }
/* Group BRSR Core (phase 161) */
.grp-table th:first-child { width: 46%; } .grp-table td:first-child { white-space: normal; overflow-wrap: anywhere; } .grp-note { max-width: 64ch; margin-top: 2px; }
.grp-table td.grp-fig { white-space: nowrap; } .grp-table td:last-child, .grp-table th:last-child { white-space: normal; min-width: 120px; }
.grp-detail th { white-space: normal; } .grp-detail td:first-child, .grp-detail td:last-child { white-space: normal; overflow-wrap: anywhere; } .grp-detail td:last-child { min-width: 160px; }
.grp-pick { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; margin: 0 0 16px; } .grp-pick .form-group { margin: 0; flex: 1 1 280px; max-width: 460px; }
.grp-terms { margin: 0 0 10px; padding-inline-start: 18px; font-size: 13px; line-height: 1.5; }
@media (max-width: 640px) { .grp-table td.grp-fig { white-space: normal; } }
@media (max-width: 640px) { .grp-table th:first-child { width: auto; } .grp-table td:first-child { min-width: 190px; } }
/* Targets linked to data (phase 161) */
.tgt-form .tgt-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 0 12px; }
.tgt-princ { border: 0; padding: 0; margin: 0 0 12px; } .tgt-princ legend { margin-bottom: 6px; }
.tgt-chk { display: inline-flex; align-items: center; gap: 5px; margin: 0 14px 6px 0; font-size: 13px; } .tgt-chk input { margin: 0; }
.tgt-title { font-size: 14px; font-weight: 600; margin: 0 0 2px; color: var(--color-text); }
.tgt-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; } .tgt-chip { font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: #dff3e7; color: #0b4a32; }
.tgt-values { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 10px 0 4px; } .tgt-values dt { font-size: 11px; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: .03em; }
.tgt-values dd { margin: 2px 0 0; font-weight: 600; font-size: 13.5px; overflow-wrap: anywhere; } .tgt-values dd.text-xs { font-weight: 400; }
.tgt-hist { margin: 4px 0 0; overflow-wrap: anywhere; } .tgt-reason { margin: 8px 0 0; padding: 6px 10px; border-radius: 8px; background: #fffaeb; }
.tgt-update { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; margin-top: 12px; } .tgt-update > div { flex: 1 1 140px; } .tgt-del { margin-top: 6px; text-align: end; }
.tgt-fill td.tgt-prop { white-space: normal; min-width: 280px; max-width: 760px; line-height: 1.45; } .tgt-fill td:first-child { white-space: nowrap; }
@media (max-width: 640px) { .tgt-values { grid-template-columns: 1fr; } }
/* The assurance workspace (phase 162): statement, written representations, boundary register, restated figures, close calendar */
.asw-steps { list-style: none; margin: 0 0 12px; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 8px; }
.asw-steps li { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--color-border); background: #fff; font-size: 13.5px; line-height: 1.4; min-width: 0; overflow-wrap: anywhere; }
.asw-step-n { flex: 0 0 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 12.5px; background: #eef2f6; color: #344054; }
.asw-steps li.is-ok { border-color: #b7e0c8; background: #f1f9f4; } .asw-steps li.is-ok .asw-step-n { background: #0f6e46; color: #fff; }
.asw-steps li.is-wait { border-color: #c7d7fe; background: #f5f8ff; } .asw-steps li.is-wait .asw-step-n { background: #3e4784; color: #fff; }
.asw-steps li.is-bad { border-color: #f4c7c3; background: #fef6f5; } .asw-steps li.is-bad .asw-step-n { background: #b42318; color: #fff; }
.asw-status { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; margin: 0 0 10px; } .asw-status .btn { margin-inline-start: auto; } .asw-status .btn + .btn { margin-inline-start: 0; }
.asw-pill { font-size: 11.5px; font-weight: 700; padding: 2px 9px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; }
.asw-pill.is-signed { background: #dff3e7; color: #0b4a32; } .asw-pill.is-requested, .asw-pill.is-shared { background: #e8f1fb; color: #1d4ed8; } .asw-pill.is-declined { background: #fde8e8; color: #9b1c1c; } .asw-pill.is-superseded { background: #f2f4f7; color: #475467; } .asw-pill.is-draft { background: #fff4e0; color: #7a4a00; }
.asw-callout { padding: 8px 12px; border-radius: 10px; font-size: 13.5px; line-height: 1.5; margin: 0 0 10px; overflow-wrap: anywhere; } .asw-callout.is-ok { background: #f1f9f4; color: #05603a; } .asw-callout.is-bad { background: #fef3f2; color: #912018; border: 1px solid #fecdca; }
.asw-callout .table-wrap { margin-top: 8px; background: #fff; border-radius: 8px; }
.asw-doc { border: 1px solid var(--color-border); border-radius: 12px; background: #fff; padding: 18px 22px; margin: 6px 0 12px; font-size: 14px; line-height: 1.6; color: #1f2937; max-width: 860px; overflow-wrap: anywhere; box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.asw-doc .asw-title { font-size: 18px; margin: 0 0 10px; line-height: 1.35; } .asw-doc .asw-h { font-size: 15px; margin: 16px 0 4px; color: #101828; } .asw-doc p { margin: 0 0 8px; } .asw-doc ul { margin: 0 0 8px; padding-inline-start: 20px; }
.asw-doc .asw-sig { margin-top: 16px; } .asw-doc .asw-org { font-size: 16px; } .asw-doc .asw-annex { font-size: 13px; width: 100%; margin: 0; } .asw-doc .asw-annex td, .asw-doc .asw-annex th { white-space: normal; text-align: start; padding: 6px 8px; } .asw-doc .asw-annex tbody tr:nth-child(even) td { background: #f9fafb; }
.asw-versions a, .asw-older a { color: var(--color-primary, #0f6e46); text-decoration: underline; text-underline-offset: 2px; }
.asw-num { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 4px; } .asw-num > span { font-weight: 600; }
.asw-esign { margin: 14px 0 0; padding: 8px 10px; border: 1px dashed #98a2b3; border-radius: 8px; background: #f8fafc; font-size: 12.5px; color: #344054; overflow-wrap: anywhere; }
.asw-docwrap > summary, .asw-older > summary, .asw-remarks > summary { cursor: pointer; font-weight: 600; font-size: 13.5px; color: var(--color-primary, #0f6e46); margin: 4px 0; padding: 4px 0; min-height: 24px; display: list-item; }
.asw-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)); gap: 8px 16px; margin: 0 0 8px; } .asw-facts dt { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--color-text-muted, #667085); } .asw-facts dd { margin: 2px 0 0; font-size: 13.5px; overflow-wrap: anywhere; }
.asw-hash { font-size: 12px; word-break: break-all; } .asw-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .02em; }
.asw-signbox { border: 1px solid #b7e0c8; background: #f6fef9; border-radius: 12px; padding: 12px 14px; margin: 10px 0; } .asw-signbox .dc-h3 { margin-top: 0; }
.asw-confirm { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; line-height: 1.45; margin: 4px 0 10px; } .asw-confirm input { margin-top: 3px; flex: 0 0 auto; }
.asw-para { margin-bottom: 12px; } .asw-para-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 10px; } .asw-para-head .btn-link { padding: 0; font-size: 12.5px; font-weight: 600; background: none; border: 0; box-shadow: none; color: var(--color-primary, #0f6e46); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; } .asw-para-head .btn-link:hover { color: #0b4a32; }
.asw-editor textarea { font-size: 13.5px; line-height: 1.5; resize: vertical; } .asw-buttons { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 14px; }
.asw-warns { margin: 0 0 8px; padding-inline-start: 20px; font-size: 13.5px; color: #7a2e0e; } .asw-signpanel { border-top: 1px solid var(--color-border); padding-top: 4px; margin-top: 8px; }
.asw-acts { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: flex-start; margin-top: 4px; } .asw-acts .an-act { flex: 1 1 300px; }
.asw-versions td, .asw-versions th { white-space: normal; } .asw-chg th[scope=row] { white-space: normal; min-width: 180px; }
.asw-remarks .table-wrap { margin-top: 6px; } .asw-remarks th[scope=row] { white-space: normal; min-width: 180px; max-width: 360px; }
@media (max-width: 640px) { .asw-doc { padding: 12px 12px; font-size: 13.5px; } .asw-status .btn { margin-inline-start: 0; } }
.asw-verify .asw-result { padding: 14px 16px; border-inline-start: 5px solid #98a2b3; margin: 0 0 14px; } .asw-result.is-ok { border-inline-start-color: #0f6e46; background: #f6fef9; } .asw-result.is-warn { border-inline-start-color: #dc6803; background: #fffaeb; } .asw-result.is-bad { border-inline-start-color: #b42318; background: #fef3f2; }
.asw-result-h { font-size: 18px; margin: 0 0 8px; line-height: 1.35; } .asw-verify .sv-form { background: #fff; border: 1px solid var(--color-border); border-radius: 12px; padding: 16px; }
.bnd-row { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px 2px; margin: 0 0 10px; min-width: 0; background: #fff; } .bnd-row legend { font-weight: 600; font-size: 14px; padding: 0 4px; overflow-wrap: anywhere; max-width: 100%; }
.bnd-row.is-new { border-style: dashed; background: #fcfcfd; } .bnd-row.is-unsaved { border-color: #fdb022; background: #fffcf5; } .bnd-row.is-orphan { border-color: #d0d5dd; background: #f9fafb; }
.bnd-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr)); gap: 0 12px; } .bnd-grid .bnd-reason { grid-column: 1 / -1; } .bnd-grid .form-group { margin-bottom: 8px; }
.bnd-tags { display: inline-flex; flex-wrap: wrap; gap: 4px; margin-inline-start: 6px; vertical-align: middle; } .bnd-tag { font-size: 11px; font-weight: 600; padding: 1px 7px; border-radius: 999px; background: #eef2f6; color: #475467; }
.bnd-tag.is-warn { background: #fef0c7; color: #93370d; } .bnd-self { font-size: 13.5px; color: #344054; margin: 0 0 8px; }
.bnd-text { padding: 10px 12px; border-radius: 10px; background: #f8fafb; border: 1px solid var(--color-border); font-size: 14px; line-height: 1.6; margin: 0 0 10px; overflow-wrap: anywhere; }
.bnd-remove { margin: 0 0 8px; text-align: end; }
.cal-table th[scope=row] { white-space: normal; min-width: 200px; max-width: 340px; } .cal-table td { min-width: 150px; } .cal-table td:last-child { min-width: 180px; } .cal-dl { margin-top: 3px; font-weight: 400; line-height: 1.35; } .cal-warn { margin-top: 3px; color: #912018; font-weight: 600; } .cal-auto { font-weight: 600; }
.asw-engcard { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; } .asw-engcard p { margin: 0; flex: 1 1 320px; font-size: 13.5px; line-height: 1.5; }
.asw-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; } .asw-links a { display: inline-flex; flex-direction: column; gap: 2px; padding: 8px 12px; border: 1px solid var(--color-border); border-radius: 10px; background: #fff; text-decoration: none; color: #1f2d3a; font-size: 13px; min-width: 190px; flex: 1 1 190px; }
.asw-links a b { font-size: 13.5px; } .asw-links a span { color: #475467; font-size: 12.5px; } .asw-links a:hover, .asw-links a:focus { border-color: var(--color-primary); }
.cal-table th, .cal-table td { vertical-align: top; } .cal-table th[scope=row] { padding-top: 14px; }
#representations .an-act > summary, #statement .an-act > summary, .rst-list .an-act > summary { min-height: 24px; padding: 3px 0; }
.rst-list a { color: var(--color-primary, #0f6e46); text-decoration: underline; text-underline-offset: 2px; }
.eth-checks li.is-warn::before { content: "!"; background: #fef0c7; color: #7a2e0e; }
.asw-dscnote { margin: 0 0 10px; line-height: 1.5; overflow-wrap: anywhere; } .asw-dscnote a, .asw-verify .asw-result a { color: var(--color-primary, #0f6e46); text-decoration: underline; text-underline-offset: 2px; }
.asw-result .asw-note { font-size: 12.5px; color: #475467; margin: 8px 0 0; line-height: 1.5; }
.rst-wait { margin: 6px 0 0; padding-inline-start: 18px; font-size: 13px; color: #475467; }
/* Update 100: locked figures, the year start, backups */
fieldset.bare-fieldset { border: 0; padding: 0; margin: 0; min-width: 0; } fieldset.bare-fieldset[disabled] { opacity: .72; }
.asw-locked th[scope=row] { font-weight: 600; font-size: 13px; } .asw-locked td { font-size: 13px; vertical-align: top; } .asw-locked details.an-act summary { font-size: 12.5px; }
.ys-step .ys-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .ys-step .ys-head .card-title { margin: 0; flex: 1 1 auto; min-width: 0; }
.ys-check { display: inline-flex; align-items: center; min-width: 24px; min-height: 24px; } .ys-check input { width: 20px; height: 20px; margin: 0; }
.ys-desc { margin: 6px 0 0; line-height: 1.5; } .ys-step.is-done { opacity: .85; }
.ys-more { margin-top: 8px; } .ys-more summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--color-primary, #0f6e46); min-height: 24px; }
.ys-list { margin: 6px 0 0; padding-inline-start: 18px; font-size: 13px; line-height: 1.55; overflow-wrap: anywhere; } .ys-list a { color: var(--color-primary, #0f6e46); text-decoration: underline; text-underline-offset: 2px; }
.ys-warn { color: #9a3412; font-weight: 600; } .ys-go { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 4px 0 16px; }
.bk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr)); gap: 4px 14px; align-items: end; } .bk-grid .form-group { margin-bottom: 8px; min-width: 0; }
.bk-wide { grid-column: 1 / -1; } .bk-go { grid-column: 1 / -1; display: flex; gap: 8px; flex-wrap: wrap; margin-top: 2px; }
.bk-check { display: flex; gap: 8px; align-items: flex-start; font-size: 13.5px; min-height: 24px; margin: 2px 0 6px; } .bk-check input { width: 18px; height: 18px; flex: none; margin-top: 1px; }
.bk-table th[scope=row] { font-weight: 600; font-size: 13px; white-space: nowrap; } .bk-table td, .bk-table th { vertical-align: top; }
.bk-acts { white-space: nowrap; } .bk-acts form { display: inline; } .bk-acts .btn { margin: 0 4px 4px 0; }
.bk-steps { margin: 0; padding-inline-start: 20px; line-height: 1.55; } .bk-steps li { margin-bottom: 6px; } .bk-steps .srv-cmd { margin: 4px 0; }
.bk-table th[scope=row] { text-align: start; }
@media (max-width: 640px) { .bk-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } .bk-table, .bk-table tbody, .bk-table tr, .bk-table th[scope=row], .bk-table td { display: block; width: auto; }
  .bk-table tr { border-bottom: 1px solid var(--color-border, #e5e7eb); padding: 8px 0; } .bk-table th[scope=row] { white-space: normal; padding: 0 0 4px; } .bk-table td { padding: 2px 0; border: 0; }
  .bk-table td[data-label]::before { content: attr(data-label) ": "; font-weight: 600; color: #374151; } .bk-acts { white-space: normal; padding-top: 6px !important; } }
/* digital signatures on PDFs, checked (update 101) */
.psig { display: grid; gap: 10px; } .psig-sig { padding: 12px 14px; border-inline-start: 5px solid #98a2b3; border-radius: 8px; background: #fff; border-top: 1px solid var(--color-border); border-inline-end: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.psig-sig.is-ok { border-inline-start-color: #0f6e46; background: #fbfefc; } .psig-sig.is-warn { border-inline-start-color: #dc6803; background: #fffcf3; } .psig-sig.is-bad { border-inline-start-color: #b42318; background: #fffbfa; }
.psig-h { font-size: 15px; margin: 0 0 8px; line-height: 1.4; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; overflow-wrap: anywhere; }
.psig-badge { display: inline-block; font-size: 11.5px; font-weight: 700; letter-spacing: .02em; padding: 2px 9px; border-radius: 999px; background: #eef0f3; color: #344054; white-space: nowrap; }
.psig-badge.is-ok { background: #dff3e7; color: #0b4a32; } .psig-badge.is-warn { background: #fef0c7; color: #7a2e0e; } .psig-badge.is-bad { background: #fee4e2; color: #912018; } .psig-badge.is-none { background: #eef0f3; color: #344054; }
.psig-facts { margin-bottom: 6px; } .psig-checks { margin: 6px 0 4px; } .eth-checks li.is-info::before { content: "i"; background: #e8eef9; color: #1e3a8a; font-style: italic; font-family: Georgia, serif; }
.psig-more { margin-top: 6px; } .psig-more > summary { cursor: pointer; font-size: 13px; color: var(--color-primary, #0f6e46); font-weight: 600; } .psig-more[open] > summary { margin-bottom: 8px; }
.psig-fp { font-size: 11.5px; word-break: break-all; } .psig-chain-h { margin: 6px 0 2px; font-weight: 600; } .psig-chain { margin: 0 0 4px; padding-inline-start: 20px; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.psig-rev { margin: 4px 0; } .psig-rev a, .psig-panel a { color: var(--color-primary, #0f6e46); text-decoration: underline; text-underline-offset: 2px; }
.psig-notes, .psig-when { margin: 0; line-height: 1.5; overflow-wrap: anywhere; } .psig-none { margin: 0; font-size: 13.5px; }
.psig-panel { margin: 10px 0 12px; } .psig-panel-h { font-size: 15px; margin: 0 0 8px; } .psig-recheck { margin-top: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.psig-inline { margin: 6px 0 10px; border: 1px solid var(--color-border); border-radius: 8px; padding: 8px 12px; background: #fff; } .psig-inline > summary { cursor: pointer; font-size: 13.5px; line-height: 1.5; overflow-wrap: anywhere; } .psig-inline[open] > summary { margin-bottom: 10px; }
.psig-verdict { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin: 0 0 12px; font-size: 14px; line-height: 1.5; }
.psig-about > summary { cursor: pointer; font-size: 13.5px; font-weight: 600; margin-top: 12px; } .psig-about ul { margin: 8px 0 0; padding-inline-start: 20px; line-height: 1.55; }
.asw-sub { font-size: 15px; margin: 14px 0 8px; }
.pt-table th, .pt-table td { vertical-align: top; text-align: start; } .pt-table thead th { font-size: 12.5px; white-space: nowrap; } .pt-table th[scope=row] { font-weight: 600; font-size: 13.5px; } .pt-table th[scope=row] .text-xs { font-weight: 400; font-size: 12px; margin-top: 2px; overflow-wrap: anywhere; }
.pt-fp { word-break: break-all; min-width: 180px; } .pt-off th, .pt-off td { color: #667085; } .pt-unlock { margin: 10px 0; display: grid; gap: 6px; max-width: 360px; justify-items: start; } .pt-unlock .form-group { margin: 0; width: 100%; }
@media (max-width: 640px) { .pt-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } .pt-table, .pt-table tbody, .pt-table tr, .pt-table th[scope=row], .pt-table td { display: block; width: auto; }
  .pt-table tr { border-bottom: 1px solid var(--color-border, #e5e7eb); padding: 8px 0; } .pt-table td { padding: 2px 0; border: 0; } .pt-table td[data-label]::before { content: attr(data-label) ": "; font-weight: 600; color: #374151; } .pt-fp { min-width: 0; } }
@media (max-width: 640px) { .psig-sig { padding: 10px 12px; } .psig-h { font-size: 14px; } }
/* ---------- update 103: dashboard next steps and the reporting cycle ---------- */
.dash-next { display: grid; gap: 18px; padding: 16px 18px; }
.dash-next.has-side { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
@media (max-width: 1100px) { .dash-next.has-side { grid-template-columns: 1fr; } }
.dn-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; }
.dn-head h2 { font-size: 15px; margin: 0; display: flex; align-items: center; gap: 8px; color: var(--color-ink); }
.dn-list .mt-item { padding: 9px 12px; border-radius: 12px; gap: 12px; }
.dn-list .mt-ic { width: 30px; height: 30px; border-radius: 9px; }
.dn-list .mt-main { min-width: 0; } .dn-list .mt-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dn-clear { margin: 6px 0 0; color: var(--color-text-muted); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13.5px; }
.dn-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.dn-step a { display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: start; padding: 7px 8px; border-radius: 10px; color: inherit; text-decoration: none; position: relative; }
.dn-step a:hover, .dn-step a:focus-visible { background: var(--color-surface-alt); }
.dn-step + .dn-step a::before { content: ""; position: absolute; left: 20px; top: -9px; height: 14px; width: 2px; background: #d6dee6; }
[dir="rtl"] .dn-step + .dn-step a::before { left: auto; right: 20px; }
.dn-dot { width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; background: #eef1f4; color: #4f5b6b; border: 2px solid #d6dee6; position: relative; z-index: 1; }
.dn-step.is-done .dn-dot { background: #1a7f4b; border-color: #1a7f4b; color: #fff; }
.dn-step.is-active .dn-dot { background: #fff; border-color: #1f56c4; color: #1f56c4; }
.dn-step.is-attention .dn-dot { background: #fff4e5; border-color: #b54708; color: #9a3412; }
.dn-step.is-current a { background: #f3f7ff; }
.dn-text { min-width: 0; } .dn-label { display: block; font-weight: 650; font-size: 13.5px; color: var(--color-ink); }
.dn-line { display: block; font-size: 12.5px; color: var(--color-text-muted); }
.dn-step.is-attention .dn-line { color: #9a3412; }
.dn-area { display: block; padding: 8px 10px; border-radius: 10px; color: inherit; text-decoration: none; }
.dn-area:hover, .dn-area:focus-visible { background: var(--color-surface-alt); }
.dn-area-top { display: flex; justify-content: space-between; gap: 8px; font-size: 13.5px; margin-bottom: 6px; }
.dn-area .env-ws-meter { display: block; } .dn-area .dn-line { margin-top: 5px; }
/* ---------- update 103: sidebar sections that fold (Collect, Review, Analyse, Report, Assure & file, Programmes, Settings) ---------- */
.sidebar-section-toggle { display: flex; align-items: center; gap: 6px; width: 100%; background: transparent; border: 0; cursor: pointer; font-family: inherit; text-align: left; border-radius: 8px; margin-top: 4px; }
.sidebar-section-toggle:hover { color: #9fc2b2; background: rgba(255,255,255,.03); }
.sidebar-section-toggle:focus-visible { outline: 2px solid var(--t-mint, #4fd68c); outline-offset: 1px; }
.section-chev { margin-left: auto; display: flex; transition: transform .16s ease; opacity: .75; }
.sidebar-section:not(.open) > .sidebar-section-toggle .section-chev { transform: rotate(-90deg); }
[dir="rtl"] .section-chev { margin-left: 0; margin-right: auto; } [dir="rtl"] .sidebar-section:not(.open) > .sidebar-section-toggle .section-chev { transform: rotate(90deg); }
.sidebar-section-body { display: none; }
.sidebar-section.open > .sidebar-section-body, .sidebar.is-filtering .sidebar-section-body, body.sidebar-collapsed .sidebar-section-body { display: block; }
.sidebar.is-filtering .sidebar-group.filter-open > .sidebar-subnav { display: block; }
@media (prefers-reduced-motion: reduce) { .section-chev, .group-chev { transition: none; } }
/* ---------- update 103: notifications page ---------- */
.notif-all { display: block; text-align: center; padding: 10px 12px; font-size: 12.5px; font-weight: 650; color: var(--color-primary); border-top: 1px solid var(--color-border); text-decoration: none; }
.notif-all:hover { background: var(--color-surface-alt); }
.nt-seg { display: inline-flex; } .nt-seg a { padding: 7px 14px; border-radius: 999px; font-size: 13px; font-weight: 600; color: #273246; text-decoration: none; }
.nt-seg a.is-on { background: var(--color-primary); color: #fff; } .nt-seg a.is-on .mt-chip-n { background: rgba(4,17,11,.32); color: #fff; }
.nt-day { margin-top: 18px; }
.nt-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.nt-item { display: grid; grid-template-columns: 10px 1fr auto; gap: 12px; align-items: start; padding: 11px 14px; border: 1px solid var(--color-border); border-radius: 12px; background: #fff; }
.nt-item.is-unread { background: #f4fbf7; border-color: #cfe9da; }
.nt-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; background: transparent; } .nt-item.is-unread .nt-dot { background: var(--color-primary); }
.nt-title { font-weight: 650; color: var(--color-ink); text-decoration: none; } .nt-title:hover { text-decoration: underline; } .nt-item:not(.is-unread) .nt-title { font-weight: 550; }
.nt-msg { font-size: 13px; color: #273246; margin-top: 2px; } .nt-time { font-size: 12px; color: var(--color-text-muted); margin-top: 4px; }
.nt-recs { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 3px; font-size: 13px; color: #273246; } .nt-recs li { overflow-wrap: anywhere; } .nt-recs a { font-weight: 600; }
.nt-rec-d { color: #4b5563; } .nt-rec-n { display: inline-block; margin-inline-start: 4px; padding: 0 6px; border-radius: 999px; background: #eef2f6; color: #374151; font-size: 11.5px; font-weight: 600; } .nt-rec-more { color: var(--color-text-muted); }
.nt-pages { display: flex; gap: 12px; align-items: center; justify-content: center; margin-top: 16px; }
@media (max-width: 640px) { .nt-item { grid-template-columns: 10px 1fr; } .nt-act { grid-column: 2; } }
.notice-text { line-height: 1.6; } .notice-text a:not(.btn) { color: var(--color-primary); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
/* update 103: workspace — sent back, and what to enter next */
.env-sentback { display: flex; gap: 8px; align-items: flex-start; margin-bottom: 12px; } .env-sentback svg { flex: none; margin-top: 2px; }
/* a form filled in from a document handed to Ask ESGTrack (update 147): what was filled in from what, what to check, the document beside the form */
.env-intake { border: 1px solid #bfe3cf; background: #f3faf6; border-radius: 12px; padding: 12px 14px; margin-bottom: 14px; }
.env-intake-head { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; } .env-intake-title { margin: 0; font-size: 15px; font-weight: 700; color: #0b5737; } .env-intake-by { font-size: 12px; color: var(--color-text-muted); }
.env-intake-say { margin: 6px 0 0; font-size: 13.5px; color: #1f2937; } .env-intake-quote { margin: 8px 0 0; font-size: 13px; color: #374151; } .env-intake-quote > span:first-child { color: var(--color-text-muted); }
.env-intake-checks { margin: 8px 0 0; padding: 0; list-style: none; display: grid; gap: 4px; } .env-intake-checks li { display: flex; gap: 6px; align-items: flex-start; font-size: 13px; color: #7a4a00; } .env-intake-checks svg { flex: none; margin-top: 3px; color: #b45309; }
.env-intake-acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; align-items: center; } .env-intake-doc { margin-top: 10px; } .env-intake-doc iframe.env-intake-pdf { width: 100%; height: min(70vh, 640px); border: 1px solid var(--color-border); border-radius: 8px; background: #fff; }
.env-intake-doc img { max-width: 100%; max-height: 70vh; border-radius: 8px; border: 1px solid var(--color-border); }
.form-group.is-filled > .form-control, .form-group.is-filled > select.form-control { box-shadow: inset 3px 0 0 #0f6e46; border-inline-start: 3px solid #0f6e46; }
.env-filled-note { display: block; font-size: 11.5px; color: #0b5737; margin-top: 3px; }
.env-drop.has-held .env-drop-name { color: #0b5737; }
.env-next { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 0 0 12px; padding: 8px 12px; border-radius: 10px; background: #f3f7ff; color: #273246; }
.env-next a { font-weight: 650; color: #1f56c4; text-decoration: underline; text-underline-offset: 2px; } .env-next.is-done { background: var(--color-primary-light); color: var(--color-primary-dark, #0b5737); }
#entry, [id^="mtg_"], #mtTeam { scroll-margin-top: calc(var(--topbar-height, 60px) + 16px); }   /* links to #entry land below the sticky top bar */
/* ---------- update 104: guided mode — the Guide button, welcome / done dialogs, page tours (assets/js/guide.js) ---------- */
.gd-anchor { position: relative; display: inline-flex; }
.gd-topbtn { align-items: center; gap: 6px; padding: 6px 10px; min-height: 34px; border: 1px solid var(--t-dark-line) !important; background: rgba(255,255,255,.04) !important; font-size: 12.5px; font-weight: 650; color: var(--t-on-dark-2); }
.gd-topbtn:hover, .gd-topbtn[aria-expanded="true"] { background: rgba(255,255,255,.09) !important; color: var(--t-on-dark); }
.gd-topbtn.is-on { color: var(--t-mint-2); border-color: rgba(79,214,140,.45) !important; }
.gd-topbtn-dot { display: none; width: 7px; height: 7px; border-radius: 50%; background: var(--t-mint); box-shadow: 0 0 0 2px rgba(4,17,11,.9); }
.gd-topbtn.is-on .gd-topbtn-dot { display: inline-block; }
.gd-menu { position: absolute; top: calc(100% + 8px); right: 0; z-index: 70; width: 292px; padding: 6px; background: #fff; color: var(--color-text); border: 1px solid var(--color-border); border-radius: 16px; box-shadow: 0 24px 60px rgba(4,17,11,.22); }
[dir="rtl"] .gd-menu { right: auto; left: 0; }
.gd-menu[hidden] { display: none; }
.gd-menu-head { padding: 8px 10px 8px; border-bottom: 1px solid var(--color-border); margin-bottom: 4px; }
.gd-menu-title { font-size: 13.5px; font-weight: 750; } .gd-menu-sub { font-size: 12px; color: var(--color-text-muted); margin-top: 1px; }
.gd-mi { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 8px 10px; border: 0; background: none; border-radius: 10px; font: inherit; font-size: 13.5px; color: var(--color-text); text-align: start; cursor: pointer; }
.gd-mi:hover, .gd-mi:focus-visible { background: var(--color-surface-alt); }
.gd-mi > svg { flex: none; color: var(--color-primary); }
.gd-mi:disabled { cursor: default; color: var(--color-text-muted); background: none; } .gd-mi:disabled > svg { color: var(--color-text-muted); }
.gd-sw { border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); border-radius: 0; margin: 4px 0; }
.gd-sw-label { flex: 1; font-weight: 650; } .gd-sw-state { font-size: 12px; color: var(--color-text-muted); }
.gd-sw-track { position: relative; flex: none; width: 36px; height: 22px; border-radius: 999px; background: #b9c4cf; transition: background .15s; }
.gd-sw-thumb { position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(11,18,32,.3); transition: transform .15s; }
.gd-sw[aria-checked="true"] .gd-sw-track { background: var(--color-primary); }
.gd-sw[aria-checked="true"] .gd-sw-thumb { transform: translateX(14px); }
[dir="rtl"] .gd-sw[aria-checked="true"] .gd-sw-thumb { transform: translateX(-14px); } [dir="rtl"] .gd-sw-thumb { left: auto; right: 3px; }
.gd-anchor.is-floating { position: fixed; left: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 1100; }
.gd-anchor.is-floating .gd-topbtn { background: #0b1f17 !important; color: #e9f7f0; border-radius: 999px; padding: 10px 14px; box-shadow: 0 10px 26px rgba(4,17,11,.3); }
.gd-anchor.is-floating .gd-menu { top: auto; bottom: calc(100% + 8px); left: 0; right: auto; }
@media (max-width: 640px) {
  .gd-topbtn { padding: 6px 8px; }
  .gd-topbtn-tx { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .gd-menu { position: fixed; top: calc(var(--topbar-height) + 6px); right: 8px; left: 8px; width: auto; }
}
/* the dialogs */
.gd-overlay { position: fixed; inset: 0; z-index: 1800; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(4,17,11,.55); animation: gdFade .18s ease both; }
.gd-modal { width: min(540px, 100%); max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow: auto; background: #fff; color: var(--color-text); border-radius: 20px; box-shadow: 0 30px 80px rgba(4,17,11,.35); animation: gdPop .2s ease both; overscroll-behavior: contain; }
.gd-head { display: flex; align-items: center; gap: 12px; padding: 18px 20px 6px; }
.gd-icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; background: var(--color-primary-light); color: var(--color-primary); }
.gd-icon.is-hello { background: linear-gradient(135deg, #e7f4ed, #dff1f7); } .gd-icon.is-ok { background: #e3f5ea; color: #0b5737; }
.gd-title { flex: 1; min-width: 0; margin: 0; font-size: 18px; font-weight: 760; line-height: 1.25; letter-spacing: -.02em; }
.gd-title:focus { outline: none; }
.gd-x { flex: none; width: 36px; height: 36px; border: 0; border-radius: 10px; background: none; color: var(--color-text-muted); font-size: 24px; line-height: 1; cursor: pointer; }
.gd-x:hover { background: var(--color-surface-alt); color: var(--color-text); }
.gd-body { padding: 4px 20px 18px; font-size: 14px; }
.gd-lead { margin: 4px 0 12px; color: #273246; line-height: 1.55; }
.gd-h3 { margin: 14px 0 6px; font-size: 11.5px; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; color: var(--color-text-muted); }
.gd-task { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: 14px; background: #fff; }
.gd-task.is-now { border-color: rgba(15,110,70,.32); background: linear-gradient(180deg, #f6fbf8, #fff); box-shadow: inset 3px 0 0 var(--color-primary); }
[dir="rtl"] .gd-task.is-now { box-shadow: inset -3px 0 0 var(--color-primary); }
.gd-task-main { flex: 1; min-width: 0; }
.gd-task-label { font-size: 11px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; color: var(--color-primary-dark, #0b5737); margin-bottom: 2px; }
.gd-task-title { font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
.gd-task-sub { font-size: 12.5px; color: var(--color-text-muted); margin-top: 2px; line-height: 1.4; overflow-wrap: anywhere; }
.gd-task-when { font-size: 12px; font-weight: 650; color: #7a4a00; margin-top: 3px; }
.gd-task > .btn { flex: none; }
.gd-more { display: inline-block; margin: 2px 0 4px; font-size: 13px; font-weight: 650; color: var(--color-primary); }
.gd-empty { margin: 6px 0; padding: 12px 14px; border-radius: 12px; background: var(--color-surface-alt); color: #273246; line-height: 1.5; }
.gd-how { margin: 12px 0 4px; padding: 8px 12px; border: 1px solid var(--color-border); border-radius: 14px; background: var(--color-surface-alt); }
.gd-how > summary { cursor: pointer; font-size: 13.5px; font-weight: 650; padding: 2px 0; }
.gd-how ol { margin: 8px 0 4px; padding-inline-start: 20px; font-size: 13.5px; line-height: 1.55; color: #273246; } .gd-how li + li { margin-top: 4px; }
.gd-choice { margin-top: 14px; padding: 14px 16px; border-radius: 14px; border: 1px solid rgba(15,110,70,.2); background: linear-gradient(135deg, rgba(26,155,98,.08), rgba(14,116,144,.06)); }
.gd-choice .gd-h3 { margin: 0 0 4px; font-size: 15.5px; letter-spacing: -.01em; text-transform: none; color: var(--color-text); }
.gd-choice p { margin: 0; font-size: 13.5px; line-height: 1.5; color: #273246; }
.gd-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.gd-modal .btn-sm, .gd-pop .btn-sm { min-height: 36px; padding: 7px 14px; font-size: 13px; }
.gd-note { margin: 12px 0 0; font-size: 12.5px; color: var(--color-text-muted); }
.gd-linkbtn { padding: 0; border: 0; background: none; font: inherit; font-weight: 650; color: var(--color-primary); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }
.gd-toast.is-out { opacity: 0; transform: translateY(-6px); transition: opacity .3s, transform .3s; }
.gd-toast-solo { position: fixed; top: calc(var(--topbar-height) + 14px); right: 18px; z-index: 1500; max-width: min(420px, calc(100vw - 36px)); }
/* the tour: a spotlight on the element and a card beside it (a sheet at the bottom on phones) */
.gd-spot { position: fixed; z-index: 1700; border-radius: 12px; pointer-events: none; box-shadow: 0 0 0 3px var(--t-mint), 0 0 0 9999px rgba(4,17,11,.5); transition: top .2s ease, left .2s ease, width .2s ease, height .2s ease; }
.gd-pop { position: fixed; z-index: 1750; width: min(360px, calc(100vw - 16px)); padding: 14px 16px 12px; background: #fff; color: var(--color-text); border: 1px solid var(--color-border); border-radius: 16px; box-shadow: 0 24px 60px rgba(4,17,11,.3); animation: gdPop .18s ease both; }
.gd-pop-count { font-size: 11.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--color-text-muted); }
.gd-pop-title { margin: 4px 0 4px; font-size: 16px; font-weight: 760; letter-spacing: -.015em; } .gd-pop-title:focus { outline: none; }
.gd-pop-text { margin: 0; font-size: 13.5px; line-height: 1.55; color: #273246; }
.gd-pop-bar { height: 3px; margin: 12px 0 10px; border-radius: 999px; background: var(--color-border); overflow: hidden; } .gd-pop-bar > span { display: block; height: 100%; width: 0; background: var(--color-primary); transition: width .2s ease; }
.gd-pop-acts { display: flex; align-items: center; gap: 8px; }
.gd-pop-acts .gd-skip { margin-inline-end: auto; padding-inline: 6px; color: var(--color-text-muted); }
.gd-pop.is-sheet { left: 0; right: 0; bottom: 0; width: auto; border-radius: 18px 18px 0 0; padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
@keyframes gdFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes gdPop { from { opacity: 0; transform: translateY(6px) scale(.985); } to { opacity: 1; transform: none; } }
@media (max-width: 480px) {
  .gd-overlay { align-items: flex-end; padding: 0; }
  .gd-modal { width: 100%; max-height: 92vh; max-height: 92dvh; border-radius: 20px 20px 0 0; padding-bottom: env(safe-area-inset-bottom, 0px); }
  .gd-head { padding: 16px 16px 4px; } .gd-body { padding: 4px 16px 16px; }
  .gd-task { flex-wrap: wrap; } .gd-task > .btn { width: 100%; justify-content: center; }
  .gd-acts > .btn { flex: 1 1 auto; justify-content: center; }
}
@media print { .gd-anchor, .gd-overlay, .gd-spot, .gd-pop, .gd-toast { display: none !important; } }
/* Guided mode on the profile page */
.gd-pref { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.gd-pref-text { flex: 1 1 320px; } .gd-pref-text p { margin: 4px 0 0; font-size: 13.5px; color: var(--color-text-muted); line-height: 1.5; }
.gd-pref-acts { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.gd-err { margin: 10px 0 0; padding: 8px 12px; border-radius: 10px; background: #fde8e8; color: #9b1c1c; font-size: 13px; font-weight: 600; } .gd-err:empty { display: none; }
.gd-fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
/* ---------- update 105: training — My Training, a lesson, the certificate, Team Training ---------- */
.tr-progress { display: flex; align-items: center; gap: 22px; padding: 20px 24px; margin-bottom: 18px; background: linear-gradient(135deg, #f6fbf8, #fff 60%); }
.tr-progress.is-complete { background: linear-gradient(135deg, #e7f4ed, #fff 70%); border-color: rgba(15,110,70,.25); }
.tr-ring { flex: none; }
.tr-ring-bg { fill: none; stroke: var(--color-border); stroke-width: 8; }
.tr-ring-fg { fill: none; stroke: var(--color-primary); stroke-width: 8; stroke-linecap: round; transform: rotate(-90deg); transform-origin: 36px 36px; transition: stroke-dashoffset .4s ease; }
.tr-ring-tx { font-size: 15px; font-weight: 760; fill: var(--color-text); }
.tr-progress-main { min-width: 0; }
.tr-progress-title { margin: 0 0 4px; font-size: 19px; font-weight: 760; letter-spacing: -.02em; }
.tr-progress-sub { margin: 0; color: #273246; font-size: 14px; line-height: 1.5; }
.tr-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 12px 0 0; }
.tr-modules { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 380px), 1fr)); }
.tr-module { padding: 16px 18px; margin: 0; }
.tr-module-head { display: flex; align-items: flex-start; gap: 12px; }
.tr-module-ic { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 11px; background: var(--color-primary-light); color: var(--color-primary); }
.tr-module-text { flex: 1; min-width: 0; }
.tr-module-title { margin: 0; font-size: 16px; font-weight: 740; }
.tr-module-intro { margin: 2px 0 0; font-size: 13px; color: var(--color-text-muted); line-height: 1.45; }
.tr-module-count { flex: none; font-size: 12px; font-weight: 700; color: var(--color-text-muted); white-space: nowrap; }
.tr-bar, .tr-mini { height: 5px; border-radius: 999px; background: var(--color-border); overflow: hidden; margin: 12px 0 8px; }
.tr-bar > span, .tr-mini > span { display: block; height: 100%; background: var(--color-primary); border-radius: inherit; }
.tr-mini { width: 120px; margin: 0 0 4px; }
.tr-lessons { list-style: none; margin: 0; padding: 0; }
.tr-lesson { display: flex; align-items: flex-start; gap: 10px; padding: 8px 0; border-top: 1px solid var(--color-border); }
.tr-lesson:first-child { border-top: 0; }
.tr-st { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; margin-top: 1px; border-radius: 50%; border: 2px solid var(--color-border-strong); color: #fff; }
.tr-lesson.is-done .tr-st { background: var(--color-primary); border-color: var(--color-primary); }
.tr-lesson.is-started .tr-st { border-color: var(--color-primary); }
.tr-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--color-primary); }
.tr-lesson-main { min-width: 0; display: flex; flex-direction: column; }
.tr-lesson-title { font-weight: 650; color: var(--color-text); line-height: 1.35; }
.tr-lesson-title:hover { color: var(--color-primary); text-decoration: underline; }
.tr-lesson.is-done .tr-lesson-title { color: #273246; }
.tr-lesson-meta { font-size: 12px; color: var(--color-text-muted); margin-top: 1px; }
.tr-more { margin: 4px 0 16px; } .tr-more > summary { cursor: pointer; font-weight: 700; font-size: 15px; padding: 6px 0; }
.tr-more .tr-modules { margin-top: 10px; }
/* a lesson */
.tr-lesson-page { max-width: 820px; }
.tr-kicker { margin: 0 0 4px; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--color-text-muted); }
.tr-title { margin: 0 0 6px; font-size: 26px; font-weight: 780; letter-spacing: -.025em; }
.tr-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 0 0 16px; font-size: 13.5px; color: var(--color-text-muted); }
.tr-badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.tr-badge.is-done { background: #e3f5ea; color: #0b5737; }
.tr-sec { padding: 18px 22px; margin-bottom: 14px; }
.tr-h2 { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: 16.5px; font-weight: 740; }
.tr-h2 svg { color: var(--color-primary); }
.tr-lead { margin: 0 0 10px; font-size: 15px; color: #273246; line-height: 1.55; }
.tr-points { margin: 0; padding-inline-start: 22px; font-size: 14.5px; line-height: 1.6; color: var(--color-text); }
.tr-points li + li { margin-top: 6px; }
.tr-p { margin: 0 0 10px; font-size: 14.5px; line-height: 1.6; }
.tr-list { margin: 0 0 12px; } .tr-list li + li { margin-top: 3px; } .tr-p + .tr-list { margin-top: -4px; }
.tr-ok { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 650; color: #0b5737; }
.tr-show { border-inline-start: 3px solid var(--color-primary); }
.tr-try { border-inline-start: 3px solid #1f56c4; } .tr-try .tr-h2 svg { color: #1f56c4; }
.tr-q { border: 0; margin: 0 0 16px; padding: 0; min-width: 0; }
.tr-q-title { padding: 0; margin: 0 0 8px; font-weight: 700; font-size: 15px; line-height: 1.45; }
.tr-opt { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; margin: 0 0 6px; border: 1px solid var(--color-border); border-radius: 12px; cursor: pointer; font-size: 14px; line-height: 1.45; background: #fff; }
.tr-opt:hover { border-color: var(--color-border-strong); background: var(--color-surface-alt); }
.tr-opt input { margin-top: 3px; accent-color: var(--color-primary); flex: none; }
.tr-opt:has(input:focus-visible) { outline: 3px solid rgba(15,110,70,.45); outline-offset: 1px; }
.tr-opt.is-right { border-color: rgba(15,110,70,.55); background: #ecf8f1; }
.tr-opt.is-wrong { border-color: rgba(180,35,24,.45); background: #fdeeee; }
.tr-why { margin: 6px 0 0; padding: 8px 12px; border-radius: 10px; font-size: 13.5px; line-height: 1.5; }
.tr-why.is-right { background: #ecf8f1; color: #0b5737; } .tr-why.is-wrong { background: #fff4e5; color: #6b3d00; }
.tr-result { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; font-size: 14px; }
.tr-result.is-pass { background: #e3f5ea; color: #0b5737; } .tr-result.is-retry { background: #fff4e5; color: #6b3d00; }
.tr-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 18px 0 8px; }
.tr-nav a { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border: 1px solid var(--color-border); border-radius: 14px; background: #fff; color: var(--color-text); }
.tr-nav a:hover { border-color: var(--color-border-strong); }
.tr-nav-next { text-align: end; } .tr-nav-next.is-ready { border-color: rgba(15,110,70,.4); background: #f6fbf8; }
.tr-nav-k { font-size: 12px; font-weight: 700; color: var(--color-primary); text-transform: uppercase; letter-spacing: .04em; }
.tr-nav-t { font-weight: 650; font-size: 14px; }
/* the certificate */
.tr-cert-page { max-width: 860px; margin: 0 auto; }
.tr-cert { position: relative; padding: 56px 48px; text-align: center; background: #fff; border-radius: 20px; border: 1px solid var(--color-border); box-shadow: 0 18px 50px rgba(4,17,11,.1); outline: 2px solid rgba(15,110,70,.25); outline-offset: -14px; }
.tr-cert-brand { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 16px; color: var(--color-primary); letter-spacing: -.01em; }
.tr-cert-title { margin: 18px 0 22px; font-size: 32px; font-weight: 780; letter-spacing: -.03em; }
.tr-cert-line { margin: 0; font-size: 15.5px; color: #273246; }
.tr-cert-name { margin: 14px 0; font-size: 30px; font-weight: 760; color: var(--color-text); letter-spacing: -.02em; }
.tr-cert-detail { margin: 20px 0 0; font-size: 13.5px; color: var(--color-text-muted); }
.tr-cert-acts { display: flex; gap: 10px; justify-content: center; margin-top: 18px; }
@media print {   /* only the certificate, when the page is the certificate */
  body:has(.tr-cert-page) :is(.sidebar, .topbar, .breadcrumb-bar, .skip-link, .tr-cert-acts, .toast-region, .alert, .gd-anchor) { display: none !important; }
  body:has(.tr-cert-page) .main-wrap { margin: 0 !important; } body:has(.tr-cert-page) .page-content { padding: 0 !important; }
  .tr-cert { box-shadow: none; border-color: #ccc; }
}
/* Team Training */
.tr-team-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
.tr-team-head .card-title { margin: 0; margin-inline-end: auto; }
.tr-filter { flex-wrap: wrap; }
.tr-late { color: #b42318; font-weight: 650; }
.tr-team-grid { align-items: flex-start; margin-top: 14px; }
.tr-own { list-style: none; margin: 0 0 12px; padding: 0; }
.tr-own-item { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 10px 0; border-top: 1px solid var(--color-border); }
.tr-own-item.is-off .tr-own-main b { color: var(--color-text-muted); }
.tr-own-main { flex: 1 1 220px; min-width: 0; }
.tr-own-acts { display: flex; gap: 6px; }
.tr-own-edit { flex: 1 1 100%; } .tr-own-edit > summary { cursor: pointer; font-size: 13px; font-weight: 650; color: var(--color-primary); }
.tr-own-new > summary { list-style: none; display: inline-flex; } .tr-own-new > summary::-webkit-details-marker { display: none; }
.tr-own-form { margin-top: 10px; padding: 12px; border-radius: 12px; background: var(--color-surface-alt); }
.tr-own-roles { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 4px; }
.tr-own-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 20px; } .tr-own-row .form-group { max-width: 160px; }
.tr-own-req { margin-bottom: 14px; }
.tr-own-q > summary { cursor: pointer; font-weight: 650; font-size: 13.5px; margin: 4px 0 8px; }
.tr-own-opt { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; } .tr-own-opt input[type="radio"] { flex: none; accent-color: var(--color-primary); }
.tr-own-form .form-check, .tr-set .form-check { display: flex; align-items: center; gap: 8px; min-height: 30px; margin: 0; }
.tr-own-form .form-check input[type=checkbox], .tr-own-form .form-check input[type=radio], .tr-own-opt input[type=radio], .tr-set .form-check input[type=checkbox] { width: 18px; height: 18px; margin: 0; flex: none; accent-color: var(--color-primary); }
.tr-set .form-check { align-items: flex-start; } .tr-set .form-check input[type=checkbox] { margin-top: 2px; }
.tr-own-err { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 12px; }
.tr-team-table tbody th[scope=row], .tr-person-table tbody th[scope=row] { background: none; color: var(--color-text); font-size: 13.5px; font-weight: 650; text-transform: none; letter-spacing: normal; text-align: start; }
.tr-person { color: inherit; text-decoration: none; } .tr-person:hover, .tr-person:focus-visible { color: var(--color-primary); text-decoration: underline; }
.tr-person-table .tr-p-done td:nth-of-type(2) { color: var(--color-primary-dark, #0b5737); font-weight: 600; } .tr-person-table .tr-p-new td:nth-of-type(2) { color: var(--color-text-muted); }
.tr-reminded { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 600; color: var(--color-primary); white-space: nowrap; } .tr-reminded-last { margin-top: 3px; white-space: nowrap; }
.tr-team-table tbody th[scope=row] .text-xs { font-weight: 400; margin-top: 2px; overflow-wrap: anywhere; }
@media (max-width: 640px) {
  .tr-progress { flex-direction: column; align-items: flex-start; padding: 16px; gap: 12px; }
  .tr-title { font-size: 21px; } .tr-sec { padding: 14px 16px; }
  .tr-nav { grid-template-columns: 1fr; } .tr-nav-next { text-align: start; }
  .tr-cert { padding: 32px 18px; } .tr-cert-title { font-size: 24px; } .tr-cert-name { font-size: 22px; }
  /* Team Training: each person a block — name and status, role, progress and the reminder */
  .tr-team .table-wrap { overflow: visible; border: 0; }
  .tr-team-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .tr-team-table, .tr-team-table tbody { display: block; width: 100%; }
  .tr-team-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "person status" "role status" "progress actions" "last actions"; gap: 3px 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--color-border); }
  .tr-team-table tbody th[scope=row], .tr-team-table td { display: block; padding: 0; border: 0; background: none; }
  .tr-team-table tbody th[scope=row] { grid-area: person; } .tr-team-table td:nth-of-type(1) { grid-area: role; color: var(--color-text-muted); }
  .tr-team-table td:nth-of-type(2) { grid-area: progress; } .tr-team-table td:nth-of-type(3) { grid-area: last; font-size: 12px; color: var(--color-text-muted); }
  .tr-team-table td:nth-of-type(4) { grid-area: status; text-align: end; align-self: start; } .tr-team-table td:nth-of-type(5) { grid-area: actions; text-align: end; }
  .tr-team-table .tr-ph { display: inline; }
}
.tr-ph { display: none; }
/* the guide's training pieces */
.gd-train, .gd-trainc { display: flex; align-items: center; gap: 12px; margin: 10px 0 8px; padding: 10px 12px; border-radius: 14px; border: 1px solid rgba(31,86,196,.25); background: #f3f7ff; }
.gd-train > svg, .gd-trainc > svg { flex: none; color: #1f56c4; }
.gd-train-main, .gd-trainc-main { flex: 1; min-width: 0; }
.gd-train-title, .gd-trainc-title { font-weight: 700; line-height: 1.35; }
.gd-train > .btn, .gd-trainc > .btn { flex: none; }
.gd-mi-link { text-decoration: none; border-top: 1px solid var(--color-border); border-radius: 0 0 10px 10px; margin-top: 4px; }
.gd-mi-count { margin-inline-start: auto; font-size: 11.5px; font-weight: 700; padding: 1px 8px; border-radius: 999px; background: var(--color-primary-light); color: var(--color-primary-dark, #0b5737); }
@media (max-width: 480px) { .gd-train, .gd-trainc { flex-wrap: wrap; } .gd-train > .btn, .gd-trainc > .btn { width: 100%; justify-content: center; } }
/* ---------- update 106: what a refused save typed, put back; the session warning ---------- */
.kept-note { margin: 0 0 12px; }
.kept-file { margin: 4px 0 0; font-size: 12.5px; font-weight: 600; color: #8a4b00; }
.session-bar { position: fixed; left: 0; right: 0; bottom: 16px; margin: 0 auto; width: min(580px, calc(100% - 32px)); z-index: 3000; display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px;
  padding: 12px 16px; border-radius: 14px; background: #1f2937; color: #fff; box-shadow: 0 14px 36px rgba(15, 23, 42, .28); }
.session-bar.is-ended { background: #7a271a; }
.session-msg { margin: 0; flex: 1 1 260px; font-size: 14px; line-height: 1.45; }
.session-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.session-bar .btn-secondary { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); }
.session-bar .btn-primary { background: #fff; color: #0b5737; border-color: #fff; }
.session-bar :focus-visible { outline: 3px solid #fbbf24; outline-offset: 2px; }
@media print { .session-bar { display: none !important; } }
/* paged lists (update 106) */
.pager { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; margin: 12px 0 2px; }
.pager > :first-child { justify-self: start; } .pager > :last-child { justify-self: end; } .pager-at { color: var(--color-text-muted); }
/* ---------- update 146: the Evidence register — files beside their figures, opened and reviewed in a panel ---------- */
.ev-filters { display: grid; gap: 12px; padding: 14px 16px; margin-bottom: 14px; }
.ev-status { display: inline-flex; flex-wrap: wrap; gap: 2px; } .ev-status a { padding: 7px 13px; border-radius: 999px; font-size: 13px; font-weight: 600; color: #273246; text-decoration: none; }
.ev-status a.is-on { background: var(--color-primary); color: #fff; } .ev-status a.is-on .mt-chip-n { background: rgba(4,17,11,.32); color: #fff; }
.ev-f-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px 12px; align-items: end; }
.ev-f-more > summary { list-style: none; cursor: pointer; font-size: 13px; font-weight: 600; color: var(--color-primary); display: none; align-items: center; gap: 5px; } .ev-f-more > summary::-webkit-details-marker { display: none; }
.ev-f-more[open] > .ev-f-row { margin-top: 8px; }
@media (max-width: 640px) { .ev-f-more > summary { display: inline-flex; } .ev-f-more:not([open]) { margin-top: -4px; } }
.ev-f .form-label { font-size: 12px; margin-bottom: 3px; } .ev-f .form-control { padding-block: 7px; font-size: 13.5px; } .ev-f-q { grid-column: span 2; } .ev-f-acts { display: flex; gap: 10px; align-items: center; padding-bottom: 2px; }
.ev-list-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; margin-bottom: 8px; } .ev-count { margin: 0; }
.ev-bulk { display: flex !important; flex-wrap: wrap; align-items: center; gap: 8px 14px; background: transparent; color: var(--color-text); padding: 0; }
.ev-bulk .btn-sm { background: var(--color-primary); color: #fff; border-color: var(--color-primary); } .ev-bulk .btn-sm:disabled { opacity: .5; } .ev-select-all { margin: 0; font-size: 13px; }
.ev-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ev-item { display: grid; grid-template-columns: 22px 64px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 14px 10px 12px; border: 1px solid var(--color-border); border-radius: 14px; background: #fff; }
.ev-item.is-pending { border-inline-start: 3px solid var(--color-warning); } .ev-item.is-replaced { opacity: .75; } .ev-item.is-open { border-color: var(--color-primary); box-shadow: 0 0 0 2px var(--color-primary-light); }
.ev-pick { display: flex; justify-content: center; } .ev-pick input { width: 16px; height: 16px; }
.ev-thumb { width: 64px; height: 64px; padding: 0; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-surface-alt); display: flex; align-items: center; justify-content: center; overflow: hidden; cursor: pointer; }
.ev-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; } .ev-thumb:hover { border-color: var(--color-primary); } .ev-thumb .ev-type { font-size: 12px; padding: 5px 9px; }
.ev-main { min-width: 0; }
.ev-name-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; }
.ev-name { padding: 0; border: 0; background: none; font: inherit; font-weight: 650; color: var(--color-ink); text-align: start; cursor: pointer; overflow-wrap: anywhere; } .ev-name:hover { text-decoration: underline; color: var(--color-primary); }
.ev-fig { margin: 3px 0 0; font-size: 13px; color: #273246; overflow-wrap: anywhere; } .ev-fig a { color: inherit; text-decoration: none; } .ev-fig a:hover { text-decoration: underline; }
.ev-val { display: inline-block; margin-inline-start: 6px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ev-rec-st { display: inline-block; margin-inline-start: 6px; padding: 1px 7px; border-radius: 999px; font-size: 11.5px; font-weight: 600; background: #eef2f6; color: #374151; }
.ev-rec-st.is-submitted, .ev-rec-st.is-under_review, .ev-rec-st.is-calculated { background: #fff4e0; color: #7a4a00; } .ev-rec-st.is-approved { background: #e7f4ed; color: #0b5737; } .ev-rec-st.is-rejected { background: #fde8e8; color: #9b1c1c; }
.ev-meta { margin: 3px 0 0; font-size: 12.5px; color: var(--color-text-muted); overflow-wrap: anywhere; }
.ev-acts { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
/* the panel */
.ev-panel { position: fixed; inset-block: 0; inset-inline-end: 0; width: min(760px, 100vw); background: #fff; box-shadow: -8px 0 30px rgba(15, 23, 42, .18); z-index: 1200; display: flex; flex-direction: column; padding-top: env(safe-area-inset-top, 0px); }
.ev-panel[hidden] { display: none; } .ev-panel-back { position: fixed; inset: 0; background: rgba(11, 18, 32, .35); z-index: 1199; } .ev-panel-back[hidden] { display: none; }
.ev-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--color-border); }
.ev-panel-title { display: flex; align-items: center; gap: 8px; min-width: 0; } .ev-panel-name { font-size: 15px; margin: 0; overflow-wrap: anywhere; }
.ev-panel-nav { display: flex; align-items: center; gap: 6px; flex: none; } .ev-panel-nav .btn { min-width: 34px; }
.ev-panel-body { overflow-y: auto; padding: 14px 16px 20px; display: grid; gap: 4px; align-content: start; }
.ev-stage { min-height: 260px; } .ev-stage .rv-pdf { height: clamp(360px, 56vh, 700px); } .ev-stage.rv-stage-img img { max-height: 56vh; }
.ev-panel-facts { margin-top: 10px; }
.ev-decide { margin-top: 12px; padding: 12px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-alt); } .ev-decide[hidden] { display: none; } .ev-decide .form-label { margin-bottom: 4px; }
body.ev-panel-open { overflow: hidden; }
.evr-fig .rv-sum-list { gap: 8px 22px; } .evr-decide { border-top: 3px solid var(--color-primary); } .evr-btns { display: flex; flex-wrap: wrap; gap: 8px; }
@media (max-width: 900px) {
  .ev-item { grid-template-columns: 22px 52px minmax(0, 1fr); } .ev-thumb { width: 52px; height: 52px; } .ev-acts { grid-column: 2 / -1; justify-content: flex-start; }
  .ev-f-q { grid-column: span 1; }
}
@media (max-width: 640px) { .ev-item { padding: 10px; gap: 8px; } .ev-panel { width: 100vw; } .ev-panel-nav .btn { min-width: 30px; padding-inline: 8px; } .ev-stage .rv-pdf { height: 50vh; } }

/* ---------- update 107: the dashboard's figures say what they count ---------- */
.dc-head { display: flex; gap: 12px; align-items: center; margin-bottom: 10px; }
.dc-head .text-sm { line-height: 1.5; }
.dc-row { display: block; padding: 6px 8px; margin: 0 -8px 2px; border-radius: 10px; color: inherit; text-decoration: none; }
.dc-row:hover, .dc-row:focus-visible { background: var(--color-surface-alt); }
.dc-row-top { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; margin-bottom: 5px; }
.dc-row .env-ws-meter { display: block; }
.dl-sum { margin: 10px 0 0; color: var(--color-text-muted); }
.dq-how { margin-top: 10px; font-size: 13px; }
.dq-how summary { cursor: pointer; font-weight: 600; color: var(--color-primary); }
.dq-how dl { margin: 8px 0 6px; } .dq-how dt { font-weight: 600; margin-top: 6px; } .dq-how dd { margin: 0; color: var(--color-text-muted); }
#dataQualityDetail:focus { outline: none; box-shadow: 0 0 0 3px var(--color-primary-light); }
.env-next-hint { margin: -4px 0 12px; font-size: 12.5px; color: var(--color-text-muted); }
.env-unusual { margin: 10px 0 0; padding: 10px 12px; border-radius: 10px; background: #fff7e6; border: 1px solid #f0c36d; color: #6b4300; font-size: 13.5px; line-height: 1.45; }
/* errors at the field they are about (update 107) */
.field-error { margin: 5px 0 0; font-size: 12.5px; font-weight: 600; color: #b3261e; line-height: 1.4; }
.field-error::before { content: "⚠ "; }
.form-control.is-invalid, select.is-invalid, textarea.is-invalid, input.is-invalid { border-color: #b3261e !important; box-shadow: 0 0 0 3px rgba(179, 38, 30, .14); }
input[type=radio].is-invalid, input[type=checkbox].is-invalid { outline: 2px solid #b3261e; outline-offset: 2px; }
td > .field-error { font-size: 11.5px; }
/* ---------- update 108: where a workspace's figures are used ---------- */
.env-cell-na { background: repeating-linear-gradient(135deg, #eef1f0 0 3px, #dfe5e2 3px 6px); border-color: #cfd8d4 !important; }
.env-where { margin-top: 12px; border-top: 1px solid var(--color-border); padding-top: 10px; font-size: 13.5px; }
.env-where > summary { cursor: pointer; font-weight: 600; color: var(--color-primary); display: inline-flex; align-items: center; gap: 6px; }
.env-where-form { margin-top: 10px; } .env-where-form .form-check { margin: 4px 0 0; }
.env-where-why { display: block; margin: 0 0 4px 24px; font-size: 12px; color: var(--color-text-muted); }
.env-where-list { margin: 8px 0 0; padding-left: 18px; } .env-where-list .env-where-why { margin-left: 0; display: inline; }
/* on a phone the workspace summary is a strip to swipe, so the form is near the top (update 108) */
@media (max-width: 640px) {
  .page-content > .env-kpis { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px; padding: 2px 2px 8px; margin-bottom: 12px; -webkit-overflow-scrolling: touch; }
  .page-content > .env-kpis > .env-kpi { flex: 0 0 64%; scroll-snap-align: start; }
}
/* technical terms explained beside their labels (update 108) */
.term-q { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin-inline-start: 4px; padding: 0; border-radius: 50%;
  border: 1px solid rgba(15, 110, 70, .45); background: #fff; color: var(--color-primary); font-size: 12px; font-weight: 700; line-height: 1; cursor: pointer; vertical-align: middle; }
.term-q:hover, .term-q[aria-expanded="true"] { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.term-q:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
label.has-term, legend.has-term { display: inline-block; }
.term-def { margin: 6px 0 10px; padding: 8px 11px; border-radius: 9px; background: var(--color-surface-alt); border: 1px solid var(--color-border); font-size: 12.5px; line-height: 1.5; color: var(--color-text); max-width: 640px; }
.env-preview-item .term-def, .env-kpi .term-def { font-size: 12px; margin: 6px 0 0; }

/* ---- Investor presentation (update 116) ---- */
.pz-layout { display: grid; grid-template-columns: minmax(360px, 480px) minmax(0, 1fr); gap: 16px; align-items: start; }
.pz-top { display: grid; grid-template-columns: minmax(0, 1fr) 200px; gap: 10px 12px; align-items: end; } .pz-top .form-group { margin-bottom: 0; } .pz-check { grid-column: 1 / -1; } .pz-check label { display: inline-flex; gap: 8px; align-items: center; font-size: 13.5px; }
.pz-list { list-style: none; margin: 10px 0 8px; padding: 0; display: grid; gap: 6px; counter-reset: pz; }
.pz-item { border: 1px solid var(--color-border); border-radius: 12px; background: #fff; padding: 8px 10px; counter-increment: pz; }
.pz-item.is-off { background: #f2f4f6; border-style: dashed; } .pz-item.is-off .pz-kind { text-decoration: line-through; color: #4b5563; }
.pz-item.is-nodata { border-color: #e8c07a; background: #fffaf0; }
.pz-row { display: grid; grid-template-columns: auto auto minmax(90px, 128px) minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.pz-row::before { content: counter(pz); font-size: 11px; color: var(--color-text-muted); min-width: 16px; text-align: end; }
.pz-on input { width: 16px; height: 16px; margin: 0; vertical-align: middle; } .pz-on { display: inline-flex; align-items: center; }
.pz-kind { font-size: 12.5px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pz-title { font-size: 13px; padding: 5px 8px; min-width: 0; }
.pz-move { display: inline-flex; gap: 3px; } .pz-move .btn-sm { padding: 2px 7px; min-width: 26px; line-height: 1.4; }
.pz-note { margin: 6px 0 0 28px; color: #7a4b00; display: flex; gap: 5px; align-items: center; }
.pz-body { margin: 6px 0 0 28px; width: calc(100% - 28px); font-size: 12.5px; padding: 5px 8px; }
.pz-add { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--color-border); }
.pz-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.pz-preview { position: sticky; top: 12px; } .pz-frame { width: 100%; aspect-ratio: 16 / 10; min-height: 420px; border: 1px solid var(--color-border); border-radius: 10px; background: #e9ecef; }
.pz-start .pz-new .form-group { max-width: 440px; }
.pz-decks { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; } .pz-decks li { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 6px 0; border-bottom: 1px solid var(--color-border); } .pz-decks li a:first-child { font-weight: 650; }
.pz-h3 { font-size: 14px; margin: 10px 0 6px; } .pz-needs { margin: 0 0 10px; padding-inline-start: 18px; } .pz-needs li { margin: 2px 0; }
@media (max-width: 980px) { .pz-layout { grid-template-columns: 1fr; } .pz-preview { position: static; } .pz-top { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .pz-row { grid-template-columns: auto auto auto minmax(0, 1fr); } .pz-move { grid-column: 1 / -1; justify-content: flex-end; } .pz-body, .pz-note { margin-inline-start: 0; width: 100%; } }

/* ---- ESG registers (update 117) ---- */
.esgr-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin: 0 0 14px; }
.esgr-tab { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; border: 1px solid var(--color-border); background: #fff; color: var(--color-text); font-size: 13.5px; text-decoration: none; }
.esgr-tab.is-on { background: var(--color-primary); border-color: var(--color-primary); color: #fff; } .esgr-tab:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.esgr-n { font-size: 11.5px; padding: 1px 7px; border-radius: 999px; background: rgba(0, 0, 0, .08); } .esgr-tab.is-on .esgr-n { background: rgba(255, 255, 255, .22); }
.esgr-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 14px; } .esgr-wide { grid-column: 1 / -1; } .esgr-check label { display: inline-flex; gap: 8px; align-items: center; font-size: 13.5px; }
.esgr-err { color: #b42318; margin: 4px 0 0; } .form-control[aria-invalid="true"] { border-color: #b42318; }
.esgr-table td, .esgr-table th { vertical-align: top; } .esgr-acts { white-space: nowrap; text-align: end; } .esgr-acts form.inline { display: inline; }
.esgr-status, .esgr-dir { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 650; background: #eef1f4; color: #273246; }
.esgr-status.is-validated, .esgr-status.is-achieved, .esgr-dir.is-up { background: #dff3e8; color: #0f6e46; } .esgr-status.is-withdrawn, .esgr-dir.is-down { background: #fdeceb; color: #b42318; } .esgr-status.is-in_progress, .esgr-status.is-committed { background: #e6f0fb; color: #1d4e89; }
@media (max-width: 760px) { .esgr-grid { grid-template-columns: 1fr; } }
/* Where an imported figure came from: the file, sheet and cell, or the rows it was worked out from (update 124) */
.cit { font-size: 12.5px; color: #374151; overflow-wrap: anywhere; } .cit svg { vertical-align: -2px; color: #667085; } .cit a { color: var(--color-primary); }
.cit-q { color: #667085; } .cit-how, .cit-parts { display: block; color: #667085; font-size: 12px; margin-top: 2px; }
.cit-hash { display: block; color: #667085; font-size: 11.5px; margin-top: 2px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.cit-changed { display: inline-block; margin-inline-start: 4px; padding: 1px 7px; border-radius: 999px; background: #fff4e0; color: #7a4a00; font-weight: 700; font-size: 11.5px; }
.cit-line { margin-top: 3px; } .cit-block + .cit-block { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--color-border); }
.imp-sheet .form-group { min-width: 220px; }
table.data-table.imp-cells th.ta-r { text-align: right; }
table.data-table.imp-cells tbody th { position: static; text-transform: none; letter-spacing: 0; font-size: 12.5px; font-weight: 600; color: var(--color-text); background: transparent; font-variant-numeric: tabular-nums; }
table.data-table.imp-cells tbody th a { color: var(--color-primary); }
table.data-table.imp-cells td:last-child { white-space: normal; min-width: 180px; }

/* ---------- joining a team (update 125): the invitation, the welcome, invitations on Team & Roles ---------- */
.inv-card { width: 100%; max-width: 1000px; display: grid; grid-template-columns: 1.08fr .92fr; background: #fff; border-radius: 24px; overflow: hidden;
  border: 1px solid rgba(255,255,255,.4); box-shadow: 0 40px 100px rgba(0, 0, 0, .45); }
.inv-about { position: relative; isolation: isolate; padding: 36px 40px 30px; color: var(--t-on-dark); background: linear-gradient(165deg, #0a1f17, #04110b 70%); }
.inv-about::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .55; background-image: var(--t-grid); background-size: 44px 44px;
  -webkit-mask-image: linear-gradient(180deg, #000, transparent 55%); mask-image: linear-gradient(180deg, #000, transparent 55%); }
.inv-about::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(380px 220px at 0% 0%, rgba(26, 155, 98, .38), transparent 70%); }
.inv-brand { color: var(--t-on-dark); margin-bottom: 28px; } .inv-brand .dot { background: var(--t-mint); }
.inv-company { display: flex; align-items: center; gap: 10px; margin: 0 0 22px; font-weight: 650; font-size: 15px; }
.inv-mono { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; font-weight: 750; font-size: 16px;
  background: linear-gradient(135deg, #1a9b62, #0b5737); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.2); }
.inv-by { margin: 0; color: var(--t-on-dark-2); font-size: 14.5px; }
.inv-role { font-family: var(--font-serif, Georgia, serif); font-weight: 500; font-size: 40px; line-height: 1.1; letter-spacing: -.01em; margin: 6px 0 4px; color: #fff; overflow-wrap: anywhere; }
.inv-title { margin: 0 0 4px; color: var(--t-mint-2); font-size: 15.5px; font-weight: 600; }
.inv-note { margin: 22px 0 0; padding: 14px 16px; border-left: 3px solid var(--t-mint); border-radius: 0 12px 12px 0; background: rgba(255,255,255,.06); }
.inv-note blockquote { margin: 0; font-family: var(--font-serif, Georgia, serif); font-size: 16px; line-height: 1.5; color: #f3fbf7; overflow-wrap: anywhere; }
.inv-note figcaption { margin-top: 8px; font-size: 13px; color: var(--t-on-dark-2); }
.inv-h { margin: 26px 0 8px; font-size: 13px; font-weight: 700; color: var(--t-mint-2); letter-spacing: 0; }
.inv-lead { margin: 0 0 10px; line-height: 1.55; color: var(--t-on-dark); font-size: 14.5px; }
.inv-how { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.inv-how li { display: grid; grid-template-columns: 18px 1fr; gap: 8px; font-size: 14px; line-height: 1.45; }
.inv-how li svg { margin-top: 3px; color: var(--t-mint); }
.inv-secs { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.inv-secs li { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 8px 12px; border-radius: 10px; background: rgba(255,255,255,.06); font-size: 14px; }
.inv-due { font-size: 12.5px; color: var(--t-mint-2); white-space: nowrap; }
.inv-meta { margin: 26px 0 0; font-size: 12.5px; color: var(--t-on-dark-2); overflow-wrap: anywhere; } .inv-meta svg { vertical-align: -2px; margin-inline-end: 4px; }
.inv-form { padding: 40px 40px 32px; display: flex; flex-direction: column; justify-content: center; }
.inv-form-title { font-size: 22px; margin: 0 0 4px; }
.inv-email { padding: 9px 12px; border-radius: 10px; background: var(--color-surface-alt); border: 1px solid var(--color-border); font-size: 14px; overflow-wrap: anywhere; }
.inv-terms { display: grid; grid-template-columns: 18px 1fr; gap: 8px; align-items: start; } .inv-terms input { margin-top: 3px; }
.inv-or { display: flex; align-items: center; gap: 10px; margin: 16px 0; color: var(--color-text-muted); font-size: 12.5px; }
.inv-or::before, .inv-or::after { content: ""; flex: 1; height: 1px; background: var(--color-border); }
.inv-h1 { font-size: 22px; margin: 18px 0 8px; }
.inv-state { width: 60px; height: 60px; margin: 14px 0 0; border-radius: 18px; display: flex; align-items: center; justify-content: center; background: var(--color-primary-light); color: var(--color-primary); }
.inv-state.is-bad { background: #fdecec; color: #9b1c1c; }
.inv-signup h2 { margin-top: 14px; }
.inv-about .inv-company, .inv-about .inv-mono { color: #fff; }
@media (max-width: 860px) {
  .inv-card { grid-template-columns: 1fr; border-radius: 20px; }
  .inv-about { padding: 26px 22px 22px; } .inv-form { padding: 26px 22px 26px; }
  .inv-role { font-size: 32px; } .inv-brand { margin-bottom: 18px; }
}

.wel-page { background: var(--color-bg); }
.wel-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; width: 100%; max-width: 1128px; margin: 0 auto; padding: 22px 24px; box-sizing: border-box; }
.wel-who { font-size: 13.5px; color: var(--color-text-muted); display: flex; gap: 12px; align-items: center; }
.wel-who a { color: var(--color-primary); }
.wel-main { width: 100%; max-width: 1080px; margin: 0 auto; padding: 4px 24px 56px; }
.wel-hero { position: relative; isolation: isolate; overflow: hidden; padding: 32px 36px; border-radius: 22px; color: var(--t-on-dark); background: var(--t-hero); margin-bottom: 18px; }
.wel-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5; background-image: var(--t-grid); background-size: 44px 44px; -webkit-mask-image: linear-gradient(90deg, #000, transparent 70%); mask-image: linear-gradient(90deg, #000, transparent 70%); }
.wel-hero .inv-company { color: #fff; margin-bottom: 14px; }
.wel-hero h1 { font-family: var(--font-serif, Georgia, serif); font-weight: 500; font-size: 38px; line-height: 1.12; margin: 0 0 8px; color: #fff; letter-spacing: -.01em; }
.wel-sub { margin: 0; font-size: 15.5px; color: var(--t-on-dark); max-width: 70ch; } .wel-sub strong { color: #fff; }
.wel-note { max-width: 680px; }
.wel-hero .alert { margin: 16px 0 0; max-width: 680px; }
.wel-grid { display: grid; grid-template-columns: 1.45fr 1fr; gap: 18px; align-items: start; }
.wel-col { display: grid; gap: 18px; min-width: 0; }
.wel-card { background: #fff; border: 1px solid var(--color-border); border-radius: 18px; padding: 20px 22px; box-shadow: var(--shadow-sm); }
.wel-card h2 { font-size: 16px; margin: 0 0 10px; }
.wel-card p { margin: 0 0 10px; line-height: 1.55; font-size: 14.5px; }
.wel-card .inv-how li svg { color: var(--color-primary); }
.wel-card .inv-secs li { background: var(--color-surface-alt); border: 1px solid var(--color-border); }
.wel-card .inv-due { color: var(--color-primary-dark); }
.wel-start { border-color: rgba(15, 110, 70, .35); box-shadow: 0 0 0 4px rgba(79, 214, 140, .12); }
.wel-tasks { margin: 0; padding: 0; list-style: none; counter-reset: wt; display: grid; gap: 8px; }
.wel-tasks li { counter-increment: wt; display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: 12px; }
.wel-tasks li::before { content: counter(wt); width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 700; background: var(--color-primary-light); color: var(--color-primary-dark); }
.wel-tasks a { color: var(--color-text); text-decoration: none; min-width: 0; } .wel-tasks a:hover strong, .wel-tasks a:focus-visible strong { text-decoration: underline; }
.wel-tasks a span { display: block; font-size: 12.5px; color: var(--color-text-muted); }
.wel-when { font-size: 12px; color: var(--color-text-muted); white-space: nowrap; } .wel-when.is-now { color: #8a3b00; font-weight: 650; }
.wel-meter { height: 8px; border-radius: 999px; background: #e9eef2; overflow: hidden; margin: 2px 0 12px; } .wel-meter span { display: block; height: 100%; background: var(--color-primary); border-radius: 999px; }
.wel-fs { border: 0; padding: 0; margin: 0 0 12px; } .wel-fs legend { font-size: 13px; font-weight: 650; margin-bottom: 6px; padding: 0; }
.wel-opt { display: grid; grid-template-columns: 18px 1fr; gap: 8px; align-items: start; font-size: 13.5px; margin-bottom: 6px; line-height: 1.4; } .wel-opt input { margin-top: 2px; }
.wel-people { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.wel-people li { display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: start; font-size: 14px; overflow-wrap: anywhere; }
.wel-go { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; margin-top: 22px; }
@media (max-width: 860px) {
  .wel-grid { grid-template-columns: 1fr; }
  .wel-main { padding: 0 16px 40px; } .wel-top { padding: 16px; } .wel-hero { padding: 24px 20px; border-radius: 18px; } .wel-hero h1 { font-size: 30px; }
  .wel-tasks li { grid-template-columns: 28px 1fr; } .wel-when { grid-column: 2; }
  .wel-go { justify-content: stretch; } .wel-go .btn { flex: 1 1 100%; justify-content: center; }
}

.inv-rows { list-style: none; margin: 0; padding: 0; }
.inv-row { padding: 14px 4px; border-top: 1px solid var(--color-border); scroll-margin-top: 90px; }
.inv-row:first-child { border-top: 0; }
.inv-row.is-just { background: linear-gradient(90deg, rgba(79, 214, 140, .12), transparent 70%); border-radius: 12px; padding: 14px 12px; }
.inv-row-main { display: flex; justify-content: space-between; gap: 10px 18px; flex-wrap: wrap; align-items: flex-start; }
.inv-row-main .tm-person { min-width: 0; } .inv-row-main .tm-person > div { min-width: 0; overflow-wrap: anywhere; }
.inv-facts { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: flex-end; color: var(--color-text-muted); max-width: 560px; }
.inv-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; background: #eef2f5; color: #3f4a59; font-weight: 600; }
.inv-chip.is-ok { background: #e7f4ed; color: #0b5737; } .inv-chip.is-bad { background: #fdecec; color: #9b1c1c; } .inv-chip.is-warn { background: #fff4e0; color: #7a4a00; }
.inv-row-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; align-items: flex-start; }
.inv-row-acts form { margin: 0; }
.inv-more > summary { list-style: none; cursor: pointer; } .inv-more > summary::-webkit-details-marker { display: none; }
.inv-more[open] { flex-basis: 100%; order: 5; } .inv-more[open] > summary { background: var(--color-primary-light); border-color: rgba(15, 110, 70, .35); }
.inv-panel { margin-top: 10px; padding: 14px 16px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface-alt); max-width: 680px; }
.inv-panel .form-group:last-of-type { margin-bottom: 12px; }
.inv-copy { display: flex; gap: 8px; } .inv-copy input { flex: 1; min-width: 0; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12.5px; }
.inv-copy .btn.is-copied { background: var(--color-primary-dark); }
.inv-share { display: flex; gap: 8px; flex-wrap: wrap; margin: 6px 0 8px; }
.inv-status { min-height: 1em; margin: 6px 0 0; }
.inv-modal { max-width: 560px; }
.inv-sections { margin-top: 4px; border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 14px; }
.inv-sections > summary { cursor: pointer; font-weight: 650; font-size: 13.5px; }
.inv-pillar { border: 0; margin: 8px 0 0; padding: 0; } .inv-pillar legend { font-size: 12.5px; font-weight: 700; color: var(--color-text-muted); padding: 0; margin-bottom: 4px; }
.inv-sec { display: grid; grid-template-columns: 18px 1fr; gap: 8px; align-items: start; font-size: 13.5px; margin-bottom: 4px; } .inv-sec input { margin-top: 3px; }
@media (max-width: 640px) { .inv-facts { justify-content: flex-start; } .inv-copy { flex-direction: column; } }
/* choosing the organisation at sign-in: one address, several organisations (update 125) */
.login-orgs { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 8px; }
.login-org { width: 100%; display: grid; grid-template-columns: 34px 1fr 16px; gap: 12px; align-items: center; padding: 12px 14px; text-align: start; cursor: pointer;
  background: #fff; border: 1px solid var(--color-border); border-radius: 12px; font: inherit; color: var(--color-text); transition: border-color .15s, background-color .15s; }
.login-org:hover { border-color: var(--color-primary); background: #f5fbf8; }
.login-org:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.login-org > svg { color: var(--color-text-muted); }
.login-org-text { display: grid; gap: 1px; min-width: 0; } .login-org-text strong { overflow-wrap: anywhere; }
.login-org-text span { font-size: 12.5px; color: var(--color-text-muted); } .login-org-text span:empty { display: none; }
.login-org.is-off .inv-mono { background: #8a948f; }
@media (prefers-reduced-motion: reduce) { .login-org { transition: none; } }
/* a consultant's offer from a client (update 125) */
.ca-offer-co { margin: 18px 0 6px; }
.ca-offer-note { margin: 12px 0 0; padding: 10px 14px; border-left: 3px solid var(--color-primary); border-radius: 0 10px 10px 0; background: #f4f8f6; }
.ca-offer-note blockquote { margin: 0; font-size: 14px; line-height: 1.5; color: var(--color-text); overflow-wrap: anywhere; }
.inv-meta.ca-offer-meta { margin: 12px 0 0; color: var(--color-text-muted); }
/* ---------- Numbers in the text (update 126) ---------- */
.tf-pick .form-group { flex: 0 1 280px; } .tf-inline { display: inline; margin: 0; }
.tf-hero .fc-mark { font-size: 26px; } .tf-hero-sub { margin: 2px 0 0; color: var(--color-text-muted); max-width: 90ch; } .tf-hero-ai { margin: 6px 0 0; color: #93370d; display: flex; gap: 6px; align-items: center; }
.tf-sec { margin: 20px 0 8px; } .tf-h { font-size: 16px; margin: 0 0 4px; display: inline-flex; align-items: center; gap: 8px; }
.tf-n { font-size: 12px; font-weight: 800; min-width: 24px; text-align: center; padding: 1px 8px; border-radius: 999px; background: #eef2f6; color: #1f2d3a; } #tfD .tf-n { background: #b42318; color: #fff; } #tfU .tf-n { background: #93370d; color: #fff; }
.tf-lead { margin: 0 0 10px; font-size: 13.5px; color: var(--color-text-muted); max-width: 80ch; }
.tf-item { background: #fff; border: 1px solid #e1e6eb; border-inline-start: 5px solid #98a2b3; border-radius: 10px; padding: 11px 14px 12px; margin-bottom: 10px; min-width: 0; scroll-margin-top: 90px; }
.tf-item.tf-differs { border-inline-start-color: #b42318; } .tf-item.tf-differs.sev-medium { border-inline-start-color: #c4320a; } .tf-item.tf-differs.sev-low { border-inline-start-color: #b54708; }
.tf-item.tf-unexplained, .tf-item.is-stale { border-inline-start-color: #b54708; } .tf-item.tf-match, .tf-item.tf-marked { border-inline-start-color: #0f6e46; }
.tf-top { display: flex; gap: 6px 10px; align-items: center; flex-wrap: wrap; } .tf-verdict { font-size: 11.5px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; color: #b42318; }
.tf-unexplained .tf-verdict { color: #93370d; } .tf-match .tf-verdict, .tf-marked .tf-verdict { color: #0b6b43; } .tf-not_checked .tf-verdict { color: #475467; }
.tf-where { font-size: 12.5px; color: #475467; overflow-wrap: anywhere; min-width: 0; }
.tf-chip { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 700; padding: 1px 8px; border-radius: 999px; background: #eef2f6; color: #374151; white-space: nowrap; }
.tf-chip.is-ai { background: #efe9fb; color: #5b21b6; } .tf-chip.is-lock { background: #fdf0d5; color: #83520f; }
.tf-q { margin: 4px 0 0; font-size: 12.5px; color: var(--color-text-muted); overflow-wrap: anywhere; }
.tf-sent { margin: 8px 0; padding: 1px 0; padding-inline-start: 12px; border-inline-start: 3px solid #e1e6eb; font-size: 14.5px; line-height: 1.6; color: var(--color-text); overflow-wrap: anywhere; }
mark.tf-num { background: #fff1c2; color: inherit; padding: 1px 4px; border-radius: 4px; font-weight: 700; box-shadow: inset 0 -2px 0 #f0b429; font-variant-numeric: tabular-nums; }
.tf-differs mark.tf-num { background: #fde8e7; box-shadow: inset 0 -2px 0 #e0675e; } .tf-match mark.tf-num, .tf-marked mark.tf-num { background: #e3f3ea; box-shadow: inset 0 -2px 0 #5fb489; } .tf-not_checked mark.tf-num { background: #eef2f6; box-shadow: none; }
.tf-eq { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 4px 16px; align-items: center; background: #f8f9fb; border: 1px solid var(--color-border); border-radius: 10px; padding: 9px 14px; margin: 8px 0; }
.tf-side { min-width: 0; display: flex; flex-direction: column; gap: 1px; } .tf-k { font-size: 11.5px; color: var(--color-text-muted); }
.tf-side b { font-size: 17px; font-variant-numeric: tabular-nums; color: var(--color-ink); overflow-wrap: anywhere; } .tf-src { font-size: 12px; color: var(--color-text-muted); overflow-wrap: anywhere; }
.tf-op { font: 800 24px/1 system-ui, sans-serif; color: #b42318; } .tf-op.is-eq { color: #0f6e46; }
.tf-why { margin: 4px 0 8px; padding: 0; padding-inline-start: 18px; font-size: 13px; color: #475467; } .tf-why li { margin-bottom: 3px; } .tf-reason { margin: 4px 0 8px; font-size: 13px; color: #475467; }
.tf-mark { margin: 6px 0; font-size: 13px; background: #f1f9f4; border-radius: 6px; padding: 6px 9px; overflow-wrap: anywhere; } .tf-mark svg { vertical-align: -2px; } .tf-mark.is-stale { background: #fef6e7; color: #83520f; } .tf-who { color: var(--color-text-muted); font-size: 12px; white-space: nowrap; }
.tf-acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; margin-top: 6px; } .tf-acts form { margin: 0; } .tf-acts .an-act { margin-top: 5px; } .tf-acts .an-act[open] { flex-basis: 100%; }
.tf-form { display: grid; gap: 6px; max-width: 640px; } .tf-form .btn { justify-self: start; } .tf-form .form-label { margin: 0; font-size: 12.5px; }
.tf-rows { list-style: none; padding: 0; margin: 8px 0 0; display: grid; gap: 6px; }
.tf-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 14px; align-items: start; background: #fff; border: 1px solid var(--color-border); border-inline-start: 4px solid #d5dce3; border-radius: 10px; padding: 8px 12px; min-width: 0; scroll-margin-top: 90px; }
.tf-row.tf-unexplained { border-inline-start-color: #b54708; } .tf-row.tf-match, .tf-row.tf-marked { border-inline-start-color: #5fb489; } .tf-row.tf-differs { border-inline-start-color: #b42318; }
.tf-row .tf-sent { border: 0; padding: 0; margin: 0; font-size: 13.5px; line-height: 1.5; } .tf-row-main { min-width: 0; }
.tf-row-meta { margin: 3px 0 0; font-size: 12px; color: var(--color-text-muted); display: flex; gap: 4px 8px; flex-wrap: wrap; align-items: center; overflow-wrap: anywhere; }
.tf-row-fig { margin: 3px 0 0; font-size: 12.5px; color: #374151; overflow-wrap: anywhere; } .tf-row-fig b { font-variant-numeric: tabular-nums; }
.tf-row > .tf-acts { margin-top: 0; justify-content: flex-end; max-width: 380px; } .tf-row > .tf-acts .an-act[open] { flex-basis: auto; } .tf-row-card { list-style: none; } .tf-row-card .tf-item { margin: 0; }
.tf-more > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 8px; } .tf-more > summary::-webkit-details-marker { display: none; }
.tf-more > summary::before { content: ''; width: 7px; height: 7px; border: solid #475467; border-width: 0 2px 2px 0; transform: rotate(-45deg); transition: transform .15s; flex: 0 0 auto; } .tf-more[open] > summary::before { transform: rotate(45deg); }
[dir="rtl"] .tf-more > summary::before { transform: rotate(135deg); } [dir="rtl"] .tf-more[open] > summary::before { transform: rotate(45deg); }
.tf-more > summary:focus-visible { outline: 3px solid var(--color-primary); outline-offset: 2px; border-radius: 6px; } .tf-figs summary { cursor: pointer; } .tf-num-cell { font-variant-numeric: tabular-nums; white-space: nowrap; }
.tf-item:target, .tf-row:target { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.brsr-question-block:target { outline: 2px solid var(--color-primary); outline-offset: 4px; border-radius: 8px; } .brsr-question-block[id^="q-"] { scroll-margin-top: 90px; }
@media (prefers-reduced-motion: no-preference) { .tf-item:target, .tf-row:target, .brsr-question-block:target { animation: tf-arrive 1.6s ease-out 1; } }
@keyframes tf-arrive { from { box-shadow: 0 0 0 4px rgba(240, 180, 41, .55); } to { box-shadow: 0 0 0 0 rgba(240, 180, 41, 0); } }
.rb-tf { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 8px; align-items: start; margin: 8px 0 0; padding: 8px 10px; border-radius: 8px; font-size: 13px; line-height: 1.45; background: #f1f9f4; border: 1px solid #b7e0c8; } .rb-tf.is-off { background: #fef6f5; border-color: #f4c7c3; }
.rb-tf > svg { margin-top: 2px; } .rb-tf .btn { grid-column: 2; justify-self: start; }
/* ---------- Report builder: tables and charts from data — the list of figures a block shows (update 129) ---------- */
.rb-fset { border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 10px 4px; margin: 0 0 10px; min-width: 0; } .rb-fset legend { font-size: 12px; font-weight: 600; padding: 0 4px; }
.rb-itemlist { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 6px; counter-reset: rbit; }
.rb-itemlist li { border: 1px solid var(--color-border); border-radius: 10px; padding: 6px 8px; background: #fff; display: grid; gap: 4px; counter-increment: rbit; }
.rb-item-h { font-size: 12.5px; line-height: 1.35; } .rb-item-h::before { content: counter(rbit) ". "; font-weight: 700; color: var(--color-text-muted); }
.rb-item-h small { display: block; color: var(--color-text-muted); font-size: 11.5px; }
.rb-item-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; gap: 4px; align-items: center; }
.rb-item-row .rb-btn { min-width: 30px; min-height: 30px; }
/* ---------- Report builder: when a block prints, chapters that repeat (update 130) ---------- */
.rb-item.is-rep, .rb-item.is-rep-head { box-shadow: inset 4px 0 0 #7cc4a0; } .rb-item.is-rep { margin-inline-start: 14px; }
[dir="rtl"] .rb-item.is-rep, [dir="rtl"] .rb-item.is-rep-head { box-shadow: inset -4px 0 0 #7cc4a0; }
.rb-txt small.rb-cond { white-space: normal; color: #0b5737; font-weight: 600; margin-top: 1px; }
.rb-rules { display: grid; gap: 6px; } .rb-rules > p { margin: 0; }
.rb-rule { border: 1px dashed #b9c4cf; border-radius: 10px; padding: 8px; display: grid; gap: 6px; background: #fff; }
.rb-rule-cmp { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
.rb-rule .rb-del { justify-self: start; height: auto; min-height: 28px; }
.rb-rules > .rb-btn { justify-self: start; height: auto; min-height: 30px; padding: 4px 10px; }
@container rblist (max-width: 380px) { .rb-rule-cmp { grid-template-columns: minmax(0, 1fr); } .rb-item.is-rep { margin-inline-start: 6px; } }
/* ---------- Report builder: the pages — the PDF itself, in the preview (update 131) ---------- */
.rb-prev-head { gap: 10px; flex-wrap: wrap; }
.rb-prev-mode { display: inline-flex; border: 1px solid var(--color-border); border-radius: 9px; overflow: hidden; }
.rb-prev-mode .rb-btn { border: 0; border-radius: 0; min-height: 30px; padding: 4px 12px; background: #fff; color: #273246; }
.rb-prev-mode .rb-btn + .rb-btn { border-inline-start: 1px solid var(--color-border); }
.rb-prev-mode .rb-btn[aria-pressed="true"] { background: var(--color-primary); color: #fff; }
.rb-pages-meta { margin: 0 0 6px; font-size: 12px; color: var(--color-text-muted); } .rb-pages-meta.is-err { color: #b42318; font-weight: 600; } .rb-pages-meta.is-warn { color: #8a5a00; }
.rb-pages-frame { height: calc(100vh - var(--topbar-height) - 170px); min-height: 520px; border: 1px solid var(--color-border); border-radius: 12px; background: #e9edf0; overflow: hidden; position: relative; }
.rb-pages.is-busy .rb-pages-frame::after { content: "Drawing the pages…"; position: absolute; inset-block-end: 12px; inset-inline-end: 12px; background: rgba(11, 18, 32, .84); color: #fff; font-size: 12px; padding: 5px 10px; border-radius: 8px; }
.rb-pdf { display: block; width: 100%; height: 100%; border: 0; } .rb-pdf-fallback { padding: 28px 18px; text-align: center; font-size: 13px; }
.rb-pages-notes { margin-top: 8px; font-size: 12.5px; } .rb-pages-notes summary { cursor: pointer; font-weight: 600; } .rb-pages-notes ul { margin: 6px 0 0; padding-inline-start: 18px; }
.rb-pg { display: inline-block; width: fit-content; margin-top: 3px; border: 1px solid #c9d3dc; background: #fff; border-radius: 6px; font-size: 11px; line-height: 1.5; padding: 0 6px; color: #273246; cursor: pointer; }
.rb-pg:hover, .rb-pg:focus-visible { border-color: var(--color-primary); color: var(--color-primary-dark); } .is-pg-stale .rb-pg { opacity: .55; }
@media (max-width: 1100px) { .rb-pages-frame { height: 640px; } }
/* ---------- Report builder: named design values, the brand kit and block looks (update 133) ---------- */
.rb-values { border: 1px solid var(--color-border); border-radius: 12px; padding: 8px 12px 12px; margin: 2px 0 0; min-width: 0; }
.rb-values > legend { font-size: 13px; font-weight: 700; padding: 0 6px; }
.rb-values > p { margin: 0 0 10px; max-width: 72ch; }
.rb-values-from { display: grid; grid-template-columns: max-content minmax(0, 340px); justify-content: start; gap: 4px 10px; align-items: center; margin-bottom: 12px; }
.rb-values-from label { margin: 0 !important; } .rb-values-from p { grid-column: 1 / -1; margin: 0; }
.rb-values-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 14px; }
.rb-values.is-kit .rb-values-grid { opacity: .78; }
.rb-dv-note { margin: 4px 0 0; color: var(--color-text-muted); } .rb-dv-note:empty { display: none; } .rb-dv-note.is-warn { color: #7a4a00; font-weight: 600; }
.rb-kit-acts { display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--color-border); }
.rb-kit-acts [hidden] { display: none; } .rb-kit-acts #rbKitHelp { flex: 1 1 260px; } #rbKitState.is-ok { color: #0b5737; font-weight: 600; } #rbKitState.is-err { color: #a3180f; font-weight: 600; }
@media (max-width: 640px) { .rb-values-from { grid-template-columns: minmax(0, 1fr); } }
/* ---------- Report builder: the glossary, sources and index blocks, and the long-document tools of a text's toolbar (update 134) ---------- */
.rb-toolbar .rb-tbsel { max-width: 150px; }
.rb-entries .rb-itemlist li { counter-increment: none; }
.rb-entries textarea.form-control { min-height: 0; resize: vertical; font-size: 13px; line-height: 1.4; }
.rb-entry-st { font-size: 11.5px; color: var(--color-text-muted); }
.rb-src-key { font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace); font-size: 13px; }
.rb-entries > .rb-btn { min-height: 30px; padding: 4px 10px; }
.rb-std { border: 1px solid var(--color-border); border-radius: 10px; margin: 0 0 10px; background: #fbfcfb; }
.rb-std > summary { cursor: pointer; padding: 8px 10px; font-size: 13px; font-weight: 600; border-radius: 10px; }
.rb-std > summary:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.rb-std > p { margin: 0 10px 6px; }
.rb-std-list { list-style: none; margin: 0; padding: 0 10px; display: grid; gap: 6px; max-height: 340px; overflow: auto; }
.rb-std-list li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 8px; align-items: start; font-size: 12.5px; line-height: 1.4; }
.rb-std-list input { margin-top: 3px; } .rb-std-list label { margin: 0 !important; font-weight: 400; cursor: pointer; }
.rb-std-list label span { display: block; color: var(--color-text-muted); font-size: 12px; } .rb-std-list em { font-style: normal; font-size: 11px; font-weight: 700; color: #0b5737; }
.rb-std > .rb-btn { margin: 8px 10px 10px; min-height: 30px; padding: 4px 10px; }
/* ---------- Report builder: live values — the figure picker and the list of live values (update 128) ---------- */
.rb-flabel-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 3px; }
.rb-flabel-row label { margin-bottom: 0 !important; }
.rb-figbtn { font-size: 11.5px; padding: 2px 8px; white-space: nowrap; min-height: 24px; min-width: 24px; }
.rb-livebox { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; margin: 0 0 12px; background: #fbfcfb; display: grid; gap: 8px; }
.rb-livebox[hidden] { display: none; } .rb-livebox > p { margin: 0; }
.rb-live-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: 320px; overflow: auto; }
.rb-live-list li { border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 10px; display: grid; gap: 3px; background: #fff; }
.rb-live-list li p { margin: 0; } .rb-live-list li.is-off { border-style: dashed; background: #f6f7f8; }
.rb-live-h { display: flex; gap: 8px; align-items: baseline; flex-wrap: wrap; font-size: 13px; }
.rb-live-st { font-size: 11px; font-weight: 700; padding: 1px 8px; border-radius: 999px; background: #e7f4ed; color: #0b5737; }
.rb-live-list li.is-missing .rb-live-st, .rb-live-list li.is-unknown .rb-live-st, .rb-live-list li.is-direction .rb-live-st, .rb-live-list li.is-unreadable .rb-live-st { background: #fdeceb; color: #a3180f; }
.rb-live-list li.is-zero .rb-live-st { background: #fff4e0; color: #7a4a00; }
.rb-live-list li.is-misplaced .rb-live-st { background: #fdeceb; color: #a3180f; } .rb-live-list li.is-scoped .rb-live-st { background: #e8f1fb; color: #1d4f8a; }
.rb-live-list li.is-moved .rb-live-st, .rb-live-list li.is-options .rb-live-st { background: #fff4e0; color: #7a4a00; }
.rb-live-list code, .rb-val-prev code { font-size: 11px; word-break: break-all; }
.rb-val { display: grid; gap: 10px; }
.rb-val-tools { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 220px); gap: 8px; }
.rb-val-list { max-height: 300px; overflow: auto; border: 1px solid var(--color-border); border-radius: 10px; padding: 6px; }
.rb-val-list fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.rb-val-g { margin: 8px 4px 2px; padding: 0; font-size: 11.5px; font-weight: 700; color: var(--color-text-muted); float: none; }
.rb-val-gset { margin: 0 0 4px; }
.rb-val-opts label.is-off { color: var(--color-text-muted); }
.rb-val-item { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; align-items: start; padding: 6px 8px; border-radius: 8px; cursor: pointer; font-size: 13px; }
.rb-val-item:hover { background: #f4f7f6; } .rb-val-item:has(input:checked) { background: #e7f4ed; }
.rb-val-item small { display: block; color: var(--color-text-muted); font-size: 12px; }
.rb-val-item.is-in, .rb-val-item.is-in:hover { background: transparent; cursor: default; } .rb-val-item.is-in b { font-weight: 600; color: var(--color-text-muted); }   /* already in the table or chart (update 129) */
.rb-val-opts { border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 12px 10px; display: grid; grid-template-columns: auto minmax(0, 220px); gap: 6px 10px; align-items: center; margin: 0; min-width: 0; }
.rb-val-opts legend { font-size: 12px; font-weight: 700; padding: 0 4px; }
.rb-val-opts label:not(.rb-val-check) { font-size: 12.5px; font-weight: 600; }
.rb-val-check { grid-column: 1 / -1; display: flex; gap: 8px; align-items: center; font-size: 12.5px; font-weight: 500; }
.rb-val-prev { margin: 0; font-size: 13px; } .rb-val-prev code { margin-inline-start: 6px; }
@media (max-width: 640px) { .rb-val-tools { grid-template-columns: 1fr; } .rb-val-opts { grid-template-columns: max-content minmax(0, 1fr); } .rb-val-list { max-height: 28vh; } }   /* a shorter list and options a row each on a phone: Insert stays in view */
@media (max-width: 640px) { .tf-eq { grid-template-columns: minmax(0, 1fr); } .tf-op { justify-self: start; font-size: 20px; } .tf-row { grid-template-columns: minmax(0, 1fr); } .tf-row > .tf-acts { justify-content: flex-start; max-width: none; } }
.tf-pick-link { display: inline-block; margin-top: 5px; font-size: 13px; font-weight: 700; color: var(--color-primary); text-decoration: none; } .tf-pick-link:hover, .tf-pick-link:focus-visible { text-decoration: underline; }
.tf-pickcard { border-inline-start: 5px solid var(--color-primary); scroll-margin-top: 90px; } .tf-pickcard .tf-form { margin-top: 6px; } .tf-pickcard .tf-acts { margin-top: 2px; }
.pz-item:target { outline: 2px solid var(--color-primary); outline-offset: 2px; } .pz-item[id^="slide-"] { scroll-margin-top: 90px; }
@media (prefers-reduced-motion: no-preference) { .pz-item:target, .tf-pickcard:target { animation: tf-arrive 1.6s ease-out 1; } }
/* ---------- Report builder: comments and owners (update 135, RG-15) ---------- */
.rb-txt small.rb-own { white-space: normal; font-weight: 600; color: #374151; margin-top: 1px; }
.rb-txt small.rb-own.is-overdue { color: #a3180f; } .rb-txt small.rb-own.is-soon { color: #7a4a00; } .rb-txt small.rb-own.is-done { color: #0b5737; }
.rb-talk-btn { display: inline-flex; align-items: center; gap: 3px; } .rb-talk-btn .icon-svg { flex: none; }
.rb-talk-btn.has-open { border-color: #9cc9b2; background: #eef7f2; color: #0b5737; }
.rb-talk-btn[aria-expanded="true"] { border-color: var(--color-primary); box-shadow: inset 0 0 0 1px var(--color-primary); }
.rb-talk-n { font-size: 11px; font-weight: 800; }
.rb-talk { border-top: 1px solid var(--color-border); padding: 10px 12px 12px; display: grid; gap: 10px; background: #f8faf9; border-radius: 0 0 12px 12px; }
.rb-talk:focus { outline: none; } .rb-talk:focus-visible { outline: 2px solid var(--color-primary); outline-offset: -2px; }
.rb-editor + .rb-talk { border-radius: 0 0 12px 12px; } .rb-item:has(.rb-talk) > .rb-editor { border-radius: 0; }
.rb-talk-own { display: grid; gap: 8px; }
.rb-own-now { margin: 0; font-size: 12.5px; line-height: 1.45; } .rb-own-now small { display: block; color: var(--color-text-muted); font-size: 11.5px; }
.rb-own-now.is-overdue b { color: #a3180f; } .rb-own-done { color: #0b5737; font-weight: 600; }
.rb-own-note { display: block; margin-top: 4px; padding: 6px 8px; border-inline-start: 3px solid #c9d3dc; background: #fff; font-size: 12px; color: #273246; }
.rb-own-form { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 6px 8px; align-items: center; font-size: 12px; }
.rb-own-form label { font-weight: 600; color: #374151; } .rb-own-form .form-control { height: 32px; font-size: 12.5px; padding: 4px 8px; }
.rb-own-form [data-own-due] { max-width: 170px; }
.rb-own-form .rb-own-nl { grid-column: 1 / -1; margin-bottom: -4px; } .rb-own-form .rb-own-note-in, .rb-own-form .rb-own-acts { grid-column: 1 / -1; }
.rb-own-acts { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; } .rb-own-unsaved { font-size: 11.5px; font-weight: 600; color: #7a4a00; }
.rb-own-mark { justify-self: start; }
.rb-talk-threads { display: grid; gap: 8px; }
.rb-co-th { border: 1px solid var(--color-border); border-radius: 10px; background: #fff; padding: 8px 10px; display: grid; gap: 6px; }
.rb-co-th.is-resolved { background: #f6f7f8; } .rb-co-th.is-resolved .rb-co-body { color: #4b5563; }
.rb-co-c { display: grid; gap: 2px; } .rb-co-c + .rb-co-c { border-top: 1px dashed #dde3e8; padding-top: 6px; margin-inline-start: 14px; }
.rb-co-meta { margin: 0; font-size: 12px; display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: baseline; } .rb-co-meta > span { color: var(--color-text-muted); font-size: 11.5px; }
.rb-co-meta .rb-co-fig { color: #0b4a6f; background: #e8f3fa; border-radius: 6px; padding: 1px 6px; font-size: 11px; font-weight: 600; }
.rb-co-body { margin: 0; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.rb-co-acts { margin: 0; display: flex; flex-wrap: wrap; gap: 2px 12px; }
.rb-lnk { border: 0; background: none; padding: 2px 0; font-size: 12px; font-weight: 600; color: #0b5737; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.rb-lnk:hover { color: #073d27; } .rb-lnk-del { color: #a3180f; } .rb-lnk-del:hover { color: #7a120b; }
.rb-co-res { margin: 0; font-size: 11.5px; color: #0b5737; font-weight: 600; }
.rb-co-editf, .rb-co-replyf { display: grid; gap: 6px; } .rb-co-replyf { margin-inline-start: 14px; }
.rb-co-resolved > summary { cursor: pointer; font-size: 12px; font-weight: 600; color: #374151; padding: 2px 0; } .rb-co-resolved[open] > summary { margin-bottom: 6px; }
.rb-co-resolved { display: grid; gap: 8px; }
.rb-co-none { margin: 0; }
.rb-talk-new { display: grid; gap: 6px; } .rb-talk-new > label { font-size: 12px; font-weight: 700; color: #273246; }
.rb-talk-tools { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; font-size: 12px; }
.rb-talk-tools label { font-weight: 600; color: #374151; } .rb-talk-tools select { height: 32px; font-size: 12.5px; max-width: 260px; width: auto; padding: 4px 8px; }
.rb-talk-tools .btn { margin-inline-start: auto; }
.rb-talk-about, .rb-talk-mention { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; } .rb-talk-about[hidden] { display: none; }
.rb-co-say { margin: 0; font-size: 12px; min-height: 0; color: #0b5737; } .rb-co-say:empty { display: none; } .rb-co-say.is-err { color: #a3180f; }
.rb-co { border: 1px solid var(--color-border); border-radius: 12px; padding: 10px 12px; margin: 0 0 12px; background: #fbfcfb; display: grid; gap: 8px; }
.rb-co > p { margin: 0; }
.rb-check-sum.is-info { background: #e8f3fa; color: #0b4a6f; }
.rb-co-filters { display: flex; flex-wrap: wrap; gap: 4px; } .rb-co-filters .rb-btn[aria-pressed="true"] { border-color: var(--color-primary); background: #eef7f2; color: #0b5737; font-weight: 700; }
.rb-co-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: 240px; overflow: auto; }
.rb-co-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 8px; align-items: center; font-size: 12.5px; line-height: 1.4; padding: 6px 8px; border-radius: 8px; background: #fff; border: 1px solid #e5e9ed; }
.rb-co-list li .rb-co-where { grid-column: 1; font-size: 11.5px; font-weight: 700; color: #374151; overflow-wrap: anywhere; }
.rb-co-list li .rb-co-what { grid-column: 1; overflow-wrap: anywhere; }
.rb-co-list li > .rb-co-li-acts { grid-column: 2; grid-row: 1 / span 2; display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-end; }
.rb-co-list li.rb-co-empty { display: block; color: var(--color-text-muted); background: none; border: 0; padding: 2px 0; }
.rb-co-rn { color: var(--color-text-muted); }
@container rblist (max-width: 380px) { .rb-own-form { grid-template-columns: minmax(0, 1fr); } .rb-own-form [data-own-due] { max-width: none; } .rb-talk-tools .btn { margin-inline-start: 0; } }

/* ---------- Report builder: suggestions (update 136, RG-16) ---------- */
.rb-outline-head .rb-sug-btn { margin-inline-start: auto; display: inline-flex; align-items: center; gap: 5px; }
.rb-sug-bar { border: 1px solid #e3c98a; background: #fff8e6; border-radius: 12px; padding: 10px 12px; margin: 0 0 12px; display: grid; gap: 8px; }
.rb-sug-bar[hidden] { display: none; }
.rb-sug-say { margin: 0; font-size: 12.5px; line-height: 1.5; color: #4a3500; } .rb-sug-say b { color: #3a2a00; }
.rb-sug-row { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; font-size: 12px; }
.rb-sug-row label { font-weight: 600; color: #4a3500; } .rb-sug-row .form-control { flex: 1 1 200px; min-width: 0; height: 32px; font-size: 12.5px; padding: 4px 8px; }
body.rb-suggesting .rb-palette, body.rb-suggesting .rb-charts-cta, body.rb-suggesting #rbHelp { display: none; }   /* nothing is added or moved while suggesting */
body.rb-suggesting #rbDesign { opacity: .6; }
.rb-item.is-sug-edit { border-color: #e3c98a; box-shadow: inset 3px 0 0 #c99a2e; }
.rb-txt small.rb-sugline { white-space: normal; font-weight: 600; color: #7a5200; margin-top: 1px; } .rb-txt small.rb-sugline.is-mine { color: #8a4b00; }
.rb-talk-sug { display: grid; gap: 8px; } .rb-talk-sug:empty { display: none; }
.rb-sg { border: 1px solid #ead9ad; border-radius: 10px; background: #fffdf6; padding: 8px 10px; display: grid; gap: 6px; }
.rb-sg.is-accepted, .rb-sg.is-rejected, .rb-sg.is-withdrawn { background: #f6f7f8; border-color: var(--color-border); }
.rb-sg-note { margin: 0; padding: 4px 8px; border-inline-start: 3px solid #e3c98a; background: #fff; font-size: 12.5px; color: #273246; overflow-wrap: anywhere; }
.rb-sg-ch { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: 12.5px; line-height: 1.55; }
.rb-sg-ch li { overflow-wrap: anywhere; } .rb-sg-l { font-weight: 700; color: #374151; }
.rb-sg-txt del { color: #a3180f; background: #fde8e6; text-decoration: line-through; text-decoration-thickness: 1px; border-radius: 2px; }
.rb-sg-txt ins { color: #0b5737; background: #e3f4ea; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; border-radius: 2px; }
.rb-sg-warn { margin: 0; font-size: 12px; color: #7a120b; background: #fdecea; border-radius: 6px; padding: 4px 8px; }
.rb-sg-info { margin: 0; font-size: 12px; color: #4a3500; }
.rb-sg-res { margin: 0; font-size: 11.5px; font-weight: 600; color: #374151; } .rb-sg.is-accepted .rb-sg-res { color: #0b5737; } .rb-sg.is-rejected .rb-sg-res { color: #7a120b; }
.rb-sg-new { margin: 0; }
.rb-sg-rejbtn { color: #7a120b; border-color: #e7b7b2; }
.rb-pv-sug { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin: 0 0 8px; padding: 6px 10px; border-radius: 8px; background: #fff8e6; border: 1px solid #e3c98a; font-size: 12.5px; color: #4a3500; }
.rb-pv-sug[hidden] { display: none; }
.rb-sug-hint { margin: 0 0 10px; }
.rb-sg-past { display: grid; gap: 8px; } .rb-sg-past > summary { cursor: pointer; font-size: 12px; font-weight: 600; color: #374151; padding: 2px 0; }
.rb-sug-aside[hidden] { display: none; }
.rb-sug-aside details { display: grid; gap: 8px; border: 1px solid #e3c98a; border-radius: 8px; background: #fff; padding: 6px 10px; }
.rb-sug-aside summary { cursor: pointer; font-size: 12px; font-weight: 600; color: #4a3500; }
.rb-sug-aside-b { display: grid; gap: 4px; font-size: 12.5px; } .rb-sug-aside-b label { font-size: 11.5px; font-weight: 600; color: #4b5563; }
.rb-sug-aside-b textarea { font-size: 12.5px; resize: vertical; } .rb-sug-aside-now { font-weight: 400; color: #4b5563; }
/* ===== the content library (update 138, RG-18): the library page and the builder's "Library text" block ===== */
.rlib-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; } .rlib-meta > span:not(.rlib-state) { font-size: 13px; }   /* the header's own (light) subtitle colour */
.rlib-state { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 650; background: #eef1f4; color: #374151; white-space: nowrap; }
.rlib-state.is-approved { background: #e7f4ed; color: #0b5737; } .rlib-state.is-waiting { background: #fff4e0; color: #6b4200; }
.rlib-state.is-draft { background: #e8eef9; color: #1e3a6b; } .rlib-state.is-retired { background: #f1f3f5; color: #4f5b6b; text-decoration: line-through; text-decoration-color: rgba(79,91,107,.45); }
.rlib-counts { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.rlib-counts a { padding: 5px 12px; border-radius: 999px; border: 1px solid var(--color-border); font-size: 13px; color: #374151; text-decoration: none; background: #fff; }
.rlib-counts a b { margin-inline-start: 4px; font-variant-numeric: tabular-nums; } .rlib-counts a[aria-current="page"] { background: var(--color-primary-light); border-color: var(--color-primary); color: var(--color-primary); }
.rlib-filter { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) auto; gap: 10px; align-items: end; margin-bottom: 12px; }
.rlib-filter .form-group { margin: 0; } .rlib-filter-go { padding-bottom: 2px; }
.rlib-table td { vertical-align: top; } .rlib-name { font-weight: 650; } .rlib-sub, .rlib-ex { display: block; font-size: 12px; color: var(--color-text-muted); margin-top: 2px; }
.rlib-ex { color: #4b5563; max-width: 62ch; }
.rlib-cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; align-items: start; }
.rlib-main, .rlib-side { display: grid; gap: 16px; min-width: 0; } .rlib-main > .card, .rlib-side > .card { margin: 0; }
.rlib-tabs { margin: 4px 0 10px; }
.rlib-tabs a[aria-current="page"] { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }   /* the edition shown */
.rlib-tabs a[aria-current="page"]:hover, .rlib-tabs a[aria-current="page"]:focus { color: #fff; }
.rlib-tabs a:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.rlib-conflict { border-color: #e3c98a; background: #fffcf3; } .rlib-conflict .rlib-print { background: #fff; }
.rlib-replace { margin: 6px 0 2px; padding: 8px 10px; border-radius: 8px; background: #fff8e6; color: #4a3500; }
.rlib-print { border: 1px solid var(--color-border); border-radius: 10px; padding: 16px 20px; background: #fff; max-width: 72ch; line-height: 1.6; overflow-wrap: anywhere; box-shadow: inset 4px 0 0 var(--color-primary-light); }
.rlib-print p { margin: 0 0 8px; } .rlib-print ul, .rlib-print ol { margin: 0 0 8px; }
.rlib-ctitle { font-weight: 700; color: var(--color-primary); margin: 0 0 4px !important; }
.rlib-callout { background: #f3f8f5; border-radius: 8px; padding: 10px 12px; }
.rlib-quote { margin: 0; padding: 4px 0 4px 14px; border-inline-start: 3px solid var(--color-primary); font-style: italic; } .rlib-quote footer { font-style: normal; font-size: 13px; color: var(--color-text-muted); margin-top: 6px; }
.rlib-mark { font-size: 12px; color: #4b5563; background: #f1f3f5; border-radius: 4px; padding: 0 4px; }
.rlib-draft.is-submitted { border-color: #e3c98a; } .rlib-draft.is-editing { border-color: #c4d3ee; }
.rlib-h3 { font-size: 13.5px; margin: 14px 0 6px; } .rlib-chg { margin-bottom: 8px; } .rlib-chg > b { font-size: 12.5px; }
.rlib-acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; }
.rlib-inline { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .rlib-inline .form-control { width: min(320px, 100%); }
.rlib-inline-btn { display: inline; margin: 0; }
.rlib-four { margin: 0; color: #4a3500; background: #fff8e6; border-radius: 8px; padding: 6px 10px; }
.rlib-uses, .rlib-vers { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.rlib-uses li, .rlib-vers li { display: grid; gap: 2px; font-size: 13.5px; } .rlib-uses small, .rlib-vers small { color: var(--color-text-muted); font-size: 12px; }
.rlib-vacts { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12.5px; }
.rlib-linkbtn { background: none; border: 0; padding: 0; color: var(--color-primary); font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.rlib-linkbtn:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; border-radius: 2px; }
.rlib-made { margin: 0 4px; }
.rlib-form { display: grid; gap: 4px; max-width: 900px; }
.rlib-grid2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; }
.rlib-fs { border: 1px solid var(--color-border); border-radius: 10px; padding: 8px 12px 6px; margin: 0 0 12px; min-width: 0; } .rlib-fs legend { font-size: 13px; font-weight: 650; padding: 0 4px; }
.rlib-fs > p { margin: 0 0 6px; }
.rlib-checks { display: flex; flex-wrap: wrap; gap: 10px 18px; } .rlib-check { display: inline-flex; gap: 8px; align-items: center; font-size: 13.5px; font-weight: 500; min-height: 24px; }
.rlib-check input { width: 18px; height: 18px; margin: 0; flex: none; }   /* targets of a comfortable size, apart (WCAG 2.2 target size) */
.rlib-ta { font-size: 13.5px; line-height: 1.55; resize: vertical; }
.rlib-ed { border-top: 1px solid var(--color-border); padding: 6px 0; } .rlib-ed > summary { cursor: pointer; font-size: 13px; font-weight: 600; padding: 2px 0; }
.rlib-ed[open] > summary { margin-bottom: 6px; }
.rlib-kindnote { font-weight: 400; color: var(--color-text-muted); }
@supports selector(:has(*)) {   /* the fields of the kind chosen; without :has() every field shows, each saying which kind it is for */
  .rlib-form .rlib-only-callout, .rlib-form .rlib-only-quote { display: none; }
  .rlib-form:has(input[name="kind"][value="callout"]:checked) .rlib-only-callout { display: block; }
  .rlib-form:has(input[name="kind"][value="quote"]:checked) .rlib-only-quote { display: grid; }
  .rlib-form .rlib-kindnote { display: none; }
}
@media (max-width: 900px) { .rlib-cols { grid-template-columns: 1fr; } .rlib-filter { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .rlib-filter, .rlib-grid2 { grid-template-columns: 1fr; } .rlib-print { padding: 12px 14px; } }
/* the builder */
.rb-lib-pick { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; } .rb-lib-pick .rb-field { flex: 1 1 260px; margin-bottom: 0; } .rb-lib-pick .rb-btn { margin-bottom: 2px; }
.rb-lib-prev { margin: 8px 0; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: 10px; background: #fbfcfb; font-size: 12.5px; line-height: 1.55; max-height: 240px; overflow: auto; box-shadow: inset 3px 0 0 var(--color-primary-light); }
.rb-lib-kind { display: block; font-size: 11px; font-weight: 700; color: var(--color-text-muted); margin-bottom: 4px; }
.rb-lib-tx { white-space: pre-wrap; overflow-wrap: anywhere; } .rb-lib-ct { display: block; color: var(--color-primary); margin-bottom: 2px; }
.rb-lib-q { margin: 0; padding-inline-start: 10px; border-inline-start: 3px solid var(--color-primary); font-style: italic; white-space: pre-wrap; } .rb-lib-q footer { font-style: normal; color: var(--color-text-muted); margin-top: 4px; }
.rb-lib-note { margin: 6px 0; padding: 6px 10px; border-radius: 8px; background: #fff8e6; color: #4a3500; }
.rb-lib-acts { margin-top: 6px; flex-wrap: wrap; } .rb-lib-acts a.rb-btn { text-decoration: none; display: inline-flex; align-items: center; }
.rb-lib-save { margin-top: 6px; }
.rb-lib-body { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) !important; }
.rb-dlg-head [data-close-lib], .rb-dlg-head [data-close-libsave] { margin-inline-start: auto; }
.rb-lib-side { display: grid; gap: 8px; align-content: start; min-width: 0; }
.rb-lib-list { max-height: 52vh; overflow: auto; border: 1px solid var(--color-border); border-radius: 10px; padding: 4px; display: grid; gap: 2px; }
.rb-lib-opt { display: grid !important; grid-template-columns: auto minmax(0, 1fr); gap: 8px; padding: 8px 10px; border-radius: 8px; cursor: pointer; font-weight: 400 !important; }
.rb-lib-opt:hover { background: #f5f9f7; } .rb-lib-opt.is-sel { background: var(--color-primary-light); }
.rb-lib-opt input { margin-top: 3px; } .rb-lib-opt b { font-size: 13px; } .rb-lib-opt small { display: block; font-size: 11.5px; color: var(--color-text-muted); }
.rb-lib-ex { display: block; font-size: 12px; color: #4b5563; margin-top: 2px; }
.rb-lib-read { min-width: 0; border-inline-start: 1px solid var(--color-border); padding-inline-start: 16px; overflow-wrap: anywhere; }
.rb-lib-pt { margin: 0 0 2px; font-size: 16px; } .rb-lib-html { margin-top: 10px; font-size: 13px; line-height: 1.6; } .rb-lib-html p { margin: 0 0 8px; }
.rb-lib-html .rlib-callout { font-size: 13px; }
@media (max-width: 800px) { .rb-lib-body { grid-template-columns: 1fr !important; } .rb-lib-read { border-inline-start: 0; padding-inline-start: 0; border-top: 1px solid var(--color-border); padding-top: 12px; } }

/* Change notifications (update 143): who is told of each change — a card per kind of change, a heading per area; "Change" opens the form */
.nr-intro { margin: 0 0 14px; max-width: 72ch; }
.nr-kind { scroll-margin-top: 84px; }   /* (a link to a kind of change lands below the sticky top bar) */
.nr-kind .card-title { margin-bottom: 4px; }
.nr-rules { list-style: none; margin: 0; padding: 0; }
.nr-rule { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px 16px; padding: 12px 0; border-top: 1px solid var(--color-border); }
.nr-rule:first-child { border-top: 0; }
.nr-rule-text { flex: 1 1 320px; min-width: 0; }
.nr-where { margin: 0 0 2px; font-size: 14px; font-weight: 600; color: var(--color-text); }
.nr-who { margin: 0; }
.nr-preview { margin: 4px 0 0; max-width: 72ch; }
.nr-edit { flex: 0 0 auto; text-align: right; }
.nr-edit[open] { flex-basis: 100%; }
.nr-edit > summary { list-style: none; } .nr-edit > summary::-webkit-details-marker { display: none; }
.nr-form { display: grid; gap: 10px; margin-top: 8px; padding: 12px; border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-surface); text-align: left; }
.nr-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.nr-form > button { justify-self: start; }
.nr-form .form-check { display: flex; align-items: flex-start; gap: 8px; min-height: 30px; margin: 0; }
.nr-form .form-check input { width: 18px; height: 18px; flex: 0 0 auto; margin-top: 2px; }
.nr-people-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap: 0 12px; max-height: 15rem; overflow-y: auto; padding: 6px 8px; border: 1px solid var(--color-border); border-radius: 6px; }
.nr-people-list label[hidden] { display: none; }
.nr-find { margin: 0 0 6px; max-width: 320px; }
.nr-none { margin: 0; }
.nr-reset { margin-top: 6px; text-align: left; }
.nr-add { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px; margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--color-border); }
.nr-add .form-label { width: 100%; margin: 0; }
.nr-add select { width: auto; min-width: 220px; }
.nt-why { font-size: 12px; color: var(--color-text-muted); margin-top: 3px; }
@media (max-width: 640px) {
  .nr-rule-text { flex-basis: 100%; }
  .nr-edit { text-align: left; }
  .nr-add select { min-width: 0; width: 100%; }
}

/* ---------- A record's page (update 145): its state, the figure, the evidence beside it, correcting it ---------- */
.rv-state { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin: 0 0 14px; padding: 10px 14px; border-radius: var(--radius-lg); background: var(--color-info-bg); color: var(--color-text); border-inline-start: 4px solid var(--color-info); }
.rv-state p { margin: 0; }
.rv-state-back { background: var(--color-danger-bg); border-inline-start-color: var(--color-danger); }
.rv-state-ok { background: var(--color-success-bg); border-inline-start-color: var(--color-success); }
.rv-state-main { min-width: 0; flex: 1 1 320px; }
.rv-why { display: block; margin-top: 4px; font-style: italic; overflow-wrap: anywhere; }
.rv-why::before { content: '“'; } .rv-why::after { content: '”'; }
.rv-sum { padding: 12px 16px; margin-bottom: 16px; }
.rv-sum-list { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 0; align-items: flex-end; }
.rv-sum-list > div { min-width: 0; }
.rv-sum-list dt { font-size: 11.5px; color: var(--color-text-muted); margin: 0 0 2px; }
.rv-sum-list dd { margin: 0; font-weight: 600; font-size: 13.5px; overflow-wrap: anywhere; }
.rv-sum-value dd { font-size: 24px; font-weight: 700; letter-spacing: -.01em; font-variant-numeric: tabular-nums; line-height: 1.1; }
.rv-unit { font-size: 14px; font-weight: 600; color: var(--color-text-muted); }
.rv-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.rv-main > .card, .rv-side > .card { margin-bottom: 16px; }
.rv-ev-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.rv-files { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 10px; }
.rv-file { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 5px 10px 5px 6px; border: 1px solid var(--color-border); border-radius: 999px; background: var(--color-surface); color: var(--color-text); text-decoration: none; font-size: 12.5px; }
.rv-file:hover { border-color: var(--color-border-strong); }
.rv-file.is-on { border-color: var(--color-primary); background: var(--color-primary-light); font-weight: 600; }
.rv-file-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 26ch; }
.rv-stage { display: flex; align-items: center; justify-content: center; min-height: 220px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-alt); overflow: hidden; }
.rv-stage-pdf { background: #525659; }
.rv-pdf { display: block; width: 100%; height: clamp(420px, 72vh, 860px); border: 0; }
.rv-stage-img a { display: block; line-height: 0; }
.rv-stage-img img { display: block; max-width: 100%; max-height: 72vh; margin: 0 auto; object-fit: contain; }
.rv-noprev { display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 0; padding: 28px 16px; text-align: center; color: var(--color-text-muted); }
.rv-noprev p { margin: 0; }
.ev-type.rv-big-type { font-size: 14px; padding: 8px 12px; }
.rv-file-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin-top: 10px; }
.rv-file-title { display: flex; align-items: center; gap: 8px; min-width: 0; overflow-wrap: anywhere; }
.rv-pdf-help { margin: 6px 0 0; }
.rv-facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 5px 14px; margin: 12px 0 0; font-size: 12.5px; }
.rv-facts > div { display: contents; }
.rv-facts dt { color: var(--color-text-muted); }
.rv-facts dd { margin: 0; overflow-wrap: anywhere; }
.rv-sha { font-size: 11.5px; background: var(--color-surface-alt); padding: 1px 5px; border-radius: var(--radius-sm); }
.rv-ok, .rv-bad { display: inline-flex; align-items: center; gap: 3px; margin-inline-start: 6px; font-size: 12px; }
.rv-ok { color: var(--color-success); } .rv-bad { color: var(--color-danger); font-weight: 600; }
.rv-old-note { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; padding: 6px 10px; border-radius: var(--radius-md); background: var(--color-warning-bg); color: var(--color-warning); font-size: 12.5px; }
.rv-ev-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--color-border); }
.rv-act { flex: 0 1 auto; }
.rv-act[open] { flex-basis: 100%; }
.rv-act > summary, .rv-replaced > summary { list-style: none; cursor: pointer; }
.rv-act > summary::-webkit-details-marker, .rv-replaced > summary::-webkit-details-marker { display: none; }
.rv-act-form, .rv-first { display: grid; gap: 6px; justify-items: start; margin-top: 10px; padding: 12px; border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface-alt); }
.rv-act-form .form-control, .rv-first .form-control { max-width: 100%; }
.rv-act-form p, .rv-first p { margin: 0; }
.rv-locked { display: flex; align-items: center; gap: 5px; margin: 12px 0 0; }
.rv-replaced { margin-top: 14px; font-size: 12.5px; }
.rv-replaced > summary { color: var(--color-text-muted); font-weight: 600; }
.rv-replaced > summary::before { content: '▸ '; } .rv-replaced[open] > summary::before { content: '▾ '; }
.rv-replaced ul { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.rv-replaced li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; overflow-wrap: anywhere; }
.rv-fix { border-top: 3px solid var(--color-primary); }
.rv-fix form > .btn { margin-top: 4px; }
.rv-replace-pick { border: 0; margin: 6px 0 0; padding: 0; display: grid; gap: 2px; }
.rv-replace-pick legend { padding: 0; margin-bottom: 2px; }
.rv-own { display: flex; align-items: flex-start; gap: 6px; margin: 0 0 10px; padding: 7px 10px; border-radius: var(--radius-md); background: var(--color-surface-alt); color: var(--color-text-muted); }
ol.timeline.rv-history { list-style: none; margin: 0; }
@media (max-width: 1100px) { .rv-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) {
  .rv-sum-list { gap: 10px 18px; } .rv-sum-value { flex-basis: 100%; }
  .rv-pdf { height: 64vh; }
  .rv-facts { grid-template-columns: minmax(0, 1fr); gap: 2px; } .rv-facts dd { margin-bottom: 6px; }
}
@media print { .rv-stage-pdf, .rv-pdf, .rv-pdf-help { display: none; } .rv-layout { display: block; } }