.node-subscriptions-page .ns-main { padding-bottom: 48px; }
.node-subscriptions-page .ns-summary { margin-inline: auto; }
.node-subscriptions-page .ns-main > :is(.admin-notice, .admin-error, .ns-feedback) {
  margin: 0 auto 16px;
  overflow-wrap: anywhere;
}
.node-subscriptions-page .ns-summary .admin-stat-card > strong {
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-variant-numeric: tabular-nums;
}
.node-subscriptions-page .ns-summary [data-ns-summary="used_bytes"] {
  color: inherit;
  font: inherit;
}
.node-subscriptions-page .ns-summary .ns-unit {
  display: inline;
  margin: 0;
  line-height: 1;
}
.node-subscriptions-page .ns-panel { margin-bottom: 24px; }
.node-subscriptions-page .ns-note,
.node-subscriptions-page .ns-address { color: var(--color-text-secondary); font-size: 13px; line-height: 1.7; }
.node-subscriptions-page .ns-note { margin: 0 0 16px; }
.node-subscriptions-page .ns-unit { font-size: 15px; font-weight: 500; }
.node-subscriptions-page .ns-node-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 310px), 1fr)); gap: 16px; }
.node-subscriptions-page .ns-node-card { padding: 20px; background: var(--color-bg-content); border: 1px solid var(--color-border); border-radius: 16px; }
.node-subscriptions-page .ns-node-heading,
.node-subscriptions-page .ns-dialog-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.node-subscriptions-page .ns-node-heading h3 { margin: 0; font-size: 18px; }
.node-subscriptions-page .ns-address { margin: 8px 0 16px; font-variant-numeric: tabular-nums; }
.node-subscriptions-page .ns-metadata { margin: 0 0 16px; display: grid; gap: 8px; }
.node-subscriptions-page .ns-metadata > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-size: 13px; }
.node-subscriptions-page .ns-metadata dt { color: var(--color-text-secondary); }
.node-subscriptions-page .ns-metadata dd { margin: 0; font-variant-numeric: tabular-nums; }
.node-subscriptions-page .ns-node-card > .ns-note { margin-bottom: 0; }
.node-subscriptions-page .ns-pill { display: inline-flex; align-items: center; width: fit-content; padding: 5px 9px; border-radius: 99px; font-size: 12px; line-height: 1.4; font-weight: 600; background: var(--color-bg-subtle); color: var(--color-text-secondary); }
.node-subscriptions-page .ns-pill.is-success { background: var(--color-success-bg); color: var(--color-success); }
.node-subscriptions-page .ns-pill.is-warning { background: var(--color-warning-bg); color: var(--color-warning); }
.node-subscriptions-page .ns-pill.is-danger { background: var(--color-danger-bg); color: var(--color-danger); }
.node-subscriptions-page .ns-table-wrap { margin: 0; }
.node-subscriptions-page .ns-users-table { min-width: 920px; }
.node-subscriptions-page .ns-users-table th { white-space: nowrap; }
.node-subscriptions-page .ns-users-table td { vertical-align: top; }
.node-subscriptions-page .ns-users-table td:first-child { min-width: 125px; }
.node-subscriptions-page .ns-users-table td:nth-child(2) { min-width: 150px; }
.node-subscriptions-page .ns-users-table td:nth-child(4) { min-width: 180px; max-width: 245px; }
.node-subscriptions-page .ns-users-table td:nth-child(5) { width: 238px; }
.node-subscriptions-page .ns-users-table td strong,
.node-subscriptions-page .ns-users-table td small { display: block; }
.node-subscriptions-page .ns-users-table td small,
.node-subscriptions-page .ns-jobs-table td small { margin-top: 6px; color: var(--color-text-secondary); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.node-subscriptions-page .ns-jobs-table td strong,
.node-subscriptions-page .ns-jobs-table td small { display: block; }
.node-subscriptions-page .ns-users-table progress { display: block; width: 100%; min-width: 100px; height: 6px; margin-top: 10px; border: 0; border-radius: 99px; accent-color: var(--color-status); overflow: hidden; background: var(--color-bg-subtle); }
.node-subscriptions-page .ns-users-table progress::-webkit-progress-bar { background: var(--color-bg-subtle); }
.node-subscriptions-page .ns-users-table progress::-webkit-progress-value { background: var(--color-status); border-radius: 99px; }
.node-subscriptions-page .ns-users-table progress::-moz-progress-bar { background: var(--color-status); }
.node-subscriptions-page .ns-user-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.node-subscriptions-page .ns-user-actions form { margin: 0; }
.node-subscriptions-page .ns-user-actions .button { width: 100%; min-height: 44px; padding: 8px 10px; font-size: 12px; white-space: normal; }
.node-subscriptions-page .ns-danger-button { color: var(--color-danger); }
.node-subscriptions-page .ns-bottom-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 24px; }
.node-subscriptions-page .ns-create-form,
.node-subscriptions-page .ns-dialog-content { display: grid; gap: 16px; }
.node-subscriptions-page .ns-create-form > .ns-note { margin: 0; }
.node-subscriptions-page .ns-create-form label,
.node-subscriptions-page .ns-dialog label { display: grid; gap: 8px; min-width: 0; font-size: 13px; font-weight: 600; }
.node-subscriptions-page .ns-create-form label small { color: var(--color-text-secondary); font-size: 12px; line-height: 1.6; font-weight: 400; }
.node-subscriptions-page .ns-create-form input,
.node-subscriptions-page .ns-create-form select,
.node-subscriptions-page .ns-dialog input { width: 100%; min-height: 46px; min-width: 0; border: 1px solid var(--color-border-strong); border-radius: 8px; padding: 10px 12px; font: inherit; font-weight: 400; color: var(--color-text-primary); background: var(--color-bg-raised); }
.node-subscriptions-page .ns-create-form input:focus-visible,
.node-subscriptions-page .ns-create-form select:focus-visible,
.node-subscriptions-page .ns-dialog input:focus-visible { outline: 2px solid var(--color-status); outline-offset: 2px; }
.node-subscriptions-page .ns-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.node-subscriptions-page .ns-scope-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; }
.node-subscriptions-page .ns-scope-list strong { font-size: 14px; }
.node-subscriptions-page .ns-scope-list p { margin: 8px 0 0; color: var(--color-text-secondary); font-size: 13px; line-height: 1.8; }
.node-subscriptions-page .ns-empty { text-align: center; padding: 36px 16px; border: 1px dashed var(--color-border-strong); border-radius: 12px; }
.node-subscriptions-page .ns-empty strong { display: block; font-size: 17px; }
.node-subscriptions-page .ns-empty p { color: var(--color-text-secondary); font-size: 14px; line-height: 1.8; margin: 12px auto 16px; max-width: 500px; }
.node-subscriptions-page .ns-text-link { font-size: 13px; text-decoration: underline; text-underline-offset: 4px; }
.node-subscriptions-page .ns-feedback { border: 1px solid var(--color-border); border-radius: 8px; background: var(--color-bg-subtle); padding: 12px 16px; font-size: 13px; line-height: 1.7; }
.node-subscriptions-page .ns-feedback.is-error { color: var(--color-danger); background: var(--color-danger-bg); }
.node-subscriptions-page .ns-error-text { color: var(--color-danger); font-size: 13px; line-height: 1.7; }
.node-subscriptions-page .ns-dialog { width: min(560px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); overflow: auto; padding: 0; border: 1px solid var(--color-border); border-radius: 20px; background: var(--color-bg-content); color: var(--color-text-primary); }
.node-subscriptions-page .ns-dialog::backdrop { background: rgba(24, 32, 25, .45); }
.node-subscriptions-page .ns-dialog-content { margin: 0; padding: 28px; }
.node-subscriptions-page .ns-dialog-heading h2 { font-size: 24px; margin: 6px 0 0; }
.node-subscriptions-page .ns-dialog-heading .section-kicker { margin: 0; }
.node-subscriptions-page .ns-close { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; background: transparent; border: 1px solid var(--color-border); border-radius: 8px; color: inherit; font-size: 24px; cursor: pointer; }
.node-subscriptions-page .ns-dialog .ns-note { margin: 0; }
.node-subscriptions-page .ns-dialog-actions { display: flex; justify-content: flex-end; gap: 12px; }
.node-subscriptions-page [data-ns-share-content] { display: grid; gap: 16px; }
.node-subscriptions-page .ns-qr-wrap { display: grid; justify-items: center; gap: 12px; padding: 16px 0; text-align: center; }
.node-subscriptions-page .ns-qr-wrap img { max-width: 100%; width: 260px; height: auto; background: white; border-radius: 12px; }
.node-subscriptions-page [data-ns-share-url] { font-size: 12px; }
.node-subscriptions-page [hidden] { display: none !important; }
.node-subscriptions-page button:disabled { opacity: .55; cursor: not-allowed; }
.node-subscriptions-standalone .ns-main { width: 100%; margin-left: 0; padding-top: 28px; }
.node-subscriptions-page .ns-console-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; max-width: 1396px; margin: 0 auto; padding: 18px 28px; border-bottom: 1px solid var(--color-border); }
.node-subscriptions-page .ns-console-header > a { font-weight: 700; text-decoration: none; color: var(--color-text-primary); }
.node-subscriptions-page .ns-console-header > a span { margin-left: 12px; font-size: 12px; font-weight: 400; color: var(--color-text-secondary); }
.node-subscriptions-page .ns-console-header > div { display: flex; align-items: center; gap: 18px; font-size: 13px; }
.node-subscriptions-page .ns-console-header > div span { color: var(--color-text-secondary); }
.node-subscriptions-page .ns-console-header button { border: 0; background: transparent; color: var(--color-text-primary); cursor: pointer; font: inherit; }
.node-subscriptions-page .ns-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 16px; }
.node-subscriptions-page .ns-metrics > div { padding: 14px; border: 1px solid var(--color-border); border-radius: 10px; background: var(--color-bg-subtle); }
.node-subscriptions-page .ns-metrics span { display: block; margin-bottom: 8px; color: var(--color-text-secondary); font-size: 12px; }
.node-subscriptions-page .ns-metrics strong { font-size: 15px; font-variant-numeric: tabular-nums; }
.node-subscriptions-page .ns-charts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:20px 0; }
.node-subscriptions-page .ns-chart { min-width:0; padding:16px; border:1px solid var(--color-border); border-radius:12px; }
.node-subscriptions-page .ns-chart > div { display:flex; justify-content:space-between; gap:12px; font-size:13px; }
.node-subscriptions-page .ns-chart svg { display:block; width:100%; margin:16px 0 8px; border-bottom:1px solid var(--color-border); }
.node-subscriptions-page .ns-chart path { fill:none; stroke-width:2; vector-effect:non-scaling-stroke; }
.node-subscriptions-page .ns-chart-primary { stroke:#42604a; }
.node-subscriptions-page .ns-chart-secondary { stroke:#899d66; }
.node-subscriptions-page .ns-chart small { display:block; color:var(--color-text-secondary); font-size:11px; line-height:1.6; }
.node-subscriptions-page .ns-ranking { list-style: none; display: grid; gap: 12px; margin: 0; padding: 0; }
.node-subscriptions-page .ns-ranking li { display: grid; grid-template-columns: minmax(100px,1fr) minmax(120px,3fr) minmax(130px,1fr); align-items: center; gap: 18px; font-size: 13px; }
.node-subscriptions-page .ns-ranking progress { width: 100%; height: 8px; border: 0; border-radius: 10px; accent-color: var(--color-status); }
.node-subscriptions-page .ns-ranking strong { text-align: right; font-variant-numeric: tabular-nums; }
.node-subscriptions-page .ns-duration { display: grid; grid-template-columns: minmax(0,1fr) 92px; gap: 8px; }
.node-subscriptions-page .ns-operator-list { display: grid; gap: 12px; }
.node-subscriptions-page .ns-operator-card { display: flex; justify-content: space-between; gap: 18px; padding: 18px; border: 1px solid var(--color-border); border-radius: 12px; }
.node-subscriptions-page .ns-operator-card > div:first-child { display: grid; align-content: start; gap: 8px; }
.node-subscriptions-page .ns-operator-card small { color: var(--color-text-secondary); }
.node-subscriptions-page .ns-operator-actions { display: flex; flex-wrap: wrap; align-items: end; gap: 8px; }
.node-subscriptions-page .ns-operator-actions form:first-child { display: flex; align-items: end; gap: 8px; }
.node-subscriptions-page .ns-operator-actions label { display: grid; gap: 4px; font-size: 12px; }
.node-subscriptions-page .ns-operator-actions input { min-height: 44px; border: 1px solid var(--color-border-strong); border-radius: 8px; padding: 8px; }
@media (max-width: 760px) {
  .node-subscriptions-page .ns-summary { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .node-subscriptions-page .ns-summary .admin-stat-card { min-height:112px; padding:16px; }
  .node-subscriptions-page .ns-table-wrap .admin-table td[data-label]::before { content:attr(data-label); }
  .node-subscriptions-page .ns-console-header { flex-wrap: wrap; padding: 16px; }
  .node-subscriptions-page .ns-console-header > div { flex-wrap: wrap; gap: 12px; }
  .node-subscriptions-page .ns-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .node-subscriptions-page .ns-ranking li { grid-template-columns: 1fr auto; }
  .node-subscriptions-page .ns-ranking progress { grid-column: 1 / -1; grid-row: 2; }
  .node-subscriptions-page .ns-operator-card { flex-direction: column; }
  .node-subscriptions-page .ns-charts { grid-template-columns:1fr; }
  .node-subscriptions-page .ns-operator-actions form:first-child { flex-wrap:wrap; }
  .node-subscriptions-page .ns-operator-actions input { max-width:100%; min-width:0; }
}
@media (max-width: 1100px) {
  .node-subscriptions-page .ns-bottom-grid { grid-template-columns: 1fr; gap: 0; }
}
@media (max-width: 760px) {
  .node-subscriptions-page .ns-users-table,
  .node-subscriptions-page .ns-jobs-table { min-width: 0; display: block; }
  .node-subscriptions-page .ns-users-table thead,
  .node-subscriptions-page .ns-jobs-table thead { display: none; }
  .node-subscriptions-page .ns-users-table tbody,
  .node-subscriptions-page .ns-jobs-table tbody { display: grid; gap: 16px; }
  .node-subscriptions-page .ns-users-table tr,
  .node-subscriptions-page .ns-jobs-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 16px; border: 1px solid var(--color-border); border-radius: 12px; }
  .node-subscriptions-page .ns-users-table td,
  .node-subscriptions-page .ns-jobs-table td { display: block; padding: 0; border: 0; min-width: 0 !important; max-width: none !important; width: auto !important; overflow-wrap: anywhere; }
  .node-subscriptions-page .ns-users-table td::before,
  .node-subscriptions-page .ns-jobs-table td::before { content: attr(data-label); display: block; margin-bottom: 8px; color: var(--color-text-secondary); font-size: 11px; }
  .node-subscriptions-page .ns-users-table td:nth-child(4),
  .node-subscriptions-page .ns-users-table td:nth-child(5) { grid-column: 1 / -1; }
  .node-subscriptions-page .ns-user-actions .button { font-size: 13px; }
  .node-subscriptions-page .ns-node-card { padding: 16px; }
  .node-subscriptions-page .ns-dialog-content { padding: 20px; }
  .node-subscriptions-page .ns-dialog-actions .button { flex: 1; }
  .node-subscriptions-page .ns-create-form input,
  .node-subscriptions-page .ns-create-form select,
  .node-subscriptions-page .ns-dialog input { font-size: 16px; }
}

/* Monitor charts: readable axes, distinct series and inspection without page movement. */
.node-subscriptions-page .ns-chart { padding:20px; background:var(--color-surface,#fbfcf9); }
.node-subscriptions-page .ns-chart-heading { display:flex; justify-content:space-between; gap:12px; }
.node-subscriptions-page .ns-chart .ns-chart-values { display:flex; flex-wrap:wrap; justify-content:flex-start; gap:16px; min-height:28px; margin-top:14px; }
.node-subscriptions-page .ns-chart-value { font-size:14px; font-weight:600; font-variant-numeric:tabular-nums; }
.node-subscriptions-page .ns-chart-value::before { content:""; display:inline-block; width:8px; height:8px; border-radius:50%; background:#426b60; margin-right:6px; }
.node-subscriptions-page .ns-chart-value.ns-series-1::before { background:#b47b39; }
.node-subscriptions-page .ns-chart .ns-chart-plot { display:block; position:relative; }
.node-subscriptions-page .ns-chart svg { margin:12px 0 2px; border:0; overflow:visible; touch-action:pan-y; }
.node-subscriptions-page .ns-chart-grid { stroke:#dce2d9; stroke-width:1; stroke-dasharray:3 5; }
.node-subscriptions-page .ns-chart-axis { fill:#758075; font-size:11px; font-family:inherit; }
.node-subscriptions-page .ns-chart path.ns-chart-line { stroke:#426b60; stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.node-subscriptions-page .ns-chart path.ns-chart-line.ns-series-1 { stroke:#b47b39; stroke-dasharray:5 3; }
.node-subscriptions-page .ns-chart path.ns-chart-area { fill:#426b60; fill-opacity:.08; stroke:none; }
.node-subscriptions-page .ns-chart path.ns-chart-area.ns-series-1 { fill:#b47b39; fill-opacity:.06; }
.node-subscriptions-page .ns-chart-dot { fill:#426b60; }
.node-subscriptions-page .ns-chart-dot.ns-series-1 { fill:#b47b39; }
.node-subscriptions-page .ns-chart-cursor { stroke:#54665a; stroke-width:1; stroke-dasharray:3 3; }
.node-subscriptions-page .ns-chart-tooltip { position:absolute; top:0; left:8px; right:8px; padding:8px 10px; background:#243d32; color:#fff; border-radius:8px; font-size:12px; box-shadow:0 4px 14px #172b211a; pointer-events:none; z-index:1; }
.node-subscriptions-page .ns-chart-tooltip[hidden],.node-subscriptions-page .ns-toast[hidden] { display:none; }
.node-subscriptions-page .ns-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:100; padding:13px 20px; max-width:calc(100vw - 32px); border-radius:12px; color:#fff; background:#294b3d; box-shadow:0 8px 30px #14291d26; font-size:14px; }
.node-subscriptions-page .ns-toast.is-error { background:#873e35; }
@media(max-width:760px) { .node-subscriptions-page .ns-chart { padding:14px; } }
.node-subscriptions-page [data-ns-jobs] { display:flow-root; overflow-anchor:none; }
@media(max-width:760px) { .node-subscriptions-page .ns-chart-axis { font-size:18px; } }

/* Quota cards keep consumption and remaining allowance readable at all sizes. */
.node-subscriptions-page .ns-quota-overview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:20px 0; }
.node-subscriptions-page .ns-quota-overview > div { padding:18px; background:var(--color-bg-subtle); border-radius:12px; }
.node-subscriptions-page .ns-quota-overview span { display:block; color:var(--color-text-secondary); font-size:12px; margin-bottom:8px; }
.node-subscriptions-page .ns-quota-overview strong { font-size:24px; font-variant-numeric:tabular-nums; }
.node-subscriptions-page .ns-user-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.node-subscriptions-page .ns-user-card { --quota-color:var(--color-status); padding:24px; border:1px solid var(--color-border); border-radius:16px; background:var(--color-bg-content); min-width:0; }
.node-subscriptions-page .ns-user-card[data-quota-level="low"] { --quota-color:#ad762d; }
.node-subscriptions-page .ns-user-card[data-quota-level="exhausted"] { --quota-color:var(--color-danger); }
.node-subscriptions-page .ns-user-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.node-subscriptions-page .ns-user-heading h3 { font-size:18px; margin:0 0 6px; overflow-wrap:anywhere; }
.node-subscriptions-page .ns-user-heading small { color:var(--color-text-secondary); font-size:12px; }
.node-subscriptions-page .ns-user-heading .ns-pill { flex-shrink:0; }
.node-subscriptions-page .ns-usage-main { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-top:24px; }
.node-subscriptions-page .ns-usage-main > div > span { color:var(--color-text-secondary); font-size:12px; }
.node-subscriptions-page .ns-usage-main strong { display:block; font-size:32px; line-height:1.4; font-variant-numeric:tabular-nums; }
.node-subscriptions-page .ns-usage-percent { color:var(--quota-color); font-size:13px; padding-bottom:7px; white-space:nowrap; }
.node-subscriptions-page .ns-user-card progress { display:block; width:100%; height:10px; margin:12px 0; border:0; border-radius:99px; overflow:hidden; accent-color:var(--quota-color); background:var(--color-bg-subtle); }
.node-subscriptions-page .ns-user-card progress::-webkit-progress-bar { background:var(--color-bg-subtle); }
.node-subscriptions-page .ns-user-card progress::-webkit-progress-value { background:var(--quota-color); border-radius:99px; }
.node-subscriptions-page .ns-user-card progress::-moz-progress-bar { background:var(--quota-color); }
.node-subscriptions-page .ns-usage-balance { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; font-size:12px; color:var(--color-text-secondary); }
.node-subscriptions-page .ns-usage-balance strong { color:var(--color-text-primary); font-size:14px; font-variant-numeric:tabular-nums; margin-left:4px; }
.node-subscriptions-page .ns-quota-warning { margin:12px 0 0; font-size:12px; color:var(--quota-color); }
.node-subscriptions-page .ns-user-details { display:grid; gap:10px; margin:22px 0; padding-top:18px; border-top:1px solid var(--color-border); font-size:12px; }
.node-subscriptions-page .ns-user-details > div { display:flex; justify-content:space-between; gap:12px; }
.node-subscriptions-page .ns-user-details dt { color:var(--color-text-secondary); flex-shrink:0; }
.node-subscriptions-page .ns-user-details dd { margin:0; text-align:right; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.node-subscriptions-page .ns-measurement { margin:12px 0; padding:12px 14px; background:var(--color-bg-subtle); border-radius:10px; color:var(--color-text-secondary); font-size:12px; line-height:1.8; }
.node-subscriptions-page .ns-measurement summary { cursor:pointer; color:var(--color-text-primary); }
.node-subscriptions-page .ns-measurement p { margin:10px 0 0; }
@media(max-width:760px) {
  .node-subscriptions-page .ns-user-grid { grid-template-columns:1fr; }
  .node-subscriptions-page .ns-user-card { padding:18px; }
  .node-subscriptions-page .ns-quota-overview { gap:6px; }
  .node-subscriptions-page .ns-quota-overview > div { padding:12px 8px; }
  .node-subscriptions-page .ns-quota-overview strong { font-size:18px; }
  .node-subscriptions-page .ns-usage-main strong { font-size:28px; }
}