:root{font-family:system-ui,-apple-system,sans-serif;line-height:1.5;color:#e8e8e8;background:#0f1115;--surface: #1a1f28;--border: #2a2f3a;--muted: #9ca3af;--accent: #3b82f6;--accent-muted: #374151;--ok: #6ee7a0;--warn: #e7d46e;--err: #e76e6e;--radius: 8px;--space: 1rem}*{box-sizing:border-box}body{margin:0}a{color:#7eb8ff}.app-shell{max-width:1100px;margin:0 auto;padding:1.25rem 1.5rem 2rem}.app-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem;padding-bottom:1rem;border-bottom:1px solid var(--border)}.app-brand{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}.app-title{font-weight:700;font-size:1.1rem}.env-pill{font-size:.75rem;padding:.15rem .5rem;border-radius:999px;background:var(--accent-muted);color:var(--muted);text-transform:uppercase}.sign-out-btn{margin:0}.app-nav{display:flex;gap:.5rem 1rem;flex-wrap:wrap;margin-bottom:1.5rem}.nav-link{text-decoration:none;color:var(--muted);padding:.35rem .5rem;border-radius:6px}.nav-link:hover{color:#e8e8e8}.nav-link.active{color:#e8e8e8;background:var(--surface)}.app-main{min-height:40vh}.page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.page-header h1{margin:0 0 .25rem;font-size:1.5rem}.page-description{margin:0;color:var(--muted);font-size:.95rem}.page-header-actions{display:flex;gap:.5rem;flex-wrap:wrap}.layout{max-width:960px;margin:0 auto;padding:1.5rem}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.25rem;margin-bottom:1rem}.status-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin-bottom:1rem}.status-card h3{margin:0 0 .5rem;font-size:.85rem;color:var(--muted);font-weight:500;text-transform:uppercase;letter-spacing:.03em}.status-card p{margin:0;font-size:.95rem}.badge{display:inline-block;padding:.2rem .6rem;border-radius:4px;font-size:.85rem;font-weight:600}.badge.ok{background:#1a3d2e;color:var(--ok)}.badge.warn{background:#3d341a;color:var(--warn)}.badge.err{background:#3d1a1a;color:var(--err)}.badge.neutral{background:#2a3140;color:#c5cdd8}.alert{padding:.75rem 1rem;border-radius:var(--radius);margin-bottom:1rem;border:1px solid var(--border)}.alert strong{display:block;margin-bottom:.25rem}.alert-info{background:#1a2538;border-color:#2a4a6e}.alert-success{background:#1a3d2e;border-color:#2a5e40}.alert-warning{background:#3d341a;border-color:#5e502a}.alert-error{background:#3d1a1a;border-color:#5e2a2a}.alert-action{display:inline-block;margin-top:.5rem;font-weight:600}button{background:var(--accent);color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;margin-right:.5rem;margin-top:.5rem;display:inline-flex;align-items:center;gap:.4rem}button.secondary{background:var(--accent-muted)}button:disabled{opacity:.5;cursor:not-allowed}.spinner{width:.9rem;height:.9rem;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}input,textarea{width:100%;padding:.5rem;border-radius:6px;border:1px solid #374151;background:#0f1115;color:#e8e8e8;margin-top:.25rem}label{display:block;margin-top:.75rem;font-size:.9rem}.login-card--with-vnc .login-vnc-panel{margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid #374151}.login-vnc-panel .vnc-frame{margin-top:.5rem}.vnc-frame{width:100%;height:min(70vh,720px);min-height:480px;border:1px solid #374151;border-radius:var(--radius);margin-top:1rem;background:#000}pre,.result-block{overflow:auto;background:#0f1115;padding:.75rem;border-radius:6px;font-size:.85rem;margin-top:.75rem}ol.steps{padding-left:1.25rem;margin:1rem 0}ol.steps li{margin-bottom:.6rem;color:var(--muted)}ol.steps li.step-done{color:var(--ok);list-style-type:"✓ "}ol.steps li.step-active{color:#e8e8e8;font-weight:600}.url-line{font-size:.85rem;word-break:break-all;color:var(--muted)}.actions-row{display:flex;flex-wrap:wrap;gap:.25rem;margin-top:.75rem}.table-wrap{overflow-x:auto}table.data-table{width:100%;border-collapse:collapse;font-size:.9rem}table.data-table th,table.data-table td{text-align:left;padding:.5rem .75rem;border-bottom:1px solid var(--border)}.tabs{display:flex;gap:.5rem;margin-bottom:1rem}.tab{background:transparent;border:1px solid var(--border);color:var(--muted);margin:0}.tab.active{background:var(--surface);color:#e8e8e8;border-color:var(--accent)}.playground-images{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.75rem}.playground-images img{max-width:200px;border-radius:6px;border:1px solid var(--border)}.auth-loading{padding:3rem;text-align:center;color:var(--muted)}.toast{margin-top:.75rem;font-size:.9rem}.toast-success{color:var(--ok)}.toast-error{color:var(--err)}.signin-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem}.signin-panel{width:100%;max-width:420px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:2rem 1.75rem;box-shadow:0 8px 32px #00000059}.signin-header{text-align:center;margin-bottom:1.75rem}.signin-header h1{margin:0 0 .35rem;font-size:1.35rem;font-weight:700}.signin-subtitle{margin:0;font-size:.9rem;color:var(--muted)}.signin-form label{margin-top:1rem}.signin-form label:first-of-type{margin-top:0}.signin-show-password{display:flex;align-items:center;gap:.5rem;margin-top:.75rem;font-size:.85rem;color:var(--muted);cursor:pointer}.signin-show-password input[type=checkbox]{width:auto;margin:0}.signin-submit{width:100%;justify-content:center;margin-top:1.25rem;margin-right:0}.signin-footer{margin:1.25rem 0 0;text-align:center;font-size:.8rem;color:var(--muted)}@media (max-width: 640px){.app-shell{padding:1rem}.app-nav{flex-direction:column;gap:.25rem}}
