body.new-panel {
  --np-page:#eef2f7;
  --np-surface:#fff;
  --np-surface-alt:#f3f6fa;
  --np-hover:#e7edf5;
  --np-border:#d5dde8;
  --np-text:#182235;
  --np-muted:#647084;
  --np-blue:#1769e0;
  --np-blue-hover:#0d58c4;
  --np-online:#16834a;
  --np-offline:#9a4a4a;
  --np-warning:#9b6700;
  --np-shadow:0 12px 36px #2030401f;
  background:var(--np-page);
}
html[data-theme="dark"] body.new-panel {
  --np-page:#17191d;
  --np-surface:#24272d;
  --np-surface-alt:#2c3037;
  --np-hover:#353b44;
  --np-border:#414751;
  --np-text:#f0f2f5;
  --np-muted:#adb4bf;
  --np-blue:#2677e8;
  --np-blue-hover:#3986ee;
  --np-online:#42ce82;
  --np-offline:#dc7a82;
  --np-warning:#efb64b;
  --np-shadow:0 16px 44px #0006;
}
body.new-panel main { max-width:none;padding:0 28px 32px;background:var(--np-page);color:var(--np-text) }
body.new-panel .panel-header { position:sticky;top:0;z-index:20;margin:0 -28px 18px;padding:18px 28px 14px;background:var(--np-page);border-bottom:1px solid var(--np-border);box-shadow:0 6px 20px #00000012 }
body.new-panel .panel-header header { margin-bottom:11px }
body.new-panel .panel-header h1 { font-size:25px }
body.new-panel .system-tools { display:flex;align-items:center;gap:8px;flex-wrap:wrap }
body.new-panel .system-tools button { padding:8px 12px;font-size:13px }
body.new-panel #masterUpdateState:empty,body.new-panel #agentInstallerState:empty { display:none }
body.new-panel #masterUpdateState,body.new-panel #agentInstallerState { margin:6px 0 }
body.new-panel #devicesSection:not(.newp-active-section),
body.new-panel #auditSection:not(.newp-active-section),
body.new-panel #mastersSection:not(.newp-active-section),
body.new-panel #recordingsSection:not(.newp-active-section),
body.new-panel #automationSection:not(.newp-active-section) { display:none!important }
body.new-panel #newPanelHome[hidden] { display:none!important }

.np-home { display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-items:start;gap:clamp(10px,1vw,16px) }
.np-panel { min-width:0;padding:clamp(10px,1vw,16px);border:1px solid var(--np-border);border-radius:14px;background:var(--np-surface);box-shadow:var(--np-shadow);container-name:np-panel;container-type:inline-size }
.np-panel-head { display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px }
.np-panel-head>div { min-width:0 }
.np-panel-head h2 { margin:0;font-size:19px }
.np-panel-head p { margin:5px 0 0;color:var(--np-muted);font-size:13px }
.np-panel-head button { flex:0 0 auto;padding:8px 11px;white-space:nowrap }
.np-favorites { display:grid;grid-template-columns:repeat(var(--np-favorite-columns,2),minmax(0,1fr));gap:10px }
.np-device-card { position:relative;min-width:0;min-height:clamp(132px,8.5vw,158px);padding:clamp(9px,.8vw,14px);text-align:left;color:var(--np-text);background:var(--np-surface-alt);border:1px solid var(--np-border);border-radius:12px;cursor:default;user-select:none }
.np-device-card:hover { background:var(--np-hover);border-color:color-mix(in srgb,var(--np-blue) 60%,var(--np-border)) }
.np-device-card:focus-visible { outline:2px solid var(--np-blue);outline-offset:2px }
.np-device-name { display:block;padding-right:24px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.np-device-host { display:block;margin-top:5px;color:var(--np-muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.np-device-group { display:inline-block;max-width:100%;margin-top:9px;padding:3px 7px;color:var(--np-text);background:color-mix(in srgb,var(--np-blue) 16%,transparent);border:1px solid color-mix(in srgb,var(--np-blue) 35%,var(--np-border));border-radius:999px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.np-device-description { display:-webkit-box;min-height:30px;margin-top:7px;color:var(--np-muted);font-size:12px;line-height:15px;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2 }
.np-device-description:empty { display:none }
.np-device-state { display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;font-size:12px }
.np-status { display:inline-flex;align-items:center;gap:6px }
.np-status::before { content:"";width:7px;height:7px;border-radius:50%;background:currentColor }
.np-status.online { color:var(--np-online) }
.np-status.offline { color:var(--np-offline) }
.np-session-count { color:var(--np-muted) }
.np-star { position:absolute;right:13px;top:11px;color:var(--np-warning);font-size:18px }
.np-add-device { display:grid;place-items:center;text-align:center;color:var(--np-muted);cursor:pointer }
.np-add-device strong { display:block;margin-top:6px;color:var(--np-text) }
.np-empty { grid-column:1/-1;padding:28px 16px;text-align:center;color:var(--np-muted);border:1px dashed var(--np-border);border-radius:12px }
.np-usage-hint { margin:12px 0 0;padding:10px 12px;border-radius:9px;background:var(--np-surface-alt);color:var(--np-muted);font-size:12px }

.np-tools { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px }
.np-tool { min-width:0;min-height:clamp(108px,7vw,126px);display:flex;align-items:flex-start;gap:clamp(7px,.7vw,12px);padding:clamp(9px,.8vw,14px);text-align:left;color:var(--np-text);background:var(--np-surface-alt);border:1px solid var(--np-border);border-radius:11px;cursor:pointer }
.np-tool:hover { background:var(--np-hover);border-color:var(--np-blue) }
.np-tool-icon { width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:9px;color:var(--np-blue);background:color-mix(in srgb,var(--np-blue) 14%,transparent);font-size:18px;font-weight:700 }
.np-tool-name { display:block;font-weight:700 }
.np-tool-content { display:flex;min-width:0;min-height:96px;flex:1;flex-direction:column }
.np-tool-description { display:block;margin-top:7px;color:var(--np-muted);font-size:12px;line-height:1.4 }
.np-tool-flow { display:block;margin-top:auto;padding-top:9px;color:var(--np-blue);font-size:12px;font-weight:600 }

.np-dialog { width:min(620px,calc(100vw - 32px));padding:0;color:var(--np-text);background:var(--np-surface);border:1px solid var(--np-border);border-radius:14px;box-shadow:var(--np-shadow) }
.np-dialog.np-dialog-wide { width:min(760px,calc(100vw - 32px)) }
.np-dialog::backdrop { background:#08090aa6 }
.np-dialog-shell { padding:20px }
.np-dialog-head { display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px }
.np-dialog-head h2 { margin:0;font-size:20px }
.np-dialog-head p { margin:5px 0 0;color:var(--np-muted);font-size:13px }
.np-dialog-head .np-icon-button { width:36px;height:36px;padding:0;display:grid;place-items:center;background:var(--np-surface-alt);color:var(--np-text) }
.np-search-row { display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-bottom:12px }
.np-search-row input { flex:1;min-width:220px;padding:10px 12px;color:var(--np-text);background:var(--np-surface-alt);border:1px solid var(--np-border);border-radius:9px }
.np-search-row label { width:auto;display:flex;align-items:center;gap:7px;color:var(--np-muted);font-size:13px }
.np-search-row label input { width:auto }
.np-selection-actions { display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px }
.np-selection-actions button { padding:7px 11px;font-size:12px }
.np-device-setting-choice { display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(250px,auto);align-items:center }
.np-file-manager-option { width:auto!important;display:flex!important;align-items:center;gap:6px;color:var(--np-text);font-size:12px;white-space:nowrap }
.np-file-manager-option input { width:auto;margin:0;accent-color:var(--np-blue) }
.np-grid-columns { display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 12px;padding:10px 12px;border:1px solid var(--np-border);border-radius:9px }
.np-grid-columns legend { padding:0 5px;color:var(--np-muted);font-size:12px }
.np-grid-columns label { width:auto;display:flex;align-items:center;gap:6px;margin:0;color:var(--np-text);font-size:13px }
.np-grid-columns input { width:auto;margin:0;accent-color:var(--np-blue) }
#npToolSettingsMount .settings-block { margin:0;padding:0;border:0 }
#npToolSettingsMount .settings-block>h3 { display:none }
.np-list-section-title { margin:14px 0 6px;color:var(--np-muted);font-size:12px;text-transform:uppercase }
.np-choice-list { border-top:1px solid var(--np-border) }
.np-choice { width:100%;min-height:58px;display:flex;align-items:center;gap:11px;padding:10px;text-align:left;color:var(--np-text);background:transparent;border:0;border-bottom:1px solid var(--np-border);border-radius:0;cursor:pointer }
.np-choice:hover,.np-choice.selected { background:var(--np-surface-alt) }
.np-choice input { width:17px;height:17px;accent-color:var(--np-blue);flex:0 0 auto }
.np-choice-main { flex:1;min-width:0 }
.np-choice-title { display:block;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.np-choice-meta { display:block;margin-top:3px;color:var(--np-muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis }
.np-choice-state { color:var(--np-online);font-size:12px }
.np-dialog-message { min-height:20px;margin-top:10px;color:var(--np-muted) }
.np-dialog-actions { display:flex;justify-content:flex-end;gap:9px;margin-top:15px }
.np-dialog-actions button { min-width:105px }

.np-context-menu { position:fixed;z-index:80;width:250px;padding:6px;color:var(--np-text);background:var(--np-surface);border:1px solid var(--np-border);border-radius:10px;box-shadow:var(--np-shadow) }
.np-context-menu[hidden] { display:none!important }
.np-context-menu-title { padding:8px 9px;color:var(--np-muted);font-size:12px;border-bottom:1px solid var(--np-border);margin-bottom:4px }
.np-context-menu button { width:100%;min-height:36px;padding:7px 9px;text-align:left;color:var(--np-text);background:transparent;border:0;border-radius:7px }
.np-context-menu button:hover { background:var(--np-surface-alt) }
.np-more-menu,.np-libraries-menu { width:260px }
.np-more-menu button[hidden],.np-libraries-menu button[hidden] { display:none!important }
#npMoreButton::after,#npLibrariesButton::after { content:'▾';margin-left:7px;font-size:11px }

body.new-panel .newp-active-section { margin-top:0 }
body.new-panel .newp-active-section>.section-title h2,
body.new-panel .newp-active-section>h2 { margin-top:0 }
body.new-panel #devicesSection.newp-active-section>.section-title { align-items:center }
body.new-panel #devicesSection.newp-active-section>.section-title>.section-actions { flex:1 1 auto;justify-content:flex-end;min-width:0 }
body.new-panel #devicesSection .np-device-table-search { flex:1 1 320px;width:auto;max-width:560px;min-width:220px;padding:10px 12px;color:var(--np-text);background:var(--np-surface);border:1px solid var(--np-border);border-radius:8px;font:inherit }
body.new-panel #recordingsSection.newp-active-section>.section-title { align-items:flex-start }
body.new-panel #recordingsSection .np-list-command-bar { flex:1 1 auto;justify-content:flex-end;min-width:0;gap:8px }
body.new-panel #recordingsSection .np-list-command-bar input,
body.new-panel #recordingsSection .np-list-command-bar select { min-width:150px;padding:10px 12px;color:var(--np-text);background:var(--np-surface);border:1px solid var(--np-border);border-radius:8px;font:inherit }
body.new-panel #recordingsSection .np-list-command-bar #recordingDevice { flex:1 1 230px;max-width:340px }
body.new-panel #recordingsSection .np-list-command-bar .message { align-self:center;min-height:0;margin:0;white-space:nowrap }
body.new-panel #oneCArchivesSection.newp-active-section>.section-title { align-items:flex-start }
body.new-panel #oneCArchivesSection .np-list-command-bar { flex:1 1 auto;justify-content:flex-end;min-width:0;gap:8px }
body.new-panel #oneCArchivesSection .np-list-command-bar input,
body.new-panel #oneCArchivesSection .np-list-command-bar select { min-width:165px;padding:10px 12px;color:var(--np-text);background:var(--np-surface);border:1px solid var(--np-border);border-radius:8px;font:inherit }
body.new-panel #oneCArchivesSection .np-list-command-bar .message { align-self:center;min-height:0;margin:0;white-space:nowrap }
body.new-panel #oneCRepositorySection.newp-active-section>.section-title { align-items:flex-start }
body.new-panel #oneCRepositorySection .np-list-command-bar { flex:1 1 auto;justify-content:flex-end;min-width:0;gap:8px }
body.new-panel #oneCRepositorySection .np-list-command-bar input,
body.new-panel #oneCRepositorySection .np-list-command-bar select { min-width:170px;padding:10px 12px;color:var(--np-text);background:var(--np-surface);border:1px solid var(--np-border);border-radius:8px;font:inherit }
body.new-panel #oneCRepositorySection .np-list-command-bar #oneCRepositorySearch { flex:1 1 240px;max-width:360px }
body.new-panel #oneCRepositorySection .np-list-command-bar .message { align-self:center;min-height:0;margin:0;white-space:nowrap }
body.new-panel #oneCExtensionLibrarySection.newp-active-section>.section-title,
body.new-panel #oneCCredentialProfilesSection.newp-active-section>.section-title,
body.new-panel #windowsCredentialProfilesSection.newp-active-section>.section-title,
body.new-panel #auditSection.newp-active-section>.section-title { align-items:flex-start }
body.new-panel #oneCExtensionLibrarySection .np-list-command-bar,
body.new-panel #oneCCredentialProfilesSection .np-list-command-bar,
body.new-panel #windowsCredentialProfilesSection .np-list-command-bar,
body.new-panel #auditSection .np-list-command-bar { flex:1 1 auto;justify-content:flex-end;min-width:0;gap:8px }
body.new-panel #oneCExtensionLibrarySection .np-list-command-bar input,
body.new-panel #oneCExtensionLibrarySection .np-list-command-bar select,
body.new-panel #auditSection .np-list-command-bar input,
body.new-panel #auditSection .np-list-command-bar select { min-width:165px;padding:10px 12px;color:var(--np-text);background:var(--np-surface);border:1px solid var(--np-border);border-radius:8px;font:inherit }
body.new-panel #oneCExtensionLibrarySection .np-list-command-bar #oneCExtensionSearch,
body.new-panel #auditSection .np-list-command-bar #auditSearch { flex:1 1 240px;max-width:360px }
body.new-panel #oneCExtensionLibrarySection .np-list-command-bar .message,
body.new-panel #oneCCredentialProfilesSection .np-list-command-bar .message,
body.new-panel #windowsCredentialProfilesSection .np-list-command-bar .message,
body.new-panel #auditSection .np-list-command-bar .message { align-self:center;min-height:0;margin:0;white-space:nowrap }

@media(max-width:700px) {
  body.new-panel main { padding:0 14px 24px }
  body.new-panel .panel-header { margin:0 -14px 14px;padding:14px }
}
@media(max-width:430px) {
  .np-panel { padding:12px }
  .np-panel-head { flex-direction:column }
  .np-dialog-shell { padding:15px }
  .np-choice-state { display:none }
}

@container np-panel (max-width:680px) {
  .np-tool { gap:7px;padding:9px }
  .np-tool-icon { width:30px;height:30px;font-size:16px }
  .np-tool-description { font-size:11px;line-height:1.35 }
  .np-tool-flow { font-size:11px }
}

@container np-panel (max-width:520px) {
  .np-panel-head { flex-direction:column }
  .np-tool { min-height:132px;flex-direction:column }
  .np-tool-content { min-height:82px }
  .np-tool-description { margin-top:5px }
  .np-tool-flow { padding-top:6px }
}

@container np-panel (max-width:360px) {
  .np-tool { min-height:102px }
  .np-tool-content { min-height:54px }
  .np-tool-description { display:none }
}
