/* ═══════════════════════════════════
   NERO v4/v5 — DESIGN SYSTEM
   Organizado por componente, sem duplicatas.
═══════════════════════════════════ */

/* ── VARIÁVEIS ── */
:root {
  /* Accent: laranja-âmbar vibrante (energia, ação) */
  --a:#f97316;
  --a2:#fb923c;
  --a3:#10b981;
  --a4:#f59e0b;
  --a5:#6366f1;
  --ag:linear-gradient(135deg, #f97316, #f59e0b);
  --bg:#fafaf9;
  --bg2:#f5f5f4;
  --bg3:#e7e5e4;
  --sf:#ffffff;
  --sf2:#f9f8f7;
  --bd:rgba(0,0,0,.07);
  --bd2:rgba(0,0,0,.13);
  --tx:#1c1917;
  --tx2:#57534e;
  --tx3:#a8a29e;
  --sh:0 4px 24px rgba(249,115,22,.12);
  --sh2:0 2px 10px rgba(0,0,0,.06);
  --r:16px;
  --r2:12px;
  --r3:8px;
  --ease:.22s cubic-bezier(.4,0,.2,1);
  --fd:'Rajdhani',sans-serif; 
  --fb:'Inter',sans-serif;
  --nh:56px; 
  --bh:62px;
  --safe-top:env(safe-area-inset-top,0px);
  --safe-bot:env(safe-area-inset-bottom,0px);
  --safe-left:env(safe-area-inset-left,0px);
  --safe-right:env(safe-area-inset-right,0px);
}
[data-theme=dark] {
  --bg:#0c0a09;
  --bg2:#141210;
  --bg3:#1c1917;
  --sf:#171512;
  --sf2:#1f1c19;
  --bd:rgba(255,255,255,.06);
  --bd2:rgba(255,255,255,.12);
  --tx:#fafaf9;
  --tx2:#a8a29e;
  --tx3:#57534e;
  --sh:0 4px 24px rgba(0,0,0,.5);
  --sh2:0 2px 10px rgba(0,0,0,.4);
}
[data-theme=purple] {
  --a:#c084fc; 
  --a2:#f472b6;
   --a3:#34d399; 
   --a4:#fbbf24;
  --bg:#0d0b14; 
  --bg2:#130f1e;
   --bg3:#1c1628;
  --sf:#17122a;
  --sf2:#1f1836;
  --bd:rgba(192,132,252,.12); 
  --bd2:rgba(192,132,252,.22);
  --tx:#f5f0ff; --tx2:#a78bfa;
   --tx3:#6d5a99;
}

/* ── RESET / BASE ── */
* { box-sizing:border-box; margin:0; padding:0; -webkit-tap-highlight-color:transparent; }
html { height:100%; overflow:hidden; position:fixed; width:100%; }
body {
  font-family:var(--fb); background:var(--bg); color:var(--tx);
  transition:background var(--ease),color var(--ease);
  height:100%; overflow:hidden;
  padding-left:var(--safe-left); padding-right:var(--safe-right);
}
::-webkit-scrollbar { width:3px; height:3px; }
::-webkit-scrollbar-thumb { background:var(--a); border-radius:3px; }

/* ── LAYOUT ── */
#app {
  display:flex; flex-direction:column;
  height:100dvh;
  padding-top:calc(var(--nh) + var(--safe-top));
  padding-bottom:calc(var(--bh) + var(--safe-bot));
}
.main {
  flex:1; overflow-y:auto; overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  padding:14px 16px 8px;
  max-width:520px; width:100%; margin:0 auto;
  overscroll-behavior:contain;
}
.hid { display:none !important; }

/* ── HEADER ── */
.hdr {
  position:fixed; top:0; left:0; right:0; z-index:100;
  height:calc(var(--nh) + var(--safe-top));
  padding-top:var(--safe-top);
  background:rgba(12,10,9,.95); border-bottom:1px solid rgba(249,115,22,.12);
  display:flex; align-items:center; justify-content:space-between;
  padding-left:16px; padding-right:16px;
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
}
.hdr-logo {
  font-family:var(--fd); font-size:20px; font-weight:700; letter-spacing:4px;
  color:var(--a);
  text-shadow:0 0 20px rgba(249,115,22,.4);
}
.hdr-right { display:flex; gap:6px; align-items:center; }
.icon-btn {
  width:34px; height:34px; border-radius:50%; border:1px solid var(--bd2);
  background:var(--sf2); cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  color:var(--tx2); transition:all var(--ease); flex-shrink:0;
}
.icon-btn:active { transform:scale(.9); }

/* ── NAV ── */
.nav {
  position:fixed; 
  bottom:0; 
  left:0;
   right:0;
  height:calc(64px + var(--safe-bot));
  display:grid;
   grid-template-columns:1fr 1fr 1fr 1fr 1fr;
  align-items:center;
  padding:0 4px var(--safe-bot);
  background:rgba(12, 10, 9, 0.96);
  border-top:1px solid rgba(249,115,22,.15);
  backdrop-filter:blur(24px);
   -webkit-backdrop-filter:blur(24px);
  overflow:visible; z-index:90;
  -ms-overflow-style:none; scrollbar-width:none;
}
.nav::-webkit-scrollbar { 
  display:none; 
}

.nb {
  display:flex; 
  flex-direction:column;
   align-items:center; 
   justify-content:center;
  gap:3px; border:none;
   background:none; 
   cursor:pointer; 
   color:var(--tx3);
  font-size:9px; 
  font-family:var(--fb); 
  font-weight:600; 
  letter-spacing:.5px;
  padding:8px 4px;
   border-radius:10px; 
   transition:color var(--ease);
  position:relative;
   min-width:unset; 
   flex-shrink:0;
}
.nb svg { 
  width:20px; 
  height:20px; 
  transition:transform var(--ease); 
}

.nb.on { 
  color:var(--a); 
}
.nb.on::before {
  content:'';
  position:absolute;
   top:0;
   left:50%;
   transform:translateX(-50%);
  width:24px;
   height:2px;
   border-radius:0 0 4px 4px;
    background:var(--a);
    box-shadow:0 0 8px rgba(249,115,22,.6);
}

/* ── NAV BOTÃO + RADIAL ── */
.nav-plus-wrap {
  display:flex;
   align-items:center; 
   justify-content:center; 

}
.nav-plus {
  width:52px;
  height:52px;
  border-radius:50%;
  background:var(--ag);
  border:none;
  cursor:pointer;
   display:flex;
   align-items:center;
  justify-content:center;
  box-shadow:0 4px 20px rgba(249,115,22,.5);
  transition:transform .2s,box-shadow .2s;
  position:relative; z-index:91; flex-shrink:0;
}
.nav-plus:active { 
  transform:scale(.92);
 }

.nav-plus svg { 
  width:20px; 
  height:20px; 
  transition:transform .22s; 
}
.nav-plus.open svg { 
  transform:rotate(49deg);
}

.radial-item {
  position:absolute;
  width:58px;
  height:58px;
  border-radius:50%;
  background:var(--sf);
  border:1.5px solid var(--bd2);
  display:flex;
  flex-direction:column;
   align-items:center;
   justify-content:center;
   gap:3px;
  cursor:pointer;
  color:var(--tx2);
  font-size:10px;
  font-weight:700;
  letter-spacing:.3px;
  z-index:95; top:50%; left:50%;
  transform:translate(-50%,-50%) scale(0);
  opacity:0;
  pointer-events:none;
  box-shadow:0 4px 16px rgba(0,0,0,.3);
  transition:transform .25s cubic-bezier(.34,1.56,.64,1),opacity .2s;
  -webkit-tap-highlight-color:transparent;
}
.radial-item.visible { 
  opacity:1; 
  pointer-events:all;
   transform:translate(-50%,-50%) scale(1); 
  }

.radial-item:hover, .radial-item:active { 
  background:var(--a); 
  color:#fff; 
  border-color:var(--a); 
}
.radial-item svg {
  flex-shrink:0;
  width:20px;
  height:20px;
  color:var(--a);
}
.radial-item span {
  font-family:var(--fb);
  font-size:10px;
  font-weight:700;
  letter-spacing:.2px;
   line-height:1;
   margin-top:1px;
   color:var(--tx2);
  }
#radial-overlay {
   z-index:89; 
  }

/* ── PAGES ── */
.pg { display:none; animation:fadeUp .25s ease; }
.pg.on { display:block; }
@keyframes fadeUp { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }

/* ── CHAT PAGE ── */
#pg-chat { display:none; flex-direction:column; height:100%; }
#pg-chat.on { display:flex; flex-direction:column; flex:1; min-height:0; overflow:hidden; }
.main.chat-active { display:flex; flex-direction:column; padding:0; overflow:hidden; }

/* ── CARDS ── */
.card { background:var(--sf); border:1px solid var(--bd); border-radius:var(--r); padding:16px; margin-bottom:12px; box-shadow:var(--sh2); transition:background var(--ease); }

/* ── SECTION LABEL ── */
.sl { font-family:var(--fd); font-size:11px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:var(--tx3); margin:18px 0 8px; }

/* ── BUTTONS ── */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding:10px 18px; border-radius:var(--r2); border:none; cursor:pointer;
  font-family:var(--fb); font-size:13px; font-weight:500;
  transition:all var(--ease); white-space:nowrap;
  -webkit-touch-callout:none; user-select:none;
}
.btn-p { background:var(--a); color:#fff; }
.btn-p:active { filter:brightness(.85); }
.btn-g { background:rgba(67,233,123,.12); color:var(--a3); }
.btn-r { background:rgba(255,101,132,.12); color:var(--a2); }
.btn-o { background:rgba(247,151,30,.12); color:var(--a4); }
.btn-gh { background:var(--bg3); color:var(--tx2); border:1px solid var(--bd); }
.btn-full { width:100%; }
.btn svg { width:14px; height:14px; }

/* ── INPUTS ── */
.ig { margin-bottom:12px; }
.il { font-size:11px; font-weight:500; color:var(--tx3); margin-bottom:5px; letter-spacing:.4px; display:block; }
.inp {
  width:100%; padding:10px 13px; background:var(--bg2); border:1px solid var(--bd2);
  border-radius:var(--r3); color:var(--tx); font-family:var(--fb); font-size:13px;
  transition:border var(--ease); outline:none;
  -webkit-appearance:none; appearance:none;
}
.inp:focus { border-color:var(--a); box-shadow:0 0 0 3px rgba(249,115,22,.15); }
.inp::placeholder { color:var(--tx3); }
select.inp { cursor:pointer; }
textarea.inp { resize:vertical; min-height:70px; }

/* ── BADGE ── */
.badge { display:inline-flex; align-items:center; gap:3px; padding:2px 8px; border-radius:20px; font-size:10px; font-weight:600; letter-spacing:.3px; }
.ba { background:rgba(108,99,255,.15); color:var(--a); }
.bg2 { background:rgba(67,233,123,.15); color:var(--a3); }
.br { background:rgba(255,101,132,.15); color:var(--a2); }
.bo { background:rgba(247,151,30,.15); color:var(--a4); }

/* ── PROGRESS ── */
.pw { background:var(--bg3); border-radius:8px; height:7px; overflow:hidden; }
.pb { height:100%; border-radius:8px; transition:width .6s cubic-bezier(.4,0,.2,1); }

/* ── TOGGLE ── */
.tgl { position:relative; width:42px; height:23px; cursor:pointer; }
.tgl input { opacity:0; width:0; height:0; position:absolute; }
.tgl-s { position:absolute; inset:0; background:var(--bg3); border-radius:23px; transition:background var(--ease); border:1px solid var(--bd2); }
.tgl-s::before { content:''; position:absolute; width:17px; height:17px; background:#fff; border-radius:50%; left:2px; top:2px; transition:transform var(--ease); box-shadow:0 1px 4px rgba(0,0,0,.2); }
.tgl input:checked+.tgl-s { background:var(--a); border-color:var(--a); }
.tgl input:checked+.tgl-s::before { transform:translateX(19px); }

/* ── MODAL ── */
.mo { position:fixed; inset:0; z-index:200; background:rgba(0,0,0,.6); display:flex; align-items:flex-end; justify-content:center; backdrop-filter:blur(4px); animation:moIn .2s ease; }
.mo.hid { display:none; }
@keyframes moIn { from{opacity:0} to{opacity:1} }
.mo-box {
  background:var(--sf); border-radius:24px 24px 0 0;
  padding:22px 18px; padding-bottom:calc(22px + var(--safe-bot));
  width:100%; max-width:520px; max-height:92dvh; overflow-y:auto;
  animation:moUp .28s cubic-bezier(.4,0,.2,1);
}
@keyframes moUp { from{transform:translateY(100%)} to{transform:translateY(0)} }
.mo-title { font-family:var(--fd); font-size:17px; font-weight:700; letter-spacing:1px; margin-bottom:18px; display:flex; justify-content:space-between; align-items:center; }
.mo-close { width:30px; height:30px; border-radius:50%; border:none; background:var(--bg3); color:var(--tx2); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:14px; }

/* ── TOAST ── */
.toast {
  position:fixed; top:calc(var(--nh) + var(--safe-top) + 8px);
  left:50%; transform:translateX(-50%);
  background:var(--a); color:#fff; padding:9px 18px; border-radius:30px;
  font-size:12px; font-weight:500; z-index:400; animation:toIn .28s ease;
  white-space:nowrap; box-shadow:0 4px 20px rgba(108,99,255,.4);
  max-width:90vw; overflow:hidden; text-overflow:ellipsis;
}
.toast.hid { display:none; }
@keyframes toIn { from{opacity:0;transform:translateX(-50%) translateY(-8px)} to{opacity:1;transform:translateX(-50%) translateY(0)} }

/* ── LEVELUP ── */
#levelup-overlay { position:fixed; inset:0; z-index:500; display:flex; flex-direction:column; align-items:center; justify-content:center; background:rgba(0,0,0,.85); backdrop-filter:blur(8px); }
#levelup-overlay.hid { display:none; }
.lu-ring { width:160px; height:160px; border-radius:50%; border:3px solid var(--a); display:flex; align-items:center; justify-content:center; flex-direction:column; animation:luPulse 1.2s ease infinite; box-shadow:0 0 40px rgba(108,99,255,.5); }
@keyframes luPulse { 0%,100%{box-shadow:0 0 30px rgba(108,99,255,.4)} 50%{box-shadow:0 0 70px rgba(108,99,255,.8)} }
.lu-lvl { font-family:var(--fd); font-size:64px; font-weight:700; color:var(--a); line-height:1; }
.lu-label { font-family:var(--fd); font-size:14px; letter-spacing:3px; color:var(--tx3); }
.lu-title { font-family:var(--fd); font-size:28px; font-weight:700; letter-spacing:3px; margin:20px 0 8px; background:linear-gradient(135deg,var(--a),var(--a2)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
#lu-particles { position:absolute; inset:0; pointer-events:none; }

/* ── SPLASH ── */
#splash { position:fixed; inset:0; z-index:600; background:var(--bg); display:flex; flex-direction:column; align-items:center; justify-content:center; }
#splash.hid { display:none; }
.splash-logo { font-family:var(--fd); font-size:56px; font-weight:700; letter-spacing:10px; background:linear-gradient(135deg,var(--a),var(--a2)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; animation:splashIn .8s ease; }
@keyframes splashIn { from{opacity:0;transform:scale(.8)} to{opacity:1;transform:scale(1)} }
.splash-bar { width:160px; height:3px; background:var(--bg3); border-radius:3px; margin-top:24px; overflow:hidden; }
.splash-fill { height:100%; background:linear-gradient(90deg,var(--a),var(--a2)); border-radius:3px; animation:splashLoad 1.8s ease forwards; }
@keyframes splashLoad { from{width:0} to{width:100%} }

/* ── ONBOARDING ── */
#onboarding { position:fixed; inset:0; z-index:550; background:var(--bg); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:32px 24px; text-align:center; }
#onboarding.hid { display:none; }

/* ── PLAYER CARD ── */
.p-avatar { width:60px; height:60px; border-radius:16px; background:linear-gradient(135deg,var(--a),var(--a2)); display:flex; align-items:center; justify-content:center; font-family:var(--fd); font-size:24px; font-weight:700; color:#fff; flex-shrink:0; }
.p-name { font-family:var(--fd); font-size:18px; font-weight:700; letter-spacing:1px; }
.p-sub { font-size:11px; color:var(--tx3); margin-bottom:8px; }
.xpt { display:flex; justify-content:space-between; font-size:10px; color:var(--tx3); margin-bottom:3px; }
.stats4 { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.stat { background:var(--bg2); border-radius:var(--r3); padding:8px 4px; text-align:center; border:1px solid var(--bd); }
.sv { font-family:var(--fd); font-size:16px; font-weight:700; color:var(--a); }
.sk { font-size:9px; font-weight:600; color:var(--tx3); letter-spacing:1px; }

/* ── TAREFAS ── */
.ti { display:flex; align-items:flex-start; gap:10px; padding:12px; background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); margin-bottom:7px; transition:all var(--ease); }
.ti.done { opacity:.45; }
.ti.done .tt { text-decoration:line-through; }
.tck { width:20px; height:20px; border-radius:5px; border:2px solid var(--bd2); background:var(--bg2); display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; margin-top:1px; transition:all var(--ease); }
.tck.on { background:var(--a); border-color:var(--a); }
.tt { font-size:13px; font-weight:500; line-height:1.4; }
.tm { display:flex; gap:5px; flex-wrap:wrap; margin-top:4px; align-items:center; }
.ttime { font-size:10px; color:var(--a); font-weight:500; display:flex; align-items:center; gap:2px; }
.sub-list { margin-top:8px; padding-left:4px; }
.sub-item { display:flex; align-items:center; gap:7px; padding:5px 0; border-bottom:1px solid var(--bd); }
.sub-item:last-child { border:none; }
.task-tags { display:flex; flex-wrap:wrap; gap:3px; margin-top:3px; }

/* ── FINANÇAS ── */
.fb { text-align:center; padding:20px 14px; background:linear-gradient(135deg,rgba(108,99,255,.1),rgba(255,101,132,.08)); border-radius:var(--r); border:1px solid var(--bd); margin-bottom:12px; }
.fbl { font-size:11px; color:var(--tx3); letter-spacing:1px; text-transform:uppercase; margin-bottom:5px; }
.fbv { font-family:var(--fd); font-size:32px; font-weight:700; letter-spacing:1px; }
.fpos { color:var(--a3); }
.fneg { color:var(--a2); }
.fsum { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:12px; }
.fscard { background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); padding:12px; text-align:center; }
.fsl { font-size:10px; color:var(--tx3); margin-bottom:3px; }
.fsv { font-family:var(--fd); font-size:15px; font-weight:700; }
.tinc { color:var(--a3); }
.texp { color:var(--a2); }
.txi { display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); margin-bottom:7px; }
.txico { width:34px; height:34px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:15px; flex-shrink:0; }
.txd { font-size:12px; font-weight:500; }
.txc { font-size:10px; color:var(--tx3); margin-top:1px; }
.txv { font-family:var(--fd); font-size:13px; font-weight:700; }
.gi { background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); padding:12px; margin-bottom:7px; border-left:3px solid var(--a); }
.gh { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; }
.gn { font-size:12px; font-weight:600; }
.gp { font-family:var(--fd); font-size:12px; color:var(--a); font-weight:700; }
.gsub { display:flex; justify-content:space-between; font-size:10px; color:var(--tx3); margin-top:5px; }
#finance-canvas { width:100%; display:block; }
.fin-value { transition:filter .3s; }
#pie-canvas { border-radius:50%; }
#budget-alerts .alert-banner { margin-bottom:6px; }

/* ── TREINO ── */
.wg { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.wc { background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); padding:12px; cursor:pointer; transition:all var(--ease); }
.wc:active { transform:scale(.97); }
.wci { font-size:26px; margin-bottom:6px; }
.wcn { font-size:12px; font-weight:600; }
.wcc { font-size:10px; color:var(--tx3); margin-top:2px; }
.exi { display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); margin-bottom:7px; }
.exck { width:19px; height:19px; border-radius:4px; border:2px solid var(--bd2); background:var(--bg2); cursor:pointer; flex-shrink:0; transition:all var(--ease); }
.exck.on { background:var(--a3); border-color:var(--a3); }
.exn { font-size:12px; font-weight:500; }
.rest-timer { text-align:center; padding:16px; background:rgba(108,99,255,.08); border-radius:var(--r2); margin-bottom:10px; border:1px solid rgba(108,99,255,.2); }
.rt-time { font-family:var(--fd); font-size:44px; font-weight:700; color:var(--a); }
.rt-label { font-size:11px; color:var(--tx3); letter-spacing:1px; text-transform:uppercase; }
#series-time { min-width:60px; text-align:center; }
#wo-week-canvas { width:100%; display:block; }

/* ── HÁBITOS ── */
.hr { display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); margin-bottom:7px; }
.hico { width:36px; height:36px; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:17px; flex-shrink:0; }
.hn { font-size:12px; font-weight:500; }
.hs { font-size:10px; color:var(--a4); }
.hdays { display:flex; gap:3px; margin-top:5px; }
.hd { width:20px; height:20px; border-radius:3px; background:var(--bg3); border:1px solid var(--bd); font-size:8px; display:flex; align-items:center; justify-content:center; color:var(--tx3); font-weight:600; cursor:pointer; transition:all var(--ease); }
.hd.on { background:var(--a); border-color:var(--a); color:#fff; }

/* ── CHAT ── */
.chat-msgs { flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:12px 16px 8px; display:flex; flex-direction:column; gap:10px; min-height:0; overscroll-behavior:contain; }
.bub { max-width:84%; padding:10px 14px; border-radius:18px; font-size:13px; line-height:1.5; animation:bubIn .2s ease; word-break:break-word; }
@keyframes bubIn { from{opacity:0;transform:scale(.95)} to{opacity:1;transform:scale(1)} }
.b-n { background:linear-gradient(135deg,#f97316,#f59e0b); color:#fff; border-bottom-left-radius:4px; align-self:flex-start; }
.b-u, .b-audio { background:var(--sf2); color:var(--tx); border:1px solid var(--bd2); border-bottom-right-radius:4px; align-self:flex-end; }
.bt { font-size:9px; opacity:.5; margin-top:4px; }

/* ── CHAT — BARRA ── */
.chat-bar {
  flex-shrink:0; padding:8px 12px;
  padding-bottom:max(8px, env(safe-area-inset-bottom, 8px));
  border-top:1px solid var(--bd); background:var(--sf);
}
.chat-box { display:flex; gap:6px; align-items:center; background:var(--bg2); border:1px solid var(--bd2); border-radius:28px; padding:4px 4px 4px 14px; }
.chat-box input { flex:1; background:transparent; border:none; outline:none; font-family:var(--fb); font-size:13px; color:var(--tx); min-width:0; }
.chat-box input::placeholder { color:var(--tx3); }
.csend { width:34px; height:34px; border-radius:50%; border:none; background:var(--a); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all var(--ease); }
.csend:active { transform:scale(.9); }
.cmic, .caudio { width:34px; height:34px; border-radius:50%; border:1px solid var(--bd2); background:var(--sf2); cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all var(--ease); color:var(--tx2); }
.cmic:active, .caudio:active { transform:scale(.9); }
.cmic.listening { background:var(--a2); border-color:var(--a2); color:#fff; animation:micPulse .8s ease infinite; }
.caudio.recording { background:var(--a2); border-color:var(--a2); color:#fff; animation:micPulse .6s ease infinite; }
@keyframes micPulse { 0%,100%{box-shadow:0 0 0 0 rgba(255,101,132,.4)} 50%{box-shadow:0 0 0 8px rgba(255,101,132,0)} }

/* ── CHAT — TYPING / ÁUDIO ── */
.typing-dot { width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,.7); animation:tdot 1.2s infinite; }
.typing-dot:nth-child(2) { animation-delay:.2s; }
.typing-dot:nth-child(3) { animation-delay:.4s; }
@keyframes tdot { 0%,60%,100%{transform:scale(1);opacity:.5} 30%{transform:scale(1.4);opacity:1} }

.audio-bub { display:flex; align-items:center; gap:8px; padding:10px 14px; background:var(--sf2); border:1px solid var(--bd2); border-radius:18px; border-bottom-right-radius:4px; align-self:flex-end; max-width:80%; min-width:180px; }
.audio-play { width:32px; height:32px; border-radius:50%; background:var(--a); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; color:#fff; transition:all var(--ease); }
.audio-play:active { transform:scale(.9); }
.audio-wave { flex:1; height:28px; display:flex; align-items:center; gap:2px; }
.audio-bar { flex:1; border-radius:3px; background:var(--a); opacity:.3; min-height:4px; max-height:24px; transition:height .1s ease; }
.audio-bub.playing .audio-bar { animation:waveAnim 1s ease infinite; }
.audio-bub.playing .audio-bar:nth-child(2) { animation-delay:.1s; }
.audio-bub.playing .audio-bar:nth-child(3) { animation-delay:.2s; }
.audio-bub.playing .audio-bar:nth-child(4) { animation-delay:.3s; }
.audio-bub.playing .audio-bar:nth-child(5) { animation-delay:.4s; }
.audio-bub.playing .audio-bar:nth-child(6) { animation-delay:.15s; }
.audio-bub.playing .audio-bar:nth-child(7) { animation-delay:.25s; }
@keyframes waveAnim { 0%,100%{opacity:.3;transform:scaleY(.4)} 50%{opacity:1;transform:scaleY(1)} }
.audio-dur { font-size:10px; color:var(--tx3); flex-shrink:0; min-width:28px; text-align:right; }

/* ── RPG — CONQUISTAS ── */
.ach-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.ach { background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); padding:12px; text-align:center; position:relative; overflow:hidden; }
.ach.locked { opacity:.4; filter:grayscale(1); }
.ach-ico { font-size:26px; margin-bottom:5px; }
.ach-name { font-size:10px; font-weight:600; color:var(--tx2); }
.ach-new { position:absolute; top:4px; right:4px; background:var(--a2); color:#fff; font-size:8px; font-weight:700; padding:1px 5px; border-radius:8px; }

/* ── RPG — MISSÕES DIÁRIAS ── */
.dm { background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); padding:12px; margin-bottom:7px; border-left:3px solid var(--a4); }
.dm-title { font-size:12px; font-weight:600; margin-bottom:3px; display:flex; align-items:center; gap:6px; }
.dm-xp { font-size:10px; color:var(--a4); font-weight:600; }

/* ── RPG — INVENTÁRIO ── */
.inv-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.inv-item { background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); padding:10px 6px; text-align:center; }
.inv-item.locked { opacity:.3; filter:grayscale(1); }
.inv-ico { font-size:22px; margin-bottom:4px; }
.inv-name { font-size:9px; color:var(--tx3); font-weight:500; }
.inv-req { font-size:8px; color:var(--a); font-weight:600; }

/* ── APP LAUNCHER ── */
.app-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-bottom:10px; }
.app-btn { background:var(--sf2); border:1px solid var(--bd); border-radius:var(--r2); padding:10px 4px; text-align:center; cursor:pointer; transition:all var(--ease); text-decoration:none; display:block; }
.app-btn:active { transform:scale(.93); }
.app-ico { font-size:22px; margin-bottom:3px; }
.app-name { font-size:9px; color:var(--tx2); font-weight:500; }

/* ── PILLS ── */
.cpills { display:flex; gap:7px; overflow-x:auto; margin-bottom:12px; }
.cpills::-webkit-scrollbar { display:none; }
.cp { padding:4px 12px; border-radius:16px; font-size:11px; border:1px solid var(--bd2); background:var(--sf2); color:var(--tx3); cursor:pointer; white-space:nowrap; transition:all var(--ease); flex-shrink:0; }
.cp.on { background:var(--a); border-color:var(--a); color:#fff; }

/* ── EMPTY STATE ── */
.empty { text-align:center; padding:36px 20px; color:var(--tx3); }
.empty-ico { font-size:38px; margin-bottom:10px; }
.empty-txt { font-size:13px; line-height:1.5; }

/* ── POMODORO ── */
.pomo-wrap { text-align:center; padding:20px 16px; }
.pomo-ring { width:150px; height:150px; margin:0 auto 16px; position:relative; }
.pomo-ring svg { transform:rotate(-90deg); }
.pomo-ring-bg { fill:none; stroke:var(--bg3); stroke-width:8; }
.pomo-ring-fill { fill:none; stroke:var(--a); stroke-width:8; stroke-linecap:round; transition:stroke-dashoffset .5s ease; }
.pomo-time { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.pomo-t { font-family:var(--fd); font-size:34px; font-weight:700; color:var(--a); }
.pomo-l { font-size:10px; color:var(--tx3); letter-spacing:1.5px; text-transform:uppercase; }

/* ── VOICE OVERLAY ── */
#voice-overlay { position:fixed; inset:0; z-index:300; background:rgba(0,0,0,.8); backdrop-filter:blur(10px); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; }
#voice-overlay.hid { display:none; }
.vo-ring { width:120px; height:120px; border-radius:50%; background:linear-gradient(135deg,var(--a),var(--a2)); display:flex; align-items:center; justify-content:center; animation:voPulse 1s ease infinite; }
@keyframes voPulse { 0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(108,99,255,.4)} 50%{transform:scale(1.06);box-shadow:0 0 0 20px rgba(108,99,255,0)} }
.vo-text { font-size:15px; color:#fff; font-weight:500; text-align:center; max-width:260px; line-height:1.5; }
.vo-result { font-family:var(--fd); font-size:18px; color:var(--a); font-weight:600; text-align:center; letter-spacing:1px; }

/* ── ALERT BANNER ── */
.alert-banner { background:rgba(255,101,132,.12); border:1px solid rgba(255,101,132,.25); border-radius:var(--r2); padding:10px 14px; margin-bottom:10px; display:flex; gap:10px; align-items:flex-start; }
.alert-banner.warn { background:rgba(247,151,30,.1); border-color:rgba(247,151,30,.25); }
.ab-ico { font-size:18px; flex-shrink:0; }
.ab-text { font-size:12px; line-height:1.5; color:var(--tx2); }

/* ── NOTIFICAÇÕES ── */
.notif-ok { display:inline-flex; align-items:center; gap:5px; font-size:11px; color:var(--a3); font-weight:500; }
.notif-ok::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--a3); display:inline-block; }
.notif-denied { color:var(--a2); }
.notif-denied::before { background:var(--a2); }
.notif-unread { border-left:2px solid var(--a) !important; background:color-mix(in srgb,var(--a) 5%,var(--bg2)) !important; }
#notif-badge { font-family:var(--fd); font-weight:700; }

/* ── KANBAN ── */
.kanban-board { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; overflow-x:auto; }
.kanban-col { background:var(--bg2); border:0.5px solid var(--bd); border-radius:var(--r); padding:10px; min-height:200px; }
.kanban-col-title { font-family:var(--fd); font-size:11px; font-weight:700; letter-spacing:1px; text-transform:uppercase; margin-bottom:8px; }
.kanban-cards { display:flex; flex-direction:column; gap:6px; min-height:40px; }
.kanban-card { background:var(--bg); border:0.5px solid var(--bd); border-radius:calc(var(--r) - 4px); padding:10px; cursor:grab; position:relative; transition:box-shadow .2s,transform .1s; font-size:13px; }
.kanban-card:active { cursor:grabbing; transform:scale(0.97); }
.kanban-card:hover { box-shadow:0 4px 16px rgba(108,99,255,0.15); }

/* ── BUSCA GLOBAL ── */
#mo-search .mo-box { max-height:70vh; display:flex; flex-direction:column; }
#search-results { overflow-y:auto; flex:1; }

/* ── MODO FOCO ── */
#focus-bar { backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }

/* ── PIN LOCK ── */
#pin-input { letter-spacing:8px; font-size:24px; text-align:center; }
#pin-error { min-height:16px; transition:color .2s; }