:root {
  color-scheme: light;
  --nav: #071b55;
  --nav2: #102d88;
  --blue: #1268f3;
  --blue2: #00aeff;
  --ink: #06122f;
  --muted: #64748b;
  --panel: #ffffff;
  --line: #d8e2f2;
  --soft: #eef4ff;
  --dark: #07112c;
  --ok: #16b36b;
  --bad: #d92d4a;
  --warn: #f59e0b;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background: radial-gradient(circle at 55% 10%, #fff 0 18%, #e9f0fb 34%, #dbe5f2 100%); }
a { color: inherit; text-decoration: none; }
.sidebar { position:fixed; inset:0 auto 0 0; width:282px; padding:16px; background:linear-gradient(180deg,var(--nav2),var(--nav)); color:white; box-shadow: 12px 0 24px #06122f44; overflow:auto; }
.brand-card { border:1px solid #3d5aaa; border-radius:20px; padding:14px; background:#0b235f; box-shadow: inset 0 1px 0 #ffffff22; }
.brand-card img { width:100%; height:80px; object-fit:contain; background:white; border-radius:12px; padding:7px; }
.brand-card h2 { margin:10px 0 0; font-size:28px; line-height:1; }
.brand-card p { margin:6px 0 0; color:#d8e8ff; font-size:13px; font-weight:700; }
.brand-card .id { color:white; font-size:12px; opacity:.9; }
.clock-card { margin:14px 0; border:1px solid #2c468f; border-radius:14px; padding:14px; background:#071641; text-align:center; }
.clock-card b { color:#5ff4ff; display:block; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size:23px; letter-spacing:2px; }
.clock-card span { color:#dbeafe; font-size:12px; font-weight:700; }
nav { display:flex; flex-direction:column; gap:4px; }
.nav-item { display:block; padding:11px 10px; border-radius:9px; font-weight:400; color:#f8fbff; }
.nav-item:hover { background:#ffffff1a; }
.nav-item.active { background:#fff; color:#071b55; }
.main { margin-left:282px; padding:26px 30px 40px; min-height:100vh; }
.main-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:22px; }
.eyebrow { color:#174cb6; font-weight:900; letter-spacing:3px; font-size:13px; }
h1 { margin:4px 0 0; color:#0b2a79; font-size:38px; line-height:1; }
h2 { margin:0; font-size:20px; }
.head-actions { display:flex; align-items:center; gap:12px; }
.user-chip, .btn, button { border:0; border-radius:14px; padding:12px 18px; font-weight:900; background:#fff; color:#082266; box-shadow:0 6px 20px #17376c18; }
.btn.dark { background:#071b55; color:#fff; }
button.primary, .primary { background:linear-gradient(90deg,#1464e9,#0f7dff); color:white; cursor:pointer; }
button.small { padding:7px 10px; border-radius:10px; background:#eaf2ff; color:#0b2a79; cursor:pointer; white-space:nowrap; }
.metrics-row { display:grid; grid-template-columns:repeat(4,minmax(170px,1fr)); gap:18px; margin-bottom:20px; }
.metric { color:#fff; background:#07112c; border:1px solid #243b79; border-radius:20px; padding:17px 18px; box-shadow:0 12px 28px #06122f3d; }
.metric-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.metric-title { font-weight:900; letter-spacing:.5px; }
.metric-value { color:#62f4ff; font-size:18px; font-weight:900; white-space:nowrap; }
.metric small { color:#a9b9d8; font-weight:700; }
.spark { height:50px; display:flex; align-items:end; margin-top:12px; background:#050c1f; border:1px solid #17274c; border-radius:12px; padding:8px; overflow:hidden; }
.spark span { display:block; height:4px; border-radius:4px; background:linear-gradient(90deg,#ffd84f,#20d17a,#31d5ff); min-width:6px; }
.card { background:rgba(255,255,255,.94); border:1px solid var(--line); border-radius:18px; padding:18px 20px; box-shadow:0 10px 34px #0c2b6b14; margin-bottom:18px; }
.card.wide { width:100%; }
.card-title { display:flex; justify-content:space-between; gap:16px; align-items:center; border-bottom:1px solid var(--line); padding-bottom:12px; margin-bottom:14px; }
.card-title span, .hint, .muted { color:var(--muted); font-size:13px; }
.summary-grid { display:grid; grid-template-columns:repeat(4,minmax(170px,1fr)); gap:18px; margin-bottom:18px; }
.summary-card { background:#fff; border-top:5px solid var(--blue2); border-radius:18px; padding:18px 20px; box-shadow:0 10px 28px #0c2b6b17; }
.summary-card span { color:var(--muted); text-transform:uppercase; font-size:13px; font-weight:900; letter-spacing:1px; }
.summary-card strong { display:block; margin-top:12px; font-size:24px; color:var(--ink); }
.pills { display:flex; flex-wrap:wrap; gap:8px; }
.pill { display:inline-flex; align-items:center; border-radius:999px; padding:5px 10px; background:#eef2f7; color:#334155; font-weight:900; font-size:12px; }
.pill.ok { background:#defbea; color:#076b3b; }
.pill.bad { background:#ffe2e7; color:#a60f2d; }
.flash { margin-bottom:18px; border-radius:16px; padding:12px 16px; font-weight:800; }
.flash pre { margin:0; white-space:pre-wrap; font-family:inherit; }
.flash.ok { background:#dffbea; color:#075c35; border:1px solid #9ce2bb; }
.flash.error { background:#ffe5e9; color:#9b1230; border:1px solid #ffb3c0; }
.inline-form, .form-grid { display:grid; grid-template-columns:repeat(4,minmax(180px,1fr)); gap:14px; align-items:end; }
.form-grid { grid-template-columns:repeat(3,minmax(220px,1fr)); }
label { display:block; font-size:13px; color:#334155; font-weight:900; }
input, select { display:block; width:100%; margin-top:6px; border:1px solid #cdd8ea; border-radius:12px; padding:12px 13px; font-size:15px; background:#fff; color:var(--ink); outline:none; }
input:focus { border-color:var(--blue); box-shadow:0 0 0 4px #1268f322; }
table { width:100%; border-collapse:collapse; font-size:14px; }
th { text-align:left; color:#64748b; text-transform:uppercase; font-size:12px; letter-spacing:.8px; border-bottom:1px solid var(--line); padding:10px; }
td { border-bottom:1px solid #e6edf7; padding:12px 10px; vertical-align:top; }
code, pre { background:#07112c; color:#dbeafe; border-radius:12px; padding:10px; overflow:auto; display:block; }
td code { display:inline-block; padding:5px 8px; }
.actions { display:flex; flex-wrap:wrap; gap:6px; }
.actions form { display:inline; }
.login-screen { display:grid; place-items:center; background:linear-gradient(135deg,#071b55,#143ca2 45%,#edf3fb 45%); }
.login-shell { width:min(900px,94vw); display:grid; grid-template-columns:290px 1fr; gap:20px; align-items:stretch; }
.logo-card { border-radius:22px; background:#071b55; color:#fff; padding:20px; box-shadow:0 18px 40px #06122f66; }
.logo-card img { width:100%; background:#fff; border-radius:14px; padding:8px; }
.logo-card strong { display:block; font-size:32px; margin-top:14px; }
.logo-card small { color:#dbeafe; font-weight:800; }
.login-card { border-radius:22px; background:#fff; padding:30px; box-shadow:0 18px 50px #06122f44; }
.login-card h1 { color:#0b2a79; }
.login-card label { margin-bottom:14px; }
@media (max-width:1100px) { .metrics-row,.summary-grid,.inline-form,.form-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:760px) { .sidebar { position:static; width:auto; } .main { margin-left:0; padding:18px; } .metrics-row,.summary-grid,.inline-form,.form-grid,.login-shell { grid-template-columns:1fr; } .main-head { flex-direction:column; align-items:flex-start; } }
textarea { display:block; width:100%; margin-top:6px; border:1px solid #cdd8ea; border-radius:12px; padding:12px 13px; font-size:14px; background:#fff; color:var(--ink); outline:none; font-family:ui-monospace, SFMono-Regular, Menlo, monospace; }
textarea:focus { border-color:var(--blue); box-shadow:0 0 0 4px #1268f322; }
.security-grid { display:grid; grid-template-columns:repeat(3,minmax(180px,1fr)); gap:14px; align-items:start; }
.security-grid .check-list { grid-column:1 / -1; display:grid; grid-template-columns:repeat(4,minmax(180px,1fr)); gap:10px; padding:12px; border:1px solid var(--line); border-radius:14px; background:#f8fbff; }
.security-grid .check-list label { display:flex; gap:8px; align-items:center; font-weight:800; }
.security-grid .check-list input { display:inline-block; width:auto; margin:0; }
.security-grid textarea { min-height:140px; }
.tabs { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; }
.tab { display:inline-block; padding:10px 14px; border-radius:12px; background:#fff; border:1px solid var(--line); color:#0b2a79; font-weight:900; box-shadow:0 6px 20px #17376c12; }
.tab.active { background:#071b55; color:white; }
.tab.download { background:linear-gradient(90deg,#1464e9,#0f7dff); color:#fff; }
.doc-list { display:flex; flex-wrap:wrap; gap:8px; }
.markdown h1 { font-size:30px; color:#0b2a79; margin-top:8px; }
.markdown h2 { color:#0b2a79; margin-top:22px; }
.markdown h3 { color:#123a91; margin-top:18px; }
.markdown p { line-height:1.55; }
.markdown .md-bullet { margin:4px 0 4px 16px; }
.flash.warn { background:#fff7db; color:#7a4d00; border:1px solid #ffd36b; }
@media (max-width:1100px) { .security-grid,.security-grid .check-list { grid-template-columns:1fr 1fr; } }
@media (max-width:760px) { .security-grid,.security-grid .check-list { grid-template-columns:1fr; } }
.big-add { display:inline-block; border-radius:15px; padding:13px 18px; font-weight:900; border:0; box-shadow:0 8px 22px #17376c1b; }
.domain-create-form { margin-top:16px; display:block; }
.domain-create-form.collapsed { display:none; }
.domain-main-grid { grid-template-columns:repeat(4,minmax(190px,1fr)); }
.preview-box { margin:14px 0; padding:14px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; border:1px solid var(--line); border-radius:14px; background:#f8fbff; }
.preview-box b { color:#0b2a79; }
.preview-box span, .preview-box a { display:inline-flex; align-items:center; border-radius:999px; background:#fff; border:1px solid #d9e6f8; padding:6px 10px; font-size:13px; font-weight:800; }
.preview-box code { display:inline-block; padding:6px 10px; background:#07112c; color:#dbeafe; border-radius:999px; }
.warn-text { background:#fff7db !important; color:#7a4d00; }
.inline-checks { margin:12px 0; padding:12px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.inline-checks label { display:flex; align-items:center; gap:8px; }
.inline-checks input { width:auto; margin:0; }
.alias-panel { margin:14px 0; padding:14px; border:1px solid var(--line); border-radius:16px; background:#f8fbff; }
.card-title.compact { margin-bottom:10px; padding-bottom:8px; }
.card-title.compact h2 { font-size:17px; }
.alias-row { display:grid; grid-template-columns:1.2fr .8fr 1.2fr auto; gap:10px; align-items:end; margin-bottom:9px; }
.linkbtn { display:inline-block; background:#edf5ff; color:#0b2a79; }
.job-card details { margin-top:12px; }
.job-card summary { cursor:pointer; font-weight:900; color:#0b2a79; }
@media (max-width:1100px) { .domain-main-grid { grid-template-columns:1fr 1fr; } .alias-row { grid-template-columns:1fr 1fr; } }
@media (max-width:760px) { .domain-main-grid,.alias-row { grid-template-columns:1fr; } }
.domain-create-form[hidden], .edit-row[hidden] { display:none !important; }
.edit-panel { display:grid; grid-template-columns:2fr 1fr; gap:18px; padding:14px; border:1px solid var(--line); border-radius:16px; background:#f8fbff; }
.domain-edit-form { display:block; }
.checkbox-line { display:flex; gap:8px; align-items:center; margin-top:25px; }
.checkbox-line input { width:auto; margin:0; }
.delete-form { padding:14px; border:1px solid #fecdd3; border-radius:16px; background:#fff1f2; }
button.danger, .danger { border:0; border-radius:12px; padding:11px 14px; font-weight:900; cursor:pointer; background:#b91c1c; color:white; }
@media (max-width:1100px) { .edit-panel { grid-template-columns:1fr; } }

.ok-text{color:#15a34a;font-weight:800}.warn-text{color:#b45309;font-weight:800}
/* v0.1.14 compact domain actions and cluster helpers */
button.tiny, .tiny, .actions.compact-actions .small, .actions.compact-actions .linkbtn {
  padding:5px 8px;
  border-radius:8px;
  font-size:12px;
  line-height:1.1;
  min-width:auto;
  box-shadow:none;
  white-space:nowrap;
}
.compact-actions { min-width:230px; flex-direction:column; align-items:flex-start; gap:5px; }
.compact-actions .action-row { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
.compact-actions form { display:inline-flex; margin:0; }
.tools-row .linkbtn { background:#eef4ff; }
.copy-value { display:block; word-break:break-all; white-space:normal; font-size:13px; }
.summary-grid.in-card { margin:0; grid-template-columns:repeat(4,minmax(170px,1fr)); }
.main.full { margin-left:0; padding:26px 30px 40px; }
.tool-card table th { width:150px; }
@media (max-width:1100px) { .summary-grid.in-card { grid-template-columns:1fr 1fr; } }
@media (max-width:760px) { .summary-grid.in-card { grid-template-columns:1fr; } .compact-actions { min-width:0; } }


/* v0.1.15: uniform domain action buttons, language switcher and live clock */
.lang-switch { display:inline-flex; align-items:center; gap:6px; padding:4px 6px; border-radius:999px; background:rgba(255,255,255,.72); font-size:12px; font-weight:900; }
.lang-switch a { color:#0f2f7a; text-decoration:none; padding:5px 8px; border-radius:999px; }
.lang-switch a.active, .lang-switch a:hover { background:#123fa7; color:white; }
.clock-card.interactive-clock { cursor:pointer; user-select:none; transition:transform .12s ease, border-color .12s ease; }
.clock-card.interactive-clock:hover { transform:translateY(-1px); border-color:#5ff4ff; }
.clock-card em { display:block; margin-top:6px; font-size:10px; color:#9fb6e8; font-style:normal; }
.domain-actions { min-width:270px !important; }
.domain-actions .action-grid { display:grid; grid-template-columns:repeat(3, minmax(68px, 1fr)); gap:6px; align-items:stretch; }
.domain-actions .action-grid form { display:block; margin:0; }
.action-tile, .domain-actions .action-tile, .domain-actions button.action-tile, .domain-actions a.action-tile {
  display:flex; align-items:center; justify-content:center; width:100%; min-width:0; height:32px; box-sizing:border-box;
  padding:0 8px; border:1px solid #d7e2f4; border-radius:9px; background:#f5f8ff; color:#10235c;
  font-size:12px; font-weight:900; line-height:1; text-decoration:none; cursor:pointer; box-shadow:none; white-space:nowrap;
}
.domain-actions .action-tile:hover { background:#e7efff; border-color:#a8bee9; }
.domain-actions button.action-tile { font-family:inherit; }
@media (max-width:760px) { .domain-actions { min-width:0 !important; } .domain-actions .action-grid { grid-template-columns:repeat(2, minmax(90px, 1fr)); } }

/* v0.2.0: Resilio Sync and IPS/IDS control center */
.hero-status { display:flex; justify-content:space-between; gap:24px; align-items:center; margin-bottom:18px; padding:22px 24px; border:1px solid #cfe0f7; border-radius:22px; background:linear-gradient(120deg,#f7fbff,#eaf3ff); box-shadow:0 12px 34px #17376c14; }
.hero-status.healthy { background:linear-gradient(120deg,#f3fff7,#e8f8ee); border-color:#bce8ca; }
.hero-status.attention { background:linear-gradient(120deg,#fffdf4,#fff4d9); border-color:#f1da91; }
.hero-status.neutral { background:linear-gradient(120deg,#f7f8fb,#eef1f6); border-color:#d9dee8; }
.hero-status h2 { margin:3px 0 6px; color:#071b55; font-size:28px; }
.hero-status p { margin:0; max-width:780px; color:#405273; line-height:1.5; }
.hero-actions,.form-actions,.inline-actions { display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.hero-actions form,.inline-actions form { margin:0; }
.metrics-row.five { grid-template-columns:repeat(5,minmax(150px,1fr)); }
.metric-value.status-word { font-size:21px; letter-spacing:.04em; }
.metric-value.compact-value { font-size:18px; overflow-wrap:anywhere; }
.good { color:#12843a !important; }.bad-text { color:#b42318 !important; }.warn-word { color:#a15c00 !important; }
.stack-form { display:block; }.stack-form > label { margin-top:14px; }
.resilio-settings-grid { grid-template-columns:repeat(3,minmax(190px,1fr)); }
.ips-settings-grid { grid-template-columns:repeat(4,minmax(170px,1fr)); }
.span-2 { grid-column:span 2; }
label small,.switch-card small,.feature-toggle-grid small { display:block; margin-top:5px; color:#71809b; font-weight:600; line-height:1.25; }
.switch-card { display:flex !important; align-items:center; gap:11px; min-height:56px; padding:11px 13px; border:1px solid var(--line); border-radius:14px; background:#f8fbff; margin:0; }
.switch-card input,.toggle-only input { position:absolute; opacity:0; pointer-events:none; }
.switch-ui { flex:0 0 auto; position:relative; display:inline-block; width:44px; height:24px; border-radius:999px; background:#b7c2d2; transition:.18s ease; box-shadow:inset 0 1px 3px #0002; }
.switch-ui:after { content:""; position:absolute; width:18px; height:18px; left:3px; top:3px; border-radius:50%; background:#fff; box-shadow:0 2px 5px #0003; transition:.18s ease; }
.switch-card input:checked + .switch-ui,.toggle-only input:checked + .switch-ui,.inline-switch input:checked + .switch-ui { background:#1769e8; }
.switch-card input:checked + .switch-ui:after,.toggle-only input:checked + .switch-ui:after,.inline-switch input:checked + .switch-ui:after { transform:translateX(20px); }
.switch-card.mini { min-height:auto; padding:8px 10px; }.switch-card.mini .switch-ui { transform:scale(.88); }
.feature-toggle-grid { display:grid; grid-template-columns:repeat(4,minmax(160px,1fr)); gap:10px; margin:14px 0; }
.feature-toggle-grid label { display:block; padding:12px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.feature-toggle-grid input { width:auto; display:inline-block; margin:0 7px 0 0; }
.sync-card-grid { display:grid; grid-template-columns:repeat(2,minmax(300px,1fr)); gap:14px; }
.sync-domain-card { border:1px solid #d8e2f0; border-radius:18px; padding:15px; background:#fbfdff; transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease; }
.sync-domain-card:hover { transform:translateY(-1px); box-shadow:0 10px 28px #17376c13; }
.sync-domain-card.is-enabled { border-color:#a7d9b8; background:linear-gradient(150deg,#fbfffc,#f2fbf5); }
.sync-domain-card > header { display:flex; justify-content:space-between; gap:12px; align-items:flex-start; }
.sync-domain-card > header > div { display:grid; grid-template-columns:auto 1fr; align-items:center; column-gap:8px; }
.sync-domain-card > header b { color:#071b55; font-size:17px; }.sync-domain-card > header small { grid-column:2; color:#71809b; }
.status-dot { width:10px; height:10px; border-radius:50%; background:#9aa8ba; box-shadow:0 0 0 4px #9aa8ba22; }.status-dot.online { background:#18a957; box-shadow:0 0 0 4px #18a95722; }
.sync-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:14px 0; }
.sync-stats span { padding:9px; border-radius:12px; background:#fff; border:1px solid #e3eaf3; }.sync-stats b,.sync-stats small { display:block; }.sync-stats b { color:#10235c; }.sync-stats small { color:#7a879d; font-size:11px; margin-top:3px; }
.path-line { margin:8px 0; overflow-wrap:anywhere; }.badge-row { display:flex; gap:6px; flex-wrap:wrap; }.badge-row span { padding:4px 7px; border-radius:999px; background:#eaf2ff; color:#214b95; font-size:11px; font-weight:900; }
.config-drawer { margin-top:12px; border-top:1px solid #e2e9f3; padding-top:10px; }.config-drawer summary { cursor:pointer; color:#0d4fbd; font-weight:900; }.drawer-form { display:grid; gap:10px; margin-top:12px; }.drawer-form label { margin:0; }.drawer-form textarea { min-height:58px; }
.checkbox-line.flat { margin:0; padding:7px 0; }.mini-toggle-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }.mini-toggle-grid label { padding:8px; background:#fff; border:1px solid #e0e8f4; border-radius:10px; font-size:12px; }.mini-toggle-grid input { width:auto; display:inline-block; margin:0 5px 0 0; }
.danger-soft { border-color:#efb4b4 !important; color:#9d2020 !important; background:#fff5f5 !important; }
.mode-selector { display:grid; grid-template-columns:repeat(3,1fr); gap:11px; margin-bottom:16px; }
.mode-selector label { position:relative; padding:14px; border:2px solid #dbe4f0; border-radius:16px; background:#fff; cursor:pointer; transition:.15s ease; }.mode-selector label:hover { border-color:#9ab9e8; }.mode-selector label.selected { border-color:#1769e8; background:#f1f6ff; box-shadow:0 0 0 4px #1769e811; }.mode-selector input { width:auto; margin:0 7px 0 0; display:inline-block; }.mode-selector b,.mode-selector small { display:block; }.mode-selector b { color:#10235c; }.mode-selector small { color:#687792; margin:6px 0 0 24px; line-height:1.35; }
.source-table { display:grid; gap:7px; margin:10px 0; }.source-row { display:grid; grid-template-columns:55px minmax(170px,.9fr) minmax(250px,1.5fr) 145px minmax(130px,.7fr) 36px; gap:8px; align-items:center; padding:9px; border:1px solid #dfe7f2; border-radius:13px; background:#fff; }.source-row.source-head { background:#f0f5fb; color:#52647e; font-size:11px; font-weight:900; text-transform:uppercase; }.source-row input,.source-row select { margin:0; padding:8px; border-radius:9px; min-width:0; }.source-row > span:nth-child(2) { display:grid; gap:5px; }.toggle-only { display:flex; justify-content:center; position:relative; }.toggle-only .switch-ui { transform:scale(.78); }.source-state { display:grid; gap:2px; }.source-state small { color:#71809b; font-size:10px; }.source-state em { color:#b42318; font-size:10px; font-style:normal; }.icon-button { border:0; border-radius:10px; background:#fff1f2; color:#b42318; font-weight:900; font-size:20px; cursor:pointer; padding:4px 8px; }
.split-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }.split-grid .card { margin:0; }
.country-bars { display:grid; gap:9px; }.country-bars > div { display:grid; grid-template-columns:38px 1fr 70px; gap:9px; align-items:center; }.country-bars span { font-weight:900; color:#163a7a; }.country-bars i { display:block; height:9px; border-radius:99px; background:#e4ebf5; overflow:hidden; }.country-bars i b { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#1d6feb,#28b3d5); }.country-bars strong { text-align:right; color:#3e4e69; }
.path-list { display:grid; grid-template-columns:130px 1fr; gap:9px; margin:0 0 14px; }.path-list dt { font-weight:900; color:#52647e; }.path-list dd { margin:0; overflow-wrap:anywhere; }
.search-strip { display:flex; gap:8px; margin-bottom:12px; }.search-strip input { flex:1; margin:0; }.table-scroll { overflow:auto; }.country-code { display:inline-flex; min-width:32px; justify-content:center; padding:4px 6px; border-radius:8px; background:#eaf2ff; color:#174b9c; font-weight:900; }.source-count { display:inline-flex; padding:3px 6px; border-radius:7px; background:#eef7f0; color:#18753a; font-size:11px; font-weight:900; }
@media (max-width:1250px) { .metrics-row.five { grid-template-columns:repeat(3,1fr); }.ips-settings-grid { grid-template-columns:repeat(2,1fr); }.source-row { grid-template-columns:45px 1fr 1.4fr; }.source-row > :nth-child(4),.source-row > :nth-child(5),.source-row > :nth-child(6) { grid-column:auto; }.source-head { display:none; } }
@media (max-width:900px) { .hero-status { align-items:flex-start; flex-direction:column; }.sync-card-grid,.split-grid { grid-template-columns:1fr; }.resilio-settings-grid,.feature-toggle-grid,.mode-selector { grid-template-columns:1fr 1fr; }.source-row { grid-template-columns:42px 1fr; }.source-row > * { grid-column:auto; }.source-row > input[name="source_url[]"],.source-row > select,.source-row > .source-state { grid-column:1 / -1; }.metrics-row.five { grid-template-columns:1fr 1fr; } }
@media (max-width:600px) { .metrics-row.five,.resilio-settings-grid,.feature-toggle-grid,.mode-selector,.ips-settings-grid { grid-template-columns:1fr; }.span-2 { grid-column:auto; }.sync-stats,.mini-toggle-grid { grid-template-columns:1fr 1fr; }.path-list { grid-template-columns:1fr; gap:3px; }.search-strip { flex-direction:column; } }

/* v0.2.1: accessible, responsive control center and visual analytics */
html { scroll-behavior:smooth; }
body { background:linear-gradient(145deg,#f7f9fd 0%,#eef3fa 48%,#e5edf7 100%); }
button, input, select, textarea, a { transition:border-color .16s ease, box-shadow .16s ease, background-color .16s ease, transform .16s ease; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline:3px solid #7cb5ff; outline-offset:2px; }
button:hover, .btn:hover, .primary:hover, .summary-card.clickable:hover { transform:translateY(-1px); }
button.is-busy { opacity:.72; cursor:progress; }
button.is-busy:after { content:"…"; margin-left:5px; }

.sidebar { z-index:60; width:270px; padding:14px; box-shadow:10px 0 32px #06122f36; }
.main { margin-left:270px; padding:26px clamp(18px,3vw,42px) 48px; max-width:1800px; }
.brand-card { padding:12px; border-radius:18px; }
.brand-card img { height:64px; }
.brand-card h2 { font-size:25px; }
.clock-card { margin:11px 0 13px; padding:11px; cursor:pointer; }
.clock-card em { display:block; margin-top:5px; color:#91a7d5; font-size:10px; font-style:normal; }
nav { gap:3px; }
.nav-section { margin:13px 9px 4px; color:#8fa8df; font-size:10px; font-weight:900; letter-spacing:1.5px; text-transform:uppercase; }
.nav-item { display:flex; align-items:center; gap:10px; min-height:42px; padding:9px 10px; border:1px solid transparent; }
.nav-item:hover { border-color:#ffffff1f; }
.nav-item.active { box-shadow:0 8px 18px #0002; }
.nav-icon { display:grid; place-items:center; flex:0 0 28px; width:28px; height:28px; border-radius:9px; background:#ffffff12; font-size:15px; }
.nav-item.active .nav-icon { background:#e8f1ff; color:#1268f3; }
.mobile-menu-button { display:none; position:fixed; z-index:80; left:12px; top:12px; align-items:center; gap:8px; padding:9px 13px; background:#071b55; color:#fff; }
.sidebar-backdrop { position:fixed; z-index:55; inset:0; background:#06122f99; backdrop-filter:blur(2px); }

.main-head { align-items:flex-start; margin-bottom:24px; }
.page-heading { min-width:0; }
.page-heading h1 { margin-top:5px; }
.page-heading p { margin:7px 0 0; color:#5d6f89; font-size:14px; line-height:1.45; }
.head-actions { justify-content:flex-end; flex-wrap:wrap; }
.lang-switch { display:inline-flex; align-items:center; gap:4px; padding:7px 9px; border:1px solid var(--line); border-radius:12px; background:#fff; font-size:11px; box-shadow:0 5px 18px #17376c12; }
.lang-switch b { color:#6b7b92; margin-right:2px; }
.lang-switch a { padding:4px 6px; border-radius:7px; font-weight:900; }
.lang-switch a.active { background:#e7efff; color:#0b4bb3; }
.user-chip { padding:10px 14px; }

.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr); gap:18px; margin-bottom:18px; }
.dashboard-grid .card { margin:0; min-width:0; }
.service-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.service-grid .pill { justify-content:center; min-height:36px; text-align:center; }
.chart-card { overflow:hidden; }
.chart-surface { width:100%; min-height:250px; position:relative; }
.chart-surface.chart-tall, .chart-tall { min-height:320px; }
.chart-fallback { margin-top:8px; padding:10px 12px; border-radius:11px; background:#f3f6fb; color:#687792; font-size:12px; text-align:center; }
.live-dot { color:#087b40 !important; background:#ddf9e8; border-radius:999px; padding:5px 8px; font-weight:900; letter-spacing:.6px; }
.summary-card.clickable { display:block; color:inherit; border:1px solid var(--line); border-top:5px solid var(--blue2); }
.summary-card.clickable small { display:block; margin-top:8px; color:#1769e8; font-weight:800; }
.quick-start { display:flex; align-items:center; justify-content:space-between; gap:22px; background:linear-gradient(120deg,#071b55,#123d9b); color:#fff; border:0; }
.quick-start h2 { margin:4px 0; font-size:25px; }
.quick-start p { margin:0; color:#d6e3ff; }
.quick-start .eyebrow { color:#61e8ff; }
.quick-action-grid { display:grid; grid-template-columns:repeat(2,minmax(150px,1fr)); gap:9px; min-width:min(520px,48%); }
.quick-action-grid .btn, .quick-action-grid .primary { display:flex; align-items:center; justify-content:center; min-height:44px; }

.friendly-checks label { align-items:flex-start !important; padding:10px; border:1px solid #dfe7f2; border-radius:12px; background:#fff; }
.friendly-checks label > span { display:block; }
.friendly-checks b, .friendly-checks small { display:block; }
.friendly-checks small { margin-top:3px; color:#71809b; font-weight:600; line-height:1.3; }
.accordion-stack { display:grid; gap:10px; margin-bottom:18px; }
.accordion-stack .card { margin:0; padding:0; overflow:hidden; }
.accordion-stack summary { display:flex; justify-content:space-between; gap:12px; padding:16px 18px; cursor:pointer; list-style:none; }
.accordion-stack summary::-webkit-details-marker { display:none; }
.accordion-stack summary:after { content:"＋"; color:#1769e8; font-weight:900; }
.accordion-stack details[open] summary:after { content:"−"; }
.accordion-stack summary span { color:#71809b; font-size:12px; }
.accordion-stack pre { margin:0 18px 18px; }

.ips-visuals { grid-template-columns:1fr 1fr; }
.map-grid { grid-template-columns:1.25fr .75fr; }
.country-map { width:100%; height:390px; border:1px solid #dce4ef; border-radius:15px; background:#edf2f8; overflow:hidden; }
.country-map .leaflet-container { font-family:inherit; }
.map-legend { display:grid; gap:4px; padding:9px 10px; border:1px solid #d7dfeb; border-radius:10px; background:#fffffff0; box-shadow:0 5px 16px #0b234426; color:#26364e; font-size:10px; }
.map-legend b { margin-bottom:2px; }
.map-legend span { display:flex; align-items:center; gap:6px; }
.map-legend i { display:inline-block; width:16px; height:9px; border:1px solid #aab5c5; }
.compact-bars { margin-top:10px; }
.public-blacklist-card { border-color:#abdabe; background:linear-gradient(120deg,#fbfffc,#f1faf5); }
.public-url-list { display:grid; gap:9px; }
.public-url-list > div { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; border:1px solid #cfe8d8; border-radius:13px; background:#fff; }
.public-url-list code { flex:1; margin:0; padding:7px 9px; overflow-wrap:anywhere; }
.compact-summary { grid-template-columns:repeat(3,1fr); gap:9px; margin:0 0 12px; }
.compact-summary .summary-card { padding:12px; border-top-width:3px; box-shadow:none; border-left:1px solid #e1e8f2; border-right:1px solid #e1e8f2; border-bottom:1px solid #e1e8f2; }
.compact-summary .summary-card strong { margin-top:6px; font-size:20px; }

.card-title.compact { margin-top:18px; }
.table-scroll { scrollbar-width:thin; }
tbody tr:hover { background:#f8fbff; }
input, select, textarea { min-height:44px; }
input[type="checkbox"], input[type="radio"] { min-height:0; }
.password-field { position:relative; display:block; }
.password-field input { padding-right:90px; }
.password-toggle { position:absolute; right:6px; top:50%; transform:translateY(-50%); padding:7px 10px; box-shadow:none; background:#eaf2ff; font-size:12px; cursor:pointer; }
.password-toggle:hover { transform:translateY(-50%); }

@media (max-width:1250px) {
  .main { padding-left:24px; padding-right:24px; }
  .dashboard-grid, .map-grid { grid-template-columns:1fr; }
  .quick-start { align-items:flex-start; flex-direction:column; }
  .quick-action-grid { min-width:0; width:100%; }
}
@media (max-width:980px) {
  .mobile-menu-button { display:flex; }
  .sidebar { position:fixed; inset:0 auto 0 0; width:min(310px,88vw); transform:translateX(-105%); transition:transform .2s ease; }
  .sidebar.is-open { transform:translateX(0); }
  body.sidebar-open { overflow:hidden; }
  .main { margin-left:0; padding:76px 18px 38px; }
  .main-head { flex-direction:column; }
  .head-actions { justify-content:flex-start; }
  .metrics-row, .metrics-row.five, .summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:720px) {
  h1 { font-size:30px; }
  .main { padding-left:12px; padding-right:12px; }
  .card, .hero-status { border-radius:15px; padding:15px; }
  .metrics-row, .metrics-row.five, .summary-grid, .ips-visuals { grid-template-columns:1fr; gap:11px; }
  .service-grid, .quick-action-grid, .compact-summary { grid-template-columns:1fr; }
  .head-actions { width:100%; gap:7px; }
  .head-actions .user-chip { max-width:100%; overflow:hidden; text-overflow:ellipsis; }
  .public-url-list > div { align-items:stretch; flex-direction:column; }
  .public-url-list .inline-actions { justify-content:flex-end; }
  .country-map { height:330px; }
  .chart-surface { min-height:230px; }
  .source-row { padding:11px; }
  .table-scroll table { min-width:760px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *:before, *:after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}


/* v0.2.1: polished authentication screen */
.login-screen { position:relative; min-height:100vh; padding:24px; background:radial-gradient(circle at 18% 20%,#1b4dcc,#071b55 42%,#06143f 72%); }
.login-screen::after { content:""; position:fixed; inset:0; pointer-events:none; background:radial-gradient(circle at 82% 82%,rgba(49,213,255,.22),transparent 28%); }
.login-shell { position:relative; z-index:1; width:min(880px,96vw); grid-template-columns:310px minmax(340px,1fr); gap:0; border-radius:24px; overflow:hidden; box-shadow:0 25px 80px rgba(0,8,35,.5); }
.logo-card,.login-card { border-radius:0; box-shadow:none; }
.logo-card { display:flex; flex-direction:column; justify-content:center; min-height:480px; padding:30px; }
.logo-card p { margin:16px 0 0; color:#b8c9eb; line-height:1.55; }
.login-card { display:flex; flex-direction:column; justify-content:center; padding:38px; }
.login-card h1 { margin-bottom:9px; font-size:35px; }
.login-card > p { margin:0 0 22px; color:#65758e; line-height:1.5; }
.login-card .login-submit { width:100%; margin-top:5px; }
.login-server { display:flex; align-items:center; gap:10px; margin-top:26px; padding:12px; border:1px solid rgba(255,255,255,.14); border-radius:12px; background:rgba(0,0,0,.12); color:#fff; font-size:12px; font-weight:850; overflow-wrap:anywhere; }
.login-server > span:last-child { min-width:0; }
.login-server small { display:block; margin-top:2px; color:#9fb6e8; }
.login-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:15px; color:#75849a; font-size:11px; font-weight:700; }
.login-footer .lang-switch { margin:0; }
@media (max-width:680px) {
  .login-screen { padding:12px; }
  .login-shell { grid-template-columns:1fr; }
  .logo-card { min-height:auto; padding:24px; }
  .logo-card img { max-height:72px; }
  .logo-card p { display:none; }
  .login-server { margin-top:16px; }
  .login-card { padding:26px 20px; }
  .login-footer { align-items:flex-start; flex-direction:column; }
}

/* v0.2.3: quiet text navigation with bold category headings */
.sidebar nav { display:grid; gap:3px; }
.nav-section { margin:16px 10px 5px; color:#dbe7ff; font-size:12px; font-weight:800; letter-spacing:.25px; text-transform:none; }
.nav-item { display:block; min-height:40px; padding:10px 12px; border:1px solid transparent; border-radius:9px; font-weight:400; }
.nav-item:hover { background:#ffffff12; border-color:#ffffff1c; }
.nav-item.active { background:#fff; color:#071b55; border-color:#fff; box-shadow:0 7px 18px #0002; font-weight:400; }
.nav-label { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nav-chevron,.nav-icon { display:none !important; }
.chart-surface.chart-ready + .chart-fallback { display:none; }
.chart-error { display:grid; place-items:center; min-height:180px; padding:20px; border:1px dashed #c8d1df; border-radius:12px; color:#6d7890; text-align:center; }

/* MikroTik exports */
.export-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.export-grid article { display:grid; gap:8px; padding:14px; border:1px solid #dfe6f1; border-radius:12px; background:#f8faff; }
.export-grid code { display:block; overflow-wrap:anywhere; font-size:11px; }
@media (max-width:900px) { .export-grid { grid-template-columns:1fr; } }

/* Resilio native administration */
.management-mode-card { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:0 0 16px; padding:17px 20px; border:1px solid #d8e1ef; border-left:5px solid #1268f3; border-radius:14px; background:#f8faff; }
.management-mode-card.native { border-left-color:#16825d; background:#f2fbf7; }
.management-mode-card h3, .native-webui-settings h3 { margin:3px 0 5px; }
.management-mode-card p { margin:0; color:#66748a; }
.management-mode-card > div:last-child { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.management-mode-card code { max-width:480px; overflow-wrap:anywhere; }
.native-admin-link { text-decoration:none; white-space:nowrap; }
.native-webui-settings { padding:16px; border:1px solid #dfe6f1; border-radius:14px; background:#f8faff; }
.resilio-mode-selector { grid-template-columns:repeat(2,minmax(0,1fr)); }
.inline-notice { margin:0 0 14px; padding:12px 14px; border-radius:11px; background:#eef6ff; color:#23436d; }
.inline-notice.warn { background:#fff6df; color:#724d00; border:1px solid #f2d38a; }
@media (max-width:800px) { .management-mode-card { align-items:flex-start; flex-direction:column; } .management-mode-card > div:last-child { justify-content:flex-start; } .resilio-mode-selector { grid-template-columns:1fr; } }

/* v0.2.3 IPS/IDS alignment */
.country-overview-grid { display:grid; grid-template-columns:minmax(320px,.9fr) minmax(360px,1.1fr); gap:22px; align-items:center; }
.country-table-wrap { max-height:390px; }
.compact-table th,.compact-table td { padding:9px 10px; vertical-align:middle; }
.compact-table thead th { position:sticky; top:0; z-index:1; background:#f5f8fc; }
.settings-table-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:4px 0 22px; }
.settings-table-panel { border:1px solid #dce4ef; border-radius:14px; overflow:hidden; background:#fbfdff; }
.settings-table-panel h3 { margin:0; padding:13px 15px; border-bottom:1px solid #dce4ef; background:#f3f7fc; font-size:15px; color:#15346c; }
.settings-table { width:100%; border-collapse:collapse; }
.settings-table th,.settings-table td { padding:11px 12px; border-bottom:1px solid #e5ebf3; text-align:left; vertical-align:middle; }
.settings-table tr:last-child th,.settings-table tr:last-child td { border-bottom:0; }
.settings-table th { width:28%; color:#233a61; font-size:12px; }
.settings-table td:nth-child(2) { width:28%; }
.settings-table td:last-child { color:#61708a; font-size:12px; line-height:1.45; }
.settings-table input,.settings-table select { margin:0; min-width:110px; }
.settings-table input[type=number] { width:120px; }
.settings-table input[name=geoip_url_template] { width:100%; }
.input-unit { margin-left:6px; color:#64748b; font-size:12px; }
.inline-switch { display:inline-flex; align-items:center; gap:8px; cursor:pointer; white-space:nowrap; }
.inline-switch input { position:absolute; opacity:0; pointer-events:none; }
.inline-switch .switch-ui { flex:0 0 auto; }
.local-source { background:#e8f1ff; color:#174b9c; }
.refresh-history-card td strong { color:#18753a; }
@media (max-width:1050px) { .country-overview-grid,.settings-table-grid { grid-template-columns:1fr; } .country-table-wrap { max-height:none; } }
@media (max-width:650px) { .settings-table th,.settings-table td { min-width:150px; } .country-overview-grid { gap:10px; } }

/* v0.2.4: table-first Resilio layout and Top 9 country chart */
.resilio-status-table th { width:190px; color:#233a61; }
.resilio-status-table td:nth-child(2) { width:160px; white-space:nowrap; }
.resilio-status-table code { overflow-wrap:anywhere; }
.resilio-table-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:18px; }
.resilio-table-grid .settings-table-panel { min-width:0; }
.resilio-table-grid .settings-table td:nth-child(2) { width:34%; }
.resilio-table-grid input:not([type=checkbox]),
.resilio-table-grid select,
.resilio-table-grid textarea { width:100%; }
.country-ranking-card .country-table-wrap { max-height:none; margin-bottom:22px; }
.country-pie-chart { width:60%; height:370px; min-height:370px; margin-left:auto; margin-right:auto; }
@media (max-width:1050px) {
  .resilio-table-grid { grid-template-columns:1fr; }
  .country-pie-chart { width:82%; }
}
@media (max-width:720px) {
  .country-pie-chart { width:100%; height:330px; min-height:330px; }
  .resilio-status-table th,.resilio-status-table td { min-width:150px; }
}

/* v0.2.5: reliable chart rendering and local CanvasJS fallback */
.fallback-chart-ready { display:grid; grid-template-columns:minmax(220px,320px) minmax(240px,1fr); gap:28px; align-items:center; justify-content:center; padding:18px; }
.fallback-pie-visual { width:min(290px,70vw); aspect-ratio:1; border-radius:50%; margin:auto; display:grid; place-items:center; box-shadow:inset 0 0 0 1px rgba(0,0,0,.08); }
.fallback-pie-visual span { display:grid; place-items:center; width:42%; aspect-ratio:1; border-radius:50%; background:#fff; color:#17356d; font-weight:900; box-shadow:0 2px 12px rgba(21,52,108,.12); }
.fallback-pie-legend { margin:0; padding:0; list-style:none; display:grid; gap:8px; }
.fallback-pie-legend li { display:grid; grid-template-columns:14px 44px 1fr; gap:8px; align-items:center; padding:6px 8px; border-bottom:1px solid #e6ebf2; }
.fallback-pie-legend i { width:12px; height:12px; border-radius:3px; }
.fallback-pie-legend span { color:#63718a; text-align:right; font-variant-numeric:tabular-nums; }
@media (max-width:720px) { .fallback-chart-ready { grid-template-columns:1fr; } }

/* v0.3.0: structured websites/domains overview */
.domain-metrics .compact-value { font-size:clamp(24px,2.1vw,36px); }
.domains-overview-table { min-width:1180px; }
.domains-overview-table th:nth-child(1) { width:20%; }
.domains-overview-table th:nth-child(2) { width:22%; }
.domains-overview-table th:nth-child(3) { width:16%; }
.domains-overview-table th:nth-child(4) { width:17%; }
.domains-overview-table th:nth-child(5) { width:25%; }
.domain-name-cell,.domain-stat-stack { display:flex; flex-direction:column; gap:5px; min-width:0; }
.domain-name-cell > b { font-size:16px; color:#071b55; }
.domain-name-cell a,.domain-stat-stack code { overflow-wrap:anywhere; word-break:break-word; }
.domain-stat-stack > strong { color:#071b55; font-size:15px; }
.domain-stat-stack > span,.domain-stat-stack > small,.domain-name-cell > small { color:#63718a; }
.domain-service-table { display:grid; grid-template-columns:minmax(72px,auto) minmax(90px,1fr); gap:8px 12px; align-items:center; }
.domain-service-table > span:nth-child(odd) { color:#63718a; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.domain-service-table .pill { justify-self:start; }
.domain-usage-card .chart-surface { min-height:360px; }
@media (max-width:900px) { .domain-metrics { grid-template-columns:1fr 1fr; } }
@media (max-width:560px) { .domain-metrics { grid-template-columns:1fr; } }

/* Cluster v2 */
.cluster-metrics .compact-value { font-size:clamp(20px,1.8vw,30px); }
.cluster-add-form { display:block; }
.cluster-add-grid { grid-template-columns:1.2fr 1.2fr .8fr; align-items:end; }
.cluster-bootstrap { grid-column:1 / -1; padding:11px 13px; border:1px solid #dce4ef; border-radius:12px; background:#f8fbff; }
.cluster-identity-table td:nth-child(2) { width:38%; }
.copy-inline { display:flex; flex-wrap:wrap; gap:7px; align-items:center; }
.masked-secret { display:inline-block; max-width:360px; overflow-wrap:anywhere; }
.cluster-peer-table td { vertical-align:top; }
.cluster-peer-table .actions { min-width:220px; }
.cluster-settings-grid { margin-bottom:12px; }
@media (max-width:1050px) { .cluster-add-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:650px) { .cluster-add-grid { grid-template-columns:1fr; } .cluster-bootstrap { grid-column:auto; } }
.fallback-bar-chart { display:flex; flex-direction:column; gap:11px; padding:8px 2px; }
.fallback-bar-row { display:grid; grid-template-columns:minmax(130px,220px) 1fr minmax(92px,auto); gap:10px; align-items:center; }
.fallback-bar-row > b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#17346c; }
.fallback-bar-row > small { text-align:right; color:#66758d; }
.fallback-bar-track { height:20px; display:flex; overflow:hidden; border-radius:7px; background:#edf2f8; }
.fallback-bar-web { background:#286bd6; }
.fallback-bar-db { background:#31a17c; }
@media (max-width:650px) { .fallback-bar-row { grid-template-columns:1fr; gap:4px; } .fallback-bar-row > small { text-align:left; } }

/* v0.3.1: clearer hosted websites table and live cluster peers */
.domains-overview-table { min-width:1080px; table-layout:fixed; }
.domains-overview-table th:nth-child(1) { width:17%; }
.domains-overview-table th:nth-child(2) { width:18%; }
.domains-overview-table th:nth-child(3) { width:13%; }
.domains-overview-table th:nth-child(4) { width:14%; }
.domains-overview-table th:nth-child(5) { width:16%; }
.domains-overview-table th:nth-child(6) { width:22%; }
.domains-overview-table tbody > tr:not(.edit-row):nth-child(4n+1) { background:#fbfdff; }
.domains-overview-table tbody > tr:not(.edit-row):hover { background:#f2f7ff; }
.domains-overview-table thead th { position:sticky; top:0; z-index:2; background:#f5f8fc; }
.domain-actions { min-width:0; }
.domain-actions .action-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; width:100%; }
.domain-actions .action-grid form { display:block; }
.domain-actions .action-tile { display:flex; width:100%; min-height:35px; align-items:center; justify-content:center; margin:0; padding:8px 9px; border:1px solid #d8e3f2; border-radius:9px; background:#f7faff; color:#15346c; font-size:12px; font-weight:800; text-decoration:none; box-shadow:none; cursor:pointer; }
.domain-actions .action-tile:hover { background:#eaf2ff; border-color:#b8cff2; }
.domain-tools-menu { grid-column:1 / -1; border:1px solid #d8e3f2; border-radius:10px; background:#fff; }
.domain-tools-menu summary { padding:9px 11px; color:#17366f; font-size:12px; font-weight:900; cursor:pointer; list-style:none; }
.domain-tools-menu summary::-webkit-details-marker { display:none; }
.domain-tools-menu summary::after { content:'+'; float:right; }
.domain-tools-menu[open] summary::after { content:'−'; }
.domain-tools-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:0 8px 8px; }
.password-change-panel { border-color:#c7d9f5; background:#f5f9ff; }
.password-change-panel h3 { margin:0 0 9px; color:#15346c; }

.cluster-peer-table { min-width:1080px; table-layout:fixed; }
.cluster-peer-table th:nth-child(1) { width:25%; }
.cluster-peer-table th:nth-child(2) { width:31%; }
.cluster-peer-table th:nth-child(3) { width:23%; }
.cluster-peer-table th:nth-child(4) { width:21%; }
.cluster-peer-table tbody tr:hover { background:#f7faff; }
.peer-metrics { display:grid; gap:11px; min-width:250px; }
.peer-meter { display:grid; gap:5px; }
.peer-meter > span { display:flex; justify-content:space-between; gap:10px; color:#40516e; font-size:12px; font-weight:800; }
.peer-meter > span b { color:#102f68; font-variant-numeric:tabular-nums; }
.peer-meter > div { height:10px; overflow:hidden; border-radius:999px; background:#e7edf5; box-shadow:inset 0 1px 2px #0b25521a; }
.peer-meter > div > i { display:block; height:100%; min-width:2px; border-radius:999px; background:linear-gradient(90deg,#1268f3,#35b7de); transition:width .45s ease; }
.peer-meter > div > i.meter-warn { background:linear-gradient(90deg,#f0a118,#ffd25b); }
.peer-meter > div > i.meter-bad { background:linear-gradient(90deg,#c72543,#ff657b); }
.peer-meter small,.peer-metrics > small { color:#68778f; font-size:11px; }
.peer-metrics > small.metric-error { color:#a41330; font-weight:800; }
.metrics-loading .peer-metrics { opacity:.72; }
.cluster-peer-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; min-width:0 !important; }
.cluster-peer-actions form { display:block; }
.cluster-peer-actions button { width:100%; }
.warn-button { background:#fff0cc !important; color:#7b4d00 !important; }
.warn-button:hover { background:#ffe3a1 !important; }

@media (max-width:760px) {
  .domain-tools-grid,.domain-actions .action-grid,.cluster-peer-actions { grid-template-columns:1fr; }
  .domain-tools-menu { grid-column:auto; }
}
.password-input-row { display:grid; grid-template-columns:1fr auto; gap:7px; align-items:center; margin-top:6px; }
.password-input-row input { margin:0; }
.password-input-row button { height:44px; }
.tab-form { margin:0; display:inline-flex; }
.tab-form .tab { font:inherit; cursor:pointer; appearance:none; }
.attention-card { border-left:4px solid #e0a100; }

/* v0.3.8: seven-day access sparklines */
.stats-table { min-width:820px; }
.stats-table th:last-child,.stats-table td:last-child { width:150px; text-align:right; }
.weekly-sparkline { display:inline-flex; align-items:center; justify-content:flex-end; gap:7px; min-width:132px; color:#286bd6; }
.weekly-sparkline svg { width:104px; height:28px; overflow:visible; }
.weekly-sparkline polyline { fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.weekly-sparkline circle { fill:#fff; stroke:currentColor; stroke-width:1.5; vector-effect:non-scaling-stroke; }
.weekly-sparkline small { min-width:34px; color:#5f6f87; font-variant-numeric:tabular-nums; text-align:right; }

/* v0.3.8: automatic Resilio shares */
.resilio-shares-table { min-width:1120px; }
.resilio-key-actions { display:flex; flex-wrap:wrap; gap:6px; min-width:150px; }
.resilio-key-actions form { margin:0; }
.backup-share-row { background:#f7fbff; }
