/* v1.1.1: style rules unchanged; stable sidebar ordering is handled in JavaScript. */
.zdp-root { --zdp-bg:#f6f8fb; --zdp-card:#fff; --zdp-text:#172b3c; --zdp-muted:#657687;
  --zdp-line:#dbe4ec; --zdp-accent:#116b72; --zdp-ink-accent:#116b72; --zdp-soft:#e8f4f3; --zdp-danger:#a72f3f;
  font-family:Inter,"Segoe UI",system-ui,sans-serif; font-size:14px; line-height:1.55; color:var(--zdp-text); }
.zdp-root *, .zdp-root *::before, .zdp-root *::after { box-sizing:border-box; }
.zdp-root [hidden] { display:none !important; }
.zdp-root button, .zdp-root input { font:inherit; }
.zdp-root button { cursor:pointer; }
.zdp-root button:disabled { cursor:not-allowed; opacity:.55; }
.zdp-root button:focus-visible, .zdp-root input:focus-visible, .zdp-root [tabindex]:focus-visible {
  outline:3px solid #42acb6; outline-offset:3px; }
.zdp-launcher { position:fixed; right:22px; bottom:calc(22px + env(safe-area-inset-bottom)); z-index:2147482000;
  min-height:46px; padding:10px 20px; border:1px solid #0c555a; border-radius:100px;
  background:#116b72; color:#fff; font-weight:650 !important; box-shadow:0 8px 30px #102f4938; }
.zdp-launcher:hover { background:#0c5960; }
.zdp-overlay { position:fixed; inset:0; z-index:2147482100; padding:24px; display:flex; align-items:center;
  justify-content:center; overflow:auto; overscroll-behavior:contain; background:#102230b8; backdrop-filter:blur(5px); }
.zdp-panel { width:min(100%,1000px); max-height:calc(100vh - 48px); max-height:calc(100dvh - 48px);
  overflow:auto; overscroll-behavior:contain; background:var(--zdp-bg); color:var(--zdp-text);
  border:1px solid var(--zdp-line); border-radius:22px; box-shadow:0 30px 100px #0005; }
.zdp-header { display:flex; gap:20px; align-items:center; justify-content:space-between; padding:22px 28px;
  background:var(--zdp-card); border-bottom:1px solid var(--zdp-line); position:sticky; top:0; z-index:2; }
.zdp-root h2, .zdp-root h3, .zdp-root h4, .zdp-root p { color:inherit; }
.zdp-root h2 { font-size:25px; font-weight:720; margin:2px 0 0; line-height:1.25; }
.zdp-root h3 { font-size:17px; font-weight:680; margin:0 0 8px; line-height:1.4; }
.zdp-root h4 { font-size:16px; font-weight:680; margin:0; overflow-wrap:anywhere; }
.zdp-root p { margin:0 0 12px; }
.zdp-root .zdp-eyebrow { font-size:10px; letter-spacing:.15em; color:var(--zdp-ink-accent); font-weight:750; margin:0 0 6px; }
.zdp-content { padding:24px 28px 20px; }
.zdp-root .zdp-description { color:var(--zdp-muted); max-width:760px; margin-bottom:22px; }
.zdp-policy { padding:20px; background:var(--zdp-soft); border:1px solid var(--zdp-line); border-radius:16px; margin-bottom:24px; }
.zdp-policy-heading, .zdp-list-heading, .zdp-device-heading { display:flex; gap:16px; justify-content:space-between; align-items:flex-start; }
.zdp-root .zdp-policy-state { font-size:15px; font-weight:650; }
.zdp-root .zdp-muted { color:var(--zdp-muted); }
.zdp-button { border:1px solid var(--zdp-line); background:var(--zdp-card); color:var(--zdp-text);
  min-height:42px; padding:8px 14px; border-radius:10px; font-weight:600; white-space:normal; }
.zdp-button:hover:not(:disabled) { border-color:var(--zdp-accent); }
.zdp-root .zdp-primary { background:var(--zdp-accent); color:#fff; border-color:var(--zdp-accent); }
.zdp-root .zdp-danger { color:var(--zdp-danger); border-color:color-mix(in srgb,var(--zdp-danger) 35%,var(--zdp-line)); }
.zdp-search { display:flex; gap:12px; align-items:flex-end; margin:0 0 24px; }
.zdp-root label { display:flex; flex-direction:column; gap:7px; font-weight:600; margin:0; }
.zdp-search label { flex:1; max-width:360px; }
.zdp-root input { width:100%; min-height:44px; padding:9px 12px; background:var(--zdp-card); color:var(--zdp-text);
  border:1px solid var(--zdp-line); border-radius:9px; box-shadow:none; }
.zdp-list-heading { align-items:center; margin-bottom:16px; }
.zdp-list-heading h3 { margin:0; }
.zdp-summary { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:12px; margin:0 0 18px; }
.zdp-summary > div { padding:16px; border:1px solid var(--zdp-line); border-radius:13px; background:var(--zdp-card); min-width:0; }
.zdp-summary span, .zdp-summary strong { display:block; overflow-wrap:anywhere; }
.zdp-summary span { color:var(--zdp-muted); font-size:12px; margin-bottom:6px; }
.zdp-summary strong { font-size:18px; font-weight:700; }
.zdp-device-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.zdp-device { background:var(--zdp-card); border:1px solid var(--zdp-line); border-radius:15px; padding:18px; min-width:0; }
.zdp-device-heading { gap:10px; margin-bottom:7px; }
.zdp-badge { display:inline-flex; align-items:center; font-size:10px; font-weight:700; line-height:1.35; padding:5px 8px;
  border:1px solid var(--zdp-line); border-radius:100px; flex-shrink:0; max-width:46%; }
.zdp-status-active { background:var(--zdp-soft); color:var(--zdp-ink-accent); }
.zdp-status-revoked, .zdp-status-unknown { color:var(--zdp-muted); }
.zdp-status-over_limit, .zdp-status-reauth_required { color:var(--zdp-danger); }
.zdp-device dl { margin:14px 0; font-size:12px; }
.zdp-device dl > div { display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px 12px; margin-bottom:7px; }
.zdp-device dt { color:var(--zdp-muted); font-weight:400; }
.zdp-device dd { margin:0; }
.zdp-actions { display:flex; gap:10px; flex-wrap:wrap; margin-top:17px; }
.zdp-root .zdp-alert { padding:12px 14px; border:1px solid #bc758150; border-radius:10px; color:var(--zdp-danger); background:#b3223d09; }
.zdp-root .zdp-notice { padding:12px 14px; border:1px solid var(--zdp-line); border-radius:10px; color:var(--zdp-ink-accent); background:var(--zdp-soft); }
.zdp-empty { border:1px dashed var(--zdp-line); border-radius:13px; padding:25px 18px; color:var(--zdp-muted); text-align:center; }
.zdp-root .zdp-note { font-size:11px; color:var(--zdp-muted); margin:22px 0 0; max-width:780px; }
.zdp-confirm { max-width:580px; margin:8px auto 28px; padding:24px; border:1px solid var(--zdp-line); background:var(--zdp-card); border-radius:16px; }
.zdp-confirm p { overflow-wrap:anywhere; }
.zdp-confirm label { margin:20px 0 14px; }
.zdp-integration-error { position:fixed; bottom:20px; right:20px; max-width:340px; padding:14px;
  z-index:2147482000; background:#fff; color:#9d2434; border:1px solid #d9959f; border-radius:10px; font:14px/1.5 system-ui,sans-serif; }
@media (prefers-color-scheme:dark) {
  .zdp-root { --zdp-bg:#101d29; --zdp-card:#172633; --zdp-text:#edf4f9; --zdp-muted:#a2b4c4;
    --zdp-line:#344855; --zdp-accent:#237f87; --zdp-ink-accent:#88d5dd; --zdp-soft:#173d41; --zdp-danger:#ff9caa; }
}
html.dark .zdp-root, body.dark .zdp-root, [data-theme="dark"] .zdp-root {
  --zdp-bg:#101d29; --zdp-card:#172633; --zdp-text:#edf4f9; --zdp-muted:#a2b4c4;
  --zdp-line:#344855; --zdp-accent:#237f87; --zdp-ink-accent:#88d5dd; --zdp-soft:#173d41; --zdp-danger:#ff9caa; }
@media (max-width:650px) {
  .zdp-overlay { padding:8px; }
  .zdp-panel { border-radius:15px; max-height:calc(100vh - 16px); max-height:calc(100dvh - 16px); }
  .zdp-header { padding:18px 16px; gap:12px; }
  .zdp-root h2 { font-size:21px; }
  .zdp-content { padding:18px 15px; }
  .zdp-policy { padding:16px; }
  .zdp-policy-heading { flex-direction:column; gap:8px; }
  .zdp-summary { grid-template-columns:1fr; gap:8px; }
  .zdp-summary > div { padding:12px 14px; display:flex; justify-content:space-between; gap:12px; }
  .zdp-summary strong { font-size:16px; text-align:right; }
  .zdp-device-grid { grid-template-columns:1fr; }
  .zdp-search { align-items:stretch; flex-direction:column; }
  .zdp-search label { max-width:none; }
  .zdp-confirm { padding:18px; }
  .zdp-launcher { right:14px; bottom:calc(14px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion:reduce) { .zdp-root *, .zdp-root *::before, .zdp-root *::after { scroll-behavior:auto !important; } }

/* Native route presentation: the host retains its sidebar, header and scrolling. */
.zdp-page { width:100%; max-width:1280px; margin:0 auto; }
.zdp-page .zdp-overlay { position:static; inset:auto; z-index:auto; display:block;
  padding:0; overflow:visible; background:none; backdrop-filter:none; }
.zdp-page .zdp-panel { width:100%; max-height:none; overflow:visible; border:0;
  border-radius:0; box-shadow:none; background:transparent; }
.zdp-page .zdp-header { position:static; padding:0 0 24px; border:0; background:transparent; }
.zdp-page .zdp-content { padding:0; }
.zdp-page h2 { font-size:28px; }
.zdp-integration-error-inline { padding:18px; border:1px solid #d9959f; border-radius:10px; color:#9d2434; }
html[data-admin-mode="light"] .zdp-root, html[data-zenpn-mode="light"] .zdp-root {
  --zdp-bg:#f6f8fb; --zdp-card:#fff; --zdp-text:#172b3c; --zdp-muted:#657687;
  --zdp-line:#dbe4ec; --zdp-accent:#116b72; --zdp-ink-accent:#116b72; --zdp-soft:#e8f4f3; --zdp-danger:#a72f3f; }
html[data-admin-mode="dark"] .zdp-root, html[data-zenpn-mode="dark"] .zdp-root {
  --zdp-bg:#101d29; --zdp-card:#172633; --zdp-text:#edf4f9; --zdp-muted:#a2b4c4;
  --zdp-line:#344855; --zdp-accent:#237f87; --zdp-ink-accent:#88d5dd; --zdp-soft:#173d41; --zdp-danger:#ff9caa; }
@media (max-width:650px) {
  .zdp-page .zdp-header { padding:0 0 18px; }
  .zdp-page h2 { font-size:24px; }
}