:root { color-scheme: light; }
html, body { margin:0; font-family:'Source Sans 3',sans-serif; background:#F4F6F8; color:#343A42; }
.appbar { border-bottom:1px solid #e8eaf0; }
.brand-mark { width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#1F6FA8,#0E1C2B);color:white;display:grid;place-items:center;font-weight:700;margin:0 10px;font-family:'Titillium Web',sans-serif; }
.brand-title { font-weight:700!important;font-family:'Titillium Web',sans-serif!important; }
.sidebar { border-right:0!important; }
.sidebar .mud-drawer-content { padding:88px 12px 20px; display:flex; flex-direction:column; }
.sidebar .mud-nav-link { border-radius:9px; margin:2px 0; color:#B9C4CF!important; }
.sidebar .mud-nav-link.active { background:#1F6FA8!important; color:white!important; }
.nav-heading { font-size:10px;letter-spacing:.12em;color:#8A93A0;padding:20px 16px 8px;font-weight:700; }
.sidebar-footer { margin:auto 8px 0;padding:16px 10px;border-top:1px solid #22303f;display:flex;align-items:center;gap:12px;color:#e5e7eb; }
.sidebar-footer div { display:flex;flex-direction:column;font-size:12px }.sidebar-footer small{color:#7f8ba0}
.main-content { padding:96px 32px 48px; max-width:1500px; margin:auto; }
.page-header { display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px; }
.page-header h4 { font-weight:700;letter-spacing:-.025em; }
.stat-card { border:1px solid #e8eaf0;border-radius:14px!important;padding:21px;display:flex;align-items:center;gap:16px;min-height:126px; }
.stat-icon { width:48px;height:48px;border-radius:12px;display:grid;place-items:center;flex:none; }
.stat-card h5 { font-weight:700;line-height:1.25; }
.panel { border:1px solid #e8eaf0;border-radius:14px!important;padding:24px; }
.panel-title { display:flex;justify-content:space-between;align-items:center;margin-bottom:14px; }.panel-title h6{font-weight:700}
.vm-row { display:grid;grid-template-columns:44px minmax(150px,1fr) 100px 110px 150px 42px;align-items:center;gap:12px;padding:14px 4px;border-top:1px solid #edf0f4;cursor:pointer; }.vm-row:hover{background:#F4F9FC}
.vm-icon { width:38px;height:38px;display:inline-grid;place-items:center;background:#EEF4F8;color:#1F6FA8;border-radius:10px; }
.vm-primary,.vm-spec,.table-name>div { display:flex;flex-direction:column; }.vm-primary small,.vm-spec small,.table-name small{font-size:11px;color:#8a94a5}.vm-primary strong,.vm-spec strong{font-size:13px}
.quick-action { width:100%;border:0;border-top:1px solid #edf0f4;background:white;display:grid;grid-template-columns:42px 1fr 24px;align-items:center;text-align:left;gap:10px;padding:16px 4px;color:#343A42; }.quick-action span{width:38px;height:38px;border-radius:10px;background:#EEF4F8;display:grid;place-items:center}.quick-action div{display:flex;flex-direction:column}.quick-action small{color:#8a94a5}.quick-action:hover{background:#F4F9FC}
.table-toolbar { display:flex;align-items:center;margin-bottom:12px; }.table-toolbar .mud-input-control{max-width:330px}.table-name{display:flex;align-items:center;gap:12px}.table-name small{max-width:240px;overflow:hidden;text-overflow:ellipsis}
.console-preview{background:#0E1C2B!important;border-radius:14px!important;overflow:hidden;color:#d1d5db}.console-bar{height:42px;background:#16232f;display:flex;align-items:center;gap:7px;padding:0 15px}.console-bar span{width:10px;height:10px;border-radius:50%;background:#ef4444}.console-bar span:nth-child(2){background:#f59e0b}.console-bar span:nth-child(3){background:#22c55e}.console-bar strong{margin-left:12px;font-size:12px}.console-body{height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center}.console-body svg{font-size:42px}.muted{color:#718096}.order-card>div{display:flex;justify-content:space-between;padding:12px 0}.order-card .price{font-size:18px}.order-card .mud-button{margin:18px 0 12px}
.resource-slider{max-width:460px;margin-top:12px}.resource-slider-scale{display:flex;justify-content:space-between;margin-top:-4px;color:var(--mud-palette-text-secondary);font-size:.75rem}
.vm-details-grid>.mud-grid-item{display:flex}.vm-console-preview,.machine-details{width:100%;height:100%}.machine-details{display:flex;flex-direction:column}.machine-facts{display:grid;grid-template-columns:1fr 1fr;gap:12px}.machine-facts>div{display:flex;align-items:center;gap:10px;padding:12px;border-radius:10px;background:#F4F6F8}.machine-facts svg{color:#1F6FA8}.machine-facts span{display:flex;flex-direction:column;min-width:0}.machine-facts small,.snapshot-tree-item small{font-size:11px;color:#718096}.machine-facts strong{font-size:14px}.snapshot-heading{display:flex;align-items:center;justify-content:space-between}.snapshot-list{margin-top:10px;max-height:300px;overflow:auto;padding:4px 0}.snapshot-tree{list-style:none;margin:0;padding:0 0 0 22px}.snapshot-tree-root{padding-left:0}.snapshot-tree li{position:relative;margin:0;padding:4px 0 0 18px}.snapshot-tree li::before{content:"";position:absolute;left:0;top:0;width:14px;height:22px;border-left:1px solid #b8c4cf;border-bottom:1px solid #b8c4cf;border-radius:0 0 0 5px}.snapshot-tree li::after{content:"";position:absolute;left:0;top:22px;bottom:-8px;border-left:1px solid #b8c4cf}.snapshot-tree li:last-child::after{display:none}.snapshot-tree-root>li{padding-left:0}.snapshot-tree-root>li::before,.snapshot-tree-root>li::after{display:none}.snapshot-tree-item{display:flex;align-items:flex-start;gap:9px;padding:8px 10px;border:1px solid #e8eaf0;border-radius:9px;background:#fff}.snapshot-tree-item svg{color:#1F6FA8;flex:none;margin-top:1px}.snapshot-tree-item span{display:flex;flex-direction:column;min-width:0}.snapshot-tree-item strong{font-size:13px;overflow-wrap:anywhere}.snapshot-tree-current{border-style:dashed;background:#f0f9f4}.snapshot-tree-current svg,.snapshot-tree-current strong{color:#16834a}.snapshot-empty{display:flex;align-items:center;justify-content:center;gap:8px;min-height:90px;color:#718096;font-size:13px;text-align:center}
.embedded-console{background:#0b1020;border-radius:14px;overflow:hidden;box-shadow:0 12px 35px #11182724;min-width:0}.console-toolbar{height:52px;background:#16232f;color:#d9e0ec;display:flex;align-items:center;padding:0 10px;gap:2px}.console-toolbar .mud-icon-button{color:#d9e0ec}.console-clipboard{background:#f8fafc;padding:14px;display:flex;gap:12px;align-items:center}.console-clipboard .mud-input-control{flex:1}.console-canvas-wrap{height:min(68vh,760px);min-height:430px;min-width:0;position:relative;display:flex;align-items:center;justify-content:center;overflow:auto}.console-canvas{width:100%;height:100%;min-width:0;min-height:0;outline:none}.console-canvas-xo{overflow:hidden}.console-canvas>div{min-width:0;min-height:0}.console-canvas canvas{max-width:100%;max-height:100%}.console-canvas:focus{box-shadow:inset 0 0 0 2px #1F6FA8}.console-overlay{position:absolute;inset:0;background:#0b1020de;color:#d9e0ec;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.console-overlay small{color:#8793a8}.console-fullscreen{position:fixed;inset:0;z-index:1500;border-radius:0}.console-fullscreen .console-canvas-wrap{height:calc(100vh - 52px)}
.remote-console-frame-wrap{height:min(72vh,820px);min-height:480px;overflow:hidden;border-radius:14px;background:#0b1020;box-shadow:0 12px 35px #11182724}.remote-console-frame{width:100%;height:100%;border:0;display:block;background:#0b1020;pointer-events:auto;position:relative;z-index:1}
.remote-console-ended{height:min(72vh,820px);min-height:480px;border-radius:14px;background:#0b1020;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:32px;box-shadow:0 12px 35px #11182724}
.ssh-send-controls{display:grid;grid-template-columns:minmax(260px,1fr) auto auto auto;align-items:center;gap:12px}.ssh-send-input{min-width:0}.ssh-send-input .mud-input-control{margin:0}@media(max-width:900px){.ssh-send-controls{grid-template-columns:1fr auto auto}.ssh-send-input{grid-column:1/-1}}@media(max-width:600px){.ssh-send-controls{grid-template-columns:1fr}.ssh-send-input{grid-column:auto}.ssh-send-controls .mud-button-root{width:100%}}
.machine-assignment-actions{min-width:58px;width:58px;text-align:center!important;white-space:nowrap}.machine-assignment-actions .mud-icon-button{margin:auto}
#blazor-error-ui{display:none;position:fixed;bottom:0;width:100%;padding:10px;background:#b91c1c;color:white;z-index:9999}
@media(max-width:900px){.main-content{padding:84px 16px 32px}.page-header{align-items:flex-start;flex-direction:column}.vm-row{grid-template-columns:44px 1fr 90px}.vm-spec{display:none}.vm-row>:nth-child(5){display:none}}

/* ===== Plain login forms (Login/AdminLogin post to real endpoints, not MudTextField/EditForm) ===== */
.auth-form-label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; color: #343A42; }
.auth-form-input {
    border: 1px solid #D4DAE0; border-radius: 8px; padding: 11px 13px; font-size: 15px; outline: none;
    font-family: 'Source Sans 3', sans-serif;
}
.auth-form-input:focus { border-color: #1F6FA8; }
.auth-form-submit {
    background: #1F6FA8; color: #FFFFFF; border: none; padding: 13px 26px; border-radius: 8px;
    font-family: 'Source Sans 3', sans-serif; font-weight: 600; font-size: 15px; cursor: pointer;
}
.auth-form-submit:hover { background: #17629A; }

/* ===== Logout button embedded in the account MudMenu (real <form> POST, not a Blazor click handler) ===== */
.auth-menu-logout {
    display: flex; align-items: center; width: 100%; border: none; background: transparent; cursor: pointer;
    padding: 8px 4px; font-family: 'Source Sans 3', sans-serif; font-size: 14px; color: #343A42;
}
.auth-menu-logout:hover { color: #C4453B; }
.account-menu-activator { display: inline-flex; cursor: pointer; border-radius: 50%; }
.account-menu-activator:focus-visible { outline: 3px solid #1F6FA866; outline-offset: 3px; }

/* Leave room for snapshot actions while keeping long names inside the tree card. */
.snapshot-tree-item > span { flex: 1; }
