/* A identidade da landing, adaptada ao trabalho diário.
 * Só o login anima o céu (transform/opacity). No app, fundos estáticos e
 * blur limitado à navegação flutuante; tabelas e formulários são sólidos. */
:root{
  --glass-fill:rgba(255,255,255,.82);
  --glass-edge:rgba(255,255,255,.8);
  --glass-shadow:0 16px 46px rgba(13,35,68,.1),inset 0 1px 0 rgba(255,255,255,.7);
}
[data-theme="dark"]{
  --glass-fill:rgba(22,37,57,.86);
  --glass-edge:rgba(190,216,255,.18);
  --glass-shadow:0 16px 46px rgba(0,5,15,.22),inset 0 1px 0 rgba(220,235,255,.08);
}

/* Entrada: céu azul, marca pontilhada e um único painel de vidro. */
#login{background:#080e19}
.auth-shell{
  position:relative;isolation:isolate;overflow:hidden;min-height:100dvh;height:auto;
  grid-template-columns:minmax(340px,.85fr) minmax(0,1.25fr);
  grid-template-rows:auto 1fr auto;align-items:center;
  column-gap:clamp(40px,7vw,110px);row-gap:48px;
  padding:32px clamp(28px,6vw,100px) 24px;
  background:radial-gradient(ellipse at 45% -25%,#315c88 0,transparent 65%),linear-gradient(145deg,#172e4a,#080e19 80%);
}
.auth-sky{position:absolute;inset:-20%;z-index:-2;pointer-events:none;opacity:.65;
  background:radial-gradient(ellipse at 15% 24%,#a1b9c955,transparent 24%),radial-gradient(ellipse at 65% 5%,#c7cfcb70,transparent 22%),radial-gradient(ellipse at 42% 50%,#5188c345,transparent 30%);
  animation:auth-cloud-drift 18s ease-in-out infinite alternate;
}
.auth-grid{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.28;
  background-image:linear-gradient(#b4d4ff15 1px,transparent 1px),linear-gradient(90deg,#b4d4ff15 1px,transparent 1px);
  background-size:88px 88px;mask-image:linear-gradient(#000,transparent 90%);
}
.auth-top{grid-column:1/-1;position:relative}
.auth-top .auth-brand{gap:12px}
.auth-top .auth-brand .logo{background:#f0f6ff;width:32px;height:32px}
.auth-top .auth-brand b{color:#f3f7ff;font-size:var(--fs-6);font-weight:700;letter-spacing:-.04em}
.auth-top .auth-brand>div>span{color:#a9bbd2;font-size:var(--fs-0);letter-spacing:.12em}
.auth-top .auth-theme{width:40px;height:40px;border-radius:var(--r-pill);background:#ffffff0c;border-color:#d3e4ff30;color:#e0ecff;box-shadow:inset 0 1px 0 #ffffff14}
.auth-top .auth-theme span{margin:0;color:inherit}
.auth-top .auth-theme:hover{background:#ffffff20}
.auth-art{grid-column:2;grid-row:2;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;align-self:stretch;min-width:0;min-height:480px;overflow:visible;margin:0;border:0;border-radius:0;background:none}
.auth-art::before{content:none}
.auth-dotmark{display:block;width:clamp(290px,32vw,470px);height:auto;aspect-ratio:1;margin:-100px 0 -8px;
  background:radial-gradient(circle,#c8e0ff 1.2px,transparent 1.5px) 0 0/6px 6px;
  mask:url('/auth-mark.svg') center/contain no-repeat;-webkit-mask:url('/auth-mark.svg') center/contain no-repeat;
  opacity:.85;
}
.auth-dotmark.has-canvas{background:none;mask:none;-webkit-mask:none}
.auth-dotmark canvas{display:block;width:100%;height:100%}
.auth-quote{width:100%;max-width:720px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.auth-quote>p{font-size:clamp(2.2rem,3.6vw,3.9rem);font-weight:500;letter-spacing:-.055em;line-height:1.12;color:#f5f8ff}
.auth-quote>p>span{color:#b6cce9}
.auth-description{margin-top:24px;color:#aebed2;font-size:var(--fs-4);line-height:1.85}
.auth-proof{gap:8px;margin-top:30px}
.auth-proof span{padding:8px 12px;font-weight:500;border-color:#c6ddff26;background:linear-gradient(135deg,#ffffff0e,#ffffff03);color:#cbdaec;box-shadow:inset 0 1px 0 #ffffff08}
.auth-panel{grid-column:1;grid-row:2;align-self:center;justify-self:start;max-width:460px;min-height:0;padding:clamp(28px,3.2vw,46px);border:1px solid var(--glass-edge);border-radius:calc(var(--r-3) * 2);background:var(--glass-fill);box-shadow:0 30px 90px #00000035,inset 0 1px 0 #ffffff36;backdrop-filter:blur(28px) saturate(150%);-webkit-backdrop-filter:blur(28px) saturate(150%)}
.auth-content{margin:0}
.auth-kicker{font-size:var(--fs-0);letter-spacing:.14em;margin-bottom:16px}
.auth-content h1{font-size:clamp(1.8rem,2.7vw,2.6rem);font-weight:500;line-height:1.1;letter-spacing:-.045em}
.auth-copy{font-size:var(--fs-3);margin:16px 0 30px;color:var(--ink2)}
.auth-form{gap:18px;max-width:none}
.auth-field{font-weight:500;color:var(--ink)}
.auth-field input,.auth-field select{height:50px;background:color-mix(in srgb,var(--surface) 75%,transparent);border-color:color-mix(in srgb,var(--ink2) 24%,transparent);border-radius:var(--r-2)}
.auth-field input::placeholder{color:var(--ink2);opacity:.8}
.auth-field input:focus{border-color:var(--brand);box-shadow:var(--ring)}
.auth-form .auth-submit,.auth-content>.auth-submit{min-height:50px!important;border-radius:var(--r-pill);background:linear-gradient(135deg,#2867dc,#184fae);border:1px solid #6b9cef80;color:#fff;box-shadow:0 8px 22px #0b306525,inset 0 1px 0 #ffffff30;font-weight:700}
.auth-form .auth-submit:hover{filter:brightness(1.08)}
.auth-form .auth-submit:disabled{opacity:.6;cursor:wait;transform:none;filter:none}
.auth-security{margin:30px 0 0;padding-top:24px;border-top:1px solid var(--line);color:var(--ink2);font-size:var(--fs-0);gap:10px}
.auth-security>span{flex:none;border-color:var(--ink3)}
.auth-security>span::before{border-color:var(--ink3)}
.auth-footer{grid-column:1/-1;display:flex;justify-content:space-between;gap:16px;padding-top:12px;color:#a4b4ca;font-size:var(--fs-1)}

/* Navegação azul permanente. O contraste permanece estável nos dois temas. */
#app{background:radial-gradient(ellipse at 0 0,#223f60,transparent 65%),#0a1423}
#app .side{background:transparent;color:#ecf3ff}
#app .side .brand{padding:24px 22px 20px}
#app .side .brand .logo{background:#f2f6ff;width:38px;height:38px}
#app .side .brand b{color:#f2f6ff;font-weight:700;letter-spacing:-.03em}
#app .side .brand span{color:#a5b7cf}
#app .side .navlabel{color:#8fa7c4;font-size:var(--fs-0);letter-spacing:.13em;margin-top:22px}
#app .side .nav{padding:0 14px;gap:4px}
#app .side .nav button{position:relative;color:#c6d4e6;font-weight:500;border:1px solid transparent;transition:background .18s,border-color .18s,color .18s}
#app .side .nav button .ico{color:#97b0cf}
#app .side .nav button:hover{color:#fff;background:#c4ddff0c;border-color:#c4ddff0f}
#app .side .nav button:hover .ico{color:#d5e6ff}
#app .side .nav button.active{background:linear-gradient(110deg,#86b6ff30,#aacbff0d);border-color:#b2d2ff38;color:#fff;box-shadow:inset 0 1px 0 #ffffff14;font-weight:700}
#app .side .nav button.active .ico{color:#d5e6ff}
#app .side .escbox .escsel{background:#e3eeff0a;border:1px solid #bfd8ff26;color:#e2ecfa;border-radius:var(--r-2)}
#app .side .escbox .escsel:hover{background:#ffffff12}
#app .side .escbox .escseta{color:#adc3df}
#app .side .escmenu{background:#17283e;border-color:#3c5270;box-shadow:0 14px 40px #030a1680}
#app .side .escmenu button{color:#dae7f8}
#app .side .escmenu button:hover{background:#253d59}
#app .side .escmenu button.novo{color:#a9cdff;border-color:#3c5270}

/* Superfícies compartilhadas: agenda, financeiro, CRM, processos e configurações. */
.workspace{background:var(--painel)}
.workspace .app-header{background:var(--painel);border-bottom-color:transparent}
.workspace .app-header.rolando{background:var(--glass-fill);border-bottom-color:var(--glass-edge);box-shadow:0 8px 25px #06172c0a;backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%)}
.global-search{border-radius:var(--r-pill);background:var(--surface);border-color:var(--line)}
.topbar h1{font-weight:500;letter-spacing:-.04em}
.section,.block,.card,.dia-kpi,.dia-cabecalho,.dia-secao,.dia-saude,.clientcard,.trib,.controle-semana,.table-wrap{border-radius:var(--r-3)}
.dia-kpi b,.card .big{font-weight:500;letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.dia-kpi{transition:border-color .18s,background .18s}
.view-tabs{border-radius:var(--r-pill);background:var(--surface2);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--surface) 60%,transparent)}
.view-tabs button{border-radius:var(--r-pill);font-weight:500}
.view-tabs button.active{background:var(--surface);color:var(--brand);box-shadow:0 2px 7px #06172c0a}
.btn,.chip,.tutorial-help{border-radius:var(--r-pill)}
.btn:not(.ghost):not(.danger):not(.sm){box-shadow:inset 0 1px 0 #ffffff20}
.chip{font-weight:500}
.modal{border-radius:calc(var(--r-3) + var(--r-2));border-color:var(--line2);box-shadow:var(--glass-shadow)}
.drawer{border-left:1px solid var(--line2)}
.modal,.drawer,.global-search-suggestions{background:var(--surface)}
.overlay,.modal-bg{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.invite-root{background:radial-gradient(ellipse at 20% 0,#31557c,transparent 65%),#0a1423}
.invite-card{border-radius:calc(var(--r-3) * 2);border-color:var(--glass-edge);background:var(--glass-fill);box-shadow:var(--glass-shadow);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--brand);outline-offset:3px}
#app .side :focus-visible,.auth-top :focus-visible{outline-color:#b5d6ff}

@keyframes auth-cloud-drift{from{transform:translate3d(-2%,-2%,0) scale(1)}to{transform:translate3d(4%,3%,0) scale(1.08)}}
@media(min-width:761px){
  .workspace{border:1px solid var(--glass-edge);border-bottom:0;border-right:0;border-radius:calc(var(--r-3) + var(--r-2)) 0 0 0;box-shadow:-12px 0 50px #020c1815}
}
@media(max-width:1100px){
  .auth-shell{column-gap:38px;padding-inline:36px;grid-template-columns:minmax(340px,1fr) minmax(0,1fr)}
  .auth-proof{max-width:320px}
  .auth-description br{display:none}
}
@media(max-width:900px){
  .auth-shell{grid-template-columns:minmax(0,1fr);gap:32px;padding:26px 24px 24px}
  .auth-top{width:100%}
  .auth-art{display:none}
  .auth-panel{justify-self:center;width:100%;max-width:460px;padding:36px;min-height:0}
  .auth-footer{justify-content:center;text-align:center}
  .auth-footer>span:last-child{display:none}
}
@media(max-width:760px){
  .main{padding-top:84px}
  #app .side{background:linear-gradient(155deg,#1c3653,#0a1423 75%)}
  #app .side .brand{padding-right:54px}
  #app .side .mobile-menu-close{background:#ffffff0e;border-color:#bfd8ff30;color:#fff}
  .workspace .app-header{background:var(--glass-fill);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
  .mobile-bottom-nav{background:var(--glass-fill);border-top-color:var(--glass-edge);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
  .mobile-menu-trigger{background:var(--surface);border-color:var(--line);border-radius:var(--r-pill)}
  .modal{border-radius:var(--r-3)}
  .auth-shell{min-height:100dvh;row-gap:36px}
  .auth-panel{padding:30px 24px;border-radius:calc(var(--r-3) + var(--r-2))}
  .auth-content h1{font-size:2rem}
}
@media(prefers-reduced-motion:reduce){
  .auth-sky{animation:none}
  .auth-dotmark,#app .side .nav button,.dia-kpi{transition:none}
  .auth-art:hover .auth-dotmark{transform:none}
}
@media(prefers-reduced-transparency:reduce){
  .auth-panel,.invite-card,.workspace .app-header,.mobile-bottom-nav{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}
}
@supports not (backdrop-filter:blur(1px)){
  .auth-panel,.invite-card,.workspace .app-header,.mobile-bottom-nav{background:var(--surface)}
}
