:root {
  color-scheme: light;
  --ink: #252b28;
  --muted: #737c70;
  --accent: #42714e;
  --soft: #f2f4f1;
  --hover: #f6f7f5;
  --green: #4d7c5b;
  --red: #ab5151;
  --amber: #aa803c;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 13px;
  color: var(--ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, input, select, textarea, dialog { border: 0; }
:focus-visible { outline: 2px solid #8ca88a; outline-offset: 3px; }
button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 33px; padding: 7px 11px; border-radius: 7px; background: var(--soft); color: #59615b; cursor: pointer; font-weight: 500; transition: background .12s, color .12s; }
button:hover:not(:disabled) { background: #e8ece6; color: var(--ink); }
button:disabled { opacity: .35; cursor: default; }
button.primary { background: #29382c; color: #fff; }
button.primary:hover:not(:disabled) { background: #3d5140; color: #fff; }
button.ghost { background: transparent; }
button.ghost:hover:not(:disabled) { background: var(--soft); }
button.danger { color: var(--red); }
button.small { min-height: 28px; padding: 5px 8px; font-size: 12px; }
button.icon-button { width: 33px; padding: 7px; }
a { color: inherit; text-decoration: none; }
.icon { width: 16px; height: 16px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }
.layout { min-height: 100dvh; }
.topbar { height: 58px; display: flex; align-items: center; gap: 38px; padding: 0 26px; background: #fff; }
.logo { display: inline-flex; align-items: center; gap: 8px; font-size: 22px; font-weight: 660; letter-spacing: -.8px; color: #28352c; }
.logo img { width: 29px; height: 29px; }
nav { display: flex; gap: 5px; }
.nav { min-height: 32px; padding: 7px 13px; background: transparent; color: #888d89; font-weight: 500; }
.nav.active { background: #eef2eb; color: #3d6245; }
.top-right { margin-left: auto; display: flex; align-items: center; gap: 15px; }
.connection-label { display: inline-flex; align-items: center; gap: 6px; color: #939892; font-size: 11px; }
.dot { display: inline-block; width: 5px; height: 5px; flex-shrink: 0; border-radius: 50%; background: #7f9a75; }
.content { padding: 23px 26px 20px; }
.page-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 12px; }
h1 { margin: 0; font-size: 24px; line-height: 1.25; font-weight: 620; letter-spacing: -.85px; }
h2 { margin: 0; font-size: 14px; font-weight: 590; letter-spacing: -.15px; }
h3 { margin: 0 0 7px; font-size: 14px; font-weight: 550; }
p { margin: 0 0 10px; line-height: 1.65; }
.title-line { display: flex; align-items: center; gap: 10px; min-width: 0; }
.total-count { color: #a2a8a0; font-size: 22px; font-weight: 400; letter-spacing: -.7px; }
.actions { display: flex; align-items: center; gap: 6px; }
.updated-at { margin-right: 7px; color: #a0a59f; font-size: 11px; }
.subtitle { margin-top: 5px; color: var(--muted); font-size: 12px; }
.muted { color: var(--muted); font-size: 12px; }
.stats { display: flex; flex-wrap: wrap; align-items: center; gap: 23px; margin-bottom: 22px; color: #939890; font-size: 12px; }
.stats > span { display: inline-flex; align-items: center; gap: 5px; }
.stats strong { font-weight: 550; color: #656e63; }
.stats .icon { width: 13px; height: 13px; color: #abac9a; }
.stats .dot { margin-right: 2px; }
.stats .stat-expiry strong { color: #9a7b48; }
.notice { display: flex; align-items: flex-start; gap: 8px; background: #f3f5f0; color: #7b876f; border-radius: 7px; padding: 10px 12px; margin-bottom: 12px; font-size: 12px; line-height: 1.6; }
.notice > .icon { margin-top: 2px; }
.notice strong { font-weight: 600; }
.notice button { margin-left: 6px; }
.notice.warning { background: #faf6ed; color: #9c8052; }
.notice.error { background: #fbf0ee; color: #ad6861; }
.panel { margin-bottom: 13px; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 4px 0 12px; }
.panel-head p { font-size: 11px; color: var(--muted); margin: 4px 0 0; }
.filters { display: flex; align-items: center; gap: 7px; margin-bottom: 13px; }
.search { flex: 1; min-width: 160px; display: flex; align-items: center; gap: 8px; padding: 0 11px; min-height: 35px; border-radius: 7px; background: var(--soft); color: #969d94; }
.search input { width: 100%; min-width: 0; padding: 9px 0; background: transparent; font-size: 12px; }
.search input:focus { outline: 0; }
.search:focus-within { outline: 2px solid #b4c4aa; outline-offset: 1px; }
input, textarea, select { background: var(--soft); color: var(--ink); border-radius: 7px; padding: 9px 11px; }
input::placeholder, textarea::placeholder { color: #a0a59e; }
select { min-height: 35px; padding: 8px 26px 8px 11px; font-size: 12px; color: #6f776d; cursor: pointer; }
textarea { resize: vertical; min-height: 77px; line-height: 1.6; }
.table-scroll { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; white-space: nowrap; font-size: 12px; }
thead { color: #778270; background: #f7f8f5; font-size: 11px; }
th { font-weight: 450; padding: 9px 12px; }
th:first-child { border-radius: 6px 0 0 6px; }
th:last-child { border-radius: 0 6px 6px 0; }
td { height: 42px; padding: 8px 12px; }
tbody tr:nth-child(even) { background: #fcfcfa; }
tbody tr:hover { background: #f2f5ee; }
tbody tr { transition: background .12s; }
.domain-cell { display: flex; align-items: baseline; gap: 10px; }
.domain-name { font-size: 13px; font-weight: 520; letter-spacing: -.15px; }
.domain-cell small { font-size: 10px; color: #b1b5ac; font-variant-numeric: tabular-nums; }
.badge { display: inline-flex; align-items: center; gap: 5px; color: #8f958b; font-size: 11px; }
.badge.green { color: #6d8c62; }
.badge.green .dot { background: #89a77a; }
.badge.amber { color: #b39360; }
.badge.red { color: var(--red); }
.badge.purple { color: #8c8c7a; }
.tld { color: #9fa797; font-size: 11px; }
.date-cell { font-variant-numeric: tabular-nums; color: #62695e; }
.date-cell small { display: inline-block; margin-left: 10px; color: #a2a798; font-size: 10px; }
.date-cell.soon > span { color: #af8b50; }
.date-cell.soon small { color: #baa78a; }
.row-action { width: 35px; text-align: right; }
.row-open { display: inline-flex; color: #bdc2b7; padding: 3px; }
.row-open:hover { color: #5f7c50; }
.row-open .icon { width: 14px; height: 14px; }
.pagination { display: flex; align-items: center; justify-content: space-between; padding: 12px 0 0; color: #a1a79a; font-size: 11px; font-variant-numeric: tabular-nums; }
.pagination .actions { gap: 7px; }
.pagination button { background: transparent; }
.pagination button:hover:not(:disabled) { background: var(--soft); }
.bottom-note { display: flex; align-items: center; gap: 6px; color: #a5ab9f; font-size: 10px; margin-top: 17px; }
.bottom-note .icon { width: 12px; height: 12px; }
.empty { padding: 34px 16px; text-align: center; color: var(--muted); }
.empty h3 { color: #6b7465; }
.empty p { font-size: 12px; margin-bottom: 12px; }
.loading { padding: 35px 0; color: #99a18f; font-size: 12px; }
.initial { min-height: 100dvh; display: grid; place-items: center; color: var(--muted); }
.back { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: #9ca491; margin-bottom: 14px; }
.back .icon { width: 12px; height: 12px; }
.detail-head { margin-bottom: 17px; }
.domain-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; color: #98a08e; font-size: 11px; margin-top: 6px; }
.tabs { display: flex; align-items: center; gap: 5px; margin-bottom: 19px; overflow-x: auto; }
.tab { background: transparent; padding: 7px 12px; color: #969e8a; white-space: nowrap; font-size: 12px; }
.tab.active { background: #eef2e9; color: #647c4d; }
.count { font-size: 10px; font-weight: 400; opacity: .65; margin-left: 2px; }
.export-link { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 33px; padding: 7px 11px; color: #65745a; background: #f0f3eb; border-radius: 7px; font-size: 12px; }
.export-link:hover { background: #e7eddf; }
.record-type { color: #657650; font-size: 11px; font-family: ui-monospace, SFMono-Regular, monospace; }
.record-content { font-family: ui-monospace, SFMono-Regular, monospace; font-size: 11px; white-space: normal; overflow-wrap: anywhere; min-width: 180px; max-width: 650px; line-height: 1.6; color: #536248; }
.mono { font-family: ui-monospace, SFMono-Regular, monospace; font-size: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
.info-card { padding: 0; }
.data-list { display: grid; grid-template-columns: minmax(120px, .7fr) minmax(0, 1.4fr); gap: 13px 18px; font-size: 12px; margin: 17px 0 18px; }
.data-list dt { color: #7b896a; }
.data-list dd { margin: 0; overflow-wrap: anywhere; color: #69765b; }
.ns-list { display: grid; gap: 4px; margin: 0 0 14px; }
.ns-item { display: flex; align-items: center; gap: 17px; min-height: 40px; padding: 9px 12px; background: #f5f7f0; border-radius: 6px; }
.ns-item span { color: #a2ac93; font-size: 10px; }
.ns-item strong { font-weight: 500; color: #6c8058; }
.settings-panel { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: start; gap: 20px 40px; }
.settings-section { padding: 8px 0; }
.settings-section:last-child { grid-column: 1; grid-row: 2; }
.settings-section:nth-child(2) { grid-column: 2; grid-row: 1 / 3; }
.settings-section > h2 { margin-bottom: 10px; }
.settings-section .muted { max-width: 760px; }
.config-code { padding: 13px 16px; margin: 12px 0; border-radius: 7px; background: #f4f6ef; color: #7b8866; font-size: 11px; line-height: 1.8; overflow: auto; }
.shield-note { color: #929e80; font-size: 12px; line-height: 1.9; margin: 13px 0; }
.shield-note > .icon { color: #9ead8a; }
.footer-link { display: inline-flex; align-items: center; gap: 5px; color: #7c9163; font-size: 11px; }
.history-message { white-space: normal; min-width: 210px; max-width: 650px; line-height: 1.6; color: #909b7e; }
.login-page { min-height: 100dvh; display: grid; place-items: center; padding: 24px; }
.login-box { width: 300px; max-width: 100%; text-align: center; }
.login-box.pin-long { width: 420px; }
.login-box.pin-extra-long { width: 580px; }
.login-box .logo { margin-bottom: 25px; }
.login-box h1 { font-size: 22px; }
.login-box p { color: #a0a68f; font-size: 12px; margin: 5px 0 18px; }
.pin-fields { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: clamp(4px, 1.5vw, 8px); }
.pin-fields .pin-digit { width: 100%; min-width: 0; height: 58px; padding: 0; border-radius: 10px; background: #f0f3ee; text-align: center; font-size: 24px; line-height: normal; caret-color: var(--accent); transition: background .12s; }
.pin-fields .pin-digit:focus { background: #e6eee2; outline: none; box-shadow: inset 0 -3px #64885e; }
.pin-fields .pin-digit[aria-invalid="true"] { background: #fbefed; }
.pin-fields .pin-digit:disabled { opacity: .65; }
.pin-feedback { min-height: 28px; padding-top: 8px; }
.pin-feedback .inline-error:not(:empty) { margin: 0; }
.pin-status { color: var(--muted); font-size: 12px; }
.login-meta { font-size: 10px; color: #afb59e; margin-top: 8px; text-align: center; }
.auth-box { width: 350px; }
.auth-box h1 { font-size: 22px; }
.auth-box form { text-align: left; }
.auth-box form > input { width: 100%; min-height: 42px; }
.auth-box .help { margin-top: 6px; }
.auth-box .auth-submit { width: 100%; margin-top: 14px; min-height: 40px; }
.auth-box .login-meta { margin-top: 20px; }
.remember-label { margin-top: 16px; }
.auth-settings { display: grid; grid-template-columns: minmax(0, 350px) minmax(0, 1fr); gap: 35px; margin-bottom: 28px; }
.auth-settings input { width: 100%; }
.auth-settings form button { margin-top: 14px; }
.session-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; }
.session-row strong { font-size: 12px; font-weight: 500; }
.session-row small, .security-log small { display: block; color: var(--muted); font-size: 10px; line-height: 1.7; }
.security-log-title { margin-top: 18px; }
.security-log { margin-top: 10px; max-height: 220px; overflow: auto; }
.security-log > div { padding: 7px 0; font-size: 12px; }
.field-label { display: block; margin: 13px 0 6px; color: #82916e; font-size: 11px; font-weight: 500; }
.inline-error { color: var(--red); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.inline-error:not(:empty) { margin: 10px 0; }
dialog { width: 540px; max-width: calc(100% - 24px); max-height: calc(100dvh - 32px); padding: 20px; background: white; color: var(--ink); border-radius: 12px; box-shadow: 0 18px 65px #283b231c; overflow: auto; }
dialog::backdrop { background: #29332938; }
.dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.dialog-head h2 { font-size: 16px; font-weight: 600; }
.dialog-head button { width: 27px; min-height: 27px; padding: 4px; background: transparent; }
.dialog-subtitle { font-size: 11px; color: #a4ad93; margin: 3px 0 12px; }
dialog input, dialog select, dialog textarea { width: 100%; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.help { font-size: 10px; line-height: 1.65; color: #7d8a6d; margin-top: 5px; }
.dialog-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin-top: 17px; }
.diff { display: grid; gap: 7px; margin: 12px 0; }
.diff-block { padding: 11px 13px; background: #fbf1ed; border-radius: 6px; color: #ad7866; font-family: ui-monospace, SFMono-Regular, monospace; font-size: 12px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.diff-block.add { background: #f0f5e9; color: #849767; }
.diff-label { font: 500 10px -apple-system, BlinkMacSystemFont, sans-serif; margin-bottom: 5px; color: #b18d7c; }
.diff-block.add .diff-label { color: #93a77a; }
.check-label { display: flex; align-items: flex-start; gap: 8px; font-size: 11px; line-height: 1.65; color: #6d8057; margin-top: 13px; }
.check-label input { appearance: none; width: 15px; height: 15px; min-width: 15px; padding: 0; background: #e8eddf; border-radius: 4px; margin: 2px 0 0; cursor: pointer; }
.check-label input:checked { background: #577348; box-shadow: inset 0 0 0 3px #577348; }
.check-label input:checked::after { content: "✓"; display: block; color: white; text-align: center; font-size: 11px; line-height: 15px; }
.long-json { max-height: 250px; padding: 11px; background: #f5f7f0; color: #8d9b75; border-radius: 7px; font-size: 10px; white-space: pre-wrap; overflow: auto; overflow-wrap: anywhere; }
.error-screen { padding: 14px 0; }
#toast { position: fixed; bottom: 20px; right: 24px; z-index: 30; display: none; max-width: min(470px, calc(100% - 32px)); padding: 12px 16px; border-radius: 8px; background: #35462d; color: #eef4e5; box-shadow: 0 6px 24px #25341b15; font-size: 12px; line-height: 1.6; }
#toast.show { display: block; }
#toast.error { background: #a86856; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
@media (min-width: 1600px) {
  .domain-table td { height: 44px; }
  .content { padding-right: 32px; padding-left: 32px; }
  .topbar { padding-right: 32px; padding-left: 32px; }
}
@media (max-width: 1020px) {
  .topbar { gap: 25px; }
  .date-cell small { display: none; }
  .domain-cell small { display: none; }
  .filters { gap: 5px; }
  .filters select { padding-right: 18px; padding-left: 8px; font-size: 11px; }
  .settings-panel { gap: 20px 25px; }
}
@media (max-width: 700px) {
  .auth-settings { grid-template-columns: 1fr; gap: 25px; }
  .topbar { height: 54px; gap: 15px; padding: 0 14px; }
  .logo { font-size: 20px; gap: 6px; }
  .logo img { width: 25px; height: 25px; }
  nav { gap: 1px; }
  .nav { padding: 7px 8px; font-size: 11px; }
  .top-right { gap: 4px; }
  .connection-label { font-size: 0; gap: 0; }
  .content { padding: 16px 14px; }
  .page-head { gap: 10px; }
  h1 { font-size: 22px; overflow-wrap: anywhere; }
  .title-line { gap: 7px; }
  .total-count { font-size: 20px; }
  .updated-at { display: none; }
  .stats { gap: 9px 15px; margin-bottom: 17px; font-size: 10px; }
  .stats .icon { width: 11px; height: 11px; }
  .filters { flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
  .search { flex-basis: 100%; min-height: 34px; }
  .filters select { flex: 1; min-width: 0; min-height: 31px; font-size: 10px; padding: 7px 3px 7px 7px; }
  th, td { padding-left: 9px; padding-right: 9px; }
  .domain-table th:nth-child(3), .domain-table td:nth-child(3), .domain-table th:nth-child(5), .domain-table td:nth-child(5) { display: none; }
  .domain-table { font-size: 11px; }
  .domain-table .domain-name { font-size: 12px; }
  .badge { font-size: 10px; }
  .domain-table td { height: 41px; }
  .row-action { width: 15px; }
  .row-open .icon { width: 12px; height: 12px; }
  .bottom-note { font-size: 9px; align-items: flex-start; line-height: 1.7; margin-top: 13px; }
  .detail-head { align-items: flex-start; flex-wrap: wrap; }
  .domain-meta { gap: 10px; }
  .tabs { gap: 2px; margin-bottom: 15px; }
  .tab { padding: 7px 9px; font-size: 11px; }
  .panel-head { gap: 8px; }
  .panel-head button { font-size: 11px; padding: 7px 9px; }
  .info-grid, .settings-panel { grid-template-columns: 1fr; gap: 17px; }
  .settings-section:nth-child(2), .settings-section:last-child { grid-column: auto; grid-row: auto; }
  .notice { font-size: 11px; }
  .notice button { margin: 6px 0 0; }
  .ns-item { gap: 12px; }
  dialog { padding: 17px; }
  .dialog-actions { flex-wrap: wrap; }
  .dialog-actions button { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
}

.unavailable-zone { max-width: 920px; }
.unavailable-zone > p { max-width: 850px; color: var(--muted); font-size: 12px; }
.unavailable-zone .ns-list { margin: 13px 0; }
.ssl-cell { font-variant-numeric: tabular-nums; min-width: 140px; }
.ssl-cell small { display: block; color: var(--muted); font-size: 10px; max-width: 190px; overflow: hidden; text-overflow: ellipsis; }
.ssl-cell.ssl-urgent > span { color: var(--red); }
.ssl-wildcard { color: #9b8755; }
.ssl-alert-domains { margin-top: 3px; }
.ssl-alert-domains a { text-decoration: underline; text-underline-offset: 3px; }
.ssl-target-row { display: flex; gap: 7px; }
.ssl-target-row input { min-width: 0; flex: 1; }
.ssl-target-row button { white-space: nowrap; }
.ssl-names { margin-top: 12px; }
.ssl-history { margin-top: 12px; max-height: 240px; overflow: auto; font-size: 11px; color: var(--muted); }
.ssl-history > div { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; }
.ssl-domain-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin: -7px 0 15px; color: var(--muted); font-size: 11px; }
.ssl-domain-summary strong { font-weight: 500; color: var(--ink); }
@media (max-width: 700px) {
  .ssl-cell { min-width: 120px; }
  .ssl-cell small { max-width: 150px; }
  .panel:has(#ssl-target-form) > .panel-head { flex-wrap: wrap; }
}

.monitor-controls{display:flex;flex-wrap:wrap;gap:8px;margin:-3px 0 17px}
.monitor-controls [aria-pressed="false"]{color:var(--muted)}
.dns-check-times{display:flex;flex-wrap:wrap;gap:8px 24px;font-size:12px;color:var(--muted);margin-bottom:16px}
.dns-check-times strong{display:block;font-size:12px;color:var(--ink);font-weight:500;margin-top:3px}
.dns-timeline{margin-top:22px}
.dns-event{padding:0;margin:0 0 10px;background:var(--surface,#f8f9f8);border-radius:8px}
.dns-event>summary{display:flex;align-items:center;gap:24px;padding:14px 16px;cursor:pointer;list-style:none;font-size:13px}
.dns-event>summary::after{content:'+';margin-left:auto;color:var(--muted);font-size:18px}
.dns-event[open]>summary::after{content:'−'}
.dns-event time{color:var(--muted);font-size:12px;min-width:145px}
.dns-event-body{padding:0 16px 18px}
.dns-component{margin:12px 0 20px}
.dns-component h3{font-size:13px;font-weight:600;margin:0 0 8px}
.dns-diff-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:12px}
.dns-delta h4{font-size:11px;text-transform:uppercase;letter-spacing:.04em;font-weight:500;margin:8px 0}
.dns-delta.added h4{color:#427553}.dns-delta.removed h4{color:#ac5555}
.dns-delta pre,.dns-diff-grid>pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;line-height:1.55;background:#fff;padding:10px 12px;margin:0 0 7px;border-radius:5px}
.dns-soa{margin-top:8px;font-size:12px}.dns-soa summary{padding:7px 0;cursor:pointer}
.dns-event-body>.footer-link{font-size:12px}
@media(max-width:620px){.dns-event>summary{gap:8px;align-items:flex-start;flex-wrap:wrap}.dns-event time{min-width:100%;}.monitor-controls button{font-size:12px}}
.dns-snapshot-record{background:#fff;padding:11px 12px;margin-bottom:7px;border-radius:5px}
.dns-record-meta{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:12px;margin-bottom:4px}
.dns-record-meta strong{font-weight:500}.dns-record-meta small{color:var(--muted);margin-left:auto;font-size:11px}
.dns-snapshot-record pre{padding:0;margin:5px 0 0;background:transparent}
.dns-snapshot-record details{font-size:11px;color:var(--muted);margin-top:6px}.dns-snapshot-record summary{cursor:pointer}

.integration-role-tabs{display:flex;gap:6px;margin:0 0 16px;flex-wrap:wrap}
.integration-role-tabs button{background:transparent;color:var(--muted)}.integration-role-tabs button.active{background:var(--soft);color:var(--accent)}
.integration-row{display:flex;justify-content:space-between;align-items:center;gap:22px;padding:19px 0}
.integration-row:nth-child(2n){background:var(--hover);padding-left:15px;padding-right:15px;border-radius:8px}
.integration-title{display:flex;align-items:center;gap:12px}.integration-title h2{margin:0}
.integration-url{font-size:12px;margin:6px 0;color:var(--muted);overflow-wrap:anywhere}
.integration-roles{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;color:var(--muted)}.integration-row .help{margin:7px 0 0}
.integration-row>.actions{flex-wrap:wrap;justify-content:flex-end;min-width:240px}.integration-error{color:var(--red)}
.role-fields{padding:0;margin:19px 0;border:0}.role-fields legend{font-weight:500;font-size:12px;margin-bottom:7px}
.integration-advanced{margin:18px 0;font-size:12px}.integration-advanced>summary{cursor:pointer;color:var(--muted);padding:5px 0}
.integration-domain{display:grid;grid-template-columns:minmax(250px,1fr) minmax(250px,1fr);gap:38px}
.integration-domain form{max-width:560px}.integration-domain select{width:100%;margin-bottom:7px}
.certificate-jobs-section{margin-top:28px}.certificate-job{background:var(--hover);margin-bottom:9px;border-radius:8px}
.certificate-job>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px;cursor:pointer;list-style:none}
.certificate-job summary strong{font-weight:500;font-size:13px}.certificate-job summary small{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.certificate-job-body{padding:0 15px 17px}.certificate-job-body>p{font-size:12px;line-height:1.55}
.challenge-record{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:9px 0;padding:10px;background:#fff;border-radius:6px;font-size:12px}
.challenge-record strong{font-weight:500}.challenge-record code{flex-basis:100%;background:transparent;overflow-wrap:anywhere;padding:3px 0}
.notification-filters{margin-bottom:20px}.notification-filters .check-label{margin:0}
.notification-row{display:grid;grid-template-columns:8px 1fr auto;gap:14px;padding:17px 13px;margin:0 0 7px;border-radius:8px}
.notification-row.unread{background:var(--hover)}.notification-row h2{font-size:13px;margin:0;font-weight:500}.notification-row p{font-size:12px;margin:7px 0;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}
.notification-heading{display:flex;gap:12px;justify-content:space-between;align-items:baseline}.notification-heading>span{font-size:11px;color:var(--muted);flex-shrink:0}
.notification-dot{width:6px;height:6px;border-radius:50%;background:#9ba59b;margin-top:6px}.notification-dot.success{background:var(--green)}.notification-dot.error{background:var(--red)}.notification-dot.warning{background:var(--amber)}
.notification-row:not(.unread) .notification-dot{opacity:.4}.notification-row .footer-link{font-size:12px}.notification-integration-link{margin-left:14px}
#notification-badge{font-size:10px;padding:2px 6px;min-width:17px;margin-left:4px;color:var(--accent);background:#e8eee5}
.compact-empty{padding:25px 15px}
@media(max-width:850px){.topbar{flex-wrap:wrap}.topbar nav{order:3;width:100%;overflow:auto;flex-shrink:0}.integration-row{align-items:flex-start;flex-direction:column;gap:12px}.integration-row>.actions{justify-content:flex-start;min-width:0}.integration-domain{grid-template-columns:1fr;gap:20px}.notification-heading{display:block}.notification-heading>span{display:block;margin-top:5px}}
.record-provider-info{display:block;color:var(--muted);font-size:11px;line-height:1.5;margin-top:4px;white-space:pre-wrap}
