:root{font-family:Inter,Arial,Helvetica,sans-serif;color:#162f55;background:#f2f6fc;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh}button,input,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}a{color:#1563bd} .hidden{display:none!important}.shell{min-height:100vh;display:flex}.sidebar{width:255px;background:linear-gradient(155deg,#07294a,#0b427b);color:#fff;padding:25px 15px;display:flex;flex-direction:column;gap:20px}.brand{padding:12px}.brand .mini{letter-spacing:.15em;font-size:11px;color:#94d0ff;font-weight:800}.brand h2{font-size:24px;margin:9px 0 3px}.brand p{font-size:12px;color:#b8cfea;margin:0}.nav{display:flex;flex-direction:column;gap:6px}.nav button{display:flex;align-items:center;gap:11px;background:transparent;color:#dceaff;border:0;padding:13px 12px;text-align:left;border-radius:12px;font-weight:700}.nav button:hover,.nav button.active{background:rgba(255,255,255,.15);color:#fff}.sidebar-bottom{margin-top:auto;padding:14px 12px;color:#c9d9ed;font-size:12px;line-height:1.6}.main{flex:1;min-width:0;padding:32px 40px;max-width:1600px;margin:0 auto}.head{display:flex;justify-content:space-between;align-items:start;gap:12px;margin-bottom:27px}.eyebrow{font-size:12px;color:#3579bb;font-weight:800;text-transform:uppercase;letter-spacing:.14em;margin:0 0 9px}h1{font-size:clamp(25px,3vw,38px);margin:0 0 8px;letter-spacing:-.025em}h2{font-size:22px;margin:0 0 14px}h3{margin:0 0 8px;font-size:17px}.sub{color:#637790;line-height:1.55;font-size:14px}.pill{display:inline-block;padding:7px 11px;border-radius:100px;background:#e4effb;color:#2062a5;font-size:12px;font-weight:800}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.card{background:#fff;padding:24px;border:1px solid #dce7f5;border-radius:18px;box-shadow:0 10px 30px rgba(12,45,91,.035);min-height:145px}.card.clickable{cursor:pointer;transition:transform .16s,border-color .16s}.card.clickable:hover{transform:translateY(-2px);border-color:#75afe3}.card .symbol{font-size:26px;margin-bottom:17px}.card .small{font-size:13px;color:#667d99;line-height:1.5}.card .label{font-weight:800;font-size:17px;color:#133960}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.row.between{justify-content:space-between}.btn{border:0;background:#1465b4;color:white;padding:12px 18px;border-radius:11px;font-weight:800;font-size:14px}.btn.secondary{background:#ebf2fa;color:#174d81}.btn.danger{background:#fff0f1;color:#a82733}.btn.small{padding:9px 13px;font-size:12px}.btn:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8bc2fa;outline-offset:2px}.input{width:100%;padding:13px 14px;background:#fff;border:1px solid #c8d9eb;border-radius:11px;color:#1c3551}.field{display:flex;flex-direction:column;gap:6px;margin:11px 0 16px}.field label{font-size:13px;color:#41617e;font-weight:700}.panel{background:#fff;border:1px solid #dce7f5;border-radius:18px;padding:25px}.notice{border:1px solid #bbd8f5;background:#edf6ff;border-radius:12px;padding:14px 16px;color:#174f81;font-size:13px;line-height:1.5;margin:14px 0}.warning{background:#fff4e1;border-color:#f8d8a1;color:#81531a}.lockbox{max-width:520px;margin:45px auto;background:#fff;padding:36px;border-radius:20px;border:1px solid #dce7f5;box-shadow:0 18px 65px rgba(11,55,96,.08);text-align:left}.locksymbol{font-size:37px;margin:0 0 16px}.login-layout{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top,#b8d9fa 0,#ecf4fd 46%,#f5f8ff 100%);padding:22px}.login-card{width:min(450px,100%);padding:36px;background:#fff;border-radius:22px;box-shadow:0 24px 90px rgba(7,47,85,.13)}.login-card h1{font-size:30px}.logo-chip{display:inline-block;background:#0b477d;color:white;padding:11px 15px;border-radius:11px;font-weight:900;letter-spacing:.09em;margin-bottom:24px}.login-card .btn{width:100%}.muted{color:#71849c;font-size:12px}.check-row{display:flex;align-items:center;gap:9px;margin:9px 0;font-size:13px;color:#31516e}.check-row input{height:17px;width:17px}.list{display:flex;flex-direction:column;gap:10px}.list-item{border:1px solid #dfebf5;border-radius:13px;background:white;padding:14px 16px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 20px}.breadcrumb{background:none;border:0;padding:0;color:#1266b6;font-weight:800}.empty{padding:35px 12px;text-align:center;color:#697e92;border:1px dashed #cadbed;border-radius:16px;background:#fff}.toast{position:fixed;bottom:20px;right:20px;padding:15px 20px;border-radius:12px;background:#143b65;color:white;box-shadow:0 15px 40px #112e5245;max-width:min(480px,calc(100vw - 36px));z-index:20}.error-toast{background:#982c35}.overlay{position:fixed;inset:0;background:#08294aa8;display:grid;place-items:center;padding:15px;z-index:15}.modal{background:#fff;width:min(580px,100%);padding:26px;border-radius:19px;max-height:90vh;overflow:auto}.modal h2{margin-bottom:4px}.inline-note{font-size:12px;color:#58708d;margin:0 0 15px}.people-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.stat{font-size:29px;font-weight:900;color:#124876;margin-top:5px}.section{margin-top:27px}.module-link{color:inherit;text-decoration:none}.module-link:hover .card{border-color:#75afe3}.wrap-text{overflow-wrap:anywhere}@media(max-width:1000px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.main{padding:28px 20px}.sidebar{width:220px}}@media(max-width:680px){.shell{display:block}.sidebar{width:100%;padding:13px 14px}.brand{padding:0 7px}.brand h2{font-size:18px;margin:4px 0}.brand p,.sidebar-bottom{display:none}.nav{flex-direction:row;overflow:auto}.nav button{white-space:nowrap;padding:10px}.main{padding:22px 14px}.cards,.people-grid{grid-template-columns:1fr}.head{flex-direction:column}.lockbox{margin:10px auto;padding:24px}}

/* Janela centralizada usando o elemento dialog nativo e seu top layer. */
dialog#modalRoot {
  position: fixed;
  inset: 0;
  margin: auto;
  border: 0;
  box-sizing: border-box;
  width: min(680px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  /* Altura explicita: evita o dialog colapsar numa faixa horizontal em alguns browsers. */
  height: min(570px, calc(100vh - 36px));
  height: min(570px, calc(100dvh - 36px));
  min-height: 0;
  max-height: calc(100vh - 36px);
  max-height: calc(100dvh - 36px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 26px;
  border-radius: 19px;
  background: #fff;
  color: #162f55;
  box-shadow: 0 28px 100px rgba(4, 31, 66, 0.35);
}
dialog#modalRoot::backdrop {
  background: rgba(8, 41, 74, 0.68);
}
dialog#modalRoot .row.between { align-items: flex-start; }
dialog#modalRoot h2 { overflow-wrap: anywhere; }
@media(max-width:680px){
  dialog#modalRoot{padding:20px;width:calc(100vw - 24px);max-width:calc(100vw - 24px);height:min(570px,calc(100dvh - 24px));max-height:calc(100dvh - 24px)}
}

/* RENAN NOC | PRODUCTION DESIGN SYSTEM | CSS-only, no external dependencies */
:root{color-scheme:dark;--noc-bg:#07111c;--noc-panel:#0e2031;--noc-alt:#13283b;--noc-border:#294254;--noc-ink:#e7f3ff;--noc-muted:#90a9c0;--noc-cyan:#46d8f3;--noc-green:#40d99b;--noc-orange:#ffbe74;--noc-red:#ff7180;font-family:Inter,'Segoe UI',system-ui,sans-serif;color:var(--noc-ink);background:var(--noc-bg)}
body{background:radial-gradient(ellipse at 74% -22%,#123b52 0,transparent 45%),var(--noc-bg);color:var(--noc-ink)}
body:before{content:"";position:fixed;inset:0;background-image:linear-gradient(#65d4f308 1px,transparent 1px),linear-gradient(90deg,#65d4f308 1px,transparent 1px);background-size:32px 32px;pointer-events:none;z-index:0}
.shell,.login-layout{position:relative;z-index:1}.shell{align-items:stretch}.sidebar{width:266px;background:linear-gradient(180deg,#0a1929,#091522);border-right:1px solid #274257;padding:21px 14px;box-shadow:none;position:sticky;top:0;height:100vh;gap:23px}.brand{padding:10px 12px 22px;border-bottom:1px solid var(--noc-border)}.brand:before{content:'R/';display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;margin-bottom:13px;border-radius:11px;background:linear-gradient(138deg,#184a61,#0a7289);color:#baf5fc;font-size:23px;box-shadow:0 0 30px #18c8e22a;font-weight:900}.brand .mini{color:var(--noc-cyan);letter-spacing:.12em}.brand h2{font-size:23px;color:white;letter-spacing:-.03em}.brand p,.sidebar-bottom{color:#92aabd}.nav{gap:5px}.nav button{border-left:3px solid transparent;border-radius:9px;background:transparent;color:#b0c5d5;padding:14px 12px}.nav button:hover,.nav button.active{border-left-color:var(--noc-cyan);background:#18405699;color:#dffaff}.sidebar-bottom{border-top:1px solid var(--noc-border);line-height:1.8}.main{padding:35px 38px;max-width:1720px}.head{padding-bottom:21px;border-bottom:1px solid #254055;align-items:center}.eyebrow{color:var(--noc-cyan);letter-spacing:.16em}.head h1{color:white;letter-spacing:-.04em}.sub,.card .small,.muted,.inline-note,.empty,.notice,.field label{color:var(--noc-muted)}
h2,h3{color:#edf7ff}.cards{gap:16px}.card,.panel,.list-item,.lockbox{background:linear-gradient(145deg,#11283b,#0d1d2d);border-color:#294559;box-shadow:0 16px 32px #0002;color:var(--noc-ink)}.card:hover,.card.clickable:hover{border-color:#43829a}.card .label{color:#e9f6ff}.card .symbol{display:grid;place-items:center;width:50px;height:50px;border-radius:12px;background:#15394b;border:1px solid #356276;box-shadow:0 0 30px #2acbdf0a}.pill,.notice{color:#98eaf3;background:#113849;border:1px solid #2b6473}.warning{background:#43321b;border-color:#a27337;color:#ffd69b}.btn{background:linear-gradient(125deg,#0b8098,#0879ba);color:white;box-shadow:0 0 24px #2dcbec1a}.btn.secondary{background:#1b3448;color:#d6f1ff}.btn.danger{background:#512834;color:#ffc2cc}.breadcrumb{color:#7fe5fa}.input{background:#102638;border:1px solid #355a71;color:white}.input::placeholder{color:#7f99af}.input:focus-visible,.btn:focus-visible{outline-color:var(--noc-cyan)}.field label{color:#b0cadc}.list-item{border-color:#294559}.stat{color:#8eecfa}.login-layout{background:radial-gradient(ellipse at 50% 0,#15435a,#07111c 64%)}.login-card{background:linear-gradient(150deg,#132c40,#0b1d2d);border:1px solid #316076;box-shadow:0 38px 110px #0008}.login-card h1{color:white}.logo-chip{background:linear-gradient(125deg,#087ca4,#0a5a7c);box-shadow:0 0 35px #2bcff02b}.modal,dialog#modalRoot{background:#102638;color:var(--noc-ink);border:1px solid #42617a;box-shadow:0 40px 110px #000b}dialog#modalRoot::backdrop{background:#010814c9}.empty{border-color:#366073;background:#112637}.toast{background:#144960}.error-toast{background:#8f3444}.check-row{color:#c9deea}
.noc-overview{margin-top:26px}.noc-overview-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:15px;flex-wrap:wrap}.noc-overview-head h2{margin:0}.noc-actions{display:flex;gap:10px;flex-wrap:wrap}.noc-action{display:inline-block;padding:10px 13px;border:1px solid #2d6377;border-radius:9px;text-decoration:none;color:#9befff;background:#14394b;font-weight:800;font-size:12px}.noc-action:hover{background:#1c5065}.noc-live-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.noc-live-card{border:1px solid var(--noc-border);border-radius:14px;padding:20px;background:linear-gradient(145deg,#112a3e,#0c1d2c);min-height:116px}.noc-live-card .title{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#93b5cc}.noc-live-card strong{display:block;font-size:25px;margin:12px 0 3px;color:var(--noc-ink)}.noc-live-card span{font-size:11px;color:#8fabbc}.noc-live-card .online{color:var(--noc-green)}.noc-live-card .danger{color:var(--noc-red)}.noc-live-card .unknown{color:var(--noc-orange)}
@media(max-width:1180px){.noc-live-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.sidebar{height:auto;position:static;width:100%;padding:14px}.brand{border:0;padding:3px 7px}.brand:before{display:none}.main{padding:22px 14px}.noc-live-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.noc-live-card{padding:15px}.noc-live-card strong{font-size:20px}.login-card{padding:27px}.nav button{border-left:0;border-bottom:2px solid transparent}.nav button.active{border-left:0;border-bottom-color:var(--noc-cyan)}}
