*{box-sizing:border-box}html,body{background:var(--imr-color-surface-canvas);min-height:100vh;color:var(--imr-color-content-primary);font:var(--imr-typography-body-large);font-family:var(--imr-font-family-text), var(--imr-font-family-fallback);margin:0}h1,h2,h3,.display{font-family:var(--imr-font-family-display), var(--imr-font-family-fallback);font-weight:var(--imr-font-weight-bold);margin:0}button{font-family:var(--imr-font-family-text), var(--imr-font-family-fallback);cursor:pointer;border:none;border-radius:12px}.badge-sim{background:var(--imr-color-feedback-warning-surface);color:var(--imr-color-feedback-warning-content);border:1px solid var(--imr-color-feedback-warning-border);font-size:var(--imr-font-size-12);font-weight:var(--imr-font-weight-semibold);letter-spacing:var(--imr-font-tracking-050);border-radius:999px;padding:2px 10px;display:inline-block}.launcher{flex-direction:column;justify-content:center;align-items:center;gap:40px;min-height:100vh;padding:48px;display:flex}.launcher img.logo{height:56px}.launcher h1{font-size:var(--imr-font-size-45);text-align:center;color:var(--imr-color-content-primary)}.launcher .grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;width:min(1100px,100%);display:grid}.launcher a.tile{background:var(--imr-color-surface-raised);border:1px solid var(--imr-color-border-default);color:var(--imr-color-content-primary);border-radius:16px;flex-direction:column;gap:8px;padding:28px 24px;text-decoration:none;transition:transform .12s,border-color .12s;display:flex}.launcher a.tile:hover,.launcher a.tile:focus-visible{border-color:var(--imr-color-border-focus);transform:translateY(-2px)}.launcher a.tile .tile-title{font-family:var(--imr-font-family-display), var(--imr-font-family-fallback);font-size:var(--imr-font-size-24);color:var(--imr-color-content-brand)}.launcher a.tile .tile-desc{color:var(--imr-color-content-secondary);font-size:var(--imr-font-size-14)}.launcher a.tile.primary{background:var(--imr-color-surface-brand);border-color:var(--imr-color-surface-brand)}.launcher a.tile.primary .tile-title,.launcher a.tile.primary .tile-desc{color:var(--imr-color-content-on-brand)}.page-header{border-bottom:1px solid var(--imr-color-border-default);background:var(--imr-color-surface-base);align-items:center;gap:16px;padding:14px 24px;display:flex}.page-header img{height:32px}.page-header .title{font-family:var(--imr-font-family-display), var(--imr-font-family-fallback);font-size:var(--imr-font-size-22)}.page-header .spacer{flex:1}.status-chip{font-weight:var(--imr-font-weight-bold);font-size:var(--imr-font-size-16);letter-spacing:var(--imr-font-tracking-050);border-radius:999px;align-items:center;gap:8px;padding:6px 16px;display:inline-flex}.status-chip:before{content:"";background:currentColor;border-radius:50%;width:10px;height:10px}.status-SEHAT{background:var(--imr-color-feedback-success-surface);color:var(--imr-color-feedback-success-content)}.status-TERDEGRADASI,.status-BATAS_KUORUM{background:var(--imr-color-feedback-warning-surface);color:var(--imr-color-feedback-warning-content)}.status-WRITE_TIDAK_TERSEDIA,.status-TERPARTISI{background:var(--imr-color-feedback-danger-surface);color:var(--imr-color-feedback-danger-content)}.status-SINKRONISASI,.status-VALIDASI{background:var(--imr-color-feedback-info-surface);color:var(--imr-color-feedback-info-content)}.app-main{flex-direction:column;gap:24px;max-width:880px;margin:0 auto;padding:32px 24px 64px;display:flex}.service-banner{border:1px solid var(--imr-color-border-default);background:var(--imr-color-surface-raised);border-radius:16px;align-items:center;gap:16px;padding:16px 20px;display:flex}.service-banner .note{color:var(--imr-color-content-secondary);font-size:var(--imr-font-size-14)}.card{background:var(--imr-color-surface-raised);border:1px solid var(--imr-color-border-default);border-radius:16px;padding:24px}.card h2{font-size:var(--imr-font-size-24);margin-bottom:16px}.form-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.form-row select{border:1px solid var(--imr-color-border-strong);background:var(--imr-color-surface-base);min-width:240px;color:var(--imr-color-content-primary);font-size:var(--imr-font-size-16);border-radius:12px;flex:1;padding:12px 16px}.btn{font-size:var(--imr-font-size-16);font-weight:var(--imr-font-weight-semibold);padding:12px 24px}.btn-primary{background:var(--imr-color-action-primary-background-default);color:var(--imr-color-action-primary-content-default)}.btn-primary:hover{background:var(--imr-color-action-primary-background-hover)}.btn-secondary{background:var(--imr-color-action-secondary-background-default);color:var(--imr-color-action-secondary-content-default)}.btn-secondary:hover{background:var(--imr-color-action-secondary-background-hover)}.tx-list{flex-direction:column;gap:10px;display:flex}.tx-item{border:1px solid var(--imr-color-border-default);background:var(--imr-color-surface-base);font-size:var(--imr-font-size-14);border-radius:12px;grid-template-columns:auto 1fr auto;gap:4px 16px;padding:12px 16px;display:grid}.tx-item .tx-id{font-weight:var(--imr-font-weight-semibold)}.tx-item .tx-reason{color:var(--imr-color-content-secondary);grid-column:1/-1}.tx-item[data-outcome=COMMITTED]{border-left:4px solid var(--imr-color-feedback-success-border)}.tx-item[data-outcome=UNAVAILABLE]{border-left:4px solid var(--imr-color-feedback-danger-border)}.tx-outcome-COMMITTED{color:var(--imr-color-feedback-success-content);font-weight:var(--imr-font-weight-bold)}.tx-outcome-UNAVAILABLE{color:var(--imr-color-feedback-danger-content);font-weight:var(--imr-font-weight-bold)}.monitor{background:var(--imr-color-surface-canvas);flex-direction:column;height:100vh;display:flex;overflow:hidden}.monitor-grid{flex:1;grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(480px,3fr) minmax(340px,1fr);gap:16px;min-height:0;padding:16px 24px 20px;display:grid}.panel{background:var(--imr-color-surface-raised);border:1px solid var(--imr-color-border-default);border-radius:16px;min-height:0;padding:16px 20px}.panel h3{font-size:var(--imr-font-size-14);letter-spacing:var(--imr-font-tracking-050);text-transform:uppercase;color:var(--imr-color-content-muted);margin-bottom:12px}.kpi-row{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;display:grid}.kpi{background:var(--imr-color-surface-raised);border:1px solid var(--imr-color-border-default);border-radius:16px;flex-direction:column;gap:6px;padding:14px 18px;display:flex}.kpi .kpi-label{font-size:var(--imr-font-size-12);letter-spacing:var(--imr-font-tracking-050);text-transform:uppercase;color:var(--imr-color-content-muted)}.kpi .kpi-value{font-family:var(--imr-font-family-display), var(--imr-font-family-fallback);font-size:var(--imr-font-size-32);line-height:1.1}.kpi .kpi-sub{font-size:var(--imr-font-size-12);color:var(--imr-color-content-secondary)}.topology-panel{flex-direction:column;display:flex}.topology-panel svg{flex:1;width:100%;min-height:0}.side-col{flex-direction:column;gap:16px;min-height:0;display:flex}.explain-body{font-size:var(--imr-font-size-16);line-height:1.5}.explain-title{font-family:var(--imr-font-family-display), var(--imr-font-family-fallback);font-size:var(--imr-font-size-22);color:var(--imr-color-content-brand);margin-bottom:8px}.timeline{flex-direction:column;flex:1;gap:8px;min-height:0;display:flex;overflow-y:auto}.timeline-item{background:var(--imr-color-surface-base);border-left:3px solid var(--imr-color-border-strong);font-size:var(--imr-font-size-12);border-radius:10px;grid-template-columns:auto 1fr;gap:2px 12px;padding:8px 12px;display:grid}.timeline-item .tl-label{font-weight:var(--imr-font-weight-bold)}.timeline-item .tl-detail{color:var(--imr-color-content-secondary);grid-column:1/-1}.timeline-item[data-kind=skenario]{border-left-color:var(--imr-color-content-brand)}.timeline-item[data-kind=infra]{border-left-color:var(--imr-color-feedback-danger-border)}.timeline-item[data-kind=pemulihan]{border-left-color:var(--imr-color-feedback-info-border)}.timeline-item[data-kind=transaksi]{border-left-color:var(--imr-color-feedback-success-border)}.scenario-bar{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;display:grid}.scenario-bar button{font-size:var(--imr-font-size-14);font-weight:var(--imr-font-weight-semibold);background:var(--imr-color-action-secondary-background-default);color:var(--imr-color-action-secondary-content-default);border:1px solid var(--imr-color-border-default);padding:12px 10px}.scenario-bar button:hover{background:var(--imr-color-action-secondary-background-hover)}.scenario-bar button.danger{background:var(--imr-color-feedback-danger-surface);color:var(--imr-color-feedback-danger-content);border-color:var(--imr-color-feedback-danger-border)}.scenario-bar button.recover{background:var(--imr-color-feedback-info-surface);color:var(--imr-color-feedback-info-content);border-color:var(--imr-color-feedback-info-border)}.scenario-bar button .key{background:var(--imr-color-surface-inverse);color:var(--imr-color-content-inverse);font-size:var(--imr-font-size-11);border-radius:6px;margin-right:6px;padding:1px 7px;display:inline-block}.node-shape{stroke-width:2px}.node-UP{fill:var(--imr-color-feedback-success-surface);stroke:var(--imr-color-feedback-success-border)}.node-DOWN{fill:var(--imr-color-feedback-danger-surface);stroke:var(--imr-color-feedback-danger-border)}.node-SYNCING{fill:var(--imr-color-feedback-info-surface);stroke:var(--imr-color-feedback-info-border)}.node-label{font-family:var(--imr-font-family-display), var(--imr-font-family-fallback);fill:var(--imr-color-content-primary);text-anchor:middle;font-size:18px}.node-status-label{text-anchor:middle;fill:var(--imr-color-content-secondary);font-size:11px}.site-box{fill:none;stroke:var(--imr-color-border-strong);stroke-dasharray:6 6;rx:18px}.site-label{font-family:var(--imr-font-family-display), var(--imr-font-family-fallback);fill:var(--imr-color-content-muted);letter-spacing:1px;font-size:16px}.tier-label{fill:var(--imr-color-content-muted);text-anchor:middle;letter-spacing:1px;font-size:12px}.flow-line{stroke-width:2.5px;fill:none}.flow-ok{stroke:var(--imr-color-feedback-success-border);stroke-dasharray:8 8;animation:.9s linear infinite flow}.flow-idle{stroke:var(--imr-color-border-strong);stroke-dasharray:8 8}.flow-down{stroke:var(--imr-color-feedback-danger-border);stroke-dasharray:3 7}.flow-sync{stroke:var(--imr-color-feedback-info-border);stroke-dasharray:8 8;animation:.5s linear infinite flow}@keyframes flow{to{stroke-dashoffset:-16px}}@media (prefers-reduced-motion:reduce){.flow-ok,.flow-sync{animation:none}.launcher a.tile{transition:none}}.link-cut{stroke:var(--imr-color-feedback-danger-border);stroke-width:3px}.pulse{animation:1.4s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.55}}@media (prefers-reduced-motion:reduce){.pulse{animation:none}}