/* Portal do Aluno — Nexos Pro
   Tokens e estilos compartilhados entre todas as páginas.
   Paleta "Cyber-Blue" do Nexos Pro (aprovada para o portal, para manter
   consistência visual de família de produto). */

:root{
  --bg:#0D0F14;--bg2:#161A22;--bg3:#1E2430;--border:#262C38;
  --accent:#007BFF;--neon:#00F2FF;--white:#F5F7FA;
  --gray1:#C7CDD9;--gray2:#8B93A3;--gray3:#565E6C;
  --green:#22C55E;--amber:#F5A623;--red:#EF4444;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);font-family:'Inter',sans-serif;color:var(--white);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
input::placeholder{color:var(--gray3)}
button{font-family:inherit;cursor:pointer}

/* shell de página — mobile-first, centraliza em telas largas */
.app-shell{max-width:480px;margin:0 auto;min-height:100dvh;background:var(--bg);display:flex;flex-direction:column;overflow:hidden}

.scr{overflow-y:auto}
.scr::-webkit-scrollbar{width:0px}

.navitem{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1;padding:8px 0;background:none;border:none;color:inherit}
.navitem.active svg{stroke:var(--neon)}
.navitem.active .navlabel{color:var(--neon);font-weight:700}
.navdot{width:24px;height:2px;border-radius:2px;background:transparent;margin-bottom:2px}
.navitem.active .navdot{background:var(--neon)}
.navlabel{font-size:9.5px;color:var(--gray3);font-weight:600}
.bottomnav{flex-shrink:0;display:flex;border-top:1px solid var(--border);background:var(--bg2);padding-bottom:6px}

.topbar-back{width:34px;height:34px;border-radius:10px;background:var(--bg2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0}

.stat{background:var(--bg2);border:1px solid var(--border);border-radius:14px;padding:12px 12px 11px;flex:1;min-width:0}
.qa{background:var(--bg2);border:1px solid var(--border);border-radius:14px;padding:13px;display:flex;flex-direction:column;gap:9px;min-height:88px}
.qa:active{border-color:var(--neon)}

.toggle{flex:1;text-align:center;padding:8px 0;border-radius:9px;font-size:12px;font-weight:700;cursor:pointer;color:var(--gray2);border:none;background:none;font-family:inherit}
.toggle.active{background:linear-gradient(135deg,var(--accent),#0057b8);color:#fff}

.mrow{display:flex;align-items:center;padding:11px 0;border-bottom:1px solid var(--border)}
.chip{font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:6px}
.chip.up{background:rgba(34,197,94,.12);color:var(--green)}
.chip.flat{background:rgba(0,242,255,.10);color:var(--neon)}
.chip.down{background:rgba(239,68,68,.12);color:var(--red)}

.ph{background:repeating-linear-gradient(135deg,#1E2430,#1E2430 8px,#232A38 8px,#232A38 16px)}

.lc,.pc{background:var(--bg2);border:1px solid var(--border);border-radius:14px;padding:14px;display:flex;align-items:center;gap:12px}
.dlbtn{width:36px;height:36px;border-radius:10px;background:rgba(0,123,255,.14);display:flex;align-items:center;justify-content:center;flex-shrink:0}

.prow,.irow{display:flex;align-items:center;padding:12px 0;border-bottom:1px solid var(--border)}
.st{font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:7px}
.st.pago{background:rgba(34,197,94,.12);color:var(--green)}
.st.atraso{background:rgba(245,166,35,.14);color:var(--amber)}
.st.pendente{background:rgba(139,147,163,.16);color:var(--gray1)}

.extbtn{display:flex;align-items:center;gap:12px;background:var(--bg2);border:1px solid var(--border);border-radius:14px;padding:14px 16px}

.fld{margin-bottom:16px}
.fld label{font-size:11px;font-weight:700;color:var(--gray2);letter-spacing:.4px;text-transform:uppercase;display:block;margin-bottom:7px}
.fld input{width:100%;background:var(--bg2);border:1px solid var(--border);border-radius:11px;padding:12px 14px;color:var(--white);font-size:13.5px;font-family:'Inter',sans-serif;outline:none}
.fld input:focus{border-color:var(--neon)}
.fld input:disabled{color:var(--gray3);background:var(--bg3)}

.bin{max-width:74%;background:var(--bg2);border:1px solid var(--border);border-radius:15px 15px 15px 4px;padding:9px 13px;font-size:13px;line-height:1.45}
.bout{max-width:74%;background:linear-gradient(135deg,var(--accent),#0057b8);border-radius:15px 15px 4px 15px;padding:9px 13px;font-size:13px;line-height:1.45;align-self:flex-end;color:#fff}

.btn-primary{width:100%;background:linear-gradient(135deg,var(--accent),#0057b8);color:#fff;border:none;border-radius:12px;padding:14px 18px;display:flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:14.5px;box-shadow:0 12px 28px -12px rgba(0,123,255,.55)}
.btn-secondary{width:100%;background:transparent;border:1px solid var(--border);color:var(--gray1);border-radius:12px;padding:12px 18px;display:flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:13px}
.btn-danger{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;border-radius:12px;border:1px solid var(--border);background:none;color:var(--red);font-size:13px;font-weight:700;width:100%}

.skeleton{background:var(--bg3);border-radius:8px;position:relative;overflow:hidden;color:transparent!important}
.skeleton::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.05),transparent);animation:shimmer 1.4s infinite}
@keyframes shimmer{from{transform:translateX(-100%)}to{transform:translateX(100%)}}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--bg3);border:1px solid var(--border);color:var(--white);padding:11px 18px;border-radius:12px;font-size:13px;font-weight:600;z-index:999;box-shadow:0 12px 30px rgba(0,0,0,.4)}
.toast.error{border-color:rgba(239,68,68,.4);color:var(--red)}