:root {
  --ac-bg: var(--vt-bg); --ac-panel: var(--vt-surface); --ac-inset: var(--vt-surface-2); --ac-line: var(--vt-border); --ac-sep: var(--vt-border-soft);
  --ac-edge: #d3d9e4; --ac-hover: #f1f4f9;
  --ac-text: var(--vt-text); --ac-muted: #5f6b7d; --ac-soft: var(--vt-text-soft); --ac-accent: var(--vt-a-600); --ac-accent-hover: var(--vt-a-700);
  --ac-accent-on: var(--vt-a-soft-light); --ac-link: var(--vt-a-600); --ac-ok: var(--vt-ok); --ac-warn: var(--vt-warn); --ac-bad: var(--vt-danger-text);
  --ac-warn-text: var(--vt-warn-text);
  --ac-link-hover: var(--vt-a-700); --ac-strong: var(--vt-text); --ac-ghost-text: #3f4857; --ac-nav-text: #3f4857; --ac-on-soft: var(--vt-a-700);
  --ac-search: var(--vt-surface-2); --ac-shadow: rgba(23, 28, 38, .16);
  --ac-bad-hover-bg: var(--vt-danger-soft); --ac-bad-border: var(--vt-danger-border); --ac-bad-bg: var(--vt-danger-soft); --ac-bad-hover: #fbdcdc; --ac-bad-sub: #7f1d1d;
  --ac-ok-border: var(--vt-ok-border); --ac-ok-bg: var(--vt-ok-soft); --ac-ok-chip: var(--vt-ok-soft); --ac-ok-sub: #0a6b3b; --ac-ok-tile: var(--vt-ok-soft);
  --ac-warn-border: var(--vt-warn-border); --ac-warn-bg: var(--vt-warn-soft); --ac-warn-bg2: var(--vt-warn-soft); --ac-warn-chip: #fbe8c8; --ac-warn-chip2: #f8dfb4;
  --ac-warn-note: #fbe8c8; --ac-warn-sub: #7a4a14; --ac-warn-letters: #f8dfb4;
  --ac-owner-bg: var(--vt-warn-soft); --ac-staff-bg: var(--vt-a-deep-light); --ac-staff-text: #3730a3; --ac-customer-bg: #d9f5f1; --ac-customer-text: #0f766e;
  --ac-pill-bg: #e9edf4; --ac-tab-edge: #d3d9e4; --ac-tab-on-edge: #c7cdf5; --ac-tab-count: #3f4857; --ac-bar: #c7cdf5; --ac-bar-on: var(--vt-a-600);
}
[data-bs-theme="dark"] {
  --ac-bg: #0a0e18; --ac-panel: #111726; --ac-inset: #0f1422; --ac-line: #1e2638; --ac-sep: #1a2132;
  --ac-edge: #2a3348; --ac-hover: #151c2e;
  --ac-text: #e9ecf4; --ac-muted: #8790a4; --ac-soft: #a3abbd; --ac-accent: #5558e8; --ac-accent-hover: #4649d6;
  --ac-accent-on: #1f2654; --ac-link: #a5b4fc; --ac-ok: #4ade80; --ac-warn: #fbbf24; --ac-bad: #fca5a5;
  --ac-warn-text: #fcd34d;
  --ac-link-hover: #c7d2fe; --ac-strong: #fff; --ac-ghost-text: #d6dbe6; --ac-nav-text: #c3c9d6; --ac-on-soft: #c7d2fe;
  --ac-search: #141a2a; --ac-shadow: rgba(0, 0, 0, .45);
  --ac-bad-hover-bg: #1f1418; --ac-bad-border: #4a1f24; --ac-bad-bg: #1a1012; --ac-bad-hover: #2c1416; --ac-bad-sub: #d1a9ad;
  --ac-ok-border: #1d3a2c; --ac-ok-bg: #0f1d18; --ac-ok-chip: #123425; --ac-ok-sub: #9fc7b3; --ac-ok-tile: #0f2a1f;
  --ac-warn-border: #3a3115; --ac-warn-bg: #1c1a10; --ac-warn-bg2: #1b170c; --ac-warn-chip: #2a2110; --ac-warn-chip2: #33290f;
  --ac-warn-note: #2a2410; --ac-warn-sub: #c9b98a; --ac-warn-letters: #3a3115;
  --ac-owner-bg: #2a2110; --ac-staff-bg: #1a1f45; --ac-staff-text: #c7d2fe; --ac-customer-bg: #0e2a28; --ac-customer-text: #5eead4;
  --ac-pill-bg: #1e2638; --ac-tab-edge: #222b40; --ac-tab-on-edge: #3a4266; --ac-tab-count: #d6dbe6; --ac-bar: #2e3766; --ac-bar-on: #818cf8;
}
[v-cloak] { display: none; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--ac-bg); color: var(--ac-text); font: 14px/1.5 Inter, system-ui, sans-serif; }
a { color: var(--ac-link); text-decoration: none; }
a:hover { color: var(--ac-link-hover); }
h1 { font-size: 22px; margin: 0 0 16px; font-weight: 600; }
h2 { font-size: 15px; margin: 28px 0 12px; font-weight: 600; }
.ac-muted { color: var(--ac-muted); }
.ac-center { min-height: 100vh; display: flex; align-items: center; justify-content: center; }
.ac-gate { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 16px; }
.ac-card { width: 100%; max-width: 400px; background: var(--ac-panel); border: 1px solid var(--ac-line); border-radius: 18px; padding: 28px; }
.ac-brand { display: flex; align-items: center; gap: 10px; font-weight: 600; margin-bottom: 20px; }
.ac-logo-image { width: 32px; height: 32px; border-radius: 9px; object-fit: contain; background: #fff; }
.ac-logo { width: 32px; height: 32px; border-radius: 9px; background: var(--ac-accent); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 17px; }
label { display: block; margin: 0 0 14px; color: var(--ac-soft); font-size: 13px; }
label small { color: var(--ac-muted); }
input, textarea, select { display: block; width: 100%; margin-top: 6px; height: 40px; padding: 0 12px; border-radius: 10px; border: 1px solid var(--ac-edge); background: var(--ac-inset); color: var(--ac-text); font: inherit; }
textarea { height: auto; padding: 10px 12px; resize: vertical; }
input:focus, textarea:focus, select:focus { outline: 2px solid var(--ac-accent); outline-offset: 0; }
input:disabled { opacity: .6; }

.ac-primary, .ac-bp { background: var(--ac-accent); color: #fff; border: 0; border-radius: 10px; height: 38px; padding: 0 16px; font: 600 13px Inter, sans-serif; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.ac-primary { width: 100%; }
.ac-form .ac-primary, .ac-primary.ac-inline { width: auto; }
.ac-primary:hover, .ac-bp:hover { background: var(--ac-accent-hover); color: #fff; }
.ac-primary:disabled, .ac-bp:disabled { opacity: .6; cursor: default; }
.ac-ghost, .ac-bs { background: transparent; color: var(--ac-ghost-text); border: 1px solid var(--ac-edge); border-radius: 10px; height: 36px; padding: 0 14px; font: 600 13px Inter, sans-serif; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.ac-ghost:hover, .ac-bs:hover { background: var(--ac-hover); color: var(--ac-strong); }
.ac-bt { background: transparent; color: var(--ac-soft); border: 0; border-radius: 10px; padding: 0 10px; height: 38px; font: 600 13px Inter, sans-serif; cursor: pointer; }
.ac-bt:hover { background: var(--ac-bad-hover-bg); color: var(--ac-bad); }
.ac-bd { background: transparent; color: var(--ac-bad); border: 1px solid var(--ac-bad-border); border-radius: 10px; padding: 0 14px; height: 36px; font: 600 13px Inter, sans-serif; cursor: pointer; }
.ac-bd:hover { background: var(--ac-bad-hover); }
.ac-ib { width: 40px; height: 40px; border-radius: 999px; border: 0; background: transparent; color: var(--ac-nav-text); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.ac-ib:hover { background: var(--ac-hover); }
.ac-links { display: flex; justify-content: space-between; margin-top: 14px; font-size: 13px; }
.ac-notice { color: var(--ac-ok); margin: 14px 0 0; }
.ac-error { color: var(--ac-bad); margin: 14px 0 0; }
.ac-banner { margin: 0; padding: 12px 16px; border-radius: 14px; border: 1px solid var(--ac-ok-border); background: var(--ac-ok-bg); color: var(--ac-ok); }
.ac-banner.ac-bad { border-color: var(--ac-bad-border); background: var(--ac-bad-bg); color: var(--ac-bad); }
.ac-foot { color: var(--ac-muted); font-size: 12px; margin: 22px 0 0; }
.ac-foot-links { max-width: 1440px; margin: 0 auto; padding: 0 32px 28px; }
.ac-foot-links .vt-auth-foot { max-width: none; padding: 0; margin: 0; }
.ac-foot-links .vt-auth-foot a { color: var(--ac-muted); }

.vt-icon { width: 20px; height: 20px; flex: none; fill: none; }
.ac-search-box .vt-icon { width: 18px; height: 18px; }
.ac-bp .vt-icon, .ac-bs .vt-icon { width: 15px; height: 15px; }
.ac-bp .vt-icon:first-child { width: 16px; height: 16px; }
.rw .go .vt-icon { width: 18px; height: 18px; }

.ac-top { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 12px 24px; border-bottom: 1px solid var(--ac-sep); }
.ac-top-brand { display: flex; align-items: center; gap: 10px; color: var(--ac-text); min-width: 220px; }
.ac-top-brand:hover { color: var(--ac-text); }
.ac-top-brand span:last-child { font-size: 19px; font-weight: 600; letter-spacing: -0.01em; }
.ac-top-brand b { font-weight: 400; color: var(--ac-soft); }
.ac-search { position: relative; flex: 1 1 320px; max-width: 680px; margin: 0; }
.ac-search-box { display: flex; align-items: center; gap: 12px; height: 46px; padding: 0 18px; background: var(--ac-search); border: 1px solid var(--ac-line); border-radius: 999px; color: var(--ac-muted); }
.ac-search input { flex: 1; min-width: 0; margin: 0; height: auto; padding: 0; background: transparent; border: 0; outline: none; color: var(--ac-text); font: 400 15px Inter, sans-serif; }
.ac-search input:focus { outline: none; }
.ac-search-list { position: absolute; left: 0; right: 0; top: 52px; z-index: 20; background: var(--ac-panel); border: 1px solid var(--ac-line); border-radius: 16px; padding: 6px; box-shadow: 0 12px 32px var(--ac-shadow); }
.ac-search-list a { display: block; padding: 10px 14px; border-radius: 10px; color: var(--ac-text); font-weight: 500; }
.ac-search-list a:hover { background: var(--ac-hover); }
.ac-search-list p { margin: 0; padding: 10px 14px; color: var(--ac-muted); }
.ac-top-end { margin-left: auto; display: flex; align-items: center; gap: 4px; position: relative; }
.ac-avatar { width: 36px; height: 36px; border-radius: 999px; background: var(--ac-accent-on); border: 2px solid var(--ac-accent); color: var(--ac-on-soft); display: inline-flex; align-items: center; justify-content: center; font-weight: 600; font-size: 13px; flex: none; }
.ac-avatar.ac-big { width: 96px; height: 96px; border-width: 3px; font-size: 34px; }
.ac-avatar img { width: 100%; height: 100%; border-radius: 999px; object-fit: cover; display: block; }

.ac-photo { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 10px; }
.ac-photo-main { flex: 1 1 220px; min-width: 0; }
input[type="file"][hidden] { display: none; }
.ac-notify-head { padding: 18px 22px 8px; }
.ac-notify-more { margin-top: 10px; }
.ac-notify-locked { margin: 6px 0 0; padding-left: 18px; font-size: 13px; color: var(--ac-muted); }
.ac-privacy-list { margin: 8px 0 12px; padding-left: 18px; font-size: 13px; line-height: 1.6; }

.ac-stack { display: flex; flex-direction: column; gap: 16px; }
.ac-privacy-form { margin-top: 16px; }
.ac-notify-row { padding: 14px 22px; border-top: 1px solid var(--ac-sep); }
.ac-notify-toggle { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; }

.ac-notify-toggle input { display: inline-block; width: 16px; height: 16px; margin: 0; padding: 0; accent-color: var(--ac-accent); }

.ac-shell { min-height: 100vh; }
.ac-body { display: flex; flex-wrap: wrap; max-width: 1440px; margin: 0 auto; }

.ac-nav { flex: 0 0 290px; padding: 20px 12px; display: flex; flex-direction: column; gap: 2px; }
.ac-nav a { display: flex; align-items: center; gap: 14px; padding: 11px 16px; border-radius: 999px; color: var(--ac-nav-text); font-size: 14px; font-weight: 500; white-space: nowrap; }
.ac-nav a:hover { background: var(--ac-hover); color: var(--ac-strong); }
.ac-nav a.on { background: var(--ac-accent-on); color: var(--ac-on-soft); }
.ac-came { margin: 20px 4px 0; padding: 14px; border: 1px solid var(--ac-line); border-radius: 14px; display: flex; flex-direction: column; gap: 4px; }
.ac-came small { font-size: 12px; color: var(--ac-muted); }
.ac-came b { font-weight: 600; font-size: 14px; }
.ac-nav .ac-came a { padding: 0; margin-top: 8px; gap: 6px; font-size: 13px; font-weight: 600; border-radius: 0; }
.ac-main { flex: 999 1 640px; min-width: 0; padding: 28px 32px 64px; display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.ac-center-col { flex: 999 1 540px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.ac-aside { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.ac-single { max-width: 720px; }
.ac-title h1 { margin: 0; font-size: 28px; font-weight: 600; letter-spacing: -0.02em; }
.ac-title p { margin: 6px 0 0; color: var(--ac-soft); font-size: 15px; line-height: 1.55; }

.ac-box { border: 1px solid var(--ac-line); border-radius: 18px; background: var(--ac-panel); padding: 20px 22px; }
.ac-box.ac-flush { padding: 0; overflow: hidden; }
.ac-box.ac-side { padding: 18px; }
.ac-box.ac-inset { background: var(--ac-inset); }
.ac-box h2 { margin: 0; font-size: 18px; font-weight: 600; }
.ac-box.ac-side h2 { font-size: 16px; }
.ac-box-sub { margin-top: 4px; color: var(--ac-soft); font-size: 13px; }
.ac-box-head { padding: 20px 22px 14px; display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ac-box-head h2 { margin: 0; }
.ac-box p { margin: 0; }
.ac-side-lead { margin: 6px 0 14px !important; color: var(--ac-soft); font-size: 13px; line-height: 1.55; }
.ac-box:not(.ac-flush) > .ac-box-head { padding: 0 0 4px; }
.ac-box:not(.ac-flush) > .ac-line { padding-left: 0; padding-right: 0; }

.ac-role { padding: 2px 8px; border-radius: 6px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.ac-role.owner, .ac-letters.owner { background: var(--ac-owner-bg); color: var(--ac-warn-text); }
.ac-role.staff, .ac-letters.staff { background: var(--ac-staff-bg); color: var(--ac-staff-text); }
.ac-role.customer, .ac-letters.customer { background: var(--ac-customer-bg); color: var(--ac-customer-text); }

.ac-invite { border: 1px solid var(--ac-warn-border); border-radius: 18px; background: var(--ac-warn-bg); padding: 18px 20px; margin-bottom: 20px; }
.ac-invite-head { font-size: 12px; font-weight: 600; letter-spacing: 0.06em; color: var(--ac-warn-text); }
.ac-invite-row { margin-top: 12px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.ac-invite-main { flex: 1 1 260px; min-width: 0; }
.ac-letters.ac-invite-letters { background: var(--ac-warn-letters); color: var(--ac-warn-text); }
.ac-invite-title { font-weight: 600; font-size: 15px; }
.ac-invite-sub { color: var(--ac-warn-sub); font-size: 13px; margin-top: 3px; line-height: 1.5; }
.ac-invite-line { margin: 0 16px 8px; padding: 14px 16px; border-radius: 14px; background: var(--ac-warn-bg); border: 1px solid var(--ac-warn-border);
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.ac-invite-form { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--ac-warn-border); }
.ac-invite-pick { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; cursor: pointer; }
.ac-invite-pick input { width: auto; margin: 0; }
.ac-invite-warn { margin: 4px 0 10px; padding: 10px 12px; border-radius: 10px; background: var(--ac-warn-note); color: var(--ac-warn-text); font-size: 13px; line-height: 1.5; }
.ac-letters { width: 40px; height: 40px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; flex: none; }
.ac-letters.ac-lg { width: 44px; height: 44px; border-radius: 12px; }
.ac-letters.ac-sm { width: 32px; height: 32px; border-radius: 9px; font-size: 12px; }
.ac-pill { padding: 2px 8px; border-radius: 6px; background: var(--ac-pill-bg); color: var(--ac-soft); font-size: 11px; font-weight: 600; white-space: nowrap; }
.ac-pill.ac-good { background: var(--ac-ok-chip); color: var(--ac-ok); }

.ac-hero { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 16px 0 8px; }
.ac-hero h1 { margin: 16px 0 0; font-size: 30px; font-weight: 600; letter-spacing: -0.02em; }
.ac-hero-sub { margin-top: 4px; color: var(--ac-soft); font-size: 15px; }
.ac-hero-roles { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.ac-hero-role { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; font-size: 13px; font-weight: 500; }
.ac-hero-role i { width: 7px; height: 7px; border-radius: 99px; background: currentColor; }
.ac-hero-role.owner { background: var(--ac-owner-bg); color: var(--ac-warn-text); }
.ac-hero-role.staff { background: var(--ac-staff-bg); color: var(--ac-staff-text); }
.ac-hero-role.customer { background: var(--ac-customer-bg); color: var(--ac-customer-text); }
.ac-hero-lead { margin: 14px 0 0; color: var(--ac-muted); font-size: 13px; max-width: 520px; line-height: 1.55; }
.ac-shortcuts { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.ac-shortcut { display: flex; flex-direction: column; gap: 10px; padding: 18px; border: 1px solid var(--ac-line); border-radius: 16px; background: var(--ac-panel); color: var(--ac-text); }
.ac-shortcut:hover { background: var(--ac-hover); color: var(--ac-text); }
.ac-shortcut-top { display: flex; align-items: center; justify-content: space-between; }
.ac-shortcut-icon { width: 38px; height: 38px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; }
.ac-shortcut-icon.ok { background: var(--ac-ok-tile); color: var(--ac-ok); }
.ac-shortcut-icon.warn { background: var(--ac-warn-chip); color: var(--ac-warn); }
.ac-shortcut-icon.bad { background: var(--ac-bad-bg); color: var(--ac-bad); }
.ac-shortcut-icon.info { background: var(--ac-staff-bg); color: var(--ac-link); }
.ac-shortcut-state { font-size: 12px; font-weight: 600; }
.ac-shortcut-state.ok { color: var(--ac-ok); }
.ac-shortcut-state.warn { color: var(--ac-warn-text); }
.ac-shortcut-state.bad { color: var(--ac-bad); }
.ac-shortcut strong { font-size: 15px; }
.ac-shortcut span.ac-shortcut-text { color: var(--ac-soft); font-size: 13px; line-height: 1.5; }

.ac-rows { display: flex; flex-direction: column; }
.ac-line { display: flex; align-items: center; gap: 14px; padding: 14px 22px; border-top: 1px solid var(--ac-sep); flex-wrap: wrap; }
.ac-line:hover { background: var(--ac-hover); }
.ac-line-main { flex: 1 1 220px; min-width: 0; }
.ac-line-name { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-weight: 600; }
.ac-line-sub { color: var(--ac-muted); font-size: 13px; margin-top: 2px; }
.rw { display: flex; align-items: center; gap: 16px; padding: 16px 22px; border-top: 1px solid var(--ac-sep); color: var(--ac-text); width: 100%; text-align: left; background: transparent; border-left: 0; border-right: 0; border-bottom: 0; font: inherit; cursor: pointer; }
.rw:hover { background: var(--ac-hover); color: var(--ac-text); }
.rw.static { cursor: default; }
.rw .glyph { color: var(--ac-soft); display: inline-flex; }
.rw .glyph.warn { color: var(--ac-warn); }
.rw .txt { flex: 1; min-width: 0; }
.rw .txt > b { display: block; font-weight: 600; }
.rw .txt > span { display: block; margin-top: 3px; color: var(--ac-muted); font-size: 13px; }
.rw .go { color: var(--ac-muted); display: inline-flex; }
.ac-open-form { padding: 4px 22px 20px 62px; border-top: 0; }
.ac-open-form .ac-form { max-width: 420px; }
.rw .txt > b.ac-device-name { display: flex; align-items: center; gap: 8px; }
.ac-center-col.ac-wide { max-width: 880px; }
.rw:disabled { cursor: default; opacity: .7; }

.ac-status { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 18px 22px; border: 1px solid var(--ac-ok-border); border-radius: 18px; background: var(--ac-ok-bg); }
.ac-status.warn { border-color: var(--ac-warn-border); background: var(--ac-warn-bg2); }
.ac-status-icon { width: 44px; height: 44px; border-radius: 12px; background: var(--ac-ok-chip); color: var(--ac-ok); display: inline-flex; align-items: center; justify-content: center; }
.ac-status.warn .ac-status-icon { background: var(--ac-warn-chip2); color: var(--ac-warn); }
.ac-status-text { flex: 1 1 260px; min-width: 0; }
.ac-status-text b { display: block; font-weight: 600; font-size: 16px; }
.ac-status-text span { display: block; margin-top: 3px; color: var(--ac-ok-sub); font-size: 13px; }
.ac-status.warn .ac-status-text span { color: var(--ac-warn-text); }
.ac-status.bad { border-color: var(--ac-bad-border); background: var(--ac-bad-bg); }
.ac-status.bad .ac-status-icon { background: var(--ac-bad-hover-bg); color: var(--ac-bad); }
.ac-status.bad .ac-status-text span { color: var(--ac-bad-sub); }
.ac-side-head { display: flex; justify-content: space-between; align-items: center; }
.ac-side-head h2 { margin: 0; }
.ac-score { font-size: 13px; font-weight: 600; color: var(--ac-on-soft); }
.ac-meter { margin-top: 12px; height: 8px; border-radius: 99px; background: var(--ac-line); }
.ac-meter i { display: block; height: 8px; border-radius: 99px; background: var(--ac-ok); }
.ac-checks { margin-top: 14px; display: flex; flex-direction: column; gap: 10px; font-size: 13px; }
.ac-checks > div { display: flex; gap: 10px; align-items: center; }
.ac-checks .vt-icon { color: var(--ac-ok); width: 16px; height: 16px; }
.ac-checks .warn { color: var(--ac-warn-text); }
.ac-checks .warn .vt-icon { color: var(--ac-warn-text); }
.ac-checks .bad, .ac-checks .bad .vt-icon, .ac-line-name.bad { color: var(--ac-bad); }
.ac-line-name.warn { color: var(--ac-warn-text); }
.ac-wide-button { margin-top: 16px; width: 100%; }
.ac-events { margin-top: 10px; display: flex; flex-direction: column; }
.ac-events > div { padding: 10px 0; border-top: 1px solid var(--ac-sep); }
.ac-events > div:first-child { border-top: 0; }
.ac-events b { display: block; font-weight: 600; font-size: 13.5px; }
.ac-events span { display: block; margin-top: 2px; color: var(--ac-muted); font-size: 12.5px; }
.ac-events .warn b { color: var(--ac-warn-text); }

.ac-tabs { display: flex; gap: 8px; flex-wrap: wrap; padding: 16px 18px; border-bottom: 1px solid var(--ac-sep); }
.ac-tab { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--ac-tab-edge); background: transparent; color: var(--ac-soft); font: 600 13px Inter, sans-serif; cursor: pointer; }
.ac-tab.on { background: var(--ac-accent-on); color: var(--ac-on-soft); border-color: var(--ac-tab-on-edge); }
.ac-tab i { font-style: normal; min-width: 20px; height: 20px; padding: 0 6px; border-radius: 99px; background: var(--ac-line); color: var(--ac-tab-count); font-size: 11px; display: inline-flex; align-items: center; justify-content: center; }
.ac-co { padding: 18px 20px; border-bottom: 1px solid var(--ac-sep); display: flex; flex-direction: column; gap: 14px; }
.ac-co:hover { background: var(--ac-hover); }
.ac-co-top { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.ac-co-name { font-size: 15px; font-weight: 600; }
.ac-co-btns { display: flex; gap: 6px; flex-wrap: wrap; }
.ac-co .ac-bp { height: 38px; text-decoration: none; }
.ac-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; padding-left: 58px; }
.ac-fact { padding: 10px 12px; border-radius: 10px; background: var(--ac-inset); }
.ac-fact small { display: block; font-size: 11px; color: var(--ac-muted); }
.ac-fact b { display: block; margin-top: 3px; font-size: 13px; font-weight: 600; }
.ac-confirm { margin-left: 58px; padding: 12px 14px; border: 1px solid var(--ac-bad-border); border-radius: 12px; background: var(--ac-bad-bg); }
.ac-confirm p { color: var(--ac-bad-sub); margin-bottom: 10px !important; }
.ac-confirm .ac-form-actions { display: flex; gap: 8px; }
.ac-empty { padding: 28px 22px; text-align: center; color: var(--ac-muted); }

.ac-roles { display: flex; flex-direction: column; gap: 14px; margin-top: 14px; }
.ac-role-item { display: flex; gap: 12px; }
.ac-role-item i { width: 8px; height: 8px; margin-top: 6px; border-radius: 99px; flex: none; }
.ac-role-item b { display: block; font-weight: 600; }
.ac-role-item span { display: block; margin-top: 2px; color: var(--ac-soft); font-size: 13px; line-height: 1.5; }
.ac-summary { margin-top: 12px; display: grid; grid-template-columns: auto 1fr; gap: 10px 14px; font-size: 13px; }
.ac-summary span:nth-child(odd) { color: var(--ac-muted); }
.ac-summary span:nth-child(even) { text-align: right; }
.ac-summary .ok { color: var(--ac-ok); }
.ac-btn-row { display: flex; gap: 8px; flex-wrap: wrap; }
.ac-actions-note { margin: 10px 0 0; }
.ac-modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 50; display: flex; align-items: flex-start; justify-content: center; padding: 10vh 16px 16px; background: rgba(15, 20, 34, .55); overflow-y: auto; }
.ac-dialog { width: 100%; max-width: 480px; padding: 22px; border-radius: 16px; border: 1px solid var(--ac-line); background: var(--ac-panel); box-shadow: 0 20px 50px var(--ac-shadow); }
.ac-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.ac-dialog-head h2 { margin: 0; font-size: 18px; font-weight: 600; }
.ac-dialog-x { width: 32px; height: 32px; border: 0; border-radius: 8px; background: transparent; color: var(--ac-soft); font-size: 22px; line-height: 1; cursor: pointer; }
.ac-dialog-x:hover { background: var(--ac-hover); color: var(--ac-text); }
.ac-dialog .ac-form { max-width: none; }
.ac-dialog .ac-form-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.ac-form { max-width: 420px; }
.ac-list { display: grid; grid-template-columns: 180px 1fr; gap: 8px 16px; margin: 0; }
.ac-list dt { color: var(--ac-muted); }
.ac-list dd { margin: 0; }
.ac-pick { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; padding: 12px 14px; margin-bottom: 8px; border: 1px solid var(--ac-line); border-radius: 12px; background: var(--ac-bg); color: var(--ac-text); font: inherit; cursor: pointer; text-align: left; }
.ac-pick:hover { background: var(--ac-hover); }
.ac-qr { display: flex; justify-content: center; margin: 12px 0; }
.ac-qr img { width: 180px; height: 180px; background: #fff; border-radius: 10px; padding: 8px; }
.ac-secret { display: block; margin: 0 0 14px; padding: 8px 10px; border-radius: 10px; background: var(--ac-bg); border: 1px solid var(--ac-line); word-break: break-all; user-select: all; }
.ac-codes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0 16px; }
.ac-codes code { padding: 8px 10px; border-radius: 10px; background: var(--ac-bg); border: 1px solid var(--ac-line); text-align: center; user-select: all; }
.ac-warning-box { padding: 10px 12px; border-radius: 10px; border: 1px solid var(--ac-warn); color: var(--ac-warn); margin: 0 0 12px; }

.ac-performance-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.ac-performance-month { position: relative; display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border: 1px solid var(--ac-edge); border-radius: 10px; color: var(--ac-ghost-text); font: 600 13px Inter, sans-serif; }
.ac-performance-month:hover { background: var(--ac-hover); color: var(--ac-strong); }
.ac-performance-month select { appearance: none; background: transparent; border: 0; outline: none; color: inherit; font: inherit; cursor: pointer; }
.ac-performance-month option { background: var(--ac-panel); color: var(--ac-text); }
.ac-performance-tabs { display: flex; gap: 10px; flex-wrap: wrap; }
.ac-performance-tab { display: inline-flex; align-items: center; gap: 10px; height: 48px; padding: 0 16px 0 8px; border-radius: 14px; border: 1px solid var(--ac-line); background: var(--ac-panel); color: var(--ac-text); font: 600 14px Inter, sans-serif; cursor: pointer; text-align: left; }
.ac-performance-tab.on { background: var(--ac-accent-on); border-color: var(--ac-accent); }
.ac-performance-tab-name { display: block; }
.ac-performance-tab-app { display: block; font-size: 11px; font-weight: 500; color: var(--ac-muted); }
.ac-performance-measures { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; }
.ac-performance-measure { padding: 18px; border: 1px solid var(--ac-line); border-radius: 16px; background: var(--ac-panel); }
.ac-performance-measure-label { color: var(--ac-soft); font-size: 13px; }
.ac-performance-measure-value { margin-top: 8px; font-size: 28px; font-weight: 600; letter-spacing: -0.02em; }
.ac-performance-measure-delta { margin-top: 6px; font-size: 12px; color: var(--ac-muted); }
.ac-performance-measure-delta.up { color: var(--ac-ok); }
.ac-performance-measure-delta.down { color: var(--ac-bad); }
.ac-performance-chart { margin-top: 18px; height: 200px; display: flex; align-items: flex-end; gap: 18px; padding: 0 4px; border-bottom: 1px solid var(--ac-tab-edge); }
.ac-performance-col { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; height: 100%; }
.ac-performance-value { font-size: 12px; font-weight: 600; color: var(--ac-muted); }
.ac-performance-value.on { color: var(--ac-text); }
.ac-performance-bar { width: 100%; max-width: 56px; border-radius: 8px 8px 0 0; background: var(--ac-bar); }
.ac-performance-bar.on { background: var(--ac-bar-on); }
.ac-performance-axis { display: flex; gap: 18px; padding: 8px 4px 0; }
.ac-performance-axis span { flex: 1; text-align: center; font-size: 12px; color: var(--ac-muted); }
.ac-performance-rows { margin-top: 10px; display: flex; flex-direction: column; }
.ac-performance-row { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--ac-sep); font-size: 13px; }
.ac-performance-row .ac-soft { color: var(--ac-soft); }

.ac-nav-toggle, .ac-search-toggle, .ac-scrim { display: none; }

@media (min-width: 761px) and (max-width: 1099px) {
  .ac-body { flex-wrap: nowrap; }
  .ac-nav { flex: 0 0 240px; padding: 16px 8px; }
  .ac-nav a { font-size: 13px; padding: 10px 12px; gap: 12px; }
  .ac-main { flex: 1 1 0; padding: 24px 24px 48px; }
  .ac-center-col, .ac-aside { flex: 1 1 100%; }
}

@media (max-width: 760px) {
  html.ac-lock, html.ac-lock body { overflow: hidden; }
  .ac-top { position: relative; flex-wrap: nowrap; height: 56px; padding: 0 8px 0 4px; gap: 4px; }
  .ac-nav-toggle, .ac-search-toggle { display: inline-flex; flex: none; }
  .ac-top-brand { min-width: 0; flex: 0 1 auto; overflow: hidden; white-space: nowrap; }
  .ac-top-brand span:last-child { font-size: 17px; overflow: hidden; text-overflow: ellipsis; }
  .ac-top-end { margin-left: auto; flex: none; }
  .ac-top-end .vt-user-text, .ac-top-end .vt-usermenu-caret { display: none; }
  .ac-search { display: none; position: absolute; left: 0; right: 0; top: 0; height: 56px; max-width: none; padding: 8px; background: var(--ac-bg); z-index: 30; box-sizing: border-box; }
  .ac-search.ac-search-open { display: block; }
  .ac-search-box { height: 40px; }
  .ac-search-list { left: 8px; right: 8px; top: 54px; max-height: 60vh; overflow-y: auto; }
  .ac-body { flex-direction: column; flex-wrap: nowrap; }
  .ac-scrim { display: block; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 44; background: rgba(15, 20, 34, .55); }
  .ac-nav { position: fixed; top: 0; bottom: 0; left: 0; z-index: 45; flex: none; width: min(300px, 86vw); padding: 16px 12px; overflow-y: auto; background: var(--ac-bg); border-right: 1px solid var(--ac-line); box-shadow: 0 0 32px var(--ac-shadow); transform: translateX(-100%); visibility: hidden; transition: transform .2s ease, visibility 0s linear .2s; }
  .ac-nav.ac-nav-open { transform: none; visibility: visible; transition: transform .2s ease; }
  .ac-main { flex: 1 1 auto; width: 100%; box-sizing: border-box; padding: 16px 16px 40px; gap: 16px; overflow-wrap: anywhere; }
  .ac-center-col, .ac-aside { flex: 1 1 100%; }
  .ac-main img, .ac-main svg { max-width: 100%; }
  .ac-foot-links { padding: 0 16px 24px; }
  .ac-list { grid-template-columns: 1fr; }
  .ac-facts { padding-left: 0; }
  .ac-confirm { margin-left: 0; }
  .ac-open-form { padding-left: 22px; }
}