/* ==========================================================================
   HALO Control Plane — public design system (v0.5.0)
   Identity: graphite ink + signal lime. Density, precision, calm.
   UI face: Inter. Technical face: JetBrains Mono (paths, records, values).
   ========================================================================== */

:root {
  /* Ink scale */
  --hj-ink-900: #0f1216;
  --hj-ink-800: #171b21;
  --hj-ink-700: #232932;
  --hj-ink-500: #4a525e;
  --hj-ink-400: #6b7482;
  --hj-ink-300: #98a0ac;

  /* Canvas */
  --hj-bg: #f3f4f6;
  --hj-surface: #ffffff;
  --hj-surface-2: #f8f9fb;
  --hj-line: #e4e7ec;
  --hj-line-strong: #d3d8e0;

  /* Brand */
  --hj-lime: #d8f23b;
  --hj-lime-deep: #b8d41c;
  --hj-lime-ink: #29320a;
  --hj-lime-glow: rgba(216, 242, 59, 0.35);

  /* Status */
  --hj-good: #157347;
  --hj-good-bg: #e7f6ee;
  --hj-warn: #9a6b08;
  --hj-warn-bg: #fdf3dc;
  --hj-bad: #b3261e;
  --hj-bad-bg: #fceceb;
  --hj-info-bg: #eef2f7;

  /* Type */
  --hj-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --hj-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* Geometry */
  --hj-radius-lg: 16px;
  --hj-radius: 10px;
  --hj-radius-sm: 7px;
  --hj-shadow: 0 1px 2px rgba(15, 18, 22, 0.05), 0 6px 20px rgba(15, 18, 22, 0.05);
  --hj-shadow-pop: 0 8px 24px rgba(15, 18, 22, 0.14), 0 2px 6px rgba(15, 18, 22, 0.08);
  --hj-text: var(--hj-ink-900);
  --hj-muted: var(--hj-ink-400);
  --hj-focus: 0 0 0 2px var(--hj-surface), 0 0 0 4px var(--hj-lime-deep);
}

/* ---------- Base shell ---------- */

html.hj-cloud-os-ready,
html.hj-cloud-os-ready body,
body.hj-standalone-body {
  min-height: 100%;
  background: var(--hj-bg);
}

body.hj-standalone-body {
  margin: 0;
  font-family: var(--hj-font);
  color: var(--hj-text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.hj-shell,
.hj-shell *,
.hj-login-screen,
.hj-login-screen * {
  box-sizing: border-box;
}

.hj-shell {
  font-family: var(--hj-font);
  color: var(--hj-text);
  font-size: 13.5px;
  line-height: 1.5;
}

.hj-shell-standalone {
  min-height: 100vh;
  display: flex;
  background: var(--hj-bg);
}

.hj-shell-embedded {
  display: flex;
  min-height: 920px;
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius-lg);
  overflow: hidden;
  background: var(--hj-bg);
}

.hj-shell h1, .hj-shell h2, .hj-shell h3, .hj-shell h4 {
  margin: 0;
  color: var(--hj-text);
  letter-spacing: -0.01em;
}

.hj-shell a { color: var(--hj-ink-700); }
.hj-shell p { margin: 0; }

.hj-shell :focus { outline: none; }
.hj-shell :focus-visible,
.hj-login-screen :focus-visible {
  outline: none;
  box-shadow: var(--hj-focus);
  border-radius: var(--hj-radius-sm);
}

/* ---------- Sidebar: icon rail with the lime live-rail signature ---------- */

.hj-sidebar {
  width: 76px;
  background: linear-gradient(180deg, var(--hj-ink-800) 0%, var(--hj-ink-900) 100%);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 20px 10px;
  flex-shrink: 0;
  position: relative;
  z-index: 30;
}

.hj-sidebar-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  margin-bottom: 10px;
}

.hj-sidebar-brand img { width: 100%; height: auto; display: block; }

.hj-sidebar-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  align-items: center;
}

.hj-sidebar-nav a {
  position: relative;
  width: 44px;
  height: 42px;
  border-radius: var(--hj-radius);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.6);
  text-decoration: none;
  border: 1px solid transparent;
  transition: color 0.15s ease, background-color 0.15s ease;
}

.hj-sidebar-nav a svg { width: 19px; height: 19px; }

.hj-sidebar-nav a:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.07);
}

/* Live rail: active page carries a lime edge-bar bleeding off the rail */
.hj-sidebar-nav a.is-active {
  color: var(--hj-lime);
  background: rgba(216, 242, 59, 0.09);
}

.hj-sidebar-nav a.is-active::before {
  content: '';
  position: absolute;
  left: -10px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--hj-lime);
  box-shadow: 0 0 12px 1px var(--hj-lime-glow);
}

/* Rail tooltips from aria-label */
.hj-sidebar-nav a[aria-label]::after {
  content: attr(aria-label);
  position: absolute;
  left: calc(100% + 12px);
  top: 50%;
  transform: translateY(-50%) translateX(-4px);
  background: var(--hj-ink-900);
  color: #fff;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 5px 9px;
  border-radius: 6px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.12s ease, transform 0.12s ease;
  box-shadow: var(--hj-shadow-pop);
  z-index: 60;
}

.hj-sidebar-nav a[aria-label]:hover::after,
.hj-sidebar-nav a[aria-label]:focus-visible::after {
  opacity: 1;
  transform: translateY(-50%) translateX(0);
}

.hj-sidebar-user {
  margin-top: auto;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  background: var(--hj-lime);
  color: var(--hj-lime-ink);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
}

/* ---------- Main column ---------- */

.hj-main {
  min-width: 0;
  flex: 1;
  padding: 16px 20px 32px;
  overflow: auto;
}

.hj-topbar {
  min-height: 62px;
  background: var(--hj-surface);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius-lg);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 14px;
  box-shadow: var(--hj-shadow);
  flex-wrap: wrap;
}

.hj-topbar-left,
.hj-topbar-right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.hj-workspace-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--hj-ink-900);
  color: #fff;
  font-weight: 600;
  font-size: 12.5px;
  padding: 7px 14px 7px 9px;
  border-radius: 999px;
}

.hj-workspace-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  background: rgba(216, 242, 59, 0.16);
  color: var(--hj-lime);
}

.hj-workspace-icon svg { width: 12px; height: 12px; }

.hj-date-block {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 6px;
}

.hj-date-block strong {
  font-size: 21px;
  font-weight: 700;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

.hj-date-block div { display: flex; flex-direction: column; line-height: 1.15; }
.hj-date-block span { font-size: 11px; color: var(--hj-muted); font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; }

.hj-status-inline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--hj-good);
  background: var(--hj-good-bg);
  padding: 6px 12px;
  border-radius: 999px;
}

.hj-status-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--hj-good);
  position: relative;
}

.hj-status-dot::after {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 999px;
  border: 1.5px solid var(--hj-good);
  opacity: 0.5;
  animation: hj-pulse 2.4s ease-out infinite;
}

@keyframes hj-pulse {
  0% { transform: scale(0.6); opacity: 0.6; }
  70% { transform: scale(1.25); opacity: 0; }
  100% { opacity: 0; }
}

/* ---------- Buttons ---------- */

.hj-icon-button {
  width: 36px;
  height: 36px;
  border-radius: var(--hj-radius);
  border: 1px solid var(--hj-line);
  background: var(--hj-surface);
  color: var(--hj-ink-500);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  text-decoration: none;
  transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.hj-icon-button svg { width: 16px; height: 16px; }

.hj-icon-button:hover {
  border-color: var(--hj-line-strong);
  color: var(--hj-ink-900);
  background: var(--hj-surface-2);
}

.hj-primary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: var(--hj-ink-900);
  color: var(--hj-lime);
  border: 1px solid var(--hj-ink-900);
  font-family: var(--hj-font);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.01em;
  padding: 9px 16px;
  border-radius: var(--hj-radius);
  cursor: pointer;
  text-decoration: none;
  position: relative;
  transition: transform 0.1s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.hj-primary-button svg { width: 14px; height: 14px; }

.hj-primary-button:hover {
  background: var(--hj-ink-700);
  box-shadow: 0 3px 10px rgba(15, 18, 22, 0.22);
}

.hj-primary-button:active { transform: translateY(1px); }

.hj-primary-button-full { width: 100%; }

.hj-secondary-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  background: var(--hj-surface);
  color: var(--hj-ink-700);
  border: 1px solid var(--hj-line-strong);
  font-family: var(--hj-font);
  font-size: 12.5px;
  font-weight: 600;
  padding: 8px 14px;
  border-radius: var(--hj-radius);
  cursor: pointer;
  text-decoration: none;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.hj-secondary-button:hover {
  background: var(--hj-surface-2);
  border-color: var(--hj-ink-300);
}

.hj-link-button {
  background: none;
  border: none;
  padding: 3px 6px;
  margin: 0;
  font-family: var(--hj-font);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--hj-ink-700);
  cursor: pointer;
  text-decoration: none;
  border-radius: var(--hj-radius-sm);
  transition: background-color 0.12s ease, color 0.12s ease;
}

.hj-link-button:hover { background: var(--hj-info-bg); color: var(--hj-ink-900); }

.hj-danger-link { color: var(--hj-bad); }
.hj-danger-link:hover { background: var(--hj-bad-bg); color: var(--hj-bad); }

/* Button loading state (set by public.js) */
.hj-btn-loading { pointer-events: none; opacity: 0.75; }
.hj-btn-loading > * { visibility: hidden; }
.hj-btn-loading::after {
  content: '';
  position: absolute;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  animation: hj-spin 0.7s linear infinite;
}

.hj-link-button.hj-btn-loading::after,
.hj-secondary-button.hj-btn-loading::after { position: static; visibility: visible; display: inline-block; }
.hj-secondary-button.hj-btn-loading, .hj-link-button.hj-btn-loading { position: relative; }

@keyframes hj-spin { to { transform: rotate(360deg); } }

/* ---------- Page chrome ---------- */

.hj-page-title-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 18px 2px 14px;
}

.hj-page-title-row h1 {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.hj-inline-notice {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
  font-weight: 600;
  color: var(--hj-good);
  background: var(--hj-good-bg);
  border: 1px solid rgba(21, 115, 71, 0.18);
  padding: 5px 11px;
  border-radius: 999px;
}

.hj-inline-notice-error {
  color: var(--hj-bad);
  background: var(--hj-bad-bg);
  border-color: rgba(179, 38, 30, 0.2);
}

/* Panel-level server notices: no-JS fallback (JS lifts these into toasts) */
.hj-inline-success,
.hj-inline-note {
  font-size: 12.5px;
  font-weight: 600;
  border-radius: var(--hj-radius);
  padding: 9px 12px;
  margin: 8px 0;
}

.hj-inline-success {
  color: var(--hj-good);
  background: var(--hj-good-bg);
  border: 1px solid rgba(21, 115, 71, 0.18);
}

.hj-inline-note {
  color: var(--hj-ink-500);
  background: var(--hj-info-bg);
  border: 1px solid var(--hj-line);
}

/* Inline record editors (details/summary) inside tables */
.hj-shell details { position: relative; }

.hj-shell details > summary {
  list-style: none;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  color: var(--hj-ink-700);
  padding: 3px 8px;
  border: 1px solid var(--hj-line-strong);
  border-radius: 999px;
  display: inline-block;
  transition: background-color 0.12s ease, border-color 0.12s ease;
  user-select: none;
}

.hj-shell details > summary::-webkit-details-marker { display: none; }
.hj-shell details > summary:hover { background: var(--hj-surface-2); border-color: var(--hj-ink-300); }

.hj-shell details[open] > summary {
  background: var(--hj-ink-900);
  border-color: var(--hj-ink-900);
  color: var(--hj-lime);
}

.hj-shell details[open] {
  background: var(--hj-surface-2);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  padding: 10px;
}

.hj-inline-error {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--hj-bad);
  background: var(--hj-bad-bg);
  border: 1px solid rgba(179, 38, 30, 0.18);
  border-radius: var(--hj-radius);
  padding: 10px 13px;
  margin: 10px 0;
}

/* ---------- Grid + panels ---------- */

.hj-page-grid {
  display: grid;
  gap: 16px;
  align-items: start;
}

.hj-page-grid-2 { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); }

.hj-overview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.hj-overview-main, .hj-overview-side {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

/* Files gets more room for the browser table than the editor column */
.hj-files-layout { grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr); }

/* Native module pages: even split reads better for domains + tools */
.hj-native-domains-page, .hj-native-tools-page { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }

.hj-native-tools-page .hj-tool-card span:last-child,
.hj-native-domains-page .hj-tool-card span:last-child {
  font-family: var(--hj-mono);
  font-size: 10.5px;
  color: var(--hj-ink-300);
  font-weight: 500;
}

.hj-panel {
  background: var(--hj-surface);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius-lg);
  padding: 18px;
  box-shadow: var(--hj-shadow);
  min-width: 0;
}

.hj-wide-panel { grid-column: 1 / -1; }

.hj-panel-table { padding: 18px 18px 8px; }
.hj-panel-table .hj-table-wrap { margin: 0 -18px; border-left: none; border-right: none; border-radius: 0; border-bottom: none; }

.hj-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.hj-panel-head h2 {
  font-size: 14.5px;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.hj-panel-head a {
  font-size: 12px;
  font-weight: 600;
  color: var(--hj-ink-500);
  text-decoration: none;
  border-bottom: 1px solid var(--hj-line-strong);
  padding-bottom: 1px;
  transition: color 0.12s ease, border-color 0.12s ease;
}

.hj-panel-head a:hover { color: var(--hj-ink-900); border-color: var(--hj-ink-900); }

.hj-copy {
  font-size: 12.5px;
  color: var(--hj-muted);
  line-height: 1.55;
  margin: 8px 0;
  max-width: 68ch;
}

.hj-section-mini-title {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--hj-ink-400);
  margin: 16px 0 8px;
}

.hj-tool-divider {
  height: 1px;
  background: var(--hj-line);
  margin: 16px 0;
}

.hj-empty {
  border: 1px dashed var(--hj-line-strong);
  border-radius: var(--hj-radius);
  padding: 22px 18px;
  text-align: center;
  background: var(--hj-surface-2);
  margin: 8px 0;
}

.hj-empty h3 { font-size: 13.5px; font-weight: 700; margin-bottom: 5px; }
.hj-empty p { font-size: 12.5px; color: var(--hj-muted); max-width: 46ch; margin: 0 auto; }

/* ---------- Metric cards ---------- */

.hj-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
}

.hj-metric-card {
  background: var(--hj-surface);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius-lg);
  padding: 14px 15px;
  box-shadow: var(--hj-shadow);
  min-width: 0;
}

.hj-metric-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.hj-metric-top span:not(.hj-metric-icon) {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--hj-ink-400);
}

.hj-metric-icon {
  width: 30px;
  height: 30px;
  border-radius: var(--hj-radius);
  background: var(--hj-ink-900);
  color: var(--hj-lime);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.hj-metric-icon svg { width: 14px; height: 14px; }

.hj-metric-value {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}

.hj-metric-card > span, .hj-metric-card small {
  display: block;
  font-size: 11.5px;
  color: var(--hj-muted);
  margin-top: 3px;
}

/* ---------- Summary / legend / tasks / side lists ---------- */

.hj-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 10px;
}

.hj-summary-grid > div {
  background: var(--hj-surface-2);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  padding: 11px 12px;
}

.hj-summary-grid span { display: block; font-size: 11px; font-weight: 600; color: var(--hj-muted); text-transform: uppercase; letter-spacing: 0.05em; }

.hj-summary-number {
  font-size: 20px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}

.hj-legend-list {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.hj-legend-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 12.5px;
  color: var(--hj-ink-500);
  padding: 6px 2px;
  border-bottom: 1px dashed var(--hj-line);
}

.hj-legend-list li:last-child { border-bottom: none; }
.hj-legend-list strong { font-variant-numeric: tabular-nums; color: var(--hj-text); }

.hj-task-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }

.hj-task-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  background: var(--hj-surface-2);
  font-size: 12.5px;
}

.hj-task-check {
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background: var(--hj-lime);
  color: var(--hj-lime-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
  flex-shrink: 0;
  margin-top: 1px;
}

.hj-side-list { display: flex; flex-direction: column; gap: 8px; }

.hj-side-item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  background: var(--hj-surface);
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

.hj-side-item:hover { border-color: var(--hj-line-strong); background: var(--hj-surface-2); }

.hj-side-item.is-highlight {
  border-color: rgba(184, 212, 28, 0.55);
  background: linear-gradient(90deg, rgba(216, 242, 59, 0.1), transparent 70%);
}

.hj-side-item-icon {
  width: 32px;
  height: 32px;
  border-radius: var(--hj-radius);
  background: var(--hj-ink-900);
  color: var(--hj-lime);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.hj-side-item-icon svg { width: 14px; height: 14px; }

.hj-side-item-main { min-width: 0; flex: 1; }
.hj-side-item-main strong { display: block; font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-side-item-main span { display: block; font-size: 11.5px; color: var(--hj-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-side-item-meta { font-size: 11.5px; color: var(--hj-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }

.hj-mini-list { display: flex; flex-direction: column; gap: 7px; margin: 8px 0; }

.hj-mini-item {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12.5px;
  padding: 8px 10px;
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  background: var(--hj-surface-2);
}

.hj-mini-icon {
  width: 24px;
  height: 24px;
  border-radius: var(--hj-radius-sm);
  background: var(--hj-ink-900);
  color: var(--hj-lime);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.hj-mini-icon svg { width: 11px; height: 11px; }

/* ---------- Data rows ---------- */

.hj-data-list { display: flex; flex-direction: column; }

.hj-data-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 2px;
  border-bottom: 1px solid var(--hj-line);
}

.hj-data-row:last-child { border-bottom: none; }
.hj-data-main { min-width: 0; }
.hj-data-main strong { display: block; font-size: 13px; font-weight: 600; }
.hj-data-main span { display: block; font-size: 11.5px; color: var(--hj-muted); }

.hj-settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
  margin: 10px 0;
}

.hj-settings-grid > div {
  background: var(--hj-surface-2);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  padding: 9px 11px;
  min-width: 0;
}

.hj-settings-grid span {
  display: block;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--hj-ink-400);
  margin-bottom: 2px;
}

.hj-settings-grid strong {
  display: block;
  font-family: var(--hj-mono);
  font-size: 11.5px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---------- Status pills + chips ---------- */

.hj-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: capitalize;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--hj-info-bg);
  color: var(--hj-ink-500);
  border: 1px solid var(--hj-line);
  white-space: nowrap;
}

.hj-pill::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.75;
}

.hj-pill-active, .hj-pill-paid, .hj-pill-completed, .hj-pill-open, .hj-pill-resolved, .hj-pill-verified, .hj-pill-connected {
  background: var(--hj-good-bg);
  color: var(--hj-good);
  border-color: rgba(21, 115, 71, 0.18);
}

.hj-pill-pending, .hj-pill-queued, .hj-pill-processing, .hj-pill-suspended, .hj-pill-unpaid, .hj-pill-expiring {
  background: var(--hj-warn-bg);
  color: var(--hj-warn);
  border-color: rgba(154, 107, 8, 0.2);
}

.hj-pill-failed, .hj-pill-terminated, .hj-pill-error, .hj-pill-overdue, .hj-pill-expired {
  background: var(--hj-bad-bg);
  color: var(--hj-bad);
  border-color: rgba(179, 38, 30, 0.2);
}

.hj-chip {
  display: inline-flex;
  align-items: center;
  font-size: 11.5px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
}

.hj-chip.is-good { background: var(--hj-good-bg); color: var(--hj-good); }
.hj-chip.is-warn { background: var(--hj-warn-bg); color: var(--hj-warn); }

.hj-ok { color: var(--hj-good); font-weight: 700; }
.hj-bad { color: var(--hj-bad); font-weight: 700; }
.is-good { color: var(--hj-good); }
.is-bad { color: var(--hj-bad); }
.is-warn { color: var(--hj-warn); }
.is-muted { color: var(--hj-muted); }

/* ---------- Forms ---------- */

.hj-form { display: flex; flex-direction: column; gap: 11px; margin: 10px 0; }

.hj-form label {
  display: flex;
  flex-direction: column;
  gap: 5px;
  font-size: 11.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--hj-ink-500);
}

.hj-form input[type="text"],
.hj-form input[type="search"],
.hj-form input[type="email"],
.hj-form input[type="password"],
.hj-form input[type="number"],
.hj-form input[type="url"],
.hj-form select,
.hj-form textarea {
  font-family: var(--hj-font);
  font-size: 13px;
  font-weight: 500;
  color: var(--hj-text);
  background: var(--hj-surface);
  border: 1px solid var(--hj-line-strong);
  border-radius: var(--hj-radius);
  padding: 9px 11px;
  width: 100%;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  text-transform: none;
  letter-spacing: normal;
}

.hj-form input[type="file"] {
  font-family: var(--hj-font);
  font-size: 12.5px;
  text-transform: none;
  letter-spacing: normal;
  font-weight: 500;
  padding: 8px 0;
}

.hj-form input:focus, .hj-form select:focus, .hj-form textarea:focus {
  border-color: var(--hj-ink-700);
  box-shadow: 0 0 0 3px rgba(35, 41, 50, 0.08);
  outline: none;
}

.hj-form input::placeholder, .hj-form textarea::placeholder { color: var(--hj-ink-300); font-weight: 400; }

/* Technical inputs render in mono: paths, permissions, records, archives */
.hj-form input[name="file"],
.hj-form input[name="path"],
.hj-form input[name="target_path"],
.hj-form input[name="destination"],
.hj-form input[name="permissions"],
.hj-form input[name="archive_name"],
.hj-form input[name="name"],
.hj-form input[name="record_value"],
.hj-form input[name="value"] {
  font-family: var(--hj-mono);
  font-size: 12px;
}

.hj-form textarea {
  font-family: var(--hj-mono);
  font-size: 12px;
  line-height: 1.6;
  min-height: 150px;
  resize: vertical;
  background: var(--hj-ink-900);
  color: #e8ecf1;
  border-color: var(--hj-ink-700);
  tab-size: 4;
}

.hj-form textarea:focus {
  border-color: var(--hj-lime-deep);
  box-shadow: 0 0 0 3px var(--hj-lime-glow);
}

.hj-form-split {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}

.hj-file-form-stack { padding: 13px; border: 1px solid var(--hj-line); border-radius: var(--hj-radius); background: var(--hj-surface-2); }
.hj-mini-form { margin: 8px 0; }
.hj-mini-tool-form { padding: 12px; border: 1px solid var(--hj-line); border-radius: var(--hj-radius); background: var(--hj-surface-2); margin: 8px 0; }
.hj-tool-action-form { padding: 12px; border: 1px solid var(--hj-line); border-radius: var(--hj-radius); background: var(--hj-surface-2); }

.hj-row-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 8px 0;
}

.hj-row-actions a {
  font-size: 12px;
  font-weight: 600;
  color: var(--hj-ink-600, var(--hj-ink-500));
  text-decoration: none;
  border: 1px solid var(--hj-line-strong);
  border-radius: 999px;
  padding: 5px 12px;
  transition: border-color 0.12s ease, background-color 0.12s ease, color 0.12s ease;
}

.hj-row-actions a:hover, .hj-row-actions a.is-active {
  background: var(--hj-ink-900);
  border-color: var(--hj-ink-900);
  color: var(--hj-lime);
}

.hj-service-switcher { margin-bottom: 12px; }

/* ---------- Tables ---------- */

.hj-table-wrap { overflow-x: auto; border: 1px solid var(--hj-line); border-radius: var(--hj-radius); }

.hj-table, .hj-file-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12.5px;
}

.hj-table th, .hj-file-table th {
  text-align: left;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--hj-ink-400);
  background: var(--hj-surface-2);
  padding: 9px 12px;
  border-bottom: 1px solid var(--hj-line);
  white-space: nowrap;
  position: sticky;
  top: 0;
  z-index: 2;
}

th.hj-sortable { cursor: pointer; user-select: none; }
th.hj-sortable:hover { color: var(--hj-ink-900); }
th.hj-sortable::after { content: ' ↕'; opacity: 0.4; font-size: 10px; }
th.hj-sortable.hj-sort-asc::after { content: ' ↑'; opacity: 1; }
th.hj-sortable.hj-sort-desc::after { content: ' ↓'; opacity: 1; }

.hj-table td, .hj-file-table td {
  padding: 9px 12px;
  border-bottom: 1px solid var(--hj-line);
  vertical-align: middle;
  color: var(--hj-ink-700);
}

.hj-table tbody tr:last-child td, .hj-file-table tbody tr:last-child td { border-bottom: none; }

.hj-table tbody tr, .hj-file-table tbody tr { transition: background-color 0.1s ease; }
.hj-table tbody tr:hover, .hj-file-table tbody tr:hover { background: var(--hj-surface-2); }

.hj-file-table { border: 1px solid var(--hj-line); border-radius: var(--hj-radius); overflow: visible; display: table; table-layout: auto; }

/* Mono for technical columns rendered by the panel */
.hj-file-table td:nth-child(3),
.hj-file-table td:nth-child(4),
.hj-file-table td:nth-child(5),
.hj-file-table td:nth-child(6) {
  font-family: var(--hj-mono);
  font-size: 11.5px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-variant-numeric: tabular-nums;
}

.hj-table-icon {
  width: 28px;
  height: 28px;
  border-radius: var(--hj-radius-sm);
  background: var(--hj-info-bg);
  color: var(--hj-ink-500);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.hj-table-icon svg { width: 13px; height: 13px; }

.hj-table-service { display: flex; align-items: center; gap: 10px; min-width: 0; }

.hj-table-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
}

.hj-table-actions form { margin: 0; display: inline-flex; }

.hj-file-name-wrap { display: flex; align-items: center; gap: 10px; min-width: 0; }
.hj-file-name-wrap > div { min-width: 0; }
.hj-file-name-wrap a { text-decoration: none; }
.hj-file-name-wrap a:hover strong { text-decoration: underline; }
.hj-file-name-wrap strong { display: block; font-size: 12.5px; font-weight: 600; color: var(--hj-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 300px; }
.hj-file-name-wrap span { display: block; font-family: var(--hj-mono); font-size: 10.5px; color: var(--hj-ink-300); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 300px; }

/* ---------- File browser ---------- */

.hj-file-browser { margin-top: 12px; }

.hj-file-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.hj-file-breadcrumb {
  font-family: var(--hj-mono);
  font-size: 12px;
  font-weight: 600;
  color: var(--hj-ink-700);
  background: var(--hj-surface-2);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  padding: 8px 12px;
  flex: 1;
  min-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hj-file-search {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0;
}

.hj-file-search input[type="search"] {
  font-family: var(--hj-font);
  font-size: 12.5px;
  border: 1px solid var(--hj-line-strong);
  border-radius: var(--hj-radius);
  padding: 8px 11px;
  min-width: 180px;
  background: var(--hj-surface);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.hj-file-search input[type="search"]:focus {
  border-color: var(--hj-ink-700);
  box-shadow: 0 0 0 3px rgba(35, 41, 50, 0.08);
  outline: none;
}

.hj-file-advanced-tools h3 { font-size: 13px; font-weight: 700; margin-bottom: 6px; }

/* ---------- Service cards ---------- */

.hj-service-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 12px;
}

.hj-service-card {
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius-lg);
  background: var(--hj-surface);
  padding: 14px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  min-width: 0;
}

.hj-service-card:hover { border-color: var(--hj-line-strong); box-shadow: var(--hj-shadow); }

.hj-service-card.is-selected {
  border-color: var(--hj-lime-deep);
  box-shadow: 0 0 0 3px var(--hj-lime-glow);
}

.hj-service-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.hj-service-card-head strong { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.hj-service-meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 10px 0;
}

.hj-service-meta-grid > div { min-width: 0; }
.hj-service-meta-grid span { display: block; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: var(--hj-ink-400); }
.hj-service-meta-grid strong { display: block; font-family: var(--hj-mono); font-size: 11px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- Tools ---------- */

.hj-tool-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 10px;
}

.hj-tool-card {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  background: var(--hj-surface);
  padding: 11px 12px;
  text-decoration: none;
  color: var(--hj-text);
  font-size: 12.5px;
  font-weight: 600;
  transition: border-color 0.15s ease, background-color 0.15s ease, transform 0.1s ease;
  min-width: 0;
}

.hj-tool-card:hover {
  border-color: var(--hj-ink-900);
  background: var(--hj-surface-2);
  transform: translateY(-1px);
}

.hj-tool-card-icon {
  width: 30px;
  height: 30px;
  border-radius: var(--hj-radius-sm);
  background: var(--hj-ink-900);
  color: var(--hj-lime);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.hj-tool-card-icon svg { width: 14px; height: 14px; }

.hj-tool-section { margin: 14px 0; }
.hj-native-tool-section { margin: 16px 0; }

.hj-tool-rows { display: flex; flex-direction: column; gap: 6px; margin: 8px 0; }

.hj-tool-row {
  display: grid;
  grid-template-columns: minmax(120px, 0.35fr) minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  background: var(--hj-surface-2);
  padding: 8px 11px;
  font-size: 12.5px;
  min-width: 0;
}

.hj-tool-row strong { font-family: var(--hj-mono); font-size: 11.5px; overflow-wrap: anywhere; word-break: break-word; }
.hj-tool-row span { color: var(--hj-muted); font-size: 11.5px; white-space: normal; overflow-wrap: anywhere; word-break: break-word; }

.hj-tool-data-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}

.hj-tool-data-card {
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  background: var(--hj-surface);
  padding: 12px 13px;
  min-width: 0;
}

.hj-tool-data-card h3, .hj-tool-data-card h4 { font-size: 12.5px; font-weight: 700; margin-bottom: 6px; }

/* ---------- Native module chrome ---------- */

.hj-native-subnav {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 4px 0 14px;
}

.hj-native-subnav a {
  font-size: 12px;
  font-weight: 600;
  color: var(--hj-ink-500);
  text-decoration: none;
  border: 1px solid var(--hj-line-strong);
  border-radius: 999px;
  padding: 6px 13px;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}

.hj-native-subnav a:hover, .hj-native-subnav a.is-active {
  background: var(--hj-ink-900);
  border-color: var(--hj-ink-900);
  color: var(--hj-lime);
}

.hj-native-table td { font-size: 12px; }

.hj-zone-editor-table-wrap { overflow-x: auto; border: 1px solid var(--hj-line); border-radius: var(--hj-radius); }
.hj-zone-editor-table { border: none; border-radius: 0; }

.hj-zone-value {
  font-family: var(--hj-mono);
  font-size: 11px;
  background: var(--hj-surface-2);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius-sm);
  padding: 3px 7px;
  display: inline-block;
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  vertical-align: middle;
  cursor: copy;
  transition: border-color 0.12s ease, background-color 0.12s ease;
}

.hj-zone-value:hover { border-color: var(--hj-ink-300); background: var(--hj-surface); }
.hj-zone-value.hj-copied { border-color: var(--hj-lime-deep); background: rgba(216, 242, 59, 0.16); }

.hj-record-actions { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.hj-record-actions form { margin: 0; display: inline-flex; }

/* ---------- Diagnostics ---------- */

.hj-diagnostics-list { display: flex; flex-direction: column; gap: 7px; }

.hj-diagnostic-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius);
  background: var(--hj-surface-2);
  padding: 9px 12px;
  font-size: 12.5px;
}

.hj-diagnostic-row strong { font-size: 12.5px; }
.hj-diagnostic-row span { font-family: var(--hj-mono); font-size: 11px; color: var(--hj-muted); }

/* ---------- Billing ---------- */

.hj-billing-stack { display: flex; flex-direction: column; gap: 10px; }

.hj-billing-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border-top: 1px solid var(--hj-line);
  margin-top: 12px;
  padding-top: 12px;
  font-size: 12.5px;
  flex-wrap: wrap;
}

/* ---------- Login ---------- */

.hj-login-screen {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
  font-family: var(--hj-font);
  background:
    radial-gradient(700px 380px at 85% -10%, rgba(216, 242, 59, 0.16), transparent 65%),
    radial-gradient(600px 400px at -10% 110%, rgba(216, 242, 59, 0.08), transparent 60%),
    linear-gradient(165deg, var(--hj-ink-800), var(--hj-ink-900));
}

.hj-login-card {
  width: 100%;
  max-width: 430px;
  background: var(--hj-surface);
  border-radius: 20px;
  padding: 36px 34px;
  text-align: center;
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.4);
}

.hj-login-logo { width: 120px; height: auto; margin: 0 auto 18px; display: block; }

.hj-login-kicker {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--hj-ink-400);
  margin-bottom: 8px;
}

.hj-login-card h1 { font-size: 21px; font-weight: 700; letter-spacing: -0.02em; margin-bottom: 10px; }
.hj-login-card p { font-size: 13px; color: var(--hj-muted); line-height: 1.6; margin-bottom: 20px; }

/* ==========================================================================
   Client layer components (injected by public.js)
   ========================================================================== */

/* Top progress bar: perceived-speed signal on navigation + form submits */
.hj-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0;
  background: linear-gradient(90deg, var(--hj-lime-deep), var(--hj-lime));
  box-shadow: 0 0 10px var(--hj-lime-glow);
  z-index: 9999;
  transition: width 0.25s ease, opacity 0.3s ease;
  opacity: 0;
  pointer-events: none;
}

.hj-progress.is-on { opacity: 1; }

/* Toasts */
.hj-toast-stack {
  position: fixed;
  right: 18px;
  bottom: 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 9998;
  max-width: min(92vw, 380px);
}

.hj-toast {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: var(--hj-ink-900);
  color: #f0f3f6;
  font-family: var(--hj-font);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.45;
  border-radius: 12px;
  padding: 12px 14px;
  box-shadow: var(--hj-shadow-pop);
  border-left: 3px solid var(--hj-lime);
  animation: hj-toast-in 0.22s ease;
}

.hj-toast.is-error { border-left-color: #ff6b5e; }
.hj-toast.is-error .hj-toast-dot { background: #ff6b5e; }

.hj-toast-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: var(--hj-lime);
  margin-top: 5px;
  flex-shrink: 0;
}

.hj-toast button {
  margin-left: auto;
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.55);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
  font-family: var(--hj-font);
}

.hj-toast button:hover { color: #fff; }

@keyframes hj-toast-in {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Confirm modal for destructive actions */
.hj-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 18, 22, 0.55);
  backdrop-filter: blur(2px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9997;
  padding: 20px;
  animation: hj-fade-in 0.15s ease;
}

@keyframes hj-fade-in { from { opacity: 0; } to { opacity: 1; } }

.hj-modal {
  width: 100%;
  max-width: 400px;
  background: var(--hj-surface);
  border-radius: 16px;
  padding: 22px;
  font-family: var(--hj-font);
  box-shadow: var(--hj-shadow-pop);
  animation: hj-toast-in 0.18s ease;
}

.hj-modal h3 { font-size: 15px; font-weight: 700; margin: 0 0 8px; color: var(--hj-text); letter-spacing: -0.01em; }
.hj-modal p { font-size: 13px; color: var(--hj-muted); line-height: 1.55; margin: 0 0 8px; }

.hj-modal .hj-modal-target {
  font-family: var(--hj-mono);
  font-size: 11.5px;
  background: var(--hj-surface-2);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius-sm);
  padding: 7px 10px;
  color: var(--hj-ink-700);
  word-break: break-all;
  margin: 0 0 16px;
}

.hj-modal-actions { display: flex; gap: 8px; justify-content: flex-end; }

.hj-modal-actions .hj-modal-danger {
  background: var(--hj-bad);
  border-color: var(--hj-bad);
  color: #fff;
}

.hj-modal-actions .hj-modal-danger:hover { background: #97201a; box-shadow: 0 3px 10px rgba(179, 38, 30, 0.3); }

/* ---------- Motion + accessibility floor ---------- */

@media (prefers-reduced-motion: reduce) {
  .hj-shell *, .hj-toast, .hj-modal, .hj-modal-overlay, .hj-progress, .hj-status-dot::after {
    animation: none !important;
    transition: none !important;
  }
}

/* ==========================================================================
   Responsive: rail becomes a bottom dock, panels stack, tables scroll
   ========================================================================== */

@media (max-width: 1100px) {
  .hj-page-grid-2, .hj-overview-grid,
  .hj-files-layout, .hj-native-domains-page, .hj-native-tools-page { grid-template-columns: 1fr; }
  .hj-file-name-wrap strong, .hj-file-name-wrap span { max-width: 200px; }
}

@media (max-width: 760px) {
  .hj-shell-standalone { flex-direction: column-reverse; }
  .hj-shell-embedded { flex-direction: column-reverse; min-height: 0; }

  .hj-sidebar {
    width: 100%;
    flex-direction: row;
    align-items: center;
    padding: 8px 12px;
    gap: 8px;
    position: sticky;
    bottom: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  .hj-sidebar-brand { width: 34px; height: 34px; margin: 0; flex-shrink: 0; }

  .hj-sidebar-nav {
    flex-direction: row;
    overflow-x: auto;
    justify-content: flex-start;
    gap: 2px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .hj-sidebar-nav::-webkit-scrollbar { display: none; }
  .hj-sidebar-nav a { width: 42px; height: 40px; flex-shrink: 0; }
  .hj-sidebar-nav a[aria-label]::after { display: none; }

  .hj-sidebar-nav a.is-active::before {
    left: 8px;
    right: 8px;
    top: auto;
    bottom: -8px;
    width: auto;
    height: 3px;
    border-radius: 3px 3px 0 0;
  }

  .hj-sidebar-user { margin-top: 0; margin-left: auto; width: 32px; height: 32px; font-size: 12px; }

  .hj-main { padding: 12px 12px 20px; }
  .hj-topbar { padding: 10px 12px; }
  .hj-date-block { display: none; }
  .hj-status-inline { display: none; }
  .hj-primary-button span { display: none; }
  .hj-primary-button { padding: 9px 11px; }
  .hj-page-title-row h1 { font-size: 18px; }
  .hj-panel { padding: 14px; border-radius: 14px; }

  .hj-file-table, .hj-table { display: block; overflow-x: auto; white-space: normal; }
  .hj-file-name-wrap strong, .hj-file-name-wrap span { max-width: 160px; }

  .hj-toast-stack { right: 10px; bottom: 74px; left: 10px; max-width: none; }
}

/* HALO frontend cPanel bridge diagnostics v0.5.4 */
.hj-diagnostic-hint {
  margin-top: 10px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(185, 28, 28, 0.16);
  background: #fff7f7;
  color: #7f1d1d;
}
.hj-diagnostic-hint p { margin: 0 0 6px; }
.hj-diagnostic-hint p:last-child { margin-bottom: 0; }
.hj-diagnostic-hint small { display: block; color: #9f1239; }


/* HALO v0.5.6: production technical data should never be visually hidden. */
.hj-zone-editor-table th,
.hj-zone-editor-table td,
.hj-native-table th,
.hj-native-table td,
.hj-file-table td {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.hj-record-raw summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--hj-ink-700);
}

.hj-record-raw pre {
  max-width: 520px;
  max-height: 260px;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: var(--hj-surface-2);
  border: 1px solid var(--hj-line);
  border-radius: var(--hj-radius-sm);
  padding: 8px;
  font-family: var(--hj-mono);
  font-size: 11px;
}

.hj-zone-editor-table-wrap,
.hj-table-wrap {
  overflow-x: auto;
}

/* HALO v0.5.7 control-suite refinements */
.hj-file-editor-panel,
.hj-sticky-action-panel { align-self: start; position: sticky; top: 18px; }
.hj-file-editor-panel .hj-panel-head { align-items: flex-start; }
.hj-editor-status { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 6px 9px; border: 1px solid var(--hj-line); border-radius: 999px; background: var(--hj-surface-2); font-family: var(--hj-mono); font-size: 11px; color: var(--hj-ink-600); }
.hj-code-editor-label { gap: 0 !important; border: 1px solid #252b35; border-radius: 12px; overflow: hidden; background: #101318; }
.hj-code-editor-label > span:first-child { padding: 9px 12px; color: #cbd5e1; background: #171b22; border-bottom: 1px solid #252b35; }
.hj-code-editor { min-height: 480px !important; margin: 0 !important; border: 0 !important; border-radius: 0 !important; resize: vertical; background: #101318 !important; color: #dbeafe !important; caret-color: #c8ff00; font: 13px/1.65 var(--hj-mono) !important; tab-size: 4; white-space: pre; overflow: auto; }
.hj-code-editor:focus { box-shadow: inset 0 0 0 1px #c8ff00 !important; }
.hj-code-meta { display: block; padding: 7px 12px; background: #171b22; color: #94a3b8; font: 11px var(--hj-mono); border-top: 1px solid #252b35; }

.hj-dns-type { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; padding: 5px 8px; border-radius: 8px; background: #eef2f6; color: #344054; font: 700 11px var(--hj-mono); }
.hj-dns-type-a, .hj-dns-type-aaaa { background: #e8f7ef; color: #087443; }
.hj-dns-type-cname { background: #eef2ff; color: #4338ca; }
.hj-dns-type-mx { background: #fff4e5; color: #9a5b00; }
.hj-dns-type-txt, .hj-dns-type-spf { background: #f4edff; color: #6d28d9; }
.hj-zone-editor-table { table-layout: auto; min-width: 980px; }
.hj-zone-editor-table .hj-zone-value { min-width: 280px; max-width: 560px; font-family: var(--hj-mono); font-size: 11px; cursor: copy; }
.hj-record-actions[open] { min-width: 290px; }
.hj-record-actions .hj-mini-form { margin-top: 10px; }

.hj-mailbox-grid, .hj-app-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.hj-mailbox-card, .hj-app-card { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 16px; border: 1px solid var(--hj-line); border-radius: 14px; background: #fff; }
.hj-mailbox-avatar, .hj-app-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: #101318; color: #c8ff00; font-weight: 800; }
.hj-mailbox-main, .hj-app-card > div:nth-child(2) { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.hj-mailbox-main strong, .hj-app-card strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-mailbox-main span, .hj-app-card span { color: var(--hj-ink-500); font-size: 12px; }
.hj-mailbox-manage { grid-column: 1 / -1; border-top: 1px solid var(--hj-line); padding-top: 10px; }
.hj-mailbox-manage summary { cursor: pointer; font-weight: 700; }
.hj-mailbox-manage .hj-tool-action-form { margin-top: 10px; }
.hj-compact-button { min-height: 36px; padding: 8px 12px !important; white-space: nowrap; }
.hj-inline-action-form { margin-top: 10px; }
.hj-install-target { padding: 14px; border: 1px solid var(--hj-line); border-radius: 12px; background: var(--hj-surface-2); display: flex; flex-direction: column; gap: 5px; }
.hj-install-target span { color: var(--hj-ink-500); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.hj-install-target strong { overflow-wrap: anywhere; }

@media (max-width: 1100px) {
  .hj-file-editor-panel, .hj-sticky-action-panel { position: static; }
}
@media (max-width: 760px) {
  .hj-mailbox-grid, .hj-app-grid { grid-template-columns: 1fr; }
  .hj-mailbox-card, .hj-app-card { grid-template-columns: auto minmax(0,1fr); }
  .hj-mailbox-card > .hj-primary-button { grid-column: 1 / -1; }
  .hj-code-editor { min-height: 360px !important; }
}
.hj-restore-points { grid-column: 1 / -1; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--hj-line); }
.hj-restore-points > strong { display: block; margin-bottom: 8px; }
.hj-restore-point { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid var(--hj-line); }
.hj-restore-point span { max-width: 70%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: 11px var(--hj-mono); }

/* HALO v0.5.8: production File Manager, Zone Editor and WP Toolkit surfaces. */
.hj-zone-editor-table { min-width: 820px; table-layout: auto; }
.hj-zone-editor-table td.hj-zone-value {
  display: table-cell;
  min-width: 260px;
  max-width: none;
  padding: 10px 12px;
  background: transparent;
  border: 0;
  border-radius: 0;
  cursor: copy;
  vertical-align: top;
}
.hj-zone-editor-table td.hj-zone-value code {
  display: block;
  width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  padding: 7px 9px;
  border: 1px solid var(--hj-line);
  border-radius: 8px;
  background: var(--hj-surface-2);
  color: var(--hj-ink-800);
  font: 11px/1.55 var(--hj-mono);
}
.hj-zone-name { min-width: 160px; overflow-wrap: anywhere; }
.hj-record-actions { display: block; min-width: 92px; }
.hj-record-actions > summary { cursor: pointer; font-weight: 700; }
.hj-record-actions[open] { min-width: 320px; }
.hj-record-actions .hj-mini-form { display: grid; margin: 12px 0 0; }
.hj-danger-button { width: 100%; min-height: 40px; border: 1px solid #fecaca; border-radius: 10px; background: #fff1f2; color: #b91c1c; font-weight: 700; cursor: pointer; }
.hj-domain-selector { display: flex; gap: 8px; flex-wrap: wrap; margin: 14px 0; }
.hj-domain-chip { display: flex; flex-direction: column; gap: 2px; min-width: 150px; padding: 10px 12px; border: 1px solid var(--hj-line); border-radius: 12px; background: #fff; color: var(--hj-ink-800); text-decoration: none; }
.hj-domain-chip span { font-size: 11px; color: var(--hj-ink-500); }
.hj-domain-chip.is-active { border-color: var(--hj-ink-900); box-shadow: inset 0 0 0 1px var(--hj-ink-900); }
.hj-domain-summary { margin-bottom: 14px; }
.hj-dns-form .hj-dns-advanced-fields label { min-width: 0; }
.hj-dns-form:not(.is-srv) .hj-dns-advanced-fields label:nth-child(2),
.hj-dns-form:not(.is-srv) .hj-dns-advanced-fields label:nth-child(3) { display: none; }
.hj-dns-form:not(.is-priority) .hj-dns-advanced-fields label:first-child { display: none; }
.hj-setup-callout { display: grid; gap: 7px; margin: 14px 0; padding: 14px; border: 1px solid #fed7aa; border-radius: 14px; background: #fffaf0; color: #7c2d12; }
.hj-setup-callout p { margin: 0; }
.hj-setup-callout code { width: fit-content; padding: 5px 8px; border-radius: 7px; background: #1b1f25; color: #c8ff00; }
.hj-setup-callout span { font-size: 12px; color: #9a3412; }
.hj-wpt-grid { grid-template-columns: 1fr; }
.hj-wpt-card { grid-template-columns: auto minmax(0,1fr); }
.hj-wpt-card-main { min-width: 0; }
.hj-wpt-meta { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 6px; }
.hj-wpt-meta span { padding: 4px 7px; border-radius: 999px; background: var(--hj-surface-2); border: 1px solid var(--hj-line); font-size: 10px; }
.hj-wpt-card .hj-row-actions, .hj-wpt-actions { grid-column: 1 / -1; }
.hj-wpt-actions { display: flex; flex-wrap: wrap; gap: 7px; padding-top: 10px; border-top: 1px solid var(--hj-line); }
.hj-wpt-actions button { min-height: 34px; padding: 7px 10px; border: 1px solid var(--hj-line-strong); border-radius: 9px; background: #fff; color: var(--hj-ink-800); font-weight: 650; cursor: pointer; }
.hj-wpt-actions button:hover { border-color: var(--hj-ink-900); }
.hj-checkbox-row { display: flex !important; flex-direction: row !important; align-items: center; gap: 8px; }
.hj-checkbox-row input { width: auto !important; }
.hj-wpt-install-form button[disabled] { opacity: .45; cursor: not-allowed; }
.hj-file-browser { overflow: hidden; }
.hj-file-table { width: 100%; }
.hj-file-editor-panel { min-width: 0; }
.hj-code-editor { width: 100%; min-height: 560px !important; }
@media (max-width: 760px) {
  .hj-domain-chip { flex: 1 1 100%; }
  .hj-zone-editor-table { min-width: 720px; }
  .hj-record-actions[open] { min-width: 270px; }
}

/* ========================================================================== */
/* HALO 0.7.0 — PHP Selector + Advanced application platform                  */
/* ========================================================================== */

.hj-eyebrow {
    display: inline-flex;
    margin: 0 0 8px;
    color: #667085;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.hj-head-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.hj-php-workspace,
.hj-advanced-workspace {
    display: grid;
    gap: 18px;
}

.hj-php-hero,
.hj-advanced-hero {
    overflow: hidden;
    position: relative;
}

.hj-php-hero::after,
.hj-advanced-hero::after {
    position: absolute;
    right: -70px;
    top: -100px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(30, 111, 235, .10), rgba(30, 111, 235, 0) 70%);
    content: "";
    pointer-events: none;
}

.hj-php-summary-grid,
.hj-advanced-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 18px;
}

.hj-php-summary-grid > div,
.hj-advanced-summary-grid > div {
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid #e8edf4;
    border-radius: 14px;
    background: #f8fafc;
}

.hj-php-summary-grid span,
.hj-advanced-summary-grid span {
    display: block;
    margin-bottom: 5px;
    color: #667085;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .02em;
}

.hj-php-summary-grid strong,
.hj-advanced-summary-grid strong {
    display: block;
    overflow: hidden;
    color: #101828;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hj-php-tabs {
    width: fit-content;
    max-width: 100%;
    margin: 0;
    padding: 5px;
    border: 1px solid #e7ecf2;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 22px rgba(16, 24, 40, .05);
}

.hj-php-tabs a {
    min-height: 38px;
    padding: 9px 14px;
    border-radius: 8px;
    color: #667085;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}

.hj-php-tabs a.is-active {
    background: #101828;
    color: #fff;
}

.hj-php-version-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(220px, .75fr);
    align-items: stretch;
    gap: 14px;
    margin: 18px 0 22px;
}

.hj-inline-runtime-form {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto;
    align-items: end;
    gap: 10px;
    margin: 0;
    padding: 14px;
    border: 1px solid #e6ebf2;
    border-radius: 14px;
    background: #fff;
}

.hj-inline-runtime-form label {
    margin: 0;
}

.hj-runtime-note {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    padding: 14px 16px;
    border: 1px solid #dbe7fb;
    border-radius: 14px;
    background: #f5f9ff;
}

.hj-runtime-note strong {
    color: #175cd3;
    font-size: 13px;
}

.hj-runtime-note span {
    color: #475467;
    font-size: 12px;
    line-height: 1.55;
}

.hj-extensions-head {
    align-items: flex-end;
    margin-top: 5px;
    padding-top: 18px;
    border-top: 1px solid #edf0f4;
}

.hj-extension-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    max-height: 710px;
    overflow: auto;
    padding: 4px 6px 4px 0;
    scrollbar-color: #cfd7e3 transparent;
    scrollbar-width: thin;
}

.hj-extension-item {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 9px 10px;
    border: 1px solid #e8edf3;
    border-radius: 10px;
    background: #fff;
    color: #344054;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.hj-extension-item:hover {
    border-color: #98baf3;
    box-shadow: 0 8px 20px rgba(16, 24, 40, .07);
    transform: translateY(-1px);
}

.hj-extension-item strong {
    min-width: 0;
    overflow: hidden;
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hj-extension-check {
    flex: 0 0 14px;
    width: 14px;
    height: 14px;
    border: 1.5px solid #2e90fa;
    border-radius: 3px;
    background: #eff8ff;
    box-shadow: inset 0 0 0 3px #fff;
}

.hj-php-options-panel {
    align-self: start;
    max-height: calc(100vh - 150px);
    overflow: auto;
}

.hj-php-options-form {
    gap: 0;
}

.hj-php-option-row {
    display: grid !important;
    grid-template-columns: minmax(150px, .9fr) minmax(130px, 1.1fr);
    align-items: center;
    gap: 12px;
    margin: 0 !important;
    padding: 10px 0;
    border-bottom: 1px solid #eef1f5;
}

.hj-php-option-row > span {
    overflow-wrap: anywhere;
    color: #344054;
    font-family: "JetBrains Mono", monospace;
    font-size: 11px;
    font-weight: 600;
}

.hj-php-option-row input,
.hj-php-option-row select {
    min-width: 0;
    width: 100%;
    margin: 0;
}

.hj-php-options-form > .hj-primary-button {
    width: 100%;
    margin-top: 16px;
}

.hj-domain-runtime-list {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.hj-domain-runtime-card {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(240px, auto);
    align-items: center;
    gap: 18px;
    padding: 15px 16px;
    border: 1px solid #e7ecf2;
    border-radius: 14px;
    background: #fff;
}

.hj-domain-runtime-card > div span,
.hj-domain-runtime-card > div small {
    display: block;
    color: #667085;
    font-size: 11px;
}

.hj-domain-runtime-card > div strong {
    display: block;
    margin: 4px 0;
    color: #101828;
    font-size: 14px;
}

.hj-inline-domain-version-form {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.hj-inline-domain-version-form select,
.hj-inline-domain-version-form input {
    min-width: 150px;
}

.hj-app-launcher-panel {
    overflow: hidden;
}

.hj-app-launcher-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.hj-app-launcher-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    grid-template-rows: 1fr auto;
    gap: 12px;
    min-width: 0;
    padding: 16px;
    border: 1px solid #e5eaf1;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(16, 24, 40, .035);
}

.hj-app-launcher-card:hover {
    border-color: #b8cae8;
    box-shadow: 0 12px 30px rgba(16, 24, 40, .07);
}

.hj-app-launcher-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #f1f6ff;
    color: #175cd3;
}

.hj-app-launcher-icon svg {
    width: 21px;
    height: 21px;
}

.hj-app-launcher-copy {
    min-width: 0;
}

.hj-app-launcher-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.hj-app-launcher-title strong {
    color: #101828;
    font-size: 14px;
}

.hj-app-launcher-copy p {
    min-height: 38px;
    margin: 7px 0 8px;
    color: #475467;
    font-size: 12px;
    line-height: 1.55;
}

.hj-app-launcher-copy small {
    display: block;
    color: #98a2b3;
    font-size: 10px;
    line-height: 1.45;
}

.hj-app-launcher-card > .hj-secondary-button {
    grid-column: 1 / -1;
    justify-content: center;
    width: 100%;
}

.hj-capability {
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .02em;
    white-space: nowrap;
}

.hj-capability-ready {
    background: #ecfdf3;
    color: #027a48;
}

.hj-capability-unknown {
    background: #fffaeb;
    color: #b54708;
}

.hj-capability-unavailable {
    background: #f2f4f7;
    color: #667085;
}

.hj-app-launcher-card.is-unavailable {
    background: #fbfcfd;
}

.hj-advanced-native-grid {
    align-items: start;
}

@media (max-width: 1280px) {
    .hj-extension-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .hj-app-launcher-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .hj-php-summary-grid,
    .hj-advanced-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .hj-php-version-toolbar {
        grid-template-columns: 1fr;
    }
    .hj-extension-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-height: none;
    }
    .hj-php-options-panel {
        max-height: none;
    }
    .hj-domain-runtime-card {
        grid-template-columns: 1fr;
    }
    .hj-inline-domain-version-form {
        justify-content: flex-start;
    }
}

@media (max-width: 680px) {
    .hj-head-actions {
        justify-content: stretch;
        width: 100%;
    }
    .hj-head-actions a {
        justify-content: center;
        flex: 1 1 100%;
    }
    .hj-php-summary-grid,
    .hj-advanced-summary-grid,
    .hj-app-launcher-grid,
    .hj-extension-grid {
        grid-template-columns: 1fr;
    }
    .hj-inline-runtime-form {
        grid-template-columns: 1fr;
    }
    .hj-php-option-row {
        grid-template-columns: 1fr;
        gap: 6px;
    }
    .hj-inline-domain-version-form {
        align-items: stretch;
        flex-direction: column;
    }
    .hj-inline-domain-version-form select,
    .hj-inline-domain-version-form input {
        width: 100%;
    }
}

.hj-domain-php-picker {
    display: grid;
    gap: 14px;
    margin: 0 0 18px;
    padding: 16px;
    border: 1px solid var(--hj-border, #e5e7eb);
    border-radius: 16px;
    background: #fff;
}

.hj-domain-php-picker label {
    display: grid;
    gap: 7px;
    margin: 0;
    font-weight: 600;
}

.hj-domain-php-picker select {
    width: min(100%, 520px);
}

/* HALO 0.8.0 native infrastructure abstraction */
.hj-native-only-workspace .hj-app-launcher-card,
.hj-native-only-workspace .hj-native-tool-card {
    color: inherit;
    text-decoration: none;
}

.hj-native-tool-card {
    position: relative;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.hj-native-tool-card:hover {
    transform: translateY(-2px);
}

.hj-native-tool-card.is-selected {
    border-color: #84adff;
    box-shadow: 0 0 0 3px rgba(21, 112, 239, .09), 0 16px 36px rgba(16, 24, 40, .08);
}

.hj-native-tool-card.is-selected::before {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #1570ef;
    content: "";
}

.hj-native-filter-panel {
    margin-bottom: 16px;
}

.hj-native-filter-panel .hj-inline-runtime-form {
    grid-template-columns: repeat(2, minmax(180px, 1fr)) auto;
    align-items: end;
}

.hj-extension-native-form {
    display: grid;
    gap: 16px;
}

.hj-extension-item {
    cursor: pointer;
}

.hj-extension-item input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.hj-extension-item small {
    margin-left: auto;
    color: #667085;
    font-size: 10px;
}

.hj-extension-item input:checked + .hj-extension-check {
    border-color: #1570ef;
    background: #1570ef;
    box-shadow: inset 0 0 0 3px #fff;
}

.hj-extension-item.is-unknown {
    opacity: .62;
    cursor: not-allowed;
}

.hj-native-adapter-note,
.hj-native-action-output {
    margin-top: 16px;
    padding: 14px 16px;
    border: 1px solid #dbe7f8;
    border-radius: 14px;
    background: #f7faff;
}

.hj-native-adapter-note strong,
.hj-native-action-output h3 {
    display: block;
    margin: 0 0 5px;
    color: #101828;
}

.hj-native-adapter-note p {
    margin: 0;
    color: #475467;
    font-size: 12px;
    line-height: 1.6;
}

.hj-native-checkbox {
    display: flex !important;
    grid-template-columns: none !important;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    border: 1px solid #e4e7ec;
    border-radius: 11px;
    background: #fff;
}

.hj-native-checkbox input {
    width: 17px;
    height: 17px;
    margin: 0;
}

.hj-code-input {
    min-height: 130px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: 12px;
    line-height: 1.55;
    tab-size: 4;
}

.hj-tool-action-form.is-danger-form {
    padding: 14px;
    border: 1px solid #fee4e2;
    border-radius: 14px;
    background: #fffafa;
}

.hj-tool-action-form + .hj-tool-action-form {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #eaecf0;
}

@media (max-width: 760px) {
    .hj-native-filter-panel .hj-inline-runtime-form {
        grid-template-columns: 1fr;
    }
}


/* HALO 0.9 database and Redis workspaces */
.hj-database-workspace,.hj-redis-service-card{display:grid;gap:18px}.hj-database-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:18px}.hj-database-summary-grid>div,.hj-redis-status-grid>div{padding:16px;border:1px solid var(--hj-border,#e6e8ec);border-radius:14px;background:#fff}.hj-database-summary-grid span,.hj-redis-status-grid span{display:block;font-size:12px;color:var(--hj-muted,#667085);margin-bottom:6px}.hj-database-summary-grid strong,.hj-redis-status-grid strong{font-size:15px;color:var(--hj-text,#101828);overflow-wrap:anywhere}.hj-database-data-grid{align-items:start}.hj-action-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.hj-action-form-grid .hj-tool-action-form{margin:0;padding:18px;border:1px solid var(--hj-border,#e6e8ec);border-radius:16px;background:#fff}.hj-action-form-grid .hj-tool-action-form h3{margin-top:0}.hj-redis-service-card{padding:6px 0}.hj-redis-service-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.hj-redis-service-head h3{margin:4px 0 0}.hj-redis-status{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;font-size:12px;font-weight:700;background:#f2f4f7;color:#475467}.hj-redis-status span{width:8px;height:8px;border-radius:50%;background:#98a2b3}.hj-redis-status.is-running{background:#ecfdf3;color:#067647}.hj-redis-status.is-running span{background:#12b76a}.hj-redis-status.is-stopped{background:#fff4ed;color:#b93815}.hj-redis-status.is-stopped span{background:#f04438}.hj-redis-status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media(max-width:1100px){.hj-action-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hj-database-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.hj-action-form-grid,.hj-database-summary-grid,.hj-redis-status-grid{grid-template-columns:1fr}.hj-redis-service-head{align-items:flex-start;flex-direction:column}}

/* v0.9.2 account-level WHM load visibility */
.hj-status-inline.is-unavailable { color: var(--hj-ink-500); }
.hj-status-inline.is-unavailable .hj-status-dot { background: #f79009; box-shadow: 0 0 0 4px rgba(247,144,9,.12); }
.hj-account-server-load {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 14px;
  border: 1px solid var(--hj-line);
  border-radius: 12px;
  background: var(--hj-surface-soft, #f8fafc);
}
.hj-account-server-load > div { min-width: 0; }
.hj-account-server-load > div > span { display: block; color: var(--hj-ink-700); font-size: 12px; font-weight: 750; }
.hj-account-server-load > div > small { display: block; margin-top: 3px; color: var(--hj-ink-400); font-size: 10px; line-height: 1.4; }
.hj-server-load-badge {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 8px;
  min-height: 32px;
  padding: 7px 10px;
  border: 1px solid rgba(18,183,106,.22);
  border-radius: 999px;
  background: #ecfdf3;
  color: #067647;
  font-family: var(--hj-mono);
  font-size: 11px;
  white-space: nowrap;
}
.hj-server-load-badge.is-unavailable { border-color: var(--hj-line); background: #f2f4f7; color: #667085; }
.hj-server-load-badge.is-compact { min-height: 26px; padding: 4px 8px; font-size: 10px; }
.hj-server-load-dot { width: 7px; height: 7px; border-radius: 50%; background: #12b76a; box-shadow: 0 0 0 3px rgba(18,183,106,.12); }
.hj-server-load-badge.is-unavailable .hj-server-load-dot { background: #98a2b3; box-shadow: none; }
@media (max-width: 700px) {
  .hj-account-server-load { align-items: flex-start; flex-direction: column; }
}


/* 0.9.3 verified runtime provisioning */
.hj-php-advanced-grid{margin-top:20px}.hj-php-raw-editor textarea{min-height:360px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:13px;line-height:1.65}.hj-redis-locked-state{padding:24px;border:1px dashed #cbd5e1;border-radius:18px;background:#f8fafc}.hj-redis-locked-state p{margin:0 0 18px;color:#475569}.hj-redis-service-card.is-verified-running{border-color:rgba(22,163,74,.25)}.hj-secret-value{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;word-break:break-all}.hj-tool-action-form+.hj-tool-action-form{margin-top:18px;padding-top:18px;border-top:1px solid #e5e7eb}


/* 0.9.7 native Redis and PHP Selector reconstruction */
.hj-private-engine-note{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:20px;background:linear-gradient(135deg,#f8fafc 0%,#fff 100%)}
.hj-private-engine-note h3{margin:5px 0 7px;font-size:18px;color:#101828}.hj-private-engine-note p{margin:0;max-width:820px;color:#667085;line-height:1.6}
.hj-private-engine-strip{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border:1px solid #e4e7ec;border-radius:16px;background:#fcfcfd}
.hj-private-engine-strip strong{display:block;color:#101828;font-size:13px}.hj-private-engine-strip p{margin:4px 0 0;color:#667085;font-size:12px;line-height:1.55}
.hj-private-engine-icon{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:#101828;color:#fff;font-weight:800;font-size:13px}
@media(max-width:700px){.hj-private-engine-note{align-items:flex-start;flex-direction:column}.hj-private-engine-strip{padding:14px}}


/* HALO PHP Selector + Redis Manager v0.9.7 */
.hj-redis-page{display:grid;gap:20px}.hj-redis-banner{display:flex;align-items:center;gap:16px;padding:24px 28px;border-radius:14px;background:linear-gradient(115deg,#ef342d 0%,#c7164c 100%);color:#fff;box-shadow:0 12px 32px rgba(199,22,76,.18)}.hj-redis-banner-icon{width:42px;height:42px;display:grid;place-items:center}.hj-redis-banner-icon svg{width:34px;height:34px}.hj-redis-banner h2{margin:0;font-size:26px;line-height:1.1}.hj-redis-banner p{margin:5px 0 0;color:rgba(255,255,255,.86)}.hj-redis-live-chip{margin-left:auto;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.15);font-size:12px;font-weight:700}.hj-redis-live-chip.is-running{background:#e9fff0;color:#116b36}.hj-redis-cpanel-grid{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(300px,.9fr);gap:24px}.hj-cpanel-panel-title{display:flex;align-items:center;gap:8px;margin:-22px -22px 16px;padding:13px 16px;border-bottom:1px solid #dfe3ea;background:#f6f7f9;border-radius:14px 14px 0 0}.hj-cpanel-panel-title h3{margin:0;font-size:16px}.hj-cpanel-panel-title.is-blue{background:#e9f7ff;border-color:#80cdf7;color:#1d5d86}.hj-redis-detail-list{margin:0}.hj-redis-detail-list>div{display:grid;grid-template-columns:150px 1fr;align-items:center;min-height:42px;border-bottom:1px solid #e8ebf0}.hj-redis-detail-list>div:last-child{border-bottom:0}.hj-redis-detail-list dt{font-weight:650}.hj-redis-detail-list dd{margin:0;color:#667085}.hj-redis-status-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:999px;font-weight:700}.hj-redis-status-pill>span{width:8px;height:8px;border-radius:50%;background:currentColor}.hj-redis-status-pill.is-running{background:#dcfce7;color:#166534}.hj-redis-status-pill.is-stopped{background:#ffe4e6;color:#9f1239}.hj-redis-action-stack{display:grid;gap:11px}.hj-redis-action-form{margin:0}.hj-redis-button{width:100%;min-height:42px;border:0;border-radius:8px;font-weight:750;cursor:pointer}.hj-redis-button.is-primary{background:#55bd5c;color:#fff}.hj-redis-button.is-secondary{background:#1677ff;color:#fff}.hj-redis-button.is-danger{background:#dc3545;color:#fff}.hj-redis-button.is-warning{background:#f5ad42;color:#fff}.hj-redis-retry{justify-content:center;width:100%}.hj-redis-about-copy p{margin:8px 0}.hj-redis-password{display:inline-block;min-width:130px;filter:blur(6px);user-select:none;transition:.18s}.hj-redis-password.is-visible{filter:none;user-select:text}.hj-secret-toggle{margin-left:8px;border:0;background:transparent;color:#1677ff;font-weight:700;cursor:pointer}.hj-inline-reset-form{display:flex;justify-content:flex-end;margin:-54px 0 18px;position:relative;z-index:2}.hj-php-workspace .hj-extension-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:0 28px}.hj-extension-item{min-height:38px;border-bottom:0!important;padding:7px 0!important}.hj-extension-item strong{text-transform:none}.hj-php-tabs{border-bottom:1px solid #e5e7eb;padding-left:8px}.hj-php-tabs a{border-radius:0;border-bottom:3px solid transparent}.hj-php-tabs a.is-active{border-bottom-color:#1784ff}.hj-php-hero{background:#fff}.hj-php-page>.hj-panel:first-child{background:#f8fafc}.hj-php-options-panel{align-self:start}.hj-extension-native-form{background:#fff;border:1px solid #e4e7ec;border-radius:12px;padding:18px}.hj-private-engine-note{display:none}
@media(max-width:1050px){.hj-redis-cpanel-grid{grid-template-columns:1fr}.hj-php-workspace .hj-extension-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hj-inline-reset-form{margin:0 0 18px;justify-content:flex-start}}
@media(max-width:720px){.hj-redis-banner{align-items:flex-start;flex-wrap:wrap}.hj-redis-live-chip{margin-left:0}.hj-redis-detail-list>div{grid-template-columns:1fr;gap:4px;padding:9px 0}.hj-php-workspace .hj-extension-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.hj-php-domain-overview{background:#f8fafc}.hj-php-domain-stats{display:flex;gap:42px;padding:18px 22px;margin:0 0 18px;background:#fff;border:1px solid #edf0f4;border-radius:10px}.hj-php-domain-stats div{display:grid;gap:5px}.hj-php-domain-stats span{font-size:12px;color:#667085}.hj-php-domain-stats strong{font-size:28px}.hj-php-domain-stats div:first-child strong{color:#12b76a}.hj-muted-toggle{display:inline-flex;align-items:center;gap:8px;color:#98a2b3}.hj-muted-toggle span{width:34px;height:18px;border-radius:999px;background:#eaecf0;position:relative}.hj-muted-toggle span:after{content:"";position:absolute;width:14px;height:14px;left:2px;top:2px;border-radius:50%;background:#fff}.hj-extension-letter{grid-column:1/-1;padding:12px 0 2px}.hj-extension-letter span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#1784ff;color:#fff;font-size:11px;font-weight:800}.hj-php-domain-table td:last-child{text-align:right}.hj-php-domain-table .hj-secondary-button{min-height:34px;padding:7px 12px}

/* v0.9.8 manual Redis request progress */
.hj-redis-progress-card { display:flex; align-items:center; gap:18px; border-color:#b2ddff; background:linear-gradient(135deg,#eff8ff,#ffffff); }
.hj-redis-progress-card h3 { margin:3px 0 7px; }
.hj-redis-progress-card p { margin:0 0 6px; color:#475467; }
.hj-redis-progress-card small { color:#175cd3; }
.hj-redis-progress-spinner { width:34px; height:34px; border:3px solid #d1e9ff; border-top-color:#1570ef; border-radius:50%; animation:hjRedisSpin .8s linear infinite; flex:0 0 auto; }
@keyframes hjRedisSpin { to { transform:rotate(360deg); } }
.hj-redis-button:disabled { opacity:.55; cursor:not-allowed; transform:none !important; }

/* v0.10.0: cPanel PHP UAPI module options */
.hj-selector-options-panel{margin-top:20px}
.hj-selector-options-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 20px}
.hj-selector-option{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--hj-border,#e5e7eb);border-radius:14px;background:#fff;min-width:0}
.hj-selector-option>span{font-weight:650;color:var(--hj-ink,#111827);overflow-wrap:anywhere}
.hj-selector-option small{color:var(--hj-muted,#667085);line-height:1.45}
.hj-selector-option input,.hj-selector-option select{width:100%;min-height:42px}
@media(max-width:1100px){.hj-selector-options-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.hj-selector-options-grid{grid-template-columns:1fr}}

.hj-extension-item.is-locked{opacity:.78;cursor:not-allowed;background:var(--hj-surface-subtle,#f7f8fa)}
.hj-extension-item.is-locked input[type="checkbox"]{cursor:not-allowed}

/* v0.10.0 PHP API readiness */
.hj-readiness-list{display:grid;gap:0;border:1px solid var(--hj-line);border-radius:var(--hj-radius);overflow:hidden;background:var(--hj-surface)}
.hj-readiness-row{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;padding:10px 12px;border-bottom:1px solid var(--hj-line)}
.hj-readiness-row:last-child{border-bottom:0}.hj-readiness-row>span{font-weight:600;color:var(--hj-ink-700)}
.hj-muted-copy{margin:16px 0 0;color:var(--hj-muted);font-size:12px;line-height:1.6}
@media(max-width:680px){.hj-readiness-row{align-items:flex-start;flex-direction:column}.hj-readiness-row .hj-capability{align-self:flex-start}}

/* v0.10.7 agentless PHP runtime inventory */
.hj-php-runtime-panel{margin-top:20px}.hj-php-runtime-search{display:grid;gap:7px;max-width:520px;margin:20px 0 14px;font-weight:650;color:var(--hj-ink-700)}
.hj-php-runtime-search input{min-height:44px;padding:10px 13px;border:1px solid var(--hj-line);border-radius:12px;background:#fff}
.hj-php-runtime-table-wrap{max-height:620px;overflow:auto;border:1px solid var(--hj-line);border-radius:14px}.hj-php-runtime-table{margin:0;min-width:760px}
.hj-php-runtime-table thead{position:sticky;top:0;z-index:2;background:#f8fafc}.hj-php-runtime-table code{font-family:var(--hj-mono);font-size:11px;white-space:pre-wrap;overflow-wrap:anywhere}
.hj-php-runtime-table tr.is-runtime-overridden{background:#fffbea}.hj-php-runtime-table tr[hidden]{display:none}.hj-php-runtime-summary strong{overflow-wrap:anywhere}

/* v0.10.7 secure File Manager media preview */
.hj-media-preview{display:grid;gap:14px;margin:18px 0;padding:14px;border:1px solid var(--hj-line);border-radius:16px;background:#0b1220;overflow:hidden}
.hj-media-preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#fff}.hj-media-preview-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hj-media-preview-head span{color:#94a3b8;font-size:11px;white-space:nowrap}
.hj-media-preview img,.hj-media-preview video{display:block;width:100%;max-height:520px;object-fit:contain;border-radius:10px;background:#020617}.hj-media-preview audio{width:100%}

/* CloudLinux PHP Selector bridge */
.hj-cloudlinux-selector-panel{display:grid;gap:22px;border-color:#dbe5ef;box-shadow:0 18px 42px rgba(15,23,42,.07)}
.hj-selector-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.hj-selector-head-actions form,.hj-selector-reset-options{margin:0}
.hj-selector-install-card{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px;border:1px dashed #f0b44d;border-radius:12px;background:#fffaf0}
.hj-selector-install-card p{margin:6px 0 0;color:#667085;max-width:760px}
.hj-selector-install-card code{font-size:12px}
.hj-selector-summary-grid{margin-top:0}
.hj-selector-control-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:18px}
.hj-selector-control-card,.hj-selector-section{border:1px solid #e4e7ec;border-radius:14px;background:#fff;padding:18px}
.hj-selector-control-card .hj-panel-head,.hj-selector-section>.hj-panel-head{margin-bottom:14px}
.hj-selector-control-card h3,.hj-selector-section h3{margin:0;font-size:17px}
.hj-selector-control-card p,.hj-selector-section .hj-panel-head p{margin:5px 0 0;color:#667085}
.hj-cloudlinux-selector-panel .hj-extension-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px 18px}
.hj-cloudlinux-selector-panel .hj-extension-item{display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:9px;min-height:42px;padding:8px 10px!important;border:1px solid #edf0f4!important;border-radius:9px;background:#fbfcfe}
.hj-cloudlinux-selector-panel .hj-extension-item input{position:static;width:16px;height:16px;margin:0;opacity:1;pointer-events:auto;appearance:auto;cursor:pointer}
.hj-cloudlinux-selector-panel .hj-extension-item small{grid-column:2;color:#98a2b3;font-size:11px}
.hj-cloudlinux-selector-panel .hj-extension-item.is-locked{background:#f4f6f8;cursor:not-allowed;opacity:.78}
.hj-selector-form-actions{display:flex;justify-content:flex-end;margin-top:18px}
.hj-selector-options-form .hj-selector-option{display:flex;flex-direction:column;gap:7px;padding:13px;border:1px solid #e6eaf0;border-radius:10px;background:#fbfcfe}
.hj-selector-options-form .hj-selector-option>span{font-size:12px;font-weight:750;text-transform:uppercase;letter-spacing:.03em;color:#344054}
.hj-selector-options-form .hj-selector-option small{color:#667085;line-height:1.4}
.hj-selector-reset-options{display:flex;justify-content:flex-end;margin-top:14px}
@media(max-width:1100px){.hj-cloudlinux-selector-panel .hj-extension-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:820px){.hj-selector-control-grid{grid-template-columns:1fr}.hj-cloudlinux-selector-panel .hj-extension-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hj-selector-install-card{align-items:flex-start;flex-direction:column}.hj-selector-head-actions{justify-content:flex-start}}
@media(max-width:560px){.hj-cloudlinux-selector-panel .hj-extension-grid{grid-template-columns:1fr}.hj-selector-form-actions,.hj-selector-reset-options{justify-content:stretch}.hj-selector-form-actions button,.hj-selector-reset-options button{width:100%}}

/* v0.11.0 HALO PHP System Agent */
.hj-halo-agent-card{display:flex;align-items:flex-start;gap:16px;margin:18px 0;padding:17px 18px;border:1px solid #d7e3f4;border-radius:16px;background:linear-gradient(135deg,#f7faff 0%,#ffffff 62%);box-shadow:0 10px 26px rgba(15,23,42,.045)}
.hj-halo-agent-card.is-delegated{border-color:#b7e4cd;background:linear-gradient(135deg,#f0fdf7 0%,#ffffff 64%)}
.hj-halo-agent-mark{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border-radius:13px;background:#101828;box-shadow:0 8px 18px rgba(16,24,40,.16)}
.hj-halo-agent-mark span{position:relative;width:12px;height:12px;border-radius:50%;background:#53d698;box-shadow:0 0 0 5px rgba(83,214,152,.15)}
.hj-halo-agent-mark span:after{content:"";position:absolute;inset:-7px;border:1px solid rgba(83,214,152,.55);border-radius:50%;animation:hjHaloAgentPulse 1.8s ease-out infinite}
.hj-halo-agent-copy{min-width:0;flex:1}.hj-halo-agent-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.hj-halo-agent-title-row>strong{font-size:14px;color:#101828}.hj-halo-agent-copy p{margin:6px 0 11px;color:#475467;font-size:12px;line-height:1.55}.hj-halo-agent-meta{display:flex;flex-wrap:wrap;gap:8px 18px}.hj-halo-agent-meta span{font-size:11px;color:#667085}.hj-halo-agent-meta b{color:#344054;font-weight:700}.hj-halo-agent-meta b:last-child{white-space:nowrap}
@keyframes hjHaloAgentPulse{0%{transform:scale(.75);opacity:.8}75%,100%{transform:scale(1.35);opacity:0}}
@media(max-width:680px){.hj-halo-agent-card{align-items:flex-start;padding:15px}.hj-halo-agent-title-row{align-items:flex-start;flex-direction:column}.hj-halo-agent-meta{display:grid;grid-template-columns:1fr}.hj-halo-agent-mark{width:38px;height:38px;flex-basis:38px}}

/* v0.11.1: visible, clickable CloudLinux extension controls + Redis agent */
.hj-cloudlinux-selector-panel .hj-extension-item:has(input:checked){border-color:#b7d4ff!important;background:#f2f7ff}
.hj-cloudlinux-selector-panel .hj-extension-item:focus-within{outline:2px solid rgba(21,112,239,.22);outline-offset:2px}
.hj-cloudlinux-selector-panel .hj-extension-item.is-locked input{pointer-events:none}
.hj-redis-agent-panel .hj-readiness-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px}
.hj-redis-agent-panel .hj-readiness-row{min-height:48px;padding:11px 0;border-bottom:1px solid #eef1f5}
@media(max-width:720px){.hj-redis-agent-panel .hj-readiness-list{grid-template-columns:1fr}}


/* Management suite additions */
.hj-notification-button{position:relative}.hj-notification-count{position:absolute;right:-5px;top:-6px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:#111827;color:#fff;font-size:10px;line-height:18px;text-align:center;border:2px solid #fff}.hj-onboarding-panel{margin-bottom:20px}.hj-progress-track{height:8px;border-radius:999px;background:#eef1f5;overflow:hidden;margin:16px 0}.hj-progress-track span{display:block;height:100%;background:linear-gradient(90deg,#111827,#4b5563);border-radius:inherit}.hj-onboarding-steps{display:flex;gap:8px;flex-wrap:wrap}.hj-onboarding-steps span{padding:7px 10px;border-radius:999px;background:#f3f4f6;color:#6b7280;font-size:12px;font-weight:600}.hj-onboarding-steps span.is-complete{background:#ecfdf3;color:#166534}.hj-message-thread{display:grid;gap:12px;margin:18px 0}.hj-message{max-width:82%;padding:14px 16px;border:1px solid #e5e7eb;border-radius:14px;background:#fff}.hj-message.is-staff{background:#f8fafc}.hj-message.is-customer{margin-left:auto;background:#111827;color:#fff;border-color:#111827}.hj-message>div{display:flex;justify-content:space-between;gap:16px;font-size:12px}.hj-message p{margin:8px 0 0;line-height:1.55}.hj-message.is-customer span{color:#d1d5db}.hj-notification-list{display:grid;gap:10px}.hj-notification-item{padding:15px;border:1px solid #e5e7eb;border-radius:14px;background:#fff}.hj-notification-item.is-unread{border-color:#9ca3af;box-shadow:inset 3px 0 0 #111827}.hj-notification-item>div:first-child{display:flex;justify-content:space-between;gap:15px}.hj-notification-item p{margin:8px 0;color:#4b5563}.hj-link-button{border:0;background:none;padding:0;color:#111827;text-decoration:underline;cursor:pointer;font:inherit}.hj-permission-summary{display:block;max-width:360px;white-space:normal;line-height:1.45}.hj-checkbox-line{display:flex!important;flex-direction:row!important;align-items:center;gap:9px}.hj-checkbox-line input{width:auto!important}.hj-reply-form{max-width:760px}.hj-ticket-thread{margin-top:20px}
@media(max-width:780px){.hj-message{max-width:95%}.hj-notification-item>div:first-child{display:grid;gap:4px}.hj-onboarding-steps{display:grid;grid-template-columns:1fr 1fr}}

/* ========================================================================== */
/* HostingJet 0.12.1 — Winter White customer interface architecture          */
/* ========================================================================== */

:root {
  --hj-bg: #f7f9f5;
  --hj-surface: #ffffff;
  --hj-surface-2: #fbfcfa;
  --hj-surface-3: #f1f6ef;
  --hj-line: #e3e9df;
  --hj-line-strong: #cfd9ca;
  --hj-ink-900: #101814;
  --hj-ink-800: #17231d;
  --hj-ink-700: #26372f;
  --hj-ink-500: #53655c;
  --hj-ink-400: #718078;
  --hj-ink-300: #98a49d;
  --hj-forest: #052e25;
  --hj-forest-2: #074638;
  --hj-emerald: #07835e;
  --hj-emerald-2: #0da876;
  --hj-lime: #c8ff67;
  --hj-lime-deep: #9cdb39;
  --hj-lime-ink: #17340c;
  --hj-lime-glow: rgba(170, 235, 70, 0.24);
  --hj-good: #087f5b;
  --hj-good-bg: #eaf8f1;
  --hj-warn: #9a6700;
  --hj-warn-bg: #fff6db;
  --hj-bad: #b42318;
  --hj-bad-bg: #fff0ef;
  --hj-info-bg: #f1f5f2;
  --hj-radius-lg: 18px;
  --hj-radius: 12px;
  --hj-radius-sm: 8px;
  --hj-shadow: 0 1px 2px rgba(5, 46, 37, 0.025), 0 14px 34px rgba(5, 46, 37, 0.055);
  --hj-shadow-pop: 0 22px 60px rgba(5, 46, 37, 0.16), 0 3px 12px rgba(5, 46, 37, 0.08);
  --hj-focus: 0 0 0 3px rgba(7, 131, 94, 0.18);
}

html.hj-cloud-os-ready,
html.hj-cloud-os-ready body,
body.hj-standalone-body {
  background: var(--hj-bg) !important;
}

body.hj-standalone-body {
  overflow-x: hidden;
}

.hj-shell {
  color: var(--hj-ink-900);
  background:
    radial-gradient(circle at 55% -10%, rgba(200,255,103,.13), transparent 27rem),
    radial-gradient(circle at 97% 9%, rgba(7,131,94,.07), transparent 23rem),
    var(--hj-bg);
  font-size: 14px;
}

.hj-shell-standalone {
  min-height: 100vh;
  align-items: stretch;
}

.hj-shell-embedded {
  min-height: 960px;
  border: 1px solid var(--hj-line);
  border-radius: 22px;
  box-shadow: 0 30px 80px rgba(5,46,37,.08);
}

/* Expanded information architecture */
.hj-sidebar {
  width: 272px;
  align-items: stretch;
  gap: 0;
  padding: 22px 16px 18px;
  background: rgba(255,255,255,.94);
  color: var(--hj-ink-900);
  border-right: 1px solid var(--hj-line);
  box-shadow: 10px 0 36px rgba(5,46,37,.035);
  backdrop-filter: blur(18px);
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}

.hj-sidebar-brand-row,
.hjwc-brand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 54px;
  padding: 0 8px 18px;
  border-bottom: 1px solid var(--hj-line);
}

.hj-sidebar-brand {
  width: auto;
  height: auto;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 11px;
  color: var(--hj-ink-900) !important;
  text-decoration: none;
}

.hj-brand-mark {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background:
    radial-gradient(circle at 72% 20%, rgba(200,255,103,.94), transparent 29%),
    linear-gradient(145deg, #0b5b47, var(--hj-forest));
  color: var(--hj-lime);
  box-shadow: 0 9px 24px rgba(5,46,37,.2), inset 0 0 0 1px rgba(255,255,255,.12);
}

.hj-brand-mark::before,
.hj-brand-mark::after {
  content: '';
  position: absolute;
  width: 7px;
  height: 48px;
  top: -6px;
  border-radius: 8px;
  background: rgba(255,255,255,.12);
  transform: rotate(28deg);
}

.hj-brand-mark::before { left: 8px; }
.hj-brand-mark::after { right: 6px; }
.hj-brand-mark span { position: relative; z-index: 2; font-size: 18px; font-weight: 800; letter-spacing: -.08em; }

.hj-brand-copy {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
}

.hj-brand-copy strong { font-size: 16px; letter-spacing: -.03em; }
.hj-brand-copy small { margin-top: 4px; color: var(--hj-ink-400); font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.hj-sidebar-close {
  display: none;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 10px;
  background: var(--hj-surface-3);
  color: var(--hj-ink-700);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

.hj-sidebar-nav {
  align-items: stretch;
  gap: 3px;
  width: auto;
  flex: 1;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 14px 4px 16px 0;
  scrollbar-width: thin;
  scrollbar-color: var(--hj-line-strong) transparent;
}

.hj-nav-section {
  display: block;
  margin: 15px 10px 6px;
  color: var(--hj-ink-300);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .115em;
  text-transform: uppercase;
}

.hj-nav-section:first-child { margin-top: 2px; }

.hj-sidebar-nav a {
  width: 100%;
  min-height: 42px;
  height: auto;
  padding: 7px 10px;
  justify-content: flex-start;
  gap: 11px;
  border-radius: 11px;
  color: var(--hj-ink-500);
  border: 1px solid transparent;
  font-size: 12.5px;
  font-weight: 650;
  letter-spacing: -.01em;
}

.hj-sidebar-nav a::after { display: none !important; }
.hj-sidebar-nav a:hover {
  color: var(--hj-forest);
  background: #f3f7f1;
  border-color: #e6ece2;
}

.hj-sidebar-nav a.is-active {
  color: #fff;
  background:
    radial-gradient(circle at 90% 0%, rgba(200,255,103,.18), transparent 56%),
    linear-gradient(135deg, var(--hj-forest-2), var(--hj-forest));
  border-color: rgba(5,46,37,.86);
  box-shadow: 0 10px 22px rgba(5,46,37,.17), inset 0 1px rgba(255,255,255,.1);
}

.hj-sidebar-nav a.is-active::before {
  left: -5px;
  top: 11px;
  bottom: 11px;
  width: 3px;
  background: var(--hj-lime);
  box-shadow: 0 0 13px rgba(200,255,103,.5);
}

.hj-nav-icon {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(5,46,37,.055);
  color: currentColor;
}

.hj-nav-icon svg { width: 16px !important; height: 16px !important; }
.hj-sidebar-nav a.is-active .hj-nav-icon { background: rgba(200,255,103,.14); color: var(--hj-lime); }
.hj-nav-label { min-width: 0; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hj-nav-cue { opacity: 0; transform: translateX(-4px); color: var(--hj-lime); font-size: 19px; line-height: 1; transition: .16s ease; }
.hj-sidebar-nav a:hover .hj-nav-cue,
.hj-sidebar-nav a.is-active .hj-nav-cue { opacity: 1; transform: translateX(0); }

.hj-sidebar-status {
  margin: 4px 0 12px;
  padding: 13px 14px;
  border: 1px solid #dce8d8;
  border-radius: 14px;
  background:
    radial-gradient(circle at 100% 0%, rgba(200,255,103,.22), transparent 55%),
    linear-gradient(145deg, #f8fcf6, #eff7ec);
}

.hj-sidebar-status span { display: flex; align-items: center; gap: 7px; color: var(--hj-ink-500); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hj-sidebar-status i { width: 7px; height: 7px; border-radius: 50%; background: var(--hj-emerald-2); box-shadow: 0 0 0 4px rgba(13,168,118,.11); }
.hj-sidebar-status strong { display: block; margin-top: 9px; font-size: 12.5px; color: var(--hj-forest); }
.hj-sidebar-status small { display: block; margin-top: 3px; color: var(--hj-ink-400); font-size: 10.5px; }

.hj-sidebar-user {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 10px;
  border: 1px solid var(--hj-line);
  border-radius: 13px;
  background: #fff;
  color: var(--hj-ink-900);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  font-weight: inherit;
}

.hj-user-avatar {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  background: linear-gradient(145deg, var(--hj-forest-2), var(--hj-forest));
  color: var(--hj-lime);
  font-size: 12px;
  font-weight: 800;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.1);
}

.hj-user-copy,
.hj-topbar-profile > span:last-child { min-width: 0; display: flex; flex-direction: column; line-height: 1.15; }
.hj-user-copy strong,
.hj-topbar-profile strong { max-width: 142px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; }
.hj-user-copy small,
.hj-topbar-profile small { margin-top: 4px; color: var(--hj-ink-400); font-size: 9.5px; font-weight: 600; }

.hj-sidebar-scrim { display: none; }

/* Main canvas and command bar */
.hj-main {
  padding: 18px clamp(18px, 2.35vw, 38px) 42px;
  max-width: 100%;
  overflow-x: hidden;
}

.hj-topbar {
  min-height: 70px;
  padding: 10px 12px;
  border-radius: 17px;
  border-color: rgba(213,223,208,.92);
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(18px);
  box-shadow: 0 8px 28px rgba(5,46,37,.045);
  position: sticky;
  top: 14px;
  z-index: 25;
  flex-wrap: nowrap;
}

.hj-topbar-left { flex: 1; min-width: 0; flex-wrap: nowrap; }
.hj-topbar-right { flex: 0 0 auto; flex-wrap: nowrap; }

.hj-mobile-nav-toggle {
  display: none;
  width: 42px;
  height: 42px;
  padding: 0 12px;
  border: 1px solid var(--hj-line);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}
.hj-mobile-nav-toggle span { display: block; height: 2px; margin: 4px 0; border-radius: 2px; background: var(--hj-forest); }

.hj-command-search {
  width: min(520px, 44vw);
  min-width: 260px;
  height: 44px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 10px 0 13px;
  border: 1px solid var(--hj-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: inset 0 1px 1px rgba(5,46,37,.02);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.hj-command-search:focus-within { border-color: rgba(7,131,94,.55); box-shadow: var(--hj-focus); }
.hj-command-search-icon { width: 18px; height: 18px; color: var(--hj-ink-400); }
.hj-command-search-icon svg { width: 18px; height: 18px; }
.hj-command-search input {
  min-width: 0;
  flex: 1;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: var(--hj-ink-900);
  font: inherit;
  font-size: 12.5px;
  padding: 0 !important;
}
.hj-command-search input::placeholder { color: var(--hj-ink-300); }
.hj-command-search kbd {
  padding: 3px 7px;
  border: 1px solid var(--hj-line);
  border-bottom-color: var(--hj-line-strong);
  border-radius: 7px;
  background: var(--hj-surface-2);
  color: var(--hj-ink-400);
  font-family: var(--hj-font);
  font-size: 9.5px;
  font-weight: 700;
}

.hj-workspace-pill {
  height: 44px;
  padding: 0 13px 0 8px;
  border: 1px solid var(--hj-line);
  border-radius: 12px;
  background: #fff;
  color: var(--hj-ink-700);
  font-size: 11.5px;
  white-space: nowrap;
}
.hj-workspace-icon { background: var(--hj-surface-3); color: var(--hj-emerald); }

.hj-status-inline {
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid #d6ecdf;
  background: #f2fbf6;
  font-size: 10.5px;
  white-space: nowrap;
}
.hj-icon-button { width: 40px; height: 40px; border-radius: 11px; }
.hj-icon-button:hover { color: var(--hj-forest); border-color: #cfdcd0; background: #f7faf5; }

.hj-topbar-profile {
  min-width: 156px;
  height: 44px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 4px 11px 4px 5px;
  border: 1px solid var(--hj-line);
  border-radius: 12px;
  background: #fff;
  color: var(--hj-ink-900) !important;
  text-decoration: none;
}
.hj-topbar-profile:hover { border-color: var(--hj-line-strong); box-shadow: 0 7px 20px rgba(5,46,37,.06); }
.hj-topbar-profile .hj-user-avatar { width: 34px; height: 34px; flex-basis: 34px; border-radius: 10px; }

/* Page context */
.hj-page-title-row {
  min-height: 104px;
  margin: 24px 2px 18px;
  padding: 0 2px;
  align-items: flex-end;
  justify-content: space-between;
}
.hj-page-heading { min-width: 0; }
.hj-page-eyebrow { margin: 0 0 7px !important; color: var(--hj-emerald); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.hj-page-title-row h1 { font-size: clamp(25px, 2.4vw, 36px); font-weight: 750; letter-spacing: -.045em; line-height: 1.06; }
.hj-page-subtitle { margin-top: 8px !important; max-width: 720px; color: var(--hj-ink-400); font-size: 12.5px; line-height: 1.55; }
.hj-page-context { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }

/* Core cards */
.hj-panel,
.hj-metric-card,
.hj-service-card,
.hj-tool-card,
.hj-native-card,
.hj-redis-card,
.hj-php-card {
  border-color: var(--hj-line);
  border-radius: 17px;
  background: rgba(255,255,255,.95);
  box-shadow: var(--hj-shadow);
}

.hj-panel { padding: 20px; }
.hj-panel:hover { border-color: #d8e1d4; }
.hj-panel-head { margin-bottom: 16px; }
.hj-panel-head h2 { font-size: 14px; letter-spacing: -.018em; }
.hj-panel-head a { border: 0; color: var(--hj-emerald); font-size: 11px; }
.hj-panel-head a::after { content: ' →'; }

.hj-metric-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.hj-metric-card {
  min-height: 126px;
  padding: 18px;
  position: relative;
  overflow: hidden;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.hj-metric-card::after {
  content: '';
  position: absolute;
  width: 120px;
  height: 120px;
  right: -58px;
  top: -62px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(200,255,103,.25), rgba(7,131,94,.035) 55%, transparent 70%);
}
.hj-metric-card:hover { transform: translateY(-2px); border-color: #ceddca; box-shadow: 0 18px 40px rgba(5,46,37,.08); }
.hj-metric-card strong { color: var(--hj-forest); letter-spacing: -.05em; }
.hj-metric-icon { color: var(--hj-emerald); background: var(--hj-surface-3); }

.hj-overview-grid { grid-template-columns: minmax(0, 1.75fr) minmax(320px, .9fr); gap: 16px; }
.hj-summary-grid { gap: 14px; }

.hj-table-wrap {
  border-color: var(--hj-line);
  border-radius: 14px;
  background: #fff;
  scrollbar-color: var(--hj-line-strong) transparent;
}
.hj-table { border-collapse: separate; border-spacing: 0; }
.hj-table thead th {
  height: 44px;
  padding: 0 13px;
  background: #f7faf6;
  border-bottom: 1px solid var(--hj-line);
  color: var(--hj-ink-400);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .075em;
  text-transform: uppercase;
}
.hj-table tbody td { padding: 13px; border-bottom-color: #edf1eb; vertical-align: middle; }
.hj-table tbody tr { transition: background-color .12s ease; }
.hj-table tbody tr:hover { background: #fbfdf9; }
.hj-table-service strong { color: var(--hj-forest); }
.hj-table-icon { background: var(--hj-surface-3); color: var(--hj-emerald); }
.hj-row-actions { gap: 5px; }
.hj-row-actions a { padding: 5px 8px; border-radius: 8px; background: #f4f7f2; color: var(--hj-ink-700); font-size: 10px; font-weight: 700; text-decoration: none; }
.hj-row-actions a:first-child { background: var(--hj-forest); color: #fff; }
.hj-row-actions a:hover { background: #e9f0e5; color: var(--hj-forest); }
.hj-row-actions a:first-child:hover { background: var(--hj-forest-2); color: var(--hj-lime); }

/* Forms and action surfaces */
.hj-shell input[type="text"],
.hj-shell input[type="email"],
.hj-shell input[type="password"],
.hj-shell input[type="number"],
.hj-shell input[type="url"],
.hj-shell input[type="search"],
.hj-shell select,
.hj-shell textarea {
  border-color: var(--hj-line-strong);
  border-radius: 11px;
  background: #fff;
  color: var(--hj-ink-900);
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.hj-shell input:focus,
.hj-shell select:focus,
.hj-shell textarea:focus { border-color: rgba(7,131,94,.65); box-shadow: var(--hj-focus); background: #fff; }
.hj-shell label > span { color: var(--hj-ink-700); }

.hj-primary-button,
.hj-shell button[type="submit"],
.hj-shell input[type="submit"] {
  background: linear-gradient(135deg, var(--hj-forest-2), var(--hj-forest));
  border-color: var(--hj-forest);
  color: #fff;
  border-radius: 11px;
  box-shadow: 0 7px 16px rgba(5,46,37,.13);
}
.hj-primary-button:hover,
.hj-shell button[type="submit"]:hover,
.hj-shell input[type="submit"]:hover { background: linear-gradient(135deg, #0a5d49, #073b30); color: var(--hj-lime); box-shadow: 0 10px 24px rgba(5,46,37,.2); }
.hj-secondary-button { border-color: var(--hj-line-strong); border-radius: 11px; background: #fff; }

.hj-pill,
.hj-chip { border-radius: 999px; font-size: 9.5px; font-weight: 800; letter-spacing: .03em; }
.hj-progress-track { background: #e7ede4; }
.hj-progress-track > span { background: linear-gradient(90deg, var(--hj-emerald), var(--hj-lime-deep)); }

/* PHP extension interaction must stay explicit and accessible. */
.hj-extension-grid label,
.hj-selector-extension,
.hj-cloudlinux-extension,
.hj-php-extension-item {
  cursor: pointer !important;
  user-select: none;
  transition: border-color .15s ease, background-color .15s ease, transform .15s ease;
}
.hj-extension-grid label:hover,
.hj-selector-extension:hover,
.hj-cloudlinux-extension:hover,
.hj-php-extension-item:hover { border-color: rgba(7,131,94,.38) !important; background: #f6fbf7 !important; transform: translateY(-1px); }
.hj-shell input[type="checkbox"] {
  appearance: auto !important;
  -webkit-appearance: checkbox !important;
  width: 17px !important;
  height: 17px !important;
  min-width: 17px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  accent-color: var(--hj-emerald);
  cursor: pointer;
}
.hj-shell input[type="checkbox"]:disabled { cursor: not-allowed; opacity: .48 !important; }

/* Mobile drawer */
@media (max-width: 1180px) {
  .hj-sidebar { width: 232px; }
  .hj-command-search { width: min(430px, 39vw); }
  .hj-overview-grid { grid-template-columns: 1fr; }
}

@media (max-width: 980px) {
  .hj-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(300px, 88vw);
    height: 100dvh;
    transform: translateX(-105%);
    transition: transform .23s cubic-bezier(.2,.75,.25,1);
    z-index: 1002;
    box-shadow: 28px 0 70px rgba(5,46,37,.22);
  }
  .hj-shell.hj-sidebar-open .hj-sidebar { transform: translateX(0); }
  .hj-sidebar-close { display: inline-grid; place-items: center; }
  .hj-sidebar-scrim {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 1001;
    border: 0;
    background: rgba(5,24,19,.42);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
    backdrop-filter: blur(2px);
  }
  .hj-shell.hj-sidebar-open .hj-sidebar-scrim { opacity: 1; pointer-events: auto; }
  .hj-mobile-nav-toggle { display: block; flex: 0 0 42px; }
  .hj-main { width: 100%; padding-inline: 16px; }
  .hj-command-search { width: 100%; min-width: 0; }
  .hj-workspace-pill { display: none; }
  .hj-topbar-profile { min-width: 44px; width: 44px; padding: 4px; }
  .hj-topbar-profile > span:last-child { display: none; }
  .hj-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  .hj-main { padding: 10px 10px 28px; }
  .hj-topbar { top: 8px; min-height: 62px; padding: 8px; border-radius: 15px; }
  .hj-command-search kbd { display: none; }
  .hj-status-inline { display: none; }
  .hj-topbar-right { gap: 6px; }
  .hj-topbar-right .hj-icon-button:not(.hj-notification-button) { display: none; }
  .hj-page-title-row { min-height: auto; margin: 22px 2px 14px; align-items: flex-start; flex-direction: column; }
  .hj-page-title-row h1 { font-size: 27px; }
  .hj-page-subtitle { font-size: 12px; }
  .hj-metric-grid { grid-template-columns: 1fr; gap: 10px; }
  .hj-metric-card { min-height: 104px; }
  .hj-panel { padding: 15px; border-radius: 15px; }
  .hj-panel-table { padding-bottom: 4px; }
  .hj-page-grid-2,
  .hj-files-layout,
  .hj-native-domains-page,
  .hj-native-tools-page { grid-template-columns: 1fr !important; }
  .hj-table-wrap { overflow-x: auto; }
  .hj-table { min-width: 720px; }
}

@media (prefers-reduced-motion: reduce) {
  .hj-sidebar,
  .hj-sidebar-scrim,
  .hj-metric-card,
  .hj-nav-cue { transition: none !important; }
}
html.hj-navigation-locked,
html.hj-navigation-locked body { overflow: hidden !important; }

.hj-sidebar-nav [hidden],
.hjwc-sidebar-nav [hidden] { display: none !important; }

.hj-extension-item {
  min-height: 46px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--hj-line) !important;
  border-radius: 11px !important;
  background: #fff !important;
  color: var(--hj-ink-700) !important;
}
.hj-extension-item:has(input:checked) {
  border-color: rgba(7,131,94,.35) !important;
  background: #f1faf5 !important;
  box-shadow: inset 0 0 0 1px rgba(7,131,94,.05);
}
.hj-extension-item strong { min-width: 0; flex: 1; font-size: 11.5px; font-family: var(--hj-mono); font-weight: 650; }
.hj-extension-item small { color: var(--hj-warn); font-size: 9px; font-weight: 800; }
.hj-extension-item.is-locked { background: #f7f8f6 !important; color: var(--hj-ink-400) !important; }
.hj-php-workspace .hj-extension-grid,
.hj-cloudlinux-selector-panel .hj-extension-grid { gap: 9px !important; }

.hj-login-screen {
  background:
    radial-gradient(circle at 50% 12%, rgba(200,255,103,.2), transparent 24rem),
    radial-gradient(circle at 85% 78%, rgba(7,131,94,.11), transparent 25rem),
    linear-gradient(145deg, #f9fbf7, #f2f7ef);
}
.hj-login-card {
  width: min(480px, calc(100vw - 32px));
  padding: 34px;
  border: 1px solid var(--hj-line);
  border-radius: 22px;
  background: rgba(255,255,255,.94);
  box-shadow: 0 32px 90px rgba(5,46,37,.13);
  text-align: left;
}
.hj-login-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 34px; }
.hj-login-kicker { color: var(--hj-emerald) !important; font-size: 10px !important; font-weight: 800 !important; letter-spacing: .12em !important; text-transform: uppercase; }
.hj-login-card h1 { margin-top: 10px !important; font-size: 34px !important; line-height: 1.08 !important; letter-spacing: -.05em !important; }
.hj-login-card > p:not(.hj-login-kicker) { margin: 14px 0 24px !important; color: var(--hj-ink-400) !important; line-height: 1.65 !important; }
.hj-login-assurance { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px; }
.hj-login-assurance span { padding: 6px 9px; border: 1px solid var(--hj-line); border-radius: 999px; background: #f7faf5; color: var(--hj-ink-500); font-size: 9.5px; font-weight: 700; }

.hj-dashboard-actions {
  min-height: 86px;
  margin-bottom: 16px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border: 1px solid #dce8d8;
  border-radius: 17px;
  background:
    radial-gradient(circle at 96% 0%, rgba(200,255,103,.22), transparent 34%),
    linear-gradient(120deg, #f9fcf7, #f0f7ed);
  box-shadow: 0 8px 26px rgba(5,46,37,.045);
}
.hj-dashboard-actions-copy { min-width: 190px; display: flex; flex-direction: column; }
.hj-dashboard-actions-copy span { color: var(--hj-emerald); font-size: 9.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.hj-dashboard-actions-copy strong { margin-top: 5px; max-width: 250px; color: var(--hj-forest); font-size: 12px; line-height: 1.4; }
.hj-dashboard-action-links { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.hj-dashboard-action-links a { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; padding: 7px 11px 7px 7px; border: 1px solid rgba(205,216,201,.9); border-radius: 11px; background: rgba(255,255,255,.86); color: var(--hj-ink-700); font-size: 10.5px; font-weight: 750; text-decoration: none; transition: .15s ease; }
.hj-dashboard-action-links a span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; background: var(--hj-surface-3); color: var(--hj-emerald); }
.hj-dashboard-action-links a svg { width: 14px; height: 14px; }
.hj-dashboard-action-links a:hover { transform: translateY(-1px); border-color: rgba(7,131,94,.36); color: var(--hj-forest); box-shadow: 0 8px 18px rgba(5,46,37,.06); }
@media(max-width:980px){.hj-dashboard-actions{align-items:flex-start;flex-direction:column}.hj-dashboard-action-links{justify-content:flex-start}}
@media(max-width:680px){.hj-dashboard-action-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.hj-dashboard-action-links a{width:100%}}

/* ========================================================================== */
/* HostingJet 0.13.1 — Reference-led enterprise customer experience           */
/* Visual anchor: premium bento dashboard, winter-white canvas, deep forest   */
/* navigation, lime signal accents, dense but calm operational information.    */
/* ========================================================================== */

.hj-experience-v13 {
  --hj-bg: #f4f7f3;
  --hj-canvas: #f8faf7;
  --hj-surface: #ffffff;
  --hj-surface-soft: #f7faf6;
  --hj-surface-green: #eef7ea;
  --hj-surface-lime: #f4ffdc;
  --hj-line: #dfe7dc;
  --hj-line-strong: #cbd8c8;
  --hj-ink-950: #0a1210;
  --hj-ink-900: #101a17;
  --hj-ink-800: #1a2924;
  --hj-ink-700: #2a3e36;
  --hj-ink-500: #5a6d64;
  --hj-ink-400: #7a8a82;
  --hj-ink-300: #a1aea7;
  --hj-forest: #062d25;
  --hj-forest-2: #0a493b;
  --hj-forest-3: #106d55;
  --hj-emerald: #0a8a62;
  --hj-emerald-2: #12a976;
  --hj-lime: #d5ff72;
  --hj-lime-2: #b7ef4e;
  --hj-lime-ink: #18320d;
  --hj-radius-xl: 28px;
  --hj-radius-lg: 20px;
  --hj-radius: 14px;
  --hj-radius-sm: 10px;
  --hj-shadow: 0 1px 2px rgba(6,45,37,.035), 0 16px 46px rgba(6,45,37,.055);
  --hj-shadow-hover: 0 20px 54px rgba(6,45,37,.11);
  --hj-shadow-dark: 0 24px 64px rgba(3,26,21,.22);
  --hj-focus: 0 0 0 4px rgba(10,138,98,.16);
  background:
    radial-gradient(circle at 78% -8%, rgba(213,255,114,.20), transparent 28rem),
    radial-gradient(circle at 99% 30%, rgba(10,138,98,.08), transparent 26rem),
    var(--hj-bg);
  color: var(--hj-ink-900);
}

.hj-experience-v13.hj-shell-standalone,
.hj-experience-v13.hj-shell-embedded {
  align-items: stretch;
}

.hj-experience-v13.hj-shell-embedded {
  overflow: clip;
  border: 1px solid var(--hj-line);
  border-radius: 28px;
  box-shadow: 0 28px 90px rgba(6,45,37,.12);
}

/* Sidebar — dark, structured, intentional. */
.hj-experience-v13 .hj-sidebar {
  width: 268px;
  height: 100vh;
  position: sticky;
  top: 0;
  flex: 0 0 268px;
  align-items: stretch;
  gap: 0;
  padding: 22px 16px 18px;
  overflow: hidden;
  color: rgba(255,255,255,.92);
  border-right: 1px solid rgba(255,255,255,.06);
  background:
    radial-gradient(circle at 18% 0%, rgba(33,133,101,.30), transparent 24rem),
    radial-gradient(circle at 100% 72%, rgba(213,255,114,.12), transparent 20rem),
    linear-gradient(180deg, #0e1e1a 0%, #071411 100%);
  box-shadow: 16px 0 50px rgba(5,31,26,.14);
  z-index: 90;
}

.hj-experience-v13 .hj-sidebar-brand-row {
  min-height: 60px;
  padding: 0 8px 19px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.hj-experience-v13 .hj-sidebar-brand {
  gap: 12px;
  color: #fff !important;
}

.hj-experience-v13 .hj-brand-mark,
.hj-experience-v13 .hj-user-avatar {
  background:
    radial-gradient(circle at 72% 16%, rgba(213,255,114,.92), transparent 28%),
    linear-gradient(145deg, #158663, #073d31);
  box-shadow: 0 12px 30px rgba(0,0,0,.24), inset 0 0 0 1px rgba(255,255,255,.13);
}

.hj-experience-v13 .hj-brand-mark {
  width: 42px;
  height: 42px;
  flex-basis: 42px;
  border-radius: 13px;
  position: relative;
  overflow: hidden;
}

.hj-experience-v13 .hj-brand-mark i {
  position: absolute;
  width: 6px;
  height: 27px;
  top: 8px;
  border-radius: 999px;
  background: #fff;
  transform: skew(-18deg);
  z-index: 2;
}
.hj-experience-v13 .hj-brand-mark i:nth-child(1) { left: 10px; }
.hj-experience-v13 .hj-brand-mark i:nth-child(2) { left: 18px; height: 20px; top: 14px; background: var(--hj-lime); }
.hj-experience-v13 .hj-brand-mark i:nth-child(3) { right: 9px; }

.hj-experience-v13 .hj-brand-copy strong { color: #fff; font-size: 16px; letter-spacing: -.035em; }
.hj-experience-v13 .hj-brand-copy small { color: rgba(255,255,255,.46); font-size: 9px; letter-spacing: .13em; }

.hj-experience-v13 .hj-sidebar-nav {
  flex: 1;
  align-items: stretch;
  gap: 4px;
  padding: 16px 2px 16px 0;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.18) transparent;
}

.hj-experience-v13 .hj-nav-section {
  margin: 17px 11px 7px;
  color: rgba(255,255,255,.34);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .14em;
}
.hj-experience-v13 .hj-nav-section:first-child { margin-top: 3px; }

.hj-experience-v13 .hj-sidebar-nav a {
  width: 100%;
  min-height: 44px;
  height: auto;
  justify-content: flex-start;
  gap: 11px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 13px;
  color: rgba(255,255,255,.66);
  font-size: 12.5px;
  font-weight: 650;
  transition: transform .16s ease, color .16s ease, background-color .16s ease, border-color .16s ease;
}
.hj-experience-v13 .hj-sidebar-nav a::after,
.hj-experience-v13 .hj-sidebar-nav a::before { display: none !important; }
.hj-experience-v13 .hj-sidebar-nav a:hover {
  transform: translateX(2px);
  color: #fff;
  background: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.07);
}
.hj-experience-v13 .hj-sidebar-nav a.is-active {
  color: var(--hj-lime-ink);
  background: linear-gradient(135deg, #e0ff88, #c4f85e);
  border-color: rgba(255,255,255,.40);
  box-shadow: 0 10px 28px rgba(183,239,78,.19), inset 0 1px rgba(255,255,255,.78);
}
.hj-experience-v13 .hj-nav-icon {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  color: currentColor;
  background: rgba(255,255,255,.07);
}
.hj-experience-v13 .hj-sidebar-nav a.is-active .hj-nav-icon { background: rgba(6,45,37,.09); }
.hj-experience-v13 .hj-nav-icon svg { width: 16px; height: 16px; }
.hj-experience-v13 .hj-nav-label { flex: 1; min-width: 0; }
.hj-experience-v13 .hj-nav-cue { opacity: .28; color: currentColor; transform: none; }
.hj-experience-v13 .hj-sidebar-nav a:hover .hj-nav-cue,
.hj-experience-v13 .hj-sidebar-nav a.is-active .hj-nav-cue { opacity: .8; }

.hj-experience-v13 .hj-sidebar-status {
  margin: 4px 0 12px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 16px;
  background:
    radial-gradient(circle at 100% 0%, rgba(213,255,114,.16), transparent 55%),
    rgba(255,255,255,.055);
}
.hj-experience-v13 .hj-sidebar-status span { color: rgba(255,255,255,.52); }
.hj-experience-v13 .hj-sidebar-status strong { color: #fff; font-size: 12px; }
.hj-experience-v13 .hj-sidebar-status small { color: rgba(255,255,255,.42); }
.hj-experience-v13 .hj-sidebar-status i { background: var(--hj-lime); box-shadow: 0 0 0 4px rgba(213,255,114,.12); }

.hj-experience-v13 .hj-sidebar-user {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 9px;
  justify-content: flex-start;
  gap: 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(255,255,255,.05);
  color: #fff;
}
.hj-experience-v13 .hj-sidebar-user .hj-user-avatar { width: 36px; height: 36px; flex-basis: 36px; border-radius: 11px; color: var(--hj-lime); }
.hj-experience-v13 .hj-sidebar-user strong { color: #fff; }
.hj-experience-v13 .hj-sidebar-user small { color: rgba(255,255,255,.42); }

/* Main canvas + topbar. */
.hj-experience-v13 .hj-main {
  min-width: 0;
  flex: 1;
  padding: 18px clamp(18px, 2.35vw, 38px) 48px;
  overflow-x: hidden;
}

.hj-experience-v13 .hj-topbar {
  min-height: 68px;
  padding: 10px 12px;
  flex-wrap: nowrap;
  border: 1px solid rgba(210,220,207,.94);
  border-radius: 18px;
  background: rgba(255,255,255,.90);
  box-shadow: 0 10px 32px rgba(6,45,37,.06);
  backdrop-filter: blur(20px);
  position: sticky;
  top: 14px;
  z-index: 50;
}
.hj-experience-v13 .hj-topbar-left { flex: 1; min-width: 0; flex-wrap: nowrap; }
.hj-experience-v13 .hj-topbar-right { flex: 0 0 auto; flex-wrap: nowrap; }

.hj-experience-v13 .hj-command-search {
  width: min(560px, 45vw);
  min-width: 260px;
  height: 44px;
  border-radius: 12px;
  background: #fbfcfa;
  border-color: #dde5da;
}
.hj-experience-v13 .hj-command-search:focus-within { background: #fff; border-color: rgba(10,138,98,.52); box-shadow: var(--hj-focus); }
.hj-experience-v13 .hj-command-search input { font-size: 12.5px; }
.hj-experience-v13 .hj-command-search kbd { border-radius: 7px; }

.hj-experience-v13 .hj-workspace-pill {
  height: 44px;
  padding: 0 13px 0 7px;
  border: 1px solid var(--hj-line);
  border-radius: 12px;
  background: #fff;
  color: var(--hj-ink-700);
}
.hj-experience-v13 .hj-workspace-icon { background: var(--hj-surface-green); color: var(--hj-emerald); }
.hj-experience-v13 .hj-status-inline { min-height: 38px; border: 1px solid #d7ebdf; background: #f1faf5; }
.hj-experience-v13 .hj-icon-button { width: 40px; height: 40px; border-radius: 12px; }
.hj-experience-v13 .hj-topbar-profile { min-width: 170px; height: 44px; border-radius: 12px; }

/* Page heading: compact on dashboard, expressive on tools. */
.hj-experience-v13 .hj-page-title-row {
  min-height: 104px;
  margin: 24px 2px 18px;
  align-items: flex-end;
  justify-content: space-between;
}
.hj-experience-v13 .hj-page-heading-wrap { display: flex; align-items: flex-start; gap: 14px; }
.hj-experience-v13 .hj-page-heading-icon {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  display: grid;
  place-items: center;
  border: 1px solid #dce8d8;
  border-radius: 14px;
  background: linear-gradient(145deg, #f8fcf6, #eaf5e6);
  color: var(--hj-emerald);
}
.hj-experience-v13 .hj-page-heading-icon svg { width: 21px; height: 21px; }
.hj-experience-v13 .hj-page-eyebrow { color: var(--hj-emerald); font-size: 9.5px; letter-spacing: .13em; }
.hj-experience-v13 .hj-page-title-row h1 { font-size: clamp(27px, 2.5vw, 40px); letter-spacing: -.052em; }
.hj-experience-v13 .hj-page-subtitle { max-width: 780px; color: var(--hj-ink-500); }
.hj-experience-v13 .hj-page-title-overview { display: none; }

/* Dashboard hero — strong but calm, like the reference's lead card. */
.hj-experience-v13 .hj-command-hero {
  position: relative;
  isolation: isolate;
  min-height: 248px;
  display: grid;
  grid-template-columns: minmax(0, 1.48fr) minmax(340px, .82fr);
  gap: 18px;
  margin: 24px 0 16px;
  padding: 22px;
  overflow: hidden;
  border: 1px solid #dce7d8;
  border-radius: var(--hj-radius-xl);
  background:
    radial-gradient(circle at 55% -30%, rgba(213,255,114,.54), transparent 38%),
    radial-gradient(circle at 94% 20%, rgba(10,138,98,.13), transparent 30%),
    linear-gradient(135deg, #fbfdf9 0%, #eef7ea 100%);
  box-shadow: var(--hj-shadow);
}
.hj-experience-v13 .hj-command-hero::before,
.hj-experience-v13 .hj-command-hero::after {
  content: '';
  position: absolute;
  z-index: -1;
  border-radius: 999px;
  border: 1px solid rgba(10,138,98,.10);
}
.hj-experience-v13 .hj-command-hero::before { width: 520px; height: 520px; right: 19%; top: -410px; }
.hj-experience-v13 .hj-command-hero::after { width: 310px; height: 310px; left: -190px; bottom: -240px; }

.hj-experience-v13 .hj-command-hero-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 16px 12px 16px 14px;
}
.hj-experience-v13 .hj-command-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  color: var(--hj-emerald);
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.hj-experience-v13 .hj-command-kicker i { width: 8px; height: 8px; border-radius: 50%; background: var(--hj-lime-2); box-shadow: 0 0 0 5px rgba(183,239,78,.15); }
.hj-experience-v13 .hj-command-hero h2 {
  max-width: 760px;
  margin: 16px 0 12px;
  color: var(--hj-forest);
  font-size: clamp(31px, 3vw, 48px);
  line-height: 1.02;
  letter-spacing: -.06em;
  font-weight: 760;
}
.hj-experience-v13 .hj-command-hero-content > p { max-width: 670px; color: var(--hj-ink-500); font-size: 14px; line-height: 1.65; }
.hj-experience-v13 .hj-command-hero-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 24px; }
.hj-experience-v13 .hj-command-hero-actions a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 15px;
  border-radius: 12px;
  border: 1px solid #d6e1d2;
  background: rgba(255,255,255,.78);
  color: var(--hj-ink-700);
  font-size: 11.5px;
  font-weight: 750;
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.hj-experience-v13 .hj-command-hero-actions a:hover { transform: translateY(-2px); border-color: rgba(10,138,98,.36); box-shadow: 0 12px 24px rgba(6,45,37,.08); }
.hj-experience-v13 .hj-command-hero-actions svg { width: 16px; height: 16px; }
.hj-experience-v13 .hj-command-hero-actions .hj-hero-primary { color: #fff; border-color: var(--hj-forest); background: linear-gradient(135deg, var(--hj-forest-2), var(--hj-forest)); box-shadow: 0 12px 24px rgba(6,45,37,.16); }
.hj-experience-v13 .hj-command-hero-actions .hj-hero-primary:hover { color: var(--hj-lime); }

.hj-experience-v13 .hj-command-hero-status {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  align-content: center;
  align-items: center;
  gap: 14px;
  padding: 22px;
  border-radius: 22px;
  color: #fff;
  background:
    radial-gradient(circle at 90% 10%, rgba(213,255,114,.22), transparent 34%),
    linear-gradient(145deg, #0a4b3c 0%, #061c18 100%);
  box-shadow: var(--hj-shadow-dark);
}
.hj-experience-v13 .hj-command-hero-status::after { content: ''; position: absolute; width: 220px; height: 220px; right: -130px; bottom: -150px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; }
.hj-experience-v13 .hj-command-orbit { width: 96px; height: 96px; position: relative; display: grid; place-items: center; }
.hj-experience-v13 .hj-command-orbit span { position: absolute; inset: 0; border: 1px solid rgba(213,255,114,.22); border-radius: 50%; animation: hjMasterOrbit 8s linear infinite; }
.hj-experience-v13 .hj-command-orbit span:nth-child(2) { inset: 13px; border-style: dashed; animation-duration: 6s; animation-direction: reverse; }
.hj-experience-v13 .hj-command-orbit span:nth-child(3) { inset: 27px; background: rgba(213,255,114,.09); border: 0; }
.hj-experience-v13 .hj-command-orbit strong { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; background: var(--hj-lime); color: var(--hj-forest); box-shadow: 0 0 0 8px rgba(213,255,114,.08); z-index: 2; }
.hj-experience-v13 .hj-command-orbit svg { width: 20px; height: 20px; }
@keyframes hjMasterOrbit { to { transform: rotate(360deg); } }
.hj-experience-v13 .hj-command-status-copy span { display: block; color: rgba(255,255,255,.52); font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.hj-experience-v13 .hj-command-status-copy strong { display: block; margin-top: 8px; color: #fff; font-size: 19px; line-height: 1.15; letter-spacing: -.035em; overflow-wrap: anywhere; }
.hj-experience-v13 .hj-command-status-copy small { display: block; margin-top: 6px; color: rgba(255,255,255,.58); font-size: 10.5px; line-height: 1.5; }
.hj-experience-v13 .hj-command-hero-status .hj-account-server-load { grid-column: 1 / -1; margin-top: 8px; }

/* Metric cards. */
.hj-experience-v13 .hj-metric-grid-premium {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}
.hj-experience-v13 .hj-metric-grid-premium .hj-metric-card {
  min-height: 136px;
  padding: 18px;
  overflow: hidden;
  position: relative;
  border: 1px solid var(--hj-line);
  border-radius: 20px;
  background: rgba(255,255,255,.96);
  box-shadow: var(--hj-shadow);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.hj-experience-v13 .hj-metric-grid-premium .hj-metric-card::before {
  content: '';
  position: absolute;
  width: 120px;
  height: 60px;
  right: 16px;
  bottom: 14px;
  opacity: .44;
  background: linear-gradient(160deg, transparent 8%, rgba(10,138,98,.12) 9% 12%, transparent 13% 28%, rgba(10,138,98,.22) 29% 33%, transparent 34% 48%, rgba(183,239,78,.35) 49% 54%, transparent 55%);
  clip-path: polygon(0 80%, 16% 57%, 31% 66%, 48% 32%, 63% 47%, 81% 12%, 100% 28%, 100% 100%, 0 100%);
}
.hj-experience-v13 .hj-metric-grid-premium .hj-metric-card:hover { transform: translateY(-3px); border-color: #cad9c6; box-shadow: var(--hj-shadow-hover); }
.hj-experience-v13 .hj-metric-grid-premium .hj-metric-icon { width: 38px; height: 38px; border-radius: 12px; background: var(--hj-surface-green); color: var(--hj-emerald); }
.hj-experience-v13 .hj-metric-grid-premium .hj-metric-icon svg { width: 18px; height: 18px; }
.hj-experience-v13 .hj-metric-grid-premium .hj-metric-value { font-size: 31px; color: var(--hj-forest); }
.hj-experience-v13 .hj-metric-grid-premium .hj-metric-top span:not(.hj-metric-icon) { color: var(--hj-ink-500); }
.hj-experience-v13 .hj-metric-grid-premium .hj-metric-card > span { position: relative; z-index: 2; max-width: 75%; }

/* Main bento grid. */
.hj-experience-v13 .hj-dashboard-core {
  display: grid;
  grid-template-columns: minmax(0, 1.62fr) minmax(330px, .86fr);
  gap: 16px;
  align-items: stretch;
}
.hj-experience-v13 .hj-panel,
.hj-experience-v13 .hj-service-card,
.hj-experience-v13 .hj-tool-card,
.hj-experience-v13 .hj-native-card,
.hj-experience-v13 .hj-redis-card,
.hj-experience-v13 .hj-php-card {
  border: 1px solid var(--hj-line);
  border-radius: 20px;
  background: rgba(255,255,255,.96);
  box-shadow: var(--hj-shadow);
}
.hj-experience-v13 .hj-panel { padding: 20px; }
.hj-experience-v13 .hj-panel-kicker { display: block; margin-bottom: 6px; color: var(--hj-emerald); font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.hj-experience-v13 .hj-panel-head-premium h2 { font-size: 17px; letter-spacing: -.035em; }
.hj-experience-v13 .hj-panel-head a { border: 0; color: var(--hj-emerald); font-size: 10.5px; font-weight: 750; }
.hj-experience-v13 .hj-panel-head a::after { content: '  →'; }

.hj-experience-v13 .hj-service-command-card { padding: 0; overflow: hidden; }
.hj-experience-v13 .hj-service-command-card > .hj-panel-head { padding: 20px 22px 0; }
.hj-experience-v13 .hj-service-identity {
  margin: 14px 20px 0;
  min-height: 108px;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px;
  border: 1px solid #d8e8d3;
  border-radius: 18px;
  background:
    radial-gradient(circle at 93% 5%, rgba(213,255,114,.34), transparent 31%),
    linear-gradient(135deg, #f5fbf1, #eaf5e6);
}
.hj-experience-v13 .hj-service-identity-mark {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  color: var(--hj-lime);
  background: linear-gradient(145deg, var(--hj-forest-2), var(--hj-forest));
  box-shadow: 0 14px 30px rgba(6,45,37,.18);
}
.hj-experience-v13 .hj-service-identity-mark svg { width: 23px; height: 23px; }
.hj-experience-v13 .hj-service-identity-copy { flex: 1; min-width: 0; }
.hj-experience-v13 .hj-service-identity-copy span { display: block; color: var(--hj-emerald); font-size: 9.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.hj-experience-v13 .hj-service-identity-copy h3 { margin: 5px 0 3px; color: var(--hj-forest); font-size: 21px; letter-spacing: -.04em; overflow-wrap: anywhere; }
.hj-experience-v13 .hj-service-identity-copy small { color: var(--hj-ink-400); font-size: 10.5px; }

.hj-experience-v13 .hj-service-health-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: 18px 20px 0;
  border: 1px solid var(--hj-line);
  border-radius: 17px;
  overflow: hidden;
}
.hj-experience-v13 .hj-service-health-grid > div { min-width: 0; padding: 17px; border-right: 1px solid var(--hj-line); background: #fff; }
.hj-experience-v13 .hj-service-health-grid > div:last-child { border-right: 0; }
.hj-experience-v13 .hj-service-health-grid span { display: block; color: var(--hj-ink-400); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hj-experience-v13 .hj-service-health-grid strong { display: block; margin-top: 8px; color: var(--hj-forest); font-size: 15px; line-height: 1.25; overflow-wrap: anywhere; }
.hj-experience-v13 .hj-service-health-grid small { display: block; margin-top: 4px; color: var(--hj-ink-300); font-size: 9.5px; }

.hj-experience-v13 .hj-service-command-actions {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  padding: 18px 20px 20px;
}
.hj-experience-v13 .hj-service-command-actions a {
  min-height: 72px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 11px;
  border: 1px solid var(--hj-line);
  border-radius: 13px;
  background: var(--hj-surface-soft);
  color: var(--hj-ink-700);
  font-size: 10.5px;
  font-weight: 750;
  text-decoration: none;
  transition: transform .16s ease, border-color .16s ease, background-color .16s ease;
}
.hj-experience-v13 .hj-service-command-actions a svg { width: 17px; height: 17px; color: var(--hj-emerald); }
.hj-experience-v13 .hj-service-command-actions a:hover { transform: translateY(-2px); border-color: rgba(10,138,98,.34); background: #f3f9f1; color: var(--hj-forest); }
.hj-experience-v13 .hj-service-command-actions a.is-primary { color: #fff; border-color: var(--hj-forest); background: linear-gradient(145deg, var(--hj-forest-2), var(--hj-forest)); box-shadow: 0 10px 22px rgba(6,45,37,.14); }
.hj-experience-v13 .hj-service-command-actions a.is-primary svg { color: var(--hj-lime); }

.hj-experience-v13 .hj-action-console { padding: 20px; }
.hj-experience-v13 .hj-console-badge { padding: 5px 9px; border-radius: 999px; background: var(--hj-surface-green); color: var(--hj-emerald); font-size: 9px; font-weight: 800; }
.hj-experience-v13 .hj-action-console-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.hj-experience-v13 .hj-action-console-grid a {
  min-height: 118px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  gap: 4px;
  padding: 14px;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--hj-line);
  border-radius: 16px;
  background: linear-gradient(145deg, #fff, #f6f9f5);
  color: var(--hj-ink-900);
  text-decoration: none;
  transition: transform .17s ease, border-color .17s ease, box-shadow .17s ease;
}
.hj-experience-v13 .hj-action-console-grid a::after { content: ''; position: absolute; width: 80px; height: 80px; right: -34px; top: -35px; border-radius: 50%; background: radial-gradient(circle, rgba(213,255,114,.36), transparent 70%); }
.hj-experience-v13 .hj-action-console-grid a:hover { transform: translateY(-3px); border-color: #c9d9c5; box-shadow: 0 16px 30px rgba(6,45,37,.08); }
.hj-experience-v13 .hj-action-console-grid a > span { width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: auto; border-radius: 12px; background: var(--hj-surface-green); color: var(--hj-emerald); }
.hj-experience-v13 .hj-action-console-grid a svg { width: 18px; height: 18px; }
.hj-experience-v13 .hj-action-console-grid strong { font-size: 12px; }
.hj-experience-v13 .hj-action-console-grid small { color: var(--hj-ink-400); font-size: 9.5px; }

/* Secondary dashboard layout. */
.hj-experience-v13 .hj-onboarding-premium { margin-top: 16px; }
.hj-experience-v13 .hj-operations-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.58fr) minmax(330px, .82fr);
  gap: 16px;
  margin-top: 16px;
  align-items: start;
}
.hj-experience-v13 .hj-intelligence-stack { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.hj-experience-v13 .hj-service-fleet-panel { padding: 20px 20px 8px; }
.hj-experience-v13 .hj-service-fleet-panel .hj-table-wrap { margin: 0 -20px; border-left: 0; border-right: 0; border-bottom: 0; border-radius: 0; }
.hj-experience-v13 .hj-billing-intelligence {
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0%, rgba(213,255,114,.22), transparent 42%),
    linear-gradient(145deg, #fff, #f7fbf5);
}
.hj-experience-v13 .hj-billing-intelligence-value span { display: block; color: var(--hj-ink-400); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.hj-experience-v13 .hj-billing-intelligence-value strong { display: block; margin-top: 8px; color: var(--hj-forest); font-size: 29px; letter-spacing: -.05em; }
.hj-experience-v13 .hj-billing-intelligence-value small { display: block; margin-top: 4px; color: var(--hj-ink-400); font-size: 10px; }
.hj-experience-v13 .hj-billing-intelligence-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--hj-line); font-size: 10.5px; color: var(--hj-ink-400); }
.hj-experience-v13 .hj-billing-intelligence-foot strong { color: var(--hj-emerald); font-size: 13px; }

.hj-experience-v13 .hj-insight-grid {
  display: grid;
  grid-template-columns: minmax(0, .75fr) minmax(0, .75fr) minmax(0, 1.5fr);
  gap: 16px;
  margin-top: 16px;
}
.hj-experience-v13 .hj-insight-card { min-height: 166px; }
.hj-experience-v13 .hj-insight-card-head { display: flex; align-items: center; gap: 12px; }
.hj-experience-v13 .hj-insight-card-head > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; background: var(--hj-surface-green); color: var(--hj-emerald); }
.hj-experience-v13 .hj-insight-card-head svg { width: 19px; height: 19px; }
.hj-experience-v13 .hj-insight-card-head small { display: block; color: var(--hj-ink-400); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.hj-experience-v13 .hj-insight-card-head strong { display: block; margin-top: 3px; color: var(--hj-forest); font-size: 24px; letter-spacing: -.04em; }
.hj-experience-v13 .hj-insight-progress { height: 8px; margin: 22px 0 11px; overflow: hidden; border-radius: 999px; background: #e8eee5; }
.hj-experience-v13 .hj-insight-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--hj-emerald), var(--hj-lime-2)); }
.hj-experience-v13 .hj-insight-card > p { color: var(--hj-ink-500); font-size: 10.5px; }
.hj-experience-v13 .hj-activity-stream { display: flex; flex-direction: column; gap: 0; }
.hj-experience-v13 .hj-activity-stream > div { min-height: 56px; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--hj-line); }
.hj-experience-v13 .hj-activity-stream > div:last-child { border-bottom: 0; }
.hj-experience-v13 .hj-activity-stream p { min-width: 0; }
.hj-experience-v13 .hj-activity-stream strong { display: block; font-size: 11px; color: var(--hj-ink-800); }
.hj-experience-v13 .hj-activity-stream small { display: block; margin-top: 3px; color: var(--hj-ink-400); font-size: 9.5px; }
.hj-experience-v13 .hj-activity-stream time { color: var(--hj-ink-300); font-size: 9px; white-space: nowrap; }

/* Generic page quality: tables, forms, states, tools. */
.hj-experience-v13 .hj-page-grid { gap: 16px; }
.hj-experience-v13 .hj-page-grid-2 { grid-template-columns: minmax(0, 1.56fr) minmax(330px, .84fr); }
.hj-experience-v13 .hj-table-wrap { border: 1px solid var(--hj-line); border-radius: 15px; background: #fff; }
.hj-experience-v13 .hj-table thead th { height: 46px; padding: 0 14px; background: #f7faf6; color: var(--hj-ink-400); font-size: 9px; letter-spacing: .085em; }
.hj-experience-v13 .hj-table tbody td { padding: 14px; border-bottom-color: #edf1eb; }
.hj-experience-v13 .hj-table tbody tr:hover { background: #fbfdf9; }
.hj-experience-v13 .hj-table-icon { width: 36px; height: 36px; border-radius: 11px; background: var(--hj-surface-green); color: var(--hj-emerald); }
.hj-experience-v13 .hj-row-actions a { border-radius: 9px; }
.hj-experience-v13 .hj-row-actions a:first-child { background: var(--hj-forest); color: #fff; }
.hj-experience-v13 .hj-row-actions a:first-child:hover { background: var(--hj-forest-2); color: var(--hj-lime); }
.hj-experience-v13 .hj-task-item,
.hj-experience-v13 .hj-side-item,
.hj-experience-v13 .hj-mini-item,
.hj-experience-v13 .hj-data-row { border-color: var(--hj-line); }
.hj-experience-v13 .hj-task-item { align-items: center; background: #fafcf9; }
.hj-experience-v13 .hj-task-check { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 9px; background: var(--hj-surface-green); color: var(--hj-emerald); }
.hj-experience-v13 .hj-side-item-icon,
.hj-experience-v13 .hj-mini-icon { background: var(--hj-surface-green); color: var(--hj-emerald); }
.hj-experience-v13 .hj-empty { border-radius: 16px; background: #fafcf9; }

.hj-experience-v13 input[type="text"],
.hj-experience-v13 input[type="email"],
.hj-experience-v13 input[type="password"],
.hj-experience-v13 input[type="number"],
.hj-experience-v13 input[type="url"],
.hj-experience-v13 input[type="search"],
.hj-experience-v13 select,
.hj-experience-v13 textarea {
  min-height: 44px;
  border-color: var(--hj-line-strong);
  border-radius: 12px;
  background: #fff;
}
.hj-experience-v13 textarea { min-height: 120px; }
.hj-experience-v13 input:focus,
.hj-experience-v13 select:focus,
.hj-experience-v13 textarea:focus { border-color: rgba(10,138,98,.62); box-shadow: var(--hj-focus); }
.hj-experience-v13 .hj-primary-button,
.hj-experience-v13 button[type="submit"],
.hj-experience-v13 input[type="submit"] {
  min-height: 44px;
  border-radius: 12px;
  border-color: var(--hj-forest);
  color: #fff;
  background: linear-gradient(135deg, var(--hj-forest-2), var(--hj-forest));
  box-shadow: 0 10px 22px rgba(6,45,37,.14);
}
.hj-experience-v13 .hj-primary-button:hover,
.hj-experience-v13 button[type="submit"]:hover,
.hj-experience-v13 input[type="submit"]:hover { color: var(--hj-lime); box-shadow: 0 14px 30px rgba(6,45,37,.22); }
.hj-experience-v13 .hj-secondary-button { min-height: 42px; border-radius: 12px; }

/* PHP controls remain explicit and accessible. */
.hj-experience-v13 .hj-extension-item,
.hj-experience-v13 .hj-selector-extension,
.hj-experience-v13 .hj-cloudlinux-extension,
.hj-experience-v13 .hj-php-extension-item {
  min-height: 52px;
  border: 1px solid var(--hj-line) !important;
  border-radius: 13px !important;
  background: #fbfcfa !important;
}
.hj-experience-v13 .hj-extension-item:hover,
.hj-experience-v13 .hj-selector-extension:hover,
.hj-experience-v13 .hj-cloudlinux-extension:hover,
.hj-experience-v13 .hj-php-extension-item:hover { transform: translateY(-2px); border-color: rgba(10,138,98,.38) !important; background: #f3faf4 !important; box-shadow: 0 10px 22px rgba(6,45,37,.06); }
.hj-experience-v13 input[type="checkbox"] { accent-color: var(--hj-emerald); }

/* Responsive behavior. */
@media (max-width: 1380px) {
  .hj-experience-v13 .hj-sidebar { width: 248px; flex-basis: 248px; }
  .hj-experience-v13 .hj-command-search { width: min(460px, 38vw); }
  .hj-experience-v13 .hj-command-hero { grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr); }
  .hj-experience-v13 .hj-service-command-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1120px) {
  .hj-experience-v13 .hj-dashboard-core,
  .hj-experience-v13 .hj-operations-layout { grid-template-columns: 1fr; }
  .hj-experience-v13 .hj-action-console-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .hj-experience-v13 .hj-action-console-grid a { min-height: 105px; }
  .hj-experience-v13 .hj-insight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hj-experience-v13 .hj-activity-intelligence { grid-column: 1 / -1; }
}

@media (max-width: 980px) {
  .hj-experience-v13 .hj-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: min(310px, 88vw);
    height: 100dvh;
    transform: translateX(-105%);
    transition: transform .24s cubic-bezier(.2,.75,.25,1);
    z-index: 1002;
  }
  .hj-experience-v13.hj-sidebar-open .hj-sidebar { transform: translateX(0); }
  .hj-experience-v13 .hj-mobile-nav-toggle { display: block; }
  .hj-experience-v13 .hj-command-search { width: 100%; min-width: 0; }
  .hj-experience-v13 .hj-workspace-pill { display: none; }
  .hj-experience-v13 .hj-topbar-profile { min-width: 44px; width: 44px; padding: 4px; }
  .hj-experience-v13 .hj-topbar-profile > span:last-child { display: none; }
  .hj-experience-v13 .hj-command-hero { grid-template-columns: 1fr; }
  .hj-experience-v13 .hj-command-hero-status { grid-template-columns: 90px minmax(0, 1fr); }
  .hj-experience-v13 .hj-metric-grid-premium { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hj-experience-v13 .hj-service-health-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hj-experience-v13 .hj-service-health-grid > div:nth-child(2) { border-right: 0; }
  .hj-experience-v13 .hj-service-health-grid > div:nth-child(-n+2) { border-bottom: 1px solid var(--hj-line); }
  .hj-experience-v13 .hj-action-console-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hj-experience-v13 .hj-page-grid-2 { grid-template-columns: 1fr; }
}

@media (max-width: 660px) {
  .hj-experience-v13 .hj-main { padding: 10px 10px 32px; }
  .hj-experience-v13 .hj-topbar { min-height: 60px; top: 8px; padding: 8px; border-radius: 15px; }
  .hj-experience-v13 .hj-status-inline,
  .hj-experience-v13 .hj-command-search kbd { display: none; }
  .hj-experience-v13 .hj-page-title-row { min-height: auto; margin: 22px 2px 14px; align-items: flex-start; }
  .hj-experience-v13 .hj-page-heading-icon { width: 40px; height: 40px; flex-basis: 40px; }
  .hj-experience-v13 .hj-page-title-row h1 { font-size: 28px; }
  .hj-experience-v13 .hj-command-hero { min-height: 0; margin-top: 16px; padding: 14px; border-radius: 22px; }
  .hj-experience-v13 .hj-command-hero-content { padding: 14px 8px; }
  .hj-experience-v13 .hj-command-hero h2 { font-size: 32px; }
  .hj-experience-v13 .hj-command-hero-status { grid-template-columns: 1fr; padding: 18px; }
  .hj-experience-v13 .hj-command-orbit { width: 74px; height: 74px; }
  .hj-experience-v13 .hj-metric-grid-premium { grid-template-columns: 1fr; }
  .hj-experience-v13 .hj-service-identity { align-items: flex-start; flex-wrap: wrap; }
  .hj-experience-v13 .hj-service-health-grid { grid-template-columns: 1fr; }
  .hj-experience-v13 .hj-service-health-grid > div { border-right: 0; border-bottom: 1px solid var(--hj-line); }
  .hj-experience-v13 .hj-service-health-grid > div:last-child { border-bottom: 0; }
  .hj-experience-v13 .hj-service-command-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hj-experience-v13 .hj-action-console-grid { grid-template-columns: 1fr 1fr; }
  .hj-experience-v13 .hj-insight-grid { grid-template-columns: 1fr; }
  .hj-experience-v13 .hj-activity-intelligence { grid-column: auto; }
  .hj-experience-v13 .hj-table { min-width: 760px; }
}

@media (prefers-reduced-motion: reduce) {
  .hj-experience-v13 .hj-command-orbit span,
  .hj-experience-v13 .hj-metric-card,
  .hj-experience-v13 .hj-sidebar-nav a,
  .hj-experience-v13 .hj-action-console-grid a { animation: none !important; transition: none !important; }
}

/* ========================================================================== 
   HostingJet Customer Experience v0.14.0
   Reference direction: supplied second client-area dashboard.
   Calm winter-white canvas, light navigation, lime precision accents,
   product-first layouts, customer language, and enterprise spacing.
   ========================================================================== */

.hj-experience-v14 {
  --hj-bg: #eef0f2;
  --hj-canvas: #f6f7f8;
  --hj-surface: #ffffff;
  --hj-surface-soft: #f8f9fa;
  --hj-surface-muted: #f1f3f3;
  --hj-text: #111512;
  --hj-ink-900: #111512;
  --hj-ink-800: #202522;
  --hj-ink-700: #333a36;
  --hj-ink-500: #666e69;
  --hj-ink-400: #818984;
  --hj-ink-300: #a8afab;
  --hj-line: #e4e7e5;
  --hj-line-strong: #d4d9d6;
  --hj-forest: #123f34;
  --hj-forest-dark: #0b3028;
  --hj-emerald: #15936a;
  --hj-lime: #dfff45;
  --hj-lime-soft: #f1ffb8;
  --hj-good: #15936a;
  --hj-good-bg: #eaf8f1;
  --hj-warn: #9a6b08;
  --hj-warn-bg: #fff6d9;
  --hj-bad: #c6463b;
  --hj-bad-bg: #fff0ef;
  --hj-radius-sm: 8px;
  --hj-radius: 11px;
  --hj-radius-lg: 14px;
  --hj-shadow: 0 1px 2px rgba(16, 24, 20, .025), 0 8px 24px rgba(16, 24, 20, .035);
  --hj-shadow-pop: 0 18px 42px rgba(16, 24, 20, .12);
  --hj-focus: 0 0 0 3px rgba(21, 147, 106, .15);
  width: min(1760px, calc(100% - 28px));
  min-height: calc(100vh - 28px);
  margin: 14px auto;
  border: 1px solid rgba(201, 222, 76, .72);
  border-radius: 17px;
  overflow: hidden;
  background: var(--hj-canvas);
  box-shadow: 0 24px 70px rgba(24, 33, 28, .09);
  color: var(--hj-text);
}

body.hj-standalone-body {
  background: #e8ebed !important;
}

.hj-experience-v14.hj-shell-standalone,
.hj-experience-v14.hj-shell-embedded {
  display: flex;
}

.hj-experience-v14.hj-shell-embedded {
  min-height: 920px;
}

.hj-experience-v14 a {
  color: inherit;
}

.hj-experience-v14 h1,
.hj-experience-v14 h2,
.hj-experience-v14 h3,
.hj-experience-v14 h4 {
  color: var(--hj-text);
  font-weight: 650;
  letter-spacing: -.025em;
}

/* Sidebar */
.hj-experience-v14 .hj-sidebar {
  width: 236px;
  flex: 0 0 236px;
  min-height: inherit;
  height: calc(100vh - 30px);
  position: sticky;
  top: 0;
  align-items: stretch;
  gap: 0;
  padding: 0;
  overflow: hidden;
  color: var(--hj-ink-800);
  background: #fbfbfc;
  border-right: 1px solid var(--hj-line);
  box-shadow: none;
  z-index: 90;
}

.hj-experience-v14 .hj-sidebar-brand-row {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 1px solid var(--hj-line);
}

.hj-experience-v14 .hj-sidebar-brand {
  width: auto;
  height: auto;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 11px;
  text-decoration: none;
  color: var(--hj-text) !important;
}

.hj-experience-v14 .hj-brand-mark {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  position: relative;
  overflow: hidden;
  border-radius: 9px;
  background: var(--hj-forest);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}

.hj-experience-v14 .hj-brand-mark i {
  position: absolute;
  width: 5px;
  height: 22px;
  top: 6px;
  border-radius: 999px;
  background: #fff;
  transform: skew(-18deg);
}
.hj-experience-v14 .hj-brand-mark i:nth-child(1) { left: 8px; }
.hj-experience-v14 .hj-brand-mark i:nth-child(2) { left: 14px; top: 11px; height: 16px; background: var(--hj-lime); }
.hj-experience-v14 .hj-brand-mark i:nth-child(3) { right: 7px; }

.hj-experience-v14 .hj-brand-copy {
  display: flex;
  flex-direction: column;
  line-height: 1.1;
}

.hj-experience-v14 .hj-brand-copy strong {
  color: var(--hj-text);
  font-size: 15px;
  letter-spacing: -.025em;
}

.hj-experience-v14 .hj-brand-copy small {
  margin-top: 4px;
  color: var(--hj-ink-400);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.hj-experience-v14 .hj-sidebar-close {
  color: var(--hj-ink-500);
}

.hj-experience-v14 .hj-sidebar-nav {
  flex: 1;
  width: 100%;
  padding: 14px 0 18px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #d5d9d6 transparent;
}

.hj-experience-v14 .hj-nav-section {
  display: block;
  margin: 18px 20px 7px;
  color: #9aa19d;
  font-size: 9px;
  font-weight: 650;
  letter-spacing: .04em;
  text-transform: none;
}

.hj-experience-v14 .hj-nav-section:first-child {
  margin-top: 2px;
}

.hj-experience-v14 .hj-sidebar-nav a {
  position: relative;
  width: auto;
  min-height: 40px;
  height: auto;
  margin: 0;
  padding: 8px 17px 8px 19px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  border: 0;
  border-radius: 0;
  color: #444b47;
  background: transparent;
  font-size: 12px;
  font-weight: 520;
  text-decoration: none;
  transition: color .14s ease, background-color .14s ease;
}

.hj-experience-v14 .hj-sidebar-nav a::after {
  display: none !important;
}

.hj-experience-v14 .hj-sidebar-nav a::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 3px;
  border-radius: 3px 0 0 3px;
  background: transparent;
  box-shadow: none;
}

.hj-experience-v14 .hj-sidebar-nav a:hover {
  color: var(--hj-text);
  background: #f2f3f4;
}

.hj-experience-v14 .hj-sidebar-nav a.is-active {
  color: var(--hj-text);
  background: #f0f2f2;
}

.hj-experience-v14 .hj-sidebar-nav a.is-active::before {
  background: var(--hj-lime);
}

.hj-experience-v14 .hj-nav-icon {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  display: grid;
  place-items: center;
  color: #4f5752;
  background: transparent;
  border-radius: 0;
}

.hj-experience-v14 .hj-sidebar-nav a.is-active .hj-nav-icon {
  color: var(--hj-forest);
  background: transparent;
}

.hj-experience-v14 .hj-nav-icon svg {
  width: 16px;
  height: 16px;
}

.hj-experience-v14 .hj-nav-label {
  flex: 1;
  min-width: 0;
}

.hj-experience-v14 .hj-nav-cue {
  color: #a8aeaa;
  font-size: 15px;
  opacity: .8;
}

.hj-experience-v14 .hj-sidebar-product {
  margin: 0 14px 12px;
  padding: 14px;
  border: 1px solid #e1e6df;
  border-radius: 12px;
  background: linear-gradient(145deg, #fbfcfa, #f2f7ed);
}

.hj-experience-v14 .hj-sidebar-product-label {
  display: block;
  color: var(--hj-ink-400);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.hj-experience-v14 .hj-sidebar-product > strong {
  display: block;
  margin-top: 8px;
  color: var(--hj-text);
  font-size: 12px;
}

.hj-experience-v14 .hj-sidebar-product > small {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: var(--hj-ink-500);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hj-experience-v14 .hj-sidebar-product-foot {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.hj-experience-v14 .hj-sidebar-product-foot a {
  color: var(--hj-forest);
  font-size: 10px;
  font-weight: 700;
  text-decoration: none;
}

.hj-experience-v14 .hj-sidebar-user {
  width: auto;
  height: auto;
  margin: 0;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  border-top: 1px solid var(--hj-line);
  border-radius: 0;
  background: #fff;
  color: var(--hj-text);
  text-decoration: none;
}

.hj-experience-v14 .hj-sidebar-user .hj-nav-cue {
  margin-left: auto;
}

.hj-experience-v14 .hj-user-avatar {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #ecefed;
  color: var(--hj-forest);
  box-shadow: inset 0 0 0 1px #dfe3e0;
  font-size: 12px;
  font-weight: 750;
}

.hj-experience-v14 .hj-user-copy,
.hj-experience-v14 .hj-sidebar-user > span:nth-child(2) {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.hj-experience-v14 .hj-sidebar-user strong {
  overflow: hidden;
  color: var(--hj-text);
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hj-experience-v14 .hj-sidebar-user small {
  margin-top: 2px;
  color: var(--hj-ink-400);
  font-size: 9px;
}

/* Main shell and topbar */
.hj-experience-v14 .hj-main {
  min-width: 0;
  flex: 1;
  padding: 0 26px 34px;
  overflow: auto;
  background: var(--hj-canvas);
}

.hj-experience-v14 .hj-topbar {
  min-height: 82px;
  margin: 0 -26px;
  padding: 14px 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: nowrap;
  position: sticky;
  top: 0;
  z-index: 50;
  border: 0;
  border-bottom: 1px solid var(--hj-line);
  border-radius: 0;
  background: rgba(255,255,255,.96);
  box-shadow: none;
  backdrop-filter: blur(16px);
}

.hj-experience-v14 .hj-topbar-left {
  flex: 1;
  min-width: 0;
  flex-wrap: nowrap;
}

.hj-experience-v14 .hj-topbar-right {
  flex: 0 0 auto;
  flex-wrap: nowrap;
  gap: 9px;
}

.hj-experience-v14 .hj-mobile-nav-toggle {
  width: 38px;
  height: 38px;
  border: 1px solid var(--hj-line);
  border-radius: 9px;
  background: #fff;
}

.hj-experience-v14 .hj-command-search {
  width: min(590px, 52vw);
  min-width: 280px;
  height: 44px;
  padding: 0 11px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid #e4e7e5;
  border-radius: 9px;
  background: #f8f9fa;
  box-shadow: none;
}

.hj-experience-v14 .hj-command-search:focus-within {
  border-color: rgba(21,147,106,.55);
  background: #fff;
  box-shadow: var(--hj-focus);
}

.hj-experience-v14 .hj-command-search input {
  height: 40px;
  min-height: 40px;
  padding: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--hj-text);
  font-size: 11.5px;
}

.hj-experience-v14 .hj-command-search-icon {
  color: #7d8580;
}

.hj-experience-v14 .hj-command-search-icon svg {
  width: 16px;
  height: 16px;
}

.hj-experience-v14 .hj-command-search kbd {
  padding: 3px 6px;
  border: 0;
  border-radius: 5px;
  background: #eef0f1;
  color: #747b77;
  font-size: 9px;
  box-shadow: none;
}

.hj-experience-v14 .hj-topbar-text-link {
  padding: 8px 5px;
  color: var(--hj-text);
  font-size: 11px;
  font-weight: 550;
  text-decoration: none;
}

.hj-experience-v14 .hj-topbar-text-link:hover {
  color: var(--hj-emerald);
}

.hj-experience-v14 .hj-topbar-divider {
  width: 1px;
  height: 24px;
  margin: 0 4px;
  background: var(--hj-line);
}

.hj-experience-v14 .hj-icon-button {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: #3f4642;
  text-decoration: none;
}

.hj-experience-v14 .hj-icon-button:hover {
  border-color: var(--hj-line);
  background: #f5f6f6;
  color: var(--hj-forest);
}

.hj-experience-v14 .hj-icon-button svg {
  width: 17px;
  height: 17px;
}

.hj-experience-v14 .hj-notification-count {
  min-width: 15px;
  height: 15px;
  top: 1px;
  right: 0;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 999px;
  background: var(--hj-emerald);
  color: #fff;
  font-size: 8px;
}

.hj-experience-v14 .hj-topbar-profile {
  min-width: 158px;
  height: 44px;
  padding: 4px 7px 4px 4px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--hj-text);
  text-decoration: none;
}

.hj-experience-v14 .hj-topbar-profile:hover {
  background: #f5f6f6;
}

.hj-experience-v14 .hj-topbar-profile strong {
  color: var(--hj-text);
  font-size: 10.5px;
}

.hj-experience-v14 .hj-topbar-profile small {
  color: var(--hj-ink-400);
  font-size: 9px;
}

.hj-experience-v14 .hj-profile-caret {
  margin-left: auto;
  color: var(--hj-ink-400);
}

/* Breadcrumbs, page headers and notices */
.hj-experience-v14 .hj-breadcrumbs {
  margin: 23px 2px 0;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #8b928e;
  font-size: 10px;
}

.hj-experience-v14 .hj-breadcrumbs a {
  color: #606762;
  text-decoration: none;
}

.hj-experience-v14 .hj-breadcrumbs a:hover {
  color: var(--hj-forest);
}

.hj-experience-v14 .hj-page-title-row {
  min-height: auto;
  margin: 16px 2px 20px;
  padding: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.hj-experience-v14 .hj-page-heading h1 {
  color: #121512;
  font-size: clamp(25px, 2.25vw, 35px);
  line-height: 1.13;
  letter-spacing: -.045em;
}

.hj-experience-v14 .hj-page-subtitle {
  max-width: 720px;
  margin-top: 7px;
  color: var(--hj-ink-500);
  font-size: 11.5px;
  line-height: 1.6;
}

.hj-experience-v14 .hj-page-context {
  min-height: 0;
  margin: 0;
}

.hj-experience-v14 .hj-page-context:empty {
  display: none;
}

.hj-experience-v14 .hj-inline-notice {
  margin: 14px 0 0;
  border: 1px solid #d9e9df;
  border-radius: 9px;
  background: #f0faf4;
  color: #25664e;
  box-shadow: none;
}

/* Dashboard */
.hj-experience-v14 .hj-dashboard-welcome {
  min-height: 124px;
  padding: 27px 0 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.hj-experience-v14 .hj-dashboard-kicker {
  display: block;
  margin-bottom: 7px;
  color: var(--hj-emerald);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.hj-experience-v14 .hj-dashboard-welcome h1 {
  color: #111512;
  font-size: clamp(29px, 2.8vw, 42px);
  line-height: 1.05;
  letter-spacing: -.055em;
  font-weight: 580;
}

.hj-experience-v14 .hj-dashboard-welcome p {
  margin-top: 9px;
  color: var(--hj-ink-500);
  font-size: 11.5px;
}

.hj-experience-v14 .hj-dashboard-welcome-actions {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-shrink: 0;
}

.hj-experience-v14 .hj-dashboard-welcome-actions .hj-primary-button,
.hj-experience-v14 .hj-dashboard-welcome-actions .hj-secondary-button {
  min-height: 42px;
  padding: 0 16px;
  border-radius: 8px;
}

.hj-experience-v14 .hj-customer-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 270px;
  gap: 18px;
  align-items: start;
}

.hj-experience-v14 .hj-dashboard-primary-column,
.hj-experience-v14 .hj-dashboard-side-column {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.hj-experience-v14 .hj-panel {
  padding: 17px;
  border: 1px solid var(--hj-line);
  border-radius: 13px;
  background: #fff;
  box-shadow: var(--hj-shadow);
}

.hj-experience-v14 .hj-panel:hover {
  border-color: var(--hj-line-strong);
}

.hj-experience-v14 .hj-panel-head {
  margin-bottom: 14px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.hj-experience-v14 .hj-panel-head h2 {
  color: var(--hj-text);
  font-size: 13px;
  line-height: 1.3;
}

.hj-experience-v14 .hj-panel-head p {
  margin-top: 4px;
  color: var(--hj-ink-400);
  font-size: 9.5px;
  line-height: 1.45;
}

.hj-experience-v14 .hj-panel-head > a:not(.hj-icon-button) {
  padding: 3px 0;
  border: 0;
  color: var(--hj-text);
  font-size: 9.5px;
  font-weight: 600;
  text-decoration: none;
}

.hj-experience-v14 .hj-panel-head > a:not(.hj-icon-button)::after {
  display: none;
}

.hj-experience-v14 .hj-product-hub {
  padding: 0;
  overflow: hidden;
}

.hj-experience-v14 .hj-product-tabs {
  min-height: 52px;
  padding: 0 17px;
  display: flex;
  align-items: stretch;
  gap: 25px;
  overflow-x: auto;
  border-bottom: 1px solid var(--hj-line);
  scrollbar-width: none;
}

.hj-experience-v14 .hj-product-tabs::-webkit-scrollbar {
  display: none;
}

.hj-experience-v14 .hj-product-tabs a {
  position: relative;
  min-width: max-content;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #4c534f;
  font-size: 10px;
  font-weight: 550;
  text-decoration: none;
}

.hj-experience-v14 .hj-product-tabs a::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  border-radius: 2px 2px 0 0;
  background: transparent;
}

.hj-experience-v14 .hj-product-tabs a:hover,
.hj-experience-v14 .hj-product-tabs a.is-active {
  color: var(--hj-text);
}

.hj-experience-v14 .hj-product-tabs a.is-active::after {
  background: var(--hj-lime);
}

.hj-experience-v14 .hj-product-tabs svg {
  width: 14px;
  height: 14px;
}

.hj-experience-v14 .hj-product-tabs strong {
  min-width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #f0f2f2;
  color: var(--hj-ink-500);
  font-size: 8px;
}

.hj-experience-v14 .hj-product-hub-head {
  margin: 0;
  padding: 17px 17px 12px;
}

.hj-experience-v14 .hj-product-list {
  padding: 0 14px 15px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.hj-experience-v14 .hj-product-row {
  min-height: 66px;
  padding: 9px 11px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 82px auto;
  gap: 11px;
  align-items: center;
  border: 1px solid #e7e9e8;
  border-radius: 11px;
  background: #fff;
  transition: border-color .14s ease, background-color .14s ease;
}

.hj-experience-v14 .hj-product-row:hover {
  border-color: #d8ddda;
  background: #fcfdfc;
}

.hj-experience-v14 .hj-product-row-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #eef1ef;
  color: var(--hj-forest);
}

.hj-experience-v14 .hj-product-row-icon svg {
  width: 17px;
  height: 17px;
}

.hj-experience-v14 .hj-product-color-1 { background: #efe9ff; color: #7549bb; }
.hj-experience-v14 .hj-product-color-2 { background: #e9f1ff; color: #3f69bc; }
.hj-experience-v14 .hj-product-color-3 { background: #eef2ef; color: #283a32; }
.hj-experience-v14 .hj-product-color-4 { background: #fff0df; color: #c36d20; }

.hj-experience-v14 .hj-product-row-main {
  min-width: 0;
}

.hj-experience-v14 .hj-product-row-main strong {
  display: block;
  overflow: hidden;
  color: var(--hj-text);
  font-size: 11px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hj-experience-v14 .hj-product-row-main span {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: var(--hj-ink-400);
  font-size: 9px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hj-experience-v14 .hj-product-row-status {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  color: var(--hj-ink-500);
  font-size: 9px;
}

.hj-experience-v14 .hj-product-row-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #20be7a;
  box-shadow: 0 0 0 3px #e8f8f0;
}

.hj-experience-v14 .hj-product-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
}

.hj-experience-v14 .hj-product-row-actions a {
  min-height: 31px;
  padding: 0 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  border: 1px solid var(--hj-line);
  border-radius: 7px;
  background: #fff;
  color: var(--hj-text);
  font-size: 9px;
  font-weight: 550;
  text-decoration: none;
}

.hj-experience-v14 .hj-product-row-actions a:hover {
  border-color: #cbd1cd;
  background: #f8f9f9;
}

.hj-experience-v14 .hj-product-row-actions a.is-primary {
  border-color: var(--hj-forest);
  background: var(--hj-forest);
  color: #fff;
}

.hj-experience-v14 .hj-product-row-actions a.is-primary:hover {
  background: var(--hj-forest-dark);
}

.hj-experience-v14 .hj-dashboard-feed-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.hj-experience-v14 .hj-dashboard-feed-card {
  padding-bottom: 0;
  overflow: hidden;
}

.hj-experience-v14 .hj-dashboard-feed-card .hj-panel-head {
  padding: 0 0 1px;
}

.hj-experience-v14 .hj-feed-list,
.hj-experience-v14 .hj-activity-timeline {
  display: flex;
  flex-direction: column;
}

.hj-experience-v14 .hj-feed-item,
.hj-experience-v14 .hj-activity-timeline-item {
  min-height: 66px;
  padding: 10px 0;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  border-top: 1px solid #edf0ee;
  color: inherit;
  text-decoration: none;
}

.hj-experience-v14 .hj-activity-timeline-item {
  grid-template-columns: 34px minmax(0, 1fr);
}

.hj-experience-v14 .hj-feed-item:hover {
  color: var(--hj-forest);
}

.hj-experience-v14 .hj-feed-icon {
  width: 31px;
  height: 31px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #f0f2f1;
  color: #4e5752;
}

.hj-experience-v14 .hj-feed-icon.is-warning { background: #fff6d9; color: #9a6b08; }
.hj-experience-v14 .hj-feed-icon.is-critical { background: #fff0ef; color: #c6463b; }
.hj-experience-v14 .hj-feed-icon.is-success { background: #eaf8f1; color: #15936a; }

.hj-experience-v14 .hj-feed-icon svg {
  width: 14px;
  height: 14px;
}

.hj-experience-v14 .hj-feed-item strong,
.hj-experience-v14 .hj-activity-timeline-item strong {
  display: block;
  color: var(--hj-text);
  font-size: 10px;
  font-weight: 590;
}

.hj-experience-v14 .hj-feed-item small,
.hj-experience-v14 .hj-activity-timeline-item small {
  display: -webkit-box;
  margin-top: 3px;
  overflow: hidden;
  color: var(--hj-ink-500);
  font-size: 9px;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.hj-experience-v14 .hj-feed-item time {
  display: block;
  margin-top: 5px;
  color: var(--hj-ink-300);
  font-size: 8.5px;
}

.hj-experience-v14 .hj-feed-item > b {
  color: #a6ada8;
  font-weight: 400;
}

.hj-experience-v14 .hj-panel-footer-link {
  min-height: 44px;
  margin: 3px -17px 0;
  padding: 0 17px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid var(--hj-line);
  color: var(--hj-text);
  font-size: 9.5px;
  font-weight: 550;
  text-decoration: none;
}

.hj-experience-v14 .hj-panel-footer-link:hover {
  background: #f8f9f9;
}

.hj-experience-v14 .hj-panel-footer-link span {
  font-size: 14px;
}

.hj-experience-v14 .hj-manage-products-card {
  padding-bottom: 0;
  overflow: hidden;
}

.hj-experience-v14 .hj-side-search {
  height: 39px;
  margin: 2px 0 13px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--hj-line);
  border-radius: 8px;
  background: #fbfbfc;
}

.hj-experience-v14 .hj-side-search > span {
  color: #8f9692;
}

.hj-experience-v14 .hj-side-search svg {
  width: 14px;
  height: 14px;
}

.hj-experience-v14 .hj-side-search input {
  min-height: 36px;
  height: 36px;
  padding: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 9.5px;
}

.hj-experience-v14 .hj-product-summary-list {
  display: flex;
  flex-direction: column;
}

.hj-experience-v14 .hj-product-summary-list a {
  min-height: 45px;
  display: grid;
  grid-template-columns: 25px minmax(0, 1fr) auto 7px;
  gap: 8px;
  align-items: center;
  border-top: 1px solid #edf0ee;
  color: inherit;
  text-decoration: none;
}

.hj-experience-v14 .hj-product-summary-list a > span {
  width: 23px;
  height: 23px;
  display: grid;
  place-items: center;
  color: var(--hj-forest);
}

.hj-experience-v14 .hj-product-summary-list svg {
  width: 14px;
  height: 14px;
}

.hj-experience-v14 .hj-product-summary-list strong {
  color: var(--hj-text);
  font-size: 9.5px;
  font-weight: 560;
}

.hj-experience-v14 .hj-product-summary-list small {
  color: var(--hj-ink-400);
  font-size: 8.5px;
}

.hj-experience-v14 .hj-product-summary-list i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #20be7a;
}

.hj-experience-v14 .hj-support-card {
  position: relative;
  overflow: hidden;
}

.hj-experience-v14 .hj-support-card::after {
  content: '';
  position: absolute;
  width: 110px;
  height: 110px;
  right: -55px;
  top: -55px;
  border-radius: 50%;
  background: var(--hj-lime-soft);
  opacity: .48;
}

.hj-experience-v14 .hj-support-card-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #f0f2f1;
  color: var(--hj-forest);
}

.hj-experience-v14 .hj-support-card-icon svg {
  width: 16px;
  height: 16px;
}

.hj-experience-v14 .hj-support-card h2 {
  margin-top: 14px;
  font-size: 13px;
}

.hj-experience-v14 .hj-support-card p {
  margin: 6px 0 15px;
  color: var(--hj-ink-500);
  font-size: 9.5px;
  line-height: 1.55;
}

.hj-experience-v14 .hj-renewal-balance {
  padding: 12px 0 14px;
  border-top: 1px solid #edf0ee;
  border-bottom: 1px solid #edf0ee;
}

.hj-experience-v14 .hj-renewal-balance span,
.hj-experience-v14 .hj-renewal-next span {
  display: block;
  color: var(--hj-ink-400);
  font-size: 8.5px;
}

.hj-experience-v14 .hj-renewal-balance strong {
  display: block;
  margin-top: 4px;
  color: var(--hj-text);
  font-size: 20px;
  letter-spacing: -.04em;
}

.hj-experience-v14 .hj-renewal-next {
  padding: 13px 0;
}

.hj-experience-v14 .hj-renewal-next strong {
  display: block;
  margin-top: 4px;
  color: var(--hj-text);
  font-size: 10px;
}

.hj-experience-v14 .hj-renewal-next small {
  display: block;
  margin-top: 3px;
  color: var(--hj-ink-400);
  font-size: 8.5px;
}

.hj-experience-v14 .hj-service-status-card {
  padding: 14px 16px;
  background: #fbfcfb;
}

.hj-experience-v14 .hj-service-status-card > div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.hj-experience-v14 .hj-service-status-card > div strong {
  font-size: 10px;
}

.hj-experience-v14 .hj-live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #20be7a;
  box-shadow: 0 0 0 4px #e7f8ef;
}

.hj-experience-v14 .hj-service-status-card p {
  margin: 7px 0 10px;
  color: var(--hj-ink-500);
  font-size: 9px;
}

.hj-experience-v14 .hj-setup-progress {
  padding: 16px 18px;
}

.hj-experience-v14 .hj-setup-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.hj-experience-v14 .hj-setup-progress-head span,
.hj-experience-v14 .hj-setup-progress-head small {
  display: block;
  color: var(--hj-ink-400);
  font-size: 8.5px;
}

.hj-experience-v14 .hj-setup-progress-head strong {
  display: block;
  margin: 3px 0;
  font-size: 11px;
}

.hj-experience-v14 .hj-setup-progress-head b {
  color: var(--hj-forest);
  font-size: 17px;
}

.hj-experience-v14 .hj-progress-track {
  height: 5px;
  margin-top: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #edf0ee;
}

.hj-experience-v14 .hj-progress-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--hj-forest), var(--hj-lime));
}

/* Generic customer pages */
.hj-experience-v14 .hj-page-grid {
  gap: 17px;
}

.hj-experience-v14 .hj-page-grid-2 {
  grid-template-columns: minmax(0, 1.55fr) minmax(300px, .8fr);
}

.hj-experience-v14 .hj-copy {
  color: var(--hj-ink-500);
  font-size: 10px;
  line-height: 1.6;
}

.hj-experience-v14 .hj-eyebrow,
.hj-experience-v14 .hj-panel-kicker {
  color: var(--hj-emerald);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.hj-experience-v14 .hj-service-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
  gap: 13px;
}

.hj-experience-v14 .hj-service-card {
  padding: 16px;
  border: 1px solid var(--hj-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: none;
}

.hj-experience-v14 .hj-service-card:hover {
  border-color: #ced5d1;
  box-shadow: 0 10px 25px rgba(20,30,25,.05);
}

.hj-experience-v14 .hj-service-card.is-selected {
  border-color: rgba(21,147,106,.45);
  box-shadow: 0 0 0 2px rgba(21,147,106,.08);
}

.hj-experience-v14 .hj-service-card-head h3 {
  font-size: 13px;
}

.hj-experience-v14 .hj-service-card-head p {
  color: var(--hj-ink-400);
  font-size: 9.5px;
}

.hj-experience-v14 .hj-service-meta-grid,
.hj-experience-v14 .hj-settings-grid,
.hj-experience-v14 .hj-readiness-grid {
  gap: 9px;
}

.hj-experience-v14 .hj-service-meta-grid > div,
.hj-experience-v14 .hj-settings-grid > div,
.hj-experience-v14 .hj-readiness-grid > div {
  padding: 12px;
  border: 1px solid #e8ebe9;
  border-radius: 9px;
  background: #fafbfb;
}

.hj-experience-v14 .hj-service-meta-grid span,
.hj-experience-v14 .hj-settings-grid span,
.hj-experience-v14 .hj-readiness-grid span {
  color: var(--hj-ink-400);
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.hj-experience-v14 .hj-service-meta-grid strong,
.hj-experience-v14 .hj-settings-grid strong,
.hj-experience-v14 .hj-readiness-grid strong {
  margin-top: 5px;
  color: var(--hj-text);
  font-size: 10px;
}

.hj-experience-v14 .hj-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--hj-line);
  border-radius: 10px;
  background: #fff;
}

.hj-experience-v14 .hj-table,
.hj-experience-v14 .hj-file-table,
.hj-experience-v14 .hj-native-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.hj-experience-v14 .hj-table th,
.hj-experience-v14 .hj-file-table th,
.hj-experience-v14 .hj-native-table th {
  height: 42px;
  padding: 0 12px;
  border-bottom: 1px solid var(--hj-line);
  background: #f8f9f9;
  color: #7b837e;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.hj-experience-v14 .hj-table td,
.hj-experience-v14 .hj-file-table td,
.hj-experience-v14 .hj-native-table td {
  padding: 12px;
  border-bottom: 1px solid #edf0ee;
  color: #3d4540;
  font-size: 9.5px;
  vertical-align: middle;
}

.hj-experience-v14 .hj-table tbody tr:hover,
.hj-experience-v14 .hj-file-table tbody tr:hover,
.hj-experience-v14 .hj-native-table tbody tr:hover {
  background: #fbfcfc;
}

.hj-experience-v14 .hj-table-icon,
.hj-experience-v14 .hj-mini-icon,
.hj-experience-v14 .hj-side-item-icon {
  background: #eef1ef;
  color: var(--hj-forest);
}

.hj-experience-v14 .hj-row-actions {
  gap: 6px;
}

.hj-experience-v14 .hj-row-actions a,
.hj-experience-v14 .hj-link-button {
  min-height: 30px;
  padding: 0 10px;
  border: 1px solid var(--hj-line);
  border-radius: 7px;
  background: #fff;
  color: var(--hj-text);
  font-size: 8.5px;
  font-weight: 550;
  text-decoration: none;
}

.hj-experience-v14 .hj-row-actions a:first-child {
  border-color: var(--hj-forest);
  background: var(--hj-forest);
  color: #fff;
}

.hj-experience-v14 .hj-row-actions a:hover,
.hj-experience-v14 .hj-link-button:hover {
  border-color: #cdd3cf;
  background: #f7f8f8;
}

.hj-experience-v14 .hj-row-actions a:first-child:hover {
  border-color: var(--hj-forest-dark);
  background: var(--hj-forest-dark);
  color: #fff;
}

.hj-experience-v14 .hj-pill {
  min-height: 20px;
  padding: 0 8px;
  border: 0;
  border-radius: 999px;
  font-size: 7.5px;
  font-weight: 650;
  letter-spacing: .02em;
  text-transform: capitalize;
}

.hj-experience-v14 .hj-pill::before {
  width: 5px;
  height: 5px;
}

.hj-experience-v14 .hj-primary-button,
.hj-experience-v14 button[type="submit"],
.hj-experience-v14 input[type="submit"] {
  min-height: 40px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--hj-forest);
  border-radius: 8px;
  background: var(--hj-forest);
  color: #fff;
  box-shadow: none;
  font-size: 9.5px;
  font-weight: 600;
  text-decoration: none;
}

.hj-experience-v14 .hj-primary-button:hover,
.hj-experience-v14 button[type="submit"]:hover,
.hj-experience-v14 input[type="submit"]:hover {
  border-color: var(--hj-forest-dark);
  background: var(--hj-forest-dark);
  color: #fff;
  box-shadow: none;
}

.hj-experience-v14 .hj-secondary-button {
  min-height: 40px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--hj-line-strong);
  border-radius: 8px;
  background: #fff;
  color: var(--hj-text);
  box-shadow: none;
  font-size: 9.5px;
  font-weight: 550;
  text-decoration: none;
}

.hj-experience-v14 .hj-secondary-button:hover {
  border-color: #bec6c1;
  background: #f8f9f9;
  color: var(--hj-text);
}

.hj-experience-v14 .hj-primary-button svg,
.hj-experience-v14 .hj-secondary-button svg {
  width: 14px;
  height: 14px;
}

.hj-experience-v14 input[type="text"],
.hj-experience-v14 input[type="email"],
.hj-experience-v14 input[type="password"],
.hj-experience-v14 input[type="number"],
.hj-experience-v14 input[type="url"],
.hj-experience-v14 input[type="search"],
.hj-experience-v14 select,
.hj-experience-v14 textarea {
  min-height: 41px;
  border: 1px solid var(--hj-line-strong);
  border-radius: 8px;
  background: #fff;
  color: var(--hj-text);
  box-shadow: none;
  font-size: 10px;
}

.hj-experience-v14 textarea {
  min-height: 112px;
}

.hj-experience-v14 input:focus,
.hj-experience-v14 select:focus,
.hj-experience-v14 textarea:focus {
  border-color: rgba(21,147,106,.58);
  box-shadow: var(--hj-focus);
}

.hj-experience-v14 .hj-form label,
.hj-experience-v14 .hj-field label {
  color: #555d58;
  font-size: 9px;
  font-weight: 600;
}

.hj-experience-v14 .hj-empty {
  padding: 28px 18px;
  border: 1px dashed #dfe4e1;
  border-radius: 10px;
  background: #fafbfb;
}

.hj-experience-v14 .hj-empty h3 {
  font-size: 12px;
}

.hj-experience-v14 .hj-empty p {
  margin-top: 5px;
  color: var(--hj-ink-500);
  font-size: 9.5px;
}

.hj-experience-v14 .hj-task-item,
.hj-experience-v14 .hj-side-item,
.hj-experience-v14 .hj-mini-item,
.hj-experience-v14 .hj-data-row,
.hj-experience-v14 .hj-tool-section,
.hj-experience-v14 .hj-action-card {
  border-color: var(--hj-line);
  border-radius: 10px;
  background: #fbfcfc;
}

.hj-experience-v14 .hj-action-grid,
.hj-experience-v14 .hj-tool-grid,
.hj-experience-v14 .hj-native-tool-grid {
  gap: 11px;
}

.hj-experience-v14 .hj-action-grid a,
.hj-experience-v14 .hj-tool-card,
.hj-experience-v14 .hj-native-tool-card {
  border: 1px solid var(--hj-line);
  border-radius: 10px;
  background: #fff;
  box-shadow: none;
}

.hj-experience-v14 .hj-action-grid a:hover,
.hj-experience-v14 .hj-tool-card:hover,
.hj-experience-v14 .hj-native-tool-card:hover {
  border-color: #ced5d1;
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(20,30,25,.045);
}

/* PHP extension controls stay clearly interactive. */
.hj-experience-v14 .hj-extension-item,
.hj-experience-v14 .hj-selector-extension,
.hj-experience-v14 .hj-cloudlinux-extension,
.hj-experience-v14 .hj-php-extension-item {
  min-height: 48px;
  border: 1px solid var(--hj-line) !important;
  border-radius: 9px !important;
  background: #fff !important;
  cursor: pointer !important;
}

.hj-experience-v14 .hj-extension-item:hover,
.hj-experience-v14 .hj-selector-extension:hover,
.hj-experience-v14 .hj-cloudlinux-extension:hover,
.hj-experience-v14 .hj-php-extension-item:hover {
  transform: none;
  border-color: rgba(21,147,106,.44) !important;
  background: #f8fcfa !important;
  box-shadow: none;
}

.hj-experience-v14 input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  accent-color: var(--hj-emerald);
  cursor: pointer;
}

/* Login */
.hj-login-screen {
  background: #eef0f2;
}

.hj-login-card {
  border: 1px solid rgba(201,222,76,.72);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(24,33,28,.10);
}

/* Responsive */
@media (max-width: 1220px) {
  .hj-experience-v14 {
    width: calc(100% - 16px);
    min-height: calc(100vh - 16px);
    margin: 8px auto;
  }
  .hj-experience-v14 .hj-sidebar {
    height: calc(100vh - 18px);
  }
  .hj-experience-v14 .hj-customer-dashboard-grid {
    grid-template-columns: minmax(0, 1fr) 250px;
  }
  .hj-experience-v14 .hj-product-row {
    grid-template-columns: 38px minmax(0, 1fr) auto;
  }
  .hj-experience-v14 .hj-product-row-status {
    display: none;
  }
}

@media (max-width: 1020px) {
  .hj-experience-v14 .hj-sidebar {
    position: fixed;
    inset: 8px auto 8px 8px;
    width: min(280px, calc(100vw - 32px));
    height: calc(100dvh - 16px);
    border: 1px solid var(--hj-line);
    border-radius: 14px;
    transform: translateX(-110%);
    transition: transform .22s ease;
    box-shadow: var(--hj-shadow-pop);
    z-index: 1002;
  }
  .hj-experience-v14.hj-sidebar-open .hj-sidebar {
    transform: translateX(0);
  }
  .hj-experience-v14 .hj-mobile-nav-toggle {
    display: block;
  }
  .hj-experience-v14 .hj-topbar-profile {
    min-width: 42px;
    width: 42px;
    padding: 3px;
  }
  .hj-experience-v14 .hj-topbar-profile > span:not(.hj-user-avatar) {
    display: none;
  }
  .hj-experience-v14 .hj-topbar-text-link,
  .hj-experience-v14 .hj-topbar-divider {
    display: none;
  }
  .hj-experience-v14 .hj-customer-dashboard-grid {
    grid-template-columns: 1fr;
  }
  .hj-experience-v14 .hj-dashboard-side-column {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .hj-experience-v14 .hj-manage-products-card {
    grid-row: span 2;
  }
  .hj-experience-v14 .hj-page-grid-2 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .hj-experience-v14 {
    width: 100%;
    min-height: 100vh;
    margin: 0;
    border: 0;
    border-radius: 0;
  }
  .hj-experience-v14 .hj-main {
    padding: 0 14px 28px;
  }
  .hj-experience-v14 .hj-topbar {
    min-height: 68px;
    margin: 0 -14px;
    padding: 10px 14px;
  }
  .hj-experience-v14 .hj-command-search {
    width: 100%;
    min-width: 0;
  }
  .hj-experience-v14 .hj-command-search kbd,
  .hj-experience-v14 .hj-topbar-right .hj-icon-button:not(.hj-notification-button) {
    display: none;
  }
  .hj-experience-v14 .hj-dashboard-welcome {
    padding: 22px 0 18px;
    align-items: flex-start;
    flex-direction: column;
  }
  .hj-experience-v14 .hj-dashboard-welcome h1 {
    font-size: 32px;
  }
  .hj-experience-v14 .hj-dashboard-welcome-actions {
    width: 100%;
  }
  .hj-experience-v14 .hj-dashboard-welcome-actions a {
    flex: 1;
  }
  .hj-experience-v14 .hj-product-tabs {
    gap: 20px;
  }
  .hj-experience-v14 .hj-product-row {
    grid-template-columns: 36px minmax(0, 1fr);
    padding: 11px;
  }
  .hj-experience-v14 .hj-product-row-actions {
    grid-column: 1 / -1;
    justify-content: stretch;
  }
  .hj-experience-v14 .hj-product-row-actions a {
    flex: 1;
  }
  .hj-experience-v14 .hj-dashboard-feed-grid,
  .hj-experience-v14 .hj-dashboard-side-column {
    grid-template-columns: 1fr;
  }
  .hj-experience-v14 .hj-manage-products-card {
    grid-row: auto;
  }
  .hj-experience-v14 .hj-page-title-row h1 {
    font-size: 28px;
  }
  .hj-experience-v14 .hj-table,
  .hj-experience-v14 .hj-file-table,
  .hj-experience-v14 .hj-native-table {
    min-width: 720px;
  }
}

@media (max-width: 480px) {
  .hj-experience-v14 .hj-topbar-right {
    gap: 2px;
  }
  .hj-experience-v14 .hj-notification-button {
    display: none;
  }
  .hj-experience-v14 .hj-dashboard-welcome-actions {
    flex-direction: column;
  }
  .hj-experience-v14 .hj-dashboard-welcome-actions a {
    width: 100%;
  }
  .hj-experience-v14 .hj-product-tabs {
    padding: 0 13px;
  }
  .hj-experience-v14 .hj-product-hub-head {
    padding: 15px 13px 10px;
  }
  .hj-experience-v14 .hj-product-list {
    padding: 0 10px 12px;
  }
}

/* Customer-facing surfaces hide internal transport diagnostics while keeping all controls operational. */
.hj-experience-v14 .hj-halo-agent-card,
.hj-experience-v14 .hj-php-advanced-grid .hj-sticky-action-panel,
.hj-experience-v14 .hj-redis-agent-panel,
.hj-experience-v14 .hj-redis-about-panel,
.hj-experience-v14 .hj-private-engine-strip,
.hj-experience-v14 .hj-native-adapter-note {
  display: none !important;
}

.hj-experience-v14 .hj-php-advanced-grid {
  grid-template-columns: 1fr;
}

.hj-experience-v14 .hj-php-hero,
.hj-experience-v14 .hj-redis-hero,
.hj-experience-v14 .hj-database-hero,
.hj-experience-v14 .hj-wordpress-hero {
  border-left: 3px solid var(--hj-lime);
}

.hj-experience-v14 .hj-cloudlinux-selector-panel,
.hj-experience-v14 .hj-php-runtime-panel,
.hj-experience-v14 .hj-redis-service-card {
  border-color: #dfe4e1;
  background: #fff;
}

/* ==========================================================================
   HostingJet 0.15.0 — Guided Service Studio
   Customer-first service management. Human goals first; expert controls later.
   ========================================================================== */

.hj-experience-v15 {
  --hj-v15-canvas: #f4f6f3;
  --hj-v15-surface: #ffffff;
  --hj-v15-surface-soft: #f8faf7;
  --hj-v15-ink: #101713;
  --hj-v15-muted: #66716b;
  --hj-v15-line: #e1e7e2;
  --hj-v15-line-strong: #cfd8d1;
  --hj-v15-forest: #0b332a;
  --hj-v15-forest-2: #124b3d;
  --hj-v15-emerald: #0b8f66;
  --hj-v15-lime: #dfff45;
  --hj-v15-lime-soft: #f2ffd0;
  --hj-v15-good: #0b8f66;
  --hj-v15-warning: #b27400;
  --hj-v15-danger: #c94343;
  --hj-v15-radius: 16px;
  --hj-v15-radius-lg: 24px;
  --hj-v15-shadow: 0 1px 1px rgba(11, 37, 29, .03), 0 12px 30px rgba(11, 37, 29, .05);
  width: 100%;
  min-height: 100vh;
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  background: var(--hj-v15-canvas);
  color: var(--hj-v15-ink);
  font-size: 14px;
  overflow: visible;
}

.hj-experience-v15.hj-shell-embedded {
  min-height: 960px;
  border: 1px solid var(--hj-v15-line);
  border-radius: 22px;
  overflow: hidden;
}

.hj-experience-v15 .hj-sidebar {
  position: sticky;
  top: 0;
  width: 248px;
  height: 100vh;
  padding: 24px 18px 18px;
  display: flex;
  align-items: stretch;
  gap: 18px;
  background: rgba(255,255,255,.98);
  border-right: 1px solid var(--hj-v15-line);
  color: var(--hj-v15-ink);
  overflow: auto;
  box-shadow: none;
}

.hj-experience-v15.hj-shell-embedded .hj-sidebar { height: 100%; min-height: 960px; }

.hj-experience-v15 .hj-sidebar-brand-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  padding: 0 8px;
}

.hj-experience-v15 .hj-sidebar-brand {
  width: auto;
  height: auto;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 11px;
  text-decoration: none;
}

.hj-experience-v15 .hj-brand-mark {
  width: 34px;
  height: 34px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
  transform: skew(-11deg);
}

.hj-experience-v15 .hj-brand-mark i {
  display: block;
  border-radius: 5px 2px;
  background: linear-gradient(180deg, var(--hj-v15-forest) 0%, var(--hj-v15-emerald) 100%);
}

.hj-experience-v15 .hj-brand-mark i:nth-child(2) { transform: translateY(6px); }
.hj-experience-v15 .hj-brand-mark i:nth-child(3) { transform: translateY(-3px); }

.hj-experience-v15 .hj-brand-copy { display: grid; gap: 1px; }
.hj-experience-v15 .hj-brand-copy strong { font-size: 18px; letter-spacing: -.045em; color: var(--hj-v15-ink); }
.hj-experience-v15 .hj-brand-copy small { font-size: 10px; color: var(--hj-v15-muted); text-transform: uppercase; letter-spacing: .12em; font-weight: 700; }

.hj-experience-v15 .hj-sidebar-nav {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
}

.hj-experience-v15 .hj-nav-section {
  display: block;
  margin: 16px 10px 6px;
  color: #97a19b;
  font-size: 10px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.hj-experience-v15 .hj-nav-section:first-child { margin-top: 0; }

.hj-experience-v15 .hj-sidebar-nav a {
  width: 100%;
  height: 44px;
  padding: 0 11px;
  display: grid;
  grid-template-columns: 21px minmax(0, 1fr) 14px;
  align-items: center;
  justify-content: stretch;
  gap: 10px;
  color: #39443e;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  text-decoration: none;
  font-weight: 550;
  transition: background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease;
}

.hj-experience-v15 .hj-sidebar-nav a::after { display: none !important; }
.hj-experience-v15 .hj-sidebar-nav a::before { display: none !important; }
.hj-experience-v15 .hj-sidebar-nav a:hover { color: var(--hj-v15-forest); background: #f2f5f2; transform: translateX(2px); }
.hj-experience-v15 .hj-sidebar-nav a.is-active {
  color: var(--hj-v15-forest);
  background: linear-gradient(90deg, rgba(223,255,69,.34), rgba(223,255,69,.08));
  border-color: rgba(181, 211, 35, .38);
  box-shadow: inset 3px 0 0 var(--hj-v15-lime);
}

.hj-experience-v15 .hj-nav-icon { width: 21px; height: 21px; display: grid; place-items: center; }
.hj-experience-v15 .hj-nav-icon svg { width: 19px; height: 19px; }
.hj-experience-v15 .hj-nav-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-experience-v15 .hj-nav-cue { color: #a4ada7; font-size: 17px; text-align: right; }

.hj-experience-v15 .hj-sidebar-product {
  margin-top: auto;
  padding: 15px;
  display: grid;
  gap: 5px;
  border: 1px solid var(--hj-v15-line);
  border-radius: 14px;
  background:
    radial-gradient(circle at 100% 0, rgba(223,255,69,.34), transparent 46%),
    linear-gradient(145deg, #fbfdf8 0%, #f3f7f2 100%);
}

.hj-experience-v15 .hj-sidebar-product-label { color: var(--hj-v15-muted); font-size: 10px; text-transform: uppercase; letter-spacing: .1em; font-weight: 800; }
.hj-experience-v15 .hj-sidebar-product strong { font-size: 13px; color: var(--hj-v15-ink); }
.hj-experience-v15 .hj-sidebar-product small { color: var(--hj-v15-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-experience-v15 .hj-sidebar-product-foot { margin-top: 7px; display: flex; align-items: center; justify-content: space-between; }
.hj-experience-v15 .hj-sidebar-product-foot a { color: var(--hj-v15-forest); font-size: 12px; font-weight: 800; text-decoration: none; }

.hj-experience-v15 .hj-sidebar-user {
  width: 100%;
  height: auto;
  min-height: 54px;
  margin: 0;
  padding: 8px 9px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 14px;
  align-items: center;
  justify-content: stretch;
  gap: 9px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: var(--hj-v15-ink);
  text-decoration: none;
}

.hj-experience-v15 .hj-sidebar-user:hover { background: #f5f7f5; border-color: var(--hj-v15-line); }
.hj-experience-v15 .hj-user-avatar { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--hj-v15-forest); color: #fff; font-weight: 800; }
.hj-experience-v15 .hj-user-copy { display: grid; gap: 1px; min-width: 0; }
.hj-experience-v15 .hj-user-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-experience-v15 .hj-user-copy small { color: var(--hj-v15-muted); font-size: 11px; }

.hj-experience-v15 .hj-main {
  min-width: 0;
  overflow: visible;
  padding: 0 28px 46px;
  background:
    radial-gradient(circle at 78% 0, rgba(223,255,69,.07), transparent 26%),
    var(--hj-v15-canvas);
}

.hj-experience-v15 .hj-main > *:not(.hj-topbar) { max-width: 1480px; margin-left: auto; margin-right: auto; }

.hj-experience-v15 .hj-topbar {
  position: sticky;
  top: 0;
  z-index: 80;
  min-height: 72px;
  margin: 0 -28px;
  padding: 10px 28px;
  border: 0;
  border-bottom: 1px solid rgba(213, 221, 215, .88);
  border-radius: 0;
  background: rgba(250, 252, 249, .92);
  backdrop-filter: blur(18px);
  box-shadow: none;
  flex-wrap: nowrap;
}

.hj-experience-v15 .hj-command-search {
  width: min(620px, 52vw);
  min-height: 44px;
  border: 1px solid var(--hj-v15-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16, 45, 35, .03);
}
.hj-experience-v15 .hj-command-search:focus-within { border-color: rgba(11,143,102,.45); box-shadow: 0 0 0 3px rgba(11,143,102,.08); }
.hj-experience-v15 .hj-command-search input { color: var(--hj-v15-ink); }
.hj-experience-v15 .hj-command-search kbd { border: 0; background: #f2f5f2; color: #7a857e; }

.hj-experience-v15 .hj-topbar-right { gap: 8px; flex-wrap: nowrap; }
.hj-experience-v15 .hj-topbar-text-link { color: var(--hj-v15-ink); font-weight: 650; text-decoration: none; }
.hj-experience-v15 .hj-icon-button { border: 1px solid var(--hj-v15-line); background: #fff; color: #344039; box-shadow: none; }
.hj-experience-v15 .hj-icon-button:hover { color: var(--hj-v15-forest); border-color: var(--hj-v15-line-strong); background: #f8faf8; }
.hj-experience-v15 .hj-topbar-profile { min-width: 180px; padding: 5px 7px; border: 1px solid transparent; border-radius: 12px; text-decoration: none; }
.hj-experience-v15 .hj-topbar-profile:hover { border-color: var(--hj-v15-line); background: #fff; }
.hj-experience-v15 .hj-topbar-profile strong { color: var(--hj-v15-ink); }
.hj-experience-v15 .hj-topbar-profile small { color: var(--hj-v15-muted); }

.hj-experience-v15 .hj-breadcrumbs { margin-top: 20px; margin-bottom: 7px; color: #87918b; font-size: 12px; }
.hj-experience-v15 .hj-breadcrumbs a { color: #66716b; text-decoration: none; }
.hj-experience-v15 .hj-breadcrumbs a:hover { color: var(--hj-v15-emerald); }
.hj-experience-v15 .hj-page-title-row { padding: 4px 0 18px; border: 0; background: transparent; box-shadow: none; }
.hj-experience-v15 .hj-page-eyebrow,
.hj-experience-v15 .hj-section-kicker { display: block; margin-bottom: 5px; color: var(--hj-v15-emerald); font-size: 10px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.hj-experience-v15 .hj-page-heading h1 { font-size: clamp(28px, 3vw, 42px); line-height: 1.05; letter-spacing: -.055em; color: var(--hj-v15-ink); }
.hj-experience-v15 .hj-page-subtitle { max-width: 720px; margin-top: 8px; color: var(--hj-v15-muted); font-size: 14px; }
.hj-experience-v15 .hj-page-context:empty { display: none; }

.hj-experience-v15 .hj-panel {
  border: 1px solid var(--hj-v15-line);
  border-radius: var(--hj-v15-radius);
  background: var(--hj-v15-surface);
  box-shadow: var(--hj-v15-shadow);
}
.hj-experience-v15 .hj-panel-head h2 { font-size: 16px; letter-spacing: -.025em; }
.hj-experience-v15 .hj-panel-head p { color: var(--hj-v15-muted); }

.hj-experience-v15 .hj-primary-button {
  min-height: 42px;
  padding: 0 17px;
  border: 1px solid var(--hj-v15-forest);
  border-radius: 10px;
  background: var(--hj-v15-forest);
  color: #fff !important;
  box-shadow: 0 7px 16px rgba(11,51,42,.14);
  font-weight: 750;
}
.hj-experience-v15 .hj-primary-button:hover { background: #0e4034; transform: translateY(-1px); }
.hj-experience-v15 .hj-secondary-button {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid var(--hj-v15-line-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--hj-v15-ink) !important;
  font-weight: 700;
}
.hj-experience-v15 .hj-secondary-button:hover { background: #f7f9f7; border-color: #bfcac2; }

/* Dashboard: reference-led but cleaner, with strong product priority. */
.hj-experience-v15 .hj-dashboard-welcome { padding: 34px 0 24px; }
.hj-experience-v15 .hj-dashboard-welcome h1 { font-size: clamp(34px, 4vw, 52px); line-height: 1.02; letter-spacing: -.06em; }
.hj-experience-v15 .hj-dashboard-welcome p { margin-top: 10px; color: var(--hj-v15-muted); font-size: 15px; }
.hj-experience-v15 .hj-dashboard-kicker { color: var(--hj-v15-emerald); }
.hj-experience-v15 .hj-customer-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; align-items: start; }
.hj-experience-v15 .hj-dashboard-primary-column,
.hj-experience-v15 .hj-dashboard-side-column { gap: 18px; }
.hj-experience-v15 .hj-product-hub { overflow: hidden; }
.hj-experience-v15 .hj-product-tabs { min-height: 54px; padding: 0 18px; border-bottom: 1px solid var(--hj-v15-line); background: #fff; }
.hj-experience-v15 .hj-product-tabs a { min-height: 54px; color: #69746d; font-weight: 650; }
.hj-experience-v15 .hj-product-tabs a.is-active { color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-product-tabs a.is-active::after { height: 3px; background: var(--hj-v15-lime); }
.hj-experience-v15 .hj-product-row { border: 1px solid var(--hj-v15-line); border-radius: 12px; background: #fff; }
.hj-experience-v15 .hj-product-row:hover { border-color: #cbd5cd; box-shadow: 0 10px 22px rgba(16,45,35,.06); }
.hj-experience-v15 .hj-product-row-actions .is-primary { background: var(--hj-v15-forest); color: #fff; }
.hj-experience-v15 .hj-dashboard-feed-grid { gap: 18px; }
.hj-experience-v15 .hj-manage-products-card,
.hj-experience-v15 .hj-support-card,
.hj-experience-v15 .hj-renewal-card,
.hj-experience-v15 .hj-service-status-card { box-shadow: none; }

/* Compact service workspace appears on every service page. */
.hj-experience-v15 .hj-service-workspace-bar {
  margin-bottom: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "identity controls" "tabs tabs";
  align-items: center;
  gap: 14px 20px;
  padding: 15px 16px 0;
  border: 1px solid var(--hj-v15-line);
  border-radius: 16px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 8px 26px rgba(11,37,29,.04);
}
.hj-experience-v15 .hj-service-workspace-identity { grid-area: identity; min-width: 0; display: flex; align-items: center; gap: 11px; }
.hj-experience-v15 .hj-service-workspace-mark { width: 40px; height: 40px; flex: 0 0 40px; display: grid; place-items: center; border-radius: 11px; background: var(--hj-v15-lime-soft); color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-service-workspace-mark svg { width: 20px; height: 20px; }
.hj-experience-v15 .hj-service-workspace-identity > span:nth-child(2) { min-width: 0; display: grid; grid-template-columns: auto 1fr; column-gap: 9px; align-items: baseline; }
.hj-experience-v15 .hj-service-workspace-identity small { grid-column: 1 / -1; color: #8a948e; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.hj-experience-v15 .hj-service-workspace-identity strong { color: var(--hj-v15-ink); font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-experience-v15 .hj-service-workspace-identity em { color: var(--hj-v15-muted); font-size: 11px; font-style: normal; white-space: nowrap; }
.hj-experience-v15 .hj-service-workspace-controls { grid-area: controls; display: flex; align-items: center; gap: 9px; }
.hj-experience-v15 .hj-service-workspace-select { display: grid; gap: 3px; }
.hj-experience-v15 .hj-service-workspace-select span { display: none; }
.hj-experience-v15 .hj-service-workspace-select select { min-width: 190px; height: 38px; padding: 0 34px 0 11px; border: 1px solid var(--hj-v15-line); border-radius: 9px; background: #fff; color: var(--hj-v15-ink); }
.hj-experience-v15 .hj-service-visit { height: 38px; padding: 0 12px; display: inline-flex; align-items: center; gap: 7px; border-radius: 9px; background: var(--hj-v15-forest); color: #fff !important; text-decoration: none; font-size: 12px; font-weight: 750; }
.hj-experience-v15 .hj-service-visit svg { width: 15px; height: 15px; }
.hj-experience-v15 .hj-service-workspace-tabs { grid-area: tabs; display: flex; align-items: stretch; gap: 4px; overflow-x: auto; }
.hj-experience-v15 .hj-service-workspace-tabs a { position: relative; min-width: 92px; height: 46px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; color: #66716b; text-decoration: none; white-space: nowrap; font-size: 12px; font-weight: 700; }
.hj-experience-v15 .hj-service-workspace-tabs a span { width: 17px; height: 17px; }
.hj-experience-v15 .hj-service-workspace-tabs svg { width: 17px; height: 17px; }
.hj-experience-v15 .hj-service-workspace-tabs a:hover { color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-service-workspace-tabs a.is-active { color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-service-workspace-tabs a.is-active::after { content: ''; position: absolute; left: 11px; right: 11px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--hj-v15-lime); }

/* The old per-panel switchers are replaced by the single service workspace bar. */
.hj-experience-v15 .hj-service-switcher { display: none !important; }

/* Guided Service Studio */
.hj-experience-v15 .hj-service-studio { display: grid; gap: 18px; }
.hj-experience-v15 .hj-service-hero-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  padding: 26px;
  border: 1px solid #cfd8d1;
  border-radius: 22px;
  background:
    radial-gradient(circle at 84% 24%, rgba(223,255,69,.42), transparent 25%),
    radial-gradient(circle at 68% 100%, rgba(11,143,102,.10), transparent 30%),
    linear-gradient(145deg, #ffffff 0%, #f7faf6 100%);
  box-shadow: 0 18px 48px rgba(11,37,29,.08);
}
.hj-experience-v15 .hj-service-hero-card::after { content: ''; position: absolute; width: 230px; height: 230px; right: -70px; top: -100px; border: 1px solid rgba(11,51,42,.08); border-radius: 50%; box-shadow: 0 0 0 30px rgba(255,255,255,.24), 0 0 0 60px rgba(255,255,255,.18); pointer-events: none; }
.hj-experience-v15 .hj-service-hero-main { display: flex; align-items: flex-start; gap: 16px; min-width: 0; }
.hj-experience-v15 .hj-service-hero-icon { width: 54px; height: 54px; flex: 0 0 54px; display: grid; place-items: center; border-radius: 15px; background: var(--hj-v15-forest); color: var(--hj-v15-lime); box-shadow: 0 12px 24px rgba(11,51,42,.16); }
.hj-experience-v15 .hj-service-hero-icon svg { width: 26px; height: 26px; }
.hj-experience-v15 .hj-service-hero-copy { min-width: 0; }
.hj-experience-v15 .hj-service-hero-copy > span { color: var(--hj-v15-emerald); font-size: 10px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.hj-experience-v15 .hj-service-hero-copy h2 { margin-top: 5px; font-size: clamp(27px, 3vw, 40px); line-height: 1.05; letter-spacing: -.055em; overflow-wrap: anywhere; }
.hj-experience-v15 .hj-service-hero-copy p { margin-top: 7px; color: var(--hj-v15-muted); }
.hj-experience-v15 .hj-service-hero-badges { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 7px; }
.hj-experience-v15 .hj-service-hero-badges span { min-height: 28px; padding: 0 10px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(11,51,42,.10); border-radius: 999px; background: rgba(255,255,255,.68); color: #4c5951; font-size: 11px; font-weight: 700; }
.hj-experience-v15 .hj-service-hero-badges span.is-good { color: #087754; }
.hj-experience-v15 .hj-service-hero-badges span.is-warning { color: var(--hj-v15-warning); }
.hj-experience-v15 .hj-service-hero-badges i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(11,143,102,.09); }
.hj-experience-v15 .hj-service-hero-badges svg { width: 14px; height: 14px; }
.hj-experience-v15 .hj-service-hero-actions { position: relative; z-index: 1; display: flex; align-items: flex-start; gap: 9px; }
.hj-experience-v15 .hj-service-hero-actions svg { width: 16px; height: 16px; }
.hj-experience-v15 .hj-service-vitals { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid rgba(11,51,42,.08); border-radius: 14px; background: rgba(255,255,255,.72); backdrop-filter: blur(10px); }
.hj-experience-v15 .hj-service-vitals > div { min-width: 0; padding: 14px 16px; display: grid; gap: 2px; border-right: 1px solid rgba(11,51,42,.08); }
.hj-experience-v15 .hj-service-vitals > div:last-child { border-right: 0; }
.hj-experience-v15 .hj-service-vitals span { color: #7b867f; font-size: 10px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
.hj-experience-v15 .hj-service-vitals strong { color: var(--hj-v15-ink); font-size: 18px; letter-spacing: -.03em; }
.hj-experience-v15 .hj-service-vitals small { color: var(--hj-v15-muted); font-size: 11px; }

.hj-experience-v15 .hj-service-studio-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; align-items: start; }
.hj-experience-v15 .hj-service-studio-primary,
.hj-experience-v15 .hj-service-studio-side { display: grid; gap: 18px; }
.hj-experience-v15 .hj-intent-launcher,
.hj-experience-v15 .hj-service-journey-card { padding: 20px; }
.hj-experience-v15 .hj-intent-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.hj-experience-v15 .hj-intent-grid > a {
  min-height: 176px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border: 1px solid var(--hj-v15-line);
  border-radius: 14px;
  background: #fbfcfb;
  color: var(--hj-v15-ink);
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.hj-experience-v15 .hj-intent-grid > a:hover { transform: translateY(-3px); border-color: #c6d2c9; background: #fff; box-shadow: 0 14px 28px rgba(11,37,29,.08); }
.hj-experience-v15 .hj-intent-icon { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 11px; background: #eef3ef; color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-intent-icon svg { width: 20px; height: 20px; }
.hj-experience-v15 .hj-intent-icon.is-website { background: #e9f8f0; color: #087a57; }
.hj-experience-v15 .hj-intent-icon.is-mail { background: #edf0ff; color: #4d5ab7; }
.hj-experience-v15 .hj-intent-icon.is-speed { background: #fff4d9; color: #9b6b00; }
.hj-experience-v15 .hj-intent-icon.is-secure { background: #eaf7fb; color: #176e87; }
.hj-experience-v15 .hj-intent-icon.is-files { background: #f2ecff; color: #6946a2; }
.hj-experience-v15 .hj-intent-icon.is-backup { background: #ffecec; color: #a34848; }
.hj-experience-v15 .hj-intent-grid strong { margin-top: 13px; font-size: 14px; letter-spacing: -.015em; }
.hj-experience-v15 .hj-intent-grid small { margin-top: 5px; color: var(--hj-v15-muted); font-size: 11.5px; line-height: 1.55; }
.hj-experience-v15 .hj-intent-grid b { margin-top: auto; padding-top: 11px; color: var(--hj-v15-emerald); font-size: 11px; }

.hj-experience-v15 .hj-service-journey-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.hj-experience-v15 .hj-service-journey-grid a { min-height: 76px; padding: 12px 13px; display: grid; grid-template-columns: 39px minmax(0, 1fr) auto; align-items: center; gap: 11px; border: 1px solid var(--hj-v15-line); border-radius: 12px; color: var(--hj-v15-ink); text-decoration: none; }
.hj-experience-v15 .hj-service-journey-grid a:hover { border-color: #c6d2c9; background: #fbfdfb; }
.hj-experience-v15 .hj-service-journey-grid a > span { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 10px; background: var(--hj-v15-lime-soft); color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-service-journey-grid svg { width: 19px; height: 19px; }
.hj-experience-v15 .hj-service-journey-grid div { display: grid; gap: 2px; }
.hj-experience-v15 .hj-service-journey-grid small { color: var(--hj-v15-muted); font-size: 11px; }
.hj-experience-v15 .hj-service-journey-grid em { color: var(--hj-v15-emerald); font-size: 11px; font-style: normal; font-weight: 750; }

.hj-experience-v15 .hj-service-next-card { padding: 20px; background: var(--hj-v15-forest); color: #fff; border-color: var(--hj-v15-forest); box-shadow: 0 18px 38px rgba(11,51,42,.16); }
.hj-experience-v15 .hj-service-next-card .hj-next-orbit { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 12px; background: var(--hj-v15-lime); color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-service-next-card .hj-next-orbit svg { width: 21px; height: 21px; }
.hj-experience-v15 .hj-service-next-card > small { color: rgba(255,255,255,.62); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.hj-experience-v15 .hj-service-next-card h2 { margin-top: 6px; color: #fff; font-size: 22px; letter-spacing: -.035em; }
.hj-experience-v15 .hj-service-next-card p { margin: 8px 0 18px; color: rgba(255,255,255,.72); font-size: 12px; line-height: 1.6; }
.hj-experience-v15 .hj-service-next-card .hj-primary-button { border-color: var(--hj-v15-lime); background: var(--hj-v15-lime); color: var(--hj-v15-forest) !important; box-shadow: none; }

.hj-experience-v15 details.hj-panel { overflow: hidden; }
.hj-experience-v15 details.hj-panel > summary { list-style: none; cursor: pointer; user-select: none; }
.hj-experience-v15 details.hj-panel > summary::-webkit-details-marker { display: none; }
.hj-experience-v15 .hj-service-details-card summary { min-height: 72px; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hj-experience-v15 .hj-service-details-card summary span { display: grid; gap: 2px; }
.hj-experience-v15 .hj-service-details-card summary small { color: var(--hj-v15-muted); font-size: 9px; text-transform: uppercase; letter-spacing: .1em; font-weight: 800; }
.hj-experience-v15 .hj-service-details-card summary strong { color: var(--hj-v15-ink); font-size: 14px; }
.hj-experience-v15 .hj-service-details-card summary b { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; background: #f2f5f2; color: var(--hj-v15-forest); font-size: 18px; transition: transform .2s ease; }
.hj-experience-v15 .hj-service-details-card[open] summary b { transform: rotate(45deg); }
.hj-experience-v15 .hj-service-detail-list { padding: 0 16px 16px; display: grid; }
.hj-experience-v15 .hj-service-detail-list > div { padding: 10px 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--hj-v15-line); }
.hj-experience-v15 .hj-service-detail-list span { color: var(--hj-v15-muted); font-size: 11px; }
.hj-experience-v15 .hj-service-detail-list strong { max-width: 60%; color: var(--hj-v15-ink); font-family: var(--hj-mono); font-size: 11px; text-align: right; overflow-wrap: anywhere; }

.hj-experience-v15 .hj-service-help-card { padding: 15px; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 11px; box-shadow: none; }
.hj-experience-v15 .hj-service-help-card > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: #f1f4f2; color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-service-help-card svg { width: 19px; height: 19px; }
.hj-experience-v15 .hj-service-help-card p { margin-top: 3px; color: var(--hj-v15-muted); font-size: 11px; line-height: 1.5; }
.hj-experience-v15 .hj-service-help-card > a { grid-column: 2; color: var(--hj-v15-emerald); text-decoration: none; font-size: 11px; font-weight: 800; }

.hj-experience-v15 .hj-expert-drawer { box-shadow: none; }
.hj-experience-v15 .hj-expert-drawer summary { min-height: 76px; padding: 14px 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.hj-experience-v15 .hj-expert-drawer summary > span { display: grid; grid-template-columns: auto 1fr; align-items: baseline; column-gap: 11px; }
.hj-experience-v15 .hj-expert-drawer summary small { grid-column: 1 / -1; color: var(--hj-v15-emerald); font-size: 9px; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.hj-experience-v15 .hj-expert-drawer summary strong { font-size: 15px; }
.hj-experience-v15 .hj-expert-drawer summary em { color: var(--hj-v15-muted); font-size: 11px; font-style: normal; font-weight: 400; }
.hj-experience-v15 .hj-expert-drawer summary > b { min-width: 105px; height: 34px; display: grid; place-items: center; border: 1px solid var(--hj-v15-line); border-radius: 9px; background: #f8faf8; color: var(--hj-v15-forest); font-size: 11px; }
.hj-experience-v15 .hj-expert-drawer[open] summary > b { background: var(--hj-v15-lime-soft); }
.hj-experience-v15 .hj-expert-grid { padding: 0 18px 18px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; }
.hj-experience-v15 .hj-expert-grid a { min-height: 108px; padding: 13px; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid var(--hj-v15-line); border-radius: 12px; color: var(--hj-v15-ink); text-decoration: none; background: #fbfcfb; }
.hj-experience-v15 .hj-expert-grid a:hover { background: #fff; border-color: #c8d2ca; }
.hj-experience-v15 .hj-expert-grid a > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; background: #eef3ef; color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-expert-grid svg { width: 17px; height: 17px; }
.hj-experience-v15 .hj-expert-grid strong { margin-top: 10px; font-size: 12px; }
.hj-experience-v15 .hj-expert-grid small { margin-top: 3px; color: var(--hj-v15-muted); font-size: 10px; line-height: 1.45; }

.hj-experience-v15 .hj-service-empty-master { min-height: 440px; padding: 48px; display: grid; place-items: center; text-align: center; }
.hj-experience-v15 .hj-service-empty-master > span { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 18px; background: var(--hj-v15-lime-soft); color: var(--hj-v15-forest); }
.hj-experience-v15 .hj-service-empty-master > span svg { width: 28px; height: 28px; }

/* Existing service pages: shorter, cleaner, and internally scrollable where needed. */
.hj-experience-v15 .hj-page-grid { gap: 16px; align-items: start; }
.hj-experience-v15 .hj-page-grid-2 { grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr); }
.hj-experience-v15 .hj-page-grid > .hj-panel { box-shadow: none; }
.hj-experience-v15 .hj-table-wrap,
.hj-experience-v15 .hj-native-table-wrap,
.hj-experience-v15 .hj-file-browser,
.hj-experience-v15 .hj-extension-scroll,
.hj-experience-v15 .hj-extensions-scroll,
.hj-experience-v15 .hj-selector-runtime-table-wrap { max-height: 560px; overflow: auto; overscroll-behavior: contain; border-radius: 12px; }
.hj-experience-v15 table thead th { position: sticky; top: 0; z-index: 3; background: #f7f9f7; }
.hj-experience-v15 .hj-settings-grid { gap: 8px; }
.hj-experience-v15 .hj-settings-grid > div { border: 1px solid var(--hj-v15-line); border-radius: 11px; background: #fafbfa; }
.hj-experience-v15 .hj-form input,
.hj-experience-v15 .hj-form select,
.hj-experience-v15 .hj-form textarea,
.hj-experience-v15 input,
.hj-experience-v15 select,
.hj-experience-v15 textarea { border-color: var(--hj-v15-line-strong); border-radius: 9px; }
.hj-experience-v15 input:focus,
.hj-experience-v15 select:focus,
.hj-experience-v15 textarea:focus { border-color: rgba(11,143,102,.5); box-shadow: 0 0 0 3px rgba(11,143,102,.08); }
.hj-experience-v15 .hj-row-actions a,
.hj-experience-v15 .hj-link-button { border-radius: 9px; }

/* PHP checkboxes remain explicit and operable. */
.hj-experience-v15 .hj-extension-item,
.hj-experience-v15 .hj-selector-extension,
.hj-experience-v15 .hj-cloudlinux-extension,
.hj-experience-v15 .hj-php-extension-item { min-height: 48px; border: 1px solid var(--hj-v15-line) !important; border-radius: 10px !important; background: #fff !important; cursor: pointer !important; }
.hj-experience-v15 input[type="checkbox"] { width: 17px !important; height: 17px !important; display: inline-block !important; visibility: visible !important; opacity: 1 !important; accent-color: var(--hj-v15-emerald); cursor: pointer; }

/* Keep internal agent mechanics invisible to customers. */
.hj-experience-v15 .hj-halo-agent-card,
.hj-experience-v15 .hj-php-advanced-grid .hj-sticky-action-panel,
.hj-experience-v15 .hj-redis-agent-panel,
.hj-experience-v15 .hj-redis-about-panel,
.hj-experience-v15 .hj-private-engine-strip,
.hj-experience-v15 .hj-native-adapter-note { display: none !important; }
.hj-experience-v15 .hj-php-advanced-grid { grid-template-columns: 1fr; }

@media (max-width: 1220px) {
  .hj-experience-v15 { grid-template-columns: 224px minmax(0, 1fr); }
  .hj-experience-v15 .hj-sidebar { width: 224px; }
  .hj-experience-v15 .hj-customer-dashboard-grid { grid-template-columns: minmax(0, 1fr) 270px; }
  .hj-experience-v15 .hj-service-studio-layout { grid-template-columns: minmax(0, 1fr) 270px; }
  .hj-experience-v15 .hj-intent-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hj-experience-v15 .hj-expert-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1020px) {
  .hj-experience-v15 { display: block; }
  .hj-experience-v15 .hj-sidebar {
    position: fixed;
    inset: 10px auto 10px 10px;
    width: min(286px, calc(100vw - 30px));
    height: calc(100dvh - 20px);
    min-height: 0;
    border: 1px solid var(--hj-v15-line);
    border-radius: 18px;
    transform: translateX(-115%);
    transition: transform .22s ease;
    box-shadow: 0 26px 70px rgba(11,37,29,.22);
    z-index: 1002;
  }
  .hj-experience-v15.hj-sidebar-open .hj-sidebar { transform: translateX(0); }
  .hj-experience-v15 .hj-mobile-nav-toggle { display: block; }
  .hj-experience-v15 .hj-main { padding: 0 20px 36px; }
  .hj-experience-v15 .hj-topbar { margin: 0 -20px; padding: 10px 20px; }
  .hj-experience-v15 .hj-topbar-profile { min-width: 42px; width: 42px; }
  .hj-experience-v15 .hj-topbar-profile > span:not(.hj-user-avatar) { display: none; }
  .hj-experience-v15 .hj-topbar-text-link,
  .hj-experience-v15 .hj-topbar-divider { display: none; }
  .hj-experience-v15 .hj-customer-dashboard-grid,
  .hj-experience-v15 .hj-service-studio-layout { grid-template-columns: 1fr; }
  .hj-experience-v15 .hj-dashboard-side-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hj-experience-v15 .hj-service-studio-side { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hj-experience-v15 .hj-service-next-card { grid-row: span 2; }
  .hj-experience-v15 .hj-page-grid-2 { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .hj-experience-v15 { min-height: 100vh; border: 0; border-radius: 0; }
  .hj-experience-v15 .hj-main { padding: 0 14px 28px; }
  .hj-experience-v15 .hj-topbar { min-height: 66px; margin: 0 -14px; padding: 9px 14px; }
  .hj-experience-v15 .hj-command-search { width: 100%; min-width: 0; }
  .hj-experience-v15 .hj-command-search kbd,
  .hj-experience-v15 .hj-topbar-right .hj-icon-button:not(.hj-notification-button) { display: none; }
  .hj-experience-v15 .hj-topbar-right { gap: 3px; }
  .hj-experience-v15 .hj-dashboard-welcome { padding: 24px 0 18px; flex-direction: column; align-items: flex-start; }
  .hj-experience-v15 .hj-dashboard-welcome h1 { font-size: 36px; }
  .hj-experience-v15 .hj-dashboard-welcome-actions { width: 100%; }
  .hj-experience-v15 .hj-dashboard-welcome-actions a { flex: 1; }
  .hj-experience-v15 .hj-customer-dashboard-grid,
  .hj-experience-v15 .hj-dashboard-side-column { grid-template-columns: 1fr; }
  .hj-experience-v15 .hj-service-workspace-bar { grid-template-columns: 1fr; grid-template-areas: "identity" "controls" "tabs"; padding: 13px 13px 0; }
  .hj-experience-v15 .hj-service-workspace-controls { justify-content: space-between; }
  .hj-experience-v15 .hj-service-workspace-select { flex: 1; }
  .hj-experience-v15 .hj-service-workspace-select select { width: 100%; min-width: 0; }
  .hj-experience-v15 .hj-service-workspace-tabs a { min-width: 84px; padding: 0 9px; }
  .hj-experience-v15 .hj-service-hero-card { grid-template-columns: 1fr; padding: 20px; }
  .hj-experience-v15 .hj-service-hero-actions { width: 100%; }
  .hj-experience-v15 .hj-service-hero-actions a { flex: 1; }
  .hj-experience-v15 .hj-service-vitals { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hj-experience-v15 .hj-service-vitals > div:nth-child(2) { border-right: 0; }
  .hj-experience-v15 .hj-service-vitals > div:nth-child(-n+2) { border-bottom: 1px solid rgba(11,51,42,.08); }
  .hj-experience-v15 .hj-intent-grid,
  .hj-experience-v15 .hj-service-journey-grid,
  .hj-experience-v15 .hj-service-studio-side { grid-template-columns: 1fr; }
  .hj-experience-v15 .hj-intent-grid > a { min-height: 155px; }
  .hj-experience-v15 .hj-expert-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hj-experience-v15 .hj-expert-drawer summary > span { grid-template-columns: 1fr; }
  .hj-experience-v15 .hj-expert-drawer summary em { display: none; }
}

@media (max-width: 500px) {
  .hj-experience-v15 .hj-notification-button { display: none; }
  .hj-experience-v15 .hj-page-heading h1 { font-size: 30px; }
  .hj-experience-v15 .hj-service-workspace-identity .hj-pill { display: none; }
  .hj-experience-v15 .hj-service-visit { display: none; }
  .hj-experience-v15 .hj-service-hero-main { flex-direction: column; }
  .hj-experience-v15 .hj-service-hero-actions { flex-direction: column; }
  .hj-experience-v15 .hj-service-hero-actions a { width: 100%; }
  .hj-experience-v15 .hj-service-vitals { grid-template-columns: 1fr; }
  .hj-experience-v15 .hj-service-vitals > div { border-right: 0; border-bottom: 1px solid rgba(11,51,42,.08); }
  .hj-experience-v15 .hj-service-vitals > div:last-child { border-bottom: 0; }
  .hj-experience-v15 .hj-expert-grid { grid-template-columns: 1fr; }
  .hj-experience-v15 .hj-expert-drawer summary > b { min-width: 86px; }
}

/* ========================================================================== 
   HostingJet Enterprise Experience System v0.16.0
   Reference language: Shadcn information density + modern product dashboard
   Winter-white canvas, restrained forest/emerald/lime accents, zero cPanel feel.
   ========================================================================== */

.hj-experience-v16 {
  --hj16-canvas: #f6f7f4;
  --hj16-surface: #ffffff;
  --hj16-surface-subtle: #fafbf9;
  --hj16-surface-soft: #f1f4f0;
  --hj16-ink: #151916;
  --hj16-muted: #68716b;
  --hj16-muted-2: #8a928d;
  --hj16-line: #e3e7e2;
  --hj16-line-strong: #d2d9d3;
  --hj16-forest: #12352b;
  --hj16-forest-2: #0b281f;
  --hj16-emerald: #167a59;
  --hj16-emerald-soft: #e8f5ef;
  --hj16-lime: #d7f66a;
  --hj16-lime-soft: #f2fbd4;
  --hj16-warn: #9d6c14;
  --hj16-warn-soft: #fff6df;
  --hj16-danger: #b44848;
  --hj16-danger-soft: #fff0f0;
  --hj16-info: #406b8a;
  --hj16-info-soft: #eef6fb;
  --hj16-radius-sm: 8px;
  --hj16-radius: 12px;
  --hj16-radius-lg: 16px;
  --hj16-shadow: 0 1px 2px rgba(18, 53, 43, .04), 0 10px 26px rgba(18, 53, 43, .035);
  --hj16-shadow-hover: 0 14px 34px rgba(18, 53, 43, .09);
  display: grid !important;
  grid-template-columns: 252px minmax(0, 1fr);
  min-height: 100vh;
  background: var(--hj16-canvas) !important;
  color: var(--hj16-ink);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  line-height: 1.5;
}

.hj-experience-v16,
.hj-experience-v16 * { box-sizing: border-box; }
.hj-experience-v16 a { color: inherit; }
.hj-experience-v16 h1,
.hj-experience-v16 h2,
.hj-experience-v16 h3,
.hj-experience-v16 h4 { font-family: Manrope, Inter, sans-serif; color: var(--hj16-ink); letter-spacing: -.025em; }
.hj-experience-v16 svg { display: block; }
.hj-experience-v16 button,
.hj-experience-v16 input,
.hj-experience-v16 select,
.hj-experience-v16 textarea { font: inherit; }

/* Shell */
.hj-experience-v16.hj-shell-embedded { min-height: 900px; border: 1px solid var(--hj16-line); border-radius: 18px; overflow: hidden; }
.hj-experience-v16 .hj-sidebar {
  position: sticky;
  top: 0;
  width: 252px !important;
  height: 100vh;
  min-height: 0;
  padding: 18px 14px 14px !important;
  display: flex !important;
  flex-direction: column;
  align-items: stretch !important;
  gap: 0 !important;
  overflow: auto;
  background: var(--hj16-surface) !important;
  color: var(--hj16-ink) !important;
  border-right: 1px solid var(--hj16-line);
  z-index: 50;
  scrollbar-width: thin;
  scrollbar-color: #dce2dd transparent;
}
.hj-experience-v16 .hj-sidebar-brand-row { min-height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 0 7px 13px; }
.hj-experience-v16 .hj-sidebar-brand { width: auto !important; height: auto !important; margin: 0 !important; display: inline-flex !important; align-items: center; justify-content: flex-start !important; gap: 11px; text-decoration: none; color: var(--hj16-ink); }
.hj-experience-v16 .hj-brand-mark { width: 34px; height: 34px; display: grid; grid-template-columns: repeat(3, 7px); align-items: center; justify-content: center; gap: 2px; border-radius: 10px; background: var(--hj16-forest); transform: skew(-7deg); }
.hj-experience-v16 .hj-brand-mark i { width: 7px; border-radius: 2px; background: var(--hj16-lime); }
.hj-experience-v16 .hj-brand-mark i:nth-child(1) { height: 12px; }
.hj-experience-v16 .hj-brand-mark i:nth-child(2) { height: 21px; }
.hj-experience-v16 .hj-brand-mark i:nth-child(3) { height: 16px; }
.hj-experience-v16 .hj-brand-copy { display: grid; gap: 0; }
.hj-experience-v16 .hj-brand-copy strong { color: var(--hj16-ink); font: 800 17px/1.15 Manrope, Inter, sans-serif; letter-spacing: -.04em; }
.hj-experience-v16 .hj-brand-copy small { color: var(--hj16-muted); font-size: 10px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.hj-experience-v16 .hj-sidebar-close { display: none; border: 0; background: none; color: var(--hj16-muted); font-size: 24px; cursor: pointer; }

.hj-experience-v16 .hj-sidebar-nav { width: 100% !important; display: flex !important; align-items: stretch !important; gap: 3px !important; padding: 10px 0 12px; }
.hj-experience-v16 .hj-nav-section { padding: 15px 10px 6px; color: var(--hj16-muted-2); font-size: 10px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.hj-experience-v16 .hj-sidebar-nav a {
  width: 100% !important;
  height: 42px !important;
  padding: 0 10px !important;
  display: flex !important;
  align-items: center;
  justify-content: flex-start !important;
  gap: 11px;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #4c5650 !important;
  text-decoration: none;
  transition: background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease;
}
.hj-experience-v16 .hj-sidebar-nav a::before,
.hj-experience-v16 .hj-sidebar-nav a::after { display: none !important; }
.hj-experience-v16 .hj-sidebar-nav a:hover { color: var(--hj16-ink) !important; background: var(--hj16-surface-soft) !important; }
.hj-experience-v16 .hj-sidebar-nav a.is-active { color: #fff !important; background: var(--hj16-forest) !important; border-color: var(--hj16-forest) !important; box-shadow: 0 7px 16px rgba(18,53,43,.12); }
.hj-experience-v16 .hj-sidebar-nav a.is-active .hj-nav-icon { color: var(--hj16-lime); }
.hj-experience-v16 .hj-sidebar-nav a.is-active .hj-nav-cue { opacity: .8; }
.hj-experience-v16 .hj-nav-icon { width: 20px; height: 20px; display: grid; place-items: center; color: #667069; flex: 0 0 20px; }
.hj-experience-v16 .hj-nav-icon svg { width: 18px; height: 18px; }
.hj-experience-v16 .hj-nav-label { display: block !important; min-width: 0; flex: 1; font-size: 12.5px; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hj-experience-v16 .hj-nav-cue { display: block !important; margin-left: auto; color: currentColor; opacity: .35; font-size: 17px; }

.hj-experience-v16 .hj-sidebar-product { margin: auto 3px 12px; padding: 14px; border: 1px solid var(--hj16-line); border-radius: 13px; background: linear-gradient(145deg, #fbfdf9 0%, #f3f8ee 100%); }
.hj-experience-v16 .hj-sidebar-product-label { color: var(--hj16-emerald); font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.hj-experience-v16 .hj-sidebar-product > strong { display: block; margin-top: 7px; font: 750 12.5px/1.3 Manrope, Inter, sans-serif; }
.hj-experience-v16 .hj-sidebar-product > small { display: block; margin-top: 2px; color: var(--hj16-muted); font-size: 10.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-experience-v16 .hj-sidebar-product-foot { margin-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.hj-experience-v16 .hj-sidebar-product-foot a { color: var(--hj16-forest); font-size: 10.5px; font-weight: 800; text-decoration: none; }
.hj-experience-v16 .hj-sidebar-user { width: auto !important; height: 52px !important; margin: 0 3px !important; padding: 7px 8px !important; display: grid !important; grid-template-columns: 34px minmax(0,1fr) auto; gap: 9px; align-items: center; border: 1px solid transparent; border-radius: 11px !important; background: transparent !important; color: var(--hj16-ink) !important; text-decoration: none; }
.hj-experience-v16 .hj-sidebar-user:hover { background: var(--hj16-surface-soft) !important; border-color: var(--hj16-line); }
.hj-experience-v16 .hj-user-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: var(--hj16-forest); color: var(--hj16-lime); font-size: 11px; font-weight: 800; }
.hj-experience-v16 .hj-user-copy { display: grid; min-width: 0; }
.hj-experience-v16 .hj-user-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; }
.hj-experience-v16 .hj-user-copy small { color: var(--hj16-muted); font-size: 9.5px; }

.hj-experience-v16 .hj-sidebar-scrim { display: none; }
.hj-experience-v16 .hj-main { min-width: 0; padding: 0 30px 42px !important; overflow: visible !important; background: var(--hj16-canvas); }
.hj-experience-v16 .hj-topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  min-height: 70px !important;
  margin: 0 -30px;
  padding: 10px 30px !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border: 0 !important;
  border-bottom: 1px solid var(--hj16-line) !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.96) !important;
  box-shadow: none !important;
  backdrop-filter: blur(14px);
}
.hj-experience-v16 .hj-topbar-left { min-width: 0; flex: 1; display: flex; align-items: center; gap: 12px; }
.hj-experience-v16 .hj-topbar-right { display: flex; align-items: center; gap: 7px; }
.hj-experience-v16 .hj-mobile-nav-toggle { display: none; width: 38px; height: 38px; padding: 9px; border: 1px solid var(--hj16-line); border-radius: 9px; background: var(--hj16-surface); }
.hj-experience-v16 .hj-mobile-nav-toggle span { display: block; height: 2px; margin: 3px 0; background: var(--hj16-ink); border-radius: 2px; }
.hj-experience-v16 .hj-command-search { width: min(620px, 100%); min-width: 260px; height: 40px; padding: 0 9px 0 12px; display: flex; align-items: center; gap: 9px; border: 1px solid var(--hj16-line); border-radius: 10px; background: var(--hj16-surface-subtle); transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; }
.hj-experience-v16 .hj-command-search:focus-within { background: #fff; border-color: #9eb7a8; box-shadow: 0 0 0 3px rgba(22,122,89,.08); }
.hj-experience-v16 .hj-command-search-icon { width: 17px; height: 17px; color: var(--hj16-muted); }
.hj-experience-v16 .hj-command-search-icon svg { width: 17px; height: 17px; }
.hj-experience-v16 .hj-command-search input { min-width: 0; flex: 1; height: 38px; padding: 0; border: 0 !important; background: transparent !important; color: var(--hj16-ink); box-shadow: none !important; font-size: 12px; }
.hj-experience-v16 .hj-command-search input::placeholder { color: #919892; }
.hj-experience-v16 .hj-command-search kbd { min-width: 43px; padding: 3px 7px; border: 1px solid var(--hj16-line); border-bottom-color: #cbd2cc; border-radius: 6px; background: #fff; color: var(--hj16-muted); font-size: 9px; font-weight: 700; text-align: center; }
.hj-experience-v16 .hj-topbar-text-link { height: 36px; display: inline-flex; align-items: center; padding: 0 9px; color: #4f5a53; font-size: 11.5px; font-weight: 700; text-decoration: none; }
.hj-experience-v16 .hj-topbar-divider { width: 1px; height: 22px; background: var(--hj16-line); }
.hj-experience-v16 .hj-icon-button { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid transparent; border-radius: 9px; background: transparent; color: #56615a; text-decoration: none; position: relative; }
.hj-experience-v16 .hj-icon-button:hover { border-color: var(--hj16-line); background: var(--hj16-surface-soft); color: var(--hj16-forest); }
.hj-experience-v16 .hj-icon-button svg { width: 17px; height: 17px; }
.hj-experience-v16 .hj-notification-count { position: absolute; right: -3px; top: -3px; min-width: 17px; height: 17px; padding: 0 4px; display: grid; place-items: center; border: 2px solid #fff; border-radius: 999px; background: var(--hj16-forest); color: #fff; font-size: 8px; font-weight: 800; }
.hj-experience-v16 .hj-topbar-profile { min-width: 174px; height: 44px; padding: 4px 7px; display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 8px; align-items: center; border: 1px solid transparent; border-radius: 11px; color: var(--hj16-ink); text-decoration: none; }
.hj-experience-v16 .hj-topbar-profile:hover { background: var(--hj16-surface-soft); border-color: var(--hj16-line); }
.hj-experience-v16 .hj-topbar-profile > span:nth-child(2) { display: grid; min-width: 0; }
.hj-experience-v16 .hj-topbar-profile strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10.5px; }
.hj-experience-v16 .hj-topbar-profile small { color: var(--hj16-muted); font-size: 9px; }
.hj-experience-v16 .hj-profile-caret { color: var(--hj16-muted); }

/* Page scaffold */
.hj-experience-v16 .hj-breadcrumbs { max-width: 1480px; margin: 18px auto 0; display: flex; align-items: center; gap: 8px; color: var(--hj16-muted); font-size: 10px; }
.hj-experience-v16 .hj-breadcrumbs a { color: var(--hj16-muted); text-decoration: none; }
.hj-experience-v16 .hj-breadcrumbs a:hover { color: var(--hj16-forest); }
.hj-experience-v16 .hj-page-title-row { max-width: 1480px; margin: 12px auto 0; padding: 0; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.hj-experience-v16 .hj-page-heading { max-width: 760px; }
.hj-experience-v16 .hj-page-eyebrow,
.hj-experience-v16 .hj-section-kicker,
.hj-experience-v16 .hj-dashboard-kicker { display: block; color: var(--hj16-emerald); font-size: 9.5px; font-weight: 850; letter-spacing: .105em; text-transform: uppercase; }
.hj-experience-v16 .hj-page-heading h1 { margin-top: 4px; font-size: clamp(27px, 2.2vw, 36px); line-height: 1.08; }
.hj-experience-v16 .hj-page-subtitle { margin-top: 7px !important; color: var(--hj16-muted); font-size: 12.5px; }
.hj-experience-v16 .hj-page-context { max-width: 1480px; margin: 0 auto; padding-top: 20px; }
.hj-experience-v16 .hj-inline-notice { display: block; margin: 0 0 12px; padding: 10px 12px; border: 1px solid #bee0ce; border-radius: 10px; background: var(--hj16-emerald-soft); color: #225942; font-size: 11.5px; }
.hj-experience-v16 .hj-inline-notice-error { border-color: #efcaca; background: var(--hj16-danger-soft); color: var(--hj16-danger); }

/* Cards and controls */
.hj-experience-v16 .hj-panel,
.hj-experience-v16 .hj-service-command-card {
  border: 1px solid var(--hj16-line) !important;
  border-radius: var(--hj16-radius-lg) !important;
  background: var(--hj16-surface) !important;
  box-shadow: var(--hj16-shadow) !important;
  color: var(--hj16-ink);
}
.hj-experience-v16 .hj-panel-head { min-height: 46px; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.hj-experience-v16 .hj-panel-head h2 { margin-top: 4px; font-size: 17px; line-height: 1.25; }
.hj-experience-v16 .hj-panel-head p { margin-top: 4px; color: var(--hj16-muted); font-size: 11.5px; }
.hj-experience-v16 .hj-panel-link,
.hj-experience-v16 .hj-panel-head > a,
.hj-experience-v16 .hj-text-link { color: var(--hj16-emerald); font-size: 10.5px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.hj-experience-v16 .hj-panel-link:hover,
.hj-experience-v16 .hj-panel-head > a:hover { color: var(--hj16-forest); }
.hj-experience-v16 .hj-primary-button,
.hj-experience-v16 .hj-secondary-button,
.hj-experience-v16 .hj-link-button,
.hj-experience-v16 button.hj-primary-button,
.hj-experience-v16 button.hj-secondary-button {
  min-height: 38px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 9px !important;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.hj-experience-v16 .hj-primary-button { border: 1px solid var(--hj16-forest) !important; background: var(--hj16-forest) !important; color: #fff !important; box-shadow: 0 5px 13px rgba(18,53,43,.12); }
.hj-experience-v16 .hj-primary-button:hover { transform: translateY(-1px); background: var(--hj16-forest-2) !important; box-shadow: 0 8px 18px rgba(18,53,43,.16); }
.hj-experience-v16 .hj-primary-button svg { width: 15px; height: 15px; }
.hj-experience-v16 .hj-secondary-button { border: 1px solid var(--hj16-line-strong) !important; background: #fff !important; color: var(--hj16-forest) !important; box-shadow: none !important; }
.hj-experience-v16 .hj-secondary-button:hover { border-color: #abb8ae !important; background: var(--hj16-surface-subtle) !important; }
.hj-experience-v16 .hj-primary-button-full { width: 100%; }
.hj-experience-v16 .hj-pill { min-height: 22px; padding: 3px 8px; display: inline-flex; align-items: center; border-radius: 999px; background: var(--hj16-surface-soft); color: #55605a; font-size: 9px; font-weight: 800; line-height: 1; }
.hj-experience-v16 .hj-pill-active,
.hj-experience-v16 .hj-pill-success { background: var(--hj16-emerald-soft); color: #176347; }
.hj-experience-v16 .hj-pill-warning { background: var(--hj16-warn-soft); color: var(--hj16-warn); }
.hj-experience-v16 .hj-pill-error,
.hj-experience-v16 .hj-pill-failed { background: var(--hj16-danger-soft); color: var(--hj16-danger); }

/* Dashboard */
.hj-experience-v16 .hj-dashboard-welcome { max-width: 1480px; margin: 0 auto; padding: 34px 0 22px; display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; }
.hj-experience-v16 .hj-dashboard-welcome-copy { max-width: 760px; }
.hj-experience-v16 .hj-dashboard-welcome h1 { margin-top: 6px; font-size: clamp(32px, 3vw, 48px); line-height: 1.03; }
.hj-experience-v16 .hj-dashboard-welcome p { max-width: 680px; margin-top: 10px; color: var(--hj16-muted); font-size: 13px; }
.hj-experience-v16 .hj-dashboard-welcome-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.hj-experience-v16 .hj-dashboard-stats { max-width: 1480px; margin: 0 auto 18px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.hj-experience-v16 .hj-dashboard-stat { min-height: 108px; padding: 15px; display: grid; grid-template-columns: 40px minmax(0,1fr) auto; gap: 12px; align-items: center; border: 1px solid var(--hj16-line); border-radius: 14px; background: #fff; color: var(--hj16-ink); text-decoration: none; box-shadow: 0 1px 2px rgba(18,53,43,.025); transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.hj-experience-v16 .hj-dashboard-stat:hover { transform: translateY(-2px); border-color: #c7d1c9; box-shadow: var(--hj16-shadow-hover); }
.hj-experience-v16 .hj-dashboard-stat-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; background: var(--hj16-lime-soft); color: var(--hj16-forest); }
.hj-experience-v16 .hj-dashboard-stat-icon svg { width: 19px; height: 19px; }
.hj-experience-v16 .hj-dashboard-stat > span:nth-child(2) { display: grid; gap: 1px; }
.hj-experience-v16 .hj-dashboard-stat small { color: var(--hj16-muted); font-size: 9.5px; font-weight: 700; }
.hj-experience-v16 .hj-dashboard-stat strong { font: 800 22px/1.1 Manrope, Inter, sans-serif; letter-spacing: -.04em; }
.hj-experience-v16 .hj-dashboard-stat em { color: var(--hj16-muted-2); font-size: 9px; font-style: normal; }
.hj-experience-v16 .hj-dashboard-stat > b { color: var(--hj16-muted-2); font-size: 16px; }
.hj-experience-v16 .hj-dashboard-layout { max-width: 1480px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) 326px; gap: 16px; align-items: start; }
.hj-experience-v16 .hj-dashboard-primary-column,
.hj-experience-v16 .hj-dashboard-side-column { display: grid; gap: 16px; }
.hj-experience-v16 .hj-service-portfolio,
.hj-experience-v16 .hj-dashboard-actions-card,
.hj-experience-v16 .hj-dashboard-feed-card,
.hj-experience-v16 .hj-primary-service-card,
.hj-experience-v16 .hj-renewal-card,
.hj-experience-v16 .hj-support-card,
.hj-experience-v16 .hj-setup-progress { padding: 18px; }
.hj-experience-v16 .hj-service-portfolio-list { margin-top: 12px; display: grid; gap: 7px; }
.hj-experience-v16 .hj-service-portfolio-row { min-height: 64px; padding: 9px 10px; display: grid; grid-template-columns: 38px minmax(0,1fr) auto auto; gap: 11px; align-items: center; border: 1px solid var(--hj16-line); border-radius: 11px; background: var(--hj16-surface-subtle); }
.hj-experience-v16 .hj-service-portfolio-row:hover { border-color: #cbd4cc; background: #fff; }
.hj-experience-v16 .hj-service-portfolio-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: var(--hj16-emerald-soft); color: var(--hj16-emerald); }
.hj-experience-v16 .hj-service-portfolio-icon svg { width: 18px; height: 18px; }
.hj-experience-v16 .hj-product-color-2 { background: #f0f1ff; color: #5964a5; }
.hj-experience-v16 .hj-product-color-3 { background: #fff5df; color: #9a6811; }
.hj-experience-v16 .hj-product-color-4 { background: #f2ebff; color: #7051a5; }
.hj-experience-v16 .hj-service-portfolio-main { min-width: 0; display: grid; gap: 2px; }
.hj-experience-v16 .hj-service-portfolio-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11.5px; }
.hj-experience-v16 .hj-service-portfolio-main small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--hj16-muted); font-size: 9.5px; }
.hj-experience-v16 .hj-service-portfolio-state { min-height: 24px; padding: 3px 8px; display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; background: var(--hj16-surface-soft); color: #56615a; font-size: 9px; font-weight: 800; white-space: nowrap; }
.hj-experience-v16 .hj-service-portfolio-state i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.hj-experience-v16 .hj-service-portfolio-state.is-online { background: var(--hj16-emerald-soft); color: #176347; }
.hj-experience-v16 .hj-service-portfolio-state.is-attention { background: var(--hj16-warn-soft); color: var(--hj16-warn); }
.hj-experience-v16 .hj-service-portfolio-actions { display: flex; align-items: center; gap: 6px; }
.hj-experience-v16 .hj-service-portfolio-actions a { min-height: 32px; padding: 0 10px; display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--hj16-line); border-radius: 8px; background: #fff; color: var(--hj16-forest); font-size: 9.5px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.hj-experience-v16 .hj-service-portfolio-actions a.is-primary { border-color: var(--hj16-forest); background: var(--hj16-forest); color: #fff; }
.hj-experience-v16 .hj-dashboard-action-grid { margin-top: 12px; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.hj-experience-v16 .hj-dashboard-action-grid a { min-height: 74px; padding: 12px; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: 11px; align-items: center; border: 1px solid var(--hj16-line); border-radius: 11px; background: #fff; color: var(--hj16-ink); text-decoration: none; }
.hj-experience-v16 .hj-dashboard-action-grid a:hover { border-color: #bfcac1; background: var(--hj16-surface-subtle); }
.hj-experience-v16 .hj-dashboard-action-grid a > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: var(--hj16-surface-soft); color: var(--hj16-forest); }
.hj-experience-v16 .hj-dashboard-action-grid a > span svg { width: 18px; height: 18px; }
.hj-experience-v16 .hj-dashboard-action-grid a > div { display: grid; gap: 2px; }
.hj-experience-v16 .hj-dashboard-action-grid strong { font-size: 11px; }
.hj-experience-v16 .hj-dashboard-action-grid small { color: var(--hj16-muted); font-size: 9.5px; }
.hj-experience-v16 .hj-dashboard-action-grid b { color: var(--hj16-muted-2); }
.hj-experience-v16 .hj-dashboard-feed-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.hj-experience-v16 .hj-feed-list,
.hj-experience-v16 .hj-activity-timeline { margin-top: 8px; display: grid; }
.hj-experience-v16 .hj-feed-item,
.hj-experience-v16 .hj-activity-timeline-item { min-height: 58px; padding: 10px 0; display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 10px; align-items: center; border-top: 1px solid var(--hj16-line); color: var(--hj16-ink); text-decoration: none; }
.hj-experience-v16 .hj-feed-item:first-child,
.hj-experience-v16 .hj-activity-timeline-item:first-child { border-top: 0; }
.hj-experience-v16 .hj-feed-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: var(--hj16-surface-soft); color: var(--hj16-forest); }
.hj-experience-v16 .hj-feed-icon svg { width: 16px; height: 16px; }
.hj-experience-v16 .hj-feed-item > span:nth-child(2),
.hj-experience-v16 .hj-activity-timeline-item > span:nth-child(2) { min-width: 0; display: grid; gap: 1px; }
.hj-experience-v16 .hj-feed-item strong,
.hj-experience-v16 .hj-activity-timeline-item strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10.5px; }
.hj-experience-v16 .hj-feed-item small,
.hj-experience-v16 .hj-activity-timeline-item small,
.hj-experience-v16 .hj-feed-item time { color: var(--hj16-muted); font-size: 9px; }
.hj-experience-v16 .hj-feed-item b { color: var(--hj16-muted-2); }
.hj-experience-v16 .hj-primary-service-card { position: relative; overflow: hidden; }
.hj-experience-v16 .hj-primary-service-card::after { content: ""; position: absolute; right: -44px; top: -44px; width: 150px; height: 150px; border-radius: 50%; background: radial-gradient(circle, rgba(215,246,106,.28), rgba(215,246,106,0) 68%); pointer-events: none; }
.hj-experience-v16 .hj-primary-service-card-top { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; }
.hj-experience-v16 .hj-primary-service-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; background: var(--hj16-forest); color: var(--hj16-lime); }
.hj-experience-v16 .hj-primary-service-icon svg { width: 20px; height: 20px; }
.hj-experience-v16 .hj-primary-service-card > .hj-section-kicker { margin-top: 20px; }
.hj-experience-v16 .hj-primary-service-card h2 { margin-top: 5px; font-size: 20px; overflow-wrap: anywhere; }
.hj-experience-v16 .hj-primary-service-card > p { margin-top: 4px; color: var(--hj16-muted); font-size: 10.5px; }
.hj-experience-v16 .hj-primary-service-meta { margin: 16px 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border: 1px solid var(--hj16-line); border-radius: 10px; overflow: hidden; }
.hj-experience-v16 .hj-primary-service-meta div { padding: 10px; display: grid; gap: 2px; }
.hj-experience-v16 .hj-primary-service-meta div + div { border-left: 1px solid var(--hj16-line); }
.hj-experience-v16 .hj-primary-service-meta small { color: var(--hj16-muted); font-size: 8.5px; }
.hj-experience-v16 .hj-primary-service-meta strong { font-size: 10.5px; }
.hj-experience-v16 .hj-renewal-balance,
.hj-experience-v16 .hj-renewal-next { margin-top: 10px; padding: 11px 0; display: grid; gap: 2px; border-top: 1px solid var(--hj16-line); }
.hj-experience-v16 .hj-renewal-balance span,
.hj-experience-v16 .hj-renewal-next span { color: var(--hj16-muted); font-size: 9px; }
.hj-experience-v16 .hj-renewal-balance strong { font: 800 20px/1.1 Manrope,Inter,sans-serif; }
.hj-experience-v16 .hj-renewal-next strong { font-size: 11px; }
.hj-experience-v16 .hj-renewal-next small { color: var(--hj16-muted); font-size: 9px; }
.hj-experience-v16 .hj-support-card { display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 11px; align-items: start; }
.hj-experience-v16 .hj-support-card-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; background: var(--hj16-lime-soft); color: var(--hj16-forest); }
.hj-experience-v16 .hj-support-card-icon svg { width: 19px; height: 19px; }
.hj-experience-v16 .hj-support-card h2 { margin-top: 3px; font-size: 16px; }
.hj-experience-v16 .hj-support-card p { margin-top: 4px; color: var(--hj16-muted); font-size: 10.5px; }
.hj-experience-v16 .hj-support-card > a { grid-column: 1 / -1; }
.hj-experience-v16 .hj-setup-progress-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hj-experience-v16 .hj-setup-progress-head > div { display: grid; gap: 2px; }
.hj-experience-v16 .hj-setup-progress-head span { color: var(--hj16-emerald); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.hj-experience-v16 .hj-setup-progress-head strong { font-size: 12px; }
.hj-experience-v16 .hj-setup-progress-head small { color: var(--hj16-muted); font-size: 9px; }
.hj-experience-v16 .hj-setup-progress-head b { font: 800 20px/1 Manrope,Inter,sans-serif; }
.hj-experience-v16 .hj-progress-track { height: 6px; margin-top: 12px; border-radius: 999px; background: var(--hj16-surface-soft); overflow: hidden; }
.hj-experience-v16 .hj-progress-track span { display: block; height: 100%; border-radius: inherit; background: var(--hj16-forest); }

/* Service workspace */
.hj-experience-v16 .hj-service-workspace-bar { max-width: 1480px; margin: 18px auto 0; padding: 10px; display: grid; grid-template-columns: minmax(230px,.8fr) minmax(420px,1.6fr) auto; gap: 12px; align-items: center; border: 1px solid var(--hj16-line); border-radius: 14px; background: #fff; box-shadow: 0 1px 2px rgba(18,53,43,.025); }
.hj-experience-v16 .hj-service-workspace-identity { min-width: 0; display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: 10px; align-items: center; }
.hj-experience-v16 .hj-service-workspace-mark { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: var(--hj16-forest); color: var(--hj16-lime); }
.hj-experience-v16 .hj-service-workspace-mark svg { width: 18px; height: 18px; }
.hj-experience-v16 .hj-service-workspace-copy { min-width: 0; display: grid; gap: 0; }
.hj-experience-v16 .hj-service-workspace-copy small { color: var(--hj16-muted); font-size: 8px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.hj-experience-v16 .hj-service-workspace-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10.5px; }
.hj-experience-v16 .hj-service-workspace-copy em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--hj16-muted); font-size: 8.5px; font-style: normal; }
.hj-experience-v16 .hj-service-workspace-tabs { min-width: 0; display: flex; align-items: center; justify-content: center; gap: 3px; overflow-x: auto; scrollbar-width: none; }
.hj-experience-v16 .hj-service-workspace-tabs::-webkit-scrollbar { display: none; }
.hj-experience-v16 .hj-service-workspace-tabs a { min-height: 38px; padding: 0 10px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid transparent; border-radius: 9px; color: #5d6760; font-size: 10px; font-weight: 750; text-decoration: none; white-space: nowrap; }
.hj-experience-v16 .hj-service-workspace-tabs a:hover { background: var(--hj16-surface-soft); color: var(--hj16-ink); }
.hj-experience-v16 .hj-service-workspace-tabs a.is-active { border-color: #cbd6ce; background: var(--hj16-surface-soft); color: var(--hj16-forest); }
.hj-experience-v16 .hj-service-workspace-tabs a span { width: 16px; height: 16px; }
.hj-experience-v16 .hj-service-workspace-tabs svg { width: 16px; height: 16px; }
.hj-experience-v16 .hj-service-workspace-controls { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.hj-experience-v16 .hj-service-workspace-select { display: grid; gap: 2px; }
.hj-experience-v16 .hj-service-workspace-select > span { display: none; }
.hj-experience-v16 .hj-service-workspace-select select { max-width: 160px; height: 36px; padding: 0 28px 0 9px; border: 1px solid var(--hj16-line-strong); border-radius: 8px; background-color: #fff; font-size: 9px; }
.hj-experience-v16 .hj-service-visit { min-height: 36px; padding: 0 10px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--hj16-line-strong); border-radius: 8px; background: #fff; color: var(--hj16-forest); font-size: 9.5px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.hj-experience-v16 .hj-service-visit svg { width: 14px; height: 14px; }

.hj-experience-v16 .hj-service-studio { display: grid; gap: 16px; }
.hj-experience-v16 .hj-service-command-card { padding: 20px; display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 18px; align-items: center; overflow: hidden; position: relative; }
.hj-experience-v16 .hj-service-command-card::after { content: ""; position: absolute; right: -80px; top: -120px; width: 340px; height: 340px; border-radius: 50%; background: radial-gradient(circle, rgba(215,246,106,.2), rgba(215,246,106,0) 68%); pointer-events: none; }
.hj-experience-v16 .hj-service-command-identity { min-width: 0; display: flex; align-items: center; gap: 13px; position: relative; z-index: 1; }
.hj-experience-v16 .hj-service-command-icon { width: 50px; height: 50px; display: grid; place-items: center; flex: 0 0 50px; border-radius: 13px; background: var(--hj16-forest); color: var(--hj16-lime); }
.hj-experience-v16 .hj-service-command-icon svg { width: 23px; height: 23px; }
.hj-experience-v16 .hj-service-command-identity h2 { margin-top: 3px; font-size: 22px; overflow-wrap: anywhere; }
.hj-experience-v16 .hj-service-command-identity p { margin-top: 2px; color: var(--hj16-muted); font-size: 10.5px; }
.hj-experience-v16 .hj-service-command-status { position: relative; z-index: 1; display: grid; gap: 3px; justify-items: end; }
.hj-experience-v16 .hj-service-command-status > span { min-height: 27px; padding: 4px 9px; display: inline-flex; align-items: center; gap: 7px; border-radius: 999px; font-size: 9px; font-weight: 800; }
.hj-experience-v16 .hj-service-command-status > span.is-online { background: var(--hj16-emerald-soft); color: #176347; }
.hj-experience-v16 .hj-service-command-status > span.is-attention { background: var(--hj16-warn-soft); color: var(--hj16-warn); }
.hj-experience-v16 .hj-service-command-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.hj-experience-v16 .hj-service-command-status small { color: var(--hj16-muted); font-size: 8.5px; }
.hj-experience-v16 .hj-service-command-actions { position: relative; z-index: 1; display: flex; align-items: center; gap: 7px; }
.hj-experience-v16 .hj-service-command-metrics { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-top: 1px solid var(--hj16-line); }
.hj-experience-v16 .hj-service-command-metrics > div { padding: 15px 12px 0; display: grid; gap: 2px; }
.hj-experience-v16 .hj-service-command-metrics > div + div { border-left: 1px solid var(--hj16-line); }
.hj-experience-v16 .hj-service-command-metrics span { color: var(--hj16-muted); font-size: 8.5px; font-weight: 700; }
.hj-experience-v16 .hj-service-command-metrics strong { font: 800 17px/1.1 Manrope,Inter,sans-serif; }
.hj-experience-v16 .hj-service-command-metrics small { color: var(--hj16-muted-2); font-size: 8.5px; }
.hj-experience-v16 .hj-goal-launcher { padding: 18px; }
.hj-experience-v16 .hj-goal-grid { margin-top: 12px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; }
.hj-experience-v16 .hj-goal-grid a { min-height: 108px; padding: 14px; display: grid; grid-template-columns: 38px minmax(0,1fr); grid-template-rows: auto auto; gap: 10px; align-items: center; border: 1px solid var(--hj16-line); border-radius: 12px; background: #fff; color: var(--hj16-ink); text-decoration: none; transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease; }
.hj-experience-v16 .hj-goal-grid a:hover { transform: translateY(-2px); border-color: #bdc9bf; box-shadow: var(--hj16-shadow-hover); }
.hj-experience-v16 .hj-goal-grid a.is-primary { border-color: var(--hj16-forest); background: var(--hj16-forest); color: #fff; }
.hj-experience-v16 .hj-goal-grid a > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: var(--hj16-surface-soft); color: var(--hj16-forest); }
.hj-experience-v16 .hj-goal-grid a.is-primary > span { background: var(--hj16-lime); color: var(--hj16-forest); }
.hj-experience-v16 .hj-goal-grid svg { width: 18px; height: 18px; }
.hj-experience-v16 .hj-goal-grid a > div { min-width: 0; display: grid; gap: 2px; }
.hj-experience-v16 .hj-goal-grid strong { font-size: 11.5px; }
.hj-experience-v16 .hj-goal-grid small { color: var(--hj16-muted); font-size: 9px; }
.hj-experience-v16 .hj-goal-grid a.is-primary small { color: rgba(255,255,255,.68); }
.hj-experience-v16 .hj-goal-grid b { grid-column: 1 / -1; color: var(--hj16-emerald); font-size: 9.5px; }
.hj-experience-v16 .hj-goal-grid a.is-primary b { color: var(--hj16-lime); }
.hj-experience-v16 .hj-service-command-layout { display: grid; grid-template-columns: minmax(0,1fr) 322px; gap: 16px; align-items: start; }
.hj-experience-v16 .hj-service-essentials-card { padding: 18px; }
.hj-experience-v16 .hj-service-essential-grid { margin-top: 12px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.hj-experience-v16 .hj-service-essential-grid a { min-height: 72px; padding: 11px 12px; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; gap: 10px; align-items: center; border: 1px solid var(--hj16-line); border-radius: 10px; background: var(--hj16-surface-subtle); color: var(--hj16-ink); text-decoration: none; }
.hj-experience-v16 .hj-service-essential-grid a:hover { border-color: #c2cdc4; background: #fff; }
.hj-experience-v16 .hj-service-essential-grid a > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 9px; background: #fff; color: var(--hj16-forest); border: 1px solid var(--hj16-line); }
.hj-experience-v16 .hj-service-essential-grid svg { width: 17px; height: 17px; }
.hj-experience-v16 .hj-service-essential-grid a > div { display: grid; gap: 2px; }
.hj-experience-v16 .hj-service-essential-grid strong { font-size: 10.5px; }
.hj-experience-v16 .hj-service-essential-grid small { color: var(--hj16-muted); font-size: 9px; }
.hj-experience-v16 .hj-service-essential-grid b { color: var(--hj16-muted-2); }
.hj-experience-v16 .hj-service-command-side { display: grid; gap: 12px; }
.hj-experience-v16 .hj-service-readiness-card { padding: 15px; display: grid; grid-template-columns: 78px minmax(0,1fr); gap: 13px; align-items: center; }
.hj-experience-v16 .hj-readiness-ring { width: 72px; height: 72px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--hj16-emerald) 0 92%, #e9eee9 92% 100%); position: relative; }
.hj-experience-v16 .hj-readiness-ring::before { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: #fff; }
.hj-experience-v16 .hj-readiness-ring > span { position: relative; z-index: 1; font: 800 17px/1 Manrope,Inter,sans-serif; }
.hj-experience-v16 .hj-readiness-ring small { font-size: 9px; }
.hj-experience-v16 .hj-service-readiness-card h2 { margin-top: 3px; font-size: 15px; }
.hj-experience-v16 .hj-service-readiness-card p { margin-top: 3px; color: var(--hj16-muted); font-size: 9.5px; }
.hj-experience-v16 .hj-service-summary-card { padding: 16px; }
.hj-experience-v16 .hj-service-detail-list { margin-top: 9px; display: grid; }
.hj-experience-v16 .hj-service-detail-list > div { min-height: 37px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid var(--hj16-line); }
.hj-experience-v16 .hj-service-detail-list > div:first-child { border-top: 0; }
.hj-experience-v16 .hj-service-detail-list span { color: var(--hj16-muted); font-size: 9px; }
.hj-experience-v16 .hj-service-detail-list strong { max-width: 58%; text-align: right; overflow-wrap: anywhere; font-size: 9.5px; }
.hj-experience-v16 .hj-service-help-card { padding: 14px; display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 10px; align-items: start; }
.hj-experience-v16 .hj-service-help-card > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: var(--hj16-lime-soft); color: var(--hj16-forest); }
.hj-experience-v16 .hj-service-help-card svg { width: 16px; height: 16px; }
.hj-experience-v16 .hj-service-help-card strong { font-size: 10.5px; }
.hj-experience-v16 .hj-service-help-card p { margin-top: 2px; color: var(--hj16-muted); font-size: 9px; }
.hj-experience-v16 .hj-service-help-card > a { grid-column: 1 / -1; color: var(--hj16-emerald); font-size: 9.5px; font-weight: 800; text-decoration: none; }
.hj-experience-v16 .hj-expert-drawer { overflow: hidden; }
.hj-experience-v16 .hj-expert-drawer summary { min-height: 68px; padding: 13px 16px; display: flex; align-items: center; justify-content: space-between; gap: 15px; cursor: pointer; list-style: none; }
.hj-experience-v16 .hj-expert-drawer summary::-webkit-details-marker { display: none; }
.hj-experience-v16 .hj-expert-drawer summary > span { display: grid; grid-template-columns: auto auto; align-items: baseline; gap: 2px 10px; }
.hj-experience-v16 .hj-expert-drawer summary small { grid-column: 1 / -1; color: var(--hj16-emerald); font-size: 8px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.hj-experience-v16 .hj-expert-drawer summary strong { font-size: 12px; }
.hj-experience-v16 .hj-expert-drawer summary em { color: var(--hj16-muted); font-size: 9px; font-style: normal; }
.hj-experience-v16 .hj-expert-drawer summary > b { min-width: 84px; height: 31px; display: grid; place-items: center; border: 1px solid var(--hj16-line); border-radius: 8px; background: var(--hj16-surface-subtle); color: var(--hj16-forest); font-size: 9px; }
.hj-experience-v16 .hj-expert-grid { padding: 0 15px 15px; display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 8px; }
.hj-experience-v16 .hj-expert-grid a { min-height: 98px; padding: 12px; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid var(--hj16-line); border-radius: 10px; background: var(--hj16-surface-subtle); color: var(--hj16-ink); text-decoration: none; }
.hj-experience-v16 .hj-expert-grid a:hover { border-color: #bdc8bf; background: #fff; }
.hj-experience-v16 .hj-expert-grid a > span { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid var(--hj16-line); border-radius: 8px; background: #fff; color: var(--hj16-forest); }
.hj-experience-v16 .hj-expert-grid svg { width: 15px; height: 15px; }
.hj-experience-v16 .hj-expert-grid strong { margin-top: 9px; font-size: 10px; }
.hj-experience-v16 .hj-expert-grid small { margin-top: 2px; color: var(--hj16-muted); font-size: 8.5px; line-height: 1.4; }
.hj-experience-v16 .hj-service-empty-master { min-height: 430px; padding: 48px; display: grid; place-items: center; text-align: center; }

/* Shared inner pages */
.hj-experience-v16 .hj-page-grid { display: grid; gap: 14px; align-items: start; }
.hj-experience-v16 .hj-page-grid-2 { grid-template-columns: minmax(0,1.65fr) minmax(290px,.75fr); }
.hj-experience-v16 .hj-page-grid-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.hj-experience-v16 .hj-wide-panel,
.hj-experience-v16 .hj-sticky-action-panel,
.hj-experience-v16 .hj-native-module,
.hj-experience-v16 .hj-tool-panel,
.hj-experience-v16 .hj-settings-panel { padding: 17px; }
.hj-experience-v16 .hj-sticky-action-panel { position: sticky; top: 88px; }
.hj-experience-v16 .hj-app-grid,
.hj-experience-v16 .hj-tool-grid,
.hj-experience-v16 .hj-settings-grid,
.hj-experience-v16 .hj-native-card-grid { display: grid; gap: 9px; }
.hj-experience-v16 .hj-tool-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.hj-experience-v16 .hj-app-card,
.hj-experience-v16 .hj-tool-card,
.hj-experience-v16 .hj-native-card,
.hj-experience-v16 .hj-mailbox-card { border: 1px solid var(--hj16-line) !important; border-radius: 11px !important; background: var(--hj16-surface-subtle) !important; box-shadow: none !important; }
.hj-experience-v16 .hj-app-card:hover,
.hj-experience-v16 .hj-tool-card:hover,
.hj-experience-v16 .hj-native-card:hover { border-color: #c0cbc2 !important; background: #fff !important; }
.hj-experience-v16 .hj-table-wrap,
.hj-experience-v16 .hj-native-table-wrap,
.hj-experience-v16 .hj-file-browser,
.hj-experience-v16 .hj-extension-scroll,
.hj-experience-v16 .hj-extensions-scroll,
.hj-experience-v16 .hj-selector-runtime-table-wrap,
.hj-experience-v16 .hj-scroll-panel { max-height: 560px; overflow: auto; overscroll-behavior: contain; border: 1px solid var(--hj16-line); border-radius: 11px; background: #fff; }
.hj-experience-v16 table { width: 100%; border-collapse: collapse; background: #fff; }
.hj-experience-v16 table thead th { position: sticky; top: 0; z-index: 3; padding: 10px 11px; border-bottom: 1px solid var(--hj16-line); background: #f7f9f7; color: #69726c; font-size: 8.5px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; text-align: left; }
.hj-experience-v16 table tbody td { padding: 10px 11px; border-bottom: 1px solid #edf0ed; color: #343b36; font-size: 10px; vertical-align: middle; }
.hj-experience-v16 table tbody tr:last-child td { border-bottom: 0; }
.hj-experience-v16 table tbody tr:hover td { background: #fbfcfb; }
.hj-experience-v16 .hj-form { display: grid; gap: 11px; }
.hj-experience-v16 .hj-form label { display: grid; gap: 5px; color: #4f5852; font-size: 9.5px; font-weight: 750; }
.hj-experience-v16 input,
.hj-experience-v16 select,
.hj-experience-v16 textarea { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--hj16-line-strong) !important; border-radius: 9px !important; background: #fff !important; color: var(--hj16-ink); box-shadow: none !important; font-size: 11px; }
.hj-experience-v16 textarea { min-height: 100px; resize: vertical; }
.hj-experience-v16 input:focus,
.hj-experience-v16 select:focus,
.hj-experience-v16 textarea:focus { outline: none; border-color: #8eb39e !important; box-shadow: 0 0 0 3px rgba(22,122,89,.08) !important; }
.hj-experience-v16 .hj-form-split { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.hj-experience-v16 .hj-row-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.hj-experience-v16 .hj-row-actions a,
.hj-experience-v16 .hj-row-actions button { min-height: 31px; padding: 0 9px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--hj16-line); border-radius: 8px; background: #fff; color: var(--hj16-forest); font-size: 9px; font-weight: 800; text-decoration: none; }
.hj-experience-v16 .hj-empty-state { min-height: 150px; padding: 26px; display: grid; place-items: center; align-content: center; text-align: center; border: 1px dashed var(--hj16-line-strong); border-radius: 12px; background: var(--hj16-surface-subtle); }
.hj-experience-v16 .hj-empty-state strong { font-size: 12px; }
.hj-experience-v16 .hj-empty-state span,
.hj-experience-v16 .hj-empty-state p { margin-top: 4px; max-width: 480px; color: var(--hj16-muted); font-size: 10px; }
.hj-experience-v16 code,
.hj-experience-v16 .hj-zone-value,
.hj-experience-v16 .hj-file-path,
.hj-experience-v16 .hj-mono { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: .92em; }

/* PHP extension controls stay explicit and usable. */
.hj-experience-v16 .hj-extension-item,
.hj-experience-v16 .hj-selector-extension,
.hj-experience-v16 .hj-cloudlinux-extension,
.hj-experience-v16 .hj-php-extension-item { min-height: 44px !important; padding: 9px 10px !important; display: flex !important; align-items: center !important; gap: 9px !important; border: 1px solid var(--hj16-line) !important; border-radius: 9px !important; background: #fff !important; cursor: pointer !important; }
.hj-experience-v16 .hj-extension-item:hover,
.hj-experience-v16 .hj-selector-extension:hover,
.hj-experience-v16 .hj-cloudlinux-extension:hover,
.hj-experience-v16 .hj-php-extension-item:hover { border-color: #b7c5ba !important; background: var(--hj16-surface-subtle) !important; }
.hj-experience-v16 input[type="checkbox"] { width: 16px !important; height: 16px !important; min-height: 16px !important; padding: 0 !important; display: inline-block !important; visibility: visible !important; opacity: 1 !important; accent-color: var(--hj16-emerald); cursor: pointer; }

/* Internal mechanics are intentionally hidden from customers. */
.hj-experience-v16 .hj-halo-agent-card,
.hj-experience-v16 .hj-php-advanced-grid .hj-sticky-action-panel,
.hj-experience-v16 .hj-redis-agent-panel,
.hj-experience-v16 .hj-redis-about-panel,
.hj-experience-v16 .hj-private-engine-strip,
.hj-experience-v16 .hj-native-adapter-note { display: none !important; }
.hj-experience-v16 .hj-php-advanced-grid { grid-template-columns: 1fr; }

/* Motion and focus */
.hj-experience-v16 :focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(22,122,89,.16) !important; }
@media (prefers-reduced-motion: reduce) {
  .hj-experience-v16 *, .hj-experience-v16 *::before, .hj-experience-v16 *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

@media (max-width: 1240px) {
  .hj-experience-v16 { grid-template-columns: 226px minmax(0,1fr); }
  .hj-experience-v16 .hj-sidebar { width: 226px !important; }
  .hj-experience-v16 .hj-dashboard-layout { grid-template-columns: minmax(0,1fr) 292px; }
  .hj-experience-v16 .hj-service-workspace-bar { grid-template-columns: minmax(210px,.75fr) minmax(360px,1.4fr) auto; }
  .hj-experience-v16 .hj-goal-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hj-experience-v16 .hj-expert-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}

@media (max-width: 1040px) {
  .hj-experience-v16 { display: block !important; }
  .hj-experience-v16 .hj-sidebar { position: fixed; inset: 10px auto 10px 10px; width: min(286px, calc(100vw - 26px)) !important; height: calc(100dvh - 20px); border: 1px solid var(--hj16-line); border-radius: 16px; transform: translateX(-115%); transition: transform .2s ease; box-shadow: 0 24px 70px rgba(18,53,43,.2); z-index: 1002; }
  .hj-experience-v16.hj-sidebar-open .hj-sidebar { transform: translateX(0); }
  .hj-experience-v16 .hj-sidebar-close { display: block; }
  .hj-experience-v16 .hj-sidebar-scrim { position: fixed; inset: 0; z-index: 1001; display: block; border: 0; background: rgba(10,28,22,.32); opacity: 0; visibility: hidden; transition: opacity .2s ease, visibility .2s ease; }
  .hj-experience-v16.hj-sidebar-open .hj-sidebar-scrim { opacity: 1; visibility: visible; }
  .hj-experience-v16 .hj-mobile-nav-toggle { display: block; }
  .hj-experience-v16 .hj-main { padding: 0 20px 34px !important; }
  .hj-experience-v16 .hj-topbar { margin: 0 -20px; padding: 10px 20px !important; }
  .hj-experience-v16 .hj-dashboard-layout,
  .hj-experience-v16 .hj-service-command-layout { grid-template-columns: 1fr; }
  .hj-experience-v16 .hj-dashboard-side-column { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .hj-experience-v16 .hj-service-command-side { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .hj-experience-v16 .hj-service-workspace-bar { grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "identity controls" "tabs tabs"; }
  .hj-experience-v16 .hj-service-workspace-identity { grid-area: identity; }
  .hj-experience-v16 .hj-service-workspace-tabs { grid-area: tabs; justify-content: flex-start; padding-top: 8px; border-top: 1px solid var(--hj16-line); }
  .hj-experience-v16 .hj-service-workspace-controls { grid-area: controls; }
  .hj-experience-v16 .hj-page-grid-2 { grid-template-columns: 1fr; }
  .hj-experience-v16 .hj-sticky-action-panel { position: static; }
}

@media (max-width: 780px) {
  .hj-experience-v16.hj-shell-embedded { border: 0; border-radius: 0; }
  .hj-experience-v16 .hj-main { padding: 0 14px 28px !important; }
  .hj-experience-v16 .hj-topbar { min-height: 64px !important; margin: 0 -14px; padding: 8px 14px !important; }
  .hj-experience-v16 .hj-command-search { min-width: 0; }
  .hj-experience-v16 .hj-command-search kbd,
  .hj-experience-v16 .hj-topbar-text-link,
  .hj-experience-v16 .hj-topbar-divider,
  .hj-experience-v16 .hj-topbar-right .hj-icon-button:not(.hj-notification-button) { display: none; }
  .hj-experience-v16 .hj-topbar-profile { min-width: 38px; width: 38px; padding: 2px; grid-template-columns: 34px; }
  .hj-experience-v16 .hj-topbar-profile > span:not(.hj-user-avatar) { display: none; }
  .hj-experience-v16 .hj-dashboard-welcome { padding: 25px 0 18px; flex-direction: column; align-items: flex-start; }
  .hj-experience-v16 .hj-dashboard-welcome-actions { width: 100%; }
  .hj-experience-v16 .hj-dashboard-welcome-actions a { flex: 1; }
  .hj-experience-v16 .hj-dashboard-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hj-experience-v16 .hj-dashboard-layout,
  .hj-experience-v16 .hj-dashboard-feed-grid,
  .hj-experience-v16 .hj-dashboard-side-column { grid-template-columns: 1fr; }
  .hj-experience-v16 .hj-service-portfolio-row { grid-template-columns: 38px minmax(0,1fr) auto; }
  .hj-experience-v16 .hj-service-portfolio-actions { grid-column: 2 / -1; }
  .hj-experience-v16 .hj-service-command-card { grid-template-columns: 1fr; }
  .hj-experience-v16 .hj-service-command-status { justify-items: start; }
  .hj-experience-v16 .hj-service-command-actions { width: 100%; }
  .hj-experience-v16 .hj-service-command-actions a { flex: 1; }
  .hj-experience-v16 .hj-service-command-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hj-experience-v16 .hj-service-command-metrics > div:nth-child(3) { border-left: 0; border-top: 1px solid var(--hj16-line); }
  .hj-experience-v16 .hj-service-command-metrics > div:nth-child(4) { border-top: 1px solid var(--hj16-line); }
  .hj-experience-v16 .hj-service-command-side { grid-template-columns: 1fr; }
  .hj-experience-v16 .hj-expert-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hj-experience-v16 .hj-tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 520px) {
  .hj-experience-v16 .hj-dashboard-welcome h1 { font-size: 32px; }
  .hj-experience-v16 .hj-dashboard-stats,
  .hj-experience-v16 .hj-dashboard-action-grid,
  .hj-experience-v16 .hj-goal-grid,
  .hj-experience-v16 .hj-service-essential-grid,
  .hj-experience-v16 .hj-expert-grid,
  .hj-experience-v16 .hj-tool-grid,
  .hj-experience-v16 .hj-form-split { grid-template-columns: 1fr; }
  .hj-experience-v16 .hj-dashboard-stat { min-height: 92px; }
  .hj-experience-v16 .hj-service-workspace-bar { grid-template-columns: 1fr; grid-template-areas: "identity" "controls" "tabs"; }
  .hj-experience-v16 .hj-service-workspace-controls { justify-content: stretch; }
  .hj-experience-v16 .hj-service-workspace-select { flex: 1; }
  .hj-experience-v16 .hj-service-workspace-select select { width: 100%; max-width: none; }
  .hj-experience-v16 .hj-service-visit { display: none; }
  .hj-experience-v16 .hj-service-command-actions { flex-direction: column; }
  .hj-experience-v16 .hj-service-command-actions a { width: 100%; }
  .hj-experience-v16 .hj-service-command-metrics { grid-template-columns: 1fr; }
  .hj-experience-v16 .hj-service-command-metrics > div { border-left: 0 !important; border-top: 1px solid var(--hj16-line); }
  .hj-experience-v16 .hj-service-command-metrics > div:first-child { border-top: 0; }
  .hj-experience-v16 .hj-expert-drawer summary > span { grid-template-columns: 1fr; }
  .hj-experience-v16 .hj-expert-drawer summary em { display: none; }
}

/* ========================================================================== 
   HostingJet 0.16.0 — Experience refinement layer
   Command palette, human-scale typography, contextual workbench, compact pages.
   ========================================================================== */

html.hj-command-locked { overflow: hidden; }
.hj-command-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: grid;
  place-items: start center;
  padding: min(13vh, 120px) 20px 24px;
  opacity: 0;
  visibility: hidden;
  transition: opacity .16s ease, visibility .16s ease;
}
.hj-command-overlay.is-open { opacity: 1; visibility: visible; }
.hj-command-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(8, 19, 15, .48);
  backdrop-filter: blur(9px);
  cursor: default;
}
.hj-command-panel {
  position: relative;
  width: min(700px, 100%);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.82);
  border-radius: 20px;
  background: rgba(255,255,255,.985);
  box-shadow: 0 34px 100px rgba(5, 24, 18, .26), 0 0 0 1px rgba(12, 55, 42, .1);
  transform: translateY(-12px) scale(.985);
  transition: transform .18s ease;
}
.hj-command-overlay.is-open .hj-command-panel { transform: translateY(0) scale(1); }
.hj-command-panel > header {
  min-height: 78px;
  padding: 15px 18px;
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) auto;
  align-items: center;
  gap: 13px;
  border-bottom: 1px solid #e6ebe6;
  background: linear-gradient(135deg, #fbfdf9 0%, #f2f8ef 100%);
}
.hj-command-symbol {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: #12352b;
  color: #d7f66a;
  font: 800 18px/1 Manrope, Inter, sans-serif;
}
.hj-command-panel header > div { min-width: 0; display: grid; gap: 2px; }
.hj-command-panel header strong { font: 800 16px/1.25 Manrope, Inter, sans-serif; color: #151916; }
.hj-command-panel header small { color: #6d766f; font-size: 12px; }
.hj-command-panel header kbd,
.hj-command-panel footer b {
  border: 1px solid #d9dfda;
  border-bottom-color: #c8d0ca;
  border-radius: 7px;
  background: #fff;
  color: #69716c;
  box-shadow: 0 1px 1px rgba(13,40,31,.06);
  font: 700 10px/1 Inter, sans-serif;
}
.hj-command-panel header kbd { padding: 7px 8px; }
.hj-command-results { max-height: min(58vh, 530px); overflow: auto; padding: 8px; scrollbar-width: thin; }
.hj-command-results a {
  min-height: 58px;
  padding: 8px 10px;
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) auto;
  align-items: center;
  gap: 11px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: #253029;
  text-decoration: none;
}
.hj-command-results a:hover,
.hj-command-results a.is-selected {
  border-color: #d9e4da;
  background: #f3f8f1;
  box-shadow: inset 3px 0 #d7f66a;
}
.hj-command-result-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid #dfe5df;
  border-radius: 10px;
  background: #fff;
  color: #175943;
}
.hj-command-result-icon svg { width: 18px; height: 18px; }
.hj-command-results a > span:nth-child(2) { min-width: 0; display: grid; gap: 2px; }
.hj-command-results a strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.hj-command-results a small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #778079; font-size: 11px; }
.hj-command-results a > b { color: #89928c; font-size: 12px; }
.hj-command-dot { width: 7px; height: 7px; border-radius: 50%; background: #167a59; }
.hj-command-empty { padding: 42px 24px; display: grid; gap: 5px; text-align: center; }
.hj-command-empty strong { font-size: 14px; }
.hj-command-empty span { color: #78817b; font-size: 12px; }
.hj-command-panel > footer {
  min-height: 42px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  gap: 16px;
  border-top: 1px solid #e7ebe7;
  background: #fafbfa;
  color: #7b847e;
  font-size: 10px;
}
.hj-command-panel footer span { display: inline-flex; align-items: center; gap: 5px; }
.hj-command-panel footer b { padding: 4px 5px; }

.hj-experience-v16 { font-size: 14px; }
.hj-experience-v16 .hj-main { max-width: none; }
.hj-experience-v16 .hj-topbar { min-height: 72px !important; }
.hj-experience-v16 .hj-command-search { height: 42px; }
.hj-experience-v16 .hj-command-search input { font-size: 13px; }
.hj-experience-v16 .hj-topbar-text-link,
.hj-experience-v16 .hj-topbar-profile strong { font-size: 12px; }
.hj-experience-v16 .hj-topbar-profile small { font-size: 10px; }
.hj-experience-v16 .hj-sidebar-nav a { min-height: 43px; }
.hj-experience-v16 .hj-nav-label { font-size: 13px; }
.hj-experience-v16 .hj-nav-section { font-size: 10px; }
.hj-experience-v16 .hj-sidebar-product > strong { font-size: 13px; }
.hj-experience-v16 .hj-sidebar-product > small,
.hj-experience-v16 .hj-sidebar-product-foot a { font-size: 11px; }
.hj-experience-v16 .hj-user-copy strong { font-size: 12px; }
.hj-experience-v16 .hj-user-copy small { font-size: 10px; }

.hj-experience-v16 .hj-dashboard-welcome,
.hj-experience-v16 .hj-dashboard-stats,
.hj-experience-v16 .hj-dashboard-layout,
.hj-experience-v16 .hj-page-context,
.hj-experience-v16 .hj-breadcrumbs,
.hj-experience-v16 .hj-page-title-row,
.hj-experience-v16 .hj-service-workspace-bar,
.hj-experience-v16 .hj-service-studio,
.hj-experience-v16 .hj-page-grid {
  width: min(1480px, 100%);
  margin-left: auto;
  margin-right: auto;
}
.hj-experience-v16 .hj-dashboard-welcome { padding-top: 38px; padding-bottom: 22px; }
.hj-experience-v16 .hj-dashboard-welcome h1 { font-size: clamp(30px, 3vw, 46px); line-height: 1.05; letter-spacing: -.055em; }
.hj-experience-v16 .hj-dashboard-welcome p { max-width: 720px; margin-top: 10px; color: #657069; font-size: 14px; line-height: 1.65; }
.hj-experience-v16 .hj-dashboard-welcome-actions a { min-height: 44px; padding-inline: 15px; font-size: 12px; }
.hj-experience-v16 .hj-dashboard-stats { gap: 12px; }
.hj-experience-v16 .hj-dashboard-stat { min-height: 116px; padding: 17px; }
.hj-experience-v16 .hj-dashboard-stat small { font-size: 11px; }
.hj-experience-v16 .hj-dashboard-stat strong { font-size: 25px; }
.hj-experience-v16 .hj-dashboard-stat em { font-size: 10.5px; }
.hj-experience-v16 .hj-dashboard-stat-icon { width: 42px; height: 42px; }
.hj-experience-v16 .hj-dashboard-stat-icon svg { width: 19px; height: 19px; }
.hj-experience-v16 .hj-dashboard-layout { gap: 14px; }
.hj-experience-v16 .hj-panel { border-radius: 16px; box-shadow: 0 1px 2px rgba(18,53,43,.035), 0 12px 30px rgba(18,53,43,.025); }
.hj-experience-v16 .hj-panel-head h2 { font-size: 18px; line-height: 1.2; }
.hj-experience-v16 .hj-panel-head p,
.hj-experience-v16 .hj-copy { font-size: 12.5px; line-height: 1.55; }
.hj-experience-v16 .hj-section-kicker { font-size: 9.5px; letter-spacing: .11em; }
.hj-experience-v16 .hj-panel-link { font-size: 11px; }
.hj-experience-v16 .hj-service-portfolio-row { min-height: 72px; }
.hj-experience-v16 .hj-service-portfolio-main strong { font-size: 13px; }
.hj-experience-v16 .hj-service-portfolio-main small { font-size: 10.5px; }
.hj-experience-v16 .hj-service-portfolio-actions a { min-height: 34px; padding-inline: 10px; font-size: 10.5px; }
.hj-experience-v16 .hj-dashboard-action-grid a { min-height: 82px; padding: 13px; }
.hj-experience-v16 .hj-dashboard-action-grid strong { font-size: 12px; }
.hj-experience-v16 .hj-dashboard-action-grid small { font-size: 10px; }
.hj-experience-v16 .hj-feed-item { min-height: 62px; }
.hj-experience-v16 .hj-feed-item strong { font-size: 11.5px; }
.hj-experience-v16 .hj-feed-item small,
.hj-experience-v16 .hj-feed-item time { font-size: 9.5px; }

.hj-experience-v16 .hj-breadcrumbs { padding-top: 22px; font-size: 11px; }
.hj-experience-v16 .hj-page-title-row { min-height: 112px; padding: 20px 0 16px; }
.hj-experience-v16 .hj-page-heading h1 { font-size: clamp(28px, 2.7vw, 40px); }
.hj-experience-v16 .hj-page-subtitle { max-width: 820px; font-size: 13px; line-height: 1.55; }
.hj-experience-v16 .hj-service-workspace-bar {
  position: sticky;
  top: 72px;
  z-index: 32;
  min-height: 70px;
  margin-bottom: 16px;
  border: 1px solid rgba(216,224,217,.94);
  border-radius: 15px;
  background: rgba(255,255,255,.965);
  box-shadow: 0 8px 28px rgba(18,53,43,.06);
  backdrop-filter: blur(16px);
}
.hj-experience-v16 .hj-service-workspace-copy strong { font-size: 12.5px; }
.hj-experience-v16 .hj-service-workspace-copy small,
.hj-experience-v16 .hj-service-workspace-copy em { font-size: 9.5px; }
.hj-experience-v16 .hj-service-workspace-tabs a { min-height: 38px; padding-inline: 11px; font-size: 10.5px; }
.hj-experience-v16 .hj-service-workspace-tabs a svg { width: 15px; height: 15px; }
.hj-experience-v16 .hj-service-command-card { border-radius: 18px; }
.hj-experience-v16 .hj-service-command-identity h2 { font-size: clamp(24px, 2.5vw, 36px); }
.hj-experience-v16 .hj-service-command-identity p { font-size: 12px; }
.hj-experience-v16 .hj-service-command-status span { font-size: 11px; }
.hj-experience-v16 .hj-service-command-status small { font-size: 9.5px; }
.hj-experience-v16 .hj-service-command-metrics span { font-size: 9.5px; }
.hj-experience-v16 .hj-service-command-metrics strong { font-size: 19px; }
.hj-experience-v16 .hj-service-command-metrics small { font-size: 9px; }
.hj-experience-v16 .hj-goal-grid a,
.hj-experience-v16 .hj-service-essential-grid a,
.hj-experience-v16 .hj-expert-grid a { transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease; }
.hj-experience-v16 .hj-goal-grid a:hover,
.hj-experience-v16 .hj-service-essential-grid a:hover,
.hj-experience-v16 .hj-expert-grid a:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(18,53,43,.07); }
.hj-experience-v16 .hj-goal-grid strong,
.hj-experience-v16 .hj-service-essential-grid strong,
.hj-experience-v16 .hj-expert-grid strong { font-size: 12px; }
.hj-experience-v16 .hj-goal-grid small,
.hj-experience-v16 .hj-service-essential-grid small,
.hj-experience-v16 .hj-expert-grid small { font-size: 10px; line-height: 1.45; }
.hj-experience-v16 .hj-service-detail-list span { font-size: 10px; }
.hj-experience-v16 .hj-service-detail-list strong { font-size: 11px; }
.hj-experience-v16 .hj-expert-drawer summary strong { font-size: 12.5px; }
.hj-experience-v16 .hj-expert-drawer summary em { font-size: 10px; }

.hj-experience-v16 input[type="text"],
.hj-experience-v16 input[type="email"],
.hj-experience-v16 input[type="password"],
.hj-experience-v16 input[type="number"],
.hj-experience-v16 input[type="url"],
.hj-experience-v16 input[type="search"],
.hj-experience-v16 select,
.hj-experience-v16 textarea { min-height: 42px; font-size: 12px; }
.hj-experience-v16 .hj-primary-button,
.hj-experience-v16 .hj-secondary-button,
.hj-experience-v16 button,
.hj-experience-v16 input[type="submit"] { font-size: 11.5px; }
.hj-experience-v16 .hj-table-wrap,
.hj-experience-v16 .hj-native-table-wrap,
.hj-experience-v16 .hj-file-browser,
.hj-experience-v16 .hj-php-extension-grid,
.hj-experience-v16 .hj-tool-rows,
.hj-experience-v16 .hj-data-list { max-height: 560px; overflow: auto; scrollbar-width: thin; }
.hj-experience-v16 table th { font-size: 10px; }
.hj-experience-v16 table td { font-size: 11px; }
.hj-experience-v16 code,
.hj-experience-v16 .hj-code,
.hj-experience-v16 .hj-file-path { font-family: "JetBrains Mono", ui-monospace, monospace; }

/* Native controls must stay visible and usable, especially PHP extension toggles. */
.hj-experience-v16 input[type="checkbox"] {
  appearance: auto !important;
  -webkit-appearance: checkbox !important;
  width: 17px !important;
  height: 17px !important;
  min-width: 17px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  accent-color: #167a59;
}

@media (max-width: 1180px) {
  .hj-experience-v16 .hj-service-workspace-bar { top: 70px; }
  .hj-experience-v16 .hj-dashboard-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .hj-command-overlay { padding: 70px 10px 10px; }
  .hj-command-panel { border-radius: 16px; }
  .hj-command-panel > header { min-height: 70px; grid-template-columns: 38px minmax(0,1fr); padding: 12px; }
  .hj-command-panel header kbd { display: none; }
  .hj-command-symbol { width: 38px; height: 38px; }
  .hj-command-panel > footer { display: none; }
  .hj-command-results { max-height: 65vh; }
  .hj-experience-v16 .hj-dashboard-welcome { padding-top: 24px; }
  .hj-experience-v16 .hj-dashboard-stats { grid-template-columns: 1fr 1fr; }
  .hj-experience-v16 .hj-dashboard-stat { min-height: 104px; padding: 13px; }
  .hj-experience-v16 .hj-dashboard-stat strong { font-size: 21px; }
  .hj-experience-v16 .hj-service-workspace-bar { position: relative; top: auto; }
  .hj-experience-v16 .hj-table-wrap,
  .hj-experience-v16 .hj-native-table-wrap,
  .hj-experience-v16 .hj-file-browser,
  .hj-experience-v16 .hj-php-extension-grid,
  .hj-experience-v16 .hj-tool-rows,
  .hj-experience-v16 .hj-data-list { max-height: none; }
}

/* HostingJet Actions — intent-first task launcher */
.hj-command-panel > header {
  grid-template-columns: 42px minmax(0,1fr) auto;
}
.hj-command-input-wrap { min-width: 0; display: grid; gap: 3px; }
.hj-command-input-wrap > span { color: #647068; font-size: 9.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.hj-command-input {
  width: 100%;
  height: 34px;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #151916 !important;
  font: 750 16px/1.2 Manrope, Inter, sans-serif !important;
}
.hj-command-input::placeholder { color: #8b948e; opacity: 1; }
.hj-command-suggestions {
  min-height: 45px;
  padding: 8px 14px;
  display: flex;
  align-items: center;
  gap: 7px;
  overflow-x: auto;
  border-bottom: 1px solid #e7ebe7;
  background: #fbfcfb;
  scrollbar-width: none;
}
.hj-command-suggestions::-webkit-scrollbar { display: none; }
.hj-command-suggestions > span { flex: 0 0 auto; color: #849087; font-size: 9.5px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
.hj-command-suggestions button {
  min-height: 28px !important;
  padding: 0 9px !important;
  flex: 0 0 auto;
  border: 1px solid #dfe5df !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #415047 !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  cursor: pointer;
}
.hj-command-suggestions button:hover { border-color: #b9c8bc !important; background: #f2f7f1 !important; color: #12352b !important; }
.hj-command-panel > footer em { margin-left: auto; color: #929a95; font-size: 9px; font-style: normal; }

.hj-experience-v16 .hj-intent-console {
  width: min(1480px, 100%);
  margin: 0 auto 16px;
  padding: 8px;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 8px;
  border: 1px solid #dce4dd;
  border-radius: 17px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 16px 44px rgba(18,53,43,.055), inset 0 1px rgba(255,255,255,.85);
}
.hj-experience-v16 .hj-intent-console-main {
  min-height: 72px;
  padding: 10px 13px !important;
  display: grid;
  grid-template-columns: 44px minmax(0,1fr) auto;
  gap: 12px;
  align-items: center;
  border: 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg,#12352b 0%,#0b281f 100%) !important;
  color: #fff !important;
  text-align: left;
  box-shadow: none !important;
  cursor: pointer;
}
.hj-experience-v16 .hj-intent-console-main:hover { transform: none; background: linear-gradient(135deg,#174637 0%,#0d3025 100%) !important; }
.hj-experience-v16 .hj-intent-console-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: var(--hj16-lime);
  color: var(--hj16-forest);
}
.hj-experience-v16 .hj-intent-console-icon svg { width: 21px; height: 21px; }
.hj-experience-v16 .hj-intent-console-copy { min-width: 0; display: grid; gap: 1px; }
.hj-experience-v16 .hj-intent-console-copy small { color: var(--hj16-lime); font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.hj-experience-v16 .hj-intent-console-copy strong { font: 800 16px/1.25 Manrope,Inter,sans-serif; letter-spacing: -.02em; }
.hj-experience-v16 .hj-intent-console-copy em { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: rgba(255,255,255,.66); font-size: 10.5px; font-style: normal; }
.hj-experience-v16 .hj-intent-console-shortcut { display: flex; align-items: center; gap: 4px; }
.hj-experience-v16 .hj-intent-console-shortcut kbd { min-width: 25px; padding: 6px; border: 1px solid rgba(255,255,255,.16); border-radius: 7px; background: rgba(255,255,255,.08); color: rgba(255,255,255,.78); text-align: center; font: 700 9px/1 Inter,sans-serif; }
.hj-experience-v16 .hj-intent-suggestions { display: grid; grid-template-columns: repeat(2,minmax(136px,1fr)); gap: 6px; }
.hj-experience-v16 .hj-intent-suggestions button {
  min-height: 32px;
  padding: 0 10px !important;
  display: flex;
  align-items: center;
  gap: 7px;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  background: var(--hj16-surface-subtle) !important;
  color: #48534c !important;
  box-shadow: none !important;
  font-size: 9.5px !important;
  font-weight: 720 !important;
  white-space: nowrap;
  cursor: pointer;
}
.hj-experience-v16 .hj-intent-suggestions button:hover { border-color: #d4ddd5 !important; background: #fff !important; color: var(--hj16-forest) !important; }
.hj-experience-v16 .hj-intent-suggestions svg { width: 14px; height: 14px; color: var(--hj16-emerald); }

.hj-experience-v16 .hj-goal-grid a { grid-template-rows: auto auto auto; }
.hj-experience-v16 .hj-goal-state {
  grid-column: 1 / -1;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #5f6d64;
  font-size: 9px;
  font-style: normal;
  font-weight: 750;
}
.hj-experience-v16 .hj-goal-state i { width: 6px; height: 6px; border-radius: 50%; background: var(--hj16-emerald); box-shadow: 0 0 0 3px rgba(22,122,89,.09); }
.hj-experience-v16 .hj-goal-grid a.is-primary .hj-goal-state { color: rgba(255,255,255,.72); }
.hj-experience-v16 .hj-goal-grid a.is-primary .hj-goal-state i { background: var(--hj16-lime); box-shadow: 0 0 0 3px rgba(215,246,106,.13); }
.hj-experience-v16 .hj-goal-grid b { grid-column: auto; position: absolute; right: 14px; bottom: 13px; }
.hj-experience-v16 .hj-goal-grid a { position: relative; padding-bottom: 34px; }

@media (max-width: 980px) {
  .hj-experience-v16 .hj-intent-console { grid-template-columns: 1fr; }
  .hj-experience-v16 .hj-intent-suggestions { grid-template-columns: repeat(4,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .hj-command-input { font-size: 14px !important; }
  .hj-command-suggestions { padding-inline: 10px; }
  .hj-command-panel > footer em { display: none; }
  .hj-experience-v16 .hj-intent-console-main { grid-template-columns: 40px minmax(0,1fr); }
  .hj-experience-v16 .hj-intent-console-shortcut { display: none; }
  .hj-experience-v16 .hj-intent-console-copy em { white-space: normal; line-height: 1.35; }
  .hj-experience-v16 .hj-intent-suggestions { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 440px) {
  .hj-experience-v16 .hj-intent-suggestions { grid-template-columns: 1fr; }
}

/* ========================================================================== 
   HostingJet Mail v0.17 — immersive first-party mail workspace
   ========================================================================== */

.hj-page-current-mail { background: #edf3f0 !important; }
.hj-page-current-mail > .hj-sidebar,
.hj-page-current-mail > .hj-sidebar-scrim,
.hj-page-current-mail .hj-main > .hj-topbar,
.hj-page-current-mail .hj-main > .hj-breadcrumbs,
.hj-page-current-mail .hj-main > .hj-page-title-row,
.hj-page-current-mail .hj-main > .hj-service-workspace-bar,
.hj-page-current-mail .hj-main > .hj-page-context { display: none !important; }
.hj-page-current-mail .hj-main {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: #f3f7f5 !important;
}
.hj-page-current-mail .hj-main > .hj-mail-product {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

.hj-mail-product {
  --hjm-ink: #15211d;
  --hjm-muted: #6d7a74;
  --hjm-faint: #94a19b;
  --hjm-line: #e2e9e5;
  --hjm-line-strong: #d3ded8;
  --hjm-surface: #ffffff;
  --hjm-soft: #f7faf8;
  --hjm-soft-green: #edf7f1;
  --hjm-forest: #087453;
  --hjm-forest-deep: #06553f;
  --hjm-green: #12a570;
  --hjm-lime: #d8f56e;
  --hjm-gold: #f4b52c;
  --hjm-red: #d65255;
  width: 100%;
  min-height: 100vh;
  height: 100vh;
  display: grid;
  grid-template-rows: 72px minmax(0, 1fr);
  overflow: hidden;
  color: var(--hjm-ink);
  background: #f6f9f7;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.hj-shell-embedded.hj-page-current-mail .hj-mail-product {
  min-height: 920px;
  height: min(100vh, 1080px);
}

.hj-mail-topbar {
  min-width: 0;
  display: grid;
  grid-template-columns: 248px minmax(320px, 680px) minmax(330px, 1fr);
  align-items: center;
  gap: 18px;
  padding: 0 24px;
  border-bottom: 1px solid var(--hjm-line);
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(18px);
  box-shadow: 0 1px 0 rgba(16, 52, 39, .02);
  z-index: 45;
}

.hj-mail-brand-zone,
.hj-mail-brand-zone > div,
.hj-mail-top-actions,
.hj-mail-global-search,
.hj-mailbox-switcher,
.hj-mail-message-actions,
.hj-mail-sender-row,
.hj-mail-subject-row,
.hj-mail-list-toolbar,
.hj-mail-compose-tools,
.hj-mail-connect-actions,
.hj-mail-connect-assurance { display: flex; align-items: center; }

.hj-mail-brand-zone { min-width: 0; gap: 10px; }
.hj-mail-brand-zone > div { min-width: 0; display: grid; gap: 1px; }
.hj-mail-brand-zone strong { font: 800 17px/1.2 Manrope, Inter, sans-serif; letter-spacing: -.035em; color: #14231e; }
.hj-mail-brand-zone small { font-size: 9.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: #8a9690; }
.hj-mail-back {
  width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 auto;
  border: 1px solid var(--hjm-line); border-radius: 10px; background: #fff; color: #607069;
  transition: .16s ease; text-decoration: none;
}
.hj-mail-back:hover { border-color: #bfcfc7; color: var(--hjm-forest); background: var(--hjm-soft-green); }
.hj-mail-back svg { width: 16px; height: 16px; transform: rotate(180deg); }
.hj-mail-brand-symbol {
  width: 31px; height: 31px; display: grid; grid-template-columns: repeat(3, 6px); align-items: center; justify-content: center; gap: 2px;
  border-radius: 10px; background: linear-gradient(145deg, #06563e, #0a7d59); box-shadow: 0 7px 18px rgba(7, 101, 73, .2); transform: skew(-7deg);
}
.hj-mail-brand-symbol i { width: 6px; border-radius: 3px; background: #cfff86; }
.hj-mail-brand-symbol i:nth-child(1) { height: 11px; }
.hj-mail-brand-symbol i:nth-child(2) { height: 20px; }
.hj-mail-brand-symbol i:nth-child(3) { height: 15px; }

.hj-mail-global-search {
  width: 100%; height: 42px; gap: 10px; padding: 0 13px; border: 1px solid #e2e9e5; border-radius: 12px;
  background: #f7f9f8; color: #718079; transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}
.hj-mail-global-search:focus-within { border-color: #9acbb9; background: #fff; box-shadow: 0 0 0 3px rgba(18, 165, 112, .1); }
.hj-mail-global-search svg { width: 18px; height: 18px; }
.hj-mail-global-search input { width: 100%; min-width: 0; height: 38px !important; min-height: 38px !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; color: #22322c; font-size: 12.5px !important; }
.hj-mail-global-search input::placeholder { color: #929d98; }
.hj-mail-global-search kbd { min-width: 24px; height: 22px; padding: 0 7px; display: grid; place-items: center; border: 1px solid #dfe6e2; border-radius: 6px; background: #fff; color: #86918c; font: 700 10px/1 Inter, sans-serif; }

.hj-mail-top-actions { min-width: 0; justify-content: flex-end; gap: 7px; }
.hj-mailbox-switcher { height: 38px; max-width: 260px; padding: 0 8px 0 11px; border: 1px solid var(--hjm-line); border-radius: 10px; background: #fff; }
.hj-mailbox-switcher::before { content: ''; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--hjm-green); box-shadow: 0 0 0 4px rgba(18, 165, 112, .1); }
.hj-mailbox-switcher select { min-width: 0; max-width: 215px; height: 34px !important; min-height: 34px !important; padding: 0 22px 0 0 !important; border: 0 !important; background-color: transparent !important; box-shadow: none !important; color: #33423c; font-size: 11.5px !important; font-weight: 650; }
.hj-mail-icon-button {
  position: relative; width: 37px; height: 37px; display: grid; place-items: center; flex: 0 0 auto; padding: 0;
  border: 1px solid transparent; border-radius: 10px; background: transparent; color: #5d6b65; cursor: pointer; transition: .16s ease;
}
.hj-mail-icon-button:hover { border-color: var(--hjm-line); background: var(--hjm-soft-green); color: var(--hjm-forest); }
.hj-mail-icon-button svg { width: 18px; height: 18px; }
.hj-mail-icon-button i { position: absolute; right: 7px; top: 6px; width: 6px; height: 6px; border: 1px solid #fff; border-radius: 50%; background: #aab5b0; }
.hj-mail-icon-button i.is-live { background: var(--hjm-green); box-shadow: 0 0 0 3px rgba(18,165,112,.12); }
.hj-mail-avatar {
  position: relative; width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%;
  background: linear-gradient(145deg, #e4f5ec, #c9ecdc); color: #087052; font: 800 12px/1 Manrope, Inter, sans-serif; border: 1px solid #b8decf;
}
.hj-mail-avatar i { position: absolute; width: 8px; height: 8px; right: -1px; bottom: 1px; border: 2px solid #fff; border-radius: 50%; background: var(--hjm-green); }

.hj-mail-layout { min-width: 0; min-height: 0; display: grid; grid-template-columns: 238px minmax(340px, 395px) minmax(480px, 1fr); overflow: hidden; background: #fff; }
.hj-mail-sidebar,
.hj-mail-list-pane,
.hj-mail-reader { min-width: 0; min-height: 0; overflow: hidden; }

.hj-mail-sidebar {
  display: flex; flex-direction: column; padding: 17px 14px 14px; border-right: 1px solid var(--hjm-line); background: #fbfdfc;
}
.hj-mail-compose-button {
  width: 100%; min-height: 45px; padding: 0 13px; display: grid; grid-template-columns: 24px minmax(0, 1fr) 18px; align-items: center; gap: 8px;
  border: 0; border-radius: 12px; background: linear-gradient(135deg, #087655 0%, #0d8b62 100%); color: #fff; box-shadow: 0 8px 22px rgba(7, 112, 80, .2); cursor: pointer;
  font-size: 12px; text-align: left; transition: transform .16s ease, box-shadow .16s ease;
}
.hj-mail-compose-button:hover { transform: translateY(-1px); box-shadow: 0 12px 26px rgba(7, 112, 80, .25); }
.hj-mail-compose-button > span { font-size: 20px; font-weight: 300; line-height: 1; }
.hj-mail-compose-button strong { font-weight: 750; }
.hj-mail-compose-button svg { width: 16px; height: 16px; opacity: .85; }

.hj-mail-system-folders { display: grid; gap: 2px; margin-top: 16px; }
.hj-mail-system-folders button,
.hj-mail-custom-folders nav button {
  width: 100%; min-height: 38px; padding: 0 10px; display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: center; gap: 9px;
  border: 0; border-radius: 9px; background: transparent; color: #53615b; cursor: pointer; text-align: left; font: 600 11.5px/1.2 Inter, sans-serif; transition: .15s ease;
}
.hj-mail-system-folders button:hover,
.hj-mail-custom-folders nav button:hover { background: #f0f6f2; color: #123d2f; }
.hj-mail-system-folders button.is-active,
.hj-mail-custom-folders nav button.is-active { background: #e8f4ed; color: #087052; box-shadow: inset 3px 0 #12a570; }
.hj-mail-system-folders button svg,
.hj-mail-custom-folders nav button svg { width: 16px; height: 16px; }
.hj-mail-system-folders button b,
.hj-mail-custom-folders nav button b { min-width: 22px; height: 19px; padding: 0 6px; display: grid; place-items: center; border-radius: 7px; background: #edf1ef; color: #718079; font-size: 9.5px; }
.hj-mail-system-folders button.is-active b { background: #d7ecdf; color: #087052; }
.hj-mail-custom-folders { margin-top: 16px; padding-top: 13px; border-top: 1px solid #edf1ef; }
.hj-mail-custom-folders > div { min-height: 27px; padding: 0 8px 6px; display: flex; align-items: center; justify-content: space-between; color: #8a9690; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.hj-mail-custom-folders > div button { width: 24px; height: 24px; border: 0; border-radius: 7px; background: transparent; color: #738078; font-size: 17px; cursor: pointer; }
.hj-mail-custom-folders > div button:hover { background: #edf4ef; color: #087052; }
.hj-mail-custom-folders nav { display: grid; gap: 2px; max-height: 210px; overflow: auto; }
.hj-mail-sidebar-spacer { flex: 1 1 auto; min-height: 15px; }
.hj-mail-storage { padding: 12px; border: 1px solid #e2eae5; border-radius: 12px; background: #fff; box-shadow: 0 6px 20px rgba(17,55,42,.035); }
.hj-mail-storage > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: #77847e; font-size: 9.5px; }
.hj-mail-storage b { color: #31423b; font-size: 10px; }
.hj-mail-storage > i { height: 4px; margin: 9px 0 10px; display: block; overflow: hidden; border-radius: 10px; background: #e9eeeb; }
.hj-mail-storage > i span { width: 0; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, #0d9065, #8fd970); transition: width .3s ease; }
.hj-mail-storage button { width: 100%; padding: 0; border: 0; background: transparent; color: #087052; cursor: pointer; text-align: left; font-size: 10.5px; font-weight: 700; }

.hj-mail-list-pane { position: relative; display: grid; grid-template-rows: 62px auto minmax(0, 1fr) 39px; border-right: 1px solid var(--hjm-line); background: #fff; }
.hj-mail-list-toolbar { gap: 9px; padding: 0 13px; border-bottom: 1px solid #e9eeeb; background: #fff; }
.hj-mail-select-all { position: relative; width: 24px; height: 24px; display: grid; place-items: center; cursor: pointer; }
.hj-mail-select-all input { position: absolute; opacity: 0; }
.hj-mail-select-all span { width: 15px; height: 15px; border: 1.5px solid #a7b2ad; border-radius: 4px; background: #fff; }
.hj-mail-select-all input:checked + span { border-color: var(--hjm-forest); background: var(--hjm-forest); box-shadow: inset 0 0 0 3px #fff; }
.hj-mail-current-folder { min-width: 0; display: grid; gap: 1px; flex: 1; }
.hj-mail-current-folder strong { color: #1d2b25; font-size: 13px; font-weight: 780; }
.hj-mail-current-folder small { color: #8a9690; font-size: 9px; }
.hj-mail-filter-button { min-height: 30px; padding: 0 8px; display: inline-flex; align-items: center; gap: 5px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #718079; cursor: pointer; font-size: 10px; }
.hj-mail-filter-button:hover { border-color: #e1e8e4; background: #f6f9f7; color: #385347; }
.hj-mail-filter-button svg { width: 14px; height: 14px; }
.hj-mail-sort { width: 73px; min-height: 30px !important; height: 30px !important; padding: 0 18px 0 6px !important; border: 0 !important; background-color: transparent !important; box-shadow: none !important; color: #5d6964; font-size: 9.5px !important; }
.hj-mail-bulkbar { min-height: 38px; padding: 0 12px; align-items: center; gap: 6px; border-bottom: 1px solid #d8e8df; background: #eff8f3; }
.hj-mail-bulkbar:not([hidden]) { display: flex; }
.hj-mail-bulkbar span { margin-right: auto; color: #2f5144; font-size: 10px; }
.hj-mail-bulkbar button { min-height: 26px; padding: 0 8px; border: 1px solid #d5e2db; border-radius: 7px; background: #fff; color: #315345; cursor: pointer; font-size: 9px; }
.hj-mail-message-list { min-height: 0; overflow: auto; scrollbar-width: thin; scrollbar-color: #d7e0db transparent; }
.hj-mail-message {
  position: relative; min-height: 88px; padding: 12px 13px; display: grid; grid-template-columns: 20px 38px minmax(0, 1fr) 24px; align-items: start; gap: 9px;
  border-bottom: 1px solid #edf1ef; background: #fff; cursor: pointer; transition: background .13s ease, box-shadow .13s ease;
}
.hj-mail-message:hover { background: #f8fbf9; }
.hj-mail-message.is-selected { background: #eff8f3; box-shadow: inset 3px 0 #0fa06d; }
.hj-mail-message.is-unread .hj-mail-message-copy > strong,
.hj-mail-message.is-unread .hj-mail-message-subject { color: #17231e; font-weight: 800; }
.hj-mail-message-check { position: relative; width: 17px; height: 17px; margin-top: 4px; }
.hj-mail-message-check input { position: absolute; opacity: 0; }
.hj-mail-message-check span { width: 14px; height: 14px; display: block; border: 1.4px solid #b2bcb7; border-radius: 4px; background: #fff; }
.hj-mail-message-check input:checked + span { border-color: #0a7b58; background: #0a7b58; box-shadow: inset 0 0 0 3px #fff; }
.hj-mail-message-avatar,
.hj-mail-sender-avatar { display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #e6f3ed, #d5e9df); color: #176a50; font: 800 11px/1 Manrope, Inter, sans-serif; border: 1px solid #c9ded4; }
.hj-mail-message-avatar { width: 36px; height: 36px; }
.hj-mail-message-copy { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 8px; row-gap: 2px; }
.hj-mail-message-copy > strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #34423c; font-size: 11.5px; font-weight: 670; }
.hj-mail-message-copy > time { color: #89958f; font-size: 8.8px; }
.hj-mail-message-subject { grid-column: 1 / -1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #405049; font-size: 10.5px; font-weight: 650; }
.hj-mail-message-preview { grid-column: 1 / -1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #89948f; font-size: 9.5px; }
.hj-mail-message-star { width: 24px; height: 24px; padding: 0; border: 0; background: transparent; color: #a8b2ad; cursor: pointer; font-size: 18px; }
.hj-mail-message-star.is-starred { color: var(--hjm-gold); }
.hj-mail-message::before { content: ''; position: absolute; left: 4px; top: 50%; width: 5px; height: 5px; margin-top: -2px; border-radius: 50%; background: transparent; }
.hj-mail-message.is-unread::before { background: var(--hjm-green); }
.hj-mail-message-skeleton { min-height: 88px; padding: 14px; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; border-bottom: 1px solid #eef2ef; }
.hj-mail-message-skeleton > i { width: 36px; height: 36px; border-radius: 50%; background: #edf2ef; animation: hjMailPulse 1.2s ease-in-out infinite; }
.hj-mail-message-skeleton > span { display: grid; align-content: center; gap: 7px; }
.hj-mail-message-skeleton b,
.hj-mail-message-skeleton em,
.hj-mail-message-skeleton small { display: block; height: 7px; border-radius: 10px; background: #edf2ef; animation: hjMailPulse 1.2s ease-in-out infinite; }
.hj-mail-message-skeleton b { width: 42%; } .hj-mail-message-skeleton em { width: 82%; } .hj-mail-message-skeleton small { width: 68%; }
@keyframes hjMailPulse { 50% { opacity: .46; } }
.hj-mail-pagination { min-height: 39px; padding: 0 11px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; border-top: 1px solid #edf1ef; background: #fbfcfb; color: #84908a; font-size: 9.5px; }
.hj-mail-pagination button { width: 27px; height: 27px; border: 1px solid #e0e7e3; border-radius: 8px; background: #fff; color: #5f6c66; cursor: pointer; font-size: 17px; }
.hj-mail-pagination button:disabled { opacity: .35; cursor: default; }

.hj-mail-reader { position: relative; display: block; background: #fff; }
.hj-mail-reader-empty { height: 100%; padding: 60px; display: grid; place-content: center; justify-items: center; text-align: center; background: radial-gradient(circle at 50% 40%, #f0faf4 0, #fff 48%); }
.hj-mail-empty-orbit { position: relative; width: 82px; height: 82px; margin-bottom: 20px; display: grid; place-items: center; border: 1px solid #d7e9df; border-radius: 50%; background: #fff; color: #0a7957; box-shadow: 0 20px 55px rgba(20, 91, 67, .1); }
.hj-mail-empty-orbit::before,
.hj-mail-empty-orbit::after { content: ''; position: absolute; inset: -11px; border: 1px solid rgba(18,165,112,.15); border-radius: 50%; }
.hj-mail-empty-orbit::after { inset: -22px; border-color: rgba(18,165,112,.07); }
.hj-mail-empty-orbit i { position: absolute; width: 8px; height: 8px; right: 1px; top: 12px; border-radius: 50%; background: #d8f56e; box-shadow: 0 0 0 5px rgba(216,245,110,.18); }
.hj-mail-empty-orbit svg { width: 30px; height: 30px; }
.hj-mail-reader-empty h3 { margin: 0 0 7px; color: #1b2c25; font: 800 20px/1.2 Manrope, Inter, sans-serif; letter-spacing: -.03em; }
.hj-mail-reader-empty p { max-width: 430px; margin: 0; color: #73817a; font-size: 11.5px; line-height: 1.65; }
.hj-mail-reader-empty > div { margin-top: 17px; display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; }
.hj-mail-reader-empty > div span { min-height: 25px; padding: 0 9px; display: inline-flex; align-items: center; border: 1px solid #dfe9e3; border-radius: 20px; background: #fff; color: #547065; font-size: 9px; font-weight: 700; }
.hj-mail-reading-surface { height: 100%; min-height: 0; display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto auto; overflow: hidden; }
.hj-mail-message-head { padding: 18px 22px 15px; border-bottom: 1px solid #edf1ef; background: #fff; }
.hj-mail-subject-row { justify-content: space-between; gap: 14px; }
.hj-mail-subject-row h2 { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #18251f; font: 800 18px/1.25 Manrope, Inter, sans-serif; letter-spacing: -.025em; }
.hj-mail-subject-row > button { width: 30px; height: 30px; flex: 0 0 auto; border: 0; background: transparent; color: #9aa59f; cursor: pointer; font-size: 23px; }
.hj-mail-subject-row > button.is-starred { color: var(--hjm-gold); }
.hj-mail-sender-row { margin-top: 14px; gap: 10px; }
.hj-mail-sender-avatar { width: 36px; height: 36px; flex: 0 0 auto; }
.hj-mail-sender-row > div:nth-child(2) { min-width: 0; display: grid; gap: 2px; }
.hj-mail-sender-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #273630; font-size: 11.5px; }
.hj-mail-sender-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #84908a; font-size: 9px; }
.hj-mail-sender-row > time { margin-left: auto; color: #86928c; font-size: 9px; white-space: nowrap; }
.hj-mail-message-actions { margin-left: 7px; gap: 2px; }
.hj-mail-message-actions button { width: 29px; height: 29px; border: 0; border-radius: 8px; background: transparent; color: #607069; cursor: pointer; font-size: 15px; }
.hj-mail-message-actions button:hover { background: #eef5f1; color: #087052; }
.hj-mail-privacy-banner { margin: 12px 20px 0; min-height: 42px; padding: 8px 10px; align-items: center; gap: 9px; border: 1px solid #dcebe3; border-radius: 10px; background: #f1f8f4; color: #4f685d; font-size: 9.5px; }
.hj-mail-privacy-banner:not([hidden]) { display: flex; }
.hj-mail-privacy-banner svg { width: 17px; height: 17px; color: #0b8b61; }
.hj-mail-privacy-banner span { flex: 1; }
.hj-mail-privacy-banner button { border: 0; background: transparent; color: #087052; cursor: pointer; font-size: 9.5px; font-weight: 750; }
.hj-mail-privacy-banner button:last-child { width: 24px; height: 24px; color: #84918b; font-size: 17px; }
.hj-mail-message-frame-wrap { min-height: 0; overflow: hidden; background: #fff; }
.hj-mail-message-frame-wrap iframe { width: 100%; height: 100%; min-height: 300px; border: 0; background: #fff; }
.hj-mail-attachments { padding: 11px 20px 12px; border-top: 1px solid #edf1ef; background: #fff; }
.hj-mail-attachments > div:first-child { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; color: #46564f; font-size: 10px; }
.hj-mail-attachments > div:first-child span { color: #8b9691; }
.hj-mail-attachments > div:last-child { display: flex; flex-wrap: wrap; gap: 7px; }
.hj-mail-attachment { min-height: 42px; min-width: 170px; padding: 7px 10px; display: grid; grid-template-columns: 27px minmax(0,1fr); align-items: center; gap: 8px; border: 1px solid #e0e7e3; border-radius: 9px; background: #fff; color: #405048; text-decoration: none; transition: .14s ease; }
.hj-mail-attachment:hover { border-color: #bad7c9; background: #f5faf7; color: #087052; }
.hj-mail-attachment i { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; background: #fff0ee; color: #da5047; font-style: normal; font-size: 9px; font-weight: 800; }
.hj-mail-attachment span { min-width: 0; display: grid; gap: 1px; }
.hj-mail-attachment strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9.5px; }
.hj-mail-attachment small { color: #8a9690; font-size: 8px; }
.hj-mail-quick-reply { margin: 0 20px 16px; min-height: 48px; padding: 7px 9px; display: flex; align-items: center; gap: 9px; border: 1px solid #dce5e0; border-radius: 12px; background: #fff; box-shadow: 0 6px 20px rgba(12, 70, 50, .035); }
.hj-mail-quick-reply > button { flex: 1; min-height: 34px; border: 0; background: transparent; color: #919c97; cursor: text; text-align: left; font-size: 10.5px; }

.hj-mail-connect-layer,
.hj-mail-compose-layer,
.hj-mail-settings-layer { position: fixed; inset: 0; z-index: 100000; }
.hj-mail-connect-layer { display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 50% 45%, rgba(234,249,241,.94), rgba(242,247,244,.97)); backdrop-filter: blur(14px); }
.hj-mail-connect-layer[hidden] { display: none !important; }
.hj-mail-connect-card { width: min(520px, 100%); padding: 34px; border: 1px solid rgba(255,255,255,.9); border-radius: 24px; background: rgba(255,255,255,.96); box-shadow: 0 32px 90px rgba(15, 64, 47, .18), 0 0 0 1px rgba(12, 86, 61, .08); text-align: center; }
.hj-mail-connect-shield { width: 58px; height: 58px; margin: 0 auto 17px; display: grid; place-items: center; border-radius: 18px; background: linear-gradient(145deg, #e5f8ee, #d1f0e0); color: #087354; box-shadow: 0 12px 28px rgba(12, 117, 83, .14); }
.hj-mail-connect-shield svg { width: 25px; height: 25px; }
.hj-mail-kicker { color: #0a805b; font-size: 9px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.hj-mail-connect-card h2 { max-width: 430px; margin: 7px auto 8px; color: #17251f; font: 800 25px/1.2 Manrope, Inter, sans-serif; letter-spacing: -.04em; }
.hj-mail-connect-card > p { max-width: 430px; margin: 0 auto 20px; color: #6f7d76; font-size: 11px; line-height: 1.65; }
.hj-mail-connect-card > p code { padding: 2px 5px; border-radius: 5px; background: #eef4f0; color: #087052; font: 700 10px/1 JetBrains Mono, monospace; }
.hj-mail-connect-card form { display: grid; gap: 11px; text-align: left; }
.hj-mail-connect-card form > label { display: grid; gap: 5px; color: #53645c; font-size: 9px; font-weight: 750; }
.hj-mail-connect-card form input { width: 100%; min-height: 44px !important; padding: 0 12px !important; border: 1px solid #dae4df !important; border-radius: 10px !important; background: #fff !important; color: #24342d !important; box-shadow: none !important; font-size: 11px !important; }
.hj-mail-connect-card form input:focus { border-color: #8fc8b4 !important; box-shadow: 0 0 0 3px rgba(18,165,112,.09) !important; }
.hj-mail-password-field { position: relative; }
.hj-mail-password-field button { position: absolute; right: 8px; top: 7px; height: 30px; padding: 0 8px; border: 0; border-radius: 7px; background: #eef5f1; color: #087052; cursor: pointer; font-size: 9px; font-weight: 750; }
.hj-mail-connect-submit { min-height: 46px; margin-top: 3px; padding: 0 15px; display: flex; align-items: center; justify-content: center; gap: 9px; border: 0; border-radius: 11px; background: linear-gradient(135deg, #087353, #0d9065); color: #fff; box-shadow: 0 11px 25px rgba(7, 113, 80, .2); cursor: pointer; font-size: 11px; font-weight: 750; }
.hj-mail-connect-submit svg { width: 16px; height: 16px; }
.hj-mail-connect-assurance { margin: 16px 0 0; justify-content: center; flex-wrap: wrap; gap: 6px; }
.hj-mail-connect-assurance span { min-height: 23px; padding: 0 8px; display: inline-flex; align-items: center; border: 1px solid #e1ebe5; border-radius: 20px; background: #f8fbf9; color: #728078; font-size: 8px; }
.hj-mail-legacy-link { display: inline-block; margin-top: 14px; color: #819089 !important; font-size: 9px; }
.hj-mail-connect-actions { justify-content: center; flex-wrap: wrap; gap: 8px; }

.hj-mail-layer-scrim { position: absolute; inset: 0; border: 0; background: rgba(14, 31, 24, .44); backdrop-filter: blur(7px); cursor: default; }
.hj-mail-compose-layer[hidden], .hj-mail-settings-layer[hidden] { display: none !important; }
.hj-mail-composer {
  position: absolute; right: 28px; bottom: 22px; width: min(680px, calc(100vw - 56px)); height: min(670px, calc(100vh - 50px));
  display: grid; grid-template-rows: 58px auto minmax(180px, 1fr) 58px; overflow: hidden; border: 1px solid rgba(255,255,255,.75); border-radius: 18px;
  background: #fff; box-shadow: 0 34px 100px rgba(8, 42, 31, .3), 0 0 0 1px rgba(8,90,62,.1);
}
.hj-mail-composer > header { padding: 0 15px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e8edea; background: linear-gradient(135deg, #f8fbf9, #f1f8f4); }
.hj-mail-composer > header > div:first-child { display: grid; gap: 1px; }
.hj-mail-composer > header strong { color: #183028; font: 800 16px/1.2 Manrope, Inter, sans-serif; }
.hj-mail-composer > header > div:last-child { display: flex; gap: 4px; }
.hj-mail-composer > header button { width: 30px; height: 30px; border: 0; border-radius: 8px; background: transparent; color: #728078; cursor: pointer; font-size: 18px; }
.hj-mail-composer > header button:hover { background: #e7f1eb; color: #087052; }
.hj-mail-compose-fields { position: relative; padding: 8px 14px 5px; border-bottom: 1px solid #edf1ef; }
.hj-mail-compose-fields label { min-height: 40px; display: grid; grid-template-columns: 58px minmax(0,1fr); align-items: center; border-bottom: 1px solid #f0f3f1; }
.hj-mail-compose-fields label:last-child { border-bottom: 0; }
.hj-mail-compose-fields label > span { color: #75817b; font-size: 9.5px; font-weight: 700; }
.hj-mail-compose-fields input { min-height: 38px !important; height: 38px !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; color: #263730 !important; font-size: 11px !important; }
.hj-mail-cc-links { position: absolute; right: 13px; top: 13px; display: flex; gap: 2px; }
.hj-mail-cc-links button { border: 0; background: transparent; color: #73817a; cursor: pointer; font-size: 9px; }
.hj-mail-compose-editor { min-height: 0; padding: 18px; overflow: auto; color: #273730; outline: 0; font-size: 12px; line-height: 1.65; }
.hj-mail-compose-editor:empty::before { content: 'Write your message…'; color: #a0aaa5; }
.hj-mail-composer > footer { padding: 0 13px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #e8edea; background: #fafcfb; }
.hj-mail-compose-tools { min-width: 0; gap: 3px; }
.hj-mail-compose-tools button,
.hj-mail-attach-button { width: 30px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: #607069; cursor: pointer; font-size: 12px; }
.hj-mail-compose-tools button:hover,
.hj-mail-attach-button:hover { background: #eaf3ee; color: #087052; }
.hj-mail-attach-button input { display: none; }
.hj-mail-compose-tools > span { max-width: 260px; margin-left: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #8b9691; font-size: 8.5px; }
.hj-mail-send-button { min-width: 92px; min-height: 38px; padding: 0 13px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; border-radius: 10px; background: linear-gradient(135deg, #087353, #0d9065); color: #fff; cursor: pointer; font-size: 10px; font-weight: 750; box-shadow: 0 7px 16px rgba(8, 115, 83, .18); }
.hj-mail-send-button svg { width: 15px; height: 15px; }

.hj-mail-settings-drawer { position: absolute; right: 0; top: 0; bottom: 0; width: min(430px, 100vw); overflow: auto; padding-bottom: 25px; background: #fff; box-shadow: -28px 0 80px rgba(10,42,31,.2); animation: hjMailDrawer .18s ease both; }
@keyframes hjMailDrawer { from { transform: translateX(24px); opacity: .5; } }
.hj-mail-settings-drawer > header { min-height: 74px; padding: 0 20px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e8edea; background: #fbfdfc; }
.hj-mail-settings-drawer > header div { display: grid; gap: 2px; }
.hj-mail-settings-drawer h2 { margin: 0; color: #1a2b24; font: 800 20px/1.2 Manrope, Inter, sans-serif; letter-spacing: -.03em; }
.hj-mail-settings-drawer > header button { width: 34px; height: 34px; border: 0; border-radius: 10px; background: #eef4f0; color: #62716a; cursor: pointer; font-size: 22px; }
.hj-mail-settings-drawer > section { padding: 18px 20px; border-bottom: 1px solid #edf1ef; }
.hj-mail-settings-drawer h3 { margin: 0 0 12px; color: #52625b; font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.hj-mail-settings-mailbox { display: grid; grid-template-columns: 38px minmax(0,1fr); align-items: center; gap: 10px; }
.hj-mail-settings-mailbox > div { min-width: 0; display: grid; gap: 2px; }
.hj-mail-settings-mailbox strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #263730; font-size: 11.5px; }
.hj-mail-settings-mailbox small { color: #89958f; font-size: 9px; }
.hj-mail-danger-link { margin-top: 12px; padding: 0; border: 0; background: transparent; color: #c2474a; cursor: pointer; font-size: 9.5px; font-weight: 700; }
.hj-mailbox-settings-list { display: grid; gap: 5px; }
.hj-mailbox-settings-list a { min-height: 54px; padding: 7px 8px; display: grid; grid-template-columns: 34px minmax(0,1fr) 8px; align-items: center; gap: 9px; border: 1px solid #e4ebe7; border-radius: 10px; background: #fff; color: #33443c; text-decoration: none; }
.hj-mailbox-settings-list a:hover,
.hj-mailbox-settings-list a.is-active { border-color: #bcd8cb; background: #f1f8f4; }
.hj-mailbox-settings-list a > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: #e6f3ed; color: #087052; font-size: 10px; font-weight: 800; }
.hj-mailbox-settings-list a > div { min-width: 0; display: grid; gap: 1px; }
.hj-mailbox-settings-list strong,
.hj-mailbox-settings-list small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-mailbox-settings-list strong { font-size: 10px; }
.hj-mailbox-settings-list small { color: #89958f; font-size: 8px; }
.hj-mailbox-settings-list i { width: 7px; height: 7px; border-radius: 50%; background: #b7c0bc; }
.hj-mailbox-settings-list i.is-online { background: var(--hjm-green); box-shadow: 0 0 0 3px rgba(18,165,112,.1); }
.hj-mail-admin-action { margin-top: 6px; border: 1px solid #e2e9e5; border-radius: 10px; background: #fbfdfc; }
.hj-mail-admin-action summary { min-height: 39px; padding: 0 11px; display: flex; align-items: center; cursor: pointer; color: #355046; font-size: 10px; font-weight: 700; }
.hj-mail-admin-action .hj-tool-action-form { margin: 0; padding: 10px; border-top: 1px solid #e6ece8; }
.hj-mail-health-lines { display: grid; gap: 8px; }
.hj-mail-health-lines > div { min-height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #6c7973; font-size: 9.5px; }
.hj-mail-health-lines b { color: #7b8882; font-size: 9px; }
.hj-mail-health-lines b.is-good { color: #09825c; }
.hj-mail-settings-drawer > footer { padding: 17px 20px; display: flex; flex-wrap: wrap; gap: 8px; }
.hj-mail-settings-drawer > footer a { min-height: 34px; padding: 0 10px; display: inline-flex; align-items: center; border: 1px solid #dbe5df; border-radius: 9px; background: #fff; color: #426055; text-decoration: none; font-size: 9px; font-weight: 700; }

.hj-mail-first-run,
.hj-mail-fatal-state { width: min(980px, calc(100% - 40px)); margin: 40px auto; }
.hj-mail-first-run { min-height: 540px; padding: 54px; display: grid; grid-template-columns: 160px minmax(0,1fr) 350px; align-items: center; gap: 34px; border: 1px solid #dfe8e3; border-radius: 24px; background: #fff; box-shadow: 0 28px 70px rgba(16,63,46,.08); }
.hj-mail-first-run-art { width: 145px; height: 145px; display: grid; place-items: center; border-radius: 42px; background: radial-gradient(circle at 40% 35%, #f0ffdc, #d9f3e4 62%, #c4e9d7); color: #087052; transform: rotate(-5deg); box-shadow: 0 25px 50px rgba(10,115,82,.16); }
.hj-mail-first-run-art svg { width: 54px; height: 54px; }
.hj-mail-first-run h2 { margin: 7px 0 9px; color: #17271f; font: 800 32px/1.13 Manrope, Inter, sans-serif; letter-spacing: -.05em; }
.hj-mail-first-run p { color: #6b7972; font-size: 12px; line-height: 1.7; }

.hj-mail-empty-list { height: 100%; padding: 38px 22px; display: grid; place-content: center; justify-items: center; text-align: center; color: #87938d; }
.hj-mail-empty-list span { width: 48px; height: 48px; margin-bottom: 12px; display: grid; place-items: center; border-radius: 15px; background: #eef6f1; color: #0c805b; }
.hj-mail-empty-list svg { width: 23px; height: 23px; }
.hj-mail-empty-list strong { color: #34463d; font-size: 12px; }
.hj-mail-empty-list small { margin-top: 4px; font-size: 9.5px; }
.hj-mail-toast { position: fixed; right: 22px; bottom: 22px; z-index: 100010; max-width: 360px; min-height: 48px; padding: 10px 13px; display: flex; align-items: center; gap: 9px; border: 1px solid #cfe2d8; border-radius: 12px; background: #fff; color: #30483e; box-shadow: 0 18px 45px rgba(10,56,40,.18); font-size: 10.5px; animation: hjMailToast .2s ease both; }
.hj-mail-toast.is-error { border-color: #f1c9c9; color: #a63d42; }
@keyframes hjMailToast { from { transform: translateY(10px); opacity: 0; } }

@media (max-width: 1180px) {
  .hj-mail-topbar { grid-template-columns: 210px minmax(260px, 1fr) auto; padding-inline: 17px; }
  .hj-mail-layout { grid-template-columns: 205px minmax(315px, 360px) minmax(420px, 1fr); }
  .hj-mailbox-switcher { display: none; }
  .hj-mail-brand-zone small { display: none; }
}

@media (max-width: 920px) {
  .hj-mail-product { grid-template-rows: 62px minmax(0,1fr); }
  .hj-mail-topbar { grid-template-columns: auto minmax(220px,1fr) auto; gap: 10px; min-height: 62px; padding-inline: 11px; }
  .hj-mail-brand-zone > div { display: none; }
  .hj-mail-top-actions .hj-mail-icon-button:nth-of-type(1) { display: none; }
  .hj-mail-layout { grid-template-columns: 70px minmax(300px, 42%) minmax(380px, 1fr); }
  .hj-mail-sidebar { padding-inline: 8px; }
  .hj-mail-compose-button { grid-template-columns: 1fr; justify-items: center; padding: 0; }
  .hj-mail-compose-button strong,
  .hj-mail-compose-button svg { display: none; }
  .hj-mail-system-folders button,
  .hj-mail-custom-folders nav button { grid-template-columns: 1fr; justify-items: center; padding: 0; }
  .hj-mail-system-folders button span,
  .hj-mail-system-folders button b,
  .hj-mail-custom-folders nav button span,
  .hj-mail-custom-folders nav button b,
  .hj-mail-custom-folders > div span,
  .hj-mail-storage { display: none; }
  .hj-mail-custom-folders > div { justify-content: center; padding-inline: 0; }
  .hj-mail-sidebar-spacer { display: block; }
}

@media (max-width: 720px) {
  .hj-mail-product { height: 100dvh; min-height: 100dvh; }
  .hj-mail-topbar { grid-template-columns: auto minmax(0,1fr) auto; }
  .hj-mail-global-search kbd,
  .hj-mail-top-actions .hj-mail-icon-button:nth-of-type(2),
  .hj-mail-top-actions .hj-mail-icon-button:nth-of-type(3) { display: none; }
  .hj-mail-layout { position: relative; display: block; }
  .hj-mail-sidebar { position: absolute; left: 0; right: 0; bottom: 0; z-index: 50; height: 60px; padding: 6px 8px; display: grid; grid-template-columns: 52px minmax(0,1fr); border: 0; border-top: 1px solid var(--hjm-line); background: rgba(255,255,255,.97); backdrop-filter: blur(16px); }
  .hj-mail-compose-button { width: 44px; height: 44px; min-height: 44px; border-radius: 50%; align-self: center; }
  .hj-mail-system-folders { margin: 0; grid-template-columns: repeat(5,1fr); align-items: center; }
  .hj-mail-system-folders button { min-height: 44px; }
  .hj-mail-system-folders button:nth-child(n+6),
  .hj-mail-custom-folders,
  .hj-mail-sidebar-spacer { display: none; }
  .hj-mail-list-pane { height: calc(100dvh - 122px); padding-bottom: 0; border-right: 0; }
  .hj-mail-reader { position: absolute; inset: 0 0 60px; z-index: 30; transform: translateX(100%); transition: transform .2s ease; }
  .hj-mail-reader.is-open { transform: translateX(0); }
  .hj-mail-reading-surface::before { content: '‹ Inbox'; position: absolute; left: 14px; top: 12px; z-index: 3; min-height: 30px; padding: 0 9px; display: flex; align-items: center; border-radius: 8px; background: #eff6f2; color: #087052; font-size: 10px; font-weight: 750; cursor: pointer; }
  .hj-mail-message-head { padding-top: 52px; }
  .hj-mail-message-actions { display: none; }
  .hj-mail-sender-row > time { display: none; }
  .hj-mail-composer { inset: 10px; width: auto; height: auto; border-radius: 15px; }
  .hj-mail-settings-drawer { width: 100%; }
  .hj-mail-first-run { width: calc(100% - 24px); margin: 12px; padding: 28px; grid-template-columns: 1fr; text-align: center; }
  .hj-mail-first-run-art { margin: 0 auto; }
}

/* HostingJet Mail v0.17 health intelligence */
.hj-mail-health-chip {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 11px;
  border: 1px solid #dce8e1;
  border-radius: 11px;
  background: #f8fbf9;
  color: #43544b;
  font: inherit;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.hj-mail-health-chip:hover { border-color: #b7d4c4; background: #f1f8f4; transform: translateY(-1px); }
.hj-mail-health-chip > i { width: 7px; height: 7px; border-radius: 99px; background: #a3aea8; box-shadow: 0 0 0 4px rgba(163,174,168,.12); }
.hj-mail-health-chip > span { font-size: 10px; font-weight: 650; white-space: nowrap; }
.hj-mail-health-chip > b { min-width: 24px; color: #7b8882; font-size: 10px; text-align: right; }
.hj-mail-health-chip.is-good > i { background: #0a996c; box-shadow: 0 0 0 4px rgba(10,153,108,.12); }
.hj-mail-health-chip.is-good > b { color: #087453; }
.hj-mail-health-chip.is-warning > i { background: #d69a15; box-shadow: 0 0 0 4px rgba(214,154,21,.12); }
.hj-mail-health-chip.is-warning > b { color: #95670b; }
.hj-mail-health-chip.is-critical > i { background: #d95e58; box-shadow: 0 0 0 4px rgba(217,94,88,.12); }
.hj-mail-health-chip.is-critical > b { color: #a33f3a; }
.hj-mail-reliability-section { border-radius: 14px; background: linear-gradient(145deg,#f8fbf9,#f2f8f4); border: 1px solid #e1ebe5; padding: 14px !important; }
.hj-mail-reliability-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 11px; }
.hj-mail-reliability-head h3 { margin: 0 0 3px !important; }
.hj-mail-reliability-head p { margin: 0; max-width: 260px; color: #78867f; font-size: 9.5px; line-height: 1.45; }
.hj-mail-reliability-head > strong { min-width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 1px #dce8e1; color: #53645b; font-size: 11px; }
.hj-mail-health-lines b.is-warning { color: #a36c09; }
.hj-mail-health-lines b.is-bad { color: #b54b45; }
@media (max-width: 960px) { .hj-mail-health-chip > span { display: none; } }
@media (max-width: 720px) { .hj-mail-health-chip { display: none; } }

/* ========================================================================== 
   HostingJet Mail v0.17.1 — viewport isolation and theme-container repair
   The mail client is an immersive product surface. These rules prevent
   WordPress themes, page builders, shortcode columns, and legacy shell grids
   from collapsing the application to a narrow strip.
   ========================================================================== */

html.hj-mail-workspace-open,
body.hj-mail-workspace-open {
  width: 100% !important;
  min-width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  overscroll-behavior: none;
}

.hj-page-current-mail {
  display: block !important;
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;
  background: #f3f7f5 !important;
  box-shadow: none !important;
}

.hj-page-current-mail > .hj-main {
  display: block !important;
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 100vh !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

.hj-page-current-mail .hj-mail-product,
.hj-mail-product.hj-mail-viewport,
body > .hj-mail-product.hj-mail-viewport {
  position: fixed !important;
  inset: var(--hjm-top-offset, 0px) 0 0 0 !important;
  z-index: 2147483646 !important;
  display: grid !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  clear: both !important;
  overflow: hidden !important;
  isolation: isolate;
  background: #f6f9f7 !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.hj-mail-product.hj-mail-viewport .hj-mail-topbar,
.hj-mail-product.hj-mail-viewport .hj-mail-layout {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

.hj-mail-product.hj-mail-viewport .hj-mail-layout {
  grid-template-columns:
    clamp(218px, 14.5vw, 258px)
    clamp(340px, 25vw, 430px)
    minmax(0, 1fr);
}

.hj-mail-product.hj-mail-viewport .hj-mail-topbar {
  grid-template-columns:
    clamp(218px, 14.5vw, 258px)
    minmax(300px, 680px)
    minmax(300px, 1fr);
}

/* Keep common floating site widgets behind the immersive mail workspace. */
body.hj-mail-workspace-open #tidio-chat,
body.hj-mail-workspace-open .crisp-client,
body.hj-mail-workspace-open .tawk-min-container,
body.hj-mail-workspace-open .chaty-widget,
body.hj-mail-workspace-open .joinchat,
body.hj-mail-workspace-open [data-id="chat-widget"],
body.hj-mail-workspace-open [data-widget="chat"] {
  display: none !important;
}

@media (max-width: 1180px) {
  .hj-mail-product.hj-mail-viewport .hj-mail-layout {
    grid-template-columns: 205px minmax(315px, 360px) minmax(0, 1fr);
  }
  .hj-mail-product.hj-mail-viewport .hj-mail-topbar {
    grid-template-columns: 205px minmax(250px, 1fr) auto;
  }
}

@media (max-width: 920px) {
  .hj-mail-product.hj-mail-viewport .hj-mail-layout {
    grid-template-columns: 70px minmax(300px, 42%) minmax(0, 1fr);
  }
  .hj-mail-product.hj-mail-viewport .hj-mail-topbar {
    grid-template-columns: auto minmax(220px, 1fr) auto;
  }
}

@media (max-width: 720px) {
  .hj-mail-product.hj-mail-viewport {
    height: auto !important;
    min-height: 0 !important;
  }
  .hj-mail-product.hj-mail-viewport .hj-mail-layout {
    display: block !important;
  }
  .hj-mail-product.hj-mail-viewport .hj-mail-topbar {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
}

/* The app is moved outside the legacy shell, so preserve its component reset. */
.hj-mail-product,
.hj-mail-product *,
.hj-mail-product *::before,
.hj-mail-product *::after { box-sizing: border-box; }
.hj-mail-product button,
.hj-mail-product input,
.hj-mail-product select,
.hj-mail-product textarea { font: inherit; }
.hj-mail-product svg { display: block; }
.hj-mail-product img { max-width: 100%; }
.hj-mail-product :focus { outline: none; }
.hj-mail-product :focus-visible {
  outline: 2px solid rgba(18, 165, 112, .42);
  outline-offset: 2px;
}

/* ========================================================================== 
   HostingJet Mail v0.17.2 — dashboard-aligned experience system
   Same winter-white / forest / lime language as the HostingJet customer app,
   adapted for a dense, fast three-pane mail workspace.
   ========================================================================== */
.hj-mail-product-v172 {
  --hjm-canvas: #f5f7f4;
  --hjm-surface: #ffffff;
  --hjm-surface-2: #fafbf9;
  --hjm-surface-3: #f0f3ef;
  --hjm-ink: #171b18;
  --hjm-muted: #68716b;
  --hjm-muted-2: #8b938e;
  --hjm-line: #e2e6e1;
  --hjm-line-strong: #d3d9d3;
  --hjm-forest: #11362b;
  --hjm-forest-deep: #09271f;
  --hjm-emerald: #167a59;
  --hjm-emerald-2: #0e6247;
  --hjm-emerald-soft: #e8f3ed;
  --hjm-lime: #d9f56f;
  --hjm-lime-soft: #f1f9d8;
  --hjm-gold: #e8a61b;
  --hjm-red: #c84c4f;
  --hjm-shadow-sm: 0 1px 2px rgba(15, 35, 27, .03), 0 8px 24px rgba(15, 35, 27, .035);
  --hjm-shadow-lg: 0 28px 90px rgba(8, 31, 23, .20), 0 2px 8px rgba(8, 31, 23, .08);
  grid-template-rows: 70px minmax(0, 1fr);
  color: var(--hjm-ink);
  background: var(--hjm-canvas) !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  letter-spacing: -.005em;
}

.hj-mail-product-v172 .hj-mail-topbar {
  min-height: 70px;
  gap: 20px;
  padding: 0 22px;
  border-color: var(--hjm-line);
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 1px 0 rgba(9, 39, 31, .025);
  backdrop-filter: blur(18px) saturate(130%);
}
.hj-mail-product-v172 .hj-mail-brand-zone { gap: 11px; }
.hj-mail-product-v172 .hj-mail-brand-zone strong {
  color: var(--hjm-forest-deep);
  font: 780 17px/1.15 Inter, sans-serif;
  letter-spacing: -.035em;
}
.hj-mail-product-v172 .hj-mail-brand-zone small {
  color: #7d8882;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .09em;
}
.hj-mail-product-v172 .hj-mail-brand-symbol {
  width: 34px;
  height: 34px;
  grid-template-columns: repeat(3, 5px);
  gap: 3px;
  border-radius: 10px;
  background: var(--hjm-forest);
  box-shadow: 0 9px 24px rgba(17, 54, 43, .18);
}
.hj-mail-product-v172 .hj-mail-brand-symbol i { width: 5px; background: var(--hjm-lime); }
.hj-mail-product-v172 .hj-mail-back {
  width: 36px;
  height: 36px;
  border-color: var(--hjm-line);
  border-radius: 11px;
  color: var(--hjm-forest);
  background: var(--hjm-surface);
}
.hj-mail-product-v172 .hj-mail-back:hover {
  border-color: #bdc7bf;
  background: var(--hjm-surface-3);
  transform: translateX(-1px);
}
.hj-mail-product-v172 .hj-mail-global-search {
  height: 42px;
  padding: 0 13px;
  border-color: transparent;
  border-radius: 12px;
  background: #f2f4f1;
  box-shadow: inset 0 0 0 1px rgba(21, 54, 43, .025);
}
.hj-mail-product-v172 .hj-mail-global-search:hover { background: #eef1ed; }
.hj-mail-product-v172 .hj-mail-global-search:focus-within {
  border-color: rgba(22, 122, 89, .36);
  background: #fff;
  box-shadow: 0 0 0 4px rgba(22, 122, 89, .09);
}
.hj-mail-product-v172 .hj-mail-global-search input {
  color: var(--hjm-ink) !important;
  font-size: 13px !important;
}
.hj-mail-product-v172 .hj-mail-global-search kbd {
  border-color: var(--hjm-line);
  background: rgba(255,255,255,.9);
  color: var(--hjm-muted);
}
.hj-mail-product-v172 .hj-mail-top-actions { gap: 6px; }
.hj-mail-product-v172 .hj-mailbox-switcher {
  height: 38px;
  max-width: 245px;
  border-color: var(--hjm-line);
  border-radius: 11px;
  background: var(--hjm-surface);
}
.hj-mail-product-v172 .hj-mailbox-switcher::before { background: var(--hjm-emerald); }
.hj-mail-product-v172 .hj-mailbox-switcher select {
  color: var(--hjm-forest-deep);
  font-size: 11px !important;
  font-weight: 650;
}
.hj-mail-product-v172 .hj-mail-icon-button {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  color: #59645d;
}
.hj-mail-product-v172 .hj-mail-icon-button:hover {
  border-color: var(--hjm-line);
  background: var(--hjm-surface-3);
  color: var(--hjm-forest);
}
.hj-mail-product-v172 .hj-mail-avatar {
  width: 35px;
  height: 35px;
  border-color: #cbd8d0;
  background: var(--hjm-forest);
  color: var(--hjm-lime);
}

.hj-mail-product-v172 .hj-mail-health-chip {
  min-height: 38px;
  padding: 0 12px;
  border-color: var(--hjm-line);
  border-radius: 11px;
  background: var(--hjm-surface);
  color: var(--hjm-forest);
}
.hj-mail-product-v172 .hj-mail-health-chip:hover { border-color: #bdc8c0; background: var(--hjm-surface-2); }
.hj-mail-product-v172 .hj-mail-health-chip > span,
.hj-mail-product-v172 .hj-mail-health-chip > b { font-size: 10px; }

.hj-mail-product-v172 .hj-mail-layout {
  background: var(--hjm-canvas);
}
.hj-mail-product-v172.hj-mail-viewport .hj-mail-layout {
  grid-template-columns: clamp(228px, 14vw, 250px) clamp(360px, 27vw, 430px) minmax(0, 1fr);
}
.hj-mail-product-v172.hj-mail-viewport .hj-mail-topbar {
  grid-template-columns: clamp(228px, 14vw, 250px) minmax(300px, 690px) minmax(330px, 1fr);
}

.hj-mail-product-v172 .hj-mail-sidebar {
  padding: 16px 13px 14px;
  border-right-color: var(--hjm-line);
  background: #fbfcfa;
}
.hj-mail-product-v172 .hj-mail-compose-button {
  min-height: 46px;
  padding: 0 13px;
  border-radius: 11px;
  background: var(--hjm-forest);
  color: #fff;
  box-shadow: 0 9px 24px rgba(9, 39, 31, .15);
  font-size: 12px;
}
.hj-mail-product-v172 .hj-mail-compose-button > span,
.hj-mail-product-v172 .hj-mail-compose-button svg { color: var(--hjm-lime); }
.hj-mail-product-v172 .hj-mail-compose-button:hover {
  background: var(--hjm-forest-deep);
  box-shadow: 0 13px 30px rgba(9, 39, 31, .20);
  transform: translateY(-1px);
}
.hj-mail-product-v172 .hj-mail-system-folders { gap: 3px; margin-top: 14px; }
.hj-mail-product-v172 .hj-mail-system-folders button,
.hj-mail-product-v172 .hj-mail-custom-folders nav button {
  min-height: 39px;
  padding: 0 10px;
  gap: 10px;
  border-radius: 9px;
  color: #4d5851;
  font-size: 11.5px;
  font-weight: 590;
}
.hj-mail-product-v172 .hj-mail-system-folders button:hover,
.hj-mail-product-v172 .hj-mail-custom-folders nav button:hover {
  background: #f0f2ef;
  color: var(--hjm-forest);
}
.hj-mail-product-v172 .hj-mail-system-folders button.is-active,
.hj-mail-product-v172 .hj-mail-custom-folders nav button.is-active {
  background: var(--hjm-forest);
  color: #fff;
  box-shadow: none;
}
.hj-mail-product-v172 .hj-mail-system-folders button.is-active svg,
.hj-mail-product-v172 .hj-mail-custom-folders nav button.is-active svg { color: var(--hjm-lime); }
.hj-mail-product-v172 .hj-mail-system-folders button b,
.hj-mail-product-v172 .hj-mail-custom-folders nav button b {
  min-width: 25px;
  height: 20px;
  border-radius: 7px;
  background: #edf0ec;
  color: #68716b;
  font-size: 9px;
}
.hj-mail-product-v172 .hj-mail-system-folders button.is-active b {
  background: var(--hjm-lime);
  color: var(--hjm-forest-deep);
}
.hj-mail-product-v172 .hj-mail-custom-folders {
  margin-top: 14px;
  padding-top: 12px;
  border-top-color: var(--hjm-line);
}
.hj-mail-product-v172 .hj-mail-custom-folders > div {
  color: #89918c;
  font-size: 8.5px;
}
.hj-mail-product-v172 .hj-mail-storage {
  padding: 12px;
  border-color: var(--hjm-line);
  border-radius: 11px;
  background: #fff;
  box-shadow: none;
}
.hj-mail-product-v172 .hj-mail-storage > i { height: 5px; background: #e7ebe7; }
.hj-mail-product-v172 .hj-mail-storage > i span { background: var(--hjm-forest); }
.hj-mail-product-v172 .hj-mail-storage button { color: var(--hjm-emerald-2); }

.hj-mail-product-v172 .hj-mail-list-pane {
  grid-template-rows: 70px auto minmax(0, 1fr) 42px;
  border-right-color: var(--hjm-line);
  background: var(--hjm-surface);
}
.hj-mail-product-v172 .hj-mail-list-toolbar {
  gap: 10px;
  padding: 0 14px;
  border-bottom-color: var(--hjm-line);
  background: var(--hjm-surface);
}
.hj-mail-product-v172 .hj-mail-current-folder strong {
  color: var(--hjm-forest-deep);
  font-size: 14px;
  font-weight: 730;
  letter-spacing: -.02em;
}
.hj-mail-product-v172 .hj-mail-current-folder small {
  margin-top: 2px;
  color: var(--hjm-muted-2);
  font-size: 9.5px;
}
.hj-mail-product-v172 .hj-mail-filter-button,
.hj-mail-product-v172 .hj-mail-sort {
  min-height: 32px;
  border-color: var(--hjm-line) !important;
  border-radius: 9px !important;
  background: #fff !important;
  color: var(--hjm-muted) !important;
  font-size: 9.5px !important;
}
.hj-mail-product-v172 .hj-mail-filter-button:hover { background: var(--hjm-surface-3) !important; color: var(--hjm-forest) !important; }
.hj-mail-product-v172 .hj-mail-bulkbar {
  min-height: 42px;
  border-bottom-color: #dbe7df;
  background: var(--hjm-lime-soft);
  color: var(--hjm-forest);
}
.hj-mail-product-v172 .hj-mail-message-list { scrollbar-color: #cfd6d0 transparent; }
.hj-mail-product-v172 .hj-mail-message {
  min-height: 90px;
  padding: 13px 13px 13px 19px;
  gap: 10px;
  border-bottom-color: #ecefec;
  background: #fff;
  transition: background .14s ease, box-shadow .14s ease;
}
.hj-mail-product-v172 .hj-mail-message:hover { background: #fafbf9; }
.hj-mail-product-v172 .hj-mail-message.is-selected {
  background: var(--hjm-lime-soft);
  box-shadow: inset 3px 0 var(--hjm-forest);
}
.hj-mail-product-v172 .hj-mail-message::before { left: 8px; width: 6px; height: 6px; }
.hj-mail-product-v172 .hj-mail-message.is-unread::before { background: var(--hjm-emerald); }
.hj-mail-product-v172 .hj-mail-message-avatar { width: 38px; height: 38px; }
.hj-mail-product-v172 .hj-mail-message-copy { row-gap: 3px; }
.hj-mail-product-v172 .hj-mail-message-copy > strong {
  color: #303630;
  font-size: 12px;
  font-weight: 630;
}
.hj-mail-product-v172 .hj-mail-message-copy > time { color: var(--hjm-muted-2); font-size: 9px; }
.hj-mail-product-v172 .hj-mail-message-subject {
  color: #333a34;
  font-size: 10.5px;
  font-weight: 610;
}
.hj-mail-product-v172 .hj-mail-message-preview { color: #7f8882; font-size: 9.5px; line-height: 1.35; }
.hj-mail-product-v172 .hj-mail-message.is-unread .hj-mail-message-copy > strong,
.hj-mail-product-v172 .hj-mail-message.is-unread .hj-mail-message-subject { color: var(--hjm-forest-deep); font-weight: 760; }
.hj-mail-product-v172 .hj-mail-message-check span { border-color: #b6beb8; border-radius: 4px; }
.hj-mail-product-v172 .hj-mail-message-check input:checked + span { border-color: var(--hjm-forest); background: var(--hjm-forest); }
.hj-mail-product-v172 .hj-mail-pagination {
  border-top-color: var(--hjm-line);
  background: #fbfcfa;
  color: var(--hjm-muted);
}

.hj-mail-product-v172 .hj-mail-reader {
  background: var(--hjm-canvas);
}
.hj-mail-product-v172 .hj-mail-reader-empty {
  padding: 50px;
  background: radial-gradient(circle at 50% 44%, rgba(217,245,111,.15) 0, rgba(255,255,255,.78) 36%, var(--hjm-canvas) 72%);
}
.hj-mail-product-v172 .hj-mail-empty-orbit { color: var(--hjm-forest); }
.hj-mail-product-v172 .hj-mail-reader-empty h3 {
  color: var(--hjm-forest-deep);
  font: 760 22px/1.2 Inter, sans-serif;
}
.hj-mail-product-v172 .hj-mail-reader-empty p { color: var(--hjm-muted); font-size: 11.5px; }
.hj-mail-product-v172 .hj-mail-reader-empty > div span {
  border-color: var(--hjm-line);
  background: rgba(255,255,255,.9);
  color: var(--hjm-forest);
}
.hj-mail-product-v172 .hj-mail-reading-surface {
  grid-template-rows: auto auto minmax(0,1fr) auto auto;
  background: var(--hjm-surface);
  box-shadow: inset 1px 0 0 var(--hjm-line);
}
.hj-mail-product-v172 .hj-mail-message-head {
  padding: 20px 24px 16px;
  border-bottom-color: var(--hjm-line);
  background: #fff;
}
.hj-mail-product-v172 .hj-mail-subject-row h2 {
  color: var(--hjm-forest-deep);
  font: 740 20px/1.25 Inter, sans-serif;
  letter-spacing: -.035em;
}
.hj-mail-product-v172 .hj-mail-subject-row > button { color: #9ca49f; }
.hj-mail-product-v172 .hj-mail-sender-row { margin-top: 15px; gap: 11px; }
.hj-mail-product-v172 .hj-mail-sender-avatar { width: 38px; height: 38px; }
.hj-mail-product-v172 .hj-mail-sender-row strong { color: #29312c; font-size: 11.5px; }
.hj-mail-product-v172 .hj-mail-sender-row small,
.hj-mail-product-v172 .hj-mail-sender-row > time { color: var(--hjm-muted-2); font-size: 9px; }
.hj-mail-product-v172 .hj-mail-message-actions {
  margin-left: 8px;
  padding-left: 7px;
  border-left: 1px solid var(--hjm-line);
  gap: 2px;
}
.hj-mail-product-v172 .hj-mail-message-actions > span { width: 1px; height: 20px; margin: 0 3px; background: var(--hjm-line); }
.hj-mail-product-v172 .hj-mail-message-actions button {
  width: 31px;
  height: 31px;
  border-radius: 9px;
  color: #59645d;
}
.hj-mail-product-v172 .hj-mail-message-actions button:hover { background: var(--hjm-surface-3); color: var(--hjm-forest); }
.hj-mail-product-v172 .hj-mail-message-actions svg { width: 15px; height: 15px; }
.hj-mail-product-v172 .hj-mail-privacy-banner {
  margin: 12px 20px 0;
  min-height: 42px;
  border-color: #d8e7dc;
  border-radius: 10px;
  background: var(--hjm-emerald-soft);
  color: #44584d;
}
.hj-mail-product-v172 .hj-mail-privacy-banner svg,
.hj-mail-product-v172 .hj-mail-privacy-banner button { color: var(--hjm-emerald-2); }
.hj-mail-product-v172 .hj-mail-message-frame-wrap { background: #fff; }
.hj-mail-product-v172 .hj-mail-message-frame-wrap iframe { background: #fff; }
.hj-mail-product-v172 .hj-mail-attachments {
  padding: 12px 20px;
  border-top-color: var(--hjm-line);
}
.hj-mail-product-v172 .hj-mail-attachment {
  min-height: 46px;
  border-color: var(--hjm-line);
  border-radius: 10px;
  box-shadow: none;
}
.hj-mail-product-v172 .hj-mail-attachment:hover { border-color: #b8c7bd; background: var(--hjm-surface-2); color: var(--hjm-forest); }
.hj-mail-product-v172 .hj-mail-quick-reply {
  margin: 0 20px 17px;
  min-height: 52px;
  border-color: var(--hjm-line-strong);
  border-radius: 11px;
  box-shadow: none;
}
.hj-mail-product-v172 .hj-mail-quick-reply:hover { border-color: #b8c5bc; background: #fbfcfa; }

.hj-mail-product-v172 .hj-mail-connect-layer {
  background: radial-gradient(circle at 50% 38%, rgba(217,245,111,.20), rgba(245,247,244,.97) 48%);
}
.hj-mail-product-v172 .hj-mail-connect-card {
  width: min(530px, 100%);
  padding: 36px;
  border: 1px solid var(--hjm-line);
  border-radius: 20px;
  box-shadow: var(--hjm-shadow-lg);
}
.hj-mail-product-v172 .hj-mail-connect-shield { background: var(--hjm-forest); color: var(--hjm-lime); }
.hj-mail-product-v172 .hj-mail-kicker { color: var(--hjm-emerald-2); }
.hj-mail-product-v172 .hj-mail-connect-card h2 { color: var(--hjm-forest-deep); font-family: Inter, sans-serif; }
.hj-mail-product-v172 .hj-mail-connect-submit,
.hj-mail-product-v172 .hj-mail-send-button { background: var(--hjm-forest); color: #fff; }
.hj-mail-product-v172 .hj-mail-connect-submit svg,
.hj-mail-product-v172 .hj-mail-send-button svg { color: var(--hjm-lime); }
.hj-mail-product-v172 .hj-mail-composer {
  border-color: var(--hjm-line);
  border-radius: 16px;
  box-shadow: var(--hjm-shadow-lg);
}
.hj-mail-product-v172 .hj-mail-composer > header {
  border-bottom-color: var(--hjm-line);
  background: #fbfcfa;
}
.hj-mail-product-v172 .hj-mail-composer > header strong { color: var(--hjm-forest-deep); font-family: Inter, sans-serif; }
.hj-mail-product-v172 .hj-mail-compose-fields,
.hj-mail-product-v172 .hj-mail-composer > footer { border-color: var(--hjm-line); }
.hj-mail-product-v172 .hj-mail-compose-editor { color: var(--hjm-ink); font-size: 13px; }
.hj-mail-product-v172 .hj-mail-settings-drawer { background: #fff; }
.hj-mail-product-v172 .hj-mail-settings-drawer > header { background: #fbfcfa; border-bottom-color: var(--hjm-line); }
.hj-mail-product-v172 .hj-mail-settings-drawer h2,
.hj-mail-product-v172 .hj-mail-settings-drawer h3 { color: var(--hjm-forest-deep); }
.hj-mail-product-v172 .hj-mail-reliability-section {
  border-color: #dce5de;
  background: var(--hjm-surface-2);
}
.hj-mail-product-v172 .hj-mail-reliability-head > strong { color: var(--hjm-forest); }
.hj-mail-product-v172 .hj-mail-health-lines b.is-good { color: var(--hjm-emerald-2); }

.hj-mail-product-v172 .hj-mail-toast {
  border-color: var(--hjm-line-strong);
  border-radius: 11px;
  color: var(--hjm-forest);
  box-shadow: 0 18px 55px rgba(9,39,31,.18);
}

.hj-mail-product-v172 button,
.hj-mail-product-v172 a,
.hj-mail-product-v172 input,
.hj-mail-product-v172 select,
.hj-mail-product-v172 [contenteditable="true"] { -webkit-tap-highlight-color: transparent; }
.hj-mail-product-v172 button:focus-visible,
.hj-mail-product-v172 a:focus-visible,
.hj-mail-product-v172 input:focus-visible,
.hj-mail-product-v172 select:focus-visible,
.hj-mail-product-v172 [contenteditable="true"]:focus-visible {
  outline: 2px solid rgba(22, 122, 89, .40) !important;
  outline-offset: 2px;
}

@media (max-width: 1280px) {
  .hj-mail-product-v172.hj-mail-viewport .hj-mail-layout { grid-template-columns: 210px minmax(330px, 380px) minmax(0, 1fr); }
  .hj-mail-product-v172.hj-mail-viewport .hj-mail-topbar { grid-template-columns: 210px minmax(260px, 1fr) auto; }
  .hj-mail-product-v172 .hj-mail-message-head { padding-inline: 20px; }
  .hj-mail-product-v172 .hj-mail-subject-row h2 { font-size: 18px; }
}

@media (max-width: 960px) {
  .hj-mail-product-v172.hj-mail-viewport .hj-mail-layout { grid-template-columns: 72px minmax(310px, 41%) minmax(0, 1fr); }
  .hj-mail-product-v172.hj-mail-viewport .hj-mail-topbar { grid-template-columns: auto minmax(220px, 1fr) auto; }
  .hj-mail-product-v172 .hj-mail-sidebar { padding-inline: 8px; }
  .hj-mail-product-v172 .hj-mail-system-folders button.is-active,
  .hj-mail-product-v172 .hj-mail-custom-folders nav button.is-active { background: var(--hjm-forest); }
}

@media (max-width: 720px) {
  .hj-mail-product-v172 { grid-template-rows: 62px minmax(0, 1fr); }
  .hj-mail-product-v172 .hj-mail-topbar { min-height: 62px; padding: 0 10px; gap: 8px; }
  .hj-mail-product-v172 .hj-mail-global-search { height: 40px; }
  .hj-mail-product-v172 .hj-mail-sidebar {
    height: 64px;
    padding: 7px 8px;
    border-top-color: var(--hjm-line);
    background: rgba(255,255,255,.98);
  }
  .hj-mail-product-v172 .hj-mail-compose-button { width: 46px; height: 46px; min-height: 46px; }
  .hj-mail-product-v172 .hj-mail-list-pane { height: calc(100dvh - 126px); }
  .hj-mail-product-v172 .hj-mail-reader { inset: 0 0 64px; background: #fff; }
  .hj-mail-product-v172 .hj-mail-reading-surface::before {
    color: var(--hjm-forest);
    background: var(--hjm-lime-soft);
  }
  .hj-mail-product-v172 .hj-mail-message-head { padding-inline: 16px; }
  .hj-mail-product-v172 .hj-mail-privacy-banner,
  .hj-mail-product-v172 .hj-mail-quick-reply { margin-inline: 12px; }
  .hj-mail-product-v172 .hj-mail-composer { inset: 8px; border-radius: 14px; }
}

/* ========================================================================== */
/* HostingJet Mail v0.18.2 — stable workspace, onboarding and crisp UI       */
/* ========================================================================== */
.hj-mail-product-v180 {
  --hjm-forest: #082f27;
  --hjm-forest-2: #0b4436;
  --hjm-emerald: #0d8b63;
  --hjm-lime: #d9ff72;
  --hjm-canvas: #f5f7f4;
  --hjm-white: #fff;
  --hjm-soft: #f0f4f0;
  --hjm-soft-2: #e8efea;
  --hjm-line: #dce4de;
  --hjm-line-strong: #cbd6ce;
  --hjm-ink: #18241f;
  --hjm-muted: #69776f;
  --hjm-danger: #bd3d46;
  position: fixed !important;
  inset: var(--hjm-top-offset, 0px) 0 0 !important;
  z-index: 2147482000 !important;
  width: 100vw !important;
  height: calc(100dvh - var(--hjm-top-offset, 0px)) !important;
  max-width: none !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-rows: 70px minmax(0, 1fr);
  overflow: hidden !important;
  background: var(--hjm-canvas);
  color: var(--hjm-ink);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
  line-height: 1.45;
  isolation: isolate;
}
.hj-mail-product-v180[hidden],
.hj-mail-product-v180 [hidden] { display: none !important; }
.hj-mail-product-v180 button,
.hj-mail-product-v180 input,
.hj-mail-product-v180 select,
.hj-mail-product-v180 textarea { font: inherit; }
.hj-mail-product-v180 button { cursor: pointer; }
.hj-mail-product-v180 svg { width: 18px; height: 18px; }

.hj-mail-product-v180 .hj-mail-topbar {
  min-width: 0;
  min-height: 70px;
  padding: 0 22px;
  display: grid;
  grid-template-columns: 260px minmax(280px, 650px) minmax(280px, auto);
  align-items: center;
  gap: 22px;
  border-bottom: 1px solid var(--hjm-line);
  background: rgba(255,255,255,.98);
  box-shadow: 0 1px 0 rgba(7,45,36,.025);
}
.hj-mail-product-v180 .hj-mail-brand-zone { min-width: 0; display: flex; align-items: center; gap: 11px; }
.hj-mail-product-v180 .hj-mail-back {
  width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--hjm-line); border-radius: 12px;
  background: #fff; color: var(--hjm-forest); transform: rotate(180deg); transition: .16s ease;
}
.hj-mail-product-v180 .hj-mail-back:hover { border-color: var(--hjm-line-strong); background: var(--hjm-soft); }
.hj-mail-product-v180 .hj-mail-brand-symbol { width: 38px; height: 38px; padding: 8px; display: flex; align-items: flex-end; gap: 3px; border-radius: 12px; background: var(--hjm-forest); box-shadow: 0 8px 22px rgba(8,47,39,.18); transform: rotate(-4deg); }
.hj-mail-product-v180 .hj-mail-brand-symbol i { width: 5px; border-radius: 4px; background: var(--hjm-lime); }
.hj-mail-product-v180 .hj-mail-brand-symbol i:nth-child(1) { height: 13px; }
.hj-mail-product-v180 .hj-mail-brand-symbol i:nth-child(2) { height: 22px; }
.hj-mail-product-v180 .hj-mail-brand-symbol i:nth-child(3) { height: 17px; }
.hj-mail-product-v180 .hj-mail-brand-zone > div { min-width: 0; display: grid; }
.hj-mail-product-v180 .hj-mail-brand-zone strong { color: var(--hjm-forest); font-size: 17px; font-weight: 800; letter-spacing: -.025em; }
.hj-mail-product-v180 .hj-mail-brand-zone small { overflow: hidden; color: #819087; font-size: 10px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; text-transform: uppercase; letter-spacing: .08em; }
.hj-mail-product-v180 .hj-mail-global-search { height: 44px; padding: 0 13px; display: flex; align-items: center; gap: 10px; border: 1px solid transparent; border-radius: 13px; background: #f1f4f1; color: #77847d; transition: .16s ease; }
.hj-mail-product-v180 .hj-mail-global-search:focus-within { border-color: #a7beb1; background: #fff; box-shadow: 0 0 0 4px rgba(13,139,99,.08); }
.hj-mail-product-v180 .hj-mail-global-search input { min-width: 0; flex: 1; border: 0 !important; outline: 0 !important; background: transparent !important; color: var(--hjm-ink) !important; box-shadow: none !important; }
.hj-mail-product-v180 .hj-mail-global-search kbd { padding: 3px 7px; border: 1px solid #d7ded9; border-radius: 7px; background: #fff; color: #8b958f; font-size: 10px; }
.hj-mail-product-v180 .hj-mail-top-actions { min-width: 0; display: flex; justify-content: flex-end; align-items: center; gap: 7px; }
.hj-mail-product-v180 .hj-mail-health-chip { height: 38px; padding: 0 11px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--hjm-line); border-radius: 11px; background: #fff; color: #526259; }
.hj-mail-product-v180 .hj-mail-health-chip i { width: 7px; height: 7px; border-radius: 99px; background: #16a571; }
.hj-mail-product-v180 .hj-mail-health-chip b { color: var(--hjm-forest); font-size: 11px; }
.hj-mail-product-v180 .hj-mailbox-switcher { height: 38px; max-width: 205px; display: flex; align-items: center; border: 1px solid var(--hjm-line); border-radius: 11px; background: #fff; }
.hj-mail-product-v180 .hj-mailbox-switcher select { width: 100%; height: 100%; padding: 0 31px 0 11px !important; border: 0 !important; outline: 0 !important; background-color: transparent !important; color: #405148 !important; box-shadow: none !important; font-size: 11px !important; font-weight: 700; }
.hj-mail-product-v180 .hj-mail-icon-button { position: relative; width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--hjm-line); border-radius: 11px; background: #fff; color: #526259; transition: .16s ease; }
.hj-mail-product-v180 .hj-mail-icon-button:hover { border-color: #bac8bf; background: var(--hjm-soft); color: var(--hjm-forest); }
.hj-mail-product-v180 .hj-mail-icon-button > i { position: absolute; top: 7px; right: 7px; width: 6px; height: 6px; border: 2px solid #fff; border-radius: 50%; background: #aeb8b2; }
.hj-mail-product-v180 .hj-mail-icon-button > i.is-live { background: #0da06e; }
.hj-mail-product-v180 .hj-mail-avatar { position: relative; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg,#e3f3e9,#cae8d8); color: var(--hjm-forest); font-weight: 850; }
.hj-mail-product-v180 .hj-mail-avatar i { position: absolute; right: 0; bottom: 0; width: 9px; height: 9px; border: 2px solid #fff; border-radius: 50%; background: #12a56f; }
.hj-mail-product-v180 .hj-mail-setup-top-actions { display: flex; justify-content: flex-end; gap: 9px; grid-column: 2 / -1; }
.hj-mail-product-v180 .hj-mail-setup-top-actions a { min-height: 36px; padding: 0 13px; display: inline-flex; align-items: center; border: 1px solid var(--hjm-line); border-radius: 10px; background: #fff; color: var(--hjm-forest); font-size: 11px; font-weight: 750; text-decoration: none; }

.hj-mail-product-v180 .hj-mail-layout { min-width: 0; min-height: 0; display: grid; grid-template-columns: 230px minmax(330px, 390px) minmax(480px, 1fr); overflow: hidden; background: #fff; }
.hj-mail-product-v180 .hj-mail-sidebar { min-height: 0; padding: 16px 12px 14px; display: flex; flex-direction: column; overflow: auto; border-right: 1px solid var(--hjm-line); background: #fbfcfb; }
.hj-mail-product-v180 .hj-mail-compose-button { min-height: 46px; padding: 0 13px; display: grid; grid-template-columns: 20px 1fr 18px; align-items: center; gap: 9px; border: 0; border-radius: 13px; background: var(--hjm-forest); color: #fff; box-shadow: 0 10px 22px rgba(8,47,39,.14); }
.hj-mail-product-v180 .hj-mail-compose-button > span, .hj-mail-product-v180 .hj-mail-compose-button > svg { color: var(--hjm-lime); }
.hj-mail-product-v180 .hj-mail-compose-button strong { text-align: left; font-size: 12px; }
.hj-mail-product-v180 .hj-mail-system-folders { margin-top: 16px; display: grid; gap: 3px; }
.hj-mail-product-v180 .hj-mail-system-folders button,
.hj-mail-product-v180 .hj-mail-custom-folders nav button { min-height: 39px; padding: 0 10px; display: grid; grid-template-columns: 20px minmax(0,1fr) auto; align-items: center; gap: 9px; border: 0; border-radius: 10px; background: transparent; color: #53635a; text-align: left; transition: .13s ease; }
.hj-mail-product-v180 .hj-mail-system-folders button:hover,
.hj-mail-product-v180 .hj-mail-custom-folders nav button:hover { background: #edf2ee; color: var(--hjm-forest); }
.hj-mail-product-v180 .hj-mail-system-folders button.is-active,
.hj-mail-product-v180 .hj-mail-custom-folders nav button.is-active { background: #e4eee7; color: var(--hjm-forest); }
.hj-mail-product-v180 .hj-mail-system-folders button.is-active::before { content: ""; position: absolute; left: 0; width: 3px; height: 22px; border-radius: 0 4px 4px 0; background: var(--hjm-emerald); }
.hj-mail-product-v180 .hj-mail-system-folders button { position: relative; }
.hj-mail-product-v180 .hj-mail-system-folders strong { overflow: hidden; font-size: 11.5px; font-weight: 680; text-overflow: ellipsis; white-space: nowrap; }
.hj-mail-product-v180 .hj-mail-system-folders b,
.hj-mail-product-v180 .hj-mail-custom-folders b { min-width: 22px; padding: 2px 6px; border-radius: 99px; background: #e2ebe5; color: var(--hjm-forest); font-size: 9px; text-align: center; }
.hj-mail-product-v180 .hj-mail-custom-folders { margin-top: 15px; padding-top: 14px; border-top: 1px solid #e3e9e5; }
.hj-mail-product-v180 .hj-mail-custom-folders > div { padding: 0 8px 7px; display: flex; justify-content: space-between; align-items: center; color: #89958f; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .09em; }
.hj-mail-product-v180 .hj-mail-custom-folders > div button { border: 0; background: transparent; color: var(--hjm-forest); }
.hj-mail-product-v180 .hj-mail-sidebar-spacer { min-height: 14px; flex: 1; }
.hj-mail-product-v180 .hj-mail-storage { padding: 13px; border: 1px solid var(--hjm-line); border-radius: 12px; background: #fff; }
.hj-mail-product-v180 .hj-mail-storage > div { display: flex; justify-content: space-between; gap: 8px; color: #65746b; font-size: 9.5px; }
.hj-mail-product-v180 .hj-mail-storage > i { height: 5px; margin: 9px 0; display: block; overflow: hidden; border-radius: 99px; background: #e9eeea; }
.hj-mail-product-v180 .hj-mail-storage > i span { height: 100%; display: block; border-radius: inherit; background: var(--hjm-emerald); }
.hj-mail-product-v180 .hj-mail-storage button { padding: 0; border: 0; background: transparent; color: var(--hjm-forest); font-size: 9.5px; font-weight: 750; }

.hj-mail-product-v180 .hj-mail-list-pane { position: relative; min-width: 0; min-height: 0; display: grid; grid-template-rows: 64px auto minmax(0,1fr) 40px; overflow: hidden; border-right: 1px solid var(--hjm-line); background: #fff; }
.hj-mail-product-v180 .hj-mail-list-toolbar { padding: 0 13px; display: grid; grid-template-columns: 22px minmax(0,1fr) auto auto; align-items: center; gap: 9px; border-bottom: 1px solid var(--hjm-line); }
.hj-mail-product-v180 .hj-mail-select-all { display: grid; place-items: center; }
.hj-mail-product-v180 .hj-mail-select-all input, .hj-mail-product-v180 .hj-mail-message-check input { position: absolute; opacity: 0; pointer-events: none; }
.hj-mail-product-v180 .hj-mail-select-all span, .hj-mail-product-v180 .hj-mail-message-check span { width: 15px; height: 15px; display: block; border: 1.5px solid #aeb9b2; border-radius: 4px; background: #fff; }
.hj-mail-product-v180 .hj-mail-select-all input:checked + span, .hj-mail-product-v180 .hj-mail-message-check input:checked + span { border-color: var(--hjm-forest); background: var(--hjm-forest); box-shadow: inset 0 0 0 3px #fff; }
.hj-mail-product-v180 .hj-mail-current-folder { min-width: 0; display: grid; }
.hj-mail-product-v180 .hj-mail-current-folder strong { color: var(--hjm-forest); font-size: 15px; font-weight: 800; letter-spacing: -.02em; }
.hj-mail-product-v180 .hj-mail-current-folder small { color: #89948e; font-size: 9.5px; }
.hj-mail-product-v180 .hj-mail-filter-button, .hj-mail-product-v180 .hj-mail-sort { height: 32px; padding: 0 9px !important; display: inline-flex; align-items: center; gap: 5px; border: 1px solid var(--hjm-line) !important; border-radius: 9px !important; background: #fff !important; color: #5f6d65 !important; box-shadow: none !important; font-size: 9.5px !important; }
.hj-mail-product-v180 .hj-mail-filter-button.is-active { border-color: #9ab5a6 !important; background: #e8f0eb !important; color: var(--hjm-forest) !important; }
.hj-mail-product-v180 .hj-mail-bulkbar { padding: 8px 13px; display: flex; align-items: center; gap: 7px; border-bottom: 1px solid var(--hjm-line); background: #f3f7f4; color: #56655c; font-size: 10px; }
.hj-mail-product-v180 .hj-mail-bulkbar button { min-height: 26px; padding: 0 8px; border: 1px solid #d6e0d9; border-radius: 7px; background: #fff; color: var(--hjm-forest); font-size: 9px; }
.hj-mail-product-v180 .hj-mail-message-list { min-height: 0; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #cdd7d0 transparent; }
.hj-mail-product-v180 .hj-mail-message { position: relative; min-height: 91px; padding: 13px 38px 13px 12px; display: grid; grid-template-columns: 18px 40px minmax(0,1fr); align-items: start; gap: 10px; border-bottom: 1px solid #edf1ee; background: #fff; transition: .12s ease; cursor: pointer; }
.hj-mail-product-v180 .hj-mail-message:hover { background: #f8faf8; }
.hj-mail-product-v180 .hj-mail-message.is-selected { background: #edf4ef; box-shadow: inset 3px 0 0 var(--hjm-emerald); }
.hj-mail-product-v180 .hj-mail-message.is-unread::after { content: ""; position: absolute; left: 4px; top: 42px; width: 5px; height: 5px; border-radius: 50%; background: var(--hjm-emerald); }
.hj-mail-product-v180 .hj-mail-message-check { margin-top: 12px; }
.hj-mail-product-v180 .hj-mail-message-avatar { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #dce5df; border-radius: 50%; background: linear-gradient(145deg,#f4f8f5,#e3eee7); color: var(--hjm-forest); font-size: 12px; font-weight: 800; }
.hj-mail-product-v180 .hj-mail-message-copy { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 2px 8px; }
.hj-mail-product-v180 .hj-mail-message-copy > strong { overflow: hidden; color: #354139; font-size: 11.5px; font-weight: 690; text-overflow: ellipsis; white-space: nowrap; }
.hj-mail-product-v180 .hj-mail-message-copy > time { color: #919b95; font-size: 8.8px; }
.hj-mail-product-v180 .hj-mail-message-subject, .hj-mail-product-v180 .hj-mail-message-preview { grid-column: 1 / -1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hj-mail-product-v180 .hj-mail-message-subject { color: #4f5a54; font-size: 10.5px; font-weight: 650; }
.hj-mail-product-v180 .hj-mail-message-preview { color: #8b958f; font-size: 9.5px; }
.hj-mail-product-v180 .hj-mail-message.is-unread .hj-mail-message-copy > strong, .hj-mail-product-v180 .hj-mail-message.is-unread .hj-mail-message-subject { color: var(--hjm-forest); font-weight: 800; }
.hj-mail-product-v180 .hj-mail-message-star { position: absolute; right: 12px; top: 37px; border: 0; background: transparent; color: #9ca69f; font-size: 17px; }
.hj-mail-product-v180 .hj-mail-message-star.is-starred { color: #d3a500; }
.hj-mail-product-v180 .hj-mail-pagination { padding: 0 13px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; border-top: 1px solid var(--hjm-line); color: #88938d; font-size: 9px; }
.hj-mail-product-v180 .hj-mail-pagination button { width: 27px; height: 27px; border: 1px solid var(--hjm-line); border-radius: 8px; background: #fff; color: var(--hjm-forest); }
.hj-mail-product-v180 .hj-mail-pagination button:disabled { opacity: .4; cursor: default; }
.hj-mail-product-v180 .hj-mail-runtime-state { min-height: 0; padding: 28px; display: grid; place-content: center; justify-items: center; text-align: center; background: #fff; }
.hj-mail-product-v180 .hj-mail-runtime-state > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 15px; background: #eef3ef; color: var(--hjm-forest); }
.hj-mail-product-v180 .hj-mail-runtime-state > div { max-width: 300px; margin-top: 12px; display: grid; gap: 5px; }
.hj-mail-product-v180 .hj-mail-runtime-state strong { color: var(--hjm-forest); font-size: 15px; }
.hj-mail-product-v180 .hj-mail-runtime-state p, .hj-mail-product-v180 .hj-mail-runtime-state small { margin: 0; color: var(--hjm-muted); font-size: 10px; }
.hj-mail-product-v180 .hj-mail-runtime-state button { min-height: 34px; margin-top: 13px; padding: 0 13px; border: 0; border-radius: 9px; background: var(--hjm-forest); color: #fff; font-size: 10px; font-weight: 750; }

.hj-mail-product-v180 .hj-mail-reader { position: relative; min-width: 0; min-height: 0; overflow: hidden; background: #fff; }
.hj-mail-product-v180 .hj-mail-reader-empty { height: 100%; padding: 40px; display: grid; place-content: center; justify-items: center; text-align: center; background: radial-gradient(circle at 50% 38%,#f1f7f2 0,#fff 52%); }
.hj-mail-product-v180 .hj-mail-empty-orbit { position: relative; width: 68px; height: 68px; display: grid; place-items: center; border: 1px solid #dce7df; border-radius: 22px; background: #fff; color: var(--hjm-forest); box-shadow: 0 16px 40px rgba(8,47,39,.08); }
.hj-mail-product-v180 .hj-mail-empty-orbit i { position: absolute; right: -4px; top: -4px; width: 14px; height: 14px; border: 4px solid #fff; border-radius: 50%; background: var(--hjm-lime); }
.hj-mail-product-v180 .hj-mail-reader-empty h3 { margin: 17px 0 6px; color: var(--hjm-forest); font-size: 18px; letter-spacing: -.025em; }
.hj-mail-product-v180 .hj-mail-reader-empty p { max-width: 390px; margin: 0; color: var(--hjm-muted); font-size: 11px; }
.hj-mail-product-v180 .hj-mail-reader-empty > div { margin-top: 16px; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.hj-mail-product-v180 .hj-mail-reader-empty > div span { padding: 5px 8px; border: 1px solid var(--hjm-line); border-radius: 99px; background: #fff; color: #6c7b72; font-size: 8.5px; }
.hj-mail-product-v180 .hj-mail-reading-surface { height: 100%; min-height: 0; display: grid; grid-template-rows: auto auto minmax(0,1fr) auto auto; overflow: hidden; background: #fff; }
.hj-mail-product-v180 .hj-mail-message-head { padding: 22px 26px 15px; border-bottom: 1px solid var(--hjm-line); }
.hj-mail-product-v180 .hj-mail-subject-row { display: flex; align-items: flex-start; gap: 12px; }
.hj-mail-product-v180 .hj-mail-subject-row h2 { min-width: 0; flex: 1; margin: 0; color: #17231e; font-size: 20px; line-height: 1.25; letter-spacing: -.035em; }
.hj-mail-product-v180 .hj-mail-subject-row button { border: 0; background: transparent; color: #96a199; font-size: 20px; }
.hj-mail-product-v180 .hj-mail-subject-row button.is-starred { color: #d3a500; }
.hj-mail-product-v180 .hj-mail-sender-row { margin-top: 15px; display: grid; grid-template-columns: 40px minmax(0,1fr) auto; align-items: center; gap: 10px; }
.hj-mail-product-v180 .hj-mail-sender-avatar { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: #e3eee7; color: var(--hjm-forest); font-size: 12px; font-weight: 800; }
.hj-mail-product-v180 .hj-mail-sender-row > div { min-width: 0; display: grid; }
.hj-mail-product-v180 .hj-mail-sender-row strong { color: #2e3b34; font-size: 11.5px; }
.hj-mail-product-v180 .hj-mail-sender-row small, .hj-mail-product-v180 .hj-mail-sender-row time { overflow: hidden; color: #88938c; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.hj-mail-product-v180 .hj-mail-message-actions { margin-top: 15px; display: flex; align-items: center; gap: 5px; }
.hj-mail-product-v180 .hj-mail-message-actions button { min-height: 32px; padding: 0 9px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--hjm-line); border-radius: 9px; background: #fff; color: #56665c; font-size: 9.5px; }
.hj-mail-product-v180 .hj-mail-message-actions button:hover { background: var(--hjm-soft); color: var(--hjm-forest); }
.hj-mail-product-v180 .hj-mail-message-actions > span { width: 1px; height: 22px; margin: 0 2px; background: var(--hjm-line); }
.hj-mail-product-v180 .hj-mail-privacy-banner { margin: 12px 18px 0; padding: 10px 12px; display: flex; align-items: center; gap: 8px; border: 1px solid #d8e6dd; border-radius: 10px; background: #f0f7f2; color: #557064; font-size: 9.5px; }
.hj-mail-product-v180 .hj-mail-privacy-banner span { flex: 1; }
.hj-mail-product-v180 .hj-mail-privacy-banner button { border: 0; background: transparent; color: var(--hjm-emerald); font-size: 9.5px; font-weight: 750; }
.hj-mail-product-v180 .hj-mail-message-frame-wrap { min-height: 0; overflow: hidden; }
.hj-mail-product-v180 .hj-mail-message-frame-wrap iframe { width: 100%; height: 100%; border: 0; background: #fff; }
.hj-mail-product-v180 .hj-mail-attachments { margin: 0 18px 12px; padding: 12px; border: 1px solid var(--hjm-line); border-radius: 11px; background: #fbfcfb; }
.hj-mail-product-v180 .hj-mail-attachments > div:first-child { display: flex; gap: 8px; color: var(--hjm-forest); font-size: 10px; }
.hj-mail-product-v180 .hj-mail-attachments > div:last-child { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 7px; }
.hj-mail-product-v180 .hj-mail-attachment { min-width: 180px; padding: 9px; display: flex; align-items: center; gap: 9px; border: 1px solid var(--hjm-line); border-radius: 9px; background: #fff; color: #3d4c43; text-decoration: none; }
.hj-mail-product-v180 .hj-mail-attachment i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; background: #fee9e9; color: #c23d43; font-size: 8px; font-style: normal; font-weight: 800; }
.hj-mail-product-v180 .hj-mail-attachment span { display: grid; }
.hj-mail-product-v180 .hj-mail-attachment strong { max-width: 160px; overflow: hidden; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.hj-mail-product-v180 .hj-mail-attachment small { color: #8b958f; font-size: 8px; }
.hj-mail-product-v180 .hj-mail-quick-reply { margin: 0 18px 16px; min-height: 50px; padding: 0 11px; display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: center; gap: 9px; border: 1px solid var(--hjm-line); border-radius: 12px; background: #fff; color: #8a958e; text-align: left; }
.hj-mail-product-v180 .hj-mail-quick-reply .hj-mail-avatar { width: 30px; height: 30px; }
.hj-mail-product-v180 .hj-mail-quick-reply b { color: var(--hjm-forest); font-size: 9px; }

/* Onboarding */
.hj-mail-product-v180 .hj-mail-onboarding { min-height: 0; padding: clamp(24px,4vw,64px); display: grid; grid-template-columns: minmax(300px, .9fr) minmax(380px, 560px); align-items: center; justify-content: center; gap: clamp(32px,6vw,90px); overflow: auto; background: radial-gradient(circle at 15% 30%,rgba(217,255,114,.14),transparent 28%),linear-gradient(135deg,#f7f9f6,#eef4ef); }
.hj-mail-product-v180 .hj-mail-onboarding-intro { max-width: 610px; }
.hj-mail-product-v180 .hj-mail-kicker { color: var(--hjm-emerald); font-size: 9.5px; font-weight: 850; text-transform: uppercase; letter-spacing: .12em; }
.hj-mail-product-v180 .hj-mail-onboarding-intro h1 { margin: 12px 0 14px; color: var(--hjm-forest); font-size: clamp(34px,4.2vw,62px); line-height: .98; letter-spacing: -.065em; }
.hj-mail-product-v180 .hj-mail-onboarding-intro > p { max-width: 570px; margin: 0; color: #66766c; font-size: 14px; line-height: 1.7; }
.hj-mail-product-v180 .hj-mail-onboarding-benefits { margin-top: 28px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.hj-mail-product-v180 .hj-mail-onboarding-benefits > div { padding: 14px; border: 1px solid rgba(203,214,206,.8); border-radius: 14px; background: rgba(255,255,255,.72); backdrop-filter: blur(10px); }
.hj-mail-product-v180 .hj-mail-onboarding-benefits span { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 9px; background: #e6f0e9; color: var(--hjm-forest); }
.hj-mail-product-v180 .hj-mail-onboarding-benefits strong { margin-top: 10px; display: block; color: #2b3b32; font-size: 10.5px; }
.hj-mail-product-v180 .hj-mail-onboarding-benefits small { margin-top: 3px; display: block; color: #7a887f; font-size: 8.8px; line-height: 1.5; }
.hj-mail-product-v180 .hj-mail-setup-steps { margin: 26px 0 0; padding: 0; display: grid; gap: 10px; list-style: none; }
.hj-mail-product-v180 .hj-mail-setup-steps li { display: flex; align-items: center; gap: 11px; color: #7a887f; }
.hj-mail-product-v180 .hj-mail-setup-steps b { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid #cfd9d2; border-radius: 50%; background: #fff; font-size: 9px; }
.hj-mail-product-v180 .hj-mail-setup-steps li.is-complete b { border-color: var(--hjm-forest); background: var(--hjm-forest); color: var(--hjm-lime); }
.hj-mail-product-v180 .hj-mail-setup-steps li.is-current b { border-color: var(--hjm-emerald); box-shadow: 0 0 0 4px rgba(13,139,99,.09); color: var(--hjm-emerald); }
.hj-mail-product-v180 .hj-mail-setup-steps span { display: grid; }
.hj-mail-product-v180 .hj-mail-setup-steps strong { color: #405047; font-size: 10px; }
.hj-mail-product-v180 .hj-mail-setup-steps small { font-size: 8.5px; }
.hj-mail-product-v180 .hj-mail-onboarding-card { width: 100%; max-width: 560px; padding: 28px; border: 1px solid rgba(204,216,208,.9); border-radius: 22px; background: rgba(255,255,255,.95); box-shadow: 0 30px 80px rgba(8,47,39,.11); }
.hj-mail-product-v180 .hj-mail-setup-card-head { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 13px; align-items: center; }
.hj-mail-product-v180 .hj-mail-setup-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: var(--hjm-forest); color: var(--hjm-lime); }
.hj-mail-product-v180 .hj-mail-setup-card-head span { color: var(--hjm-emerald); font-size: 8.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .09em; }
.hj-mail-product-v180 .hj-mail-onboarding-card h2 { margin: 4px 0 5px; color: var(--hjm-forest); font-size: 22px; letter-spacing: -.035em; }
.hj-mail-product-v180 .hj-mail-onboarding-card p { margin: 0; color: #738078; font-size: 10px; line-height: 1.6; }
.hj-mail-product-v180 .hj-mail-onboarding-card .hj-form, .hj-mail-product-v180 .hj-mail-onboarding-connect { margin-top: 20px; display: grid; gap: 11px; }
.hj-mail-product-v180 .hj-mail-onboarding-card .hj-form h3, .hj-mail-product-v180 .hj-mail-onboarding-card .hj-form > p { display: none; }
.hj-mail-product-v180 .hj-mail-onboarding-card label { display: grid; gap: 5px; color: #5a6960; font-size: 9px; font-weight: 750; }
.hj-mail-product-v180 .hj-mail-onboarding-card input, .hj-mail-product-v180 .hj-mail-onboarding-card select { width: 100%; min-height: 43px !important; padding: 0 12px !important; border: 1px solid #d7e0da !important; border-radius: 10px !important; background: #fff !important; color: var(--hjm-ink) !important; box-shadow: none !important; }
.hj-mail-product-v180 .hj-mail-password-field { position: relative; }
.hj-mail-product-v180 .hj-mail-password-field button { position: absolute; right: 6px; top: 6px; height: 31px; padding: 0 9px; border: 0; border-radius: 8px; background: #edf2ee; color: var(--hjm-forest); font-size: 8.5px; }
.hj-mail-product-v180 .hj-mail-setup-primary, .hj-mail-product-v180 .hj-mail-onboarding-card .hj-primary-button { min-height: 44px; padding: 0 16px; display: inline-flex; align-items: center; justify-content: center; border: 0 !important; border-radius: 11px !important; background: var(--hjm-forest) !important; color: #fff !important; box-shadow: 0 11px 24px rgba(8,47,39,.16); font-size: 10.5px; font-weight: 800; text-decoration: none; }
.hj-mail-product-v180 .hj-mail-onboarding-mailboxes { margin-top: 18px; max-height: 170px; display: grid; gap: 6px; overflow: auto; }
.hj-mail-product-v180 .hj-mail-onboarding-mailboxes a { min-height: 50px; padding: 8px 10px; display: grid; grid-template-columns: 32px minmax(0,1fr) 8px; align-items: center; gap: 9px; border: 1px solid var(--hjm-line); border-radius: 11px; background: #fff; color: #46564d; text-decoration: none; }
.hj-mail-product-v180 .hj-mail-onboarding-mailboxes a.is-active { border-color: #91b7a3; background: #eef5f0; }
.hj-mail-product-v180 .hj-mail-onboarding-mailboxes a > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: #e3eee7; color: var(--hjm-forest); font-size: 10px; font-weight: 800; }
.hj-mail-product-v180 .hj-mail-onboarding-mailboxes a > div { min-width: 0; display: grid; }
.hj-mail-product-v180 .hj-mail-onboarding-mailboxes strong { overflow: hidden; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.hj-mail-product-v180 .hj-mail-onboarding-mailboxes small { color: #89958e; font-size: 8px; }
.hj-mail-product-v180 .hj-mail-onboarding-mailboxes i { width: 7px; height: 7px; border-radius: 50%; background: #c4cec8; }
.hj-mail-product-v180 .hj-mail-onboarding-mailboxes a.is-active i { background: var(--hjm-emerald); }
.hj-mail-product-v180 .hj-mail-setup-note { margin-top: 12px !important; text-align: center; }
.hj-mail-product-v180 .hj-mail-create-another { margin-top: 16px; border-top: 1px solid var(--hjm-line); padding-top: 14px; }
.hj-mail-product-v180 .hj-mail-create-another summary { color: var(--hjm-forest); font-size: 9.5px; font-weight: 750; cursor: pointer; }

/* Composer and settings */
.hj-mail-product-v180 .hj-mail-compose-layer, .hj-mail-product-v180 .hj-mail-settings-layer { position: fixed; inset: var(--hjm-top-offset,0px) 0 0; z-index: 2147482500; }
.hj-mail-product-v180 .hj-mail-layer-scrim { position: absolute; inset: 0; border: 0; background: rgba(8,22,17,.38); backdrop-filter: blur(4px); }
.hj-mail-product-v180 .hj-mail-composer { position: absolute; right: 24px; bottom: 20px; width: min(660px,calc(100vw - 48px)); height: min(680px,calc(100dvh - 120px)); display: grid; grid-template-rows: 56px auto minmax(0,1fr) 58px; overflow: hidden; border: 1px solid #ccd7d0; border-radius: 18px; background: #fff; box-shadow: 0 30px 90px rgba(5,27,21,.25); }
.hj-mail-product-v180 .hj-mail-composer > header { padding: 0 17px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--hjm-line); background: #fbfcfb; }
.hj-mail-product-v180 .hj-mail-composer > header > div:first-child { display: grid; }
.hj-mail-product-v180 .hj-mail-composer > header strong { color: var(--hjm-forest); font-size: 16px; }
.hj-mail-product-v180 .hj-mail-composer > header button { width: 30px; height: 30px; border: 0; border-radius: 8px; background: transparent; color: #6d7a72; }
.hj-mail-product-v180 .hj-mail-compose-fields { padding: 0 17px; position: relative; border-bottom: 1px solid var(--hjm-line); }
.hj-mail-product-v180 .hj-mail-compose-fields label { min-height: 43px; display: grid; grid-template-columns: 55px minmax(0,1fr); align-items: center; border-bottom: 1px solid #edf1ee; color: #75837a; font-size: 9.5px; }
.hj-mail-product-v180 .hj-mail-compose-fields label:last-of-type { border-bottom: 0; }
.hj-mail-product-v180 .hj-mail-compose-fields input { width: 100%; border: 0 !important; outline: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--hjm-ink) !important; }
.hj-mail-product-v180 .hj-mail-cc-links { position: absolute; right: 17px; top: 9px; display: flex; gap: 4px; }
.hj-mail-product-v180 .hj-mail-cc-links button { border: 0; background: transparent; color: var(--hjm-emerald); font-size: 9px; }
.hj-mail-product-v180 .hj-mail-compose-editor { padding: 20px; overflow: auto; outline: 0; color: #26342c; font-size: 13px; line-height: 1.65; }
.hj-mail-product-v180 .hj-mail-composer > footer { padding: 0 15px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--hjm-line); }
.hj-mail-product-v180 .hj-mail-compose-tools { display: flex; align-items: center; gap: 5px; }
.hj-mail-product-v180 .hj-mail-compose-tools button, .hj-mail-product-v180 .hj-mail-attach-button { width: 30px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: #647269; }
.hj-mail-product-v180 .hj-mail-attach-button input { display: none; }
.hj-mail-product-v180 .hj-mail-compose-tools > span { max-width: 240px; overflow: hidden; color: #8b958f; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.hj-mail-product-v180 .hj-mail-send-button { min-width: 92px; height: 38px; padding: 0 14px; display: inline-flex; justify-content: center; align-items: center; gap: 8px; border: 0; border-radius: 10px; background: var(--hjm-forest); color: #fff; font-size: 10px; font-weight: 800; }
.hj-mail-product-v180 .hj-mail-send-button svg { color: var(--hjm-lime); }
.hj-mail-product-v180 .hj-mail-settings-drawer { position: absolute; top: 0; right: 0; width: min(520px,100vw); height: 100%; display: grid; grid-template-rows: 72px 48px minmax(0,1fr) 48px; overflow: hidden; background: #fff; box-shadow: -24px 0 70px rgba(5,27,21,.18); }
.hj-mail-product-v180 .hj-mail-settings-drawer > header { padding: 0 20px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--hjm-line); }
.hj-mail-product-v180 .hj-mail-settings-drawer h2 { margin: 3px 0 0; color: var(--hjm-forest); font-size: 21px; letter-spacing: -.035em; }
.hj-mail-product-v180 .hj-mail-settings-drawer > header button { width: 34px; height: 34px; border: 1px solid var(--hjm-line); border-radius: 9px; background: #fff; color: #627168; }
.hj-mail-product-v180 .hj-mail-settings-tabs { padding: 0 17px; display: flex; align-items: flex-end; gap: 18px; border-bottom: 1px solid var(--hjm-line); }
.hj-mail-product-v180 .hj-mail-settings-tabs button { height: 48px; padding: 0; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #7b887f; font-size: 9.5px; font-weight: 750; }
.hj-mail-product-v180 .hj-mail-settings-tabs button.is-active { border-bottom-color: var(--hjm-emerald); color: var(--hjm-forest); }
.hj-mail-product-v180 .hj-mail-settings-panel { min-height: 0; padding: 18px; display: none; overflow-y: auto; }
.hj-mail-product-v180 .hj-mail-settings-panel.is-active { display: block; }
.hj-mail-product-v180 .hj-mail-settings-panel section { padding: 16px; border: 1px solid var(--hjm-line); border-radius: 14px; background: #fff; }
.hj-mail-product-v180 .hj-mail-settings-panel section + section { margin-top: 12px; }
.hj-mail-product-v180 .hj-mail-settings-panel h3 { margin: 0 0 5px; color: var(--hjm-forest); font-size: 13px; }
.hj-mail-product-v180 .hj-mail-settings-panel section > p { margin: 0 0 13px; color: var(--hjm-muted); font-size: 9.5px; }
.hj-mail-product-v180 .hj-mailbox-settings-list { display: grid; gap: 6px; }
.hj-mail-product-v180 .hj-mailbox-settings-list a { min-height: 50px; padding: 8px 9px; display: grid; grid-template-columns: 32px minmax(0,1fr) 8px; align-items: center; gap: 9px; border: 1px solid var(--hjm-line); border-radius: 10px; color: #46564d; text-decoration: none; }
.hj-mail-product-v180 .hj-mailbox-settings-list a.is-active { border-color: #9bb7a7; background: #f0f5f1; }
.hj-mail-product-v180 .hj-mailbox-settings-list a > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: #e4eee7; color: var(--hjm-forest); font-size: 9px; font-weight: 800; }
.hj-mail-product-v180 .hj-mailbox-settings-list a > div { min-width: 0; display: grid; }
.hj-mail-product-v180 .hj-mailbox-settings-list strong { overflow: hidden; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.hj-mail-product-v180 .hj-mailbox-settings-list small { color: #89958e; font-size: 8px; }
.hj-mail-product-v180 .hj-mailbox-settings-list i { width: 7px; height: 7px; border-radius: 50%; background: #c6d0ca; }
.hj-mail-product-v180 .hj-mailbox-settings-list i.is-online { background: #0ea06f; }
.hj-mail-product-v180 .hj-mail-admin-action { margin-top: 10px; border: 1px solid var(--hjm-line); border-radius: 10px; }
.hj-mail-product-v180 .hj-mail-admin-action summary { padding: 11px; color: var(--hjm-forest); font-size: 9.5px; font-weight: 750; cursor: pointer; }
.hj-mail-product-v180 .hj-mail-admin-action .hj-form { padding: 0 11px 11px; }
.hj-mail-product-v180 .hj-mail-connected-card { background: #f7faf8 !important; }
.hj-mail-product-v180 .hj-mail-settings-mailbox { display: grid; grid-template-columns: 38px minmax(0,1fr); align-items: center; gap: 10px; }
.hj-mail-product-v180 .hj-mail-settings-mailbox > div { min-width: 0; display: grid; }
.hj-mail-product-v180 .hj-mail-settings-mailbox strong { overflow: hidden; color: var(--hjm-forest); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.hj-mail-product-v180 .hj-mail-settings-mailbox small { color: #849087; font-size: 8.5px; }
.hj-mail-product-v180 .hj-mail-danger-link { margin-top: 12px; padding: 0; border: 0; background: transparent; color: var(--hjm-danger); font-size: 9px; font-weight: 750; }
.hj-mail-product-v180 .hj-mail-reliability-head { display: flex; justify-content: space-between; gap: 12px; }
.hj-mail-product-v180 .hj-mail-reliability-head strong { color: var(--hjm-forest); font-size: 26px; }
.hj-mail-product-v180 .hj-mail-health-lines { margin-top: 12px; display: grid; gap: 0; border: 1px solid var(--hjm-line); border-radius: 10px; overflow: hidden; }
.hj-mail-product-v180 .hj-mail-health-lines > div { min-height: 38px; padding: 0 10px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #edf1ee; color: #617067; font-size: 9px; }
.hj-mail-product-v180 .hj-mail-health-lines > div:last-child { border-bottom: 0; }
.hj-mail-product-v180 .hj-mail-health-lines b.is-good { color: #07825b; }
.hj-mail-product-v180 .hj-mail-health-lines b.is-warning { color: #aa7400; }
.hj-mail-product-v180 .hj-mail-health-lines b.is-bad { color: var(--hjm-danger); }
.hj-mail-product-v180 .hj-mail-diagnostic-button { width: 100%; min-height: 38px; margin-top: 12px; border: 0; border-radius: 9px; background: var(--hjm-forest); color: #fff; font-size: 9.5px; font-weight: 750; }
.hj-mail-product-v180 .hj-mail-diagnostic-output { margin: 10px 0 0; padding: 11px; overflow: auto; border: 1px solid var(--hjm-line); border-radius: 9px; background: #f7faf8; color: #365046; font: 9px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace; white-space: pre-wrap; }
.hj-mail-product-v180 .hj-mail-diagnostic-output.is-error { border-color: #edd1d3; background: #fff7f7; color: #8e3b42; }
.hj-mail-product-v180 .hj-mail-preference-row { min-height: 58px; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 12px; border-bottom: 1px solid #edf1ee; }
.hj-mail-product-v180 .hj-mail-preference-row:last-child { border-bottom: 0; }
.hj-mail-product-v180 .hj-mail-preference-row > div { display: grid; }
.hj-mail-product-v180 .hj-mail-preference-row strong { color: #37473e; font-size: 9.5px; }
.hj-mail-product-v180 .hj-mail-preference-row small { color: #89958e; font-size: 8px; }
.hj-mail-product-v180 .hj-mail-preference-row button, .hj-mail-product-v180 .hj-mail-setting-status { min-height: 29px; padding: 0 9px; display: inline-flex; align-items: center; border: 1px solid var(--hjm-line); border-radius: 8px; background: #fff; color: var(--hjm-forest); font-size: 8.5px; font-weight: 750; }
.hj-mail-product-v180 .hj-mail-settings-drawer > footer { padding: 0 18px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--hjm-line); }
.hj-mail-product-v180 .hj-mail-settings-drawer > footer a { color: var(--hjm-forest); font-size: 9px; font-weight: 750; text-decoration: none; }

.hj-mail-product-v180 .hj-mail-message-skeleton { min-height: 91px; padding: 14px; display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 11px; border-bottom: 1px solid #edf1ee; }
.hj-mail-product-v180 .hj-mail-message-skeleton > i { width: 40px; height: 40px; border-radius: 50%; background: #eef2ef; animation: hjm-pulse 1.2s infinite alternate; }
.hj-mail-product-v180 .hj-mail-message-skeleton > span { display: grid; align-content: center; gap: 7px; }
.hj-mail-product-v180 .hj-mail-message-skeleton b, .hj-mail-product-v180 .hj-mail-message-skeleton em, .hj-mail-product-v180 .hj-mail-message-skeleton small { height: 8px; display: block; border-radius: 6px; background: #eef2ef; animation: hjm-pulse 1.2s infinite alternate; }
.hj-mail-product-v180 .hj-mail-message-skeleton b { width: 56%; }
.hj-mail-product-v180 .hj-mail-message-skeleton em { width: 78%; }
.hj-mail-product-v180 .hj-mail-message-skeleton small { width: 92%; }
@keyframes hjm-pulse { to { opacity: .48; } }
.hj-mail-product-v180 .hj-mail-toast { position: fixed; right: 18px; bottom: 18px; z-index: 2147483000; max-width: 390px; padding: 12px 15px; border: 1px solid #bad3c5; border-radius: 11px; background: #fff; color: var(--hjm-forest); box-shadow: 0 18px 50px rgba(8,47,39,.18); font-size: 10.5px; font-weight: 700; transition: .2s ease; }
.hj-mail-product-v180 .hj-mail-toast.is-error { border-color: #edc9cc; color: #943b43; }

@media (max-width: 1180px) {
  .hj-mail-product-v180 .hj-mail-topbar { grid-template-columns: 210px minmax(220px,1fr) auto; padding-inline: 14px; gap: 12px; }
  .hj-mail-product-v180 .hj-mail-layout { grid-template-columns: 72px minmax(315px,40%) minmax(0,1fr); }
  .hj-mail-product-v180 .hj-mail-sidebar { padding-inline: 8px; }
  .hj-mail-product-v180 .hj-mail-compose-button { grid-template-columns: 1fr; width: 46px; height: 46px; margin: 0 auto; padding: 0; }
  .hj-mail-product-v180 .hj-mail-compose-button strong, .hj-mail-product-v180 .hj-mail-compose-button > svg:last-child,
  .hj-mail-product-v180 .hj-mail-system-folders strong, .hj-mail-product-v180 .hj-mail-system-folders b,
  .hj-mail-product-v180 .hj-mail-custom-folders, .hj-mail-product-v180 .hj-mail-storage { display: none; }
  .hj-mail-product-v180 .hj-mail-system-folders button { grid-template-columns: 1fr; justify-items: center; padding: 0; }
  .hj-mail-product-v180 .hj-mail-onboarding { grid-template-columns: 1fr; gap: 28px; }
  .hj-mail-product-v180 .hj-mail-onboarding-intro, .hj-mail-product-v180 .hj-mail-onboarding-card { margin-inline: auto; }
}
@media (max-width: 820px) {
  .hj-mail-product-v180 { grid-template-rows: 62px minmax(0,1fr); }
  .hj-mail-product-v180 .hj-mail-topbar { min-height: 62px; grid-template-columns: auto minmax(0,1fr) auto; padding: 0 9px; gap: 8px; }
  .hj-mail-product-v180 .hj-mail-brand-zone small, .hj-mail-product-v180 .hj-mail-health-chip, .hj-mail-product-v180 .hj-mailbox-switcher,
  .hj-mail-product-v180 .hj-mail-icon-button[data-hj-mail-notifications] { display: none; }
  .hj-mail-product-v180 .hj-mail-global-search { height: 40px; }
  .hj-mail-product-v180 .hj-mail-layout { position: relative; display: grid; grid-template-columns: 64px minmax(0,1fr); }
  .hj-mail-product-v180 .hj-mail-list-pane { border-right: 0; }
  .hj-mail-product-v180 .hj-mail-reader { position: absolute; inset: 0; z-index: 20; transform: translateX(100%); transition: transform .18s ease; }
  .hj-mail-product-v180 .hj-mail-reader.is-open { transform: translateX(0); }
  .hj-mail-product-v180 .hj-mail-onboarding { padding: 24px 16px; }
  .hj-mail-product-v180 .hj-mail-onboarding-intro h1 { font-size: 38px; }
  .hj-mail-product-v180 .hj-mail-onboarding-benefits { grid-template-columns: 1fr; }
  .hj-mail-product-v180 .hj-mail-onboarding-benefits > div { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 0 10px; }
  .hj-mail-product-v180 .hj-mail-onboarding-benefits strong { margin-top: 0; }
  .hj-mail-product-v180 .hj-mail-onboarding-benefits small { grid-column: 2; }
}
@media (max-width: 560px) {
  .hj-mail-product-v180 .hj-mail-brand-zone > div, .hj-mail-product-v180 .hj-mail-brand-symbol { display: none; }
  .hj-mail-product-v180 .hj-mail-topbar { grid-template-columns: 38px minmax(0,1fr) 38px; }
  .hj-mail-product-v180 .hj-mail-top-actions > *:not([data-hj-mail-settings-open]) { display: none; }
  .hj-mail-product-v180 .hj-mail-layout { grid-template-columns: 54px minmax(0,1fr); }
  .hj-mail-product-v180 .hj-mail-sidebar { padding-inline: 4px; }
  .hj-mail-product-v180 .hj-mail-compose-button { width: 42px; height: 42px; }
  .hj-mail-product-v180 .hj-mail-list-toolbar { grid-template-columns: 20px minmax(0,1fr) auto; }
  .hj-mail-product-v180 .hj-mail-sort { display: none !important; }
  .hj-mail-product-v180 .hj-mail-filter-button span { display: none; }
  .hj-mail-product-v180 .hj-mail-message { min-height: 84px; grid-template-columns: 36px minmax(0,1fr); padding-left: 10px; }
  .hj-mail-product-v180 .hj-mail-message-check { display: none; }
  .hj-mail-product-v180 .hj-mail-message-avatar { width: 36px; height: 36px; }
  .hj-mail-product-v180 .hj-mail-message-head { padding: 18px 15px 13px; }
  .hj-mail-product-v180 .hj-mail-subject-row h2 { font-size: 17px; }
  .hj-mail-product-v180 .hj-mail-message-actions button span { display: none; }
  .hj-mail-product-v180 .hj-mail-message-frame-wrap iframe { min-height: 420px; }
  .hj-mail-product-v180 .hj-mail-composer { inset: 8px; width: auto; height: auto; }
  .hj-mail-product-v180 .hj-mail-settings-drawer { width: 100%; }
  .hj-mail-product-v180 .hj-mail-onboarding-card { padding: 20px; border-radius: 17px; }
}

/* Body-mounted notifications must remain styled outside the mail root. */
body > .hj-mail-toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 2147483000;
  max-width: 390px;
  padding: 12px 15px;
  border: 1px solid #bad3c5;
  border-radius: 11px;
  background: #fff;
  color: #082f27;
  box-shadow: 0 18px 50px rgba(8,47,39,.18);
  font: 700 10.5px/1.45 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  transition: .2s ease;
}
body > .hj-mail-toast.is-error { border-color: #edc9cc; color: #943b43; }

/* ========================================================================== */
/* HostingJet Mail v0.18.3 — precision workspace, privacy relay, reputation UI */
/* ========================================================================== */
.hj-mail-product-v183 {
  --hjm-canvas: #f4f7f3;
  --hjm-surface: #ffffff;
  --hjm-surface-soft: #f8faf7;
  --hjm-surface-tint: #eef5ef;
  --hjm-forest: #092d25;
  --hjm-forest-2: #0e4336;
  --hjm-emerald: #12835f;
  --hjm-emerald-soft: #dff2e8;
  --hjm-lime: #d7f56f;
  --hjm-ink: #17231f;
  --hjm-ink-2: #34433d;
  --hjm-muted: #718078;
  --hjm-faint: #98a39d;
  --hjm-line: #e0e7e2;
  --hjm-line-strong: #ccd8d1;
  --hjm-danger: #bd4148;
  --hjm-shadow: 0 18px 46px rgba(20, 51, 39, .08);
  grid-template-rows: 68px minmax(0, 1fr);
  background: var(--hjm-canvas);
  color: var(--hjm-ink);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: -.008em;
}

.hj-mail-product-v183 .hj-mail-topbar {
  grid-template-columns: 250px minmax(300px, 700px) minmax(360px, 1fr);
  min-height: 68px;
  padding: 0 22px;
  gap: 18px;
  border-color: var(--hjm-line);
  background: rgba(250, 252, 249, .96);
  box-shadow: 0 1px 0 rgba(9, 45, 37, .03);
}
.hj-mail-product-v183 .hj-mail-brand-zone { gap: 11px; }
.hj-mail-product-v183 .hj-mail-brand-zone strong { color: var(--hjm-forest); font-size: 16px; font-weight: 780; letter-spacing: -.035em; }
.hj-mail-product-v183 .hj-mail-brand-zone small { color: #859189; font-size: 9px; letter-spacing: .08em; }
.hj-mail-product-v183 .hj-mail-brand-symbol { width: 32px; height: 32px; border-radius: 10px; background: var(--hjm-forest); box-shadow: 0 8px 18px rgba(9,45,37,.16); }
.hj-mail-product-v183 .hj-mail-brand-symbol i { background: var(--hjm-lime); }
.hj-mail-product-v183 .hj-mail-back,
.hj-mail-product-v183 .hj-mail-icon-button { border-color: transparent; background: transparent; color: #627068; }
.hj-mail-product-v183 .hj-mail-back:hover,
.hj-mail-product-v183 .hj-mail-icon-button:hover { border-color: var(--hjm-line); background: #fff; color: var(--hjm-forest); }
.hj-mail-product-v183 .hj-mail-global-search { height: 42px; padding-inline: 14px; border-color: #dfe6e1; border-radius: 12px; background: #f1f4f1; }
.hj-mail-product-v183 .hj-mail-global-search:focus-within { border-color: #99b8aa; background: #fff; box-shadow: 0 0 0 3px rgba(18,131,95,.09); }
.hj-mail-product-v183 .hj-mail-global-search input { font-size: 13px !important; }
.hj-mail-product-v183 .hj-mailbox-switcher { height: 38px; border-color: var(--hjm-line); border-radius: 10px; background: #fff; }
.hj-mail-product-v183 .hj-mailbox-switcher select { font-size: 11px !important; }
.hj-mail-product-v183 .hj-mail-health-chip { min-height: 36px; padding: 0 10px; border: 1px solid #dce5df; border-radius: 10px; background: #fff; }
.hj-mail-product-v183 .hj-mail-health-chip.is-good { border-color: #b9decb; background: #f2faf5; }
.hj-mail-product-v183 .hj-mail-avatar { background: #e3f1e9; color: var(--hjm-forest); border-color: #c9ded3; }

.hj-mail-product-v183 .hj-mail-layout {
  grid-template-columns: 236px minmax(350px, 388px) minmax(520px, 1fr);
  gap: 10px;
  padding: 10px;
  background: var(--hjm-canvas);
}
.hj-mail-product-v183 .hj-mail-sidebar,
.hj-mail-product-v183 .hj-mail-list-pane,
.hj-mail-product-v183 .hj-mail-reader {
  border: 1px solid var(--hjm-line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(22, 55, 43, .035);
}
.hj-mail-product-v183 .hj-mail-sidebar { padding: 12px 10px 10px; border-right: 1px solid var(--hjm-line); background: #fbfcfa; }
.hj-mail-product-v183 .hj-mail-compose-button {
  min-height: 46px;
  padding: 0 12px;
  border-radius: 12px;
  background: var(--hjm-forest);
  box-shadow: 0 9px 22px rgba(9,45,37,.16);
  font-size: 12px;
}
.hj-mail-product-v183 .hj-mail-compose-button:hover { background: var(--hjm-forest-2); transform: translateY(-1px); }
.hj-mail-product-v183 .hj-mail-compose-button > span,
.hj-mail-product-v183 .hj-mail-compose-button svg { color: var(--hjm-lime); }
.hj-mail-product-v183 .hj-mail-system-folders { margin-top: 13px; gap: 3px; }
.hj-mail-product-v183 .hj-mail-system-folders button,
.hj-mail-product-v183 .hj-mail-custom-folders nav button {
  min-height: 38px;
  padding: 0 10px;
  border-radius: 9px;
  color: #5e6c65;
  font-size: 11.5px;
  font-weight: 620;
}
.hj-mail-product-v183 .hj-mail-system-folders button:hover,
.hj-mail-product-v183 .hj-mail-custom-folders nav button:hover { background: #f0f4f0; color: var(--hjm-forest); }
.hj-mail-product-v183 .hj-mail-system-folders button.is-active,
.hj-mail-product-v183 .hj-mail-custom-folders nav button.is-active { background: var(--hjm-forest); color: #fff; box-shadow: none; }
.hj-mail-product-v183 .hj-mail-system-folders button.is-active svg { color: var(--hjm-lime); }
.hj-mail-product-v183 .hj-mail-system-folders button b,
.hj-mail-product-v183 .hj-mail-custom-folders nav button b { background: #edf1ee; color: #64726a; }
.hj-mail-product-v183 .hj-mail-system-folders button.is-active b { background: rgba(215,245,111,.18); color: var(--hjm-lime); }
.hj-mail-product-v183 .hj-mail-custom-folders { margin-top: 13px; padding-top: 12px; }
.hj-mail-product-v183 .hj-mail-storage { padding: 12px; border-radius: 11px; background: #f5f8f5; box-shadow: none; }
.hj-mail-product-v183 .hj-mail-storage > i span { background: linear-gradient(90deg, var(--hjm-forest), #39a979); }

.hj-mail-product-v183 .hj-mail-list-pane { grid-template-rows: 64px auto minmax(0,1fr) 42px; border-right: 1px solid var(--hjm-line); }
.hj-mail-product-v183 .hj-mail-list-toolbar { padding: 0 14px; border-color: var(--hjm-line); background: #fff; }
.hj-mail-product-v183 .hj-mail-current-folder strong { color: var(--hjm-forest); font-size: 14px; font-weight: 760; }
.hj-mail-product-v183 .hj-mail-current-folder small { color: #8c9791; font-size: 9.5px; }
.hj-mail-product-v183 .hj-mail-filter-button { min-height: 30px; border-color: #e2e8e4; background: #f8faf8; }
.hj-mail-product-v183 .hj-mail-filter-button.is-active { border-color: #b9d9ca; background: #eaf6ef; color: var(--hjm-emerald); }
.hj-mail-product-v183 .hj-mail-message-list { background: #fff; }
.hj-mail-product-v183 .hj-mail-message {
  min-height: 82px;
  padding: 12px 12px;
  grid-template-columns: 18px 38px minmax(0,1fr) 24px;
  gap: 9px;
  border-color: #edf1ee;
}
.hj-mail-product-v183 .hj-mail-message:hover { background: #f8faf8; }
.hj-mail-product-v183 .hj-mail-message.is-selected { background: #eef5ef; box-shadow: inset 3px 0 var(--hjm-forest); }
.hj-mail-product-v183 .hj-mail-message.is-unread::before { left: 5px; width: 4px; height: 4px; background: var(--hjm-emerald); }
.hj-mail-product-v183 .hj-mail-message-avatar { width: 38px; height: 38px; background: #e7f0eb; color: var(--hjm-forest); border-color: #d0ded6; }
.hj-mail-product-v183 .hj-mail-message-copy { row-gap: 3px; }
.hj-mail-product-v183 .hj-mail-message-copy > strong { color: #33423b; font-size: 12px; }
.hj-mail-product-v183 .hj-mail-message-copy > time { font-size: 9px; }
.hj-mail-product-v183 .hj-mail-message-subject { color: #26352e; font-size: 11px; font-weight: 680; }
.hj-mail-product-v183 .hj-mail-message-preview { color: #8a958f; font-size: 9.5px; }
.hj-mail-product-v183 .hj-mail-message-star { font-size: 17px; }
.hj-mail-product-v183 .hj-mail-pagination { border-color: var(--hjm-line); background: #fbfcfa; }
.hj-mail-product-v183 .hj-mail-runtime-state { margin: 14px; border-radius: 12px; }

.hj-mail-product-v183 .hj-mail-reader { overflow: hidden; }
.hj-mail-product-v183 .hj-mail-reader-empty { background: radial-gradient(circle at 50% 42%, #f1f7f2 0, #fff 55%); }
.hj-mail-product-v183 .hj-mail-empty-orbit { width: 76px; height: 76px; border-color: #dbe6df; box-shadow: 0 16px 42px rgba(18,77,55,.08); }
.hj-mail-product-v183 .hj-mail-reader-empty h3 { color: var(--hjm-forest); font-size: 20px; }
.hj-mail-product-v183 .hj-mail-reader-empty p { color: var(--hjm-muted); font-size: 12px; }
.hj-mail-product-v183 .hj-mail-message-head { padding: 20px 24px 16px; border-color: var(--hjm-line); }
.hj-mail-product-v183 .hj-mail-subject-row h2 { color: var(--hjm-forest); font-size: 19px; line-height: 1.25; }
.hj-mail-product-v183 .hj-mail-sender-row { margin-top: 13px; }
.hj-mail-product-v183 .hj-mail-sender-avatar { width: 38px; height: 38px; }
.hj-mail-product-v183 .hj-mail-sender-row strong { color: #2b3a33; font-size: 12px; }
.hj-mail-product-v183 .hj-mail-sender-row small,
.hj-mail-product-v183 .hj-mail-sender-row > time { font-size: 9.5px; }
.hj-mail-product-v183 .hj-mail-message-actions button { min-width: 31px; height: 31px; border-radius: 8px; }
.hj-mail-product-v183 .hj-mail-message-actions button:first-child { width: auto; padding: 0 10px; gap: 6px; display: inline-flex; align-items: center; background: #edf5f0; color: var(--hjm-forest); font-size: 10px; font-weight: 700; }
.hj-mail-product-v183 .hj-mail-message-frame-wrap { background: #fff; }
.hj-mail-product-v183 .hj-mail-privacy-banner { margin: 10px 20px 0; border-color: #d9e6de; background: #f3f8f4; font-size: 10px; }
.hj-mail-product-v183 .hj-mail-quick-reply { margin: 0 20px 17px; min-height: 50px; border-radius: 12px; box-shadow: none; }
.hj-mail-product-v183 .hj-mail-attachments { padding: 12px 22px; }
.hj-mail-product-v183 .hj-mail-attachment { min-height: 46px; border-radius: 10px; }

.hj-mail-product-v183 .hj-mail-composer {
  right: 22px;
  bottom: 20px;
  width: min(650px, calc(100vw - 44px));
  height: min(720px, calc(100vh - 100px));
  border: 1px solid #cfdad3;
  border-radius: 17px;
  box-shadow: 0 30px 90px rgba(9,45,37,.22);
}
.hj-mail-product-v183 .hj-mail-composer > header { background: var(--hjm-forest); }
.hj-mail-product-v183 .hj-mail-composer > header strong { color: #fff; }
.hj-mail-product-v183 .hj-mail-composer > header .hj-mail-kicker { color: var(--hjm-lime); }
.hj-mail-product-v183 .hj-mail-compose-fields label { min-height: 48px; }
.hj-mail-product-v183 .hj-mail-compose-editor { padding: 22px 24px; font-size: 14px; line-height: 1.7; }
.hj-mail-product-v183 .hj-mail-send-button { min-width: 104px; background: var(--hjm-forest); box-shadow: none; }
.hj-mail-product-v183 .hj-mail-send-button:hover { background: var(--hjm-forest-2); }

.hj-mail-product-v183 .hj-mail-settings-drawer { width: min(500px, 100vw); background: #fff; }
.hj-mail-product-v183 .hj-mail-settings-drawer > header { min-height: 78px; background: #f8faf8; }
.hj-mail-product-v183 .hj-mail-settings-drawer h2 { color: var(--hjm-forest); font-size: 22px; }
.hj-mail-product-v183 .hj-mail-settings-tabs { padding: 10px 16px; gap: 5px; display: flex; overflow-x: auto; border-bottom: 1px solid var(--hjm-line); background: #fff; }
.hj-mail-product-v183 .hj-mail-settings-tabs button { min-height: 34px; padding: 0 11px; flex: 0 0 auto; border: 0; border-radius: 9px; background: transparent; color: #748179; font-size: 10px; font-weight: 700; cursor: pointer; }
.hj-mail-product-v183 .hj-mail-settings-tabs button.is-active { background: var(--hjm-forest); color: #fff; }
.hj-mail-product-v183 .hj-mail-settings-panel { padding: 18px; }
.hj-mail-product-v183 .hj-mail-settings-panel > section { padding: 18px; border: 1px solid var(--hjm-line); border-radius: 14px; background: #fff; }
.hj-mail-product-v183 .hj-mail-settings-panel h3 { margin: 0 0 6px; color: var(--hjm-forest); font-size: 15px; font-weight: 760; letter-spacing: -.02em; text-transform: none; }
.hj-mail-product-v183 .hj-mail-settings-panel p { margin: 0 0 14px; color: var(--hjm-muted); font-size: 10.5px; line-height: 1.6; }
.hj-mail-product-v183 .hj-mail-settings-eyebrow { display: block; margin-bottom: 6px; color: var(--hjm-emerald); font-size: 8.5px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.hj-mail-product-v183 .hj-mail-reliability-head strong { color: var(--hjm-forest); font-size: 30px; }
.hj-mail-product-v183 .hj-mail-health-lines { margin-top: 14px; border: 1px solid var(--hjm-line); border-radius: 11px; overflow: hidden; }
.hj-mail-product-v183 .hj-mail-health-lines > div { min-height: 40px; padding: 0 11px; border-bottom: 1px solid #edf1ee; font-size: 10px; }
.hj-mail-product-v183 .hj-mail-health-lines > div:last-child { border-bottom: 0; }
.hj-mail-product-v183 .hj-mail-health-recommendations { margin-top: 12px; padding: 12px; border: 1px solid #eadfc6; border-radius: 10px; background: #fffaf0; color: #735f35; }
.hj-mail-product-v183 .hj-mail-health-recommendations.is-clear { border-color: #cfe3d7; background: #f2faf5; color: #285d46; }
.hj-mail-product-v183 .hj-mail-health-recommendations strong { display: block; margin-bottom: 5px; font-size: 10px; }
.hj-mail-product-v183 .hj-mail-health-recommendations p,
.hj-mail-product-v183 .hj-mail-health-recommendations ul { margin: 0; padding: 0; font-size: 9.5px; line-height: 1.55; }
.hj-mail-product-v183 .hj-mail-health-recommendations ul { padding-left: 17px; }
.hj-mail-product-v183 .hj-mail-delivery-actions { margin-top: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.hj-mail-product-v183 .hj-mail-diagnostic-button,
.hj-mail-product-v183 .hj-mail-harden-button { min-height: 40px; margin: 0; border-radius: 9px; font-size: 9.5px; font-weight: 750; cursor: pointer; }
.hj-mail-product-v183 .hj-mail-diagnostic-button { border: 0; background: var(--hjm-forest); color: #fff; }
.hj-mail-product-v183 .hj-mail-harden-button { border: 1px solid #cbd9d1; background: #fff; color: var(--hjm-forest); }
.hj-mail-product-v183 .hj-mail-protection-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.hj-mail-product-v183 .hj-mail-protection-grid > div { min-height: 118px; padding: 13px; display: grid; align-content: start; gap: 5px; border: 1px solid var(--hjm-line); border-radius: 11px; background: #f8faf8; }
.hj-mail-product-v183 .hj-mail-protection-grid > div > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: #e5f1ea; color: var(--hjm-emerald); }
.hj-mail-product-v183 .hj-mail-protection-grid svg { width: 15px; height: 15px; }
.hj-mail-product-v183 .hj-mail-protection-grid strong { color: var(--hjm-forest); font-size: 10px; }
.hj-mail-product-v183 .hj-mail-protection-grid small { color: var(--hjm-muted); font-size: 8.8px; line-height: 1.5; }
.hj-mail-product-v183 .hj-mail-protection-note { margin-top: 11px; padding: 11px; display: grid; gap: 4px; border: 1px solid #e7dcc2; border-radius: 10px; background: #fffaf0; }
.hj-mail-product-v183 .hj-mail-protection-note strong { color: #66552f; font-size: 9px; }
.hj-mail-product-v183 .hj-mail-protection-note span { color: #7c6b46; font-size: 8.7px; line-height: 1.55; }
.hj-mail-product-v183 .hj-mail-preference-row { min-height: 66px; }
.hj-mail-product-v183 .hj-mail-preference-row strong { color: var(--hjm-forest); font-size: 10.5px; }
.hj-mail-product-v183 .hj-mail-preference-row small { margin-top: 2px; font-size: 9px; line-height: 1.45; }
.hj-mail-product-v183 .hj-mail-preference-row button[data-hj-mail-image-toggle][data-enabled="1"] { border-color: var(--hjm-forest); background: var(--hjm-forest); color: #fff; }

.hj-mail-product-v183 .hj-mail-onboarding { background: var(--hjm-canvas); }
.hj-mail-product-v183 .hj-mail-onboarding-intro,
.hj-mail-product-v183 .hj-mail-onboarding-card { border-radius: 20px; }
.hj-mail-product-v183 .hj-mail-onboarding-card { border: 1px solid var(--hjm-line); box-shadow: var(--hjm-shadow); }
.hj-mail-product-v183 .hj-mail-onboarding h1 { color: var(--hjm-forest); letter-spacing: -.05em; }
.hj-mail-product-v183 .hj-mail-setup-primary { background: var(--hjm-forest); color: #fff; }

@media (max-width: 1220px) {
  .hj-mail-product-v183 .hj-mail-topbar { grid-template-columns: 215px minmax(260px,1fr) auto; padding-inline: 15px; }
  .hj-mail-product-v183 .hj-mail-layout { grid-template-columns: 205px minmax(330px,370px) minmax(440px,1fr); }
}
@media (max-width: 980px) {
  .hj-mail-product-v183 .hj-mail-layout { grid-template-columns: 72px minmax(320px,42%) minmax(400px,1fr); gap: 7px; padding: 7px; }
  .hj-mail-product-v183 .hj-mail-sidebar { padding-inline: 8px; }
  .hj-mail-product-v183 .hj-mail-sidebar,
  .hj-mail-product-v183 .hj-mail-list-pane,
  .hj-mail-product-v183 .hj-mail-reader { border-radius: 13px; }
}
@media (max-width: 720px) {
  .hj-mail-product-v183 { grid-template-rows: 62px minmax(0,1fr); }
  .hj-mail-product-v183 .hj-mail-layout { padding: 0; display: block; }
  .hj-mail-product-v183 .hj-mail-sidebar,
  .hj-mail-product-v183 .hj-mail-list-pane,
  .hj-mail-product-v183 .hj-mail-reader { border: 0; border-radius: 0; box-shadow: none; }
  .hj-mail-product-v183 .hj-mail-sidebar { border-top: 1px solid var(--hjm-line); }
  .hj-mail-product-v183 .hj-mail-message { min-height: 78px; padding-inline: 11px; }
  .hj-mail-product-v183 .hj-mail-message-head { padding-inline: 18px; }
  .hj-mail-product-v183 .hj-mail-settings-drawer { width: 100%; }
  .hj-mail-product-v183 .hj-mail-protection-grid,
  .hj-mail-product-v183 .hj-mail-delivery-actions { grid-template-columns: 1fr; }
  .hj-mail-product-v183 .hj-mail-composer { inset: 8px; width: auto; height: auto; border-radius: 14px; }
}

/* 0.18.3 final legibility and alignment pass. */
.hj-mail-product-v183,
.hj-mail-product-v183 * { box-sizing: border-box; }
.hj-mail-product-v183 button,
.hj-mail-product-v183 input,
.hj-mail-product-v183 select,
.hj-mail-product-v183 textarea { font-family: inherit; }
.hj-mail-product-v183 .hj-mail-brand-zone small { font-size: 10px; }
.hj-mail-product-v183 .hj-mailbox-switcher select { font-size: 12px !important; }
.hj-mail-product-v183 .hj-mail-system-folders button,
.hj-mail-product-v183 .hj-mail-custom-folders nav button { font-size: 12.5px; }
.hj-mail-product-v183 .hj-mail-custom-folders > div { font-size: 9.5px; }
.hj-mail-product-v183 .hj-mail-storage > div { font-size: 10.5px; }
.hj-mail-product-v183 .hj-mail-storage b,
.hj-mail-product-v183 .hj-mail-storage button { font-size: 11px; }
.hj-mail-product-v183 .hj-mail-current-folder small { font-size: 10.5px; }
.hj-mail-product-v183 .hj-mail-filter-button { font-size: 11px; }
.hj-mail-product-v183 .hj-mail-message-copy > strong { font-size: 13px; line-height: 1.25; }
.hj-mail-product-v183 .hj-mail-message-copy > time { font-size: 10.5px; }
.hj-mail-product-v183 .hj-mail-message-subject { font-size: 12.25px; line-height: 1.3; }
.hj-mail-product-v183 .hj-mail-message-preview { font-size: 10.75px; line-height: 1.35; }
.hj-mail-product-v183 .hj-mail-sender-row strong { font-size: 12.75px; }
.hj-mail-product-v183 .hj-mail-sender-row small,
.hj-mail-product-v183 .hj-mail-sender-row > time { font-size: 10.5px; }
.hj-mail-product-v183 .hj-mail-message-actions button:first-child { font-size: 11px; }
.hj-mail-product-v183 .hj-mail-privacy-banner { font-size: 11px; line-height: 1.45; }
.hj-mail-product-v183 .hj-mail-attachment strong { font-size: 11px; }
.hj-mail-product-v183 .hj-mail-attachment small { font-size: 9.5px; }
.hj-mail-product-v183 .hj-mail-quick-reply { font-size: 11.5px; }
.hj-mail-product-v183 .hj-mail-settings-tabs button { font-size: 11px; }
.hj-mail-product-v183 .hj-mail-settings-panel p { font-size: 11.5px; }
.hj-mail-product-v183 .hj-mail-settings-eyebrow { font-size: 9px; }
.hj-mail-product-v183 .hj-mail-health-lines > div { font-size: 11px; }
.hj-mail-product-v183 .hj-mail-health-recommendations strong { font-size: 11px; }
.hj-mail-product-v183 .hj-mail-health-recommendations p,
.hj-mail-product-v183 .hj-mail-health-recommendations ul { font-size: 10.5px; }
.hj-mail-product-v183 .hj-mail-diagnostic-button,
.hj-mail-product-v183 .hj-mail-harden-button { font-size: 10.5px; }
.hj-mail-product-v183 .hj-mail-protection-grid strong { font-size: 11.5px; }
.hj-mail-product-v183 .hj-mail-protection-grid small { font-size: 10px; }
.hj-mail-product-v183 .hj-mail-protection-note strong { font-size: 10.5px; }
.hj-mail-product-v183 .hj-mail-protection-note span { font-size: 10px; }
.hj-mail-product-v183 .hj-mail-preference-row strong { font-size: 11.5px; }
.hj-mail-product-v183 .hj-mail-preference-row small { font-size: 10px; }
.hj-mail-product-v183 .hj-mail-sidebar,
.hj-mail-product-v183 .hj-mail-message-list,
.hj-mail-product-v183 .hj-mail-message-frame-wrap,
.hj-mail-product-v183 .hj-mail-settings-drawer { scrollbar-width: thin; scrollbar-color: #c8d5cd transparent; }
.hj-mail-product-v183 ::-webkit-scrollbar { width: 8px; height: 8px; }
.hj-mail-product-v183 ::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 999px; background: #c8d5cd; background-clip: padding-box; }
.hj-mail-product-v183 ::-webkit-scrollbar-track { background: transparent; }


/* ========================================================================== */
/* HostingJet Mail 0.19.0 — premium productivity workspace                   */
/* ========================================================================== */
.hj-mail-product-v190 {
  --hjm-canvas:#f3f6f2;--hjm-panel:#fff;--hjm-panel-2:#f8faf7;--hjm-forest:#082f27;
  --hjm-forest-2:#0d493b;--hjm-emerald:#0d8b62;--hjm-lime:#d9f875;--hjm-ink:#15231e;
  --hjm-copy:#405047;--hjm-muted:#7c8982;--hjm-line:#dfe7e1;--hjm-line-strong:#ccd8d1;
  --hjm-danger:#b73e47;--hjm-shadow:0 24px 70px rgba(8,47,39,.10);
  grid-template-rows:72px minmax(0,1fr)!important;background:var(--hjm-canvas)!important;color:var(--hjm-ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
.hj-mail-product-v190,.hj-mail-product-v190 *{box-sizing:border-box}
.hj-mail-product-v190 button,.hj-mail-product-v190 input,.hj-mail-product-v190 select,.hj-mail-product-v190 textarea{font:inherit}
.hj-mail-product-v190 .hj-mail-topbar{min-height:72px!important;padding:0 20px!important;grid-template-columns:258px minmax(320px,720px) minmax(420px,1fr)!important;gap:18px!important;border-bottom:1px solid var(--hjm-line)!important;background:rgba(251,252,250,.96)!important;backdrop-filter:blur(18px)}
.hj-mail-product-v190 .hj-mail-brand-zone strong{font-size:17px!important;font-weight:780!important;letter-spacing:-.035em;color:var(--hjm-forest)!important}.hj-mail-product-v190 .hj-mail-brand-zone small{font-size:10.5px!important;color:var(--hjm-muted)!important;text-transform:none!important;letter-spacing:0!important}
.hj-mail-product-v190 .hj-mail-brand-symbol{width:34px!important;height:34px!important;border-radius:11px!important;background:var(--hjm-forest)!important;box-shadow:0 10px 24px rgba(8,47,39,.18)!important}.hj-mail-product-v190 .hj-mail-brand-symbol i{background:var(--hjm-lime)!important}
.hj-mail-product-v190 .hj-mail-global-search{height:44px!important;border:1px solid #dce5df!important;border-radius:13px!important;background:#eef2ee!important;padding:0 15px!important;box-shadow:none!important}.hj-mail-product-v190 .hj-mail-global-search:focus-within{background:#fff!important;border-color:#9fc1b1!important;box-shadow:0 0 0 4px rgba(13,139,98,.09)!important}.hj-mail-product-v190 .hj-mail-global-search input{font-size:13px!important}
.hj-mail-product-v190 .hj-mail-top-actions{gap:8px!important}.hj-mail-product-v190 .hj-mail-health-chip,.hj-mail-product-v190 .hj-mailbox-switcher,.hj-mail-product-v190 .hj-mail-icon-button{height:38px!important;border:1px solid var(--hjm-line)!important;border-radius:10px!important;background:#fff!important;color:#5e6d65!important;box-shadow:none!important}.hj-mail-product-v190 .hj-mail-health-chip:hover,.hj-mail-product-v190 .hj-mail-icon-button:hover{border-color:#b9c9c0!important;color:var(--hjm-forest)!important}.hj-mail-product-v190 .hj-mailbox-switcher select{font-size:11.5px!important}
.hj-mail-product-v190 .hj-mail-layout{grid-template-columns:238px minmax(350px,400px) minmax(520px,1fr)!important;gap:12px!important;padding:12px!important;background:var(--hjm-canvas)!important;min-height:0!important}
.hj-mail-product-v190 .hj-mail-sidebar,.hj-mail-product-v190 .hj-mail-list-pane,.hj-mail-product-v190 .hj-mail-reader{border:1px solid var(--hjm-line)!important;border-radius:18px!important;background:#fff!important;box-shadow:0 10px 34px rgba(17,54,42,.045)!important;overflow:hidden!important;min-height:0!important}
.hj-mail-product-v190 .hj-mail-sidebar{padding:12px 10px!important;background:#fbfcfa!important;overflow-y:auto!important}.hj-mail-product-v190 .hj-mail-compose-button{min-height:48px!important;border-radius:13px!important;background:var(--hjm-forest)!important;box-shadow:0 12px 24px rgba(8,47,39,.17)!important;font-size:12.5px!important}.hj-mail-product-v190 .hj-mail-compose-button:hover{background:var(--hjm-forest-2)!important;transform:translateY(-1px)}.hj-mail-product-v190 .hj-mail-compose-button>span,.hj-mail-product-v190 .hj-mail-compose-button svg{color:var(--hjm-lime)!important}
.hj-mail-product-v190 .hj-mail-system-folders{gap:3px!important;margin-top:14px!important}.hj-mail-product-v190 .hj-mail-system-folders button,.hj-mail-product-v190 .hj-mail-custom-folders nav button{min-height:40px!important;padding:0 11px!important;border-radius:10px!important;color:#59675f!important;font-size:12.5px!important;font-weight:650!important}.hj-mail-product-v190 .hj-mail-system-folders button:hover,.hj-mail-product-v190 .hj-mail-custom-folders nav button:hover{background:#f0f4f0!important;color:var(--hjm-forest)!important}.hj-mail-product-v190 .hj-mail-system-folders button.is-active,.hj-mail-product-v190 .hj-mail-custom-folders nav button.is-active{background:var(--hjm-forest)!important;color:#fff!important}.hj-mail-product-v190 .hj-mail-system-folders button.is-active svg{color:var(--hjm-lime)!important}.hj-mail-product-v190 .hj-mail-system-folders button b{background:#eef2ef!important;color:#65736b!important}.hj-mail-product-v190 .hj-mail-system-folders button.is-active b{background:rgba(217,248,117,.17)!important;color:var(--hjm-lime)!important}.hj-mail-product-v190 .hj-mail-storage{padding:13px!important;border-radius:12px!important;background:#f3f6f3!important;box-shadow:none!important}
.hj-mail-product-v190 .hj-mail-list-pane{grid-template-rows:66px auto minmax(0,1fr) 42px!important}.hj-mail-product-v190 .hj-mail-list-toolbar{padding:0 14px!important;border-bottom:1px solid var(--hjm-line)!important;background:#fff!important}.hj-mail-product-v190 .hj-mail-current-folder strong{font-size:14.5px!important;font-weight:780!important;color:var(--hjm-forest)!important}.hj-mail-product-v190 .hj-mail-current-folder small{font-size:10.5px!important;color:#89958e!important}.hj-mail-product-v190 .hj-mail-filter-button{min-height:31px!important;border-radius:9px!important;font-size:11px!important;background:#f7f9f7!important;border-color:#e1e7e3!important}.hj-mail-product-v190 .hj-mail-sort{font-size:11px!important}
.hj-mail-product-v190 .hj-mail-message-list{overflow-y:auto!important;background:#fff!important}.hj-mail-product-v190 .hj-mail-message{min-height:86px!important;padding:12px 13px!important;grid-template-columns:18px 40px minmax(0,1fr) 25px!important;gap:10px!important;border-bottom:1px solid #edf1ee!important;cursor:pointer!important;transition:background .16s ease,box-shadow .16s ease!important}.hj-mail-product-v190 .hj-mail-message:hover{background:#f7faf7!important}.hj-mail-product-v190 .hj-mail-message.is-selected{background:#edf5ef!important;box-shadow:inset 3px 0 var(--hjm-forest)!important}.hj-mail-product-v190 .hj-mail-message-avatar{width:40px!important;height:40px!important;border:1px solid #d4e1d9!important;background:#eaf2ed!important;color:var(--hjm-forest)!important;font-size:11px!important}.hj-mail-product-v190 .hj-mail-message-copy>strong{font-size:13px!important;line-height:1.25!important;color:#2d3b34!important}.hj-mail-product-v190 .hj-mail-message-copy>time{font-size:10.5px!important;color:#8d9992!important}.hj-mail-product-v190 .hj-mail-message-subject{font-size:12.3px!important;font-weight:690!important;color:#25332c!important}.hj-mail-product-v190 .hj-mail-message-preview{font-size:10.8px!important;color:#87938c!important;line-height:1.38!important}.hj-mail-product-v190 .hj-mail-pagination{background:#fbfcfa!important;border-top:1px solid var(--hjm-line)!important}
.hj-mail-product-v190 .hj-mail-reader{background:#fff!important}.hj-mail-product-v190 .hj-mail-reader-empty{background:radial-gradient(circle at 50% 42%,#edf6ef 0,#fff 58%)!important}.hj-mail-product-v190 .hj-mail-reader-empty h3{font-size:21px!important;color:var(--hjm-forest)!important}.hj-mail-product-v190 .hj-mail-reader-empty p{font-size:12.5px!important;color:var(--hjm-muted)!important}.hj-mail-product-v190 .hj-mail-message-head{padding:22px 26px 17px!important;border-bottom:1px solid var(--hjm-line)!important}.hj-mail-product-v190 .hj-mail-subject-row h2{font-size:20px!important;line-height:1.25!important;color:var(--hjm-forest)!important;letter-spacing:-.03em!important}.hj-mail-product-v190 .hj-mail-sender-row{margin-top:14px!important}.hj-mail-product-v190 .hj-mail-sender-avatar{width:40px!important;height:40px!important}.hj-mail-product-v190 .hj-mail-sender-row strong{font-size:13px!important}.hj-mail-product-v190 .hj-mail-sender-row small,.hj-mail-product-v190 .hj-mail-sender-row>time{font-size:10.5px!important}.hj-mail-product-v190 .hj-mail-message-actions{margin-top:15px!important;gap:6px!important}.hj-mail-product-v190 .hj-mail-message-actions button{height:32px!important;min-width:32px!important;border-radius:9px!important}.hj-mail-product-v190 .hj-mail-message-actions button:first-child{width:auto!important;padding:0 12px!important;background:var(--hjm-forest)!important;color:#fff!important;font-size:11px!important;font-weight:720!important}.hj-mail-product-v190 .hj-mail-message-frame-wrap{background:#fff!important}.hj-mail-product-v190 .hj-mail-message-frame-wrap iframe{min-height:480px!important}.hj-mail-product-v190 .hj-mail-quick-reply{margin:0 22px 18px!important;min-height:52px!important;border-radius:13px!important;font-size:11.5px!important;box-shadow:none!important}.hj-mail-product-v190 .hj-mail-attachments{padding:13px 24px!important}
.hj-mail-product-v190 .hj-mail-composer{right:24px!important;bottom:22px!important;width:min(680px,calc(100vw - 48px))!important;height:min(740px,calc(100vh - 104px))!important;border:1px solid #cbd9d1!important;border-radius:19px!important;box-shadow:0 34px 100px rgba(8,47,39,.24)!important}.hj-mail-product-v190 .hj-mail-composer>header{background:var(--hjm-forest)!important}.hj-mail-product-v190 .hj-mail-compose-fields{padding:8px 22px 0!important}.hj-mail-product-v190 .hj-mail-compose-fields label{min-height:48px!important}.hj-mail-product-v190 .hj-mail-compose-editor{padding:20px 22px!important;font-size:14px!important;line-height:1.65!important}.hj-mail-product-v190 .hj-mail-composer>footer{padding:12px 18px!important;border-top:1px solid var(--hjm-line)!important}.hj-mail-product-v190 .hj-mail-send-button{min-width:108px!important;min-height:42px!important;border-radius:11px!important;background:var(--hjm-forest)!important;color:#fff!important}.hj-mail-product-v190 .hj-mail-send-button svg{color:var(--hjm-lime)!important}
.hj-mail-product-v190 .hj-mail-settings-drawer{width:min(560px,100%)!important;background:#f7f9f7!important}.hj-mail-product-v190 .hj-mail-settings-tabs{padding:8px 18px!important;gap:6px!important;background:#fff!important;border-bottom:1px solid var(--hjm-line)!important}.hj-mail-product-v190 .hj-mail-settings-tabs button{min-height:36px!important;border-radius:9px!important;font-size:11px!important}.hj-mail-product-v190 .hj-mail-settings-tabs button.is-active{background:var(--hjm-forest)!important;color:#fff!important}.hj-mail-product-v190 .hj-mail-settings-panel{padding:18px!important}.hj-mail-product-v190 .hj-mail-settings-panel>section{padding:18px!important;border:1px solid var(--hjm-line)!important;border-radius:15px!important;background:#fff!important}.hj-mail-product-v190 .hj-mail-health-lines>div{min-height:42px!important;font-size:11px!important}.hj-mail-product-v190 .hj-mail-diagnostic-button,.hj-mail-product-v190 .hj-mail-harden-button{min-height:42px!important;border-radius:10px!important}
.hj-mail-undo-send{position:fixed;left:50%;bottom:24px;z-index:2147483647;width:min(480px,calc(100vw - 28px));min-height:76px;padding:13px 14px 11px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 16px;align-items:center;border:1px solid rgba(217,248,117,.3);border-radius:16px;background:#082f27;color:#fff;box-shadow:0 26px 80px rgba(8,47,39,.34);transform:translateX(-50%);overflow:hidden}.hj-mail-undo-send>div{display:flex;align-items:center;gap:11px;min-width:0}.hj-mail-undo-icon{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:rgba(217,248,117,.15);color:#d9f875;font-weight:900}.hj-mail-undo-send p{margin:0;display:grid;gap:2px;min-width:0}.hj-mail-undo-send strong{font-size:12.5px}.hj-mail-undo-send small{font-size:10.5px;color:#cddbd4}.hj-mail-undo-send button{height:38px;padding:0 15px;border:1px solid rgba(217,248,117,.36);border-radius:10px;background:#d9f875;color:#082f27;font-size:11px;font-weight:800;cursor:pointer}.hj-mail-undo-send>i{grid-column:1/-1;height:3px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}.hj-mail-undo-send>i span{display:block;width:100%;height:100%;background:#d9f875;transform-origin:left;animation:hjMailUndoProgress linear forwards}@keyframes hjMailUndoProgress{to{transform:scaleX(0)}}.hj-mail-undo-send.is-sending button{opacity:.55;cursor:default}
@media(max-width:1220px){.hj-mail-product-v190 .hj-mail-topbar{grid-template-columns:220px minmax(260px,1fr) auto!important}.hj-mail-product-v190 .hj-mail-layout{grid-template-columns:210px minmax(340px,380px) minmax(440px,1fr)!important}}
@media(max-width:980px){.hj-mail-product-v190 .hj-mail-layout{grid-template-columns:72px minmax(330px,42%) minmax(400px,1fr)!important;gap:8px!important;padding:8px!important}.hj-mail-product-v190 .hj-mail-sidebar{padding-inline:7px!important}.hj-mail-product-v190 .hj-mail-sidebar,.hj-mail-product-v190 .hj-mail-list-pane,.hj-mail-product-v190 .hj-mail-reader{border-radius:14px!important}}
@media(max-width:720px){.hj-mail-product-v190{grid-template-rows:62px minmax(0,1fr)!important}.hj-mail-product-v190 .hj-mail-layout{display:block!important;padding:0!important}.hj-mail-product-v190 .hj-mail-sidebar,.hj-mail-product-v190 .hj-mail-list-pane,.hj-mail-product-v190 .hj-mail-reader{border:0!important;border-radius:0!important;box-shadow:none!important}.hj-mail-product-v190 .hj-mail-composer{inset:8px!important;width:auto!important;height:auto!important;border-radius:15px!important}.hj-mail-product-v190 .hj-mail-settings-drawer{width:100%!important}.hj-mail-undo-send{bottom:12px!important}}


/* HostingJet Mail state contract.
   Author-level display rules can override the browser's native [hidden] rule.
   Keep every inactive mail layer truly removed from layout, including v200. */
.hj-mail-product[hidden],
.hj-mail-product [hidden] { display: none !important; }
.hj-mail-reader.has-open-message .hj-mail-reader-empty { display: none !important; }
.hj-mail-reader:not(.has-open-message) .hj-mail-reading-surface { display: none !important; }

/* ========================================================================== 
   HostingJet Mail v0.20.0 — Mail Success Experience
   A focused, high-performance workspace with dashboard-aligned winter white,
   precise forest accents, compact information hierarchy, and calm motion.
   ========================================================================== */
.hj-mail-product-v200 {
  --hjm-canvas:#f6f8f5;--hjm-surface:#fff;--hjm-soft:#f0f4f0;--hjm-soft-2:#e9efea;
  --hjm-ink:#10231c;--hjm-muted:#617069;--hjm-line:#dfe6e0;--hjm-forest:#0a3328;
  --hjm-forest-2:#124b3b;--hjm-emerald:#0f8a63;--hjm-lime:#d9ff72;--hjm-danger:#b83f4a;
  --hjm-shadow:0 18px 54px rgba(11,49,38,.08);--hjm-radius:16px;
  grid-template-rows:64px minmax(0,1fr);background:var(--hjm-canvas)!important;color:var(--hjm-ink);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;
}
.hj-mail-product-v200 .hj-mail-topbar{min-height:64px;padding:0 18px;gap:14px;border-color:var(--hjm-line);background:rgba(255,255,255,.96);box-shadow:0 1px 0 rgba(10,51,40,.03);backdrop-filter:blur(18px)}
.hj-mail-product-v200.hj-mail-viewport .hj-mail-topbar{grid-template-columns:220px minmax(320px,720px) minmax(420px,1fr)}
.hj-mail-product-v200.hj-mail-viewport .hj-mail-layout{grid-template-columns:220px minmax(340px,400px) minmax(0,1fr);background:var(--hjm-canvas)}
.hj-mail-product-v200 .hj-mail-brand-symbol{width:34px;height:34px;border-radius:11px;background:var(--hjm-forest);box-shadow:0 10px 24px rgba(10,51,40,.16)}
.hj-mail-product-v200 .hj-mail-brand-symbol i{background:var(--hjm-lime)}
.hj-mail-product-v200 .hj-mail-brand-zone strong{font-size:16px;font-weight:800;letter-spacing:-.035em;color:var(--hjm-forest)}
.hj-mail-product-v200 .hj-mail-brand-zone small{font-size:9px;color:#7a8981;text-transform:uppercase;letter-spacing:.08em}
.hj-mail-product-v200 .hj-mail-global-search{height:40px;border:1px solid transparent;border-radius:12px;background:#f1f4f1;box-shadow:none}
.hj-mail-product-v200 .hj-mail-global-search:focus-within{border-color:rgba(15,138,99,.34);background:#fff;box-shadow:0 0 0 4px rgba(15,138,99,.08)}
.hj-mail-product-v200 .hj-mail-health-chip,.hj-mail-product-v200 .hj-mailbox-switcher,.hj-mail-product-v200 .hj-mail-icon-button{height:38px;border:1px solid var(--hjm-line);border-radius:11px;background:#fff;color:var(--hjm-forest)}
.hj-mail-product-v200 .hj-mail-health-chip.is-good{background:#eff8f3;border-color:#cce6d8}.hj-mail-product-v200 .hj-mail-health-chip.is-warning{background:#fff9e8;border-color:#eadca7}.hj-mail-product-v200 .hj-mail-health-chip.is-critical{background:#fff0f1;border-color:#ecc9cd}
.hj-mail-product-v200 .hj-mail-sidebar{padding:14px 12px 12px;border-right:1px solid var(--hjm-line);background:#fbfcfa}
.hj-mail-product-v200 .hj-mail-compose-button{min-height:46px;border-radius:12px;background:var(--hjm-forest);color:#fff;box-shadow:0 12px 26px rgba(10,51,40,.16);font-size:12px}.hj-mail-product-v200 .hj-mail-compose-button svg,.hj-mail-product-v200 .hj-mail-compose-button>span{color:var(--hjm-lime)}
.hj-mail-product-v200 .hj-mail-system-folders{gap:3px;margin-top:14px}.hj-mail-product-v200 .hj-mail-system-folders button,.hj-mail-product-v200 .hj-mail-custom-folders nav button{min-height:39px;padding:0 10px;border-radius:9px;color:#4f5f57;font-size:11.5px;font-weight:620}.hj-mail-product-v200 .hj-mail-system-folders button:hover,.hj-mail-product-v200 .hj-mail-custom-folders nav button:hover{background:#eef2ee;color:var(--hjm-forest)}.hj-mail-product-v200 .hj-mail-system-folders button.is-active,.hj-mail-product-v200 .hj-mail-custom-folders nav button.is-active{background:var(--hjm-forest);color:#fff}.hj-mail-product-v200 .hj-mail-system-folders button.is-active svg{color:var(--hjm-lime)}
.hj-mail-product-v200 .hj-mail-storage{padding:12px;border:1px solid var(--hjm-line);border-radius:12px;background:#fff;box-shadow:none}
.hj-mail-product-v200 .hj-mail-list-pane{grid-template-rows:64px auto minmax(0,1fr) 40px;border-right:1px solid var(--hjm-line);background:#fff}
.hj-mail-product-v200 .hj-mail-list-toolbar{padding:0 13px;border-bottom:1px solid var(--hjm-line);background:#fff}.hj-mail-product-v200 .hj-mail-current-folder strong{font-size:14px;font-weight:780;color:var(--hjm-forest)}.hj-mail-product-v200 .hj-mail-current-folder small{font-size:9px;color:#849088}
.hj-mail-product-v200 .hj-mail-message-list{background:#fff;scrollbar-color:#cad4cc transparent}.hj-mail-product-v200 .hj-mail-message{min-height:82px;padding:12px 12px 12px 18px;gap:10px;border-bottom:1px solid #edf1ed;background:#fff;transition:background .12s ease,box-shadow .12s ease}.hj-mail-product-v200 .hj-mail-message:hover{background:#f9fbf9}.hj-mail-product-v200 .hj-mail-message.is-selected{background:#eef7f1;box-shadow:inset 3px 0 var(--hjm-emerald)}.hj-mail-product-v200 .hj-mail-message-avatar{width:36px;height:36px;background:#e5efe8;color:var(--hjm-forest);font-size:10px}.hj-mail-product-v200 .hj-mail-message-copy>strong{font-size:11.5px;color:#35443c}.hj-mail-product-v200 .hj-mail-message-subject{font-size:11px;color:#26372f}.hj-mail-product-v200 .hj-mail-message-preview{font-size:9.5px;color:#7f8b84}.hj-mail-product-v200 .hj-mail-message.is-unread .hj-mail-message-copy>strong,.hj-mail-product-v200 .hj-mail-message.is-unread .hj-mail-message-subject{font-weight:800;color:var(--hjm-forest)}
.hj-mail-product-v200.is-density-compact .hj-mail-message{min-height:68px;padding-block:8px}.hj-mail-product-v200.is-density-compact .hj-mail-message-preview{display:none}.hj-mail-product-v200.is-density-spacious .hj-mail-message{min-height:96px;padding-block:16px}
.hj-mail-product-v200 .hj-mail-reader{background:#fff}.hj-mail-product-v200 .hj-mail-reading-surface{background:#fff}.hj-mail-product-v200 .hj-mail-message-head{padding:22px 26px 16px;border-bottom:1px solid var(--hjm-line)}.hj-mail-product-v200 .hj-mail-subject-row h2{font-size:21px;line-height:1.28;letter-spacing:-.035em;color:#13271f}.hj-mail-product-v200 .hj-mail-sender-row strong{font-size:12px;color:#26392f}.hj-mail-product-v200 .hj-mail-message-actions button{min-height:34px;padding:0 10px;border:1px solid var(--hjm-line);border-radius:10px;background:#fff;color:#53635a}.hj-mail-product-v200 .hj-mail-message-actions button:hover{background:var(--hjm-soft);color:var(--hjm-forest)}
.hj-mail-product-v200 .hj-mail-privacy-banner,.hj-mail-product-v200 .hj-mail-security-status{margin:11px 18px 0;padding:10px 12px;border:1px solid #d6e6dc;border-radius:10px;background:#f1f8f4;color:#49685a;font-size:9.5px}.hj-mail-product-v200 .hj-mail-security-status.is-caution{border-color:#ebd7a4;background:#fff9e9;color:#725c1f}
.hj-mail-product-v200 .hj-mail-message-frame-wrap{background:#fff}.hj-mail-product-v200 .hj-mail-attachments{border-color:var(--hjm-line);background:#fafcfa}.hj-mail-product-v200 .hj-mail-quick-reply{border-color:var(--hjm-line);border-radius:13px}
.hj-mail-product-v200 .hj-mail-composer{right:24px;bottom:20px;width:min(720px,calc(100vw - 48px));height:min(720px,calc(100vh - 96px));border:1px solid #d6e1da;border-radius:18px;background:#fff;box-shadow:0 34px 110px rgba(8,35,27,.25)}.hj-mail-product-v200 .hj-mail-composer>header{min-height:58px;padding:0 18px;background:#f7faf7;border-color:var(--hjm-line)}.hj-mail-product-v200 .hj-mail-compose-fields{padding-inline:18px}.hj-mail-product-v200 .hj-mail-compose-fields label{grid-template-columns:72px minmax(0,1fr)}.hj-mail-product-v200 .hj-mail-compose-editor{padding:22px;font-size:14px;line-height:1.7}.hj-mail-product-v200 .hj-mail-signature{margin-top:20px;padding-top:14px;border-top:1px solid #e6ebe7;color:#5b6961}
.hj-mail-product-v200 .hj-mail-settings-drawer{width:min(520px,100vw);background:#fff}.hj-mail-product-v200 .hj-mail-settings-tabs{position:sticky;top:0;z-index:2;display:flex;gap:4px;padding:9px 16px;border-bottom:1px solid var(--hjm-line);background:#fff;overflow:auto}.hj-mail-product-v200 .hj-mail-settings-tabs button{white-space:nowrap}.hj-mail-product-v200 .hj-mail-settings-panel>section{padding:20px}.hj-mail-product-v200 .hj-mail-reliability-head>strong{font-size:34px;color:var(--hjm-forest)}
.hj-mail-success-components{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:15px 0}.hj-mail-success-components>div{padding:12px;border:1px solid var(--hjm-line);border-radius:11px;background:#fafcfa}.hj-mail-success-components span{display:block;color:#7a887f;font-size:8px;text-transform:uppercase;letter-spacing:.08em}.hj-mail-success-components b{display:block;margin-top:4px;color:var(--hjm-forest);font-size:16px}
.hj-mail-automation-status{margin:14px 0;padding:13px;border:1px solid #d6e5db;border-radius:12px;background:linear-gradient(135deg,#f1f8f4,#fbfdfb)}.hj-mail-automation-status span{display:block;color:var(--hjm-emerald);font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.1em}.hj-mail-automation-status strong{display:block;margin-top:4px;color:var(--hjm-forest);font-size:12px}.hj-mail-automation-status small{display:block;margin-top:3px;color:#718078;font-size:9px;line-height:1.5}
.hj-mail-identity-form,.hj-mail-preference-form{display:grid;gap:12px;margin-top:16px}.hj-mail-identity-form label,.hj-mail-preference-form label{display:grid;gap:6px}.hj-mail-identity-form label>span,.hj-mail-preference-form label>span{color:#5f6d65;font-size:9px;font-weight:750}.hj-mail-identity-form input,.hj-mail-identity-form textarea,.hj-mail-preference-form select{width:100%;border:1px solid var(--hjm-line)!important;border-radius:10px!important;background:#fff!important;color:var(--hjm-ink)!important}.hj-mail-identity-form button,.hj-mail-preference-form button{min-height:38px;border:0;border-radius:10px;background:var(--hjm-forest);color:#fff;font-weight:750}
.hj-mail-product-v200 .hj-mail-onboarding{background:radial-gradient(circle at 12% 24%,rgba(217,255,114,.16),transparent 30%),linear-gradient(135deg,#f8faf7,#eef4ef)}.hj-mail-product-v200 .hj-mail-onboarding-intro h1{color:var(--hjm-forest);letter-spacing:-.06em}.hj-mail-product-v200 .hj-mail-onboarding-card{border:1px solid #d9e2dc;border-radius:20px;background:rgba(255,255,255,.94);box-shadow:var(--hjm-shadow)}
@media(max-width:1180px){.hj-mail-product-v200.hj-mail-viewport .hj-mail-layout{grid-template-columns:76px minmax(320px,42%) minmax(0,1fr)}.hj-mail-product-v200.hj-mail-viewport .hj-mail-topbar{grid-template-columns:76px minmax(280px,1fr) auto}.hj-mail-product-v200 .hj-mail-sidebar .hj-mail-compose-button strong,.hj-mail-product-v200 .hj-mail-sidebar .hj-mail-system-folders strong,.hj-mail-product-v200 .hj-mail-storage,.hj-mail-product-v200 .hj-mail-custom-folders{display:none}.hj-mail-product-v200 .hj-mail-sidebar{align-items:center}.hj-mail-product-v200 .hj-mail-compose-button{width:46px;padding:0}.hj-mail-product-v200 .hj-mail-system-folders button{width:46px;justify-content:center;padding:0}.hj-mail-product-v200 .hj-mail-system-folders button b{position:absolute;transform:translate(14px,-13px)}}
@media(max-width:820px){.hj-mail-product-v200.hj-mail-viewport .hj-mail-layout{grid-template-columns:64px minmax(0,1fr)}.hj-mail-product-v200 .hj-mail-reader{position:absolute;inset:0 0 0 64px;z-index:30;transform:translateX(100%);transition:transform .2s ease}.hj-mail-product-v200 .hj-mail-reader.is-open{transform:translateX(0)}.hj-mail-product-v200 .hj-mail-topbar{padding-inline:10px}.hj-mail-product-v200 .hj-mail-global-search,.hj-mail-product-v200 .hj-mail-health-chip>span,.hj-mail-product-v200 .hj-mailbox-switcher{display:none}.hj-mail-success-components{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.hj-mail-product-v200.hj-mail-viewport .hj-mail-layout{grid-template-columns:1fr}.hj-mail-product-v200 .hj-mail-sidebar{position:fixed;left:10px;right:10px;bottom:8px;z-index:40;height:58px;padding:6px;display:flex;border:1px solid var(--hjm-line);border-radius:16px;background:rgba(255,255,255,.96);box-shadow:0 18px 50px rgba(8,35,27,.16)}.hj-mail-product-v200 .hj-mail-system-folders{margin:0;display:flex}.hj-mail-product-v200 .hj-mail-system-folders button:nth-child(n+5){display:none}.hj-mail-product-v200 .hj-mail-reader{inset:0 0 66px}.hj-mail-product-v200 .hj-mail-list-pane{padding-bottom:66px}.hj-mail-product-v200 .hj-mail-composer{inset:8px;width:auto;height:auto;border-radius:16px}}

/* ========================================================================== 
   HostingJet 0.21.3 — Mail reader, Poppins, premium search, and Deliverability Shield
   ========================================================================== */
.hj-mail-product-v200,
.hj-mail-product-v200 button,
.hj-mail-product-v200 input,
.hj-mail-product-v200 select,
.hj-mail-product-v200 textarea,
.hj-mail-product-v200 .hj-mail-compose-editor {
  font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
}
.hj-mail-product-v200 .hj-mail-message-head {
  position: relative;
  padding: 24px 28px 18px;
  overflow: visible;
}
.hj-mail-product-v200 .hj-mail-subject-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  align-items: start;
  gap: 14px;
}
.hj-mail-product-v200 .hj-mail-subject-row h2 {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
  overflow-wrap: anywhere;
  font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif !important;
  font-size: clamp(18px, 1.55vw, 24px);
  font-weight: 700;
  line-height: 1.32;
  letter-spacing: -.035em;
}
.hj-mail-product-v200 .hj-mail-subject-row > button {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 10px;
}
.hj-mail-product-v200 .hj-mail-sender-row {
  margin-top: 16px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
}
.hj-mail-product-v200 .hj-mail-sender-row > div:nth-child(2) {
  min-width: 0;
}
.hj-mail-product-v200 .hj-mail-sender-row strong,
.hj-mail-product-v200 .hj-mail-sender-row small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hj-mail-product-v200 .hj-mail-sender-row > time {
  max-width: 210px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
}
.hj-mail-product-v200 .hj-mail-message-actions {
  margin: 15px 0 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.hj-mail-product-v200 .hj-mail-message-actions button {
  width: auto;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 0 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 0 0 auto;
  overflow: hidden;
  white-space: nowrap;
  font-size: 10.5px;
  font-weight: 650;
  line-height: 1;
}
.hj-mail-product-v200 .hj-mail-message-actions button svg {
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
}
.hj-mail-product-v200 .hj-mail-message-actions > span {
  width: 1px;
  height: 22px;
  margin: 0 2px;
  flex: 0 0 auto;
  background: var(--hjm-line);
}
.hj-mail-product-v200 .hj-mail-message-frame-wrap iframe {
  width: 100%;
  min-height: 500px;
  display: block;
  border: 0;
  background: #fff;
}
.hj-mail-product-v200 .hj-mail-quick-reply {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  text-align: left;
  color: #7a8780;
  font-size: 11px;
}
.hj-mail-product-v200 .hj-mail-quick-reply > span:nth-child(2) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hj-mail-product-v200 .hj-mail-quick-reply > b {
  color: var(--hjm-forest);
  font-size: 10.5px;
}
.hj-command-suggestions {
  padding: 10px 16px 4px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  color: #778079;
  font-size: 10.5px;
}
.hj-command-suggestions button {
  min-height: 27px;
  padding: 0 10px;
  border: 1px solid #dfe6df;
  border-radius: 999px;
  background: #fff;
  color: #234c3d;
  cursor: pointer;
  font: 600 10.5px/1 Poppins, Inter, sans-serif;
}
.hj-command-suggestions button:hover { border-color: #b9d5c4; background: #f1f8f3; }
.hj-command-result-title {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
}
.hj-command-result-title > strong { min-width: 0; flex: 0 1 auto; }
.hj-command-result-title > em {
  max-width: 120px;
  padding: 3px 7px;
  overflow: hidden;
  border: 1px solid #dce8df;
  border-radius: 999px;
  background: #f1f7f2;
  color: #4d6a5e;
  font-size: 8.5px;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  text-overflow: ellipsis;
  text-transform: uppercase;
  letter-spacing: .045em;
  white-space: nowrap;
}
@media (max-width: 980px) {
  .hj-mail-product-v200 .hj-mail-message-head { padding: 20px 20px 15px; }
  .hj-mail-product-v200 .hj-mail-message-actions button span { display: none; }
  .hj-mail-product-v200 .hj-mail-message-actions button { padding-inline: 9px; }
}
@media (max-width: 620px) {
  .hj-mail-product-v200 .hj-mail-subject-row h2 { -webkit-line-clamp: 3; font-size: 17px; }
  .hj-mail-product-v200 .hj-mail-sender-row { grid-template-columns: 36px minmax(0,1fr); }
  .hj-mail-product-v200 .hj-mail-sender-row > time { grid-column: 2; text-align: left; max-width: 100%; }
  .hj-mail-product-v200 .hj-mail-message-actions > span { display: none; }
  .hj-command-result-title > em { display: none; }
}


/* ========================================================================== */
/* HostingJet 0.27.0 — Finex-reference customer dashboard                    */
/* Page one rebuild: customer overview + global enterprise navigation shell. */
/* ========================================================================== */
.hj-experience-v27 {
  --hj27-bg:#e8eaee;
  --hj27-surface:#ffffff;
  --hj27-soft:#f6f7f6;
  --hj27-line:#e8eae8;
  --hj27-ink:#111410;
  --hj27-muted:#6f756f;
  --hj27-green:#075c45;
  --hj27-green-2:#0a7b58;
  --hj27-lime:#aaff24;
  --hj27-lime-soft:#eaffc7;
  --hj27-black:#171914;
  --hj27-danger:#e04444;
  --hj27-warning:#d9a514;
  width:100%;
  min-height:100vh;
  padding:22px;
  gap:0 !important;
  align-items:stretch !important;
  overflow:visible !important;
  background:var(--hj27-bg) !important;
  color:var(--hj27-ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.hj-experience-v27.hj-shell-embedded { width:100vw; margin-left:calc(50% - 50vw); }
.hj-experience-v27 *, .hj-experience-v27 *::before, .hj-experience-v27 *::after { box-sizing:border-box; }
.hj-experience-v27 a { color:inherit; }
.hj-experience-v27 .hj-sidebar {
  position:sticky !important;
  inset:auto !important;
  top:22px !important;
  width:68px !important;
  min-width:68px !important;
  height:calc(100vh - 44px) !important;
  padding:16px 10px !important;
  display:flex !important;
  flex-direction:column !important;
  border:1px solid rgba(255,255,255,.86) !important;
  border-right:0 !important;
  border-radius:22px 0 0 22px !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 22px 70px rgba(30,34,30,.05) !important;
  backdrop-filter:blur(20px);
  overflow:visible !important;
  z-index:80;
}
.hj-experience-v27 .hj-v27-rail-head { display:grid; place-items:center; min-height:50px; position:relative; }
.hj-experience-v27 .hj-sidebar-brand { width:42px !important; height:42px !important; padding:0 !important; display:grid !important; place-items:center; border-radius:14px; background:#fff; text-decoration:none; }
.hj-experience-v27 .hj-sidebar-brand .hj-brand-mark { width:34px; height:34px; border-radius:50%; background:linear-gradient(145deg,#5da36b,#1d6545); box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),0 5px 14px rgba(7,92,69,.18); }
.hj-experience-v27 .hj-sidebar-brand .hj-brand-mark i { background:#fff; }
.hj-experience-v27 .hj-sidebar-brand > .hj-nav-label { display:none; }
.hj-experience-v27 .hj-sidebar-close { display:none !important; }
.hj-experience-v27 .hj-v27-rail-button,
.hj-experience-v27 .hj-v27-rail-foot a,
.hj-experience-v27 .hj-sidebar-nav a {
  width:44px !important;
  min-height:42px !important;
  margin:0 auto !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:0 !important;
  border:0 !important;
  border-radius:14px !important;
  background:transparent !important;
  color:#616762 !important;
  text-decoration:none !important;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.hj-experience-v27 .hj-v27-rail-button { margin:8px auto 18px !important; }
.hj-experience-v27 .hj-sidebar-nav { flex:1 !important; width:100% !important; min-height:0 !important; padding:0 !important; display:flex !important; flex-direction:column !important; gap:4px !important; overflow-y:auto !important; scrollbar-width:none; }
.hj-experience-v27 .hj-sidebar-nav::-webkit-scrollbar { display:none; }
.hj-experience-v27 .hj-sidebar-nav a::before,
.hj-experience-v27 .hj-sidebar-nav a::after { display:none !important; }
.hj-experience-v27 .hj-sidebar-nav a:hover,
.hj-experience-v27 .hj-v27-rail-button:hover,
.hj-experience-v27 .hj-v27-rail-foot a:hover { color:#111410 !important; background:#f0f2ef !important; transform:translateY(-1px); }
.hj-experience-v27 .hj-sidebar-nav a.is-active { color:#fff !important; background:var(--hj27-black) !important; box-shadow:0 8px 18px rgba(17,20,16,.18); }
.hj-experience-v27 .hj-sidebar-nav .hj-nav-icon,
.hj-experience-v27 .hj-v27-rail-foot .hj-nav-icon { width:20px !important; height:20px !important; display:grid !important; place-items:center !important; background:transparent !important; color:inherit !important; }
.hj-experience-v27 .hj-sidebar-nav svg,
.hj-experience-v27 .hj-v27-rail-foot svg,
.hj-experience-v27 .hj-v27-rail-button svg { width:18px !important; height:18px !important; }
.hj-experience-v27 .hj-sidebar-nav .hj-nav-label,
.hj-experience-v27 .hj-v27-rail-button .hj-nav-label,
.hj-experience-v27 .hj-v27-rail-foot .hj-nav-label { display:none; }
.hj-experience-v27 .hj-v27-rail-foot { display:grid; gap:4px; margin-top:12px; }
.hj-experience-v27 .hj-main {
  min-width:0 !important;
  flex:1 !important;
  min-height:calc(100vh - 44px) !important;
  margin:0 !important;
  padding:18px 20px 22px !important;
  border:1px solid rgba(255,255,255,.86);
  border-left:0;
  border-radius:0 22px 22px 0;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 22px 70px rgba(30,34,30,.05);
  overflow:hidden !important;
}
.hj-experience-v27 .hj-topbar {
  position:relative !important;
  top:auto !important;
  z-index:40 !important;
  width:100% !important;
  max-width:none !important;
  min-height:54px !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
.hj-experience-v27 .hj-topbar-left { flex:1; min-width:0; }
.hj-experience-v27 .hj-v27-topnav { min-width:0; width:fit-content; max-width:100%; padding:4px; display:flex; align-items:center; gap:3px; border-radius:16px; background:#f6f7f6; overflow-x:auto; scrollbar-width:none; }
.hj-experience-v27 .hj-v27-topnav::-webkit-scrollbar { display:none; }
.hj-experience-v27 .hj-v27-topnav a { min-height:40px; padding:0 16px; display:inline-flex; align-items:center; gap:7px; border-radius:12px; color:#505650; font-size:12px; font-weight:650; text-decoration:none; white-space:nowrap; transition:.16s ease; }
.hj-experience-v27 .hj-v27-topnav a span { display:none; }
.hj-experience-v27 .hj-v27-topnav a:hover { color:#111410; background:#fff; }
.hj-experience-v27 .hj-v27-topnav a.is-active { color:#fff; background:var(--hj27-black); box-shadow:0 7px 16px rgba(17,20,16,.15); }
.hj-experience-v27 .hj-topbar-right { display:flex !important; align-items:center !important; gap:8px !important; }
.hj-experience-v27 .hj-icon-button { width:40px !important; height:40px !important; padding:0 !important; display:grid !important; place-items:center !important; border:0 !important; border-radius:13px !important; background:#f7f8f7 !important; color:#171a17 !important; box-shadow:none !important; }
.hj-experience-v27 .hj-icon-button:hover { background:#eef0ee !important; transform:translateY(-1px); }
.hj-experience-v27 .hj-icon-button svg { width:18px !important; height:18px !important; }
.hj-experience-v27 .hj-notification-count { right:-3px; top:-4px; background:#ff5b42; border-color:#fff; }
.hj-experience-v27 .hj-topbar-profile { min-width:178px !important; height:46px !important; padding:4px 9px 4px 5px !important; display:flex !important; align-items:center !important; gap:9px !important; border:0 !important; border-radius:15px !important; background:#f7f8f7 !important; box-shadow:none !important; text-decoration:none !important; }
.hj-experience-v27 .hj-topbar-profile .hj-user-avatar { width:36px !important; height:36px !important; flex:0 0 36px !important; border-radius:11px !important; background:linear-gradient(145deg,#f2d9bd,#c99468) !important; color:#3d2b21 !important; font-size:12px; }
.hj-experience-v27 .hj-topbar-profile > span:nth-child(2) { min-width:0; flex:1; display:grid; gap:2px; }
.hj-experience-v27 .hj-topbar-profile strong { max-width:125px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.hj-experience-v27 .hj-topbar-profile small { max-width:125px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#818681; font-size:8.5px; }
.hj-experience-v27 .hj-profile-caret { color:#777c77; font-size:14px; }
.hj-experience-v27 .hj-mobile-nav-toggle { display:none; }
.hj-experience-v27 .hj-page-context { width:min(1540px,100%) !important; min-height:0; margin:0 auto !important; padding:0 !important; }
.hj-experience-v27 .hj-page-context:empty { display:none; }
.hj-experience-v27 .hj-breadcrumbs,
.hj-experience-v27 .hj-page-title-row,
.hj-experience-v27 .hj-service-workspace-bar,
.hj-experience-v27 .hj-page-grid,
.hj-experience-v27 .hj-service-studio { width:min(1540px,100%) !important; max-width:none !important; }

/* Dashboard */
.hj-experience-v27 .hj27-greeting-card {
  position:relative;
  isolation:isolate;
  width:min(1540px,100%);
  min-height:316px;
  margin:18px auto 22px;
  padding:34px 88px 28px 34px;
  display:flex;
  align-items:stretch;
  overflow:hidden;
  border:1px solid rgba(205,255,226,.18);
  border-radius:22px;
  background-color:#04120d;
  background-image:url("img/hj27-greeting-card-bg.webp");
  background-repeat:no-repeat;
  background-position:center 53%;
  background-size:cover;
  color:#fff;
  box-shadow:0 18px 52px rgba(3,26,18,.16),inset 0 1px 0 rgba(255,255,255,.08);
}
.hj-experience-v27 .hj27-greeting-card::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(90deg,rgba(0,7,5,.97) 0%,rgba(0,9,6,.91) 32%,rgba(1,18,12,.73) 49%,rgba(3,38,26,.25) 72%,rgba(3,31,22,.18) 100%),
    linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.28));
}
.hj-experience-v27 .hj27-greeting-card::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:4;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
  pointer-events:none;
}
.hj-experience-v27 .hj27-greeting-card-copy {
  position:relative;
  z-index:2;
  width:min(760px,62%);
  min-width:0;
  display:flex;
  flex-direction:column;
}
.hj-experience-v27 .hj27-greeting-eyebrow {
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:rgba(227,244,235,.72);
  font-size:9.5px;
  font-weight:720;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.hj-experience-v27 .hj27-greeting-eyebrow i {
  width:6px;
  height:6px;
  border-radius:50%;
  background:#89e5ae;
  box-shadow:0 0 0 5px rgba(137,229,174,.09),0 0 18px rgba(137,229,174,.45);
}
.hj-experience-v27 .hj27-greeting-card h1 {
  margin:16px 0 0 !important;
  color:#fff;
  font-size:clamp(35px,3.35vw,54px);
  font-weight:430;
  line-height:1.01;
  letter-spacing:-.055em;
  text-wrap:balance;
}
.hj-experience-v27 .hj27-greeting-card h1 span { color:rgba(255,255,255,.82); }
.hj-experience-v27 .hj27-greeting-card-copy > p {
  max-width:610px;
  margin:14px 0 0 !important;
  color:rgba(231,242,235,.68);
  font-size:12.5px;
  line-height:1.65;
}
.hj-experience-v27 .hj27-greeting-metrics {
  margin-top:24px;
  display:flex;
  align-items:center;
  gap:0;
  flex-wrap:wrap;
}
.hj-experience-v27 .hj27-greeting-metrics > span {
  min-width:132px;
  padding:0 22px;
  display:grid;
  gap:3px;
  border-left:1px solid rgba(226,246,235,.15);
}
.hj-experience-v27 .hj27-greeting-metrics > span:first-child { padding-left:0; border-left:0; }
.hj-experience-v27 .hj27-greeting-metrics strong {
  color:#a3efbf;
  font-size:18px;
  font-weight:620;
  line-height:1;
  letter-spacing:-.035em;
}
.hj-experience-v27 .hj27-greeting-metrics small {
  color:rgba(228,241,233,.58);
  font-size:8.5px;
  font-weight:600;
  letter-spacing:.015em;
}
.hj-experience-v27 .hj27-greeting-card-footer {
  margin-top:auto;
  padding-top:28px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
}
.hj-experience-v27 .hj27-greeting-shortcuts { min-width:0; }
.hj-experience-v27 .hj27-greeting-shortcuts > small {
  display:block;
  margin-bottom:9px;
  color:rgba(228,241,233,.52);
  font-size:8px;
  font-weight:650;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.hj-experience-v27 .hj27-greeting-shortcuts > div { display:flex; align-items:center; gap:7px; }
.hj-experience-v27 .hj27-greeting-shortcuts a:not(.hj27-greeting-see-all) {
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:1px solid rgba(217,244,229,.16);
  border-radius:50%;
  background:rgba(255,255,255,.075);
  color:rgba(240,250,244,.86);
  text-decoration:none;
  backdrop-filter:blur(10px);
  transition:transform .16s ease,background .16s ease,border-color .16s ease;
}
.hj-experience-v27 .hj27-greeting-shortcuts a:not(.hj27-greeting-see-all):hover {
  transform:translateY(-2px);
  border-color:rgba(169,239,193,.4);
  background:rgba(153,235,182,.14);
}
.hj-experience-v27 .hj27-greeting-shortcuts svg { width:14px; height:14px; }
.hj-experience-v27 .hj27-greeting-see-all {
  margin-left:4px;
  color:#a6eabe;
  font-size:9px;
  font-weight:680;
  text-decoration:none;
  border-bottom:1px solid rgba(166,234,190,.38);
}
.hj-experience-v27 .hj27-greeting-cta { display:flex; align-items:center; gap:7px; }
.hj-experience-v27 .hj27-greeting-cta a,
.hj-experience-v27 .hj27-greeting-cta button {
  min-height:38px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid rgba(225,246,234,.17) !important;
  border-radius:11px !important;
  background:rgba(255,255,255,.075) !important;
  color:rgba(248,253,250,.91) !important;
  font-size:9px;
  font-weight:680;
  text-decoration:none;
  box-shadow:none !important;
  backdrop-filter:blur(12px);
  transition:background .16s ease,border-color .16s ease,transform .16s ease;
}
.hj-experience-v27 .hj27-greeting-cta a {
  border-color:#a7efbd !important;
  background:#a7efbd !important;
  color:#092516 !important;
}
.hj-experience-v27 .hj27-greeting-cta a:hover,
.hj-experience-v27 .hj27-greeting-cta button:hover { transform:translateY(-1px); }
.hj-experience-v27 .hj27-greeting-cta button:hover { background:rgba(255,255,255,.13) !important; }
.hj-experience-v27 .hj27-greeting-cta svg { width:14px; height:14px; }
.hj-experience-v27 .hj27-greeting-rail {
  position:absolute;
  z-index:3;
  top:50%;
  right:18px;
  width:50px;
  padding-left:14px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:9px;
  border-left:1px solid rgba(224,244,232,.15);
  transform:translateY(-50%);
}
.hj-experience-v27 .hj27-greeting-rail a {
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:1px solid transparent;
  border-radius:11px;
  color:rgba(236,248,240,.75);
  text-decoration:none;
  transition:background .16s ease,color .16s ease,border-color .16s ease;
}
.hj-experience-v27 .hj27-greeting-rail a:hover {
  border-color:rgba(216,244,228,.15);
  background:rgba(255,255,255,.08);
  color:#fff;
}
.hj-experience-v27 .hj27-greeting-rail svg { width:17px; height:17px; }
.hj-experience-v27 .hj27-dashboard-grid { width:min(1540px,100%); margin:0 auto; display:grid; grid-template-columns:minmax(300px,.98fr) minmax(420px,1.05fr) minmax(320px,.95fr); grid-template-rows:auto auto; gap:16px; align-items:start; }
.hj-experience-v27 .hj27-dashboard-left { grid-row:1 / span 2; display:grid; gap:16px; }
.hj-experience-v27 .hj27-card,
.hj-experience-v27 .hj27-kpi { border:1px solid var(--hj27-line); border-radius:17px; background:#fff; box-shadow:0 2px 8px rgba(25,31,26,.025); }
.hj-experience-v27 .hj27-card { padding:15px; }
.hj-experience-v27 .hj27-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.hj-experience-v27 .hj27-card-head > div { min-width:0; }
.hj-experience-v27 .hj27-card-head span,
.hj-experience-v27 .hj27-card-head strong { display:block; color:#151815; font-size:12px; font-weight:680; }
.hj-experience-v27 .hj27-card-head small { display:block; margin-top:3px; color:#828782; font-size:9.5px; }
.hj-experience-v27 .hj27-card-head > a { color:#59615a; font-size:9.5px; font-weight:700; text-decoration:none; }
.hj-experience-v27 .hj27-status-chip { min-height:24px; padding:0 8px; display:inline-flex !important; align-items:center; gap:5px; border-radius:999px; background:#eff9f1; color:#27724f !important; font-size:8.5px !important; white-space:nowrap; }
.hj-experience-v27 .hj27-status-chip i { width:6px; height:6px; border-radius:50%; background:#2bb66d; }
.hj-experience-v27 .hj27-portfolio-total { margin:16px 0 6px; display:flex; align-items:flex-end; gap:11px; }
.hj-experience-v27 .hj27-portfolio-total strong { color:#10130f; font-size:38px; font-weight:540; line-height:.95; letter-spacing:-.055em; }
.hj-experience-v27 .hj27-portfolio-total span { padding-bottom:2px; color:#7a807a; font-size:9.5px; line-height:1.25; }
.hj-experience-v27 .hj27-trend { display:flex; align-items:center; gap:7px; }
.hj-experience-v27 .hj27-trend span { padding:4px 7px; border-radius:999px; background:#efffea; color:#39a938; font-size:8.5px; font-weight:800; }
.hj-experience-v27 .hj27-trend small { color:#868b86; font-size:8.5px; }
.hj-experience-v27 .hj27-portfolio-actions { margin:15px 0 14px; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.hj-experience-v27 .hj27-portfolio-actions a { min-height:40px; display:flex; align-items:center; justify-content:center; gap:7px; border:1px solid #eceeec; border-radius:12px; background:#f7f8f7; color:#20241f; font-size:10px; font-weight:720; text-decoration:none; }
.hj-experience-v27 .hj27-portfolio-actions a.is-primary { border-color:var(--hj27-lime); background:var(--hj27-lime); color:#16200c; }
.hj-experience-v27 .hj27-portfolio-actions svg { width:15px; height:15px; }
.hj-experience-v27 .hj27-mini-services { padding:10px; border-radius:14px; background:#f7f8f7; }
.hj-experience-v27 .hj27-mini-services-title { display:flex; justify-content:space-between; align-items:center; margin-bottom:7px; }
.hj-experience-v27 .hj27-mini-services-title strong { font-size:9.5px; }
.hj-experience-v27 .hj27-mini-services-title span { color:#808680; font-size:8.5px; }
.hj-experience-v27 .hj27-mini-service { min-height:54px; padding:6px; display:grid; grid-template-columns:32px minmax(0,1fr) auto; align-items:center; gap:8px; border-radius:10px; text-decoration:none; }
.hj-experience-v27 .hj27-mini-service:hover { background:#fff; }
.hj-experience-v27 .hj27-service-flag { width:31px; height:31px; display:grid; place-items:center; border-radius:9px; background:#fff; color:#0a7555; }
.hj-experience-v27 .hj27-service-flag-2 { color:#c75c38; }
.hj-experience-v27 .hj27-service-flag-3 { color:#6751b4; }
.hj-experience-v27 .hj27-service-flag svg { width:15px; height:15px; }
.hj-experience-v27 .hj27-mini-service > span:nth-child(2) { min-width:0; }
.hj-experience-v27 .hj27-mini-service strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:9.5px; }
.hj-experience-v27 .hj27-mini-service small { display:block; margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#858b85; font-size:8px; }
.hj-experience-v27 .hj27-mini-service em { font-size:7.5px; font-style:normal; }
.hj-experience-v27 .hj27-mini-service em.is-active { color:#1ca85c; }
.hj-experience-v27 .hj27-mini-service em.is-attention { color:#df6a57; }
.hj-experience-v27 .hj27-empty-mini { padding:13px 8px; display:grid; gap:3px; text-align:center; }
.hj-experience-v27 .hj27-empty-mini strong { font-size:9.5px; }
.hj-experience-v27 .hj27-empty-mini span { color:#858b85; font-size:8.5px; }
.hj-experience-v27 .hj27-progress-card { padding:14px 15px; }
.hj-experience-v27 .hj27-progress-card .hj27-card-head b { color:#3f4640; font-size:11px; }
.hj-experience-v27 .hj27-progress { height:10px; margin-top:16px; overflow:hidden; border-radius:999px; background:repeating-linear-gradient(125deg,#f0f1f0 0,#f0f1f0 4px,#e5e7e5 4px,#e5e7e5 7px); }
.hj-experience-v27 .hj27-progress span { display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,#08724f,#0d6d4f); }
.hj-experience-v27 .hj27-progress-meta { margin-top:7px; display:flex; justify-content:space-between; color:#777d77; font-size:8px; }
.hj-experience-v27 .hj27-product-strip { margin-top:12px; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.hj-experience-v27 .hj27-product-tile { min-height:108px; padding:13px; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; position:relative; border-radius:13px; background:linear-gradient(145deg,#26271f,#11130f); color:#fff !important; text-decoration:none; }
.hj-experience-v27 .hj27-product-tile-2 { background:radial-gradient(circle at 75% 25%,rgba(170,255,36,.45),transparent 40%),linear-gradient(145deg,#124f3d,#072e24); }
.hj-experience-v27 .hj27-product-tile > span { position:absolute; top:12px; left:12px; width:28px; height:28px; display:grid; place-items:center; border-radius:9px; background:rgba(255,255,255,.1); }
.hj-experience-v27 .hj27-product-tile svg { width:14px; height:14px; }
.hj-experience-v27 .hj27-product-tile strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:9.5px; }
.hj-experience-v27 .hj27-product-tile small { margin-top:4px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:rgba(255,255,255,.65); font-size:7.8px; }
.hj-experience-v27 .hj27-product-tile.is-empty { grid-column:1 / -1; align-items:flex-start; background:#f6f7f6; color:#151815 !important; }
.hj-experience-v27 .hj27-product-tile.is-empty small { color:#818681; }
.hj-experience-v27 .hj27-kpi-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.hj-experience-v27 .hj27-kpi { min-height:145px; padding:15px; display:grid; grid-template-columns:minmax(0,1fr) 32px; grid-template-rows:auto 1fr auto; position:relative; overflow:hidden; color:#151815; text-decoration:none; transition:transform .16s ease,box-shadow .16s ease; }
.hj-experience-v27 .hj27-kpi:hover { transform:translateY(-2px); box-shadow:0 12px 25px rgba(24,30,25,.06); }
.hj-experience-v27 .hj27-kpi > span { align-self:start; font-size:10.5px; font-weight:650; }
.hj-experience-v27 .hj27-kpi > i { width:30px; height:30px; display:grid; place-items:center; border-radius:10px; background:#f0f2ef; color:#383d38; font-style:normal; }
.hj-experience-v27 .hj27-kpi > i svg { width:15px; height:15px; }
.hj-experience-v27 .hj27-kpi > strong { grid-column:1 / -1; align-self:end; margin:8px 0; font-size:31px; font-weight:520; line-height:1; letter-spacing:-.045em; }
.hj-experience-v27 .hj27-kpi > small { grid-column:1 / -1; color:#7d837d; font-size:8.5px; }
.hj-experience-v27 .hj27-kpi > small b { margin-right:4px; color:#30a96a; }
.hj-experience-v27 .hj27-kpi.is-featured { border-color:#62bf25; background:linear-gradient(160deg,#70d11c 0%,#096d4d 54%,#074c3d 100%); color:#fff; box-shadow:0 14px 26px rgba(7,92,69,.16); }
.hj-experience-v27 .hj27-kpi.is-featured > i { background:rgba(255,255,255,.12); color:#fff; }
.hj-experience-v27 .hj27-kpi.is-featured > small { color:rgba(255,255,255,.72); }
.hj-experience-v27 .hj27-kpi.is-featured > small b { color:#dfff9e; }
.hj-experience-v27 .hj27-chart-card { min-height:302px; }
.hj-experience-v27 .hj27-chart-legend { margin-top:14px; display:flex; justify-content:flex-end; gap:12px; color:#535953; font-size:8px; }
.hj-experience-v27 .hj27-chart-legend span { display:flex; align-items:center; gap:4px; }
.hj-experience-v27 .hj27-chart-legend i { width:7px; height:7px; border-radius:2px; }
.hj-experience-v27 .hj27-chart-legend i.is-active { background:var(--hj27-lime); }
.hj-experience-v27 .hj27-chart-legend i.is-attention { background:var(--hj27-black); }
.hj-experience-v27 .hj27-chart { height:190px; margin-top:10px; padding:10px 2px 0; display:grid; grid-template-columns:repeat(4,1fr); align-items:end; gap:12px; position:relative; }
.hj-experience-v27 .hj27-chart-grid { position:absolute; inset:9px 0 24px; display:flex; flex-direction:column; justify-content:space-between; pointer-events:none; }
.hj-experience-v27 .hj27-chart-grid i { width:100%; border-top:1px dashed #e8eae8; }
.hj-experience-v27 .hj27-chart-column { height:100%; display:grid; grid-template-rows:minmax(0,1fr) auto auto; justify-items:center; gap:3px; position:relative; z-index:1; }
.hj-experience-v27 .hj27-chart-stack { width:28px; height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-self:end; }
.hj-experience-v27 .hj27-chart-stack span { display:block; min-height:0; }
.hj-experience-v27 .hj27-chart-stack span.is-active { border-radius:6px 6px 3px 3px; background:linear-gradient(135deg,#b8ff46,#92e826); }
.hj-experience-v27 .hj27-chart-stack span.is-attention { margin-top:3px; border-radius:3px 3px 6px 6px; background:var(--hj27-black); }
.hj-experience-v27 .hj27-chart-column strong { font-size:8px; font-weight:700; }
.hj-experience-v27 .hj27-chart-column small { color:#747a74; font-size:7.5px; }
.hj-experience-v27 .hj27-chart-summary { margin-top:8px; padding-top:11px; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; border-top:1px solid #eff0ef; }
.hj-experience-v27 .hj27-chart-summary span { display:block; color:#7f857f; font-size:8px; }
.hj-experience-v27 .hj27-chart-summary strong { display:block; margin-top:2px; font-size:15px; font-weight:600; }
.hj-experience-v27 .hj27-chart-summary a { color:#2b332d; font-size:8.5px; font-weight:700; text-decoration:none; }
.hj-experience-v27 .hj27-activity-card { grid-column:2 / 4; min-width:0; padding:0; overflow:hidden; }
.hj-experience-v27 .hj27-activity-head { min-height:70px; padding:14px 15px; display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid #eceeec; }
.hj-experience-v27 .hj27-activity-head > div:first-child strong { display:block; font-size:14px; font-weight:650; }
.hj-experience-v27 .hj27-activity-head > div:first-child small { display:block; margin-top:4px; color:#808680; font-size:8.5px; }
.hj-experience-v27 .hj27-activity-head > div:last-child { display:flex; align-items:center; gap:7px; }
.hj-experience-v27 .hj27-activity-head button,
.hj-experience-v27 .hj27-activity-head a { min-height:34px; padding:0 11px; display:inline-flex; align-items:center; gap:6px; border:1px solid #e4e7e4 !important; border-radius:10px !important; background:#fff !important; color:#343934 !important; font-size:8.5px; font-weight:700; text-decoration:none; box-shadow:none !important; }
.hj-experience-v27 .hj27-activity-head svg { width:13px; height:13px; }
.hj-experience-v27 .hj27-table-wrap { width:100%; overflow:auto; }
.hj-experience-v27 .hj27-activity-table { width:100%; min-width:760px; border-collapse:collapse; }
.hj-experience-v27 .hj27-activity-table th { height:38px; padding:0 13px; border-bottom:1px solid #eceeec; background:#f7f8f7; color:#777d77; font-size:8px; font-weight:600; text-align:left; }
.hj-experience-v27 .hj27-activity-table td { height:52px; padding:0 13px; border-bottom:1px solid #f0f1f0; color:#2d322d; font-size:8.5px; white-space:nowrap; }
.hj-experience-v27 .hj27-activity-table tr:last-child td { border-bottom:0; }
.hj-experience-v27 .hj27-activity-table td:first-child strong { font-size:8.5px; font-weight:650; }
.hj-experience-v27 .hj27-activity-type { display:flex; align-items:center; gap:8px; }
.hj-experience-v27 .hj27-activity-type i { width:25px; height:25px; display:grid; place-items:center; border-radius:8px; background:#f3f5f3; color:#197456; }
.hj-experience-v27 .hj27-activity-type svg { width:13px; height:13px; }
.hj-experience-v27 .hj27-table-status { display:inline-flex; align-items:center; gap:5px; }
.hj-experience-v27 .hj27-table-status i { width:5px; height:5px; border-radius:50%; background:#29a46b; }
.hj-experience-v27 .hj27-table-status.is-pending i,
.hj-experience-v27 .hj27-table-status.is-open i,
.hj-experience-v27 .hj27-table-status.is-in-progress i { background:#e0b322; }
.hj-experience-v27 .hj27-table-status.is-overdue i,
.hj-experience-v27 .hj27-table-status.is-failed i,
.hj-experience-v27 .hj27-table-status.is-cancelled i { background:#e44b4b; }
.hj-experience-v27 .hj27-activity-table td:last-child a { color:#656b65; text-decoration:none; letter-spacing:1px; }
.hj-experience-v27 .hj27-activity-empty { min-height:210px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; color:#7b817b; text-align:center; }
.hj-experience-v27 .hj27-activity-empty > span { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:#f4f6f4; }
.hj-experience-v27 .hj27-activity-empty svg { width:17px; height:17px; }
.hj-experience-v27 .hj27-activity-empty strong { color:#303530; font-size:10.5px; }
.hj-experience-v27 .hj27-activity-empty small { font-size:8.5px; }

@media (max-width:1280px) {
  .hj-experience-v27 { padding:14px; }
  .hj-experience-v27 .hj-sidebar { top:14px !important; height:calc(100vh - 28px) !important; }
  .hj-experience-v27 .hj-main { min-height:calc(100vh - 28px) !important; }
  .hj-experience-v27 .hj27-dashboard-grid { grid-template-columns:minmax(280px,.9fr) minmax(360px,1.1fr); }
  .hj-experience-v27 .hj27-chart-card { grid-column:2; }
  .hj-experience-v27 .hj27-activity-card { grid-column:2; }
}
@media (max-width:980px) {
  .hj-experience-v27 { padding:0; background:#fff !important; }
  .hj-experience-v27 .hj-sidebar {
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    width:min(286px,88vw) !important;
    height:100dvh !important;
    padding:18px 14px !important;
    border-radius:0 20px 20px 0 !important;
    border:0 !important;
    transform:translateX(-105%);
    box-shadow:25px 0 70px rgba(15,20,16,.18) !important;
  }
  .hj-experience-v27.hj-sidebar-open .hj-sidebar { transform:translateX(0); }
  .hj-experience-v27 .hj-v27-rail-head { display:flex; justify-content:space-between; }
  .hj-experience-v27 .hj-sidebar-brand { width:auto !important; padding-right:10px !important; display:flex !important; gap:10px; }
  .hj-experience-v27 .hj-sidebar-brand > .hj-nav-label { display:block; font-weight:700; }
  .hj-experience-v27 .hj-sidebar-close { width:38px !important; height:38px !important; display:grid !important; place-items:center; border:0 !important; border-radius:11px !important; background:#f2f4f2 !important; color:#252a25 !important; font-size:22px; }
  .hj-experience-v27 .hj-v27-rail-button,
  .hj-experience-v27 .hj-v27-rail-foot a,
  .hj-experience-v27 .hj-sidebar-nav a { width:100% !important; justify-content:flex-start !important; padding:0 12px !important; gap:11px !important; }
  .hj-experience-v27 .hj-sidebar-nav .hj-nav-label,
  .hj-experience-v27 .hj-v27-rail-button .hj-nav-label,
  .hj-experience-v27 .hj-v27-rail-foot .hj-nav-label { display:block; font-size:11px; font-weight:650; }
  .hj-experience-v27 .hj-v27-rail-button { margin:14px 0 !important; }
  .hj-experience-v27 .hj-main { width:100% !important; min-height:100vh !important; padding:12px 14px 24px !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; }
  .hj-experience-v27 .hj-sidebar-scrim { display:block; }
  .hj-experience-v27 .hj-mobile-nav-toggle { width:40px; height:40px; display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:4px; border:0; border-radius:12px; background:#f5f6f5; }
  .hj-experience-v27 .hj-mobile-nav-toggle span { width:16px; height:1.5px; background:#161916; }
  .hj-experience-v27 .hj-v27-topnav { display:none; }
  .hj-experience-v27 .hj-topbar-profile { min-width:44px !important; width:44px !important; padding:4px !important; }
  .hj-experience-v27 .hj-topbar-profile > span:nth-child(2),
  .hj-experience-v27 .hj-profile-caret { display:none !important; }
  .hj-experience-v27 .hj27-greeting-card { margin-top:18px; }
  .hj-experience-v27 .hj27-dashboard-grid { grid-template-columns:1fr 1fr; }
  .hj-experience-v27 .hj27-dashboard-left { grid-column:1 / -1; grid-row:auto; grid-template-columns:1.2fr .8fr; align-items:start; }
  .hj-experience-v27 .hj27-portfolio-card { grid-row:1 / span 2; }
  .hj-experience-v27 .hj27-kpi-grid { grid-column:1; }
  .hj-experience-v27 .hj27-chart-card { grid-column:2; }
  .hj-experience-v27 .hj27-activity-card { grid-column:1 / -1; }
}
@media (max-width:680px) {
  .hj-experience-v27 .hj-topbar-right > .hj-icon-button:nth-of-type(3) { display:none !important; }
  .hj-experience-v27 .hj27-greeting-card { min-height:370px; margin:16px auto 18px; padding:25px 20px 20px; background-position:67% 53%; }
  .hj-experience-v27 .hj27-greeting-card::before { background:linear-gradient(90deg,rgba(0,7,5,.98) 0%,rgba(0,9,6,.92) 62%,rgba(1,22,14,.58) 100%),linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.34)); }
  .hj-experience-v27 .hj27-greeting-card-copy { width:100%; }
  .hj-experience-v27 .hj27-greeting-card h1 { max-width:88%; font-size:34px; }
  .hj-experience-v27 .hj27-greeting-card-copy > p { max-width:88%; font-size:11.5px; }
  .hj-experience-v27 .hj27-greeting-metrics { margin-top:20px; }
  .hj-experience-v27 .hj27-greeting-metrics > span { min-width:112px; padding:0 14px; }
  .hj-experience-v27 .hj27-greeting-card-footer { padding-top:22px; align-items:flex-start; flex-direction:column; gap:16px; }
  .hj-experience-v27 .hj27-greeting-cta { width:100%; }
  .hj-experience-v27 .hj27-greeting-cta a,
  .hj-experience-v27 .hj27-greeting-cta button { flex:1; }
  .hj-experience-v27 .hj27-greeting-rail { top:18px; right:15px; width:auto; padding:0; flex-direction:row; gap:3px; border:0; transform:none; }
  .hj-experience-v27 .hj27-greeting-rail a { width:32px; height:32px; }
  .hj-experience-v27 .hj27-dashboard-grid { display:flex; flex-direction:column; }
  .hj-experience-v27 .hj27-dashboard-left { width:100%; display:flex; flex-direction:column; }
  .hj-experience-v27 .hj27-kpi-grid { width:100%; }
  .hj-experience-v27 .hj27-kpi { min-height:132px; }
  .hj-experience-v27 .hj27-chart-card,
  .hj-experience-v27 .hj27-activity-card { width:100%; }
  .hj-experience-v27 .hj27-activity-head { align-items:flex-start; flex-direction:column; }
  .hj-experience-v27 .hj27-activity-head > div:last-child { width:100%; }
  .hj-experience-v27 .hj27-activity-head button,
  .hj-experience-v27 .hj27-activity-head a { flex:1; justify-content:center; }
}
@media (max-width:430px) {
  .hj-experience-v27 .hj-topbar-right { gap:5px !important; }
  .hj-experience-v27 .hj-icon-button { width:38px !important; height:38px !important; }
  .hj-experience-v27 .hj27-greeting-card { min-height:390px; border-radius:18px; }
  .hj-experience-v27 .hj27-greeting-card h1 { max-width:90%; font-size:31px; }
  .hj-experience-v27 .hj27-greeting-card-copy > p { max-width:92%; }
  .hj-experience-v27 .hj27-greeting-metrics { row-gap:14px; }
  .hj-experience-v27 .hj27-greeting-metrics > span { min-width:50%; padding:0 10px; }
  .hj-experience-v27 .hj27-greeting-metrics > span:nth-child(3) { padding-left:0; border-left:0; }
  .hj-experience-v27 .hj27-greeting-shortcuts a:not(.hj27-greeting-see-all) { width:32px; height:32px; }
  .hj-experience-v27 .hj27-greeting-cta { flex-direction:column; }
  .hj-experience-v27 .hj27-greeting-cta a,
  .hj-experience-v27 .hj27-greeting-cta button { width:100%; }
  .hj-experience-v27 .hj27-kpi-grid { grid-template-columns:1fr; }
  .hj-experience-v27 .hj27-product-strip { grid-template-columns:1fr; }
}

.hj-experience-v27 .hj-v27-hidden-collapse{display:none!important;}

/* ========================================================================== */
/* HostingJet 0.27.3 — hPanel-inspired customer home                         */
/* Dashboard content only. Global HALO sidebar and header remain untouched.   */
/* ========================================================================== */
.hj-experience-v27 .hj28-dashboard {
  --hj28-ink:#191c19;
  --hj28-muted:#6d746f;
  --hj28-soft:#f6f7f6;
  --hj28-lilac:#f5f3fb;
  --hj28-line:#e7e9e7;
  --hj28-line-strong:#dcdedc;
  --hj28-green:#087653;
  --hj28-green-dark:#05563e;
  --hj28-green-soft:#eaf7f1;
  --hj28-amber:#a46809;
  --hj28-amber-soft:#fff6e7;
  width:100%;
  max-width:1320px;
  margin:0 auto;
  padding:22px 0 42px;
  color:var(--hj28-ink);
}
.hj-experience-v27 .hj28-dashboard *,
.hj-experience-v27 .hj28-dashboard *::before,
.hj-experience-v27 .hj28-dashboard *::after { box-sizing:border-box; }

.hj-experience-v27 .hj28-welcome {
  position:relative;
  min-height:190px;
  padding:27px 30px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:1fr auto;
  gap:18px 28px;
  overflow:hidden;
  border:1px solid rgba(139,183,163,.28);
  border-radius:20px;
  background-image:
    linear-gradient(90deg,rgba(1,10,7,.97) 0%,rgba(2,20,14,.91) 48%,rgba(4,54,37,.58) 100%),
    linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.28)),
    url("img/hj27-greeting-card-bg.webp");
  background-size:cover;
  background-position:center 54%;
  box-shadow:0 14px 40px rgba(12,42,31,.10);
  isolation:isolate;
}
.hj-experience-v27 .hj28-welcome::after {
  content:"";
  position:absolute;
  inset:auto -4% -65% 42%;
  height:220px;
  border-radius:50%;
  background:rgba(71,200,143,.17);
  filter:blur(58px);
  pointer-events:none;
  z-index:-1;
}
.hj-experience-v27 .hj28-welcome-copy { min-width:0; align-self:center; }
.hj-experience-v27 .hj28-eyebrow {
  display:block;
  margin-bottom:8px;
  color:#98d6b9;
  font-size:10px;
  font-weight:750;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.hj-experience-v27 .hj28-welcome h1 {
  margin:0;
  color:#fff;
  font-size:clamp(29px,2.65vw,43px);
  font-weight:560;
  line-height:1.08;
  letter-spacing:-.048em;
}
.hj-experience-v27 .hj28-welcome-copy p {
  max-width:650px;
  margin:10px 0 0;
  color:rgba(255,255,255,.70);
  font-size:12.5px;
  line-height:1.55;
}
.hj-experience-v27 .hj28-welcome-summary {
  align-self:center;
  display:grid;
  grid-template-columns:repeat(3,minmax(92px,1fr));
  overflow:hidden;
  border:1px solid rgba(255,255,255,.13);
  border-radius:14px;
  background:rgba(8,35,25,.46);
  backdrop-filter:blur(12px);
}
.hj-experience-v27 .hj28-welcome-summary span {
  min-height:70px;
  padding:13px 16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-left:1px solid rgba(255,255,255,.10);
}
.hj-experience-v27 .hj28-welcome-summary span:first-child { border-left:0; }
.hj-experience-v27 .hj28-welcome-summary strong { color:#fff; font-size:21px; font-weight:650; line-height:1; letter-spacing:-.04em; }
.hj-experience-v27 .hj28-welcome-summary small { margin-top:7px; color:rgba(255,255,255,.57); font-size:9.5px; white-space:nowrap; }
.hj-experience-v27 .hj28-welcome-actions { grid-column:1 / -1; display:flex; gap:8px; align-items:center; }

.hj-experience-v27 .hj28-button,
.hj-experience-v27 .hj28-text-button {
  min-height:38px;
  padding:0 13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid transparent;
  border-radius:9px;
  font-size:10.5px;
  font-weight:700;
  line-height:1;
  text-decoration:none;
  white-space:nowrap;
  cursor:pointer;
  transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease;
}
.hj-experience-v27 .hj28-button svg,
.hj-experience-v27 .hj28-text-button svg { width:14px; height:14px; }
.hj-experience-v27 .hj28-button:hover,
.hj-experience-v27 .hj28-text-button:hover { transform:translateY(-1px); }
.hj-experience-v27 .hj28-button.is-primary { border-color:#fff; background:#fff; color:#14251e; box-shadow:0 5px 16px rgba(0,0,0,.13); }
.hj-experience-v27 .hj28-button.is-glass { border-color:rgba(255,255,255,.18); background:rgba(255,255,255,.08); color:#fff; backdrop-filter:blur(10px); }
.hj-experience-v27 .hj28-button.is-secondary { border-color:var(--hj28-line); background:#fff; color:var(--hj28-ink); box-shadow:0 1px 2px rgba(20,26,22,.025); }
.hj-experience-v27 .hj28-button.is-secondary:hover { border-color:#cfd4d0; background:#fafbfa; }
.hj-experience-v27 .hj28-text-button { min-height:36px; padding:0 9px; border-color:transparent; background:transparent; color:var(--hj28-muted); }
.hj-experience-v27 .hj28-text-button:hover { background:var(--hj28-soft); color:var(--hj28-ink); }

.hj-experience-v27 .hj28-section { margin-top:28px; }
.hj-experience-v27 .hj28-section-head,
.hj-experience-v27 .hj28-panel-head {
  margin-bottom:13px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
}
.hj-experience-v27 .hj28-section-head h2,
.hj-experience-v27 .hj28-panel-head h2 { margin:0; color:var(--hj28-ink); font-size:18px; font-weight:650; line-height:1.2; letter-spacing:-.025em; }
.hj-experience-v27 .hj28-section-head p,
.hj-experience-v27 .hj28-panel-head p { margin:5px 0 0; color:var(--hj28-muted); font-size:10.5px; line-height:1.45; }
.hj-experience-v27 .hj28-section-actions { display:flex; align-items:center; gap:6px; }
.hj-experience-v27 .hj28-count-badge {
  min-height:26px;
  padding:0 9px;
  display:inline-flex;
  align-items:center;
  border:1px solid var(--hj28-line);
  border-radius:999px;
  background:#fff;
  color:var(--hj28-muted);
  font-size:9.5px;
  font-weight:650;
}

.hj-experience-v27 .hj28-todo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.hj-experience-v27 .hj28-todo-card {
  min-width:0;
  min-height:155px;
  padding:17px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  grid-template-rows:1fr auto;
  gap:13px 12px;
  border:1px solid var(--hj28-line);
  border-radius:14px;
  background:#fff;
  box-shadow:0 2px 7px rgba(21,28,23,.025);
}
.hj-experience-v27 .hj28-todo-card.is-primary { background:linear-gradient(135deg,#f2fbf7 0%,#fff 68%); border-color:#d7ebe1; }
.hj-experience-v27 .hj28-todo-card.is-warning { background:linear-gradient(135deg,#fff9ed 0%,#fff 70%); border-color:#efe2c8; }
.hj-experience-v27 .hj28-todo-card.is-success { background:linear-gradient(135deg,#f4faf6 0%,#fff 72%); }
.hj-experience-v27 .hj28-todo-icon {
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--hj28-green-soft);
  color:var(--hj28-green);
}
.hj-experience-v27 .hj28-todo-card.is-warning .hj28-todo-icon { background:var(--hj28-amber-soft); color:var(--hj28-amber); }
.hj-experience-v27 .hj28-todo-icon svg { width:17px; height:17px; }
.hj-experience-v27 .hj28-todo-copy { min-width:0; }
.hj-experience-v27 .hj28-todo-copy strong { display:block; color:var(--hj28-ink); font-size:11.5px; font-weight:680; line-height:1.35; }
.hj-experience-v27 .hj28-todo-copy p { margin:5px 0 0; color:var(--hj28-muted); font-size:9.5px; line-height:1.5; }
.hj-experience-v27 .hj28-todo-card > a {
  grid-column:2;
  display:inline-flex;
  align-items:center;
  gap:6px;
  justify-self:start;
  color:var(--hj28-green-dark);
  font-size:9.5px;
  font-weight:750;
  text-decoration:none;
}
.hj-experience-v27 .hj28-todo-card > a svg { width:13px; height:13px; transition:transform .16s ease; }
.hj-experience-v27 .hj28-todo-card > a:hover svg { transform:translateX(2px); }

.hj-experience-v27 .hj28-business-list { display:grid; gap:12px; }
.hj-experience-v27 .hj28-business-card,
.hj-experience-v27 .hj28-business-empty,
.hj-experience-v27 .hj28-panel {
  overflow:hidden;
  border:1px solid var(--hj28-line);
  border-radius:15px;
  background:#fff;
  box-shadow:0 2px 8px rgba(21,28,23,.025);
}
.hj-experience-v27 .hj28-business-main {
  min-height:72px;
  padding:14px 16px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
}
.hj-experience-v27 .hj28-site-mark {
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#141715;
  color:#fff;
}
.hj-experience-v27 .hj28-site-mark.is-2 { background:#e8f8ef; color:#087653; }
.hj-experience-v27 .hj28-site-mark.is-3 { background:#f0eefb; color:#5943a6; }
.hj-experience-v27 .hj28-site-mark svg { width:19px; height:19px; }
.hj-experience-v27 .hj28-site-identity { min-width:0; }
.hj-experience-v27 .hj28-site-identity > div { display:flex; align-items:center; gap:6px; min-width:0; }
.hj-experience-v27 .hj28-site-identity strong { display:block; overflow:hidden; color:var(--hj28-ink); font-size:12.5px; font-weight:670; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj28-site-identity a { width:22px; height:22px; display:grid; flex:0 0 auto; place-items:center; border-radius:6px; color:var(--hj28-muted); }
.hj-experience-v27 .hj28-site-identity a:hover { background:var(--hj28-soft); color:var(--hj28-ink); }
.hj-experience-v27 .hj28-site-identity a svg { width:12px; height:12px; transform:rotate(-45deg); }
.hj-experience-v27 .hj28-site-identity > span { display:block; margin-top:4px; color:var(--hj28-muted); font-size:9.5px; }
.hj-experience-v27 .hj28-status {
  min-height:25px;
  padding:0 9px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  border-radius:999px;
  background:var(--hj28-green-soft);
  color:var(--hj28-green-dark);
  font-size:8.5px;
  font-weight:700;
  white-space:nowrap;
}
.hj-experience-v27 .hj28-status i { width:5px; height:5px; border-radius:50%; background:#18a66d; box-shadow:0 0 0 3px rgba(24,166,109,.11); }
.hj-experience-v27 .hj28-status.is-attention { background:var(--hj28-amber-soft); color:#8d5a0b; }
.hj-experience-v27 .hj28-status.is-attention i { background:#d69824; box-shadow:0 0 0 3px rgba(214,152,36,.12); }
.hj-experience-v27 .hj28-business-tools {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border-top:1px solid var(--hj28-line);
  border-bottom:1px solid var(--hj28-line);
  background:#fbfcfb;
}
.hj-experience-v27 .hj28-business-tools > a {
  min-width:0;
  min-height:72px;
  padding:12px 14px;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) 13px;
  gap:9px;
  align-items:center;
  border-left:1px solid var(--hj28-line);
  color:var(--hj28-ink);
  text-decoration:none;
}
.hj-experience-v27 .hj28-business-tools > a:first-child { border-left:0; }
.hj-experience-v27 .hj28-business-tools > a:hover { background:#fff; }
.hj-experience-v27 .hj28-business-tools > a > span {
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border:1px solid #e3e7e4;
  border-radius:9px;
  background:#fff;
  color:var(--hj28-green-dark);
}
.hj-experience-v27 .hj28-business-tools > a > span svg { width:15px; height:15px; }
.hj-experience-v27 .hj28-business-tools > a > div { min-width:0; }
.hj-experience-v27 .hj28-business-tools strong { display:block; font-size:10px; font-weight:680; }
.hj-experience-v27 .hj28-business-tools small { display:block; margin-top:3px; overflow:hidden; color:var(--hj28-muted); font-size:8.5px; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj28-business-tools > a > svg { width:12px; height:12px; color:#9ba19c; }
.hj-experience-v27 .hj28-business-footer {
  min-height:52px;
  padding:8px 12px 8px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.hj-experience-v27 .hj28-business-footer > span { overflow:hidden; color:var(--hj28-muted); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj28-business-footer .hj28-button { min-height:34px; }
.hj-experience-v27 .hj28-business-empty {
  min-height:144px;
  padding:22px;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  background:linear-gradient(135deg,#fbfcfb,#f5f8f6);
}
.hj-experience-v27 .hj28-business-empty > span { width:48px; height:48px; display:grid; place-items:center; border-radius:13px; background:#fff; color:var(--hj28-green); box-shadow:0 4px 18px rgba(17,44,32,.07); }
.hj-experience-v27 .hj28-business-empty > span svg { width:22px; height:22px; }
.hj-experience-v27 .hj28-business-empty strong { font-size:13px; }
.hj-experience-v27 .hj28-business-empty p { margin:5px 0 0; color:var(--hj28-muted); font-size:10px; line-height:1.5; }

.hj-experience-v27 .hj28-product-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.hj-experience-v27 .hj28-product-grid > a {
  min-width:0;
  min-height:84px;
  padding:14px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 14px;
  gap:11px;
  align-items:center;
  border:1px solid var(--hj28-line);
  border-radius:13px;
  background:#fff;
  color:var(--hj28-ink);
  text-decoration:none;
  box-shadow:0 2px 7px rgba(21,28,23,.02);
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
.hj-experience-v27 .hj28-product-grid > a:hover { transform:translateY(-1px); border-color:#cfd5d0; box-shadow:0 8px 22px rgba(21,28,23,.06); }
.hj-experience-v27 .hj28-product-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:10px; background:var(--hj28-green-soft); color:var(--hj28-green); }
.hj-experience-v27 .hj28-product-icon svg { width:17px; height:17px; }
.hj-experience-v27 .hj28-product-grid strong { display:block; font-size:10.5px; font-weight:680; }
.hj-experience-v27 .hj28-product-grid small { display:block; margin-top:4px; overflow:hidden; color:var(--hj28-muted); font-size:8.5px; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj28-product-grid b { color:#a1a6a2; }
.hj-experience-v27 .hj28-product-grid b svg { width:13px; height:13px; }

.hj-experience-v27 .hj28-bottom-grid { margin-top:28px; display:grid; grid-template-columns:minmax(0,1.65fr) minmax(290px,.72fr); gap:12px; align-items:start; }
.hj-experience-v27 .hj28-panel { min-width:0; padding:17px; }
.hj-experience-v27 .hj28-panel-head { margin-bottom:12px; align-items:center; }
.hj-experience-v27 .hj28-panel-head > a { color:var(--hj28-green-dark); font-size:9.5px; font-weight:720; text-decoration:none; }
.hj-experience-v27 .hj28-activity-list { border-top:1px solid var(--hj28-line); }
.hj-experience-v27 .hj28-activity-list > a {
  min-height:58px;
  padding:9px 2px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto 46px 14px;
  gap:10px;
  align-items:center;
  border-bottom:1px solid var(--hj28-line);
  color:var(--hj28-ink);
  text-decoration:none;
}
.hj-experience-v27 .hj28-activity-list > a:last-child { border-bottom:0; }
.hj-experience-v27 .hj28-activity-list > a:hover .hj28-activity-copy strong { color:var(--hj28-green-dark); }
.hj-experience-v27 .hj28-activity-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:var(--hj28-soft); color:var(--hj28-green-dark); }
.hj-experience-v27 .hj28-activity-icon svg { width:15px; height:15px; }
.hj-experience-v27 .hj28-activity-copy { min-width:0; }
.hj-experience-v27 .hj28-activity-copy strong,
.hj-experience-v27 .hj28-activity-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj28-activity-copy strong { font-size:9.8px; font-weight:670; }
.hj-experience-v27 .hj28-activity-copy small { margin-top:3px; color:var(--hj28-muted); font-size:8.5px; }
.hj-experience-v27 .hj28-activity-list time { color:var(--hj28-muted); font-size:8.5px; text-align:right; }
.hj-experience-v27 .hj28-activity-list > a > b { color:#a4aaa5; }
.hj-experience-v27 .hj28-activity-list > a > b svg { width:12px; height:12px; }
.hj-experience-v27 .hj28-empty { min-height:220px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.hj-experience-v27 .hj28-empty > span { width:44px; height:44px; display:grid; place-items:center; border-radius:12px; background:var(--hj28-soft); color:var(--hj28-green); }
.hj-experience-v27 .hj28-empty > span svg { width:19px; height:19px; }
.hj-experience-v27 .hj28-empty strong { margin-top:10px; font-size:11px; }
.hj-experience-v27 .hj28-empty p { margin:4px 0 0; color:var(--hj28-muted); font-size:9px; }
.hj-experience-v27 .hj28-account-balance {
  padding:16px;
  border-radius:12px;
  background:linear-gradient(135deg,#132a21,#0a5e43);
  color:#fff;
}
.hj-experience-v27 .hj28-account-balance span,
.hj-experience-v27 .hj28-account-balance small { display:block; color:rgba(255,255,255,.62); font-size:9px; }
.hj-experience-v27 .hj28-account-balance strong { display:block; margin:8px 0 6px; font-size:25px; font-weight:590; letter-spacing:-.045em; }
.hj-experience-v27 .hj28-account-stats { margin-top:9px; display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.hj-experience-v27 .hj28-account-stats a { min-height:64px; padding:11px; display:flex; flex-direction:column; justify-content:space-between; border:1px solid var(--hj28-line); border-radius:10px; background:#fff; color:var(--hj28-ink); text-decoration:none; }
.hj-experience-v27 .hj28-account-stats a:hover { background:var(--hj28-soft); }
.hj-experience-v27 .hj28-account-stats span { color:var(--hj28-muted); font-size:8.5px; }
.hj-experience-v27 .hj28-account-stats strong { font-size:17px; font-weight:650; letter-spacing:-.03em; }
.hj-experience-v27 .hj28-account-action { min-height:38px; margin-top:9px; padding:0 11px; display:flex; align-items:center; justify-content:space-between; border-radius:9px; background:var(--hj28-soft); color:var(--hj28-ink); font-size:9.5px; font-weight:680; text-decoration:none; }
.hj-experience-v27 .hj28-account-action:hover { background:#edf1ee; }
.hj-experience-v27 .hj28-account-action svg { width:13px; height:13px; }

@media (max-width:1180px) {
  .hj-experience-v27 .hj28-welcome { grid-template-columns:minmax(0,1fr); }
  .hj-experience-v27 .hj28-welcome-summary { position:absolute; top:24px; right:24px; }
  .hj-experience-v27 .hj28-welcome-copy { padding-right:360px; }
  .hj-experience-v27 .hj28-product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hj-experience-v27 .hj28-business-tools { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hj-experience-v27 .hj28-business-tools > a:nth-child(3) { border-left:0; border-top:1px solid var(--hj28-line); }
  .hj-experience-v27 .hj28-business-tools > a:nth-child(4) { border-top:1px solid var(--hj28-line); }
}
@media (max-width:900px) {
  .hj-experience-v27 .hj28-dashboard { padding-top:17px; }
  .hj-experience-v27 .hj28-welcome { min-height:248px; display:flex; flex-direction:column; align-items:flex-start; }
  .hj-experience-v27 .hj28-welcome-copy { padding-right:0; }
  .hj-experience-v27 .hj28-welcome-summary { position:static; width:100%; margin-top:auto; }
  .hj-experience-v27 .hj28-welcome-actions { width:100%; }
  .hj-experience-v27 .hj28-todo-grid { grid-template-columns:1fr; }
  .hj-experience-v27 .hj28-todo-card { min-height:122px; }
  .hj-experience-v27 .hj28-bottom-grid { grid-template-columns:1fr; }
  .hj-experience-v27 .hj28-account-panel { display:grid; grid-template-columns:1.1fr 1fr; gap:10px; }
  .hj-experience-v27 .hj28-account-panel .hj28-panel-head { grid-column:1 / -1; }
  .hj-experience-v27 .hj28-account-action { grid-column:1 / -1; }
}
@media (max-width:680px) {
  .hj-experience-v27 .hj28-dashboard { padding-bottom:28px; }
  .hj-experience-v27 .hj28-welcome { min-height:310px; padding:22px 19px; border-radius:17px; background-position:62% center; }
  .hj-experience-v27 .hj28-welcome h1 { font-size:31px; }
  .hj-experience-v27 .hj28-welcome-summary { grid-template-columns:repeat(3,1fr); }
  .hj-experience-v27 .hj28-welcome-summary span { min-width:0; padding:12px 9px; }
  .hj-experience-v27 .hj28-welcome-summary strong { font-size:18px; }
  .hj-experience-v27 .hj28-welcome-summary small { overflow:hidden; font-size:8px; text-overflow:ellipsis; }
  .hj-experience-v27 .hj28-welcome-actions { flex-direction:column; align-items:stretch; }
  .hj-experience-v27 .hj28-welcome-actions .hj28-button { width:100%; }
  .hj-experience-v27 .hj28-section { margin-top:23px; }
  .hj-experience-v27 .hj28-section-head { align-items:flex-start; flex-direction:column; gap:9px; }
  .hj-experience-v27 .hj28-section-actions { width:100%; }
  .hj-experience-v27 .hj28-section-actions .hj28-button { margin-left:auto; }
  .hj-experience-v27 .hj28-business-main { grid-template-columns:40px minmax(0,1fr); }
  .hj-experience-v27 .hj28-business-main > .hj28-status { grid-column:2; justify-self:start; }
  .hj-experience-v27 .hj28-business-tools { grid-template-columns:1fr; }
  .hj-experience-v27 .hj28-business-tools > a { border-left:0; border-top:1px solid var(--hj28-line); }
  .hj-experience-v27 .hj28-business-tools > a:first-child { border-top:0; }
  .hj-experience-v27 .hj28-business-tools > a:nth-child(3) { border-top:1px solid var(--hj28-line); }
  .hj-experience-v27 .hj28-product-grid { grid-template-columns:1fr; }
  .hj-experience-v27 .hj28-business-empty { grid-template-columns:44px minmax(0,1fr); }
  .hj-experience-v27 .hj28-business-empty .hj28-button { grid-column:1 / -1; width:100%; }
  .hj-experience-v27 .hj28-activity-list > a { grid-template-columns:32px minmax(0,1fr) 13px; }
  .hj-experience-v27 .hj28-activity-list .hj28-status,
  .hj-experience-v27 .hj28-activity-list time { display:none; }
  .hj-experience-v27 .hj28-account-panel { display:block; }
  .hj-experience-v27 .hj28-account-stats { margin-top:9px; }
}
@media (max-width:420px) {
  .hj-experience-v27 .hj28-welcome-summary { grid-template-columns:1fr 1fr; }
  .hj-experience-v27 .hj28-welcome-summary span:nth-child(3) { grid-column:1 / -1; border-top:1px solid rgba(255,255,255,.10); border-left:0; }
  .hj-experience-v27 .hj28-todo-card { grid-template-columns:34px minmax(0,1fr); padding:15px; }
  .hj-experience-v27 .hj28-business-footer { align-items:flex-start; flex-direction:column; }
  .hj-experience-v27 .hj28-business-footer .hj28-button { width:100%; }
}

/* Dark appearance support without altering global shell chrome. */
.hj-experience-v27[data-hj-theme="dark"] .hj28-dashboard {
  --hj28-ink:#f0f3f1;
  --hj28-muted:#a7b0aa;
  --hj28-soft:#1b201d;
  --hj28-lilac:#171b18;
  --hj28-line:#2c332e;
  --hj28-line-strong:#374039;
  --hj28-green-soft:#173629;
  --hj28-amber-soft:#352916;
}
.hj-experience-v27[data-hj-theme="dark"] .hj28-todo-card,
.hj-experience-v27[data-hj-theme="dark"] .hj28-business-card,
.hj-experience-v27[data-hj-theme="dark"] .hj28-business-empty,
.hj-experience-v27[data-hj-theme="dark"] .hj28-panel,
.hj-experience-v27[data-hj-theme="dark"] .hj28-product-grid > a,
.hj-experience-v27[data-hj-theme="dark"] .hj28-count-badge,
.hj-experience-v27[data-hj-theme="dark"] .hj28-button.is-secondary,
.hj-experience-v27[data-hj-theme="dark"] .hj28-account-stats a { background:#151916; }
.hj-experience-v27[data-hj-theme="dark"] .hj28-todo-card.is-primary,
.hj-experience-v27[data-hj-theme="dark"] .hj28-todo-card.is-warning,
.hj-experience-v27[data-hj-theme="dark"] .hj28-todo-card.is-success { background:#151916; }
.hj-experience-v27[data-hj-theme="dark"] .hj28-business-tools { background:#121512; }
.hj-experience-v27[data-hj-theme="dark"] .hj28-business-tools > a:hover { background:#1a1f1b; }
.hj-experience-v27[data-hj-theme="dark"] .hj28-business-tools > a > span { background:#1b201d; border-color:#303831; }
.hj-experience-v27[data-hj-theme="dark"] .hj28-site-mark.is-2,
.hj-experience-v27[data-hj-theme="dark"] .hj28-site-mark.is-3 { background:#202721; }

/* ========================================================================== 
   HostingJet 0.27.4 — shadcn-derived customer dashboard
   Dashboard content only. Global HALO sidebar and header are intentionally
   untouched. The layout adapts the supplied shadcn-admin/ui card hierarchy
   into the existing PHP customer experience.
   ========================================================================== */
.hj-experience-v27 .hj29-dashboard {
  --hj29-bg:#f7f8f7;
  --hj29-card:#ffffff;
  --hj29-ink:#161a17;
  --hj29-muted:#6f776f;
  --hj29-line:#e5e9e6;
  --hj29-line-strong:#d8ded9;
  --hj29-soft:#f2f5f3;
  --hj29-green:#07835e;
  --hj29-green-dark:#075f47;
  --hj29-green-soft:#eaf7f1;
  --hj29-amber:#a4660a;
  --hj29-amber-soft:#fff6e5;
  width:min(1540px,100%);
  margin:0 auto;
  padding:18px 22px 42px;
  color:var(--hj29-ink);
  font-size:13px;
}
.hj-experience-v27 .hj29-dashboard *,
.hj-experience-v27 .hj29-dashboard *::before,
.hj-experience-v27 .hj29-dashboard *::after { box-sizing:border-box; }
.hj-experience-v27 .hj29-dashboard a,
.hj-experience-v27 .hj29-dashboard button { -webkit-tap-highlight-color:transparent; }
.hj-experience-v27 .hj29-dashboard svg { display:block; }

.hj-experience-v27 .hj29-hero {
  position:relative;
  min-height:232px;
  display:flex;
  align-items:center;
  overflow:hidden;
  padding:30px 32px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:20px;
  background:
    linear-gradient(90deg,rgba(0,7,5,.98) 0%,rgba(0,11,8,.93) 45%,rgba(1,31,21,.54) 100%),
    linear-gradient(180deg,rgba(255,255,255,.025),rgba(0,0,0,.25)),
    url("img/hj27-greeting-card-bg.webp") center 47% / cover no-repeat;
  color:#fff;
  box-shadow:0 1px 1px rgba(0,0,0,.08),0 18px 45px rgba(3,38,27,.14);
}
.hj-experience-v27 .hj29-hero::before {
  content:"";
  position:absolute;
  inset:-35% 24% auto auto;
  width:420px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(89,223,165,.18),transparent 67%);
  pointer-events:none;
}
.hj-experience-v27 .hj29-hero-copy { position:relative; z-index:2; width:min(650px,58%); }
.hj-experience-v27 .hj29-hero-kicker {
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:rgba(255,255,255,.70);
  font-size:10px;
  font-weight:700;
  letter-spacing:.105em;
  text-transform:uppercase;
}
.hj-experience-v27 .hj29-hero-kicker i { width:7px; height:7px; border-radius:50%; background:#6be0aa; box-shadow:0 0 0 4px rgba(107,224,170,.12); }
.hj-experience-v27 .hj29-hero h1 { margin:12px 0 0; color:#fff; font-size:38px; font-weight:560; line-height:1.04; letter-spacing:-.045em; }
.hj-experience-v27 .hj29-hero-copy > p { max-width:590px; margin:11px 0 0; color:rgba(255,255,255,.68); font-size:13px; line-height:1.65; }
.hj-experience-v27 .hj29-hero-actions { margin-top:22px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.hj-experience-v27 .hj29-button {
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 13px;
  border:1px solid transparent;
  border-radius:9px;
  font:inherit;
  font-size:11px;
  font-weight:700;
  line-height:1;
  text-decoration:none;
  cursor:pointer;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.hj-experience-v27 .hj29-button:hover { transform:translateY(-1px); }
.hj-experience-v27 .hj29-button svg { width:14px; height:14px; }
.hj-experience-v27 .hj29-button.is-primary { background:#fff; color:#10251d; box-shadow:0 6px 18px rgba(0,0,0,.13); }
.hj-experience-v27 .hj29-button.is-primary:hover { background:#f3fbf7; }
.hj-experience-v27 .hj29-button.is-glass { border-color:rgba(255,255,255,.16); background:rgba(255,255,255,.075); color:#fff; backdrop-filter:blur(12px); }
.hj-experience-v27 .hj29-button.is-glass:hover { background:rgba(255,255,255,.13); }
.hj-experience-v27 .hj29-button.is-secondary { min-height:34px; border-color:var(--hj29-line); background:var(--hj29-card); color:var(--hj29-ink); box-shadow:0 1px 2px rgba(18,28,22,.03); }
.hj-experience-v27 .hj29-button.is-secondary:hover { border-color:var(--hj29-line-strong); background:var(--hj29-soft); }

.hj-experience-v27 .hj29-hero-summary {
  position:relative;
  z-index:2;
  margin-left:auto;
  width:340px;
  min-height:146px;
  display:grid;
  grid-template-columns:104px minmax(0,1fr);
  gap:18px;
  align-items:center;
  padding:18px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:16px;
  background:rgba(2,20,14,.38);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 15px 35px rgba(0,0,0,.14);
  backdrop-filter:blur(16px);
}
.hj-experience-v27 .hj29-health-ring {
  width:98px;
  height:98px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:conic-gradient(#72dfa9 var(--hj29-health),rgba(255,255,255,.12) 0);
  box-shadow:0 0 0 1px rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.16);
}
.hj-experience-v27 .hj29-health-ring::before { content:""; grid-area:1/1; width:78px; height:78px; border-radius:50%; background:#0b2c21; box-shadow:inset 0 0 0 1px rgba(255,255,255,.06); }
.hj-experience-v27 .hj29-health-ring > div { position:relative; z-index:1; grid-area:1/1; display:grid; justify-items:center; }
.hj-experience-v27 .hj29-health-ring strong { font-size:23px; font-weight:650; line-height:1; letter-spacing:-.04em; }
.hj-experience-v27 .hj29-health-ring span { margin-top:4px; color:rgba(255,255,255,.58); font-size:8px; font-weight:650; letter-spacing:.05em; text-transform:uppercase; }
.hj-experience-v27 .hj29-hero-summary-copy { min-width:0; }
.hj-experience-v27 .hj29-state,
.hj-experience-v27 .hj29-badge,
.hj-experience-v27 .hj29-status {
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
}
.hj-experience-v27 .hj29-state { color:#fff; font-size:11px; font-weight:720; }
.hj-experience-v27 .hj29-state i,
.hj-experience-v27 .hj29-status i { width:6px; height:6px; border-radius:50%; background:#73dda9; box-shadow:0 0 0 3px rgba(115,221,169,.12); }
.hj-experience-v27 .hj29-state.is-warning i,
.hj-experience-v27 .hj29-status.is-attention i { background:#f4bd66; box-shadow:0 0 0 3px rgba(244,189,102,.12); }
.hj-experience-v27 .hj29-state.is-neutral i { background:#aeb7b1; box-shadow:0 0 0 3px rgba(174,183,177,.12); }
.hj-experience-v27 .hj29-hero-summary-copy p { margin:8px 0 11px; color:rgba(255,255,255,.61); font-size:10px; line-height:1.5; }
.hj-experience-v27 .hj29-hero-summary-copy a { display:inline-flex; align-items:center; gap:6px; color:#a5e8c7; font-size:9.5px; font-weight:700; text-decoration:none; }
.hj-experience-v27 .hj29-hero-summary-copy a svg { width:12px; height:12px; transition:transform .16s ease; }
.hj-experience-v27 .hj29-hero-summary-copy a:hover svg { transform:translateX(2px); }

.hj-experience-v27 .hj29-kpi-grid { margin-top:14px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.hj-experience-v27 .hj29-kpi {
  min-width:0;
  min-height:144px;
  display:flex;
  flex-direction:column;
  padding:15px 16px 13px;
  border:1px solid var(--hj29-line);
  border-radius:14px;
  background:linear-gradient(180deg,rgba(7,131,94,.045),rgba(255,255,255,0) 48%),var(--hj29-card);
  color:var(--hj29-ink);
  text-decoration:none;
  box-shadow:0 1px 2px rgba(15,23,18,.035);
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.hj-experience-v27 .hj29-kpi:hover { transform:translateY(-2px); border-color:#cbd5ce; box-shadow:0 12px 28px rgba(18,38,28,.075); }
.hj-experience-v27 .hj29-kpi header { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.hj-experience-v27 .hj29-kpi-icon { width:32px; height:32px; display:grid; place-items:center; border:1px solid #dfe8e2; border-radius:9px; background:#f5f9f6; color:var(--hj29-green-dark); }
.hj-experience-v27 .hj29-kpi-icon svg { width:15px; height:15px; }
.hj-experience-v27 .hj29-badge { min-height:23px; padding:0 8px; border:1px solid var(--hj29-line); border-radius:999px; background:#fff; color:var(--hj29-muted); font-size:8.5px; font-weight:720; }
.hj-experience-v27 .hj29-badge.is-good { border-color:#cfeadd; background:var(--hj29-green-soft); color:var(--hj29-green-dark); }
.hj-experience-v27 .hj29-badge.is-warning { border-color:#f1dfbc; background:var(--hj29-amber-soft); color:var(--hj29-amber); }
.hj-experience-v27 .hj29-badge.is-neutral { background:var(--hj29-soft); }
.hj-experience-v27 .hj29-kpi-value { margin-top:12px; font-size:28px; font-weight:660; line-height:1; letter-spacing:-.045em; }
.hj-experience-v27 .hj29-kpi-value small { color:#a2aaa4; font-size:13px; font-weight:560; }
.hj-experience-v27 .hj29-kpi > strong { margin-top:5px; font-size:11px; font-weight:700; }
.hj-experience-v27 .hj29-kpi footer { margin-top:auto; padding-top:10px; display:flex; align-items:center; justify-content:space-between; gap:9px; border-top:1px solid #edf0ee; color:var(--hj29-muted); font-size:8.8px; }
.hj-experience-v27 .hj29-kpi footer span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj29-kpi footer svg { width:12px; height:12px; flex:0 0 auto; }

.hj-experience-v27 .hj29-card {
  min-width:0;
  overflow:hidden;
  border:1px solid var(--hj29-line);
  border-radius:14px;
  background:var(--hj29-card);
  box-shadow:0 1px 2px rgba(15,23,18,.035),0 10px 26px rgba(15,34,23,.025);
}
.hj-experience-v27 .hj29-workspace-grid { margin-top:14px; display:grid; grid-template-columns:minmax(0,1.7fr) minmax(320px,.72fr); gap:12px; align-items:start; }
.hj-experience-v27 .hj29-tools-grid { margin-top:12px; display:grid; grid-template-columns:minmax(0,1.45fr) minmax(340px,.78fr); gap:12px; align-items:stretch; }
.hj-experience-v27 .hj29-bottom-grid { margin-top:12px; display:grid; grid-template-columns:minmax(0,1.45fr) minmax(330px,.72fr); gap:12px; align-items:start; }
.hj-experience-v27 .hj29-card-head { min-height:77px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:15px 17px 13px; border-bottom:1px solid var(--hj29-line); }
.hj-experience-v27 .hj29-card-head > div { min-width:0; }
.hj-experience-v27 .hj29-section-kicker { display:block; margin-bottom:4px; color:var(--hj29-green); font-size:8px; font-weight:760; letter-spacing:.11em; text-transform:uppercase; }
.hj-experience-v27 .hj29-card-head h2 { margin:0; color:var(--hj29-ink); font-size:14px; font-weight:720; line-height:1.25; letter-spacing:-.015em; }
.hj-experience-v27 .hj29-card-head p { margin:4px 0 0; color:var(--hj29-muted); font-size:9.5px; line-height:1.45; }
.hj-experience-v27 .hj29-head-link { color:var(--hj29-green-dark); font-size:9.5px; font-weight:720; text-decoration:none; white-space:nowrap; }
.hj-experience-v27 .hj29-count { min-width:26px; height:26px; display:grid; place-items:center; border:1px solid var(--hj29-line); border-radius:8px; background:var(--hj29-soft); color:var(--hj29-ink); font-size:10px; font-weight:750; }

.hj-experience-v27 .hj29-service-list { padding:0 17px; }
.hj-experience-v27 .hj29-service-row { min-height:76px; display:grid; grid-template-columns:38px minmax(190px,1fr) auto auto; gap:12px; align-items:center; border-bottom:1px solid var(--hj29-line); }
.hj-experience-v27 .hj29-service-row:last-child { border-bottom:0; }
.hj-experience-v27 .hj29-service-mark { width:36px; height:36px; display:grid; place-items:center; border:1px solid #dce7e0; border-radius:10px; background:#edf8f3; color:var(--hj29-green-dark); }
.hj-experience-v27 .hj29-service-mark.is-2 { background:#f2f1fb; border-color:#e4e1f2; color:#605c83; }
.hj-experience-v27 .hj29-service-mark.is-3 { background:#f9f3e9; border-color:#eee0c8; color:#87622c; }
.hj-experience-v27 .hj29-service-mark svg { width:17px; height:17px; }
.hj-experience-v27 .hj29-service-copy { min-width:0; }
.hj-experience-v27 .hj29-service-copy > div { display:flex; align-items:center; gap:6px; }
.hj-experience-v27 .hj29-service-copy strong { min-width:0; overflow:hidden; color:var(--hj29-ink); font-size:11px; font-weight:720; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj29-service-copy a { color:#98a29b; }
.hj-experience-v27 .hj29-service-copy a:hover { color:var(--hj29-green); }
.hj-experience-v27 .hj29-service-copy a svg { width:11px; height:11px; transform:rotate(-45deg); }
.hj-experience-v27 .hj29-service-copy > span { display:block; margin-top:4px; overflow:hidden; color:var(--hj29-muted); font-size:8.6px; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj29-status { min-height:23px; padding:0 8px; border:1px solid #d7eadf; border-radius:999px; background:#f0faf5; color:#326d53; font-size:8.5px; font-weight:700; }
.hj-experience-v27 .hj29-status.is-attention { border-color:#f0dfbf; background:#fff8ea; color:#96610d; }
.hj-experience-v27 .hj29-status i { width:5px; height:5px; box-shadow:none; }
.hj-experience-v27 .hj29-service-actions { display:flex; align-items:center; gap:6px; }
.hj-experience-v27 .hj29-service-actions a { min-height:32px; display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:0 9px; border:1px solid var(--hj29-line); border-radius:8px; background:#fff; color:var(--hj29-muted); font-size:8.8px; font-weight:700; text-decoration:none; transition:.15s ease; }
.hj-experience-v27 .hj29-service-actions a:hover { border-color:#ccd6cf; background:var(--hj29-soft); color:var(--hj29-ink); }
.hj-experience-v27 .hj29-service-actions a.is-primary { border-color:#143c2f; background:#153d30; color:#fff; }
.hj-experience-v27 .hj29-service-actions a.is-primary:hover { background:#0f4936; }
.hj-experience-v27 .hj29-service-actions svg { width:12px; height:12px; }
.hj-experience-v27 .hj29-service-actions a.is-primary svg { width:11px; }

.hj-experience-v27 .hj29-todo-list { padding:4px 13px 8px; }
.hj-experience-v27 .hj29-todo-list > a { min-height:67px; display:grid; grid-template-columns:34px minmax(0,1fr) 13px; gap:10px; align-items:center; padding:8px 4px; border-bottom:1px solid var(--hj29-line); color:var(--hj29-ink); text-decoration:none; }
.hj-experience-v27 .hj29-todo-list > a:last-child { border-bottom:0; }
.hj-experience-v27 .hj29-todo-list > a:hover .hj29-todo-copy strong { color:var(--hj29-green-dark); }
.hj-experience-v27 .hj29-todo-icon { width:32px; height:32px; display:grid; place-items:center; border:1px solid #dce8e1; border-radius:9px; background:var(--hj29-green-soft); color:var(--hj29-green-dark); }
.hj-experience-v27 .hj29-todo-list > a.is-warning .hj29-todo-icon { border-color:#efdfc2; background:var(--hj29-amber-soft); color:var(--hj29-amber); }
.hj-experience-v27 .hj29-todo-list > a.is-neutral .hj29-todo-icon { border-color:var(--hj29-line); background:var(--hj29-soft); color:#5e675f; }
.hj-experience-v27 .hj29-todo-icon svg { width:14px; height:14px; }
.hj-experience-v27 .hj29-todo-copy { min-width:0; }
.hj-experience-v27 .hj29-todo-copy strong,
.hj-experience-v27 .hj29-todo-copy small { display:block; overflow:hidden; text-overflow:ellipsis; }
.hj-experience-v27 .hj29-todo-copy strong { font-size:9.8px; font-weight:720; white-space:nowrap; }
.hj-experience-v27 .hj29-todo-copy small { max-height:27px; margin-top:3px; color:var(--hj29-muted); font-size:8.4px; line-height:1.45; }
.hj-experience-v27 .hj29-todo-list b { color:#a8b0aa; }
.hj-experience-v27 .hj29-todo-list b svg { width:12px; height:12px; }

.hj-experience-v27 .hj29-product-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.hj-experience-v27 .hj29-product-grid > a { min-height:83px; display:grid; grid-template-columns:38px minmax(0,1fr) 13px; gap:11px; align-items:center; padding:14px 16px; border-right:1px solid var(--hj29-line); border-bottom:1px solid var(--hj29-line); color:var(--hj29-ink); text-decoration:none; transition:background .15s ease; }
.hj-experience-v27 .hj29-product-grid > a:nth-child(2n) { border-right:0; }
.hj-experience-v27 .hj29-product-grid > a:nth-last-child(-n+2) { border-bottom:0; }
.hj-experience-v27 .hj29-product-grid > a:hover { background:#fafcfb; }
.hj-experience-v27 .hj29-product-icon { width:36px; height:36px; display:grid; place-items:center; border:1px solid #dce7e0; border-radius:10px; background:var(--hj29-green-soft); color:var(--hj29-green-dark); }
.hj-experience-v27 .hj29-product-icon svg { width:16px; height:16px; }
.hj-experience-v27 .hj29-product-grid div { min-width:0; }
.hj-experience-v27 .hj29-product-grid strong,
.hj-experience-v27 .hj29-product-grid small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj29-product-grid strong { font-size:10px; font-weight:720; }
.hj-experience-v27 .hj29-product-grid small { margin-top:4px; color:var(--hj29-muted); font-size:8.5px; }
.hj-experience-v27 .hj29-product-grid b { color:#a6aea8; }
.hj-experience-v27 .hj29-product-grid b svg { width:12px; height:12px; }

.hj-experience-v27 .hj29-health-card { display:flex; flex-direction:column; }
.hj-experience-v27 .hj29-health-body { flex:1; display:grid; grid-template-columns:122px minmax(0,1fr); gap:16px; align-items:center; padding:18px; }
.hj-experience-v27 .hj29-health-ring.is-large { width:116px; height:116px; background:conic-gradient(var(--hj29-green) var(--hj29-health),#e8eeea 0); box-shadow:none; }
.hj-experience-v27 .hj29-health-ring.is-large::before { width:90px; height:90px; background:#fff; box-shadow:inset 0 0 0 1px var(--hj29-line); }
.hj-experience-v27 .hj29-health-ring.is-large strong { color:var(--hj29-ink); font-size:26px; }
.hj-experience-v27 .hj29-health-ring.is-large span { color:var(--hj29-muted); }
.hj-experience-v27 .hj29-health-checks { display:grid; }
.hj-experience-v27 .hj29-health-checks a { min-height:34px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid var(--hj29-line); color:var(--hj29-ink); font-size:9px; text-decoration:none; }
.hj-experience-v27 .hj29-health-checks a:last-child { border-bottom:0; }
.hj-experience-v27 .hj29-health-checks a > span { display:flex; align-items:center; gap:7px; color:var(--hj29-muted); }
.hj-experience-v27 .hj29-health-checks i { width:6px; height:6px; border-radius:50%; background:#9ea7a1; }
.hj-experience-v27 .hj29-health-checks i.is-good { background:var(--hj29-green); }
.hj-experience-v27 .hj29-health-checks i.is-warning { background:#d39431; }
.hj-experience-v27 .hj29-health-checks strong { font-size:8.8px; font-weight:720; }
.hj-experience-v27 .hj29-card-action { min-height:40px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:0 16px; border-top:1px solid var(--hj29-line); background:#fbfcfb; color:var(--hj29-green-dark); font-size:9.3px; font-weight:720; text-decoration:none; }
.hj-experience-v27 .hj29-card-action:hover { background:var(--hj29-soft); }
.hj-experience-v27 .hj29-card-action svg { width:12px; height:12px; }

.hj-experience-v27 .hj29-activity-list { padding:0 17px; }
.hj-experience-v27 .hj29-activity-list > a { min-height:61px; display:grid; grid-template-columns:34px minmax(0,1fr) auto 48px 13px; gap:10px; align-items:center; border-bottom:1px solid var(--hj29-line); color:var(--hj29-ink); text-decoration:none; }
.hj-experience-v27 .hj29-activity-list > a:last-child { border-bottom:0; }
.hj-experience-v27 .hj29-activity-icon { width:32px; height:32px; display:grid; place-items:center; border:1px solid #dce7e0; border-radius:9px; background:var(--hj29-soft); color:var(--hj29-green-dark); }
.hj-experience-v27 .hj29-activity-icon svg { width:14px; height:14px; }
.hj-experience-v27 .hj29-activity-copy { min-width:0; }
.hj-experience-v27 .hj29-activity-copy strong,
.hj-experience-v27 .hj29-activity-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hj-experience-v27 .hj29-activity-copy strong { font-size:9.7px; font-weight:700; }
.hj-experience-v27 .hj29-activity-copy small { margin-top:3px; color:var(--hj29-muted); font-size:8.4px; }
.hj-experience-v27 .hj29-activity-list time { color:var(--hj29-muted); font-size:8.5px; text-align:right; }
.hj-experience-v27 .hj29-activity-list > a > b { color:#a7aea9; }
.hj-experience-v27 .hj29-activity-list > a > b svg { width:12px; height:12px; }

.hj-experience-v27 .hj29-balance { margin:14px 16px 0; padding:16px; border-radius:12px; background:linear-gradient(135deg,#122a21,#086348); color:#fff; box-shadow:0 12px 28px rgba(5,58,40,.14); }
.hj-experience-v27 .hj29-balance span,
.hj-experience-v27 .hj29-balance small { display:block; color:rgba(255,255,255,.65); font-size:8.7px; }
.hj-experience-v27 .hj29-balance strong { display:block; margin:7px 0 5px; font-size:25px; font-weight:590; letter-spacing:-.045em; }
.hj-experience-v27 .hj29-mini-stats { margin:10px 16px 14px; display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.hj-experience-v27 .hj29-mini-stats a { min-height:61px; display:flex; flex-direction:column; justify-content:space-between; padding:10px 11px; border:1px solid var(--hj29-line); border-radius:10px; background:#fff; color:var(--hj29-ink); text-decoration:none; transition:.15s ease; }
.hj-experience-v27 .hj29-mini-stats a:hover { border-color:#ccd6cf; background:var(--hj29-soft); }
.hj-experience-v27 .hj29-mini-stats span { color:var(--hj29-muted); font-size:8.4px; }
.hj-experience-v27 .hj29-mini-stats strong { font-size:17px; font-weight:660; letter-spacing:-.035em; }

.hj-experience-v27 .hj29-empty-state { min-height:190px; display:grid; grid-template-columns:46px minmax(0,1fr) auto; gap:14px; align-items:center; padding:24px; }
.hj-experience-v27 .hj29-empty-state > span { width:44px; height:44px; display:grid; place-items:center; border:1px solid #dce7e0; border-radius:12px; background:var(--hj29-green-soft); color:var(--hj29-green-dark); }
.hj-experience-v27 .hj29-empty-state > span svg { width:19px; height:19px; }
.hj-experience-v27 .hj29-empty-state strong { display:block; font-size:11px; }
.hj-experience-v27 .hj29-empty-state p { margin:5px 0 0; color:var(--hj29-muted); font-size:9px; line-height:1.5; }
.hj-experience-v27 .hj29-empty-state.is-compact { min-height:150px; grid-template-columns:44px minmax(0,1fr); }

@media (max-width:1260px) {
  .hj-experience-v27 .hj29-hero-copy { width:min(590px,55%); }
  .hj-experience-v27 .hj29-hero-summary { width:318px; grid-template-columns:92px minmax(0,1fr); }
  .hj-experience-v27 .hj29-health-ring { width:88px; height:88px; }
  .hj-experience-v27 .hj29-health-ring::before { width:69px; height:69px; }
  .hj-experience-v27 .hj29-workspace-grid { grid-template-columns:minmax(0,1.42fr) minmax(300px,.72fr); }
  .hj-experience-v27 .hj29-service-actions a:not(.is-primary) span { display:none; }
}
@media (max-width:1080px) {
  .hj-experience-v27 .hj29-hero { min-height:260px; }
  .hj-experience-v27 .hj29-hero-copy { width:56%; }
  .hj-experience-v27 .hj29-hero-summary { width:300px; }
  .hj-experience-v27 .hj29-kpi-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hj-experience-v27 .hj29-workspace-grid,
  .hj-experience-v27 .hj29-tools-grid,
  .hj-experience-v27 .hj29-bottom-grid { grid-template-columns:1fr; }
  .hj-experience-v27 .hj29-todos-card { order:-1; }
  .hj-experience-v27 .hj29-todo-list { display:grid; grid-template-columns:1fr 1fr; gap:0 14px; }
  .hj-experience-v27 .hj29-todo-list > a:nth-last-child(-n+2) { border-bottom:0; }
  .hj-experience-v27 .hj29-health-body { grid-template-columns:132px minmax(0,1fr); }
}
@media (max-width:820px) {
  .hj-experience-v27 .hj29-dashboard { padding:14px 15px 32px; }
  .hj-experience-v27 .hj29-hero { min-height:0; display:block; padding:24px 21px; background-position:62% center; }
  .hj-experience-v27 .hj29-hero-copy { width:100%; padding-right:0; }
  .hj-experience-v27 .hj29-hero h1 { font-size:33px; }
  .hj-experience-v27 .hj29-hero-summary { width:100%; min-height:124px; margin-top:22px; grid-template-columns:92px minmax(0,1fr); padding:14px; }
  .hj-experience-v27 .hj29-service-row { grid-template-columns:38px minmax(0,1fr) auto; padding:10px 0; }
  .hj-experience-v27 .hj29-service-actions { grid-column:2 / -1; justify-content:flex-start; }
  .hj-experience-v27 .hj29-todo-list { grid-template-columns:1fr; }
  .hj-experience-v27 .hj29-todo-list > a:nth-last-child(-n+2) { border-bottom:1px solid var(--hj29-line); }
  .hj-experience-v27 .hj29-todo-list > a:last-child { border-bottom:0; }
}
@media (max-width:620px) {
  .hj-experience-v27 .hj29-dashboard { padding-left:12px; padding-right:12px; }
  .hj-experience-v27 .hj29-hero { border-radius:17px; padding:22px 18px; }
  .hj-experience-v27 .hj29-hero h1 { font-size:30px; }
  .hj-experience-v27 .hj29-hero-copy > p { font-size:11.5px; }
  .hj-experience-v27 .hj29-hero-actions { align-items:stretch; flex-direction:column; }
  .hj-experience-v27 .hj29-hero-actions .hj29-button { width:100%; }
  .hj-experience-v27 .hj29-hero-summary { grid-template-columns:82px minmax(0,1fr); gap:13px; }
  .hj-experience-v27 .hj29-health-ring { width:78px; height:78px; }
  .hj-experience-v27 .hj29-health-ring::before { width:61px; height:61px; }
  .hj-experience-v27 .hj29-health-ring strong { font-size:19px; }
  .hj-experience-v27 .hj29-kpi-grid { grid-template-columns:1fr; }
  .hj-experience-v27 .hj29-card-head { min-height:0; align-items:flex-start; padding:14px; }
  .hj-experience-v27 .hj29-card-head .hj29-button { min-height:31px; padding:0 10px; }
  .hj-experience-v27 .hj29-service-list,
  .hj-experience-v27 .hj29-activity-list { padding:0 13px; }
  .hj-experience-v27 .hj29-service-row { grid-template-columns:36px minmax(0,1fr); gap:10px; }
  .hj-experience-v27 .hj29-service-row > .hj29-status { grid-column:2; justify-self:start; }
  .hj-experience-v27 .hj29-service-actions { grid-column:1 / -1; width:100%; }
  .hj-experience-v27 .hj29-service-actions a { flex:1; }
  .hj-experience-v27 .hj29-product-grid { grid-template-columns:1fr; }
  .hj-experience-v27 .hj29-product-grid > a { border-right:0; border-bottom:1px solid var(--hj29-line) !important; }
  .hj-experience-v27 .hj29-product-grid > a:last-child { border-bottom:0 !important; }
  .hj-experience-v27 .hj29-health-body { grid-template-columns:1fr; justify-items:center; }
  .hj-experience-v27 .hj29-health-checks { width:100%; }
  .hj-experience-v27 .hj29-activity-list > a { grid-template-columns:32px minmax(0,1fr) 13px; }
  .hj-experience-v27 .hj29-activity-list .hj29-status,
  .hj-experience-v27 .hj29-activity-list time { display:none; }
  .hj-experience-v27 .hj29-mini-stats { grid-template-columns:1fr 1fr; }
  .hj-experience-v27 .hj29-empty-state { grid-template-columns:44px minmax(0,1fr); }
  .hj-experience-v27 .hj29-empty-state .hj29-button { grid-column:1 / -1; width:100%; }
}
@media (max-width:400px) {
  .hj-experience-v27 .hj29-hero-summary { grid-template-columns:1fr; justify-items:start; }
  .hj-experience-v27 .hj29-health-ring { width:76px; height:76px; }
  .hj-experience-v27 .hj29-service-actions a:not(.is-primary) span { display:none; }
}

/* Dark appearance support for the dashboard content only. */
.hj-experience-v27[data-hj-theme="dark"] .hj29-dashboard {
  --hj29-bg:#101311;
  --hj29-card:#151916;
  --hj29-ink:#eef2ef;
  --hj29-muted:#9da69f;
  --hj29-line:#29302b;
  --hj29-line-strong:#374039;
  --hj29-soft:#1b201d;
  --hj29-green-soft:#18372b;
  --hj29-amber-soft:#352a18;
}
.hj-experience-v27[data-hj-theme="dark"] .hj29-kpi,
.hj-experience-v27[data-hj-theme="dark"] .hj29-card,
.hj-experience-v27[data-hj-theme="dark"] .hj29-button.is-secondary,
.hj-experience-v27[data-hj-theme="dark"] .hj29-service-actions a,
.hj-experience-v27[data-hj-theme="dark"] .hj29-mini-stats a,
.hj-experience-v27[data-hj-theme="dark"] .hj29-badge { background-color:var(--hj29-card); }
.hj-experience-v27[data-hj-theme="dark"] .hj29-kpi { background:linear-gradient(180deg,rgba(56,156,112,.08),rgba(21,25,22,0) 48%),var(--hj29-card); }
.hj-experience-v27[data-hj-theme="dark"] .hj29-kpi-icon,
.hj-experience-v27[data-hj-theme="dark"] .hj29-service-mark,
.hj-experience-v27[data-hj-theme="dark"] .hj29-todo-icon,
.hj-experience-v27[data-hj-theme="dark"] .hj29-product-icon,
.hj-experience-v27[data-hj-theme="dark"] .hj29-activity-icon { background:#1b241f; border-color:#303a33; }
.hj-experience-v27[data-hj-theme="dark"] .hj29-service-mark.is-2,
.hj-experience-v27[data-hj-theme="dark"] .hj29-service-mark.is-3 { background:#202521; border-color:#353b36; }
.hj-experience-v27[data-hj-theme="dark"] .hj29-product-grid > a:hover,
.hj-experience-v27[data-hj-theme="dark"] .hj29-card-action,
.hj-experience-v27[data-hj-theme="dark"] .hj29-service-actions a:hover { background:#1a1f1b; }
.hj-experience-v27[data-hj-theme="dark"] .hj29-health-ring.is-large { background:conic-gradient(#31a879 var(--hj29-health),#29312b 0); }
.hj-experience-v27[data-hj-theme="dark"] .hj29-health-ring.is-large::before { background:var(--hj29-card); border-color:var(--hj29-line); }
.hj-experience-v27[data-hj-theme="dark"] .hj29-mini-stats a { color:var(--hj29-ink); }

/* =========================================================
   HostingJet customer dashboard 0.27.5 — ground-up rebuild
   Scope intentionally excludes the global HALO header/sidebar.
   ========================================================= */
.hj-experience-v27 .hj30-dashboard{
  --hj30-bg:#f6f7f6;
  --hj30-card:#fff;
  --hj30-ink:#151816;
  --hj30-muted:#707872;
  --hj30-line:#e4e8e5;
  --hj30-line-strong:#d5dbd7;
  --hj30-soft:#f2f5f3;
  --hj30-green:#0a7d5b;
  --hj30-green-dark:#075b43;
  --hj30-green-soft:#eaf7f1;
  --hj30-warning:#a6660a;
  --hj30-warning-soft:#fff5e4;
  min-height:100%;
  padding:22px 24px 42px;
  background:
    radial-gradient(circle at 93% 2%,rgba(35,132,96,.055),transparent 23%),
    var(--hj30-bg);
  color:var(--hj30-ink);
  font-family:inherit;
}
.hj-experience-v27 .hj30-dashboard *,
.hj-experience-v27 .hj30-dashboard *::before,
.hj-experience-v27 .hj30-dashboard *::after{box-sizing:border-box}
.hj-experience-v27 .hj30-dashboard a{text-decoration:none}
.hj-experience-v27 .hj30-dashboard svg{display:block;width:16px;height:16px}
.hj-experience-v27 .hj30-page-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 17px}
.hj-experience-v27 .hj30-eyebrow{display:block;color:#7b847e;font-size:9px;font-weight:760;letter-spacing:.095em;line-height:1.25;text-transform:uppercase}
.hj-experience-v27 .hj30-page-intro h1{margin:6px 0 4px;color:var(--hj30-ink);font-size:29px;font-weight:640;letter-spacing:-.045em;line-height:1.08}
.hj-experience-v27 .hj30-page-intro p{margin:0;color:var(--hj30-muted);font-size:11px;line-height:1.55}
.hj-experience-v27 .hj30-page-actions{display:flex;align-items:center;gap:8px}
.hj-experience-v27 .hj30-search-trigger,
.hj-experience-v27 .hj30-button{min-height:35px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 12px;border:1px solid var(--hj30-line);border-radius:9px;background:var(--hj30-card);color:var(--hj30-ink);font:inherit;font-size:10px;font-weight:680;line-height:1;box-shadow:0 1px 2px rgba(12,22,16,.025);cursor:pointer;transition:border-color .16s ease,background .16s ease,transform .16s ease,box-shadow .16s ease}
.hj-experience-v27 .hj30-search-trigger{min-width:180px;justify-content:flex-start;color:#59615c}
.hj-experience-v27 .hj30-search-trigger span{flex:1;text-align:left}
.hj-experience-v27 .hj30-search-trigger kbd{min-width:30px;padding:4px 6px;border:1px solid #e3e7e4;border-radius:6px;background:#f5f7f5;color:#8a918c;font-family:inherit;font-size:8px;font-weight:650;text-align:center;box-shadow:inset 0 -1px rgba(0,0,0,.03)}
.hj-experience-v27 .hj30-search-trigger:hover,
.hj-experience-v27 .hj30-button:hover{transform:translateY(-1px);border-color:var(--hj30-line-strong);box-shadow:0 7px 18px rgba(18,33,23,.055)}
.hj-experience-v27 .hj30-button.is-primary{border-color:#0a7255;background:#0a7255;color:#fff;box-shadow:0 6px 17px rgba(4,91,65,.15)}
.hj-experience-v27 .hj30-button.is-primary:hover{background:#075f47}
.hj-experience-v27 .hj30-button.is-secondary{background:#fff;color:#252a26}
.hj-experience-v27 .hj30-button.is-light{border-color:#fff;background:#fff;color:#12221b;box-shadow:0 7px 22px rgba(0,0,0,.15)}
.hj-experience-v27 .hj30-button.is-light:hover{background:#f0fbf5}
.hj-experience-v27 .hj30-button.is-ghost{border-color:rgba(255,255,255,.16);background:rgba(255,255,255,.075);color:#fff;backdrop-filter:blur(12px)}
.hj-experience-v27 .hj30-button.is-ghost:hover{background:rgba(255,255,255,.13)}
.hj-experience-v27 .hj30-command-card{position:relative;min-height:292px;display:grid;grid-template-columns:minmax(0,1fr) 316px;overflow:hidden;border:1px solid #14392d;border-radius:19px;background:
  linear-gradient(90deg,rgba(0,0,0,.94) 0%,rgba(1,19,13,.90) 42%,rgba(7,64,46,.52) 100%),
  url("img/hj27-greeting-card-bg.webp") center/cover no-repeat;
  color:#fff;box-shadow:0 18px 44px rgba(9,37,25,.14)}
.hj-experience-v27 .hj30-command-card::before{content:"";position:absolute;inset:0;background:
  radial-gradient(circle at 67% 45%,rgba(87,221,161,.18),transparent 26%),
  linear-gradient(120deg,transparent 38%,rgba(255,255,255,.03) 38.2%,transparent 38.5%);pointer-events:none}
.hj-experience-v27 .hj30-command-copy{position:relative;z-index:1;display:flex;flex-direction:column;padding:26px 27px 0}
.hj-experience-v27 .hj30-command-topline{display:flex;align-items:center;justify-content:space-between;gap:14px}
.hj-experience-v27 .hj30-command-topline>span{display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,.66);font-size:8.8px;font-weight:720;letter-spacing:.09em;text-transform:uppercase}
.hj-experience-v27 .hj30-command-topline>span i{width:6px;height:6px;border-radius:50%;background:#72dfaa;box-shadow:0 0 0 4px rgba(114,223,170,.11)}
.hj-experience-v27 .hj30-command-topline>em{min-height:23px;display:inline-flex;align-items:center;padding:0 9px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.06);color:#cce9da;font-size:8px;font-style:normal;font-weight:720;letter-spacing:.04em;text-transform:uppercase}
.hj-experience-v27 .hj30-command-topline>em.is-warning{color:#ffd895}
.hj-experience-v27 .hj30-command-topline>em.is-neutral{color:#d5dbd7}
.hj-experience-v27 .hj30-command-copy h2{margin:20px 0 0;max-width:600px;color:#fff;font-size:39px;font-weight:540;letter-spacing:-.052em;line-height:1.01}
.hj-experience-v27 .hj30-command-copy>p{max-width:580px;margin:11px 0 0;color:rgba(255,255,255,.62);font-size:11.2px;line-height:1.62}
.hj-experience-v27 .hj30-command-actions{display:flex;align-items:center;gap:8px;margin-top:19px}
.hj-experience-v27 .hj30-command-metrics{margin-top:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.095)}
.hj-experience-v27 .hj30-command-metrics>a{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 9px;padding:13px 14px 14px 0;border-right:1px solid rgba(255,255,255,.085);color:#fff}
.hj-experience-v27 .hj30-command-metrics>a:not(:first-child){padding-left:14px}
.hj-experience-v27 .hj30-command-metrics>a:last-child{border-right:0}
.hj-experience-v27 .hj30-command-metrics span{grid-column:1/-1;color:rgba(255,255,255,.48);font-size:7.8px;font-weight:680;letter-spacing:.07em;text-transform:uppercase}
.hj-experience-v27 .hj30-command-metrics strong{min-width:0;overflow:hidden;color:#fff;font-size:18px;font-weight:650;letter-spacing:-.035em;text-overflow:ellipsis;white-space:nowrap}
.hj-experience-v27 .hj30-command-metrics strong small{color:rgba(255,255,255,.43);font-size:9px;font-weight:560}
.hj-experience-v27 .hj30-command-metrics strong.is-money{font-size:13px;line-height:1.55}
.hj-experience-v27 .hj30-command-metrics em{align-self:center;color:#8fdcb8;font-size:7.6px;font-style:normal;font-weight:650;white-space:nowrap}
.hj-experience-v27 .hj30-health-panel{position:relative;z-index:1;margin:16px;padding:18px;border:1px solid rgba(255,255,255,.11);border-radius:15px;background:rgba(0,10,7,.44);box-shadow:inset 0 1px rgba(255,255,255,.035);backdrop-filter:blur(18px)}
.hj-experience-v27 .hj30-health-ring{width:101px;height:101px;display:grid;place-items:center;margin:2px auto 13px;border-radius:50%;background:conic-gradient(#71e0a9 var(--hj30-health),rgba(255,255,255,.1) 0);box-shadow:0 0 34px rgba(61,206,139,.13)}
.hj-experience-v27 .hj30-health-ring::before{content:"";grid-area:1/1;width:77px;height:77px;border-radius:50%;background:#09261c;box-shadow:inset 0 0 0 1px rgba(255,255,255,.055)}
.hj-experience-v27 .hj30-health-ring>div{position:relative;z-index:1;grid-area:1/1;display:grid;justify-items:center}
.hj-experience-v27 .hj30-health-ring strong{font-size:27px;font-weight:680;line-height:1;letter-spacing:-.055em}
.hj-experience-v27 .hj30-health-ring span{margin-top:3px;color:rgba(255,255,255,.52);font-size:7.5px;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.hj-experience-v27 .hj30-health-copy{text-align:center}
.hj-experience-v27 .hj30-health-copy>span{color:rgba(255,255,255,.44);font-size:7.6px;font-weight:710;letter-spacing:.09em;text-transform:uppercase}
.hj-experience-v27 .hj30-health-copy>strong{display:block;margin-top:4px;color:#fff;font-size:13px;font-weight:670}
.hj-experience-v27 .hj30-health-copy>p{margin:5px auto 13px;max-width:205px;color:rgba(255,255,255,.53);font-size:8.5px;line-height:1.45}
.hj-experience-v27 .hj30-health-list{display:grid;border-top:1px solid rgba(255,255,255,.09)}
.hj-experience-v27 .hj30-health-list a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:29px;border-bottom:1px solid rgba(255,255,255,.07);color:rgba(255,255,255,.62);font-size:8.5px}
.hj-experience-v27 .hj30-health-list a:last-child{border-bottom:0}
.hj-experience-v27 .hj30-health-list span{display:inline-flex;align-items:center;gap:7px}
.hj-experience-v27 .hj30-health-list i,
.hj-experience-v27 .hj30-status i{width:5px;height:5px;border-radius:50%;background:#6fdda8;box-shadow:0 0 0 3px rgba(111,221,168,.1)}
.hj-experience-v27 .hj30-health-list i.is-warning,
.hj-experience-v27 .hj30-status.is-warning i{background:#edb55e;box-shadow:0 0 0 3px rgba(237,181,94,.11)}
.hj-experience-v27 .hj30-health-list strong{color:#fff;font-size:8.5px;font-weight:690}
.hj-experience-v27 .hj30-dashboard-grid{margin-top:13px;display:grid;grid-template-columns:minmax(0,1.55fr) minmax(305px,.62fr);gap:13px;align-items:start}
.hj-experience-v27 .hj30-main-column,
.hj-experience-v27 .hj30-side-column{display:grid;gap:13px;min-width:0}
.hj-experience-v27 .hj30-card{overflow:hidden;border:1px solid var(--hj30-line);border-radius:14px;background:var(--hj30-card);box-shadow:0 1px 2px rgba(13,23,17,.018)}
.hj-experience-v27 .hj30-card-head{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 16px;border-bottom:1px solid var(--hj30-line)}
.hj-experience-v27 .hj30-card-head h2{margin:4px 0 2px;color:var(--hj30-ink);font-size:14px;font-weight:680;letter-spacing:-.023em;line-height:1.25}
.hj-experience-v27 .hj30-card-head p{margin:0;color:var(--hj30-muted);font-size:8.8px;line-height:1.45}
.hj-experience-v27 .hj30-head-action{display:inline-flex;align-items:center;gap:6px;color:var(--hj30-green-dark);font-size:8.7px;font-weight:720;white-space:nowrap}
.hj-experience-v27 .hj30-head-action svg{width:12px;height:12px;transition:transform .16s ease}
.hj-experience-v27 .hj30-head-action:hover svg{transform:translateX(2px)}
.hj-experience-v27 .hj30-site-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px}
.hj-experience-v27 .hj30-site-card{position:relative;min-width:0;padding:13px;border:1px solid var(--hj30-line);border-radius:12px;background:linear-gradient(145deg,rgba(10,125,91,.035),transparent 50%),#fff;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.hj-experience-v27 .hj30-site-card:hover{transform:translateY(-1px);border-color:#ccd6d0;box-shadow:0 10px 24px rgba(16,35,23,.06)}
.hj-experience-v27 .hj30-site-card header{display:flex;align-items:center;gap:8px}
.hj-experience-v27 .hj30-site-avatar{width:29px;height:29px;display:grid;place-items:center;border:1px solid #d9e8df;border-radius:9px;background:#eaf7f1;color:#09684d;font-size:10px;font-weight:760}
.hj-experience-v27 .hj30-site-card.is-2 .hj30-site-avatar{border-color:#dce4f2;background:#eef4fd;color:#44608e}
.hj-experience-v27 .hj30-site-card.is-3 .hj30-site-avatar{border-color:#eadff2;background:#f8f0fb;color:#78538d}
.hj-experience-v27 .hj30-site-card.is-4 .hj30-site-avatar{border-color:#f1e1c9;background:#fff7ea;color:#946728}
.hj-experience-v27 .hj30-site-state,
.hj-experience-v27 .hj30-status{display:inline-flex;align-items:center;gap:6px;min-height:21px;padding:0 7px;border-radius:999px;background:var(--hj30-green-soft);color:var(--hj30-green-dark);font-size:7.5px;font-weight:720;white-space:nowrap}
.hj-experience-v27 .hj30-site-state i{width:5px;height:5px;border-radius:50%;background:#0d976c}
.hj-experience-v27 .hj30-site-state.is-attention,
.hj-experience-v27 .hj30-status.is-warning{background:var(--hj30-warning-soft);color:var(--hj30-warning)}
.hj-experience-v27 .hj30-site-state.is-attention i{background:#d28a1d}
.hj-experience-v27 .hj30-icon-button{width:27px;height:27px;margin-left:auto;padding:0;border:0;border-radius:7px;background:transparent;color:#8a918c;font-size:12px;letter-spacing:.08em;cursor:pointer}
.hj-experience-v27 .hj30-icon-button:hover{background:var(--hj30-soft);color:var(--hj30-ink)}
.hj-experience-v27 .hj30-site-copy{margin-top:15px;min-width:0}
.hj-experience-v27 .hj30-site-copy strong{display:block;overflow:hidden;color:var(--hj30-ink);font-size:12px;font-weight:700;letter-spacing:-.015em;text-overflow:ellipsis;white-space:nowrap}
.hj-experience-v27 .hj30-site-copy span{display:block;margin-top:4px;color:var(--hj30-muted);font-size:8px}
.hj-experience-v27 .hj30-site-meta{display:flex;align-items:center;gap:12px;margin-top:12px;color:#747c76;font-size:7.7px}
.hj-experience-v27 .hj30-site-meta span{min-width:0;display:inline-flex;align-items:center;gap:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hj-experience-v27 .hj30-site-meta svg{width:11px;height:11px;color:#929a94}
.hj-experience-v27 .hj30-site-card footer{display:flex;align-items:center;gap:5px;margin:13px -2px -2px;padding-top:10px;border-top:1px solid #edf0ee}
.hj-experience-v27 .hj30-site-card footer a{min-height:28px;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 8px;border:1px solid var(--hj30-line);border-radius:7px;background:#fff;color:#4e5650;font-size:7.8px;font-weight:680;transition:.15s ease}
.hj-experience-v27 .hj30-site-card footer a:hover{border-color:#cdd7d0;background:var(--hj30-soft);color:var(--hj30-ink)}
.hj-experience-v27 .hj30-site-card footer a.is-primary{margin-left:auto;border-color:#096f53;background:#096f53;color:#fff}
.hj-experience-v27 .hj30-site-card footer a.is-primary:hover{background:#075b43}
.hj-experience-v27 .hj30-site-card footer a.is-visit{width:28px;padding:0}
.hj-experience-v27 .hj30-site-card footer svg{width:11px;height:11px}
.hj-experience-v27 .hj30-tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:6px}
.hj-experience-v27 .hj30-tool-grid>a{position:relative;min-width:0;display:grid;grid-template-columns:34px minmax(0,1fr) 13px;gap:9px;align-items:center;min-height:73px;padding:11px;border-right:1px solid var(--hj30-line);border-bottom:1px solid var(--hj30-line);color:var(--hj30-ink);transition:background .15s ease}
.hj-experience-v27 .hj30-tool-grid>a:nth-child(3n){border-right:0}
.hj-experience-v27 .hj30-tool-grid>a:nth-last-child(-n+3){border-bottom:0}
.hj-experience-v27 .hj30-tool-grid>a:hover{background:var(--hj30-soft)}
.hj-experience-v27 .hj30-tool-icon{width:33px;height:33px;display:grid;place-items:center;border:1px solid #d9e8df;border-radius:9px;background:#eaf7f1;color:#087153}
.hj-experience-v27 .hj30-tool-grid>a.is-blue .hj30-tool-icon{border-color:#dce6f4;background:#f0f5fc;color:#506c98}
.hj-experience-v27 .hj30-tool-grid>a.is-violet .hj30-tool-icon{border-color:#e7dcf0;background:#f8f2fb;color:#78588a}
.hj-experience-v27 .hj30-tool-grid>a.is-amber .hj30-tool-icon{border-color:#f0dfc4;background:#fff7e9;color:#94631f}
.hj-experience-v27 .hj30-tool-grid>a.is-rose .hj30-tool-icon{border-color:#f0dfe2;background:#fff3f4;color:#965261}
.hj-experience-v27 .hj30-tool-grid>a.is-slate .hj30-tool-icon{border-color:#e0e4e2;background:#f3f5f4;color:#59625c}
.hj-experience-v27 .hj30-tool-icon svg{width:15px;height:15px}
.hj-experience-v27 .hj30-tool-grid strong{display:block;font-size:9.2px;font-weight:700}
.hj-experience-v27 .hj30-tool-grid small{display:block;margin-top:3px;overflow:hidden;color:var(--hj30-muted);font-size:7.5px;text-overflow:ellipsis;white-space:nowrap}
.hj-experience-v27 .hj30-tool-grid b{color:#a1aaa4}
.hj-experience-v27 .hj30-tool-grid b svg{width:12px;height:12px}
.hj-experience-v27 .hj30-count{min-width:25px;height:25px;display:grid;place-items:center;border:1px solid var(--hj30-line);border-radius:8px;background:var(--hj30-soft);color:#6c746e;font-size:8px;font-weight:740}
.hj-experience-v27 .hj30-task-list{display:grid;padding:4px 13px 7px}
.hj-experience-v27 .hj30-task-list>a{min-width:0;display:grid;grid-template-columns:31px minmax(0,1fr) auto;gap:9px;align-items:center;padding:11px 0;border-bottom:1px solid var(--hj30-line);color:var(--hj30-ink)}
.hj-experience-v27 .hj30-task-list>a:last-child{border-bottom:0}
.hj-experience-v27 .hj30-task-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:var(--hj30-soft);color:#68716b}
.hj-experience-v27 .hj30-task-list>a.is-primary .hj30-task-icon,
.hj-experience-v27 .hj30-task-list>a.is-success .hj30-task-icon{background:var(--hj30-green-soft);color:var(--hj30-green-dark)}
.hj-experience-v27 .hj30-task-list>a.is-warning .hj30-task-icon{background:var(--hj30-warning-soft);color:var(--hj30-warning)}
.hj-experience-v27 .hj30-task-icon svg{width:14px;height:14px}
.hj-experience-v27 .hj30-task-list strong{display:block;font-size:8.8px;font-weight:700;line-height:1.35}
.hj-experience-v27 .hj30-task-list small{display:block;margin-top:3px;color:var(--hj30-muted);font-size:7.4px;line-height:1.45}
.hj-experience-v27 .hj30-task-list em{min-height:24px;display:inline-flex;align-items:center;padding:0 8px;border:1px solid var(--hj30-line);border-radius:7px;background:#fff;color:#59625c;font-size:7.3px;font-style:normal;font-weight:700}
.hj-experience-v27 .hj30-task-list>a:hover em{border-color:#cbd5ce;background:var(--hj30-soft)}
.hj-experience-v27 .hj30-billing-card{position:relative;overflow:hidden;padding:16px;border:1px solid #182d25;border-radius:14px;background:linear-gradient(145deg,#0b1712,#102b20 64%,#0d4a36);color:#fff;box-shadow:0 10px 27px rgba(8,35,24,.09)}
.hj-experience-v27 .hj30-billing-card::after{content:"";position:absolute;right:-45px;bottom:-65px;width:160px;height:160px;border-radius:50%;background:rgba(94,220,158,.11);filter:blur(4px)}
.hj-experience-v27 .hj30-billing-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px}
.hj-experience-v27 .hj30-billing-card .hj30-eyebrow{color:rgba(255,255,255,.43)}
.hj-experience-v27 .hj30-billing-card .hj30-status{background:rgba(109,224,170,.11);color:#a9e9c9}
.hj-experience-v27 .hj30-billing-card .hj30-status.is-warning{background:rgba(239,179,83,.12);color:#ffd58f}
.hj-experience-v27 .hj30-billing-card h2{position:relative;z-index:1;margin:22px 0 2px;font-size:27px;font-weight:610;letter-spacing:-.045em}
.hj-experience-v27 .hj30-billing-card>p{position:relative;z-index:1;margin:0;color:rgba(255,255,255,.49);font-size:8px}
.hj-experience-v27 .hj30-billing-stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:17px;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
.hj-experience-v27 .hj30-billing-stats span{min-width:0;padding:11px 9px;border-right:1px solid rgba(255,255,255,.08)}
.hj-experience-v27 .hj30-billing-stats span:first-child{padding-left:0}
.hj-experience-v27 .hj30-billing-stats span:last-child{border-right:0}
.hj-experience-v27 .hj30-billing-stats small{display:block;overflow:hidden;color:rgba(255,255,255,.43);font-size:6.9px;text-overflow:ellipsis;white-space:nowrap}
.hj-experience-v27 .hj30-billing-stats strong{display:block;margin-top:5px;font-size:14px;font-weight:650}
.hj-experience-v27 .hj30-billing-card>a{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;margin-top:13px;color:#a9e9c9;font-size:8.3px;font-weight:700}
.hj-experience-v27 .hj30-billing-card>a svg{width:12px;height:12px}
.hj-experience-v27 .hj30-concierge-card{position:relative;display:grid;grid-template-columns:37px minmax(0,1fr);gap:11px;padding:15px}
.hj-experience-v27 .hj30-concierge-icon{width:36px;height:36px;display:grid;place-items:center;border:1px solid #d6eadd;border-radius:10px;background:linear-gradient(145deg,#effaf4,#e4f4eb);color:#087153}
.hj-experience-v27 .hj30-concierge-icon svg{width:16px;height:16px}
.hj-experience-v27 .hj30-concierge-card h2{margin:4px 0 4px;font-size:13px;font-weight:680;letter-spacing:-.02em}
.hj-experience-v27 .hj30-concierge-card p{margin:0;color:var(--hj30-muted);font-size:7.9px;line-height:1.5}
.hj-experience-v27 .hj30-concierge-card .hj30-button{grid-column:1/-1;width:100%;margin-top:2px}
.hj-experience-v27 .hj30-activity-list{display:grid;padding:0 14px}
.hj-experience-v27 .hj30-activity-list>a{min-width:0;display:grid;grid-template-columns:31px minmax(0,1fr) auto 42px 13px;gap:9px;align-items:center;min-height:55px;border-bottom:1px solid var(--hj30-line);color:var(--hj30-ink)}
.hj-experience-v27 .hj30-activity-list>a:last-child{border-bottom:0}
.hj-experience-v27 .hj30-activity-icon{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--hj30-line);border-radius:8px;background:var(--hj30-soft);color:#657068}
.hj-experience-v27 .hj30-activity-icon svg{width:13px;height:13px}
.hj-experience-v27 .hj30-activity-copy{min-width:0}
.hj-experience-v27 .hj30-activity-copy strong{display:block;overflow:hidden;font-size:8.8px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.hj-experience-v27 .hj30-activity-copy small{display:block;margin-top:3px;overflow:hidden;color:var(--hj30-muted);font-size:7.4px;text-overflow:ellipsis;white-space:nowrap}
.hj-experience-v27 .hj30-activity-list time{color:#8b938d;font-size:7.5px;text-align:right}
.hj-experience-v27 .hj30-activity-list>a>b{color:#a5ada7}
.hj-experience-v27 .hj30-activity-list>a>b svg{width:11px;height:11px}
.hj-experience-v27 .hj30-empty{min-height:177px;display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:13px;align-items:center;padding:22px}
.hj-experience-v27 .hj30-empty>span{width:43px;height:43px;display:grid;place-items:center;border:1px solid #d7e7dd;border-radius:11px;background:var(--hj30-green-soft);color:var(--hj30-green-dark)}
.hj-experience-v27 .hj30-empty>span svg{width:18px;height:18px}
.hj-experience-v27 .hj30-empty strong{display:block;font-size:10px}
.hj-experience-v27 .hj30-empty p{margin:5px 0 0;color:var(--hj30-muted);font-size:8px;line-height:1.5}
.hj-experience-v27 .hj30-empty.is-compact{min-height:130px;grid-template-columns:43px minmax(0,1fr)}

@media(max-width:1260px){
  .hj-experience-v27 .hj30-command-card{grid-template-columns:minmax(0,1fr) 292px}
  .hj-experience-v27 .hj30-command-copy h2{font-size:35px}
  .hj-experience-v27 .hj30-dashboard-grid{grid-template-columns:minmax(0,1.38fr) minmax(292px,.68fr)}
  .hj-experience-v27 .hj30-site-card footer a:not(.is-primary):not(.is-visit){padding:0 7px}
  .hj-experience-v27 .hj30-site-card footer a:not(.is-primary):not(.is-visit){font-size:0}
  .hj-experience-v27 .hj30-site-card footer a:not(.is-primary):not(.is-visit) svg{width:13px;height:13px}
}
@media(max-width:1080px){
  .hj-experience-v27 .hj30-command-card{grid-template-columns:minmax(0,1fr) 270px}
  .hj-experience-v27 .hj30-command-copy{padding-left:23px;padding-right:23px}
  .hj-experience-v27 .hj30-command-copy h2{font-size:32px}
  .hj-experience-v27 .hj30-command-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hj-experience-v27 .hj30-command-metrics>a:nth-child(2){border-right:0}
  .hj-experience-v27 .hj30-command-metrics>a:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.085)}
  .hj-experience-v27 .hj30-dashboard-grid{grid-template-columns:1fr}
  .hj-experience-v27 .hj30-side-column{grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr)}
  .hj-experience-v27 .hj30-concierge-card{grid-column:1/-1}
}
@media(max-width:782px){
  .hj-experience-v27 .hj30-dashboard{padding:18px 14px 32px}
  .hj-experience-v27 .hj30-page-intro{align-items:flex-start;flex-direction:column;gap:13px}
  .hj-experience-v27 .hj30-page-actions{width:100%}
  .hj-experience-v27 .hj30-search-trigger{flex:1;min-width:0}
  .hj-experience-v27 .hj30-command-card{grid-template-columns:1fr}
  .hj-experience-v27 .hj30-command-copy{padding:22px 20px 0}
  .hj-experience-v27 .hj30-command-copy h2{font-size:31px}
  .hj-experience-v27 .hj30-health-panel{display:grid;grid-template-columns:93px minmax(0,1fr);gap:12px;align-items:center;margin-top:14px}
  .hj-experience-v27 .hj30-health-ring{width:88px;height:88px;margin:0}
  .hj-experience-v27 .hj30-health-ring::before{width:67px;height:67px}
  .hj-experience-v27 .hj30-health-ring strong{font-size:23px}
  .hj-experience-v27 .hj30-health-copy{text-align:left}
  .hj-experience-v27 .hj30-health-copy>p{margin-left:0}
  .hj-experience-v27 .hj30-health-list{grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr))}
  .hj-experience-v27 .hj30-health-list a:nth-child(odd){padding-right:12px;border-right:1px solid rgba(255,255,255,.07)}
  .hj-experience-v27 .hj30-health-list a:nth-child(even){padding-left:12px}
  .hj-experience-v27 .hj30-site-grid{grid-template-columns:1fr}
  .hj-experience-v27 .hj30-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hj-experience-v27 .hj30-tool-grid>a:nth-child(3n){border-right:1px solid var(--hj30-line)}
  .hj-experience-v27 .hj30-tool-grid>a:nth-child(2n){border-right:0}
  .hj-experience-v27 .hj30-tool-grid>a:nth-last-child(-n+3){border-bottom:1px solid var(--hj30-line)}
  .hj-experience-v27 .hj30-tool-grid>a:nth-last-child(-n+2){border-bottom:0}
  .hj-experience-v27 .hj30-side-column{grid-template-columns:1fr}
  .hj-experience-v27 .hj30-concierge-card{grid-column:auto}
}
@media(max-width:520px){
  .hj-experience-v27 .hj30-dashboard{padding-left:11px;padding-right:11px}
  .hj-experience-v27 .hj30-page-intro h1{font-size:26px}
  .hj-experience-v27 .hj30-page-actions{align-items:stretch;flex-direction:column}
  .hj-experience-v27 .hj30-command-card{border-radius:16px}
  .hj-experience-v27 .hj30-command-copy{padding:20px 17px 0}
  .hj-experience-v27 .hj30-command-copy h2{font-size:28px}
  .hj-experience-v27 .hj30-command-actions{align-items:stretch;flex-direction:column}
  .hj-experience-v27 .hj30-command-actions .hj30-button{width:100%}
  .hj-experience-v27 .hj30-command-metrics{grid-template-columns:1fr 1fr}
  .hj-experience-v27 .hj30-command-metrics>a{padding-right:8px}
  .hj-experience-v27 .hj30-command-metrics>a:not(:first-child){padding-left:8px}
  .hj-experience-v27 .hj30-health-panel{margin:12px;padding:14px}
  .hj-experience-v27 .hj30-card-head{min-height:0;align-items:flex-start;padding:14px}
  .hj-experience-v27 .hj30-head-action{margin-top:3px}
  .hj-experience-v27 .hj30-site-grid{padding:9px}
  .hj-experience-v27 .hj30-site-card footer a{flex:1}
  .hj-experience-v27 .hj30-site-card footer a.is-visit{flex:0 0 28px}
  .hj-experience-v27 .hj30-tool-grid{grid-template-columns:1fr}
  .hj-experience-v27 .hj30-tool-grid>a{border-right:0!important;border-bottom:1px solid var(--hj30-line)!important}
  .hj-experience-v27 .hj30-tool-grid>a:last-child{border-bottom:0!important}
  .hj-experience-v27 .hj30-task-list{padding-left:11px;padding-right:11px}
  .hj-experience-v27 .hj30-task-list>a{grid-template-columns:30px minmax(0,1fr)}
  .hj-experience-v27 .hj30-task-list em{grid-column:2;justify-self:start;margin-top:2px}
  .hj-experience-v27 .hj30-activity-list>a{grid-template-columns:30px minmax(0,1fr) 11px}
  .hj-experience-v27 .hj30-activity-list .hj30-status,
  .hj-experience-v27 .hj30-activity-list time{display:none}
  .hj-experience-v27 .hj30-empty{grid-template-columns:43px minmax(0,1fr);padding:18px}
  .hj-experience-v27 .hj30-empty .hj30-button{grid-column:1/-1;width:100%}
}

.hj-experience-v27[data-hj-theme="dark"] .hj30-dashboard{
  --hj30-bg:#0f1210;
  --hj30-card:#151916;
  --hj30-ink:#eef2ef;
  --hj30-muted:#9ba39d;
  --hj30-line:#29302b;
  --hj30-line-strong:#374039;
  --hj30-soft:#1b201d;
  --hj30-green-soft:#18372b;
  --hj30-warning-soft:#352a18;
  background:radial-gradient(circle at 93% 2%,rgba(47,142,103,.075),transparent 22%),var(--hj30-bg)
}
.hj-experience-v27[data-hj-theme="dark"] .hj30-search-trigger,
.hj-experience-v27[data-hj-theme="dark"] .hj30-button.is-secondary,
.hj-experience-v27[data-hj-theme="dark"] .hj30-card,
.hj-experience-v27[data-hj-theme="dark"] .hj30-site-card,
.hj-experience-v27[data-hj-theme="dark"] .hj30-site-card footer a,
.hj-experience-v27[data-hj-theme="dark"] .hj30-task-list em{background:var(--hj30-card);color:var(--hj30-ink)}
.hj-experience-v27[data-hj-theme="dark"] .hj30-search-trigger kbd{border-color:#333a35;background:#1d221f;color:#9ca49e}
.hj-experience-v27[data-hj-theme="dark"] .hj30-site-card{background:linear-gradient(145deg,rgba(22,124,89,.055),transparent 48%),var(--hj30-card)}
.hj-experience-v27[data-hj-theme="dark"] .hj30-site-card footer{border-top-color:#292f2b}
.hj-experience-v27[data-hj-theme="dark"] .hj30-tool-grid>a:hover,
.hj-experience-v27[data-hj-theme="dark"] .hj30-icon-button:hover{background:#1b201d}
.hj-experience-v27[data-hj-theme="dark"] .hj30-site-avatar,
.hj-experience-v27[data-hj-theme="dark"] .hj30-tool-icon,
.hj-experience-v27[data-hj-theme="dark"] .hj30-concierge-icon{filter:saturate(.75) brightness(.78)}

/* ========================================================================
   HostingJet customer dashboard 0.27.6 — premium product hub rebuild
   The global HALO sidebar and header are intentionally untouched.
   ======================================================================== */
.hj-experience-v27 .hj31-dashboard{
  --hj31-bg:#f4f4f2;
  --hj31-card:#fff;
  --hj31-text:#151714;
  --hj31-muted:#747873;
  --hj31-line:#e5e7e3;
  --hj31-line-strong:#d9dcd7;
  --hj31-accent:#d8ff35;
  --hj31-green:#123f34;
  --hj31-green-2:#1f5b4b;
  --hj31-good:#19b978;
  --hj31-warning:#d99021;
  min-height:calc(100vh - var(--halo-header-height));
  margin:0 -20px -24px;
  padding:25px 28px 42px;
  color:var(--hj31-text);
  background:var(--hj31-bg);
  font-family:inherit;
}
.hj-experience-v27 .hj31-dashboard *,
.hj-experience-v27 .hj31-dashboard *::before,
.hj-experience-v27 .hj31-dashboard *::after{box-sizing:border-box}
.hj-experience-v27 .hj31-dashboard a{text-decoration:none}
.hj-experience-v27 .hj31-dashboard svg{display:block;width:16px;height:16px;flex:0 0 auto}
.hj-experience-v27 .hj31-welcome,
.hj-experience-v27 .hj31-layout{width:min(1280px,100%);margin-inline:auto}

.hj-experience-v27 .hj31-welcome{
  min-height:98px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:4px 0 22px;
}
.hj-experience-v27 .hj31-kicker{
  display:block;
  margin-bottom:5px;
  color:#858984;
  font-size:10px;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.hj-experience-v27 .hj31-welcome h1{
  margin:0;
  color:#111310;
  font-size:clamp(28px,2.8vw,38px);
  font-weight:520;
  line-height:1.04;
  letter-spacing:-.05em;
}
.hj-experience-v27 .hj31-welcome p{margin:8px 0 0;color:var(--hj31-muted);font-size:12px;line-height:1.5}
.hj-experience-v27 .hj31-welcome-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap}
.hj-experience-v27 .hj31-button{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 14px;
  border:1px solid var(--hj31-line-strong);
  border-radius:7px;
  color:#252824;
  background:#fff;
  font-size:11.5px;
  font-weight:620;
  line-height:1;
  box-shadow:0 1px 1px rgba(17,24,20,.025);
  transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.hj-experience-v27 .hj31-button:hover{transform:translateY(-1px);border-color:#c8cbc6;box-shadow:0 5px 14px rgba(20,29,24,.07)}
.hj-experience-v27 .hj31-button.is-primary{border-color:var(--hj31-green);color:#fff;background:var(--hj31-green);box-shadow:0 4px 12px rgba(18,63,52,.14)}
.hj-experience-v27 .hj31-button.is-primary:hover{background:#0f352c}
.hj-experience-v27 .hj31-button.is-secondary{background:#f8f8f7}
.hj-experience-v27 .hj31-button em{min-width:17px;height:17px;display:grid;place-items:center;border-radius:999px;color:#774a0f;background:#ffe6b5;font-size:9px;font-style:normal;font-weight:750}

.hj-experience-v27 .hj31-layout{display:grid;grid-template-columns:minmax(0,1fr) 276px;gap:18px;align-items:start}
.hj-experience-v27 .hj31-main-column{min-width:0;display:grid;gap:18px}
.hj-experience-v27 .hj31-side-column{min-width:0;display:grid;gap:14px}
.hj-experience-v27 .hj31-card{
  min-width:0;
  border:1px solid var(--hj31-line);
  border-radius:12px;
  background:var(--hj31-card);
  box-shadow:0 1px 2px rgba(16,23,19,.025),0 10px 30px rgba(20,28,24,.025);
  overflow:hidden;
}

.hj-experience-v27 .hj31-tabs{
  height:49px;
  display:flex;
  align-items:stretch;
  gap:3px;
  padding:0 14px;
  border-bottom:1px solid var(--hj31-line);
  overflow-x:auto;
  scrollbar-width:none;
}
.hj-experience-v27 .hj31-tabs::-webkit-scrollbar{display:none}
.hj-experience-v27 .hj31-tabs a{
  position:relative;
  min-width:max-content;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 12px;
  color:#676b66;
  font-size:11.5px;
  font-weight:540;
}
.hj-experience-v27 .hj31-tabs a::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;border-radius:2px 2px 0 0;background:transparent}
.hj-experience-v27 .hj31-tabs a:hover{color:#171a17;background:#fafbf9}
.hj-experience-v27 .hj31-tabs a.is-active{color:#111411;font-weight:650}
.hj-experience-v27 .hj31-tabs a.is-active::after{background:var(--hj31-accent)}
.hj-experience-v27 .hj31-tabs b{min-width:18px;height:18px;display:grid;place-items:center;padding:0 5px;border-radius:999px;color:#727670;background:#f0f1ef;font-size:9px;font-weight:700}

.hj-experience-v27 .hj31-card-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:17px 18px 13px;
}
.hj-experience-v27 .hj31-card-heading h2,
.hj-experience-v27 .hj31-feed-heading h2,
.hj-experience-v27 .hj31-manage-card h2,
.hj-experience-v27 .hj31-side-card h2{margin:0;color:#171917;font-size:16px;font-weight:620;line-height:1.2;letter-spacing:-.025em}
.hj-experience-v27 .hj31-card-heading p{margin:5px 0 0;color:var(--hj31-muted);font-size:10.5px;line-height:1.45}
.hj-experience-v27 .hj31-card-heading>a{
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin-top:2px;
  color:#252824;
  font-size:10.5px;
  font-weight:650;
  white-space:nowrap;
}
.hj-experience-v27 .hj31-card-heading>a svg{width:13px;height:13px}

.hj-experience-v27 .hj31-resource-list{display:grid;gap:8px;padding:0 14px 14px}
.hj-experience-v27 .hj31-resource-row{
  min-height:62px;
  display:grid;
  grid-template-columns:34px minmax(150px,1fr) 45px auto auto;
  align-items:center;
  gap:11px;
  padding:9px 10px;
  border:1px solid #e8eae7;
  border-radius:9px;
  background:#fff;
  transition:border-color .16s ease,background .16s ease,transform .16s ease,box-shadow .16s ease;
}
.hj-experience-v27 .hj31-resource-row:hover{transform:translateY(-1px);border-color:#d4d8d2;background:#fdfefd;box-shadow:0 5px 15px rgba(19,28,23,.045)}
.hj-experience-v27 .hj31-resource-mark{position:relative;width:32px;height:32px;display:grid;place-items:center;border-radius:8px;background:#f1ecff;overflow:hidden}
.hj-experience-v27 .hj31-resource-mark i{width:15px;height:15px;border:4px solid #7657cc;border-radius:50% 48% 50% 48%;transform:rotate(45deg)}
.hj-experience-v27 .hj31-resource-mark.is-2{background:#e9ecff}.hj-experience-v27 .hj31-resource-mark.is-2 i{border-color:#5f6dda;border-radius:3px}
.hj-experience-v27 .hj31-resource-mark.is-3{background:#eeeeee}.hj-experience-v27 .hj31-resource-mark.is-3 i{border-color:#242826;border-radius:4px}
.hj-experience-v27 .hj31-resource-mark.is-4{background:#fff0df}.hj-experience-v27 .hj31-resource-mark.is-4 i{border-color:#e6832f;border-radius:50% 3px 50% 3px}
.hj-experience-v27 .hj31-resource-copy{min-width:0;display:grid;gap:3px}
.hj-experience-v27 .hj31-resource-copy strong{overflow:hidden;color:#171917;font-size:11.5px;font-weight:620;text-overflow:ellipsis;white-space:nowrap}
.hj-experience-v27 .hj31-resource-copy small{overflow:hidden;color:#7b7f7a;font-size:9.7px;text-overflow:ellipsis;white-space:nowrap}
.hj-experience-v27 .hj31-resource-service{color:#242724;font-size:9.5px;font-weight:650;text-align:center}
.hj-experience-v27 .hj31-resource-state{display:inline-flex;align-items:center;gap:5px;color:#7a7e79;font-size:9.4px;font-weight:570;white-space:nowrap}
.hj-experience-v27 .hj31-resource-state i{width:6px;height:6px;border-radius:50%;background:#a9ada8}
.hj-experience-v27 .hj31-resource-state.is-good i{background:var(--hj31-good)}
.hj-experience-v27 .hj31-resource-state.is-warning i{background:var(--hj31-warning)}
.hj-experience-v27 .hj31-resource-actions{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.hj-experience-v27 .hj31-resource-actions a{
  min-height:29px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:0 10px;
  border:1px solid #dfe2de;
  border-radius:6px;
  color:#202320;
  background:#fff;
  font-size:9.5px;
  font-weight:610;
  white-space:nowrap;
}
.hj-experience-v27 .hj31-resource-actions a:hover{border-color:#cdd2cc;background:#f8faf8}
.hj-experience-v27 .hj31-resource-actions a.is-primary{border-color:var(--hj31-green);color:#fff;background:var(--hj31-green)}
.hj-experience-v27 .hj31-resource-actions a span{font-size:9px}
.hj-experience-v27 .hj31-empty-state{min-height:172px;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:14px;margin:0 14px 14px;padding:22px;border:1px dashed #d7dad5;border-radius:10px;background:#fbfcfa}
.hj-experience-v27 .hj31-empty-state>span{width:40px;height:40px;display:grid;place-items:center;border-radius:9px;color:#4c554f;background:#eef1ed}.hj-experience-v27 .hj31-empty-state>span svg{width:19px;height:19px}
.hj-experience-v27 .hj31-empty-state strong{display:block;font-size:12px}.hj-experience-v27 .hj31-empty-state p{margin:4px 0 0;color:var(--hj31-muted);font-size:10.5px;line-height:1.45}

.hj-experience-v27 .hj31-feed-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.hj-experience-v27 .hj31-feed-card{min-height:322px;display:flex;flex-direction:column}
.hj-experience-v27 .hj31-feed-heading{height:54px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;border-bottom:1px solid var(--hj31-line)}
.hj-experience-v27 .hj31-feed-heading>a{width:28px;height:28px;display:grid;place-items:center;border-radius:6px;color:#5e635e}.hj-experience-v27 .hj31-feed-heading>a:hover{background:#f2f4f1;color:#151815}
.hj-experience-v27 .hj31-feed-heading>a svg{width:14px;height:14px}
.hj-experience-v27 .hj31-feed-list,
.hj-experience-v27 .hj31-activity-timeline{flex:1;display:grid;align-content:start}
.hj-experience-v27 .hj31-feed-list>a,
.hj-experience-v27 .hj31-activity-timeline>a{
  position:relative;
  min-height:68px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:10px 15px;
  border-bottom:1px solid #eef0ed;
  color:#1b1e1b;
}
.hj-experience-v27 .hj31-feed-list>a:hover,
.hj-experience-v27 .hj31-activity-timeline>a:hover{background:#fafbf9}
.hj-experience-v27 .hj31-feed-icon,
.hj-experience-v27 .hj31-timeline-icon{position:relative;width:32px;height:32px;display:grid;place-items:center;border-radius:8px;color:#3f4540;background:#f0f2ef}
.hj-experience-v27 .hj31-feed-icon svg,
.hj-experience-v27 .hj31-timeline-icon svg{width:14px;height:14px}
.hj-experience-v27 .hj31-feed-icon i{position:absolute;right:1px;top:1px;width:6px;height:6px;border:1.5px solid #fff;border-radius:50%;background:#27c783}
.hj-experience-v27 .hj31-feed-list>a>span:last-child,
.hj-experience-v27 .hj31-activity-timeline>a>span:last-child{min-width:0;display:grid;gap:4px}
.hj-experience-v27 .hj31-feed-list strong,
.hj-experience-v27 .hj31-activity-timeline strong{overflow:hidden;color:#1a1d1a;font-size:10.6px;font-weight:580;line-height:1.35;text-overflow:ellipsis}
.hj-experience-v27 .hj31-feed-list small,
.hj-experience-v27 .hj31-activity-timeline small{color:#858984;font-size:9.4px}
.hj-experience-v27 .hj31-activity-timeline{position:relative}
.hj-experience-v27 .hj31-activity-timeline::before{content:"";position:absolute;left:31px;top:32px;bottom:32px;width:1px;background:#e1e4df}
.hj-experience-v27 .hj31-timeline-icon{z-index:1;background:#f4f5f3}
.hj-experience-v27 .hj31-activity-timeline em{display:inline-flex;margin-right:4px;padding:2px 5px;border-radius:3px;color:#236540;background:#dff5e7;font-size:8.5px;font-style:normal;font-weight:700;vertical-align:1px}
.hj-experience-v27 .hj31-activity-timeline em.is-blue{color:#2a5e87;background:#e0effb}
.hj-experience-v27 .hj31-feed-card>footer{height:45px;margin-top:auto;display:flex;align-items:center;padding:0 16px;border-top:1px solid var(--hj31-line)}
.hj-experience-v27 .hj31-feed-card>footer a{display:inline-flex;align-items:center;gap:7px;color:#252825;font-size:10.5px;font-weight:620}.hj-experience-v27 .hj31-feed-card>footer a svg{width:13px;height:13px}
.hj-experience-v27 .hj31-feed-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px;text-align:center}
.hj-experience-v27 .hj31-feed-empty>span{width:39px;height:39px;display:grid;place-items:center;margin-bottom:10px;border-radius:9px;color:#59605a;background:#eff1ee}.hj-experience-v27 .hj31-feed-empty strong{font-size:11.5px}.hj-experience-v27 .hj31-feed-empty p{max-width:230px;margin:5px 0 0;color:var(--hj31-muted);font-size:9.8px;line-height:1.45}

.hj-experience-v27 .hj31-manage-card{padding:16px 14px 0}
.hj-experience-v27 .hj31-manage-card>header{padding:0 1px 12px}
.hj-experience-v27 .hj31-manage-card>header p{margin:5px 0 0;color:var(--hj31-muted);font-size:9.7px;line-height:1.4}
.hj-experience-v27 .hj31-product-search{
  width:100%;
  height:38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 11px;
  border:1px solid #dfe2dd;
  border-radius:7px;
  color:#7b807a;
  background:#fff;
  font:inherit;
  font-size:9.8px;
  text-align:left;
  cursor:pointer;
}
.hj-experience-v27 .hj31-product-search:hover{border-color:#cdd1cc;background:#fbfcfb}.hj-experience-v27 .hj31-product-search svg{width:14px;height:14px}
.hj-experience-v27 .hj31-product-list{display:grid;padding:11px 1px 13px}
.hj-experience-v27 .hj31-product-list>a{min-height:41px;display:grid;grid-template-columns:25px minmax(0,1fr) auto;align-items:center;gap:8px;padding:0 6px;border-radius:7px;color:#242724}
.hj-experience-v27 .hj31-product-list>a:hover{background:#f6f8f5}
.hj-experience-v27 .hj31-product-icon{width:24px;height:24px;display:grid;place-items:center;color:#323732}.hj-experience-v27 .hj31-product-icon svg{width:14px;height:14px}
.hj-experience-v27 .hj31-product-list strong{font-size:10.4px;font-weight:590}
.hj-experience-v27 .hj31-product-list em{display:inline-flex;align-items:center;gap:5px;color:#8b8f8a;font-size:8.8px;font-style:normal;white-space:nowrap}.hj-experience-v27 .hj31-product-list em i{width:5px;height:5px;border-radius:50%;background:#adb1ac}.hj-experience-v27 .hj31-product-list em.is-good i{background:#24c982}.hj-experience-v27 .hj31-product-list em.is-warning i{background:#e49b2e}
.hj-experience-v27 .hj31-manage-card>footer{height:44px;margin:0 -14px;display:flex;align-items:center;padding:0 15px;border-top:1px solid var(--hj31-line)}
.hj-experience-v27 .hj31-manage-card>footer a{width:100%;display:flex;align-items:center;justify-content:space-between;color:#252825;font-size:10.5px;font-weight:620}.hj-experience-v27 .hj31-manage-card>footer svg{width:13px;height:13px}

.hj-experience-v27 .hj31-side-card{position:relative;min-height:144px;display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;padding:15px}
.hj-experience-v27 .hj31-side-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:8px;color:#3c443f;background:#eef1ed}.hj-experience-v27 .hj31-side-icon svg{width:15px;height:15px}
.hj-experience-v27 .hj31-side-card>div{min-width:0}.hj-experience-v27 .hj31-side-card h2{font-size:14px}.hj-experience-v27 .hj31-side-card p{margin:6px 0 0;color:var(--hj31-muted);font-size:9.5px;line-height:1.45}
.hj-experience-v27 .hj31-side-card>a{grid-column:2;justify-self:start;min-height:30px;display:inline-flex;align-items:center;padding:0 11px;border:1px solid #dfe2de;border-radius:6px;color:#202320;background:#fff;font-size:9.5px;font-weight:620}.hj-experience-v27 .hj31-side-card>a:hover{border-color:#cbd0ca;background:#f9faf9}
.hj-experience-v27 .hj31-explore-card{min-height:45px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 15px;border:1px solid var(--hj31-line);border-radius:10px;color:#535853;background:rgba(255,255,255,.72);font-size:10.5px;font-weight:610}.hj-experience-v27 .hj31-explore-card:hover{color:#171a17;border-color:#d2d6d1;background:#fff}.hj-experience-v27 .hj31-explore-card svg{width:14px;height:14px}

@media(max-width:1180px){
  .hj-experience-v27 .hj31-layout{grid-template-columns:minmax(0,1fr) 252px;gap:14px}
  .hj-experience-v27 .hj31-resource-row{grid-template-columns:34px minmax(130px,1fr) 38px auto}.hj-experience-v27 .hj31-resource-state{display:none}
  .hj-experience-v27 .hj31-resource-actions a{padding-inline:8px}
}
@media(max-width:980px){
  .hj-experience-v27 .hj31-layout{grid-template-columns:1fr}
  .hj-experience-v27 .hj31-side-column{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hj-experience-v27 .hj31-manage-card{grid-column:1 / -1}
  .hj-experience-v27 .hj31-product-list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:8px}
  .hj-experience-v27 .hj31-manage-card>footer{grid-column:1/-1}
  .hj-experience-v27 .hj31-explore-card{grid-column:1/-1}
}
@media(max-width:760px){
  .hj-experience-v27 .hj31-dashboard{padding:18px 14px 32px}
  .hj-experience-v27 .hj31-welcome{align-items:flex-start;flex-direction:column;gap:15px;padding-bottom:18px}
  .hj-experience-v27 .hj31-welcome-actions{width:100%;justify-content:flex-start}.hj-experience-v27 .hj31-welcome-actions .hj31-button{flex:1}
  .hj-experience-v27 .hj31-feed-grid{grid-template-columns:1fr}
  .hj-experience-v27 .hj31-feed-card{min-height:300px}
  .hj-experience-v27 .hj31-resource-row{grid-template-columns:32px minmax(0,1fr) auto;gap:9px}
  .hj-experience-v27 .hj31-resource-service,.hj-experience-v27 .hj31-resource-state{display:none}
  .hj-experience-v27 .hj31-resource-actions a:first-child{display:none}
  .hj-experience-v27 .hj31-side-column{grid-template-columns:1fr}
  .hj-experience-v27 .hj31-manage-card,.hj-experience-v27 .hj31-explore-card{grid-column:auto}
}
@media(max-width:520px){
  .hj-experience-v27 .hj31-dashboard{margin-left:-14px;margin-right:-14px;padding-left:11px;padding-right:11px}
  .hj-experience-v27 .hj31-welcome h1{font-size:29px}
  .hj-experience-v27 .hj31-welcome p{font-size:11px}
  .hj-experience-v27 .hj31-button{min-height:37px;padding-inline:11px;font-size:10.5px}
  .hj-experience-v27 .hj31-tabs{padding-inline:6px}.hj-experience-v27 .hj31-tabs a{padding-inline:10px}
  .hj-experience-v27 .hj31-card-heading{padding:15px 13px 12px}.hj-experience-v27 .hj31-card-heading p{display:none}
  .hj-experience-v27 .hj31-resource-list{padding:0 9px 9px;gap:7px}
  .hj-experience-v27 .hj31-resource-row{min-height:58px;padding:8px}
  .hj-experience-v27 .hj31-resource-copy strong{font-size:10.8px}.hj-experience-v27 .hj31-resource-copy small{font-size:9px}
  .hj-experience-v27 .hj31-resource-actions a{min-height:28px;padding:0 8px}
  .hj-experience-v27 .hj31-product-list{grid-template-columns:1fr}
  .hj-experience-v27 .hj31-empty-state{grid-template-columns:38px minmax(0,1fr);margin:0 9px 9px;padding:16px}.hj-experience-v27 .hj31-empty-state .hj31-button{grid-column:1/-1}
}

.hj-experience-v27[data-hj-theme="dark"] .hj31-dashboard{
  --hj31-bg:#111412;
  --hj31-card:#171b18;
  --hj31-text:#eef2ee;
  --hj31-muted:#989f99;
  --hj31-line:#2a2f2b;
  --hj31-line-strong:#353b36;
  --hj31-accent:#c8f238;
  --hj31-green:#d7ff49;
  color:var(--hj31-text);
  background:var(--hj31-bg);
}
.hj-experience-v27[data-hj-theme="dark"] .hj31-welcome h1,
.hj-experience-v27[data-hj-theme="dark"] .hj31-card-heading h2,
.hj-experience-v27[data-hj-theme="dark"] .hj31-feed-heading h2,
.hj-experience-v27[data-hj-theme="dark"] .hj31-manage-card h2,
.hj-experience-v27[data-hj-theme="dark"] .hj31-side-card h2{color:#f2f5f2}
.hj-experience-v27[data-hj-theme="dark"] .hj31-card,
.hj-experience-v27[data-hj-theme="dark"] .hj31-resource-row,
.hj-experience-v27[data-hj-theme="dark"] .hj31-product-search{background:var(--hj31-card)}
.hj-experience-v27[data-hj-theme="dark"] .hj31-button{color:#e7ebe7;background:#1b201c;border-color:#363c37}
.hj-experience-v27[data-hj-theme="dark"] .hj31-button.is-primary{color:#152017;background:#d7ff49;border-color:#d7ff49}
.hj-experience-v27[data-hj-theme="dark"] .hj31-resource-row:hover,
.hj-experience-v27[data-hj-theme="dark"] .hj31-feed-list>a:hover,
.hj-experience-v27[data-hj-theme="dark"] .hj31-activity-timeline>a:hover,
.hj-experience-v27[data-hj-theme="dark"] .hj31-product-list>a:hover{background:#1d221e}
.hj-experience-v27[data-hj-theme="dark"] .hj31-tabs a,
.hj-experience-v27[data-hj-theme="dark"] .hj31-card-heading>a,
.hj-experience-v27[data-hj-theme="dark"] .hj31-feed-card>footer a,
.hj-experience-v27[data-hj-theme="dark"] .hj31-manage-card>footer a{color:#dce1dc}
.hj-experience-v27[data-hj-theme="dark"] .hj31-resource-copy strong,
.hj-experience-v27[data-hj-theme="dark"] .hj31-feed-list strong,
.hj-experience-v27[data-hj-theme="dark"] .hj31-activity-timeline strong,
.hj-experience-v27[data-hj-theme="dark"] .hj31-product-list>a{color:#eef2ee}
.hj-experience-v27[data-hj-theme="dark"] .hj31-resource-actions a,
.hj-experience-v27[data-hj-theme="dark"] .hj31-side-card>a{color:#e5e9e5;background:#1b201c;border-color:#343a35}
.hj-experience-v27[data-hj-theme="dark"] .hj31-resource-actions a.is-primary{color:#132016;background:#d7ff49;border-color:#d7ff49}
.hj-experience-v27[data-hj-theme="dark"] .hj31-explore-card{color:#bec5bf;background:#171b18}

/* --------------------------------------------------------------------------
   HostingJet 0.27.7 — single-screen customer command centre
   Dashboard-only rebuild. Global HALO header and sidebar remain untouched.
   -------------------------------------------------------------------------- */
.hj32-dashboard,
.hj32-dashboard * { box-sizing:border-box; }
.hj32-dashboard {
  --hj32-ink:#171719;
  --hj32-muted:#73757a;
  --hj32-subtle:#929399;
  --hj32-line:#e5e5e7;
  --hj32-line-strong:#d6d6d9;
  --hj32-soft:#f6f6f7;
  --hj32-soft-2:#fafafa;
  --hj32-surface:#fff;
  --hj32-primary:#171719;
  --hj32-primary-hover:#000;
  --hj32-success:#16794b;
  --hj32-success-soft:#edf8f2;
  --hj32-warning:#9a6209;
  --hj32-warning-soft:#fff7e6;
  --hj32-danger:#b13c3c;
  --hj32-radius:12px;
  --hj32-radius-sm:9px;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  gap:12px;
  min-height:calc(100dvh - var(--halo-header-height,64px) - 24px);
  padding-top:16px;
  color:var(--hj32-ink);
  font-family:inherit;
}
.hj32-dashboard [hidden] { display:none !important; }
.hj32-inline-notice {
  position:fixed;
  z-index:1006;
  top:72px;
  right:20px;
  display:flex;
  align-items:center;
  gap:8px;
  max-width:420px;
  min-height:40px;
  padding:9px 12px;
  border:1px solid #bfe2cf;
  border-radius:10px;
  background:#f0faf5;
  box-shadow:0 14px 34px rgba(0,0,0,.12);
  color:#17633f;
  font-size:12px;
  font-weight:600;
}
.hj32-inline-notice.is-error { border-color:#efc8c8; background:#fff4f4; color:#a43636; }
.hj32-inline-notice svg { width:16px; height:16px; flex:0 0 auto; }

/* One visual system: neutral canvas, monochrome actions, semantic colour only. */
.hj32-topbar {
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:0 1px;
}
.hj32-page-intro { min-width:0; }
.hj32-topbar h1 {
  max-width:min(760px,72vw);
  margin:3px 0 4px;
  overflow:hidden;
  color:var(--hj32-ink);
  font-size:clamp(24px,1.75vw,30px);
  font-weight:610;
  letter-spacing:-.038em;
  line-height:1.1;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hj32-topbar p { margin:0; color:var(--hj32-muted); font-size:12.5px; line-height:1.45; }
.hj32-eyebrow,
.hj32-panel-heading span,
.hj32-feed-card header span,
.hj32-health-card header span,
.hj32-attention-card header span,
.hj32-shortcuts-card header>span,
.hj32-modal-header span,
.hj32-dns-form header span,
.hj32-existing-dns header span {
  display:block;
  color:#85868b;
  font-size:9.5px;
  font-weight:700;
  letter-spacing:.105em;
  line-height:1.2;
  text-transform:uppercase;
}
.hj32-top-actions { display:flex; align-items:center; gap:8px; flex:0 0 auto; }
.hj32-button {
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:0 12px;
  border:1px solid var(--hj32-line-strong);
  border-radius:9px;
  background:var(--hj32-surface);
  color:var(--hj32-ink);
  box-shadow:none;
  font:inherit;
  font-size:11.5px;
  font-weight:620;
  line-height:1;
  text-decoration:none;
  cursor:pointer;
  transition:background-color .14s ease,border-color .14s ease,color .14s ease;
}
.hj32-button:hover { border-color:#bfc0c4; background:#f8f8f8; transform:none; box-shadow:none; }
.hj32-button:focus-visible,
.hj32-product-tabs button:focus-visible,
.hj32-row-actions a:focus-visible,
.hj32-row-actions button:focus-visible,
.hj32-shortcut-grid>a:focus-visible,
.hj32-shortcuts-footer>a:focus-visible { outline:2px solid #18181a; outline-offset:2px; }
.hj32-button svg { width:15px; height:15px; }
.hj32-button kbd { display:none; }
.hj32-button.is-primary { border-color:var(--hj32-primary); background:var(--hj32-primary); color:#fff; box-shadow:none; }
.hj32-button.is-primary:hover { border-color:var(--hj32-primary-hover); background:var(--hj32-primary-hover); }
.hj32-button.is-quiet { background:var(--hj32-surface); }

.hj32-layout {
  min-height:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 278px;
  gap:12px;
  align-items:start;
}
.hj32-main-column {
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:fit-content(420px) 178px;
  gap:12px;
}
.hj32-side-column {
  min-width:0;
  min-height:0;
  display:grid;
  grid-template-rows:auto auto auto;
  gap:10px;
}
.hj32-card {
  min-width:0;
  overflow:hidden;
  border:1px solid var(--hj32-line);
  border-radius:var(--hj32-radius);
  background:var(--hj32-surface);
  box-shadow:none;
}
.hj32-product-workspace { min-height:0; display:flex; flex-direction:column; }

.hj32-product-tabs {
  min-height:48px;
  display:flex;
  align-items:center;
  gap:2px;
  padding:0 10px;
  overflow-x:auto;
  border-bottom:1px solid var(--hj32-line);
  background:var(--hj32-surface);
  scrollbar-width:none;
}
.hj32-product-tabs::-webkit-scrollbar { display:none; }
.hj32-product-tabs button {
  position:relative;
  min-width:max-content;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 10px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#696a70;
  font:inherit;
  font-size:11.5px;
  font-weight:560;
  cursor:pointer;
  transition:background-color .14s ease,color .14s ease;
}
.hj32-product-tabs button::after { content:none; }
.hj32-product-tabs button:hover { background:#f5f5f6; color:var(--hj32-ink); }
.hj32-product-tabs button.is-active { background:#f0f0f1; color:var(--hj32-ink); font-weight:660; }
.hj32-product-tabs svg { width:15px; height:15px; }
.hj32-product-tabs b {
  min-width:18px;
  height:18px;
  display:grid;
  place-items:center;
  padding:0 5px;
  border-radius:99px;
  background:#e4e4e6;
  color:#5f6065;
  font-size:9.5px;
  font-weight:650;
}
.hj32-product-tabs button.is-active b { background:#19191b; color:#fff; }
.hj32-product-panel { min-height:0; flex:1; display:flex; flex-direction:column; padding:14px 16px 15px; }
.hj32-panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:11px; }
.hj32-panel-heading h2 { margin:3px 0 2px; color:var(--hj32-ink); font-size:15.5px; font-weight:640; letter-spacing:-.022em; line-height:1.25; }
.hj32-panel-heading p { margin:0; color:var(--hj32-muted); font-size:11px; line-height:1.4; }
.hj32-panel-heading>a {
  min-height:28px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  margin-top:1px;
  padding:0 2px;
  color:#57585d;
  font-size:10.5px;
  font-weight:620;
  text-decoration:none;
  white-space:nowrap;
}
.hj32-panel-heading>a:hover { color:#111; }
.hj32-panel-heading>a svg { width:13px; height:13px; }

.hj32-resource-list { min-height:0; display:flex; flex-direction:column; gap:7px; }
.hj32-resource-row {
  min-height:54px;
  display:grid;
  grid-template-columns:32px minmax(0,1fr) auto auto;
  align-items:center;
  gap:10px;
  padding:7px 9px;
  border:1px solid #e8e8ea;
  border-radius:10px;
  background:#fff;
  box-shadow:none;
  transition:background-color .14s ease,border-color .14s ease;
}
.hj32-resource-row:hover { border-color:#d5d5d8; background:#fcfcfc; box-shadow:none; transform:none; }
.hj32-resource-icon { width:32px; height:32px; display:grid; place-items:center; border-radius:8px; background:#f2f2f3; color:#55565a; }
.hj32-resource-icon svg { width:16px; height:16px; }
.hj32-resource-copy { min-width:0; display:flex; flex-direction:column; gap:2px; }
.hj32-resource-copy strong { overflow:hidden; color:#1c1c1e; font-size:12px; font-weight:640; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.hj32-resource-copy small { overflow:hidden; color:#7d7e83; font-size:10px; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
.hj32-status {
  min-width:max-content;
  min-height:23px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:0 8px;
  border-radius:99px;
  background:#f1f1f2;
  color:#6c6d72;
  font-size:9.5px;
  font-style:normal;
  font-weight:650;
}
.hj32-status i { width:5px; height:5px; border-radius:50%; background:#a7a8ad; box-shadow:none; }
.hj32-status.is-good { background:var(--hj32-success-soft); color:var(--hj32-success); }
.hj32-status.is-good i { background:#29ad69; box-shadow:none; }
.hj32-status.is-warning { background:var(--hj32-warning-soft); color:var(--hj32-warning); }
.hj32-status.is-warning i { background:#d8921a; box-shadow:none; }
.hj32-row-actions { display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.hj32-row-actions a,
.hj32-row-actions button {
  min-height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 10px;
  border:1px solid #dcdcdf;
  border-radius:8px;
  background:#fff;
  color:#2f3033;
  font:inherit;
  font-size:10.5px;
  font-weight:620;
  text-decoration:none;
  white-space:nowrap;
  cursor:pointer;
  transition:background-color .14s ease,border-color .14s ease;
}
.hj32-row-actions a:hover,.hj32-row-actions button:hover { border-color:#c2c2c6; background:#f7f7f8; }
.hj32-row-actions .is-primary { border-color:#19191b; background:#19191b; color:#fff; }
.hj32-row-actions .is-primary:hover { border-color:#000; background:#000; }

.hj32-empty {
  min-height:146px;
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:18px;
  border:1px dashed #d8d8db;
  border-radius:10px;
  background:#fafafa;
  text-align:left;
}
.hj32-empty>span { width:36px; height:36px; display:grid; place-items:center; border-radius:9px; background:#eeeeef; color:#5c5d61; }
.hj32-empty svg { width:18px; height:18px; }
.hj32-empty div { max-width:360px; }
.hj32-empty strong { display:block; margin-bottom:2px; font-size:12px; font-weight:650; }
.hj32-empty p { margin:0; color:var(--hj32-muted); font-size:10.5px; line-height:1.4; }
.hj32-empty>a { min-height:31px; display:inline-flex; align-items:center; padding:0 10px; border-radius:8px; background:#19191b; color:#fff; font-size:10.5px; font-weight:620; text-decoration:none; }

.hj32-feed-grid { min-height:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.hj32-feed-card { min-height:0; display:flex; flex-direction:column; }
.hj32-feed-card>header { min-height:49px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 13px 8px; border-bottom:1px solid #ededee; }
.hj32-feed-card h2 { margin:2px 0 0; font-size:13px; font-weight:640; letter-spacing:-.018em; line-height:1.2; }
.hj32-feed-card>header>a { color:#6d6e73; font-size:10px; font-weight:620; text-decoration:none; }
.hj32-feed-card>header>a:hover { color:#111; }
.hj32-feed-list { min-height:0; flex:1; display:flex; flex-direction:column; padding:3px 9px 5px; }
.hj32-feed-list>a { min-height:40px; display:grid; grid-template-columns:28px minmax(0,1fr); align-items:center; gap:8px; padding:4px 3px; border-bottom:1px solid #f0f0f1; color:inherit; text-decoration:none; }
.hj32-feed-list>a:last-child { border-bottom:0; }
.hj32-feed-list>a:hover strong { color:#000; }
.hj32-feed-list>a>span { position:relative; width:28px; height:28px; display:grid; place-items:center; border-radius:8px; background:#f1f1f2; color:#5f6065; }
.hj32-feed-list>a>span svg { width:13px; height:13px; }
.hj32-feed-list>a>span i { position:absolute; top:4px; right:4px; width:5px; height:5px; border:1px solid #fff; border-radius:50%; background:#28b56a; }
.hj32-feed-list strong { display:block; overflow:hidden; color:#2a2a2d; font-size:10.5px; font-weight:620; line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }
.hj32-feed-list small { display:block; margin-top:1px; color:#8b8c91; font-size:9.3px; line-height:1.2; }
.hj32-feed-empty { flex:1; display:flex; align-items:center; justify-content:center; gap:10px; padding:16px; }
.hj32-feed-empty>span { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:#f1f1f2; color:#626368; }
.hj32-feed-empty svg { width:16px; height:16px; }
.hj32-feed-empty strong { display:block; font-size:11px; font-weight:630; }
.hj32-feed-empty p { margin:2px 0 0; color:#85868b; font-size:9.7px; }

.hj32-health-card,.hj32-attention-card,.hj32-shortcuts-card { padding:13px; }
.hj32-health-card>header,.hj32-attention-card>header { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.hj32-health-card h2,.hj32-attention-card h2,.hj32-shortcuts-card h2 { margin:2px 0 0; font-size:13.5px; font-weight:650; letter-spacing:-.018em; line-height:1.22; }
.hj32-health-card>header>strong { color:#222225; font-size:24px; font-weight:610; letter-spacing:-.045em; line-height:1; }
.hj32-health-card>header>strong small { font-size:10px; }
.hj32-health-track { height:5px; margin:11px 0 10px; overflow:hidden; border-radius:99px; background:#ececee; }
.hj32-health-track i { display:block; height:100%; border-radius:99px; background:#202022; }
.hj32-health-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.hj32-health-stats div { padding:7px; border:1px solid #ececee; border-radius:8px; background:#fafafa; }
.hj32-health-stats span { display:block; color:#88898e; font-size:8.7px; }
.hj32-health-stats strong { display:block; margin-top:2px; color:#2c2c2f; font-size:10.5px; font-weight:670; }
.hj32-attention-card>header>b { min-width:21px; height:21px; display:grid; place-items:center; border-radius:99px; background:var(--hj32-warning-soft); color:var(--hj32-warning); font-size:9.5px; }
.hj32-attention-list { margin-top:8px; }
.hj32-attention-list>a { min-height:41px; display:grid; grid-template-columns:28px minmax(0,1fr) 13px; align-items:center; gap:8px; padding:5px 0; border-top:1px solid #ededee; color:inherit; text-decoration:none; }
.hj32-attention-list>a>span { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; background:#f1f1f2; color:#626368; }
.hj32-attention-list>a>span.is-warning { background:var(--hj32-warning-soft); color:var(--hj32-warning); }
.hj32-attention-list>a>span.is-good { background:var(--hj32-success-soft); color:var(--hj32-success); }
.hj32-attention-list svg { width:13px; height:13px; }
.hj32-attention-list>a>svg { color:#a2a3a7; }
.hj32-attention-list strong { display:block; color:#303033; font-size:10.2px; font-weight:620; line-height:1.25; }
.hj32-attention-list small { display:block; margin-top:1px; color:#8c8d92; font-size:9.2px; line-height:1.2; }

.hj32-shortcuts-card { min-height:0; display:flex; flex-direction:column; }
.hj32-shortcuts-card>header { margin-bottom:8px; }
.hj32-shortcut-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.hj32-shortcut-grid>a { min-width:0; display:flex; align-items:center; gap:7px; padding:8px; border:1px solid #ececee; border-radius:8px; color:inherit; text-decoration:none; transition:background-color .14s ease,border-color .14s ease; }
.hj32-shortcut-grid>a:hover { border-color:#d2d2d5; background:#fafafa; }
.hj32-shortcut-grid>a>svg { width:15px; height:15px; flex:0 0 auto; color:#5e5f64; }
.hj32-shortcuts-card strong { display:block; color:#303033; font-size:10.2px; font-weight:640; }
.hj32-shortcuts-card small { display:block; margin-top:1px; color:#909196; font-size:8.6px; }
.hj32-shortcuts-footer { margin-top:10px; padding-top:10px; display:flex; align-items:center; justify-content:space-between; gap:10px; border-top:1px solid #ededee; }
.hj32-shortcuts-footer>span { min-width:0; display:flex; align-items:center; gap:8px; }
.hj32-shortcuts-footer>span>svg { width:16px; height:16px; flex:0 0 auto; color:#626368; }
.hj32-shortcuts-footer>a { display:inline-flex; align-items:center; gap:5px; color:#333337; font-size:9.7px; font-weight:640; text-decoration:none; white-space:nowrap; }
.hj32-shortcuts-footer>a:hover { color:#000; }
.hj32-shortcuts-footer>a svg { width:12px; height:12px; }

/* Domain settings modal — same tokens and interaction language as the dashboard. */
body.hj32-modal-open { overflow:hidden; }
.hj32-modal-shell { position:fixed; z-index:1005; inset:0; display:grid; place-items:center; padding:22px; }
.hj32-modal-backdrop { position:absolute; inset:0; border:0; background:rgba(12,12,13,.5); backdrop-filter:blur(6px); cursor:default; }
.hj32-domain-modal { position:relative; z-index:1; width:min(880px,calc(100vw - 34px)); max-height:min(740px,calc(100dvh - 34px)); display:flex; flex-direction:column; overflow:hidden; border:1px solid #dedee1; border-radius:14px; background:#fff; box-shadow:0 28px 72px rgba(0,0,0,.24); }
.hj32-modal-header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:17px 18px 14px; border-bottom:1px solid var(--hj32-line); }
.hj32-modal-header h2 { margin:3px 0 2px; color:#1b1b1d; font-size:19px; font-weight:640; letter-spacing:-.03em; line-height:1.2; }
.hj32-modal-header p { margin:0; color:#75767b; font-size:10.5px; }
.hj32-modal-header>button { width:32px; height:32px; display:grid; place-items:center; border:1px solid #dfdfe2; border-radius:8px; background:#fff; color:#626368; cursor:pointer; }
.hj32-modal-header>button:hover { background:#f5f5f6; }
.hj32-modal-header>button svg { width:15px; height:15px; }
.hj32-modal-tabs { min-height:44px; display:flex; align-items:center; gap:4px; padding:0 16px; border-bottom:1px solid #e7e7e9; background:#fafafa; }
.hj32-modal-tabs button { min-height:30px; padding:0 11px; border:0; border-radius:8px; background:transparent; color:#74757a; font:inherit; font-size:11px; font-weight:610; cursor:pointer; }
.hj32-modal-tabs button::after { content:none; }
.hj32-modal-tabs button:hover { background:#f0f0f1; color:#29292c; }
.hj32-modal-tabs button.is-active { background:#1b1b1d; color:#fff; }
.hj32-modal-panel { min-height:0; flex:1; overflow:auto; padding:16px 18px 0; background:#fff; }
.hj32-nameserver-form { min-height:100%; display:flex; flex-direction:column; }
.hj32-choice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.hj32-choice-card { position:relative; min-height:82px; display:grid; grid-template-columns:32px minmax(0,1fr); align-items:center; gap:10px; padding:11px; border:1px solid #e2e2e4; border-radius:10px; background:#fff; cursor:pointer; transition:background-color .14s ease,border-color .14s ease; }
.hj32-choice-card:hover { border-color:#c7c7ca; }
.hj32-choice-card.is-selected { border-color:#1d1d1f; background:#f7f7f8; box-shadow:none; }
.hj32-choice-card input { position:absolute; opacity:0; pointer-events:none; }
.hj32-choice-card>span { width:32px; height:32px; display:grid; place-items:center; border-radius:8px; background:#efeff0; color:#5d5e63; }
.hj32-choice-card>span svg { width:16px; height:16px; }
.hj32-choice-card strong { display:block; color:#29292c; font-size:11.5px; font-weight:640; }
.hj32-choice-card small { display:block; margin-top:2px; color:#78797e; font-size:9.7px; line-height:1.35; }
.hj32-choice-card em { position:absolute; top:9px; right:9px; padding:3px 6px; border-radius:99px; background:#1d1d1f; color:#fff; font-size:7.8px; font-style:normal; font-weight:700; letter-spacing:.035em; text-transform:uppercase; }
.hj32-default-ns,.hj32-custom-ns { margin-top:12px; padding:12px; border:1px solid #e5e5e7; border-radius:10px; background:#fafafa; }
.hj32-default-ns>header,.hj32-custom-ns>header { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:8px; }
.hj32-default-ns>header strong,.hj32-custom-ns>header strong { display:block; color:#2e2e31; font-size:11px; font-weight:640; }
.hj32-default-ns>header small,.hj32-custom-ns>header small { display:block; margin-top:2px; color:#818287; font-size:9.3px; }
.hj32-default-ns>header>span { display:inline-flex; align-items:center; gap:5px; color:var(--hj32-success); font-size:9.3px; font-weight:650; }
.hj32-default-ns>header>span svg { width:12px; height:12px; }
.hj32-default-ns>div:not(header) { min-height:38px; display:grid; grid-template-columns:34px minmax(0,1fr) 28px; align-items:center; gap:8px; padding:4px 6px; border-top:1px solid #e7e7e9; }
.hj32-default-ns b { color:#808187; font-size:8.8px; }
.hj32-default-ns code { overflow:hidden; color:#333337; font-family:"JetBrains Mono",monospace; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.hj32-default-ns button { width:28px; height:28px; display:grid; place-items:center; border:0; border-radius:7px; background:transparent; color:#74757a; cursor:pointer; }
.hj32-default-ns button:hover { background:#ededee; }
.hj32-default-ns button svg { width:13px; height:13px; }
.hj32-custom-ns>header>button { display:inline-flex; align-items:center; gap:5px; padding:0; border:0; background:none; color:#333337; font:inherit; font-size:9.7px; font-weight:650; cursor:pointer; }
.hj32-custom-ns>header>button:hover { color:#000; }
.hj32-custom-ns>header>button svg { width:12px; height:12px; }
.hj32-ns-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.hj32-ns-fields label>span { display:block; margin-bottom:5px; color:#727378; font-size:9.3px; font-weight:620; }
.hj32-ns-fields label>div { display:grid; grid-template-columns:minmax(0,1fr) 31px; overflow:hidden; border:1px solid #dbdbde; border-radius:8px; background:#fff; }
.hj32-ns-fields label>div:focus-within { border-color:#18181a; box-shadow:0 0 0 3px rgba(24,24,26,.08); }
.hj32-ns-fields input { min-width:0; height:36px; padding:0 9px; border:0; outline:0; background:transparent; color:#29292c; font:inherit; font-size:10.5px; }
.hj32-ns-fields button { width:31px; border:0; border-left:1px solid #e8e8ea; background:#fff; color:#8a8b90; cursor:pointer; }
.hj32-ns-fields button:hover { background:#fff2f2; color:#b13c3c; }
.hj32-ns-fields button svg { width:12px; height:12px; }
.hj32-modal-actions { position:sticky; bottom:0; min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:auto; padding:11px 0 13px; border-top:1px solid #e7e7e9; background:#fff; }
.hj32-modal-actions>span { display:flex; align-items:center; gap:6px; color:#7e7f84; font-size:9.3px; line-height:1.35; }
.hj32-modal-actions>span svg { width:13px; height:13px; flex:0 0 auto; }
.hj32-modal-actions>div { display:flex; gap:7px; }
.hj32-modal-empty { min-height:300px; display:flex; align-items:center; justify-content:center; gap:12px; text-align:left; }
.hj32-modal-empty>span { width:40px; height:40px; display:grid; place-items:center; border-radius:10px; background:#efeff0; color:#5e5f64; }
.hj32-modal-empty svg { width:19px; height:19px; }
.hj32-modal-empty strong { display:block; font-size:12px; font-weight:650; }
.hj32-modal-empty p { margin:2px 0 0; color:#7b7c81; font-size:10px; }
.hj32-modal-empty>a { min-height:32px; display:inline-flex; align-items:center; padding:0 10px; border-radius:8px; background:#1b1b1d; color:#fff; font-size:10px; font-weight:630; text-decoration:none; }
.hj32-dns-layout { display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); gap:12px; }
.hj32-dns-form,.hj32-existing-dns { min-width:0; padding:13px; border:1px solid #e3e3e5; border-radius:10px; background:#fff; }
.hj32-dns-form header h3,.hj32-existing-dns header h3 { margin:3px 0 2px; color:#2a2a2d; font-size:13px; font-weight:650; letter-spacing:-.018em; }
.hj32-dns-form header p { margin:0; color:#7c7d82; font-size:9.3px; }
.hj32-dns-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:11px 0; }
.hj32-dns-fields label { min-width:0; }
.hj32-dns-fields label.is-wide { grid-column:1/-1; }
.hj32-dns-fields label>span { display:block; margin-bottom:5px; color:#727378; font-size:9.3px; font-weight:620; }
.hj32-dns-fields input,.hj32-dns-fields select { width:100%; height:35px; padding:0 9px; border:1px solid #dbdbde; border-radius:8px; outline:0; background:#fff; color:#29292c; font:inherit; font-size:10.2px; }
.hj32-dns-fields input:focus,.hj32-dns-fields select:focus { border-color:#18181a; box-shadow:0 0 0 3px rgba(24,24,26,.08); }
.hj32-dns-form>.hj32-button { width:100%; }
.hj32-existing-dns>header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:8px; }
.hj32-existing-dns>header>a { color:#55565b; font-size:9.3px; font-weight:640; text-decoration:none; }
.hj32-dns-records { overflow:hidden; border:1px solid #e9e9eb; border-radius:8px; }
.hj32-dns-record { min-height:43px; display:grid; grid-template-columns:40px minmax(0,1fr) 44px 27px; align-items:center; gap:8px; padding:5px 7px; border-bottom:1px solid #ededee; }
.hj32-dns-record:last-child { border-bottom:0; }
.hj32-dns-record>span { min-height:21px; display:inline-grid; place-items:center; border-radius:6px; background:#efeff0; color:#44454a; font-family:"JetBrains Mono",monospace; font-size:8.7px; font-weight:700; }
.hj32-dns-record>div { min-width:0; }
.hj32-dns-record strong,.hj32-dns-record code { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hj32-dns-record strong { color:#333337; font-size:9.5px; font-weight:640; }
.hj32-dns-record code { margin-top:2px; color:#7d7e83; font-family:"JetBrains Mono",monospace; font-size:8.5px; }
.hj32-dns-record>small { color:#8d8e93; font-size:8.3px; text-align:right; }
.hj32-dns-record form button { width:27px; height:27px; display:grid; place-items:center; border:0; border-radius:7px; background:transparent; color:#8d8e93; cursor:pointer; }
.hj32-dns-record form button:hover { background:#fff0f0; color:#b53e3e; }
.hj32-dns-record form svg { width:12px; height:12px; }
.hj32-dns-error,.hj32-dns-empty { min-height:126px; display:grid; place-items:center; padding:15px; border:1px dashed #dadadd; border-radius:8px; background:#fafafa; color:#7d7e83; font-size:9.7px; line-height:1.45; text-align:center; }
.hj32-dns-form:not(.is-priority) .is-priority-field,
.hj32-dns-form:not(.is-srv) .is-srv-field { display:none; }

:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-dashboard {
  --hj32-ink:#f3f3f4;
  --hj32-muted:#a3a4a9;
  --hj32-subtle:#85868c;
  --hj32-line:#303034;
  --hj32-line-strong:#414146;
  --hj32-soft:#232326;
  --hj32-soft-2:#1e1e21;
  --hj32-surface:#19191c;
  --hj32-primary:#f2f2f3;
  --hj32-primary-hover:#fff;
}
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-card,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-product-tabs,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-product-panel,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-button,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-resource-row,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-domain-modal,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-modal-panel,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-modal-actions,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-dns-form,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-existing-dns,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-ns-fields label>div,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-ns-fields button,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-dns-fields input,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-dns-fields select { background:#19191c; color:#f1f1f2; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-product-tabs,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-modal-tabs { background:#1d1d20; border-color:#303034; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-product-tabs button:hover,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-product-tabs button.is-active,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-resource-icon,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-feed-list>a>span,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-feed-empty>span,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-default-ns,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-custom-ns,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-health-stats div,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-shortcut-grid>a,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-choice-card { background:#232326; border-color:#35353a; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-choice-card.is-selected { background:#28282c; border-color:#f0f0f2; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-button.is-primary,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-row-actions .is-primary,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-modal-tabs button.is-active { border-color:#f2f2f3; background:#f2f2f3; color:#171719; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-resource-copy strong,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-feed-list strong,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-health-stats strong,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-shortcuts-card strong,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-default-ns code,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-choice-card strong,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-dns-form header h3,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-existing-dns header h3,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj32-dns-record strong { color:#f1f1f2; }

@media (max-width:1180px) {
  .hj32-layout { grid-template-columns:minmax(0,1fr) 256px; }
  .hj32-topbar p { max-width:560px; }
  .hj32-resource-row { grid-template-columns:32px minmax(0,1fr) auto; }
  .hj32-status { display:none; }
}
@media (max-width:960px) {
  .hj32-dashboard { min-height:auto; }
  .hj32-layout { grid-template-columns:1fr; }
  .hj32-main-column { grid-template-rows:auto auto; }
  .hj32-side-column { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:auto; }
  .hj32-shortcuts-card { grid-column:1/-1; }
}
@media (max-width:720px) {
  .hj32-dashboard { gap:10px; padding-top:12px; }
  .hj32-topbar { min-height:0; align-items:flex-start; flex-direction:column; gap:11px; }
  .hj32-topbar h1 { max-width:100%; font-size:24px; white-space:normal; }
  .hj32-top-actions { width:100%; }
  .hj32-top-actions .hj32-button { flex:1; }
  .hj32-feed-grid,.hj32-side-column,.hj32-choice-grid,.hj32-dns-layout { grid-template-columns:1fr; }
  .hj32-product-tabs { padding:0 6px; }
  .hj32-product-tabs button { padding:0 9px; }
  .hj32-product-tabs button span { display:none; }
  .hj32-product-panel { padding:12px; }
  .hj32-panel-heading { align-items:flex-start; }
  .hj32-panel-heading p { display:none; }
  .hj32-resource-row { grid-template-columns:31px minmax(0,1fr); gap:9px; }
  .hj32-resource-icon { width:31px; height:31px; }
  .hj32-row-actions { grid-column:1/-1; justify-content:flex-end; padding-top:2px; }
  .hj32-row-actions a,.hj32-row-actions button { flex:1; }
  .hj32-modal-shell { padding:0; place-items:end center; }
  .hj32-domain-modal { width:100%; max-height:92dvh; border-radius:14px 14px 0 0; }
  .hj32-modal-header { padding:15px 15px 12px; }
  .hj32-modal-tabs { padding:0 12px; }
  .hj32-modal-panel { padding:13px 13px 0; }
  .hj32-ns-fields { grid-template-columns:1fr; }
  .hj32-modal-actions { align-items:flex-start; flex-direction:column; }
  .hj32-modal-actions>div { width:100%; }
  .hj32-modal-actions .hj32-button { flex:1; }
}

/* ========================================================================
   HostingJet 0.27.10 — precision customer workspace
   One design system: calm neutral canvas, crisp white surfaces, charcoal
   actions and a restrained lime focus accent. The global HALO sidebar and
   header are intentionally untouched.
   ======================================================================== */
.hj33-dashboard {
  --hj33-canvas:#f5f6f4;
  --hj33-surface:#ffffff;
  --hj33-surface-soft:#f7f8f6;
  --hj33-surface-quiet:#fafbf9;
  --hj33-line:#e5e8e4;
  --hj33-line-strong:#d7dcd7;
  --hj33-ink:#171a18;
  --hj33-muted:#6f756f;
  --hj33-subtle:#929992;
  --hj33-accent:#c9f24a;
  --hj33-primary:#122d25;
  --hj33-primary-hover:#0c241d;
  --hj33-good:#18a865;
  --hj33-warning:#c87c16;
  --hj33-danger:#d84c4c;
  --hj33-radius:13px;
  --hj33-control-radius:9px;
  width:100%;
  max-width:1440px;
  margin:0 auto;
  padding:17px 0 26px;
  display:flex;
  flex-direction:column;
  gap:15px;
  color:var(--hj33-ink);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.hj33-dashboard *,
.hj33-dashboard *::before,
.hj33-dashboard *::after { box-sizing:border-box; }
.hj33-dashboard a { color:inherit; text-decoration:none; }
.hj33-dashboard button,
.hj33-dashboard input,
.hj33-dashboard select { font:inherit; }
.hj33-dashboard svg { width:16px; height:16px; flex:0 0 auto; stroke-width:1.75; }
.hj33-dashboard [hidden] { display:none !important; }

.hj33-kicker {
  display:block;
  margin:0 0 5px;
  color:#7e857f;
  font-size:9.5px;
  font-weight:720;
  line-height:1.1;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.hj33-welcome {
  min-height:76px;
  padding:1px 1px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.hj33-welcome-copy { min-width:0; }
.hj33-welcome h1 {
  max-width:900px;
  margin:0;
  overflow:hidden;
  color:var(--hj33-ink);
  font-size:clamp(28px,2vw,35px);
  font-weight:520;
  line-height:1.08;
  letter-spacing:-.042em;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hj33-welcome p {
  margin:7px 0 0;
  color:var(--hj33-muted);
  font-size:13px;
  line-height:1.42;
}
.hj33-welcome-actions { display:flex; align-items:center; gap:8px; flex:0 0 auto; }

.hj33-button,
.hj33-row-actions a,
.hj33-row-actions button {
  min-height:35px;
  padding:0 13px;
  border:1px solid var(--hj33-line-strong);
  border-radius:var(--hj33-control-radius);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  background:var(--hj33-surface);
  color:#343a36;
  box-shadow:0 1px 1px rgba(19,25,21,.035);
  font-size:11.5px;
  font-weight:630;
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  transition:border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease,transform .1s ease;
}
.hj33-button:hover,
.hj33-row-actions a:hover,
.hj33-row-actions button:hover {
  border-color:#c6ccc7;
  background:#f8f9f7;
  box-shadow:0 2px 7px rgba(20,27,22,.055);
}
.hj33-button:active,
.hj33-row-actions a:active,
.hj33-row-actions button:active { transform:translateY(1px); }
.hj33-button:focus-visible,
.hj33-row-actions a:focus-visible,
.hj33-row-actions button:focus-visible,
.hj33-product-tabs button:focus-visible,
.hj33-card-tools button:focus-visible,
.hj33-product-search:focus-within {
  outline:3px solid rgba(201,242,74,.32);
  outline-offset:1px;
}
.hj33-button.is-primary,
.hj33-row-actions .is-primary {
  border-color:var(--hj33-primary);
  background:var(--hj33-primary);
  color:#fff;
  box-shadow:0 2px 7px rgba(18,45,37,.16);
}
.hj33-button.is-primary:hover,
.hj33-row-actions .is-primary:hover {
  border-color:var(--hj33-primary-hover);
  background:var(--hj33-primary-hover);
  box-shadow:0 4px 12px rgba(18,45,37,.2);
}
.hj33-button.is-secondary { background:var(--hj33-surface); }

.hj33-layout {
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) 318px;
  gap:15px;
  align-items:start;
}
.hj33-primary-column { min-width:0; display:grid; gap:15px; }
.hj33-side-column { min-width:0; display:grid; gap:12px; align-content:start; }
.hj33-card {
  min-width:0;
  border:1px solid var(--hj33-line);
  border-radius:var(--hj33-radius);
  background:var(--hj33-surface);
  box-shadow:0 1px 2px rgba(18,24,20,.025),0 12px 32px rgba(20,28,22,.035);
}

.hj33-workspace-card { overflow:hidden; }
.hj33-product-tabs {
  height:52px;
  padding:0 11px;
  display:flex;
  align-items:stretch;
  gap:2px;
  border-bottom:1px solid var(--hj33-line);
  background:var(--hj33-surface);
}
.hj33-product-tabs button {
  position:relative;
  min-width:0;
  padding:0 13px;
  border:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  background:transparent;
  color:#747b75;
  font-size:12px;
  font-weight:520;
  cursor:pointer;
  transition:color .16s ease,background .16s ease;
}
.hj33-product-tabs button::after {
  position:absolute;
  right:11px;
  bottom:-1px;
  left:11px;
  height:2px;
  border-radius:3px 3px 0 0;
  background:transparent;
  content:"";
}
.hj33-product-tabs button:hover { color:var(--hj33-ink); background:#fafbf9; }
.hj33-product-tabs button.is-active { color:var(--hj33-ink); font-weight:660; }
.hj33-product-tabs button.is-active::after { background:var(--hj33-accent); }
.hj33-product-tabs button svg { width:15px; height:15px; }
.hj33-product-tabs button b {
  min-width:19px;
  height:19px;
  padding:0 5px;
  border:1px solid #e7eae6;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#f3f5f2;
  color:#737a74;
  font-size:9.5px;
  font-weight:700;
}
.hj33-product-tabs button.is-active b { border-color:#dfe7c3; background:#f2f7df; color:#495820; }

.hj33-product-panel { min-height:318px; padding:15px 16px 17px; }
.hj33-panel-heading {
  min-height:51px;
  margin:0 0 11px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
}
.hj33-panel-heading h2,
.hj33-card header h2,
.hj33-support-card h2 {
  margin:0;
  color:var(--hj33-ink);
  font-size:15.5px;
  font-weight:660;
  line-height:1.2;
  letter-spacing:-.022em;
}
.hj33-panel-heading p {
  margin:4px 0 0;
  color:var(--hj33-muted);
  font-size:11.5px;
  line-height:1.38;
}
.hj33-panel-heading>a,
.hj33-card-tools>a,
.hj33-products-footer {
  min-height:30px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:#303631;
  font-size:11px;
  font-weight:640;
  white-space:nowrap;
}
.hj33-panel-heading>a:hover,
.hj33-card-tools>a:hover,
.hj33-products-footer:hover { color:var(--hj33-primary); }
.hj33-panel-heading>a svg,
.hj33-card-tools>a svg,
.hj33-products-footer svg { width:13px; height:13px; }

.hj33-resource-list { display:grid; gap:8px; }
.hj33-resource-row {
  min-height:63px;
  padding:8px 10px;
  border:1px solid var(--hj33-line);
  border-radius:10px;
  display:grid;
  grid-template-columns:36px minmax(210px,1.45fr) minmax(112px,.72fr) minmax(96px,.62fr) auto auto;
  align-items:center;
  gap:11px;
  background:var(--hj33-surface);
  box-shadow:0 1px 1px rgba(19,25,21,.018);
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease,transform .16s ease;
}
.hj33-resource-list.is-services .hj33-resource-row {
  grid-template-columns:36px minmax(178px,1.3fr) repeat(3,minmax(78px,.54fr)) auto auto;
}
.hj33-resource-row:hover {
  border-color:#cfd5d0;
  background:#fff;
  box-shadow:0 4px 14px rgba(21,29,23,.055);
  transform:translateY(-1px);
}
.hj33-resource-icon,
.hj33-product-icon,
.hj33-feed-icon,
.hj33-feed-empty>span,
.hj33-support-icon,
.hj33-action-list>a>span {
  width:34px;
  height:34px;
  border-radius:9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#f1f4f1;
  color:#4f5952;
}
.hj33-resource-icon.is-domain { background:#eef8f2; color:#24764f; }
.hj33-resource-icon.is-site { background:#fff2e6; color:#cb6f1f; }
.hj33-resource-icon.is-email { background:#edf4ff; color:#3971c4; }
.hj33-resource-icon.is-ssl { background:#f2eeff; color:#6e53c0; }
.hj33-resource-copy { min-width:0; }
.hj33-resource-copy strong {
  display:block;
  overflow:hidden;
  color:var(--hj33-ink);
  font-size:12.25px;
  font-weight:660;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hj33-resource-copy small,
.hj33-row-meta span {
  display:block;
  overflow:hidden;
  color:var(--hj33-subtle);
  font-size:9.75px;
  font-weight:520;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hj33-resource-copy small { margin-top:3px; }
.hj33-row-meta { min-width:0; }
.hj33-row-meta strong {
  display:block;
  margin-top:3px;
  overflow:hidden;
  color:#424844;
  font-size:10.5px;
  font-weight:620;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hj33-status {
  min-width:61px;
  min-height:24px;
  padding:0 8px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  background:#f2f4f2;
  color:#59615b;
  font-size:9.75px;
  font-weight:680;
  white-space:nowrap;
}
.hj33-status i,
.hj33-product-links em i,
.hj33-health-pill i {
  width:5px;
  height:5px;
  border-radius:50%;
  background:currentColor;
  box-shadow:0 0 0 3px color-mix(in srgb,currentColor 13%,transparent);
}
.hj33-status.is-good { background:#edf9f2; color:#138d55; }
.hj33-status.is-warning { background:#fff5e8; color:#b87317; }
.hj33-row-actions { display:flex; justify-content:flex-end; gap:6px; }
.hj33-row-actions a,
.hj33-row-actions button { min-height:32px; padding:0 10px; font-size:10.5px; }

.hj33-empty {
  min-height:220px;
  padding:26px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:10px;
  text-align:center;
  color:var(--hj33-muted);
}
.hj33-empty>span { width:40px; height:40px; border-radius:11px; display:grid; place-items:center; background:#f2f4f2; }
.hj33-empty strong { display:block; color:var(--hj33-ink); font-size:12.5px; }
.hj33-empty p { margin:3px 0 0; font-size:11px; }

.hj33-feed-grid { min-width:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.hj33-feed-card { min-height:225px; overflow:hidden; }
.hj33-feed-card>header,
.hj33-products-card>header,
.hj33-action-card>header {
  min-height:55px;
  padding:12px 14px;
  border-bottom:1px solid var(--hj33-line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.hj33-card-tools { display:flex; align-items:center; gap:5px; }
.hj33-card-tools button {
  width:28px;
  height:28px;
  padding:0;
  border:1px solid transparent;
  border-radius:8px;
  display:grid;
  place-items:center;
  background:transparent;
  color:#777e78;
  cursor:pointer;
}
.hj33-card-tools button:hover { border-color:var(--hj33-line); background:#f7f8f6; color:var(--hj33-ink); }
.hj33-card-tools button.is-loading svg { animation:hj33-spin .8s linear infinite; }
@keyframes hj33-spin { to { transform:rotate(360deg); } }
.hj33-feed-list { display:grid; }
.hj33-feed-list>a {
  position:relative;
  min-height:56px;
  padding:9px 12px;
  border-bottom:1px solid #edf0ed;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  transition:background .16s ease;
}
.hj33-feed-list>a:last-child { border-bottom:0; }
.hj33-feed-list>a:hover { background:#fafbf9; }
.hj33-feed-list>a.is-unread { background:#fbfdf4; }
.hj33-feed-icon { position:relative; width:32px; height:32px; border-radius:9px; }
.hj33-feed-icon i { position:absolute; top:1px; right:1px; width:7px; height:7px; border:2px solid #fff; border-radius:50%; background:var(--hj33-good); }
.hj33-feed-list>a>div { min-width:0; }
.hj33-feed-list strong {
  display:block;
  overflow:hidden;
  color:#252a26;
  font-size:11px;
  font-weight:640;
  line-height:1.24;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hj33-feed-list p {
  margin:2px 0 0;
  overflow:hidden;
  color:#747b75;
  font-size:10px;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hj33-feed-list small { display:block; margin-top:2px; color:#a0a6a1; font-size:9.25px; line-height:1.1; }
.hj33-feed-list>a>svg,
.hj33-feed-arrow svg { width:13px; height:13px; color:#a1a7a2; }
.hj33-feed-list em {
  max-width:82px;
  padding:4px 7px;
  border-radius:999px;
  overflow:hidden;
  background:#f2f4f2;
  color:#6d746e;
  font-size:9px;
  font-style:normal;
  font-weight:680;
  line-height:1;
  text-overflow:ellipsis;
  text-transform:capitalize;
  white-space:nowrap;
}
.hj33-feed-list em.is-completed,
.hj33-feed-list em.is-active,
.hj33-feed-list em.is-paid,
.hj33-feed-list em.is-resolved { background:#edf9f2; color:#158c55; }
.hj33-feed-list em.is-pending,
.hj33-feed-list em.is-open,
.hj33-feed-list em.is-queued,
.hj33-feed-list em.is-overdue { background:#fff5e8; color:#ad6e16; }
.hj33-feed-empty { min-height:168px; padding:22px; display:flex; align-items:center; justify-content:center; gap:10px; text-align:left; }
.hj33-feed-empty strong { display:block; color:var(--hj33-ink); font-size:11.5px; }
.hj33-feed-empty p { margin:3px 0 0; color:var(--hj33-muted); font-size:10px; line-height:1.35; }
.hj33-feed-card[aria-busy="true"] [data-hj33-feed-items] { opacity:.55; transition:opacity .15s ease; }

.hj33-products-card { overflow:hidden; }
.hj33-products-card>header { min-height:61px; border-bottom:0; padding-bottom:8px; }
.hj33-products-card>header h2 { white-space:nowrap; }
.hj33-health-pill {
  min-height:23px;
  padding:0 7px;
  border:1px solid #e3ebe6;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  background:#f4faf6;
  color:#18794d;
  font-size:9px;
  font-weight:720;
  white-space:nowrap;
}
.hj33-product-search {
  height:36px;
  margin:0 12px 8px;
  padding:0 10px;
  border:1px solid var(--hj33-line);
  border-radius:9px;
  display:flex;
  align-items:center;
  gap:7px;
  background:#fafbf9;
  color:#89908a;
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.hj33-product-search:focus-within { border-color:#bdc5be; background:#fff; }
.hj33-product-search svg { width:14px; height:14px; }
.hj33-product-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:var(--hj33-ink); font-size:10.75px; }
.hj33-product-search input::placeholder { color:#9ba19c; }
.hj33-product-links { padding:0 7px 7px; display:grid; }
.hj33-product-links>a {
  min-height:48px;
  padding:6px 7px;
  border-radius:9px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  transition:background .16s ease;
}
.hj33-product-links>a:hover { background:#f7f8f6; }
.hj33-product-links>a[hidden] { display:none; }
.hj33-product-icon { width:32px; height:32px; border-radius:9px; }
.hj33-product-links>a>span:nth-child(2) { min-width:0; }
.hj33-product-links strong { display:block; overflow:hidden; color:#292e2a; font-size:10.75px; font-weight:660; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.hj33-product-links small { display:block; margin-top:2px; color:#969c97; font-size:9.25px; line-height:1.2; }
.hj33-product-links em { display:flex; align-items:center; gap:5px; color:#888f89; font-size:8.9px; font-style:normal; white-space:nowrap; }
.hj33-product-links em i { color:var(--hj33-good); }
.hj33-products-footer { min-height:43px; padding:0 14px; border-top:1px solid var(--hj33-line); justify-content:space-between; }

.hj33-action-card { overflow:hidden; }
.hj33-action-card>header { min-height:54px; padding-bottom:11px; }
.hj33-action-card>header b {
  min-width:22px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#fff2df;
  color:#a96713;
  font-size:9.5px;
  font-weight:720;
}
.hj33-action-list { padding:5px 7px 7px; display:grid; }
.hj33-action-list>a {
  min-height:49px;
  padding:6px 7px;
  border-radius:9px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 14px;
  align-items:center;
  gap:9px;
  transition:background .16s ease;
}
.hj33-action-list>a:hover { background:#f7f8f6; }
.hj33-action-list>a>span { width:32px; height:32px; border-radius:9px; }
.hj33-action-list>a>span.is-good { background:#eaf8f0; color:#188d58; }
.hj33-action-list>a>span.is-warning { background:#fff4e5; color:#b87717; }
.hj33-action-list strong { display:block; overflow:hidden; color:#292e2a; font-size:10.5px; font-weight:660; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.hj33-action-list small { display:block; margin-top:2px; overflow:hidden; color:#939a94; font-size:9.25px; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.hj33-action-list>a>svg { width:13px; height:13px; color:#a0a6a1; }

.hj33-support-card {
  min-height:137px;
  padding:14px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:start;
  gap:10px;
  background:linear-gradient(145deg,#fff 0%,#fbfcfa 100%);
}
.hj33-support-icon { width:36px; height:36px; }
.hj33-support-card p { margin:5px 0 10px; color:var(--hj33-muted); font-size:10px; line-height:1.4; }
.hj33-support-card .hj33-button { min-height:31px; padding:0 10px; font-size:10px; }

/* Domain settings modal: same components, same density. */
.hj33-dashboard .hj32-modal-backdrop { background:rgba(17,22,19,.48); backdrop-filter:blur(4px); }
.hj33-dashboard .hj32-domain-modal {
  border:1px solid var(--hj33-line);
  border-radius:15px;
  background:var(--hj33-surface);
  box-shadow:0 28px 80px rgba(15,22,17,.22);
}
.hj33-dashboard .hj32-modal-header,
.hj33-dashboard .hj32-modal-panel,
.hj33-dashboard .hj32-modal-actions,
.hj33-dashboard .hj32-dns-form,
.hj33-dashboard .hj32-existing-dns { background:var(--hj33-surface); }
.hj33-dashboard .hj32-modal-tabs { background:#f6f7f5; border-color:var(--hj33-line); }
.hj33-dashboard .hj32-modal-tabs button { border-radius:8px; color:var(--hj33-muted); }
.hj33-dashboard .hj32-modal-tabs button.is-active { border-color:var(--hj33-primary); background:var(--hj33-primary); color:#fff; }
.hj33-dashboard .hj32-choice-card,
.hj33-dashboard .hj32-default-ns,
.hj33-dashboard .hj32-custom-ns,
.hj33-dashboard .hj32-dns-form,
.hj33-dashboard .hj32-existing-dns,
.hj33-dashboard .hj32-dns-record { border-color:var(--hj33-line); border-radius:11px; box-shadow:none; }
.hj33-dashboard .hj32-choice-card.is-selected { border-color:#abb88d; background:#fbfdf5; box-shadow:0 0 0 2px rgba(201,242,74,.17); }
.hj33-dashboard .hj32-button,
.hj33-dashboard .hj32-ns-fields button,
.hj33-dashboard .hj32-custom-ns header button,
.hj33-dashboard .hj32-modal-empty>a {
  min-height:34px;
  border-radius:9px;
  box-shadow:none;
}
.hj33-dashboard .hj32-button.is-primary { border-color:var(--hj33-primary); background:var(--hj33-primary); color:#fff; }
.hj33-dashboard .hj32-button.is-primary:hover { background:var(--hj33-primary-hover); }
.hj33-dashboard .hj32-dns-fields input,
.hj33-dashboard .hj32-dns-fields select,
.hj33-dashboard .hj32-ns-fields label>div { border-color:var(--hj33-line); border-radius:9px; box-shadow:none; }

:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-dashboard {
  --hj33-canvas:#111315;
  --hj33-surface:#181a1c;
  --hj33-surface-soft:#1d1f21;
  --hj33-surface-quiet:#1b1d1f;
  --hj33-line:#2b2e30;
  --hj33-line-strong:#393c3f;
  --hj33-ink:#f2f4f2;
  --hj33-muted:#a2a7a3;
  --hj33-subtle:#777d78;
  --hj33-primary:#d4f85b;
  --hj33-primary-hover:#c5ed43;
  --hj33-accent:#c9f24a;
}
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-card,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-product-tabs,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-resource-row,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-dashboard .hj32-domain-modal,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-dashboard .hj32-modal-header,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-dashboard .hj32-modal-panel,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-dashboard .hj32-modal-actions,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-dashboard .hj32-dns-form,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-dashboard .hj32-existing-dns { background:var(--hj33-surface); color:var(--hj33-ink); }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-resource-row:hover { border-color:#3b3f42; background:#1b1d1f; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-button,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-row-actions a,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-row-actions button,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-product-search { background:#1e2022; color:#d8dbd8; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-button.is-primary,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-row-actions .is-primary { color:#182012; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-product-tabs button:hover,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-feed-list>a:hover,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-product-links>a:hover,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-action-list>a:hover { background:#202326; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-product-tabs button b,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-resource-icon,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-product-icon,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-feed-icon,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-feed-empty>span,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-support-icon { background:#24272a; color:#c3c8c4; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-resource-copy strong,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-row-meta strong,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-feed-list strong,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-product-links strong,
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-action-list strong { color:var(--hj33-ink); }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-feed-list>a { border-bottom-color:#292c2e; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-feed-list>a.is-unread { background:#20251c; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-feed-icon i { border-color:#181a1c; }
:where([data-hj-theme="dark"],[data-hj-theme-resolved="dark"]) .hj33-support-card { background:linear-gradient(145deg,#181a1c 0%,#1b1e1c 100%); }

@media (min-width:1100px) and (min-height:820px) {
  .hj33-dashboard { min-height:calc(100dvh - var(--halo-header-height,54px) - 20px); }
}
@media (max-width:1320px) {
  .hj33-layout { grid-template-columns:minmax(0,1fr) 300px; }
  .hj33-resource-row { grid-template-columns:35px minmax(170px,1.38fr) minmax(98px,.66fr) auto auto; }
  .hj33-resource-row .hj33-row-meta:nth-of-type(2) { display:none; }
  .hj33-resource-list.is-services .hj33-resource-row { grid-template-columns:35px minmax(155px,1.3fr) repeat(2,minmax(74px,.52fr)) auto auto; }
  .hj33-resource-list.is-services .hj33-row-meta:nth-of-type(3) { display:none; }
}
@media (max-width:1080px) {
  .hj33-layout { grid-template-columns:1fr; }
  .hj33-side-column { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hj33-products-card { grid-row:span 2; }
  .hj33-support-card { min-height:126px; }
}
@media (max-width:760px) {
  .hj33-dashboard { padding-top:12px; gap:11px; }
  .hj33-welcome { min-height:0; padding:2px 0; align-items:flex-start; flex-direction:column; gap:12px; }
  .hj33-welcome h1 { max-width:100%; font-size:27px; white-space:normal; }
  .hj33-welcome p { font-size:12px; }
  .hj33-welcome-actions { width:100%; }
  .hj33-welcome-actions .hj33-button { flex:1; }
  .hj33-product-tabs { height:48px; padding:0 5px; overflow-x:auto; scrollbar-width:none; }
  .hj33-product-tabs::-webkit-scrollbar { display:none; }
  .hj33-product-tabs button { min-width:50px; padding:0 10px; }
  .hj33-product-tabs button span { display:none; }
  .hj33-product-panel { min-height:0; padding:12px; }
  .hj33-panel-heading { min-height:46px; }
  .hj33-panel-heading p { display:none; }
  .hj33-resource-row,
  .hj33-resource-list.is-services .hj33-resource-row { grid-template-columns:34px minmax(0,1fr) auto; gap:9px; }
  .hj33-resource-row .hj33-row-meta { display:none !important; }
  .hj33-resource-row .hj33-status { grid-column:3; grid-row:1; }
  .hj33-row-actions { grid-column:1/-1; }
  .hj33-row-actions a,.hj33-row-actions button { flex:1; }
  .hj33-feed-grid,
  .hj33-side-column { grid-template-columns:1fr; }
  .hj33-products-card { grid-row:auto; }
  .hj33-feed-card { min-height:220px; }
}
@media (max-width:460px) {
  .hj33-welcome-actions .hj33-button span { display:inline; }
  .hj33-product-tabs button b { display:none; }
  .hj33-panel-heading>a { font-size:0; }
  .hj33-panel-heading>a svg { width:16px; height:16px; }
  .hj33-feed-card>header,.hj33-products-card>header,.hj33-action-card>header { padding-right:11px; padding-left:11px; }
}

/* v0.27.11 unified websites + domains workspace */
.hj37-page{align-items:start}
.hj37-surface{border-radius:24px;border:1px solid rgba(17,24,39,.08);box-shadow:0 18px 40px rgba(17,24,39,.04);background:#fff;overflow:hidden}
.hj37-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 0 18px}
.hj37-toolbar-actions{display:flex;align-items:center;gap:12px}
.hj37-search{display:flex;align-items:center;gap:10px;min-width:280px;max-width:460px;width:100%;padding:0 16px;height:46px;border:1px solid rgba(17,24,39,.08);border-radius:14px;background:#fafafa;color:#6b7280}
.hj37-search span{display:inline-flex;width:18px;height:18px}
.hj37-search span svg{width:100%;height:100%}
.hj37-search input{flex:1;border:0;background:transparent;padding:0;font-size:14px;color:#111827;outline:none;box-shadow:none}
.hj37-quiet-link,.hj37-upgrade-button,.hj37-ghost-button,.hj37-manage-all{text-decoration:none}
.hj37-ghost-button{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 14px;border-radius:12px;border:1px solid rgba(17,24,39,.08);background:#fff;color:#111827;font-weight:600}
.hj37-upgrade-button{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 18px;border-radius:14px;border:1px solid #d7ee72;background:#d7ee72;color:#111827;font-weight:700}
.hj37-quiet-link{display:inline-flex;align-items:center;height:42px;padding:0 14px;border-radius:12px;border:1px solid rgba(17,24,39,.08);background:#fff;color:#111827;font-weight:600}
.hj37-surface-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:6px 0 16px}
.hj37-surface-head.is-tight{padding:0 0 14px}
.hj37-eyebrow{display:inline-block;margin-bottom:8px;font-size:11px;line-height:1.2;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#6b7280}
.hj37-surface-head h2{margin:0;font-size:32px;line-height:1.05;letter-spacing:-.03em;color:#111827}
.hj37-surface-head p{margin:8px 0 0;font-size:15px;color:#6b7280;max-width:640px}
.hj37-section-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0 18px}
.hj37-section-title h3{display:flex;align-items:center;gap:10px;margin:0;font-size:24px;letter-spacing:-.02em;color:#111827}
.hj37-section-title h3 span{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;padding:0 8px;border-radius:999px;background:#f3f4f6;color:#4b5563;font-size:13px;font-weight:700}
.hj37-section-title p{margin:6px 0 0;color:#6b7280;font-size:14px}
.hj37-circle-button{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;border:1px solid rgba(17,24,39,.08);background:#fff;color:#111827}
.hj37-circle-button svg{width:18px;height:18px}
.hj37-manage-all{display:inline-flex;align-items:center;gap:8px;color:#111827;font-weight:600}
.hj37-manage-all svg{width:16px;height:16px}
.hj37-list{display:flex;flex-direction:column;gap:14px}
.hj37-row{display:grid;grid-template-columns:minmax(240px,1.2fr) minmax(320px,1.6fr) auto;gap:18px;align-items:center;padding:16px 18px;border:1px solid rgba(17,24,39,.08);border-radius:18px;background:#fff;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.hj37-row:hover{border-color:rgba(17,24,39,.14);box-shadow:0 12px 30px rgba(17,24,39,.05)}
.hj37-row.is-active{border-color:rgba(17,24,39,.16);box-shadow:0 10px 24px rgba(17,24,39,.04)}
.hj37-row-main{display:flex;align-items:center;gap:16px;min-width:0}
.hj37-app-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 52px;width:52px;height:52px;border-radius:14px;background:#f4f4f5;color:#111827;font-size:22px;font-weight:700}
.hj37-app-icon.is-domain{background:#eef6f1;color:#20553b}
.hj37-app-icon.is-website{background:#f5f2ff;color:#4b3dbb}
.hj37-app-icon svg{width:22px;height:22px}
.hj37-row-copy{min-width:0}
.hj37-row-copy strong{display:block;margin:0 0 6px;font-size:16px;line-height:1.25;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hj37-row-copy small{display:block;font-size:13px;line-height:1.35;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hj37-row-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.hj37-row-stats.is-websites{grid-template-columns:repeat(4,minmax(0,1fr))}
.hj37-row-stats div{min-width:0}
.hj37-row-stats span{display:block;margin-bottom:6px;font-size:12px;color:#9ca3af}
.hj37-row-stats b{display:block;font-size:14px;line-height:1.3;color:#111827;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hj37-status-pill{display:inline-flex!important;align-items:center;gap:8px;padding:0 12px;height:32px;border-radius:999px;font-size:13px!important;font-weight:700!important;width:auto;max-width:max-content;background:#f3f4f6}
.hj37-status-pill i{display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor}
.hj37-status-pill.is-online{background:#edf8f0;color:#17934b}
.hj37-status-pill.is-idle{background:#f3f4f6;color:#6b7280}
.hj37-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.hj37-row-button{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 16px;border-radius:13px;border:1px solid rgba(17,24,39,.10);background:#fff;color:#111827;font-weight:600;text-decoration:none;white-space:nowrap}
.hj37-row-button.is-primary,.hj37-full-button{background:#0f3f2f;border-color:#0f3f2f;color:#fff}
.hj37-row-menu{position:relative}
.hj37-row-menu summary{list-style:none;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:13px;border:1px solid rgba(17,24,39,.10);cursor:pointer;background:#fff}
.hj37-row-menu summary::-webkit-details-marker{display:none}
.hj37-row-menu summary span{display:block;width:3px;height:3px;border-radius:50%;background:#6b7280;margin:1px 0}
.hj37-row-menu-sheet{position:absolute;right:0;top:48px;z-index:20;min-width:188px;padding:8px;border:1px solid rgba(17,24,39,.08);border-radius:16px;background:#fff;box-shadow:0 20px 50px rgba(17,24,39,.12)}
.hj37-row-menu-sheet a,.hj37-row-menu-sheet button{display:flex;width:100%;align-items:center;padding:10px 12px;border:0;border-radius:10px;background:#fff;color:#111827;font:inherit;text-decoration:none;cursor:pointer;text-align:left}
.hj37-row-menu-sheet a:hover,.hj37-row-menu-sheet button:hover{background:#f7f7f8}
.hj37-subgrid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr);gap:18px;margin-top:20px}
.hj37-subcard{padding:22px;border:1px solid rgba(17,24,39,.08);border-radius:22px;background:#fff}
.hj37-subcard header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
.hj37-subcard h3{margin:0;font-size:24px;line-height:1.1;letter-spacing:-.02em;color:#111827}
.hj37-subcard p{margin:6px 0 0;color:#6b7280;font-size:14px}
.hj37-mini-pill{display:inline-flex;align-items:center;justify-content:center;height:32px;padding:0 12px;border-radius:999px;background:#f3f4f6;color:#374151;font-size:12px;font-weight:700}
.hj37-sticky-card{position:sticky;top:96px}
.hj37-helper-note{margin-top:16px;padding:14px 16px;border-radius:16px;background:#f8faf8;border:1px solid rgba(17,24,39,.06)}
.hj37-helper-note strong{display:block;margin-bottom:6px;font-size:14px;color:#111827}
.hj37-helper-note p{margin:0;font-size:13px;color:#6b7280;line-height:1.5}
.hj37-install-panel{padding:24px}
.hj37-install-panel .hj-form label{font-size:13px;color:#4b5563}
.hj37-install-panel .hj-form input,.hj37-install-panel .hj-form select{border-radius:12px}
.hj37-full-button{width:100%}
@media (max-width: 1340px){.hj37-row{grid-template-columns:minmax(240px,1.2fr) minmax(260px,1.2fr)}.hj37-row-actions{grid-column:1/-1;justify-content:flex-start}.hj37-subgrid{grid-template-columns:1fr}}
@media (max-width: 1024px){.hj37-toolbar,.hj37-surface-head,.hj37-section-header{flex-direction:column;align-items:flex-start}.hj37-search{max-width:none}.hj37-row{grid-template-columns:1fr}.hj37-row-stats,.hj37-row-stats.is-websites{grid-template-columns:repeat(2,minmax(0,1fr))}.hj37-row-actions{justify-content:flex-start;flex-wrap:wrap}.hj37-sticky-card{position:relative;top:auto}}
@media (max-width: 640px){.hj37-surface{border-radius:20px}.hj37-surface-head h2{font-size:28px}.hj37-section-title h3{font-size:20px}.hj37-row{padding:14px}.hj37-row-main{gap:12px}.hj37-app-icon{width:46px;height:46px;flex-basis:46px}.hj37-row-stats,.hj37-row-stats.is-websites{grid-template-columns:1fr}.hj37-row-button{width:100%}.hj37-row-actions{width:100%}.hj37-row-menu{width:100%}.hj37-row-menu summary{width:100%}.hj37-upgrade-button,.hj37-quiet-link{width:100%}}



/* 0.28.20 — artwork stays inside the active dark button only. */
.hj-inline-button-loading{cursor:wait!important;overflow:hidden!important;white-space:nowrap!important;}
.hj-inline-button-loader{display:inline-flex;align-items:center;justify-content:center;gap:8px;max-width:100%;line-height:1;}
.hj-inline-button-loader img{width:22px;height:22px;display:block;flex:0 0 22px;border-radius:6px;object-fit:cover;object-position:center;filter:grayscale(1) contrast(1.18) brightness(1.16);mix-blend-mode:screen;}
.hj-inline-button-loader>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
@media(max-width:620px){.hj-inline-button-loader img{width:20px;height:20px;flex-basis:20px;border-radius:5px;}.hj-inline-button-loader{gap:7px;}}

/* ========================================================================== */
/* HostingJet Mail 0.28.39 — Unbox visual alignment                          */
/* Keeps the native inbox functional while matching the premium mail setup.  */
/* ========================================================================== */
.hj-mail-product-v200{
  --hjm-canvas:#f4f5f7;
  --hjm-surface:#fff;
  --hjm-soft:#f3f5f7;
  --hjm-soft-2:#e9edf2;
  --hjm-ink:#181a1f;
  --hjm-muted:#69717d;
  --hjm-line:#e3e7ed;
  --hjm-forest:#181a1f;
  --hjm-forest-2:#2e3238;
  --hjm-emerald:#1557ff;
  --hjm-lime:#dfe8ff;
  --hjm-danger:#d33c36;
  --hjm-shadow:0 18px 54px rgba(18,22,29,.08);
  font-family:Poppins,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  background:var(--hjm-canvas)!important;
  color:var(--hjm-ink);
}
.hj-mail-product-v200,.hj-mail-product-v200 button,.hj-mail-product-v200 input,.hj-mail-product-v200 select,.hj-mail-product-v200 textarea{font-family:Poppins,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
.hj-mail-product-v200 .hj-mail-topbar{border-color:var(--hjm-line);background:rgba(255,255,255,.97);box-shadow:0 1px 0 rgba(18,22,29,.03)}
.hj-mail-product-v200 .hj-mail-brand-symbol{background:#1557ff;box-shadow:0 9px 22px rgba(21,87,255,.18)}
.hj-mail-product-v200 .hj-mail-brand-symbol i{background:#fff}
.hj-mail-product-v200 .hj-mail-brand-zone strong{color:#181a1f;font-weight:700;letter-spacing:-.025em}
.hj-mail-product-v200 .hj-mail-brand-zone small{color:#9299a4;text-transform:none;letter-spacing:0}
.hj-mail-product-v200 .hj-mail-global-search{background:#f2f4f7;border-color:transparent}
.hj-mail-product-v200 .hj-mail-global-search:focus-within{border-color:#aac0ff;background:#fff;box-shadow:0 0 0 4px rgba(21,87,255,.08)}
.hj-mail-product-v200 .hj-mail-health-chip,.hj-mail-product-v200 .hj-mailbox-switcher,.hj-mail-product-v200 .hj-mail-icon-button{border-color:var(--hjm-line);color:#353a43}
.hj-mail-product-v200 .hj-mail-sidebar{background:#fafbfc;border-color:var(--hjm-line)}
.hj-mail-product-v200 .hj-mail-compose-button{background:#181a1f;color:#fff;box-shadow:0 10px 24px rgba(18,22,29,.14)}
.hj-mail-product-v200 .hj-mail-compose-button svg,.hj-mail-product-v200 .hj-mail-compose-button>span{color:#fff}
.hj-mail-product-v200 .hj-mail-system-folders button,.hj-mail-product-v200 .hj-mail-custom-folders nav button{color:#5e6672;font-weight:500}
.hj-mail-product-v200 .hj-mail-system-folders button:hover,.hj-mail-product-v200 .hj-mail-custom-folders nav button:hover{background:#eff1f4;color:#181a1f}
.hj-mail-product-v200 .hj-mail-system-folders button.is-active,.hj-mail-product-v200 .hj-mail-custom-folders nav button.is-active{background:#181a1f;color:#fff}
.hj-mail-product-v200 .hj-mail-system-folders button.is-active svg{color:#fff}
.hj-mail-product-v200 .hj-mail-storage{border-color:var(--hjm-line);border-radius:12px}
.hj-mail-product-v200 .hj-mail-list-pane{border-color:var(--hjm-line)}
.hj-mail-product-v200 .hj-mail-current-folder strong{color:#181a1f;font-weight:700}
.hj-mail-product-v200 .hj-mail-message:hover{background:#fafbfc}
.hj-mail-product-v200 .hj-mail-message.is-selected{background:#eef3ff;box-shadow:inset 3px 0 #1557ff}
.hj-mail-product-v200 .hj-mail-message-avatar{background:#eef3ff;color:#1557ff}
.hj-mail-product-v200 .hj-mail-message.is-unread .hj-mail-message-copy>strong,.hj-mail-product-v200 .hj-mail-message.is-unread .hj-mail-message-subject{color:#181a1f}
.hj-mail-product-v200 .hj-mail-connect-shield{background:#1557ff;color:#fff}
.hj-mail-product-v200 .hj-mail-connect-submit,.hj-mail-product-v200 .hj-mail-send-button{background:#1557ff;color:#fff}
.hj-mail-product-v200 .hj-mail-connect-card h2,.hj-mail-product-v200 .hj-mail-composer>header strong{font-family:Poppins,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;color:#181a1f}