.operacional {
  --blue: #084793; --blue-dark: #102d52; --muted: #63758c; --line: #dce5ef;
  --paper: #fff; --ink: #213b59; --orange: #e64a18;
  margin: 0; background: #f3f6fa; color: var(--ink); font: 14px/1.5 Arial, sans-serif;
}
.operacional * { box-sizing: border-box; }
.operacional [hidden] { display: none !important; }
.operacional a { text-decoration: none; }
.operacional button, .operacional input, .operacional select { font-family: inherit; }
.operacional button { cursor: pointer; font-size: 13px; font-weight: 600; letter-spacing: normal; text-transform: none; border: 1px solid var(--line); border-radius: 8px; padding: 9px 13px; background: #f3f7fc; color: var(--blue); min-height: 38px; }
.operacional button:hover:not(:disabled) { background: #e6effa; border-color: #afc7e4; }
.operacional button:disabled { opacity: .5; cursor: not-allowed; }
.operacional .primary { background: var(--blue); border-color: var(--blue); color: white; }
.operacional .primary:hover:not(:disabled) { background: #073a77; }
.operacional :is(button,a,input,select):focus-visible { outline: 3px solid #ef9a53; outline-offset: 3px; }
.operacional .shell { display: grid; grid-template-columns: 214px minmax(0,1fr); min-height: 100vh; }
.operacional .sidebar { position: sticky; top: 0; height: 100vh; background: #0e2c55; padding: 22px 14px; color: white; }
.operacional .logo { display: grid; place-items: center; padding: 16px 10px; background: white; border-radius: 10px; margin-bottom: 30px; }
.operacional .logo img { max-width: 150px; }
.operacional .side-title { font-size: 10px; letter-spacing: .12em; color: #a0b7d5; margin: 22px 12px 10px; }
.operacional .side-link { display: block; padding: 11px 12px; margin: 5px 0; border-radius: 8px; color: #dce7f5; }
.operacional .side-link.active { background: #1760bd; color: white; font-weight: 600; }
.operacional .side-link:hover { background: #1c477c; }
.operacional .main { min-width: 0; display: block; }
.operacional .topbar { position: static; min-height: 76px; background: white; border-bottom: 1px solid var(--line); padding: 18px 28px; display: flex; justify-content: space-between; align-items: center; gap: 16px; backdrop-filter: none; }
.operacional .topbar h1 { font: 700 19px/1.3 Arial,sans-serif; color: var(--blue-dark); margin: 0; }
.operacional .user-chip { display: flex; gap: 14px; align-items: center; color: var(--muted); font-size: 12px; }
.operacional .content { display: block; padding: 0 28px 32px; }
.operacional .tabs { display: flex; gap: 26px; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.operacional .tab { color: var(--muted); padding: 20px 0 14px; font-size: 13px; font-weight: 600; }
.operacional .tab.active { color: var(--blue); border-bottom: 3px solid var(--blue); }
.operacional #adminPanel { display: grid; gap: 20px; }
.operacional .card-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 16px; }
.operacional #adminPanel > .card-head { margin: 0; }
.operacional .card-head p { margin: 4px 0 0; }
.operacional p { color: var(--muted); font-size: 13px; }
.operacional .metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.operacional .metric { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 12px; min-height: 106px; padding: 17px; text-align: left; background: white; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 3px 10px #173e6b05; }
.operacional .metric > span:not(.icon) { min-width: 0; }
.operacional .metric strong { display: block; font-size: 26px; line-height: 1.25; color: var(--blue-dark); margin: 4px 0; }
.operacional .metric span { font-size: 12px; color: var(--muted); }
.operacional .metric small { display: block; font-size: 10px; color: var(--muted); font-weight: 400; }
.operacional .metric .icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: #2864b9; background: #edf3fd; font-size: 19px; }
.operacional .metric.error .icon { color: #ba384b; background: #fff0f2; }
.operacional .metric.sheets .icon { color: #218b61; background: #eaf7f0; }
.operacional .metric.moodle .icon { color: #7653bb; background: #f3edfc; }
.operacional .metric-wide { display: none; }
.operacional .card { min-width: 0; background: white; border: 1px solid var(--line); border-radius: 14px; padding: 22px; box-shadow: 0 4px 16px #173e6b05; }
.operacional .card h2 { margin: 0; color: var(--blue-dark); font-size: 16px; line-height: 1.4; }
.operacional .flow-layout { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(350px,1fr); gap: 20px; align-items: start; }
.operacional .flow { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.operacional .stage { background: #f8fafd; border: 1px solid #e6edf5; border-radius: 10px; padding: 16px; }
.operacional .stage > span { color: var(--muted); font-size: 12px; }
.operacional .stage > strong { display: block; color: var(--blue-dark); font-size: 23px; margin: 7px 0 12px; }
.operacional .stage dl { display: grid; grid-template-columns: 1fr auto; gap: 5px 12px; margin: 0; font-size: 12px; }
.operacional .stage dt { color: var(--muted); }
.operacional .stage dd { margin: 0; font-weight: 600; }
.operacional #coursesCacheSummary { margin: 0 0 16px; font-size: 11px; }
.operacional .section-kicker { display: block; color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .1em; margin-bottom: 5px; }
.operacional .integration-status { padding: 5px 9px; border-radius: 20px; background: #fff3d9; color: #926013; font-size: 11px; white-space: nowrap; }
.operacional .integration-status[data-state=ok] { background: #e7f6ee; color: #21784e; }
.operacional #integrationHealth { overflow: visible; max-height: none; }
.operacional .integration-overview { display: flex; justify-content: space-between; align-items: center; margin: 20px 0 12px; }
.operacional .integration-overview strong { color: var(--blue-dark); font-size: 27px; }
.operacional .integration-overview strong span, .operacional .integration-rate small { display: block; font-size: 12px; color: var(--muted); font-weight: 400; }
.operacional .integration-rate { color: #218b61; font-size: 24px; text-align: right; font-weight: 600; }
.operacional .integration-track { height: 7px; border-radius: 10px; background: #eef2f7; overflow: hidden; }
.operacional .integration-track i { display: block; height: 100%; background: #27996d; border-radius: inherit; }
.operacional .integration-counts { display: flex; gap: 16px; flex-wrap: wrap; margin: 12px 0 20px; color: var(--muted); font-size: 11px; }
.operacional .integration-counts b { color: var(--ink); }
.operacional .error-categories { display: grid; gap: 8px; }
.operacional .error-category { display: flex; justify-content: space-between; gap: 16px; padding: 13px 14px; border: 1px solid #f3ded9; background: #fff9f7; border-radius: 9px; }
.operacional .error-category strong { font-size: 12px; color: #914330; }
.operacional .error-category p { font-size: 11px; margin: 4px 0 0; line-height: 1.5; }
.operacional .error-category > span { font-weight: 700; color: #914330; flex-shrink: 0; font-size: 15px; }
.operacional .integration-updated, .operacional .integration-note { font-size: 11px; margin: 14px 0 0; }
.operacional .integration-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.operacional .retry-progress-panel { border-color: #afc9e7; background: #fafdff; }
.operacional progress { display: block; width: 100%; height: 12px; accent-color: var(--blue); border: 0; }
.operacional #retryFailures ul { max-height: 210px; overflow: auto; padding-left: 20px; font-size: 12px; }
.operacional #retryFailures summary { cursor: pointer; color: var(--blue); font-weight: 600; font-size: 12px; }
.operacional .admin-filters { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; margin: 0; padding: 16px; border-radius: 10px; background: #f8fafd; }
.operacional input, .operacional select { width: 100%; min-width: 0; min-height: 40px; border: 1px solid var(--line); border-radius: 7px; padding: 8px 10px; background: white; color: var(--ink); font-size: 13px; }
.operacional input[type=checkbox] { width: 16px; height: 16px; min-height: 16px; padding: 0; }
.operacional .toolbar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.operacional #selectionSummary { font-size: 12px; margin: 12px 0; }
.operacional .admin-layout { display: grid; grid-template-columns: minmax(0,1fr); gap: 16px; }
.operacional .table-wrap { overflow: auto; max-height: 630px; border: 1px solid var(--line); border-radius: 10px; }
.operacional table { border-collapse: collapse; min-width: 1050px; width: 100%; }
.operacional th, .operacional td { padding: 12px 10px; font-size: 12px; border-bottom: 1px solid #edf1f6; text-align: left; }
.operacional th { color: var(--muted); font-size: 10px; text-transform: uppercase; background: #f8fafd; position: sticky; top: 0; z-index: 1; }
.operacional tbody tr:hover { background: #f8fbff; }
.operacional .badge { display: inline-block; font-size: 10px; padding: 4px 8px; border-radius: 20px; font-weight: 600; }
.operacional .badge.red { background: #fff0f2; color: #b3384c; }
.operacional .badge.green { background: #eaf7f0; color: #218b61; }
.operacional .badge.yellow { background: #fff6df; color: #956b17; }
.operacional .detail-panel { min-width: 0; max-height: none; padding: 20px; border: 1px dashed #cbd9e8; border-radius: 10px; }
.operacional .detail-panel dl { display: grid; grid-template-columns: 160px minmax(0,1fr); gap: 8px; }
.operacional .detail-panel dd { overflow-wrap: anywhere; }
.operacional .detail-panel .correction-grid { max-width: 850px; }
.operacional .health-item { overflow-wrap: anywhere; }
.operacional #reportsPanel { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.operacional #reportsPanel > h2, .operacional #reportsPanel > .admin-actions { grid-column: 1/-1; }
.operacional .admin-tool-card { display: flex; flex-direction: column; align-items: stretch; justify-content: space-between; gap: 20px; margin: 0; padding: 20px; background: #f8fafd; border-radius: 10px; }
.operacional .admin-tool-card h2 { font-size: 14px; }
.operacional .admin-upload-form { display: flex; flex-wrap: wrap; gap: 10px; width: 100%; }
.operacional .admin-upload-form input { width: 100%; max-width: none; }
.operacional input[type=file] { padding: 6px; background: white; font-size: 12px; }
.operacional input[type=file]::file-selector-button { background: #eaf1fa; color: var(--blue); border: 0; border-radius: 5px; padding: 8px 12px; margin-right: 12px; cursor: pointer; }
.operacional #reportsPanel > .admin-actions { border-top: 1px solid var(--line); padding-top: 16px; font-size: 12px; }
.operacional #adminMessage { position: sticky; top: 8px; z-index: 5; margin: 0; }
.operacional #loginPanel { max-width: 520px; margin: 35px auto; }
@media(max-width:1400px) {
  .operacional .metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .operacional .flow-layout { grid-template-columns: minmax(0,1fr); }
  .operacional .flow { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .operacional .admin-filters { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media(max-width:1000px) {
  .operacional .shell { grid-template-columns: minmax(0,1fr); }
  .operacional .sidebar { display: none; }
  .operacional .flow { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media(max-width:600px) {
  .operacional .content { padding: 0 14px 20px; }
  .operacional .topbar { padding: 16px; flex-wrap: wrap; }
  .operacional .topbar h1 { font-size: 17px; }
  .operacional .tabs { gap: 16px; }
  .operacional .tab { font-size: 12px; }
  .operacional .metrics, .operacional .flow, .operacional .admin-filters, .operacional #reportsPanel { grid-template-columns: minmax(0,1fr); }
  .operacional .card { padding: 16px; }
  .operacional .card-head { flex-wrap: wrap; }
  .operacional .detail-panel dl { grid-template-columns: minmax(0,1fr); }
  .operacional .detail-panel dd { margin: 0 0 8px; }
  .operacional .integration-actions button { width: 100%; }
}

.operacional .request-flow-panel[hidden], .operacional #requestFlowButton[hidden], .operacional #requestFlowResults[hidden] { display: none; }
.operacional .request-flow-panel { border-top: 4px solid var(--blue); scroll-margin-top: 20px; }
.operacional .request-flow-filters { display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; margin:20px 0 12px; }
.operacional .request-flow-filters label { display:grid; gap:6px; font-size:12px; }
.operacional .request-flow-filters input, .operacional .request-flow-filters select { min-width:135px; }
.operacional .request-flow-note { color:#53657b; font-size:12px; line-height:1.6; }
.operacional .request-flow-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:20px 0; }
.operacional .request-flow-metric { padding:18px; background:#eef5fc; border-radius:10px; }
.operacional .request-flow-metric span { display:block; font-size:12px; color:#425974; }
.operacional .request-flow-metric strong { display:block; font-size:28px; color:var(--blue); margin-top:8px; }
.operacional .request-flow-tables { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.operacional .request-flow-tables section { min-width:0; }
.operacional .request-flow-tables .table-wrap { max-height:340px; overflow:auto; }
.operacional .request-flow-tables table { min-width:0; width:100%; }
.operacional .request-flow-tables td:first-child { overflow-wrap:anywhere; white-space:normal; }
@media(max-width:800px) { .operacional .request-flow-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } .operacional .request-flow-tables { grid-template-columns:minmax(0,1fr); } }
@media(max-width:480px) { .operacional .request-flow-filters label { width:100%; } .operacional .request-flow-metric strong { font-size:22px; } }