/* DisplayMint control-panel overhaul — 2026-10 */
:root{
  --dm-radius:16px;
  --dm-radius-lg:22px;
  --dm-glass:rgba(10,23,38,.88);
  --dm-hover:rgba(110,231,183,.07);
}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
.sidebar{width:auto;box-shadow:10px 0 40px rgba(0,0,0,.12)}
.nav{overflow-y:auto;overscroll-behavior:contain;padding-right:2px}
.nav::-webkit-scrollbar{width:6px}.nav::-webkit-scrollbar-thumb{background:#223650;border-radius:999px}
.topbar{gap:14px;min-width:0}
.topbar h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.content{width:100%}
.panel,.card,.stat,.dm-page-metric{box-shadow:0 12px 35px rgba(0,0,0,.12)}
.panel{border-radius:var(--dm-radius-lg)}
.btn{min-height:40px;transition:transform .12s ease,filter .12s ease,border-color .12s ease}
.btn:active{transform:translateY(1px)}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.dm-runtime-strip{position:fixed;z-index:500;left:50%;top:14px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:9px 13px;border-radius:999px;border:1px solid var(--line);background:rgba(7,16,29,.94);box-shadow:var(--shadow);font-size:12px;color:var(--muted);backdrop-filter:blur(18px);pointer-events:none;opacity:0;transition:opacity .18s ease}
.dm-runtime-strip.visible{opacity:1}.dm-runtime-strip.bad{border-color:rgba(251,113,133,.55);color:#fecdd3}.dm-runtime-strip.good{border-color:rgba(74,222,128,.35);color:#bbf7d0}
.dm-runtime-dot{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px color-mix(in srgb,currentColor 12%,transparent)}
.dm-top-health{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:999px;padding:7px 10px;color:var(--muted);font-size:11px;font-weight:800;white-space:nowrap}
.dm-top-health:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px rgba(74,222,128,.08)}
.dm-top-health.offline:before{background:var(--danger)}
.dm-top-health.offline{color:#fecdd3;border-color:rgba(251,113,133,.35)}
.dm-table-sub{display:block;margin-top:4px;color:var(--muted);font-size:11px}
.dm-fleet-table tr{transition:background .12s ease}.dm-fleet-table tbody tr:hover{background:var(--dm-hover)}
.dm-row-title{appearance:none;border:0;background:none;color:inherit;padding:0;text-align:left;display:grid;gap:3px;cursor:pointer}
.dm-row-title small{color:var(--muted)}
.dm-empty-retry{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}
.modal-backdrop{backdrop-filter:blur(6px)}
.modal{box-shadow:0 30px 100px rgba(0,0,0,.5)}
@media(max-width:900px){
  .content{padding:20px}
  .page-head{gap:14px}
  .page-head h2{font-size:1.65rem}
  .top-actions{flex-wrap:wrap;justify-content:flex-end}
}
@media(max-width:720px){
  .topbar{height:auto;min-height:66px;padding:10px 14px}
  .topbar h1{font-size:1rem}
  .dm-top-health{display:none}
  .table-wrap{overflow:visible}
  .dm-fleet-table,.dm-fleet-table tbody,.dm-fleet-table tr,.dm-fleet-table td{display:block;width:100%}
  .dm-fleet-table thead{display:none}
  .dm-fleet-table tbody{display:grid;gap:12px}
  .dm-fleet-table tr{border:1px solid var(--line);background:var(--panel);border-radius:16px;padding:12px}
  .dm-fleet-table td{border:0;padding:7px 4px;white-space:normal;display:grid;grid-template-columns:minmax(90px,32%) 1fr;gap:10px;align-items:start}
  .dm-fleet-table td:before{content:attr(data-label);color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.07em;text-transform:uppercase;padding-top:2px}
  .dm-fleet-table td:last-child{display:block;padding-top:10px}
  .dm-fleet-table td:last-child:before{display:none}
  .dm-fleet-table .dm-row-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .dm-fleet-table .dm-row-actions .btn{padding-inline:7px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
