:root{--bg: #0a0e14;--bg-elev: #111722;--bg-elev-2: #18202d;--border: #243042;--border-strong: #33445c;--text: #d7e0ec;--text-dim: #8b97a8;--text-faint: #5a6678;--accent: #38bdf8;--accent-dim: #0e7490;--ok: #22c55e;--degraded: #f59e0b;--down: #ef4444;--error: #ef4444;--unknown: #6b7280;--shadow: 0 4px 24px rgba(0, 0, 0, .45);--radius: 10px;--mono: "SFMono-Regular", "JetBrains Mono", Consolas, "Liberation Mono", Menlo, monospace;--sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:var(--accent)}button{font-family:inherit;cursor:pointer}.app-shell{display:flex;flex-direction:column;height:100vh}.app-header{display:flex;align-items:center;gap:1.5rem;padding:.75rem 1.25rem;background:var(--bg-elev);border-bottom:1px solid var(--border);flex-shrink:0}.app-brand{font-weight:700;letter-spacing:.04em;color:var(--text);text-transform:uppercase;font-size:.95rem}.app-brand .accent{color:var(--accent)}.rafai-logo{display:inline-flex;align-items:center;gap:9px}.rafai-word{font-weight:800;letter-spacing:.5px;color:var(--text);line-height:1;text-transform:none}.rafai-word .rafai-ai{color:var(--accent)}.login-brand{display:flex;justify-content:center;margin:0 0 6px}.app-tabs{display:flex;gap:.25rem}.app-tab{background:transparent;border:1px solid transparent;color:var(--text-dim);padding:.4rem .9rem;border-radius:8px;font-size:.9rem;transition:all .12s ease}.app-tab:hover{color:var(--text);background:var(--bg-elev-2)}.app-tab.active{color:var(--bg);background:var(--accent);font-weight:600}.app-header-spacer{flex:1}.role-badge{display:inline-flex;align-items:center;text-transform:uppercase;letter-spacing:.05em;font-size:.7rem;font-weight:700;padding:.2rem .55rem;border-radius:999px;margin-right:.75rem;border:1px solid var(--border-strong)}.role-badge.role-admin{background:#38bdf826;color:var(--accent);border-color:var(--accent-dim)}.role-badge.role-viewer{background:var(--bg-elev-2);color:var(--text-dim)}.app-logout{background:transparent;border:1px solid var(--border-strong);color:var(--text-dim);padding:.35rem .75rem;border-radius:8px;font-size:.82rem}.app-logout:hover{color:var(--text);border-color:var(--accent)}.app-body{flex:1;overflow:auto;min-height:0}.login-gate{display:flex;align-items:center;justify-content:center;height:100vh}.login-card{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:2rem;width:360px;box-shadow:var(--shadow)}.login-card h1{margin:0 0 .25rem;font-size:1.1rem;letter-spacing:.04em}.login-card p{color:var(--text-dim);margin:0 0 1.25rem;font-size:.85rem}.login-card label{display:block;font-size:.8rem;color:var(--text-dim);margin-bottom:.35rem}.input,.login-card input{width:100%;background:var(--bg);border:1px solid var(--border-strong);border-radius:8px;color:var(--text);padding:.55rem .7rem;font-size:.9rem;font-family:inherit}.input:focus,.login-card input:focus{outline:none;border-color:var(--accent)}.btn-primary{background:var(--accent);border:none;color:var(--bg);font-weight:600;padding:.55rem 1rem;border-radius:8px;font-size:.9rem}.btn-primary:hover{filter:brightness(1.08)}.btn-secondary{background:var(--bg-elev-2);border:1px solid var(--border-strong);color:var(--text);padding:.4rem .8rem;border-radius:8px;font-size:.85rem}.btn-secondary:hover{border-color:var(--accent)}.btn-danger{background:transparent;border:1px solid var(--down);color:var(--down);padding:.3rem .6rem;border-radius:6px;font-size:.8rem}.btn-danger:hover{background:#ef44441f}.login-error{color:var(--down);font-size:.82rem;margin-top:.6rem}.login-actions{margin-top:1rem}.login-tabs{display:flex;gap:.4rem;margin-bottom:1.1rem}.login-tab{flex:1;background:var(--bg);border:1px solid var(--border-strong);color:var(--text-dim);padding:.4rem .5rem;border-radius:8px;font-size:.8rem;cursor:pointer}.login-tab.active{border-color:var(--accent);color:var(--text);background:var(--bg-elev-2)}.status-chip{display:inline-flex;align-items:center;font-size:.78rem;padding:.25rem .6rem;border-radius:999px;border:1px solid var(--border-strong);color:var(--text-dim);background:var(--bg-elev-2)}.status-chip.on{color:var(--ok, #22c55e);border-color:var(--accent-dim)}.tab-pane{padding:1.25rem}.tab-header{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.tab-title{font-size:1.05rem;font-weight:600;margin:0}.tab-meta{color:var(--text-dim);font-size:.82rem}.spacer{flex:1}.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.15rem .55rem;border-radius:999px;font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.badge:before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}.badge.ok{color:var(--ok);background:#22c55e1f}.badge.degraded{color:var(--degraded);background:#f59e0b1f}.badge.down,.badge.error{color:var(--down);background:#ef44441f}.badge.unknown{color:var(--unknown);background:#6b72801f}.summary-row{display:flex;gap:.75rem;margin-bottom:1rem;flex-wrap:wrap}.summary-pill{background:var(--bg-elev);border:1px solid var(--border);border-radius:8px;padding:.5rem .9rem;font-size:.82rem}.summary-pill .num{font-size:1.2rem;font-weight:700;margin-right:.4rem}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.85rem}.service-card{background:var(--bg-elev);border:1px solid var(--border);border-left-width:4px;border-radius:var(--radius);padding:.85rem 1rem}.service-card.ok{border-left-color:var(--ok)}.service-card.degraded{border-left-color:var(--degraded)}.service-card.down,.service-card.error{border-left-color:var(--down)}.service-card.unknown{border-left-color:var(--unknown)}.service-card-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.4rem}.service-name{font-weight:600}.service-kind{font-size:.72rem;color:var(--text-faint);text-transform:uppercase;letter-spacing:.05em}.service-meta{display:flex;justify-content:space-between;gap:.5rem;font-size:.8rem;color:var(--text-dim);margin-top:.3rem}.service-endpoint{font-family:var(--mono);font-size:.75rem;color:var(--text-faint);word-break:break-all;margin-top:.35rem}.service-detail{font-size:.78rem;color:var(--text-dim);margin-top:.3rem}.kind-section{margin-bottom:1.75rem}.kind-header{display:flex;align-items:center;gap:.75rem;margin-bottom:.6rem}.kind-title{font-size:.95rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--accent)}.ops-table{width:100%;border-collapse:collapse;background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.ops-table th,.ops-table td{text-align:left;padding:.55rem .7rem;border-bottom:1px solid var(--border);font-size:.83rem;vertical-align:middle}.ops-table th{background:var(--bg-elev-2);color:var(--text-dim);font-weight:600;font-size:.74rem;text-transform:uppercase;letter-spacing:.04em}.ops-table tr:last-child td{border-bottom:none}.ops-table tr.inactive{opacity:.55}.cap-chips{display:flex;flex-wrap:wrap;gap:.25rem}.chip{background:var(--bg-elev-2);border:1px solid var(--border-strong);border-radius:999px;padding:.05rem .45rem;font-size:.7rem;color:var(--text-dim)}.row-actions{display:flex;gap:.3rem;align-items:center;flex-wrap:wrap}.icon-btn{background:var(--bg-elev-2);border:1px solid var(--border-strong);color:var(--text-dim);border-radius:6px;padding:.2rem .45rem;font-size:.78rem;line-height:1}.icon-btn:hover:not(:disabled){color:var(--text);border-color:var(--accent)}.icon-btn:disabled{opacity:.35;cursor:not-allowed}.toggle{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;color:var(--text-dim);background:transparent;border:1px solid var(--border-strong);border-radius:6px;padding:.2rem .5rem}.toggle.on{color:var(--ok);border-color:var(--ok)}.test-result{font-size:.74rem;font-family:var(--mono)}.test-result.ok{color:var(--ok)}.test-result.fail{color:var(--down)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:flex-start;justify-content:center;padding:4vh 1rem;overflow:auto;z-index:100}.modal{background:var(--bg-elev);border:1px solid var(--border-strong);border-radius:var(--radius);width:520px;max-width:100%;box-shadow:var(--shadow)}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;border-bottom:1px solid var(--border)}.modal-title{font-weight:600}.modal-body{padding:1.1rem;display:grid;gap:.8rem}.modal-foot{display:flex;justify-content:flex-end;gap:.5rem;padding:.9rem 1.1rem;border-top:1px solid var(--border)}.field label{display:block;font-size:.78rem;color:var(--text-dim);margin-bottom:.3rem}.field .hint{font-size:.7rem;color:var(--text-faint);margin-top:.2rem}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.checkbox-field{display:flex;align-items:center;gap:.5rem;font-size:.85rem}.checkbox-field input{width:auto}.decision-panel{background:var(--bg-elev);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;margin-bottom:1.5rem}.decision-panel h3{margin:0 0 .5rem;font-size:.9rem}.decision-base-urls{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:.75rem;font-size:.8rem}.decision-base-urls .bu{color:var(--text-dim)}.decision-base-urls .bu b{color:var(--accent)}.decision-list{display:grid;gap:.3rem}.decision-row{display:flex;align-items:center;gap:.6rem;font-size:.8rem}.decision-row .when{font-family:var(--mono);color:var(--text-dim);font-size:.76rem}.complexity-tag{font-size:.7rem;font-weight:700;padding:.05rem .45rem;border-radius:4px;letter-spacing:.04em;background:var(--bg-elev-2);color:var(--accent);white-space:nowrap}.state-msg{padding:2rem;text-align:center;color:var(--text-dim)}.state-msg.error{color:var(--down)}.banner-error{background:#ef44441a;border:1px solid var(--down);color:var(--down);padding:.55rem .9rem;border-radius:8px;font-size:.82rem;margin-bottom:.9rem}.refresh-controls{display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:var(--text-dim)}.refresh-controls select{background:var(--bg);border:1px solid var(--border-strong);color:var(--text);border-radius:6px;padding:.25rem .4rem;font-size:.82rem}.mono{font-family:var(--mono);font-size:.78rem}.banner-note{background:var(--bg-elev);border:1px solid var(--border);border-left:3px solid var(--accent);color:var(--text-dim);padding:.55rem .9rem;border-radius:8px;font-size:.8rem;margin-bottom:1rem}.matrix-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius)}.matrix-table{border-collapse:collapse;width:100%;font-size:.8rem}.matrix-table th,.matrix-table td{border:1px solid var(--border);padding:.45rem .6rem;text-align:center}.matrix-table thead th{background:var(--bg-elev-2);color:var(--text-dim);font-weight:600;font-size:.74rem;white-space:nowrap}.matrix-corner{text-align:left}.matrix-rowhead{background:var(--bg-elev);text-align:left;white-space:nowrap;display:flex;align-items:baseline;gap:.4rem}.role-label{font-weight:600;color:var(--text)}.role-level{font-family:var(--mono);font-size:.68rem;color:var(--text-faint)}.matrix-cell.has{color:var(--ok);font-weight:700}.matrix-cell.none{color:var(--text-faint)}.matrix-count{font-size:.62rem;color:var(--text-faint);margin-left:.2rem;vertical-align:super}.schedule-list{display:flex;flex-direction:column;gap:.4rem}.schedule-row{display:grid;grid-template-columns:4rem 1fr 2fr;gap:.75rem;align-items:baseline;background:var(--bg-elev);border:1px solid var(--border);border-radius:8px;padding:.5rem .75rem;font-size:.82rem}.schedule-time{color:var(--accent);font-weight:700}.schedule-job{font-weight:600;color:var(--text)}.schedule-detail{color:var(--text-dim);font-size:.78rem}@media (max-width: 720px){.schedule-row{grid-template-columns:4rem 1fr}.schedule-detail{grid-column:1 / -1}}.graph-tab{position:relative;height:100%}.graph-canvas-wrap{position:absolute;top:0;right:0;bottom:0;left:0}.graph-overlay{position:absolute;top:1rem;left:1rem;z-index:10;pointer-events:none}.graph-overlay .panel{pointer-events:auto;background:#111722db;border:1px solid var(--border);border-radius:8px;padding:.6rem .8rem;font-size:.8rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.graph-legend{display:grid;gap:.25rem;margin-top:.5rem}.legend-item{display:flex;align-items:center;gap:.4rem;font-size:.76rem;color:var(--text-dim)}.legend-dot{width:9px;height:9px;border-radius:50%}.graph-tooltip{position:absolute;z-index:20;pointer-events:none;background:#0a0e14f2;border:1px solid var(--border-strong);border-radius:6px;padding:.4rem .6rem;font-size:.78rem;max-width:260px;transform:translate(12px,12px)}.graph-tooltip .tt-name{font-weight:600}.graph-tooltip .tt-type{color:var(--text-faint);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em}