:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;background:#0d121b;color:#eaf0fa}
*{box-sizing:border-box}body{margin:0;padding:28px 16px;min-height:100vh;display:flex;align-items:flex-start;justify-content:center}
.frame{max-width:980px;width:100%;border:1px solid #34435d;border-radius:20px;background:#192335;padding:clamp(18px,4vw,32px);box-shadow:0 18px 65px #0005}
.brand{display:flex;gap:13px;align-items:center}.brand strong{font-size:20px}.brand small{display:block;color:#b3c3dc;margin-top:3px}
.mark{background:linear-gradient(135deg,#5f83ef,#9863ce);padding:10px;border-radius:12px;font-weight:800}
h1{font-size:27px;margin:28px 0 4px}h2{font-size:17px}p{color:#b8c7dc;font-size:14px;line-height:1.6}
button{font:inherit;font-weight:600;color:#edf4ff;background:#303f5d;border:1px solid #596f93;border-radius:10px;padding:10px 15px;cursor:pointer}
button.primary{background:#6b9deb;color:#0b1422;border:none;width:100%;margin-top:14px}
button:focus-visible,input:focus-visible{outline:3px solid #7bb7ff;outline-offset:2px}
label{display:block;font-size:13px;margin-top:13px}input{font:inherit;width:100%;color:white;border:1px solid #5c6c84;border-radius:10px;background:#111927;padding:11px;margin-top:6px}
#login-panel{max-width:440px;margin:auto}.links,.between{display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.links button{background:transparent;border:0;color:#a4c6ff;font-size:12px;padding:10px 0}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:20px 0}
article{padding:15px;border-radius:12px;border:1px solid #405171;background:#222e44}article h2{margin:0 0 14px;color:#a8bad4}
article p{font-size:20px;color:#f0f5ff;margin:0}.service{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid #354762;padding:11px 4px;font-size:13px}
.service strong{color:#a9ccfa}.note{margin-top:20px;font-size:12px}
#status{color:#a8cbfd;border-top:1px solid #364660;padding-top:15px;overflow-wrap:anywhere}
footer{font-size:11px;color:#8b9fbe;padding-top:15px;border-top:1px solid #364660}
[hidden]{display:none!important}

/* Compact second-wave monitoring surfaces; no client-side framework. */
#dashboard{max-width:100%}
.module{margin:16px 0;padding:17px;border:1px solid #34445f;border-radius:14px;background:#1b2940}
.module h2{margin:0;font-size:18px}
.subtle,.secondary-text{color:#a8bad2;font-size:12px;line-height:1.5}
.storage-summary{margin:12px 0 10px;font-size:14px;color:#d7e7ff;font-weight:650}
.footnote{font-size:11px;margin:10px 2px 0}
.drive-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,275px),1fr));gap:10px}
.drive-card{background:#202f48;border:1px solid #405678;padding:15px}
.drive-top{align-items:flex-start}
.drive-heading{min-width:0}
.drive-heading h3{font-size:15px;font-weight:700;color:#f0f5ff;margin:0 0 3px;overflow-wrap:anywhere}
.drive-size{font-size:18px;white-space:nowrap;color:#e9f2ff}
.unmounted{padding:8px 11px;background:#3b3545;color:#f3d7a4;border-radius:7px;font-size:12px;margin-bottom:0}
.mount{margin-top:12px;padding-top:10px;border-top:1px solid #3a4a64}
.mount-label{font-size:12px;color:#cedcf0;overflow-wrap:anywhere}
.mount-usage{margin:5px 0;font-size:13px}
.meter{height:7px;border-radius:10px;background:#101c30;overflow:hidden}
.meter>span{display:block;height:100%;background:#7da6f5;border-radius:10px}
.read-only{color:#b5c7e4;font-size:10px;letter-spacing:.08em}
.service-card{padding:0;border-bottom:1px solid #354762}
.service-card>summary{cursor:pointer;list-style-position:inside;align-items:center}
.service-card>summary:focus-visible{outline:2px solid #96b8ff}
.service-card .service{display:flex;gap:8px;padding:12px 6px;border:0;flex-wrap:wrap}
.service-card .service span{overflow-wrap:anywhere;flex:1}
.running{color:#95dcb4!important}
.not-running{color:#e5b7a4!important}
.service-detail{padding:8px 14px 14px;font-size:12px;background:#152238;color:#dbe7fc;border-radius:8px}
.detail-pair{display:grid;grid-template-columns:minmax(95px,30%) 1fr;gap:8px;padding:3px 0;overflow-wrap:anywhere}
.journal{margin:12px 0 0;font-size:13px}
.journal summary{cursor:pointer;color:#bcd8ff;padding:9px 0}
.journal pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px;line-height:1.6;color:#cce1ff}
@media(max-width:520px){
 body{padding:8px}
 .frame{border-radius:12px;padding:16px}
 h1{font-size:24px}
 .tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 article p{font-size:16px}
 .module{padding:12px}
 .drive-grid{grid-template-columns:minmax(0,1fr)}
 .service-card .service{font-size:12px}
}

.update-action{margin:14px 0;justify-content:flex-start}
.update-primary{background:#6594ed;color:#101b2d;border-color:#6594ed}
.update-primary:disabled{opacity:.5;cursor:not-allowed}
.update-status{background:#122139;border:1px solid #384d70;border-radius:9px;padding:12px 14px}
.update-status strong{color:#eaf2ff}
.update-status p{margin:7px 0;font-size:13px;overflow-wrap:anywhere}
#update-report-details{margin-top:12px;color:#cfe0f9}
#update-report-details summary{cursor:pointer;padding:8px 0}
#update-report{width:100%;max-width:100%;resize:vertical;min-height:120px;margin:6px 0 9px;
  border:1px solid #405473;border-radius:8px;background:#101a2b;color:#cfe1fa;
  padding:12px;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}


/* Compact server sections and on-demand standard Linux service discovery. */
.dashboard-head h1{margin:16px 0 3px}
.dashboard-head p{margin:0;font-size:12px}
.head-actions{display:flex;gap:8px}
.head-actions button{padding:8px 11px;font-size:12px}
.dashboard-nav{display:flex;gap:7px;margin:15px 0 6px}
.dashboard-nav button{flex:1;min-width:0;padding:9px 7px;font-size:13px}
.dashboard-nav button[aria-pressed="true"]{background:#4778c4;border-color:#82aafb;color:#fff}
#overview-panel .tiles{margin:13px 0}
#services-panel h3{margin:17px 0 8px;font-size:13px;color:#c4d6f0}
.discovery-head{margin-top:16px;border-top:1px solid #354762;padding-top:5px}
.discovery-head button{padding:6px 12px;font-size:12px}
.discovered-service{padding:9px 6px;border-bottom:1px solid #354762;font-size:12px;overflow-wrap:anywhere}
.discovered-service strong{font-size:12px;font-weight:600}
.discovered-service small{display:block;margin-top:4px}
.service-inventory{max-height:380px;overflow-y:auto;overscroll-behavior:contain}
.discovery-filters{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin:8px 0}
.discovery-filters label{margin:0}
.discovery-filters input[type="search"]{max-width:250px;padding:8px;margin-top:4px;font-size:13px}
.discovery-filters .check-label{display:flex;align-items:center;gap:7px;padding-bottom:9px}
.discovery-filters input[type="checkbox"]{width:auto;margin:0;accent-color:#7ba4ee}
@media(max-width:520px){
 .dashboard-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .dashboard-head{align-items:flex-start}
 .head-actions{gap:5px}
 .head-actions button{padding:7px 8px}
 .discovery-filters{align-items:flex-start;gap:9px}
 .discovery-filters .check-label{padding:7px 0 0}
}

/* Saved app shortcuts are shown first. Technical systemd inventory stays opt-in. */
.tracked-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:10px;margin:9px 0}
.tracked-card{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:12px;background:#202f48;border:1px solid #405678;border-radius:10px;min-width:0}
.tracked-top{align-items:flex-start;flex-wrap:nowrap}
.tracked-heading{min-width:0;flex:1}
.tracked-heading strong{display:block;font-size:14px;font-weight:650;overflow-wrap:anywhere}
.tracked-heading small{display:block;margin-top:4px;overflow-wrap:anywhere}
.tracked-top>span{font-size:12px;padding-left:8px;white-space:nowrap}
.app-details summary{cursor:pointer;color:#bcd8ff;font-size:12px}
.app-details .service-detail{margin-top:7px}
.small-action{align-self:flex-start;font-size:12px;padding:6px 10px}
.tracked-card>.small-action{margin-top:auto}
.tech-panel{border-top:1px solid #354762;margin-top:18px;padding-top:12px}
.tech-panel>summary{cursor:pointer;font-size:13px;font-weight:600;color:#bcd8ff;padding:8px 0}
.tech-panel>p{margin:4px 0 12px}
.discovered-heading{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.discovered-heading strong{overflow-wrap:anywhere}
.discovered-heading>span{font-size:11px}
.discovered-service>.between{align-items:flex-start;gap:12px}
.discovered-service>.between>.small-action{flex-shrink:0}
@media(max-width:520px){
 .tracked-grid{grid-template-columns:minmax(0,1fr)}
 .tracked-card{gap:7px}
}
