.resource-main { max-width:1240px; margin:auto; padding:32px 28px 56px; }
.resource-summary { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:26px 0; }
.resource-summary article { padding:24px; background:white; border:1px solid var(--line); border-radius:8px; }
.resource-summary h2 { margin:0 0 16px; font-size:16px; font-weight:600; }
.resource-number { display:flex; align-items:baseline; gap:8px; font-variant-numeric:tabular-nums; }
.resource-number strong { font-size:44px; letter-spacing:-1px; line-height:1.2; font-weight:600; }
.resource-number span { color:var(--muted); font-size:17px; }
.resource-number small { margin-left:auto; color:var(--muted); }
.resource-bar { height:8px; display:flex; overflow:hidden; background:#eceeec; border-radius:3px; margin:20px 0 12px; }
.resource-bar .used { background:#426d8a; }.resource-bar .free { background:#a6bdb0; }.resource-bar .unknown { background:repeating-linear-gradient(135deg,#e6e8e5,#e6e8e5 4px,#cfd3cf 4px,#cfd3cf 6px); }
.resource-counts { display:flex; flex-wrap:wrap; gap:16px; font-size:12px; color:#656d67; }
.resource-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:30px 0 16px; }
.resource-toolbar label { font-size:12px; white-space:nowrap; }
.resource-tabs { display:flex; gap:4px; flex-wrap:wrap; }
.resource-tabs button { padding:8px 14px; background:transparent; cursor:pointer; border-radius:4px; color:var(--muted); }
.resource-tabs button.selected { background:#343c38; color:white; }
.resource-legend { display:flex; gap:18px; flex-wrap:wrap; font-size:12px; color:var(--muted); margin:0 0 18px; }
.resource-legend span { display:flex; align-items:center; gap:6px; }.resource-legend span:last-child { margin-left:auto; }
.dot { width:8px; height:8px; display:inline-block; border-radius:50%; }.dot.used { background:#426d8a; }.dot.free { background:#86a591; }.dot.unknown { background:#a8aea8; }
.machine { margin-bottom:18px; background:white; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.machine-heading { padding:18px 22px; display:flex; justify-content:space-between; gap:16px; border-bottom:1px solid #e9ebe8; }
.machine-heading h2 { margin:0; font-size:16px; }.machine-heading p { margin:4px 0 0; color:var(--muted); font-size:12px; }
.machine-total { text-align:right; font-size:12px; color:var(--muted); }.machine-total strong { font-size:19px; color:var(--ink); }
.card-grid { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:8px; padding:18px 22px; }
.gpu { min-width:0; padding:12px 6px; border:1px solid #dce1db; border-radius:5px; background:#f3f7f3; text-align:center; cursor:pointer; }
.gpu strong { display:block; font-size:13px; }.gpu span { display:block; margin-top:6px; font-size:11px; color:#65716a; }
.gpu.used { background:#e8f0f5; border-color:#a8c0d1; }.gpu.used span { color:#396480; }
.gpu.unknown { background:#f4f4f2; border-color:#e0e1dc; }.gpu.unknown span { color:#858a82; }
.gpu[aria-expanded="true"] { outline:2px solid #426d8a; outline-offset:1px; }
.card-detail { padding:0 22px 20px; font-size:13px; overflow-wrap:anywhere; }
.card-detail h3 { margin:0 0 6px; font-size:14px; }.card-detail p { margin:6px 0; color:#6d756f; }
.card-detail a { color:#376f9f; text-decoration:underline; display:block; margin-top:5px; }
.machine-note { margin:0; padding:0 22px 16px; color:#82877f; font-size:12px; }
.resource-alert { padding:12px 16px; border:1px solid #d8cda8; border-radius:5px; background:#faf7ed; color:#78683d; font-size:13px; }
.resource-footnote { color:var(--muted); font-size:12px; margin-top:24px; line-height:1.8; }
@media(max-width:700px) { .resource-main { padding:22px 16px; }.resource-summary { grid-template-columns:1fr; gap:12px; }.resource-summary article { padding:18px; }.card-grid { grid-template-columns:repeat(4,minmax(0,1fr)); padding:16px; }.machine-heading { padding:16px; }.masthead-inner { padding:14px 16px; gap:10px; flex-wrap:wrap; }.platform-heading { align-items:flex-start; flex-direction:column; gap:10px; }.platform-refresh { align-items:flex-start; }.resource-legend span:last-child { margin-left:0; }.resource-toolbar { align-items:flex-start; }.resource-tabs button { padding:7px 9px; } }
.machine-workloads { padding:0 22px 16px; font-size:12px; overflow-wrap:anywhere; }.machine-workloads a { display:block; color:var(--blue); text-decoration:underline; margin-top:4px; }
.gpu small { display:block; margin-top:6px; color:#777f79; font-size:10px; }
.machine-heading .observation { font-size:11px; color:#747e76; }.machine-heading .observation-error { color:#986c37; }
.quota-nodes { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:18px 22px; }.quota-nodes > div { background:#f3f7f3; border:1px solid #dce1db; border-radius:5px; padding:14px; min-width:0; }.quota-nodes strong { display:block; overflow-wrap:anywhere; font-size:12px; font-weight:500; }.quota-nodes span { display:block; margin-top:8px; color:#65716a; font-size:13px; }.quota-jobs { padding:0 22px 12px; font-size:13px; overflow-wrap:anywhere; }.quota-jobs p { margin:4px 0; color:#69766c; }
@media(max-width:700px) { .quota-nodes { grid-template-columns:1fr; padding:16px; }.machine-heading { flex-wrap:wrap; }.machine-heading .observation { overflow-wrap:anywhere; } }