*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;overflow:hidden;}
body{font-family:'DM Sans',sans-serif;background:#f0ede6;color:#1a1a1a;-webkit-font-smoothing:antialiased;}

:root{
  --accent:#0f6e56;--accent-l:#e1f5ee;--accent-m:#1d9e75;--accent-d:#085041;
  --black:#1a1a1a;--dark:#2c2c2a;--mid:#7a7975;--light:#d3d1c7;
  --bg:#f7f6f2;--surface:#fff;
  --amber:#ba7517;--amber-l:#faeeda;
  --blue:#185fa5;--blue-l:#e6f1fb;
  --coral:#993c1d;--coral-l:#faece7;
  --red:#a32d2d;--red-l:#fcebeb;
  --st:env(safe-area-inset-top,0px);
  --sb:env(safe-area-inset-bottom,0px);
}

/* ── Shell ── */
.app{position:fixed;inset:0;display:flex;flex-direction:column;max-width:430px;margin:0 auto;background:var(--surface);overflow:hidden;box-shadow:0 0 60px rgba(0,0,0,.15);}
.screen{display:none;flex-direction:column;flex:1;overflow:hidden;}
.screen.active{display:flex;}

/* ── Loading ── */
.loading-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;}
.spinner{width:32px;height:32px;border:2.5px solid var(--light);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── Auth ── */
.auth-wrap{flex:1;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--st) + 40px) 28px calc(var(--sb) + 32px);overflow-y:auto;}
.auth-logo{font-family:'Playfair Display',serif;font-size:34px;font-weight:600;letter-spacing:-.5px;}
.dot{color:var(--accent);}
.auth-tagline{font-size:12px;color:var(--mid);margin-top:5px;margin-bottom:32px;}
.role-tabs{display:flex;background:var(--bg);border-radius:12px;padding:4px;margin-bottom:22px;}
.role-tab{flex:1;padding:9px;border:none;background:transparent;border-radius:9px;font-family:'DM Sans',sans-serif;font-size:13px;font-weight:500;color:var(--mid);cursor:pointer;transition:all .2s;}
.role-tab.active{background:var(--surface);color:var(--black);box-shadow:0 1px 4px rgba(0,0,0,.1);}
.field-label{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.6px;color:var(--mid);margin-bottom:5px;display:block;}
.auth-input{width:100%;padding:12px 14px;border:1.5px solid var(--light);border-radius:10px;font-family:'DM Sans',sans-serif;font-size:14px;color:var(--black);background:var(--surface);margin-bottom:14px;outline:none;transition:border-color .2s;-webkit-appearance:none;}
.auth-input:focus{border-color:var(--accent);}
select.auth-input{cursor:pointer;}
.btn-primary{width:100%;padding:14px;background:var(--accent);color:#fff;border:none;border-radius:12px;font-family:'DM Sans',sans-serif;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s;position:relative;}
.btn-primary:active{background:var(--accent-d);}
.btn-primary:disabled{opacity:.6;cursor:not-allowed;}
.auth-error{font-size:12px;color:var(--red);margin-bottom:10px;min-height:16px;}
.auth-hint{font-size:11px;color:var(--light);text-align:center;margin-top:12px;}

/* ── Topbar ── */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:calc(var(--st) + 14px) 18px 13px;border-bottom:1px solid var(--bg);background:var(--surface);flex-shrink:0;}
.topbar-logo{font-family:'Playfair Display',serif;font-size:19px;font-weight:600;display:flex;align-items:center;gap:3px;}
.pt-badge{font-family:'DM Sans',sans-serif;font-size:10px;color:var(--mid);margin-left:2px;}

/* ── Avatars ── */
.avatar{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;cursor:pointer;flex-shrink:0;}
.avatar.sm{width:40px;height:40px;font-size:13px;}
.avatar.lg{width:56px;height:56px;font-size:18px;}
.av-green{background:var(--accent-l);color:var(--accent);}
.av-dark{background:var(--dark);color:#fff;}
.av-blue{background:var(--blue-l);color:var(--blue);}
.av-amber{background:var(--amber-l);color:var(--amber);}
.av-coral{background:var(--coral-l);color:var(--coral);}

/* ── Content ── */
.content{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:18px;}
.tab-pane{display:none;}
.tab-pane.active{display:block;}

/* ── Typography ── */
.greeting{font-family:'Playfair Display',serif;font-size:22px;font-weight:500;margin-bottom:3px;}
.greeting-sub{font-size:12px;color:var(--mid);margin-bottom:20px;}
.pane-title{font-family:'Playfair Display',serif;font-size:19px;font-weight:500;}
.pane-sub{font-size:11px;color:var(--mid);margin-top:2px;margin-bottom:16px;}
.pane-header-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;}
.section-title{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.6px;color:var(--mid);margin:16px 0 8px;}

/* ── Stats ── */
.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:14px;}
.stat-card{background:var(--bg);border-radius:12px;padding:14px;}
.stat-val{font-family:'Playfair Display',serif;font-size:26px;font-weight:600;line-height:1;}
.stat-val small{font-size:13px;font-weight:400;font-family:'DM Sans',sans-serif;}
.stat-lbl{font-size:10px;color:var(--mid);margin-top:3px;}

/* ── Cards ── */
.card{background:var(--surface);border:1px solid var(--light);border-radius:14px;padding:14px;margin-bottom:12px;}
.card-title{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.6px;color:var(--mid);margin-bottom:12px;}
.loading-row{font-size:13px;color:var(--mid);padding:8px 0;}

/* ── Progress bar ── */
.progress-track{background:var(--bg);border-radius:100px;height:7px;margin-top:8px;}
.progress-fill{height:7px;border-radius:100px;background:var(--accent);}

/* ── Buttons ── */
.btn-sm{padding:7px 13px;border-radius:8px;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;cursor:pointer;border:1px solid var(--accent);color:var(--accent);background:transparent;white-space:nowrap;transition:all .15s;}
.btn-sm.filled{background:var(--accent);color:#fff;}
.btn-sm.danger{border-color:var(--red);color:var(--red);}
.btn-sm:active{opacity:.75;}
.btn-icon{background:none;border:none;cursor:pointer;padding:4px;color:var(--mid);font-size:18px;line-height:1;}

/* ── Seg tabs ── */
.seg-tabs{display:flex;gap:5px;margin-bottom:12px;flex-wrap:wrap;}
.seg{padding:6px 13px;border-radius:20px;font-family:'DM Sans',sans-serif;font-size:11px;font-weight:500;cursor:pointer;border:1px solid var(--light);color:var(--mid);background:var(--surface);}
.seg.active{background:var(--accent);color:#fff;border-color:var(--accent);}

/* ── Exercise list ── */
.ex-item{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--bg);}
.ex-item:last-child{border-bottom:none;}
.ex-num{width:26px;height:26px;border-radius:50%;background:var(--accent-l);color:var(--accent);font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.ex-badge{font-size:10px;background:var(--accent-l);color:var(--accent);padding:3px 7px;border-radius:20px;font-weight:600;flex-shrink:0;}
.ex-body{flex:1;min-width:0;}
.ex-name{font-size:13px;font-weight:500;}
.ex-meta{font-size:11px;color:var(--mid);margin-top:1px;}
.ex-check{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--light);cursor:pointer;flex-shrink:0;transition:all .2s;display:flex;align-items:center;justify-content:center;}
.ex-check.done{background:var(--accent);border-color:var(--accent);}
.ex-check.done::after{content:'';width:5px;height:9px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg) translate(-1px,-1px);display:block;}

/* ── Timer ── */
.timer-wrap{background:var(--accent);border-radius:14px;padding:18px;margin-bottom:12px;text-align:center;color:#fff;}
.timer-label{font-size:11px;opacity:.8;margin-bottom:6px;}
.timer-digits{font-family:'Playfair Display',serif;font-size:48px;font-weight:600;line-height:1;}
.timer-btns{display:flex;gap:8px;justify-content:center;margin-top:12px;}
.timer-btn{padding:8px 18px;border-radius:8px;border:1.5px solid rgba(255,255,255,.5);color:#fff;background:transparent;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;cursor:pointer;}
.timer-btn.active{background:rgba(255,255,255,.2);}

/* ── Carga input row ── */
.carga-row{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--bg);}
.carga-row:last-child{border-bottom:none;}
.carga-name{flex:1;font-size:13px;font-weight:500;}
.carga-input{width:64px;padding:6px 8px;border:1.5px solid var(--light);border-radius:8px;font-family:'DM Sans',sans-serif;font-size:13px;text-align:center;outline:none;}
.carga-input:focus{border-color:var(--accent);}
.carga-unit{font-size:11px;color:var(--mid);}

/* ── PR badge ── */
.pr-badge{font-size:10px;background:#faeeda;color:#854f0b;padding:2px 6px;border-radius:10px;font-weight:600;margin-left:6px;}

/* ── Chat ── */
.chat-window{display:flex;flex-direction:column;height:100%;}
.chat-header{display:flex;align-items:center;gap:9px;margin-bottom:12px;flex-shrink:0;}
.chat-peer{font-size:14px;font-weight:500;}
.chat-messages{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:5px;padding-bottom:12px;}
.msg-time{font-size:10px;color:var(--mid);text-align:center;margin:8px 0 3px;}
.bubble{max-width:78%;padding:9px 13px;border-radius:16px;font-size:13px;line-height:1.5;word-break:break-word;}
.bubble.in{background:var(--bg);border-bottom-left-radius:3px;align-self:flex-start;}
.bubble.out{background:var(--accent);color:#fff;border-bottom-right-radius:3px;align-self:flex-end;}
.chat-input-row{display:flex;gap:7px;padding-top:10px;border-top:1px solid var(--bg);flex-shrink:0;}
.chat-input{flex:1;padding:10px 14px;border:1.5px solid var(--light);border-radius:22px;font-family:'DM Sans',sans-serif;font-size:13px;outline:none;}
.chat-input:focus{border-color:var(--accent);}
.send-btn{width:38px;height:38px;border-radius:50%;background:var(--accent);border:none;color:#fff;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;}

/* ── Overlay (chat / ficha) ── */
.overlay{display:none;position:absolute;inset:0;background:var(--surface);flex-direction:column;z-index:20;}
.overlay.open{display:flex;}
.overlay .chat-messages{flex:1;padding:16px;display:flex;flex-direction:column;gap:5px;overflow-y:auto;}
.overlay .chat-input-row{padding:10px 16px calc(var(--sb) + 16px);border-top:1px solid var(--bg);}
.back-btn{background:none;border:none;font-size:20px;color:var(--mid);cursor:pointer;padding:3px 10px 3px 0;line-height:1;}
.overlay-title{font-size:15px;font-weight:500;}

/* ── Client rows ── */
.client-row{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid var(--bg);cursor:pointer;}
.client-row:last-child{border-bottom:none;}
.cl-info{flex:1;min-width:0;}
.cl-name{font-size:13px;font-weight:500;}
.cl-meta{font-size:11px;color:var(--mid);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.status-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.dot-green{background:var(--accent-m);}
.dot-amber{background:var(--amber);}
.dot-red{background:var(--red);}

/* ── Inbox ── */
.inbox-row{display:flex;align-items:center;gap:11px;padding:12px 14px;border-bottom:1px solid var(--bg);cursor:pointer;}
.inbox-row:last-child{border-bottom:none;}
.inbox-time{font-size:10px;color:var(--mid);white-space:nowrap;}
.cl-meta.unread{font-weight:500;color:var(--black);}

/* ── Check-in stars ── */
.checkin-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.checkin-label{font-size:12px;font-weight:500;width:54px;flex-shrink:0;}
.stars{display:flex;gap:4px;}
.star{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--light);font-size:14px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s;}
.star.active{background:var(--accent);border-color:var(--accent);color:#fff;}

/* ── Ficha aluno ── */
.ficha-section{margin-bottom:16px;}
.ficha-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--bg);font-size:13px;}
.ficha-row:last-child{border-bottom:none;}
.ficha-key{color:var(--mid);}
.ficha-val{font-weight:500;}
.objetivo-tag{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;background:var(--accent-l);color:var(--accent);}

/* ── Modal ── */
.modal-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:50;align-items:flex-end;justify-content:center;}
.modal-backdrop.open{display:flex;}
.modal{background:var(--surface);border-radius:20px 20px 0 0;padding:20px 20px calc(var(--sb) + 20px);width:100%;max-width:430px;max-height:90vh;overflow-y:auto;}
.modal-title{font-family:'Playfair Display',serif;font-size:18px;font-weight:500;margin-bottom:16px;}
.modal-close{position:absolute;top:16px;right:18px;background:none;border:none;font-size:22px;cursor:pointer;color:var(--mid);}

/* ── Gamification ── */
.achievement{display:flex;align-items:center;gap:10px;padding:10px;background:var(--amber-l);border-radius:10px;margin-bottom:8px;}
.ach-icon{font-size:22px;}
.ach-name{font-size:13px;font-weight:500;color:var(--amber);}
.ach-desc{font-size:11px;color:var(--mid);}

/* ── Progress photos ── */
.photos-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.photo-slot{aspect-ratio:3/4;background:var(--bg);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:28px;cursor:pointer;border:1.5px dashed var(--light);}
.photo-slot img{width:100%;height:100%;object-fit:cover;border-radius:9px;}

/* ── Bottom nav ── */
.bottomnav{display:flex;border-top:1px solid var(--bg);padding:5px 0 calc(var(--sb) + 7px);background:var(--surface);flex-shrink:0;}
.nav-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;cursor:pointer;padding:5px 0;color:var(--light);transition:color .15s;}
.nav-btn svg{width:20px;height:20px;}
.nav-btn span{font-family:'DM Sans',sans-serif;font-size:9px;font-weight:500;}
.nav-btn.active{color:var(--accent);}
.nav-badge{position:absolute;top:-2px;right:-4px;width:14px;height:14px;background:var(--red);border-radius:50%;font-size:8px;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center;}
.nav-rel{position:relative;}

/* ── Misc ── */
.divider{height:1px;background:var(--bg);margin:12px 0;}
.empty-state{text-align:center;padding:32px 16px;color:var(--mid);font-size:13px;}
.tag{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:500;}
.tag-green{background:var(--accent-l);color:var(--accent);}
.tag-red{background:var(--red-l);color:var(--red);}
.tag-amber{background:var(--amber-l);color:var(--amber);}

/* ── Modo escuro ── */
[data-theme="dark"] {
  --accent:#2bc48a;--accent-l:#0d3d2a;--accent-m:#2bc48a;--accent-d:#1d9e75;
  --black:#f0ede6;--dark:#e8e2d8;--mid:#b0ada6;--light:#3a3a38;
  --bg:#1a1a18;--surface:#242422;
  --amber:#f5c97a;--amber-l:#2a2010;
  --blue:#7ab3e8;--blue-l:#0d1f35;
  --coral:#e8856a;--coral-l:#2a1510;
  --red:#e87a7a;--red-l:#2a1010;
}

/* Textos */
[data-theme="dark"] body { color:#f0ede6; }
[data-theme="dark"] .greeting { color:#f0ede6; }
[data-theme="dark"] .greeting-sub { color:#b0ada6; }
[data-theme="dark"] .pane-title { color:#f0ede6; }
[data-theme="dark"] .pane-sub { color:#b0ada6; }
[data-theme="dark"] .card-title { color:#b0ada6; }
[data-theme="dark"] .stat-lbl { color:#b0ada6; }
[data-theme="dark"] .stat-val { color:#f0ede6; }
[data-theme="dark"] .ex-name { color:#f0ede6; }
[data-theme="dark"] .ex-meta { color:#b0ada6; }
[data-theme="dark"] .cl-name { color:#f0ede6; }
[data-theme="dark"] .cl-meta { color:#b0ada6; }
[data-theme="dark"] .field-label { color:#b0ada6; }
[data-theme="dark"] .auth-tagline { color:#b0ada6; }
[data-theme="dark"] .auth-hint { color:#3a3a38; }
[data-theme="dark"] .loading-row { color:#b0ada6; }
[data-theme="dark"] .ficha-key { color:#b0ada6; }
[data-theme="dark"] .ficha-val { color:#f0ede6; }
[data-theme="dark"] .nw-name { color:#f0ede6; }
[data-theme="dark"] .nw-meta { color:#b0ada6; }
[data-theme="dark"] .modal-title { color:#f0ede6; }
[data-theme="dark"] .section-title { color:#b0ada6; }
[data-theme="dark"] .overlay-title { color:#f0ede6; }
[data-theme="dark"] .chat-peer { color:#f0ede6; }
[data-theme="dark"] .checkin-label { color:#f0ede6; }
[data-theme="dark"] .carga-name { color:#f0ede6; }
[data-theme="dark"] .carga-unit { color:#b0ada6; }
[data-theme="dark"] .goal-desc { color:#b0ada6; }
[data-theme="dark"] .goal-pct { color:#2bc48a; }
[data-theme="dark"] .inbox-time { color:#b0ada6; }
[data-theme="dark"] .topbar-logo text { fill:#f0ede6 !important; }

/* Backgrounds */
[data-theme="dark"] .app { background:var(--bg); }
[data-theme="dark"] .auth-wrap { background:var(--bg); }
[data-theme="dark"] .screen { background:var(--bg); }
[data-theme="dark"] .topbar { background:var(--surface);border-color:var(--light); }
[data-theme="dark"] .bottomnav { background:var(--surface);border-color:var(--light); }
[data-theme="dark"] .card { background:var(--surface);border-color:var(--light); }
[data-theme="dark"] .stat-card { background:#2a2a28; }
[data-theme="dark"] .modal { background:var(--surface); }
[data-theme="dark"] .modal-backdrop { background:rgba(0,0,0,0.75); }
[data-theme="dark"] .overlay { background:var(--surface); }
[data-theme="dark"] .bubble.in { background:#2a2a28;color:#f0ede6; }
[data-theme="dark"] .auth-logo { color:#f0ede6; }

/* Inputs */
[data-theme="dark"] .auth-input { background:#2a2a28;color:#f0ede6;border-color:#3a3a38; }
[data-theme="dark"] .auth-input::placeholder { color:#6a6a68; }
[data-theme="dark"] .chat-input { background:#2a2a28;color:#f0ede6;border-color:#3a3a38; }
[data-theme="dark"] .carga-input { background:#2a2a28;color:#f0ede6;border-color:#3a3a38; }
[data-theme="dark"] select.auth-input option { background:#242422;color:#f0ede6; }

/* Tabs */
[data-theme="dark"] .role-tabs { background:#2a2a28; }
[data-theme="dark"] .role-tab { color:#b0ada6; }
[data-theme="dark"] .role-tab.active { background:var(--surface);color:#f0ede6; }
[data-theme="dark"] .seg-tabs .seg { background:var(--surface);color:#b0ada6;border-color:var(--light); }
[data-theme="dark"] .seg.active { background:var(--accent);color:#fff;border-color:var(--accent); }

/* Nav */
[data-theme="dark"] .nav-btn { color:#3a3a38; }
[data-theme="dark"] .nav-btn.active { color:var(--accent); }
[data-theme="dark"] .nav-btn span { color:inherit; }

/* Botões */
[data-theme="dark"] .btn-sm { color:var(--accent);border-color:var(--accent); }
[data-theme="dark"] .btn-sm.filled { background:var(--accent);color:#fff; }
[data-theme="dark"] .btn-sm.danger { color:#e87a7a;border-color:#e87a7a; }
[data-theme="dark"] .btn-icon { color:#b0ada6; }

/* Outros */
[data-theme="dark"] .progress-track { background:#2a2a28; }
[data-theme="dark"] .ex-check { border-color:#3a3a38; }
[data-theme="dark"] .star { border-color:#3a3a38;color:#b0ada6; }
[data-theme="dark"] .star.active { background:var(--accent);border-color:var(--accent);color:#fff; }
[data-theme="dark"] .photo-slot { background:#2a2a28;border-color:#3a3a38; }
[data-theme="dark"] .client-row { border-color:#2a2a28; }
[data-theme="dark"] .ex-item { border-color:#2a2a28; }
[data-theme="dark"] .inbox-row { border-color:#2a2a28; }
[data-theme="dark"] .ficha-row { border-color:#2a2a28; }
[data-theme="dark"] .timer-wrap { background:var(--accent-d); }
[data-theme="dark"] .achievement { background:#2a2010; }
[data-theme="dark"] .objetivo-tag { background:var(--accent-l);color:var(--accent); }

/* ── Streak ── */
.streak-badge {
  display:inline-flex;align-items:center;gap:6px;
  background:linear-gradient(135deg,#f5c97a,#e8856a);
  color:#fff;border-radius:20px;padding:6px 14px;
  font-size:13px;font-weight:600;margin-bottom:12px;
}
