
:root {
  --bg:#e8f1f8; --card:#fff; --primary:#2d5a87; --primary-dark:#1e3f61;
  --accent:#f5b942; --green:#16a34a; --red:#dc2626; --text:#1e293b; --muted:#64748b;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,sans-serif;background:linear-gradient(180deg,#d6e8f5,#e8f1f8);color:var(--text);min-height:100vh}
.app-header{background:linear-gradient(135deg,#0a0a0c,#1a1a22);color:#fff;padding:12px 16px;position:sticky;top:0;z-index:20;border-bottom:2px solid #c9a227}
.app-header .brand{display:flex;align-items:center;gap:12px}
.app-header img{height:48px;width:auto;max-width:140px;object-fit:contain;border-radius:8px}
.app-header h1{margin:0;font-size:1.1rem;font-weight:800;color:#e8d48b}
.app-header .sub{font-size:11px;color:#a8a29a}
.tabs{display:flex;gap:6px;padding:10px 12px;overflow-x:auto;background:#fff;border-bottom:1px solid #e2e8f0;position:sticky;top:72px;z-index:15}
.tab{flex:0 0 auto;border:0;background:#eef4fa;color:var(--primary-dark);padding:8px 14px;border-radius:999px;font-weight:700;font-size:13px;cursor:pointer}
.tab.active{background:var(--primary);color:#fff}
.main{padding:14px 14px 90px;max-width:560px;margin:0 auto}
.card{background:var(--card);border-radius:16px;padding:16px;box-shadow:0 4px 14px rgba(45,90,135,.12);margin-bottom:14px}
.card h2{margin:0 0 10px;font-size:1.05rem;color:var(--primary-dark)}
.card-penal{border:2px solid #fecaca;background:#fffbfb}
.kpi{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.kpi .box{background:#fff;border-radius:14px;padding:12px;text-align:center;box-shadow:0 4px 14px rgba(45,90,135,.1)}
.kpi .box .lab{font-size:11px;color:var(--muted);text-transform:uppercase;font-weight:700}
.kpi .box .val{font-size:1.25rem;font-weight:800;margin-top:4px}
.kpi .box .val.pos{color:var(--green)}.kpi .box .val.neg{color:var(--red)}
.kpi .box.full{grid-column:1/-1;background:linear-gradient(135deg,#1e3f61,#2d5a87);color:#fff}
.kpi .box.full .lab{color:#cde0f5}.kpi .box.full .val{color:#f5b942;font-size:1.7rem}
.child-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.chip{border:2px solid #cfe0f0;background:#fff;border-radius:999px;padding:8px 14px;font-weight:700;cursor:pointer;font-size:13px}
.chip.active{border-color:var(--accent);background:#fff8e6}
.task{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid #e2e8f0;border-radius:12px;margin-bottom:8px;background:#fafbfc}
.task.done{background:#ecfdf5;border-color:#86efac}.task.fail{background:#fef2f2;border-color:#fca5a5}
.task .name{flex:1;font-size:14px;font-weight:600}
.task .plus{color:var(--green);font-weight:700;display:block}
.cat{color:var(--muted);font-size:11px}
.task button{border:0;border-radius:10px;padding:8px 10px;font-weight:700;cursor:pointer;font-size:12px}
.btn-ok{background:#dcfce7;color:#166534}.btn-no{background:#fee2e2;color:#991b1b}
.btn{border:0;border-radius:12px;padding:12px 16px;font-weight:800;cursor:pointer;font-size:14px}
.btn-primary{background:linear-gradient(135deg,#1e3f61,#2d5a87);color:#fff}
.btn-accent{background:var(--accent);color:#1e293b}
.btn-danger{background:#dc2626;color:#fff}
.btn-outline{background:#fff;border:2px solid #cfe0f0;color:var(--primary-dark)}
.btn-sm{padding:6px 10px;font-size:12px}
.row-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
input,select{width:100%;padding:11px 12px;border-radius:10px;border:1.5px solid #cfe0f0;font:inherit;margin-top:4px}
label{font-size:12px;font-weight:700;color:var(--muted);display:block;margin-top:10px}
.list-item{display:flex;justify-content:space-between;gap:8px;padding:10px 0;border-bottom:1px solid #eef2f7;font-size:14px}
.amt.pos{color:var(--green);font-weight:800}.amt.neg{color:var(--red);font-weight:800}
.pots{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.pot{text-align:center;padding:12px 8px;border-radius:14px;background:#f0f7fc;border:2px solid #cfe0f0}
.pot strong{display:block;font-size:1.05rem;color:var(--primary-dark)}
.pot span{font-size:11px;color:var(--muted);font-weight:700}
.hint{font-size:13px;color:var(--muted);margin:0 0 10px;line-height:1.4}
.perfil-badge{display:inline-block;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:800;margin-bottom:10px}
.perfil-badge.pais{background:#dbeafe;color:#1e3a8a}
.perfil-badge.filho{background:#dcfce7;color:#166534}
.footer-brand{text-align:center;font-size:11px;color:var(--muted);padding:20px}
.hidden{display:none!important}

.me-pin-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(15, 23, 42, .55);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
}
.me-pin-box {
  background: #fff; border-radius: 16px; padding: 20px;
  width: 100%; max-width: 340px;
  box-shadow: 0 12px 40px rgba(0,0,0,.25);
}
.me-pin-box h3 { margin: 0 0 8px; color: #1e3f61; font-size: 1.1rem; }
.me-pin-box p { margin: 0 0 12px; font-size: 13px; color: #64748b; line-height: 1.4; }
.me-pin-box input[type=password] {
  width: 100%; padding: 14px; font-size: 1.25rem; letter-spacing: .3em;
  text-align: center; border: 2px solid #cfe0f0; border-radius: 12px;
  margin-bottom: 14px;
}
.me-pin-actions { display: flex; gap: 10px; }
.me-pin-actions .btn { flex: 1; }
.me-pin-err { color: #dc2626; font-size: 13px; font-weight: 700; margin: 8px 0 0; }


/* iOS PWA */
html, body { -webkit-text-size-adjust: 100%; }
body { padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); }
.top, header, .app-header { padding-top: max(8px, env(safe-area-inset-top)); }
.nav, .sidebar, aside { padding-bottom: env(safe-area-inset-bottom); }
input, select, textarea, button { font-size: 16px !important; } /* evita zoom iOS */


.proj-box{margin-top:8px}
.proj-inputs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0}
.proj-inputs label{font-size:12px;color:#64748b;display:block;margin-bottom:4px}
.proj-inputs input,.proj-inputs select{width:100%;padding:10px;border-radius:10px;border:1px solid #334155;background:#0f172a;color:#e2e8f0;font-size:15px;font-weight:700}
.proj-total{background:linear-gradient(135deg,#0f172a,#1a1510);border:1px solid #c9a22755;border-radius:14px;padding:14px;text-align:center;margin:10px 0}
.proj-total .big{font-size:26px;font-weight:800;color:#e8c547}
.proj-total .sub{font-size:12px;color:#94a3b8;margin-top:4px}
.proj-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}
.proj-table th,.proj-table td{padding:8px 6px;border-bottom:1px solid #1e293b;text-align:left}
.proj-table th{color:#94a3b8;font-size:11px;text-transform:uppercase}
.proj-table .ac{color:#34d399;font-weight:700}
.proj-hint{font-size:12px;color:#94a3b8;line-height:1.45;margin-top:8px}
.proj-chips{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.proj-chips button{border:1px solid #334155;background:#1e293b;color:#e2e8f0;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:700;cursor:pointer}
.proj-chips button.on{background:rgba(201,162,39,.25);border-color:#c9a227;color:#e8c547}


/* ===== Home Mesada Educativa (layout arte) ===== */
.me-home{padding-bottom:24px}
.me-saldo-card{
  background:linear-gradient(135deg,#c9a227 0%,#8a7020 45%,#5c4a12 100%);
  border-radius:18px;padding:18px 18px 16px;color:#fff;
  box-shadow:0 12px 32px rgba(201,162,39,.35);margin-bottom:16px;
}
.me-saldo-lab{font-size:11px;font-weight:700;letter-spacing:.06em;opacity:.92;text-transform:uppercase}
.me-saldo-row{display:flex;align-items:center;justify-content:space-between;margin-top:6px}
.me-saldo-val{font-size:1.85rem;font-weight:800;letter-spacing:-.02em}
.me-saldo-ico{font-size:1.6rem;background:rgba(0,0,0,.15);width:44px;height:44px;border-radius:12px;display:grid;place-items:center}
.me-saldo-sub{font-size:12px;opacity:.88;margin-top:8px}
.me-section{
  background:#0f172a;border:1px solid rgba(201,162,39,.25);border-radius:16px;
  padding:14px;margin-bottom:14px;color:#e2e8f0;
}
.me-section-head{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:800;letter-spacing:.05em;color:#c9a227;margin-bottom:12px}
.me-link{background:none;border:0;color:#93c5fd;font-size:12px;font-weight:700;cursor:pointer}
.me-kids-grid{display:flex;flex-direction:column;gap:10px}
.me-kid-card{display:flex;gap:12px;align-items:center;background:#1e293b;border-radius:14px;padding:12px;cursor:pointer;border:1px solid #334155}
.me-kid-av{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-weight:800;color:#fff;font-size:1.2rem;flex-shrink:0}
.me-kid-info{flex:1;min-width:0}
.me-kid-name{font-weight:800;font-size:15px}
.me-kid-meta{font-size:11px;color:#94a3b8;margin:2px 0 6px}
.me-prog-track{height:8px;background:#334155;border-radius:99px;overflow:hidden}
.me-prog-fill{height:100%;border-radius:99px;transition:width .3s}
.me-kid-pct{font-size:11px;font-weight:700;color:#c9a227;margin-top:4px}
.me-parental-body{display:flex;gap:12px;align-items:flex-start}
.me-shield{font-size:1.8rem;background:#1e293b;border-radius:12px;padding:10px}
.me-parental-title{font-weight:800;font-size:15px}
.me-parental-desc{font-size:12px;color:#94a3b8;margin:4px 0}
.me-dot-on{font-size:12px;color:#4ade80;font-weight:700}
.me-mesada-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.me-mesada-tile{background:#1e293b;border-radius:12px;padding:12px;border:1px solid #334155}
.me-tile-ico{font-size:1.2rem;margin-bottom:4px}
.me-tile-lab{font-size:11px;color:#94a3b8}
.me-tile-val{font-weight:800;font-size:14px;margin-top:4px;color:#f8fafc}
.me-pots-mini{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-top:12px}
.me-pots-mini div{text-align:center;background:#1e293b;border-radius:10px;padding:10px 6px;border:1px solid #334155}
.me-pots-mini strong{display:block;color:#c9a227;font-size:13px}
.me-pots-mini span{font-size:10px;color:#94a3b8;font-weight:700;text-transform:uppercase}
.me-tasks .task{background:#1e293b;border-color:#334155;color:#e2e8f0}
.me-tasks .task .name{color:#e2e8f0}
.me-home .btn-outline{background:transparent;border-color:#c9a227;color:#c9a227}
.me-home .btn-primary{background:linear-gradient(135deg,#c9a227,#8a7020);color:#1a1205}


/* Foto do filho */
.me-foto-box{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:14px}
.me-foto-preview{
  width:96px;height:96px;border-radius:50%;overflow:hidden;
  background:linear-gradient(135deg,#c9a227,#1a1a2e);
  display:grid;place-items:center;border:3px solid #c9a227;
  box-shadow:0 8px 20px rgba(0,0,0,.2);
}
.me-foto-preview img{width:100%;height:100%;object-fit:cover;display:block}
.me-foto-ph{font-size:2rem;font-weight:800;color:#fff}
.me-foto-actions{display:flex;flex-wrap:wrap;gap:8px}
.me-kid-av-foto{padding:0;overflow:hidden;background:#1e293b!important}
.me-kid-av-foto img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}

/* iPhone: PIN nunca mostra dígitos */
#me-pin-input, #me-pin-new, #me-pin-new2, #cfg-pin {
  -webkit-text-security: disc !important;
  text-security: disc;
  letter-spacing: 0.25em;
}
/* safe area iPhone */
.app-header, .tabs, .main {
  padding-left: max(12px, env(safe-area-inset-left));
  padding-right: max(12px, env(safe-area-inset-right));
}
.main { padding-bottom: max(24px, env(safe-area-inset-bottom)); }
.ios-banner-safari {
  position: sticky; top: 0; z-index: 50;
  background: #fff7ed; color: #9a3412; border-bottom: 1px solid #fdba74;
  padding: 10px 14px; font-size: 13px; line-height: 1.4;
}
