  :root{
    /* DNA do site (verde + tipografia), fundo claro da área logada */
    --green:#059669; --green2:#34d399; --green-deep:#047857; --green-soft:#ecfdf5;
    --ink:#0c1a16; --muted:#5b7268; --line:#d8ebe3; --line-soft:#e8f5ef;
    --bg:#f4faf7; --card:#ffffff; --soft:#f0faf5;
    --shadow:0 18px 50px #0b3a2c12; --shadow-sm:0 8px 24px #0b3a2c0d;
    --disp:"Sora","Segoe UI",system-ui,sans-serif;
    --body:"DM Sans","Segoe UI",system-ui,sans-serif;
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    margin:0;font-family:var(--body);color:var(--ink);line-height:1.55;
    -webkit-font-smoothing:antialiased;min-height:100vh;position:relative;
    background:
      radial-gradient(900px 420px at 88% -8%, #34d39933 0%, transparent 58%),
      radial-gradient(720px 380px at -6% 18%, #05966918 0%, transparent 55%),
      linear-gradient(180deg, #eef8f3 0%, var(--bg) 42%, #f7fcfa 100%);
  }
  body::before{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.45;
    background-image:
      radial-gradient(1.2px 1.2px at 12% 22%, #05966933 50%, transparent 52%),
      radial-gradient(1px 1px at 78% 14%, #34d39944 50%, transparent 52%),
      radial-gradient(1px 1px at 42% 68%, #0b3a2c22 50%, transparent 52%),
      radial-gradient(1.4px 1.4px at 90% 72%, #05966928 50%, transparent 52%);
  }
  a{color:inherit;text-decoration:none}
  h1,h2,h3,.brand,.btn,.eyebrow,.tab{font-family:var(--disp)}
  :focus-visible{outline:3px solid #6ee7b7;outline-offset:2px}

  .nav{
    height:62px;display:flex;align-items:center;position:sticky;top:0;z-index:30;
    background:#f7fcfacc;border-bottom:1px solid #ffffffaa;
    backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
    box-shadow:0 1px 0 #d8ebe380;
  }
  .nav .wrap{
    width:min(980px,calc(100% - 32px));margin:auto;
    display:flex;align-items:center;justify-content:space-between;gap:12px;
  }
  .brand{
    display:flex;align-items:center;gap:10px;font-weight:800;font-size:16px;color:var(--ink);
  }
  .mark{
    display:grid;place-items:center;width:30px;height:30px;border-radius:9px;
    background:var(--green);color:#fff;font-size:14px;
    box-shadow:0 0 22px #34d39966, 0 6px 14px #05966933;
  }
  .nav-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .nav a.link{
    color:var(--muted);font-size:13.5px;font-weight:700;padding:8px 12px;border-radius:999px;
    transition:.18s;
  }
  .nav a.link:hover{color:var(--ink);background:#fff8}
  .nav a.link.on{
    color:#047857;background:#d1fae6;border:1px solid #a7f3d0;
  }

  .page{
    position:relative;z-index:1;
    width:min(980px,calc(100% - 32px));margin:0 auto;padding:28px 0 56px;
  }

  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    min-height:44px;padding:0 18px;border:1px solid transparent;border-radius:12px;
    font-weight:700;font-size:14px;cursor:pointer;transition:.18s;text-decoration:none;
  }
  .btn:hover{transform:translateY(-1px)}
  .btn.primary{
    background:var(--green);color:#fff;
    box-shadow:0 12px 28px #05966940;
  }
  .btn.primary:hover{background:var(--green-deep)}
  .btn.ghost{
    border-color:var(--line);background:#fff;color:var(--ink);
    box-shadow:var(--shadow-sm);
  }
  .btn.ghost:hover{background:var(--soft);border-color:#b7e4d2}
  .btn.sm{min-height:38px;padding:0 14px;font-size:13px}
  .btn[disabled]{opacity:.55;cursor:default;transform:none}

  .eyebrow{
    display:inline-block;font-weight:800;font-size:11px;letter-spacing:.16em;
    text-transform:uppercase;color:var(--green);margin:0 0 10px;
  }

  /* Login card + halo verde suave por tras (pulso leve) */
  .login-stage{
    position:relative;max-width:520px;margin:8px auto 0;padding:28px 16px 20px;
  }
  .login-stage::before{
    content:"";position:absolute;left:50%;top:46%;
    width:min(460px,100%);height:min(420px,92%);
    transform:translate(-50%,-50%);border-radius:50%;
    background:radial-gradient(circle, #34d39955 0%, #05966928 38%, transparent 70%);
    filter:blur(2px);pointer-events:none;z-index:0;
    animation:loginGreenPulse 5.5s ease-in-out infinite;
  }
  @keyframes loginGreenPulse{
    0%,100%{
      opacity:.72;transform:translate(-50%,-50%) scale(1);
      background:radial-gradient(circle, #34d39948 0%, #05966922 40%, transparent 70%);
    }
    50%{
      opacity:1;transform:translate(-50%,-50%) scale(1.06);
      background:radial-gradient(circle, #34d39966 0%, #05966933 42%, transparent 72%);
    }
  }
  @media(prefers-reduced-motion:reduce){
    .login-stage::before{animation:none}
  }
  #login{
    position:relative;z-index:1;
    max-width:440px;margin:0 auto;
    background:var(--card);border:1px solid #ffffffee;
    border-radius:20px;padding:28px 26px 24px;
    box-shadow:var(--shadow), 0 0 0 1px #0596690d;
  }
  #login h1{
    font-size:clamp(26px,5vw,30px);font-weight:800;margin:0 0 8px;
    letter-spacing:-.03em;line-height:1.1;
  }
  #login .sub{color:var(--muted);font-size:15px;margin:0 0 22px}
  #login .sub strong{color:var(--ink);font-weight:700}
  .field{margin-bottom:14px}
  .field label{
    display:block;font-size:12.5px;color:#3d5a4e;font-weight:700;margin-bottom:6px;
  }
  .field input{
    width:100%;padding:12px 14px;border-radius:12px;border:1px solid var(--line);
    background:#fbfefd;color:var(--ink);font-size:15px;font-family:var(--body);
    transition:.15s;
  }
  .field input:hover{border-color:#b7e4d2}
  .field input:focus{
    outline:none;border-color:var(--green);
    box-shadow:0 0 0 4px #34d39933;background:#fff;
  }
  .err{
    background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;
    border-radius:12px;padding:11px 13px;font-size:13.5px;margin-bottom:14px;
  }
  .ok{
    background:var(--green-soft);border:1px solid #a7f3d0;color:#047857;
    border-radius:12px;padding:11px 13px;font-size:13.5px;margin-bottom:14px;
  }
  .hint{text-align:center;color:var(--muted);font-size:12.5px;margin-top:16px;line-height:1.55}
  .hint button{
    background:none;border:none;color:var(--green);font-weight:700;cursor:pointer;
    font-family:var(--body);font-size:12.5px;padding:0;text-decoration:underline;
    text-underline-offset:2px;
  }
  .hint button:hover{color:var(--green-deep)}
  #esqueciBox{
    margin-top:18px;padding-top:18px;border-top:1px solid var(--line-soft);
  }
  .devbox{
    margin-top:18px;padding:14px;border-radius:14px;
    border:1px solid #fde68a;background:linear-gradient(160deg,#fffbeb,#fff7ed);
  }
  .devbox p{margin:0 0 8px;font-size:12px;color:#92400e;font-weight:800;font-family:var(--disp)}
  .devbox button{
    display:block;width:100%;text-align:left;margin-top:7px;padding:11px 12px;
    border-radius:11px;border:1px solid #f5e0b8;background:#fff;color:var(--ink);
    font-size:13px;cursor:pointer;font-family:var(--body);transition:.15s;
  }
  .devbox button:hover{border-color:#f59e0b;box-shadow:var(--shadow-sm)}
  .devbox button span{
    display:block;font-family:ui-monospace,monospace;font-size:11px;color:var(--muted);margin-top:3px;
  }
  .api-hint{font-size:11px;color:#8aa399;margin-top:12px;word-break:break-all;text-align:center}

  .or-line{
    display:flex;align-items:center;gap:12px;margin:16px 0 14px;
    color:#8aa399;font-size:12px;font-weight:700;
  }
  .or-line::before,.or-line::after{
    content:"";flex:1;height:1px;background:var(--line-soft);
  }
  .google-wrap{display:flex;justify-content:center;min-height:44px}
  .google-wrap.hidden{display:none}
  .btn.google{
    width:100%;background:#fff;color:#1f2937;border:1px solid var(--line);
    box-shadow:var(--shadow-sm);gap:10px;
  }
  .btn.google:hover{background:var(--soft);border-color:#b7e4d2}
  .btn.google svg{flex:none}

  /* Painel */
  #panel{display:none}
  #panel.is-on{display:block}
  .phead{
    display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;
    gap:16px;margin-bottom:6px;padding:22px 22px 18px;
    background:var(--card);border:1px solid #ffffffee;border-radius:20px;
    box-shadow:var(--shadow-sm);
  }
  .phead h1{
    font-size:clamp(24px,4vw,30px);font-weight:800;margin:0;
    letter-spacing:-.03em;line-height:1.1;
  }
  .phead .who{color:var(--muted);font-size:14px;margin-top:5px;font-weight:500}
  .phead-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

  .badge{
    display:inline-flex;align-items:center;padding:6px 12px;border-radius:999px;
    font-size:12px;font-weight:800;font-family:var(--disp);letter-spacing:.02em;
  }
  .b-green{background:#d1fae6;color:#047857;border:1px solid #a7f3d0}
  .b-amber{background:#fffbeb;color:#b45309;border:1px solid #fde68a}
  .b-rose{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca}
  .b-slate{background:#f1f5f4;color:#475569;border:1px solid var(--line)}

  .tabs{
    display:flex;gap:4px;margin:16px 0 18px;padding:5px;overflow-x:auto;
    background:rgba(255,255,255,.72);border:1px solid #ffffffcc;
    border-radius:14px;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px);
  }
  .tab{
    background:transparent;border:none;color:var(--muted);
    font-weight:700;font-size:13.5px;padding:10px 14px;cursor:pointer;white-space:nowrap;
    border-radius:10px;transition:.15s;
  }
  .tab:hover{color:var(--ink);background:#fff8}
  .tab.active{
    color:#047857;background:#fff;
    box-shadow:0 2px 10px #0b3a2c12;border:1px solid #d1fae6;
  }

  .pg{display:none}.pg.active{display:block;animation:in .28s ease both}
  @keyframes in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
  @media(prefers-reduced-motion:reduce){.pg.active{animation:none}}

  .cards{display:grid;grid-template-columns:1fr;gap:14px}
  @media(min-width:760px){.cards{grid-template-columns:repeat(3,1fr)}}
  .card{
    background:linear-gradient(165deg,#ffffff 0%, #f7fcfa 100%);
    border:1px solid #dcefe7;border-radius:16px;padding:18px 18px 16px;
    box-shadow:var(--shadow-sm);
  }
  .card.white{background:#fff}
  .card h3{
    margin:0 0 10px;font-size:15px;font-weight:800;letter-spacing:-.02em;
  }
  .card .k{
    font-size:11px;color:#6b8a7c;font-weight:800;text-transform:uppercase;
    letter-spacing:.08em;font-family:var(--disp);
  }
  .card .v{
    font-size:clamp(20px,2.6vw,24px);font-weight:800;margin-top:6px;
    font-family:var(--disp);letter-spacing:-.03em;color:#0c1a16;
  }
  .card .v.sm{font-size:15px;font-weight:700;letter-spacing:-.01em}
  .card .v.mono{
    font-family:ui-monospace,Consolas,monospace;font-size:13px;word-break:break-all;
    font-weight:600;letter-spacing:0;line-height:1.45;
  }
  .mt{margin-top:12px}
  .row-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
  .note{font-size:13px;color:var(--muted);margin:12px 0 0;line-height:1.5}
  .mods{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
  .mod{
    padding:7px 12px;border-radius:999px;border:1px solid var(--line);
    background:#fff;font-size:12.5px;color:#2f4a3f;font-weight:700;
    box-shadow:0 1px 0 #fff inset;
  }
  .mod.wl{
    border-color:#86efac;background:linear-gradient(160deg,#ecfdf5,#d1fae6);
    color:#047857;box-shadow:0 0 0 1px #34d39922;
  }

  .domain-box{
    margin-top:12px;padding:14px 16px;border-radius:14px;
    border:1px solid var(--line-soft);background:var(--soft);
  }
  .domain-box .empty-dom{color:var(--muted);font-size:14px;margin:8px 0 0}

  table{width:100%;border-collapse:collapse;font-size:14px}
  th,td{text-align:left;padding:13px 15px;border-bottom:1px solid var(--line-soft)}
  th{
    color:#6b8a7c;font-weight:800;background:var(--soft);font-size:11px;
    text-transform:uppercase;letter-spacing:.08em;font-family:var(--disp);
  }
  td{background:#fff}
  tr:last-child td{border-bottom:0}
  .tblwrap{
    border:1px solid #dcefe7;border-radius:16px;overflow:hidden;
    box-shadow:var(--shadow-sm);background:#fff;
  }
  .empty{color:var(--muted);padding:32px;text-align:center;background:#fff}
  .danger{
    border-color:#fecaca;
    background:linear-gradient(165deg,#fff 0%, #fef7f7 100%);
  }
  .danger h3{color:#b91c1c;font-size:15px;margin:0 0 6px}
  dl{margin:0;display:grid;gap:0;font-size:14px}
  dl .r{
    display:flex;justify-content:space-between;gap:14px;padding:13px 0;
    border-bottom:1px solid var(--line-soft);
  }
  dl .r:last-child{border-bottom:0}
  dl .r dt{color:var(--muted);font-weight:600}
  dl .r dd{margin:0;font-weight:700;text-align:right;color:var(--ink)}

  .foot{
    position:relative;z-index:1;text-align:center;
    padding:4px 16px 36px;color:#7d9a8d;font-size:12.5px;font-weight:600;
  }
  .foot span{color:var(--green);font-weight:800}
.csp-inline-1 { display:none }
.csp-inline-2 { display:none }
.csp-inline-3 { display:none }
.csp-inline-4 { width:100% }
.csp-inline-5 { display:none }
.csp-inline-6 { margin:0 0 12px;font-size:14px }
.csp-inline-7 { margin-bottom:12px }
.csp-inline-8 { width:100% }
.csp-inline-9 { width:100%;margin-top:8px }
.csp-inline-10 { display:none }
.csp-inline-11 { display:none }
.csp-inline-12 { display:none }
.csp-inline-13 { margin-top:0 }
.csp-inline-14 { margin-top:10px }
.csp-inline-15 { margin-top:0 }
.csp-inline-16 { display:none }
.csp-inline-17 { margin-top:12px;display:inline-block }
.csp-inline-18 { display:none }
.csp-inline-19 { margin-top:0 }
.csp-inline-20 { margin-top:12px }
.csp-inline-21 { min-height:40px }
.csp-inline-22 { min-height:40px }
.csp-inline-23 { font-size:13px;color:var(--muted);font-weight:600 }
