:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--background:#09110f;--panel:#101a17;--panel-raised:#15211d;--border:#bfe7d71f;--border-strong:#bfe7d733;--text:#edf7f2;--muted:#93a8a0;--accent:#75e6b8;--accent-strong:#34c98d;--warning:#ffc96b;--error:#ff837d;--sidebar-width:248px;background:var(--background);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body{min-height:100%}body{background:radial-gradient(circle at 78% -10%, #3cad811f, transparent 32rem), var(--background);margin:0}button,a{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh}.sidebar{width:var(--sidebar-width);border-right:1px solid var(--border);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#0b1411e0;flex-direction:column;padding:28px 20px;display:flex;position:fixed;inset:0 auto 0 0}.brand{align-items:center;gap:12px;margin-bottom:42px;display:flex}.brand-mark{width:38px;height:38px;color:var(--accent);background:linear-gradient(145deg,#75e6b833,#75e6b80a);border:1px solid #75e6b852;border-radius:11px;place-items:center;font-weight:800;display:grid}.brand strong,.brand small{display:block}.brand strong{letter-spacing:.01em}.brand small{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin-top:2px;font-size:.72rem}.nav-link{color:var(--muted);border:1px solid #0000;border-radius:10px;align-items:center;gap:12px;padding:12px 14px;font-size:.9rem;font-weight:600;text-decoration:none;display:flex}.nav-link--active{border-color:var(--border);color:var(--text);background:#75e6b814}.nav-indicator{background:var(--accent);border-radius:999px;width:7px;height:7px;box-shadow:0 0 16px #75e6b88c}.sidebar-note{color:#677a73;margin:auto 4px 0;font-size:.74rem}.main-content{min-height:100vh;margin-left:var(--sidebar-width)}.page{width:min(1080px,100% - 64px);margin:0 auto;padding:72px 0}.page-header,.status-summary,.status-footer,.service-card__header{justify-content:space-between;align-items:center;gap:24px;display:flex}.page-header{align-items:flex-end;margin-bottom:32px}.eyebrow{color:var(--accent);letter-spacing:.16em;text-transform:uppercase;margin:0 0 10px;font-size:.72rem;font-weight:800}h1,h2,h3,p{margin-top:0}h1{letter-spacing:-.045em;margin-bottom:12px;font-size:clamp(2rem,5vw,3.25rem);font-weight:650}h2{letter-spacing:-.025em;margin-bottom:9px;font-size:clamp(1.25rem,3vw,1.7rem)}h3{margin-bottom:6px;font-size:1rem}.page-header p:last-child,.status-summary p:last-child,.status-panel--loading p:last-child,.service-card p{color:var(--muted);margin-bottom:0;line-height:1.6}.environment-badge,.summary-badge,.service-state{letter-spacing:.05em;text-transform:uppercase;border-radius:999px;flex:none;font-size:.72rem;font-weight:750}.environment-badge{border:1px solid var(--border-strong);color:var(--muted);padding:9px 12px}.status-panel{border:1px solid var(--border);background:linear-gradient(145deg,#15211df5,#0d1714f5);border-radius:18px;overflow:hidden;box-shadow:0 30px 80px #00000038}.status-summary{border-bottom:1px solid var(--border);padding:28px 30px}.summary-badge{padding:9px 12px}.summary-badge--healthy{color:var(--accent);background:#75e6b81a}.summary-badge--warning{color:var(--warning);background:#ffc96b1a}.summary-badge--error{color:var(--error);background:#ff837d1a}.service-grid{background:var(--border);grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;display:grid}.service-card{background:var(--panel);min-width:0;padding:28px 30px}.service-card__header{margin-bottom:44px}.service-icon{border:1px solid var(--border-strong);width:42px;height:42px;color:var(--accent);letter-spacing:.05em;border-radius:12px;place-items:center;font-size:.68rem;font-weight:850;display:grid}.service-icon--database{color:#a8c8ff}.service-state{align-items:center;gap:7px;display:inline-flex}.service-state--available{color:var(--accent)}.service-state--unavailable{color:var(--error)}.state-dot{background:currentColor;border-radius:999px;width:6px;height:6px;box-shadow:0 0 12px}.service-meta{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:24px 0 0;display:grid}.service-meta div{min-width:0}.service-meta dt,.status-footer span{color:var(--muted);font-size:.72rem}.service-meta dd{text-overflow:ellipsis;margin:5px 0 0;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.78rem;overflow:hidden}.status-footer{border-top:1px solid var(--border);padding:20px 30px}.status-footer span,.status-footer strong{display:block}.status-footer strong{margin-top:5px;font-size:.8rem;font-weight:600}.primary-action,.secondary-action{border-radius:9px;font-size:.8rem;font-weight:700}.primary-action{background:var(--accent);color:#07130e;border:0;margin:0 30px 28px;padding:11px 15px}.secondary-action{border:1px solid var(--border-strong);color:var(--text);background:0 0;padding:9px 12px}.primary-action:hover,.secondary-action:hover{filter:brightness(1.08)}.status-panel--loading{align-items:center;gap:24px;min-height:230px;padding:30px;display:flex}.loading-mark{border:1px solid var(--border);background:#75e6b80d;border-radius:12px;align-items:center;gap:5px;height:42px;padding:0 14px;display:flex}.loading-mark span{background:var(--accent);border-radius:999px;width:5px;height:5px;animation:1.15s ease-in-out infinite pulse}.loading-mark span:nth-child(2){animation-delay:.14s}.loading-mark span:nth-child(3){animation-delay:.28s}@keyframes pulse{0%,to{opacity:.28;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}@media (max-width:820px){.sidebar{border-right:0;border-bottom:1px solid var(--border);width:auto;height:auto;padding:18px 24px;position:static}.brand{margin-bottom:18px}.sidebar-note{display:none}.main-content{margin-left:0}.page{width:min(100% - 40px,680px);padding:44px 0}}@media (max-width:600px){.page-header,.status-summary,.status-footer{flex-direction:column;align-items:flex-start}.service-grid{grid-template-columns:1fr}.status-summary,.service-card,.status-footer{padding-left:22px;padding-right:22px}.secondary-action{width:100%}}@media (prefers-reduced-motion:reduce){.loading-mark span{animation:none}}
