/* Native overview: viewport-sized workspace, real resource cards and expandable canvas. */
html.tank-platform-theme[data-tank-theme] body.xc-dashboard-active #app .app-main {
  overflow: auto !important; background-image: none !important; background-color: var(--fk-page) !important;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard {
  width: 100% !important; max-width: none !important; min-width: 0 !important;
  min-height: calc(100dvh - 110px); margin: 0 !important;
  padding: clamp(20px, 1.5vw, 52px) !important; overflow: visible;
  --tank-overview-gap: clamp(18px, 1.2vw, 36px);
  --tank-chart-height: clamp(450px, 44vh, 1160px);
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard::before { display: none; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard-heading {
  min-height: clamp(112px, 9.2vh, 188px); margin: 0 0 var(--tank-overview-gap) !important;
  padding: clamp(24px, 1.6vw, 48px) clamp(26px, 1.8vw, 60px) !important;
  border-radius: 20px; border: 1px solid #e0e9ef;
  background: linear-gradient(110deg, #102f49, #123f55 70%, #0c5660) !important;
  box-shadow: 0 8px 32px #142d4110;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard-heading::before {
  border-color: #99e6dd1a !important; animation: none !important; right: 12%; top: -80%; width: 36%; height: 250%;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard-heading::after { display: none; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard-heading h1 {
  color: #f7fbfc !important; font-size: clamp(32px, 2.1vw, 62px) !important; line-height: 1.2 !important;
  margin: 8px 0 10px !important; font-weight: 650; letter-spacing: .015em;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard-eyebrow { color: #91d1d2 !important; font-size: clamp(10px, .65vw, 18px); letter-spacing: .18em; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard-heading p { color: #bed3de !important; font-size: clamp(13px, .85vw, 22px); margin: 0; }
html.tank-platform-theme[data-tank-theme] #app .tank-dashboard-expand {
  position: relative; z-index: 3; min-height: 44px; padding: 11px 19px; margin-left: 24px;
  border: 1px solid #b1e1df59; border-radius: 10px; color: #e6f7f4; background: #bce9e411;
  font: 550 clamp(13px, .75vw, 19px)/1.4 inherit; cursor: pointer;
  transition: background .2s, border-color .2s;
}
html.tank-platform-theme[data-tank-theme] #app .tank-dashboard-expand:hover { background: #bce9e425; border-color: #b1e1df99; }
html.tank-platform-theme[data-tank-theme] #app .tank-dashboard-expand:focus-visible { outline: 3px solid #9ee9de; outline-offset: 3px; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .xc-resource-card {
  background: transparent !important; box-shadow: none !important; border: 0 !important; overflow: visible;
  margin: 0 0 var(--tank-overview-gap) !important; transform: none !important;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .xc-resource-card > .el-card__body { padding: 0 !important; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .overview-wrapper {
  display: grid !important; grid-template-columns: repeat(7,minmax(0,1fr)); gap: var(--tank-overview-gap);
  width: 100%; min-width: 0; margin: 0 !important; padding: 0 !important;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .overview-wrapper .overview-item {
  position: relative; width: auto !important; min-width: 0 !important; max-width: none !important;
  height: clamp(142px, 10vh, 226px) !important; margin: 0 !important; padding: clamp(18px, 1.2vw, 36px) !important;
  border: 1px solid var(--fk-border) !important; border-radius: 16px !important; background: var(--fk-surface) !important;
  box-shadow: 0 3px 14px #10293c05 !important; transform: none !important;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .overview-wrapper .overview-item::after { display: none; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .overview-wrapper .overview-item::before { opacity: .18; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .fk-stat-top { margin-bottom: 9px; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .fk-stat-icon { width: clamp(30px, 2vw, 50px); height: clamp(30px, 2vw, 50px); border-radius: 10px; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .fk-stat-icon svg { width: 58%; height: 58%; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .fk-stat-code { font-size: clamp(9px,.55vw,14px); }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .overview-item .overview-item__content { height: auto !important; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .overview-item .overview-item__content > div { margin-bottom: 9px; font-size: clamp(13px, .85vw, 23px) !important; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .overview-item .overview-item__content .number {
  font-size: clamp(34px, 2.2vw, 72px) !important; line-height: 1.15 !important; color: var(--fk-text) !important;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .tank-dashboard-charts {
  display: grid !important; grid-template-columns: minmax(0,1.45fr) minmax(0,1fr) !important;
  gap: var(--tank-overview-gap); margin: 0 !important; min-width: 0;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .tank-dashboard-charts > .bd-col:last-child {
  display: grid !important; grid-template-rows: repeat(2,minmax(0,1fr)) !important; gap: var(--tank-overview-gap);
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .xc-panel-project { height: var(--tank-chart-height) !important; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .xc-panel-status,
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .xc-panel-alarm { height: calc((var(--tank-chart-height) - var(--tank-overview-gap))/2) !important; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .tank-dashboard-charts .el-card {
  min-width: 0; margin: 0 !important; border: 1px solid var(--fk-border) !important;
  border-radius: 16px !important; box-shadow: 0 3px 14px #10293c05 !important; transform: none !important;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .tank-dashboard-charts .el-card__header {
  height: clamp(50px, 3.8vh, 80px) !important; padding: clamp(15px, 1vw, 28px) !important;
  font-size: clamp(15px, .9vw, 25px) !important; background: var(--fk-surface) !important;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .tank-dashboard-charts .el-card__header::after,
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .xc-panel-project > .el-card__body::after { display: none; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .tank-dashboard-charts .el-card__body {
  height: calc(100% - clamp(50px,3.8vh,80px)) !important; min-height: 0; overflow: hidden;
}
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .device-status .data .data-item { height: clamp(36px, 3vh, 62px); }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .device-status .data .data-item .label { font-size: clamp(13px, .8vw, 22px) !important; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .device-status .data .data-item .number { font-size: clamp(21px,1.4vw,38px) !important; }
html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .fk-panel-meta { font-size: clamp(11px,.65vw,17px); }

.tank-host-health { margin: 0 0 var(--tank-overview-gap); }
.tank-host-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.tank-host-eyebrow { color: var(--fk-muted); font-size: clamp(9px,.5vw,14px); letter-spacing: .17em; }
.tank-host-heading h2 { margin: 4px 0 0; font-size: clamp(20px,1.2vw,34px); line-height: 1.4; color: var(--fk-text); font-weight: 650; }
.tank-host-actions { display: flex; align-items: center; gap: 15px; }
.tank-host-state { color: #16745b; font-size: clamp(12px,.7vw,18px); }
.tank-host-state::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: #1d9d76; vertical-align: 2px; }
.tank-host-health[data-health="unavailable"] .tank-host-state { color: #986620; }
.tank-host-health[data-health="unavailable"] .tank-host-state::before { background: #bd8935; }
.tank-host-refresh { min-height: 38px; padding: 8px 13px; border: 1px solid var(--fk-border); border-radius: 8px; background: var(--fk-surface); color: var(--fk-text-soft); font: 500 12px/1.5 inherit; cursor: pointer; }
.tank-host-refresh:disabled { opacity: .55; cursor: wait; }
.tank-host-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: var(--tank-overview-gap); }
.tank-host-card { --tank-gauge:#168b91; display: flex; justify-content: space-between; align-items: center; gap: 15px; min-width: 0;
  padding: clamp(20px,1.4vw,42px); border: 1px solid var(--fk-border); border-radius: 17px; background: var(--fk-surface); box-shadow: 0 3px 14px #10293c05; }
.tank-host-card[data-usage="moderate"] { --tank-gauge: #ba852b; }
.tank-host-card[data-usage="high"] { --tank-gauge: #c55c5c; }
.tank-host-card[data-usage="unknown"] { --tank-gauge: #a3b1bd; }
.tank-host-card-copy { min-width: 0; }
.tank-host-card-kicker { color: var(--fk-muted); font-size: clamp(11px,.65vw,17px); }
.tank-host-card h3 { margin: 6px 0 12px; color: var(--fk-text-soft); font-size: clamp(14px,.85vw,23px); font-weight: 550; }
.tank-host-value { display: block; color: var(--fk-text); font-size: clamp(32px,2.15vw,66px); font-weight: 650; line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -.025em; }
.tank-host-detail { margin: 13px 0 5px; color: var(--fk-text-soft); font-size: clamp(11px,.7vw,19px); line-height: 1.6; white-space: normal; }
.tank-host-free { color: var(--fk-muted); font-size: clamp(10px,.6vw,16px); line-height: 1.6; }
.tank-host-gauge { position: relative; flex: 0 0 auto; width: clamp(72px,6vw,160px); height: clamp(72px,6vw,160px); }
.tank-host-gauge svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.tank-host-gauge circle { fill: none; stroke-width: 5; }
.tank-host-track { stroke: #eaf0f3; }
.tank-host-arc { stroke: var(--tank-gauge); stroke-linecap: round; transition: stroke-dashoffset .5s ease; }
.tank-host-gauge-label { position: absolute; inset: 0; display: grid; place-items: center; font-size: clamp(11px,.75vw,19px); font-weight: 600; letter-spacing: .07em; color: var(--fk-muted); }
.tank-host-meta { margin: 10px 0 0; text-align: right; color: var(--fk-muted); font-size: clamp(10px,.6vw,15px); line-height: 1.6; }
html.tank-platform-theme body.tank-dashboard-expanded #app .sidebar-container,
html.tank-platform-theme body.tank-dashboard-expanded #app .navbar,
html.tank-platform-theme body.tank-dashboard-expanded #app .tags-view-container { display: none !important; }
html.tank-platform-theme body.tank-dashboard-expanded #app .main-container { margin-left: 0 !important; }
html.tank-platform-theme body.tank-dashboard-expanded #app .app-main { padding-top: 0 !important; min-height: 100dvh !important; }
html.tank-platform-theme body.tank-dashboard-expanded #app .xc-dashboard { min-height: 100dvh !important; }
@media (max-width: 1300px) {
  html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .overview-wrapper { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .tank-host-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .tank-dashboard-charts { grid-template-columns: 1fr !important; }
  html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .tank-dashboard-charts > .bd-col:last-child { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: auto !important; }
  html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .xc-panel-status,
  html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .xc-panel-alarm { height: 300px !important; }
}
@media (max-width: 700px) {
  html.tank-platform-theme[data-tank-theme] #app .xc-dashboard { padding: 16px !important; }
  html.tank-platform-theme[data-tank-theme] #app .xc-dashboard-heading { padding: 20px !important; flex-wrap: wrap; gap: 18px; }
  html.tank-platform-theme[data-tank-theme] #app .tank-dashboard-expand { margin-left: 0; }
  html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .overview-wrapper { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .tank-host-grid { grid-template-columns: 1fr; }
  html.tank-platform-theme[data-tank-theme] #app .xc-dashboard .tank-dashboard-charts > .bd-col:last-child { grid-template-columns: 1fr; }
  .tank-host-meta { text-align: left; }
}
@media (prefers-reduced-motion: reduce) { .tank-host-arc { transition: none; } }