/* 1.64.0: ENTRADA COM E-MAIL E SENHA, MINHA CONTA E "ENTRAR COMO..." (web/contas.js).
   Mesma linguagem da entrada (web/login.css: --login-*) e do vidro do Hub (--glass-*, --r-*, --f-*). Alvos de 44 pt,
   botão que encolhe ao apertar, carregando com a frase do que está fazendo, verde quando deu certo, vermelho com o
   motivo quando não deu. Letra sempre pela escala do Hub (--f-* com --dt). */

/* ---------------------------------------------------------------- tela de entrada */
#start .login-contas{margin-top:6px}
#start .conta-form{display:flex;flex-direction:column;gap:12px;margin:0}
#start .conta-campo{display:flex;flex-direction:column;gap:6px;margin:0;font-size:var(--f-subhead,15px);font-weight:600;line-height:1.35;color:var(--login-ink)}
#start .conta-campo input,#start .conta-senha-caixa{box-sizing:border-box;width:100%;min-height:52px;border-radius:16px;background:var(--login-control);box-shadow:0 3px 12px rgba(43,28,18,.07);color:var(--login-ink)}
#start .conta-campo input{margin:0;padding:12px 16px;border:0;font:inherit;font-weight:500;font-size:var(--f-body,17px);caret-color:var(--login-ink)}
#start .conta-campo input::placeholder{color:var(--login-sub);opacity:1;font-weight:400}
#start .conta-campo input:focus{background:var(--login-field-active);box-shadow:0 3px 15px rgba(43,28,18,.12);outline:3px solid color-mix(in srgb,var(--login-focus) 55%,transparent);outline-offset:1px}
#start .conta-campo input[aria-invalid=true]{box-shadow:inset 0 0 0 2px var(--login-error)}
#start .conta-senha-caixa{display:flex;align-items:center;padding:0 4px 0 0}
#start .conta-senha-caixa input{flex:1;min-width:0;min-height:52px;box-shadow:none;background:transparent}
#start .conta-senha-caixa:focus-within{background:var(--login-field-active);outline:3px solid color-mix(in srgb,var(--login-focus) 55%,transparent);outline-offset:1px}
#start .conta-senha-caixa input:focus{outline:none;box-shadow:none;background:transparent}
.conta-ver{flex:none;min-width:44px;min-height:44px;padding:0 12px;border:0;border-radius:12px;background:transparent;color:var(--login-focus,var(--ink-blue,#1E6EF4));font:inherit;font-size:var(--f-footnote,13px);font-weight:650;cursor:pointer}
.conta-ver:active{transform:scale(.96);opacity:.8}
#start .conta-chip{display:flex;align-items:center;gap:8px;min-height:44px;padding:4px 4px 4px 14px;border-radius:14px;background:var(--login-well)}
#start .conta-chip-email{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--f-subhead,15px);font-weight:600}
#start .conta-texto,.conta-folha .conta-texto{margin:0;font-size:var(--f-subhead,15px);line-height:var(--lh-subhead,20px);color:var(--login-sub,var(--label2,#6B5A4C))}
#start .conta-texto b{color:var(--login-ink)}
#start .conta-dica,.conta-folha .conta-dica{margin:-4px 0 0;font-size:var(--f-footnote,13px);line-height:1.4;color:var(--login-sub,var(--label2,#6B5A4C))}
#start .conta-divisor{display:flex;align-items:center;gap:12px;margin:26px 0 14px;font-size:var(--f-footnote,13px);font-weight:500;line-height:1.4;color:var(--login-sub);text-align:center}
#start .conta-divisor::before,#start .conta-divisor::after{content:"";flex:1;height:1px;background:color-mix(in srgb,var(--login-sub) 30%,transparent)}
#start .login-antigo[hidden]{display:none}

/* botões (entrada e folhas) */
.conta-btn{box-sizing:border-box;width:100%;min-height:50px;padding:12px 20px;border:0;border-radius:13px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font:inherit;font-size:var(--f-callout,16px);line-height:1.3;font-weight:650;cursor:pointer;background:var(--login-well,var(--fill2,rgba(90,65,45,.12)));color:var(--login-ink,var(--label,#3A2A1E));transition:transform .12s ease,opacity .12s ease,background-color .2s ease}
.conta-btn.primario{background:var(--on-green,#257f37);color:#fff}
.conta-btn:active:not(:disabled){transform:scale(.97);opacity:.88}
.conta-btn.is-loading{opacity:.85;cursor:progress}
.conta-btn.is-loading::before,.conta-opcao.is-loading::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:conta-gira .7s linear infinite}
.conta-btn.is-ok,.conta-opcao.is-ok{background:var(--sys-green,#34C759)!important;color:#fff!important}
.conta-btn.is-ok::before{content:"✓";font-weight:800}
.conta-btn.is-erro,.conta-opcao.is-erro{background:var(--sys-red,#FF383C)!important;color:#fff!important;animation:conta-treme .32s}
.conta-btn.perigo{background:color-mix(in srgb,var(--sys-red,#FF383C) 14%,transparent);color:var(--ink-red,#B42318)}
.conta-link{align-self:center;min-height:44px;padding:0 12px;border:0;border-radius:12px;background:transparent;color:var(--login-focus,var(--ink-blue,#1E6EF4));font:inherit;font-size:var(--f-subhead,15px);font-weight:600;cursor:pointer}
.conta-link:active{opacity:.6}
.conta-link.discreto{color:var(--login-sub,var(--label2,#6B5A4C));font-weight:500;font-size:var(--f-footnote,13px)}
.conta-recado{margin:0;min-height:0;font-size:var(--f-subhead,15px);line-height:1.4;font-weight:550}
.conta-recado:empty{display:none}
.conta-recado.erro{color:var(--login-error,var(--ink-red,#B42318))}
.conta-recado.ok{color:var(--ink-green,#1C7A36)}
.conta-recado.info{color:var(--login-sub,var(--label2,#6B5A4C))}
.conta-lista{display:flex;flex-direction:column;gap:10px;margin:0 0 12px}
.conta-opcao{box-sizing:border-box;width:100%;min-height:64px;display:grid;grid-template-columns:minmax(0,1fr) 20px;gap:12px;align-items:center;padding:14px 18px;border:0;border-radius:18px;text-align:left;font:inherit;cursor:pointer;background:var(--login-control,var(--glass-bg,rgba(255,255,255,.72)));color:var(--login-ink,var(--label,#3A2A1E));box-shadow:0 5px 18px rgba(41,32,17,.065);transition:transform .14s ease,background-color .16s ease}
.conta-opcao:active{transform:scale(.985)}
.conta-opcao b{display:block;font-size:var(--f-headline,17px);font-weight:650;line-height:1.25}
.conta-opcao small{display:block;margin-top:3px;font-size:var(--f-footnote,13px);color:var(--login-sub,var(--label2,#6B5A4C))}
.conta-opcao>span[aria-hidden]{font-size:var(--f-title3,20px);color:var(--login-sub,var(--label3,#8A7666));text-align:right}
.conta-lista.pessoas .conta-opcao{grid-template-columns:44px minmax(0,1fr) 20px}
button:focus-visible.conta-btn,.conta-opcao:focus-visible,.conta-link:focus-visible,.conta-ver:focus-visible,.conta-x:focus-visible,.conta-linha:focus-visible{outline:3px solid var(--login-focus,var(--ink-blue,#1E6EF4));outline-offset:3px}

/* Dentro da entrada, a regra antiga ".start button" (botão azul grande) vale para todo botão: aqui cada botão volta
   ao seu desenho (mesma especificidade com #start, e este arquivo carrega antes; por isso o reforço). */
#start .conta-btn,#start .conta-link,#start .conta-ver,#start .conta-opcao{border:0;box-shadow:none;text-shadow:none;letter-spacing:normal}
#start .conta-btn{width:100%;min-height:50px;padding:12px 20px;border-radius:13px;font-size:var(--f-callout,16px);font-weight:650;background:var(--login-well);color:var(--login-ink)}
#start .conta-btn.primario{background:var(--on-green,#257f37);color:#fff}
#start .conta-link{width:auto;min-height:44px;padding:0 12px;border-radius:12px;background:transparent;color:var(--login-focus);font-size:var(--f-subhead,15px);font-weight:600}
#start .conta-link.discreto{color:var(--login-sub);font-weight:500;font-size:var(--f-footnote,13px);text-decoration:underline;text-underline-offset:3px}
#start .conta-ver{min-height:44px;padding:0 12px;border-radius:12px;background:transparent;color:var(--login-focus);font-size:var(--f-footnote,13px);font-weight:650}
#start .conta-opcao{min-height:64px;padding:14px 18px;border-radius:18px;background:var(--login-control);color:var(--login-ink);font-size:inherit;font-weight:inherit;box-shadow:0 5px 18px rgba(41,32,17,.065)}
#start .conta-recado{margin:0}

/* ---------------------------------------------------------------- botão da pessoa no topo */
.top .conta-avatar{position:relative}
.top .conta-avatar[hidden]{display:none}
.conta-iniciais{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:linear-gradient(145deg,var(--sys-blue,#0088FF),var(--sys-indigo,#6155F5));color:#fff;font-size:var(--f-footnote,13px);font-weight:750;letter-spacing:.02em}
body.conta-pin .conta-iniciais{background:linear-gradient(145deg,var(--sys-orange,#FF8D28),var(--sys-red,#FF383C))}

/* ---------------------------------------------------------------- folhas de vidro */
.conta-fundo{position:fixed;inset:0;z-index:2100;display:flex;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));background:rgba(20,14,8,.28);animation:conta-aparece .18s ease}
.conta-folha{box-sizing:border-box;width:min(460px,100%);max-height:min(88vh,760px);overflow:auto;overscroll-behavior:contain;border-radius:var(--r-sheet,20px);padding:6px 20px 20px;background:var(--vidro-grosso,var(--glass-bg,rgba(255,255,255,.86)));-webkit-backdrop-filter:blur(var(--glass-blur,24px)) saturate(180%);backdrop-filter:blur(var(--glass-blur,24px)) saturate(180%);border:1px solid var(--glass-border,rgba(255,255,255,.88));box-shadow:var(--glass-lift-alto,0 18px 46px rgba(40,25,12,.22));color:var(--label,#3A2A1E);animation:conta-entra .28s cubic-bezier(.2,.8,.2,1);--login-ink:var(--label,#3A2A1E);--login-sub:var(--label2,#6B5A4C);--login-control:var(--surface,#fff);--login-field-active:var(--surface,#fff);--login-well:var(--fill,rgba(90,65,45,.08));--login-error:var(--ink-red,#B42318);--login-focus:var(--ink-blue,#1E6EF4)}
.conta-folha-topo{position:sticky;top:0;z-index:1;display:flex;align-items:center;gap:8px;min-height:56px;margin:0 -20px 8px;padding:0 12px 0 20px;background:inherit;border-radius:var(--r-sheet,20px) var(--r-sheet,20px) 0 0}
.conta-folha-topo h2{flex:1;margin:0;font-size:var(--f-title3,20px);line-height:var(--lh-title3,25px);font-weight:700}
.conta-x{flex:none;min-width:44px;min-height:44px;border:0;border-radius:var(--r-pill,999px);background:var(--fill,rgba(90,65,45,.08));color:var(--label2,#6B5A4C);font-size:var(--f-title2,22px);line-height:1;cursor:pointer}
.conta-x:active{transform:scale(.94)}
.conta-folha-corpo{display:flex;flex-direction:column;gap:12px}
.conta-folha .conta-form{display:flex;flex-direction:column;gap:12px}
.conta-folha .conta-campo{display:flex;flex-direction:column;gap:6px;font-size:var(--f-subhead,15px);font-weight:600}
.conta-folha .conta-campo input{box-sizing:border-box;width:100%;min-height:48px;padding:12px 16px;border:1px solid var(--sep,rgba(58,42,30,.18));border-radius:var(--r-ctl,12px);background:var(--surface,#fff);color:inherit;font:inherit;font-size:var(--f-body,17px);font-weight:500}
.conta-folha .conta-campo input:focus-visible{outline:3px solid color-mix(in srgb,var(--sys-blue,#0088FF) 45%,transparent);outline-offset:1px}
.conta-folha .conta-pin-campo{letter-spacing:.4em;text-align:center;font-size:var(--f-title2,22px)!important}
.conta-quem{display:flex;align-items:center;gap:14px;padding:4px 0 6px}
.conta-quem b{display:block;font-size:var(--f-headline,17px)}
.conta-quem small{display:block;font-size:var(--f-footnote,13px);color:var(--label2,#6B5A4C);line-height:1.4}
.conta-avatar-grande,.conta-avatar-medio{flex:none;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,var(--sys-blue,#0088FF),var(--sys-indigo,#6155F5));color:#fff;font-weight:750}
.conta-avatar-grande{width:56px;height:56px;font-size:var(--f-title3,20px)}
.conta-avatar-medio{width:44px;height:44px;font-size:var(--f-subhead,15px)}
.conta-linha{display:grid;grid-template-columns:minmax(0,1fr) 20px;align-items:center;gap:10px;width:100%;min-height:60px;padding:10px 14px;border:0;border-radius:var(--r-card,16px);background:var(--fill,rgba(90,65,45,.08));color:inherit;font:inherit;text-align:left;cursor:pointer}
.conta-linha:active{transform:scale(.985)}
.conta-linha b{display:block;font-size:var(--f-body,17px);font-weight:650}
.conta-linha small{display:block;font-size:var(--f-footnote,13px);color:var(--label2,#6B5A4C)}
.conta-grupo{border-radius:var(--r-card,16px);background:var(--fill,rgba(90,65,45,.08));padding:0 14px}
.conta-grupo>summary{min-height:52px;display:flex;align-items:center;font-size:var(--f-body,17px);font-weight:650;cursor:pointer;list-style:none}
.conta-grupo>summary::-webkit-details-marker{display:none}
.conta-grupo>summary::after{content:"›";margin-left:auto;font-size:var(--f-title3,20px);color:var(--label3,#8A7666);transition:transform .18s ease}
.conta-grupo[open]>summary::after{transform:rotate(90deg)}
.conta-grupo[open]{padding-bottom:14px}
.conta-nota{margin:0;padding:10px 12px;border-radius:var(--r-ctl,12px);background:color-mix(in srgb,var(--sys-orange,#FF8D28) 14%,transparent);font-size:var(--f-footnote,13px);line-height:1.45}
/* 1.72.0 (auditoria de design 1720): no celular, as alturas das folhas do sistema (web/folha.css) */
@media (max-width:640px){.conta-fundo{align-items:flex-end;padding:0}.conta-folha{width:100%;max-height:var(--folha-grande,92vh);min-height:var(--folha-media,50vh);border-radius:var(--r-sheet,20px) var(--r-sheet,20px) 0 0;padding-bottom:var(--folha-base,max(20px,env(safe-area-inset-bottom)))}}
/* 1.72.0 (auditoria de design 1720): no app a barra de abas some com a folha aberta (web/folha.js); a folha encosta embaixo,
   com os botões acima do indicador de início (web/folha.css, --folha-base) */
html.app-nativo .conta-fundo{padding-bottom:max(16px,env(safe-area-inset-bottom,0px))}
body.dark .conta-fundo{background:rgba(0,0,0,.45)}
body.dark .conta-folha .conta-campo input{background:var(--surface2,#2C2A27);border-color:rgba(255,255,255,.12)}
@media (prefers-reduced-transparency:reduce){.conta-folha{background:var(--surface,#fff);-webkit-backdrop-filter:none;backdrop-filter:none}body.dark .conta-folha{background:var(--surface,#22201E)}}
@media (prefers-reduced-motion:reduce){.conta-fundo,.conta-folha,.conta-btn.is-erro{animation:none}.conta-btn,.conta-opcao,.conta-linha{transition:none}}
@keyframes conta-gira{to{transform:rotate(360deg)}}
@keyframes conta-treme{25%{transform:translateX(-6px)}50%{transform:translateX(6px)}75%{transform:translateX(-3px)}}
@keyframes conta-entra{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@keyframes conta-aparece{from{opacity:0}to{opacity:1}}

/* ---------------------------------------------------------------- telas que a pessoa não pode abrir */
body.sem-fin #seg [data-view="fin"],body.sem-fin .menudd [data-view="fin"],
body.sem-ges #seg [data-view="ges"],body.sem-ges .menudd [data-view="ges"],
body.sem-kds #seg [data-view="kds"],body.sem-kds .menudd [data-view="kds"],
body.sem-exp #seg [data-view="exp"],body.sem-exp .menudd [data-view="exp"],
body.sem-menu #seg [data-view="menu"],body.sem-menu .menudd [data-view="menu"],
body.sem-rev #seg [data-view="rev"],body.sem-rev .menudd [data-view="rev"],
body.sem-sys #seg [data-view="sys"],body.sem-sys .menudd [data-view="sys"],
body.sem-cfg #seg [data-view="cfg"],body.sem-cfg .menudd [data-view="cfg"],
body.sem-sim #seg [data-view="sim"],body.sem-sim .menudd [data-view="sim"],
body.sem-neg #seg [data-view="neg"],body.sem-neg .menudd [data-view="neg"],
body.sem-cer #seg [data-view="cer"],body.sem-cer .menudd [data-view="cer"]{display:none!important}