:root { color-scheme: light; font-family: system-ui, sans-serif; color: #16233b; background: #edf2f8; }
body { margin: 0; padding: 2rem 1rem; }
.card { box-sizing: border-box; max-width: 38rem; margin: 3rem auto; padding: 2rem; background: white; border: 1px solid #d8e1ec; border-radius: 1rem; box-shadow: 0 1rem 3rem #24344e12; }
.panel-card { max-width: 66rem; }
h1 { margin-top: 0; }
form { display: grid; gap: 1.2rem; }
label { display: grid; gap: .35rem; font-weight: 600; }
input { font: inherit; padding: .7rem; border: 1px solid #8998ad; border-radius: .4rem; }
button { font: inherit; font-weight: 700; padding: .7rem 1rem; border: 0; border-radius: .4rem; color: white; background: #114aa0; cursor: pointer; }
button:disabled { opacity: .6; cursor: wait; }
header { display: flex; justify-content: space-between; align-items: start; gap: 1rem; }
dl { display: grid; grid-template-columns: 13rem 1fr; gap: .6rem 1rem; }
dt { font-weight: 700; }
dd { margin: 0; overflow-wrap: anywhere; }
.note { color: #516076; font-size: .9rem; }
.table-scroll { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; min-width: 42rem; }
th, td { text-align: left; padding: .65rem; border-bottom: 1px solid #d8e1ec; }
th { background: #edf2f8; }
.check { display: flex; align-items: center; gap: .6rem; }
.check input { width: 1.2rem; height: 1.2rem; }
#schedule, #reauth { margin-top: 2rem; padding-top: 1.3rem; border-top: 1px solid #d8e1ec; }
[hidden] { display: none !important; }
@media (max-width: 35rem) { .card { padding: 1.2rem; } dl { grid-template-columns: 1fr; } dd { margin-bottom: .5rem; } }

/* Consola: estilos aislados para no alterar el acceso con contraseña y TOTP. */
.panel-page { padding: 0; background: #f3f6fa; color: #17263b; }
.panel-page .app-shell { max-width: 1320px; min-height: 100vh; margin: 0 auto; padding: 0 28px 64px; }
.panel-page .app-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 88px; border-bottom: 1px solid #dce4ed; }
.panel-page .brand, .panel-page .header-actions, .panel-page .surface-heading { display: flex; align-items: center; gap: 14px; }
.panel-page .brand strong, .panel-page .brand small { display: block; }
.panel-page .brand strong { color: #102d4e; font-size: 1.12rem; letter-spacing: -.025em; }
.panel-page .brand small, .panel-page .header-caption { color: #61748a; font-size: .78rem; font-weight: 650; letter-spacing: .035em; }
.panel-page .brand-mark { display: grid; place-items: center; width: 42px; height: 42px; background: #0d467d; color: white; border-radius: 12px; box-shadow: 0 7px 18px #0d467d27; }
.panel-page .brand-mark svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.panel-page button { border-radius: 9px; transition: background .16s ease, box-shadow .16s ease, transform .16s ease; }
.panel-page button:not(:disabled):hover { transform: translateY(-1px); }
.panel-page button:focus-visible, .panel-page input:focus-visible { outline: 3px solid #78a8ea; outline-offset: 2px; }
.panel-page .button-quiet, .panel-page .button-secondary, .panel-page .icon-button { color: #174778; background: #e8f0f9; }
.panel-page .button-quiet:hover, .panel-page .button-secondary:hover, .panel-page .icon-button:hover { background: #d8e9fb; }
.panel-page .button-quiet { font-size: .85rem; padding: .65rem .85rem; }
.panel-page .top-nav { display: flex; align-items: center; gap: 8px; overflow-x: auto; padding: 14px 0; border-bottom: 1px solid #dce4ed; }
.panel-page .top-nav button { display: inline-flex; align-items: center; gap: 9px; flex: none; border: 1px solid transparent; padding: 10px 15px; color: #546d85; background: transparent; font-size: .87rem; }
.panel-page .top-nav button:hover { color: #164d84; background: #e6eef8; }
.panel-page .top-nav button[aria-current="page"] { color: #0c477d; background: #e6f1fc; border-color: #cfe4fa; }
.panel-page .top-nav svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.75; }
.panel-page .view-panel { padding-top: 36px; }
.panel-page .page-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.panel-page .eyebrow { margin: 0 0 8px; color: #2b6fa8; font-size: .72rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.panel-page h1, .panel-page h2, .panel-page h3 { color: #142d49; }
.panel-page h1 { margin: 0 0 9px; font-size: clamp(1.85rem, 3vw, 2.55rem); letter-spacing: -.045em; line-height: 1.12; }
.panel-page .page-heading p:last-child { margin: 0; color: #64768b; }
.panel-page h2 { margin: 0 0 9px; font-size: 1.12rem; letter-spacing: -.02em; }
.panel-page h3 { margin: 0; font-size: .94rem; }
.panel-page .inline-message { padding: 13px 16px; color: #3b566e; background: #eaf1f8; border: 1px solid #d9e6f2; border-radius: 10px; font-size: .88rem; }
.panel-page .metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 18px 0 20px; }
.panel-page .metric-card, .panel-page .surface { background: #fff; border: 1px solid #dce5ee; box-shadow: 0 8px 28px #183b5c09; border-radius: 14px; }
.panel-page .metric-card { display: grid; align-content: center; gap: 8px; min-height: 112px; padding: 21px 23px; }
.panel-page .metric-card span { color: #657a8f; font-size: .8rem; font-weight: 700; }
.panel-page .metric-card strong { color: #153754; font-size: 1.18rem; line-height: 1.25; overflow-wrap: anywhere; }
.panel-page .metric-card small { color: #697b8b; font-size: .76rem; }
.panel-page .info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.panel-page .surface { padding: 25px; }
.panel-page .surface p { color: #536a7f; line-height: 1.55; }
.panel-page .surface-heading { align-items: start; margin-bottom: 25px; }
.panel-page .surface-heading h2 { margin-bottom: 3px; }
.panel-page .surface-heading p { margin: 0; font-size: .81rem; }
.panel-page .mini-icon { display: grid; place-items: center; flex: none; width: 39px; height: 39px; border-radius: 10px; color: #1a5f9d; background: #e9f2fb; font-size: .84rem; font-weight: 800; }
.panel-page .big-value { margin: 0 0 8px; color: #173b5a !important; font-size: 1.34rem; font-weight: 750; letter-spacing: -.025em; }
.panel-page .big-value code { font-size: 1.18rem; }
.panel-page .path-value { padding: 10px 12px; border-radius: 8px; color: #1c527c !important; background: #f3f7fb; font-size: .85rem; overflow-wrap: anywhere; }
.panel-page .detail-line { padding-top: 14px; margin-top: 19px; border-top: 1px solid #e5ebf1; font-size: .84rem; }
.panel-page .plain-list, .panel-page .steps { margin: 8px 0 0; padding-left: 20px; color: #536a7f; line-height: 1.85; }
.panel-page .table-scroll { margin-top: 14px; }
.panel-page table { min-width: 760px; }
.panel-page th { color: #587085; background: #f4f7fa; font-size: .74rem; letter-spacing: .025em; text-transform: uppercase; }
.panel-page td { color: #2d455a; font-size: .85rem; }
.panel-page td small { display: block; color: #7a8da0; margin-top: 3px; }
.panel-page .status-pill { display: inline-block; padding: 5px 9px; border-radius: 99px; color: #196247; background: #e4f6ec; font-size: .75rem; font-weight: 750; }
.panel-page .status-pill.failed { color: #9a452c; background: #fff0e7; }
.panel-page td button { padding: .5rem .75rem; font-size: .78rem; }
.panel-page .restore-result { color: #1e557f !important; font-size: 1.03rem; font-weight: 750; }
.panel-page .settings-list { grid-template-columns: 12rem 1fr; margin: 0; }
.panel-page .settings-list dt { color: #597086; }
.panel-page .settings-list dd { color: #263f55; }
.panel-page .settings-form { margin-top: 18px; }
.panel-page .form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.panel-page .settings-form > button { justify-self: start; }
.panel-page .settings-note { margin-top: 21px; }
.panel-page .note { font-size: .82rem; line-height: 1.6; }
.panel-page dialog { box-sizing: border-box; width: min(600px, calc(100vw - 32px)); max-height: calc(100vh - 34px); overflow: auto; padding: 27px; border: 1px solid #d8e5ef; border-radius: 17px; background: #fff; box-shadow: 0 28px 85px #0c213b42; }
.panel-page dialog::backdrop { background: #0b2039a8; backdrop-filter: blur(3px); }
.panel-page .dialog-header { display: flex; align-items: start; justify-content: space-between; gap: 15px; }
.panel-page .dialog-header h2 { font-size: 1.45rem; }
.panel-page .icon-button { padding: 2px 10px; font-size: 1.65rem; line-height: 1.25; }
.panel-page .selected-copy { display: grid; gap: 4px; padding: 15px 18px; margin: 19px 0; border: 1px solid #d9e7f4; border-radius: 10px; background: #f5f9fd; }
.panel-page .selected-copy span { color: #6b8091; font-size: .76rem; font-weight: 700; }
.panel-page .selected-copy strong { color: #183b59; }
.panel-page .selected-copy code { color: #2b699f; font-size: .8rem; }
.panel-page .dialog-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 10px; }
.panel-page .activity { margin-top: 23px; padding-top: 18px; border-top: 1px solid #e1e8ef; }
.panel-page .activity > p { color: #526a7f; font-size: .86rem; }
.panel-page .activity ol { max-height: 180px; overflow: auto; margin: 0; padding-left: 22px; }
.panel-page .activity li { margin: 9px 0; color: #415b70; font-size: .83rem; line-height: 1.45; }
.panel-page .activity time { color: #7a8da0; margin-right: 7px; }
.panel-page .activity li.error { color: #9a3d2f; }
.panel-page .activity li.success { color: #197451; }
@media (max-width: 760px) { .panel-page .app-shell { padding: 0 16px 48px; } .panel-page .metrics, .panel-page .info-grid, .panel-page .form-grid { grid-template-columns: 1fr; } .panel-page .page-heading { align-items: start; flex-direction: column; } .panel-page .header-caption { display: none; } .panel-page .surface { padding: 20px; } .panel-page .settings-list { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .panel-page button { transition: none; } }
