/* ============================================================
   ZÊNITE — Sistema
   ciano   = sistema, treino, força
   violeta = combustível, alimentação
   ouro    = rank, recorde, evolução
   ============================================================ */
:root{
  --void:#05080F;
  --deep:#080D18;
  --panel:#0B1424;
  --panel-2:#101B2E;
  --edge:#1C2C45;

  --sys:#4CC9FF;
  --sys-hi:#A8ECFF;
  --sys-dim:#2A6E93;
  --sys-glow:rgba(76,201,255,.28);

  --mana:#9B7BFF;
  --mana-hi:#C6B4FF;

  --gold:#FFCB5C;
  --gold-hi:#FFE6A8;

  --text:#DCE7F5;
  --dim:#7C8FA8;
  --faint:#4B5C73;

  --display:"Chakra Petch","Arial Narrow",system-ui,sans-serif;
  --body:"Inter",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html,body{height:100%;}
body{
  background:var(--void);color:var(--text);
  font-family:var(--body);font-size:15px;line-height:1.45;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(ellipse 80% 45% at 50% -8%, rgba(76,201,255,.13), transparent 70%),
    radial-gradient(ellipse 60% 40% at 50% 104%, rgba(155,123,255,.08), transparent 70%);
  background-attachment:fixed;
}
#app{max-width:540px;margin:0 auto;min-height:100%;padding-bottom:94px;}
button{font:inherit;color:inherit;cursor:pointer;background:none;border:none;}
:focus-visible{outline:2px solid var(--sys);outline-offset:2px;}

/* ---------- painel do sistema (cantos em colchete) ---------- */
.panel{position:relative;background:linear-gradient(160deg,rgba(16,27,46,.95),rgba(8,13,24,.95));
  border:1px solid var(--edge);}
.panel::before,.panel::after{content:"";position:absolute;width:13px;height:13px;pointer-events:none;}
.panel::before{top:-1px;left:-1px;border-top:2px solid var(--sys);border-left:2px solid var(--sys);}
.panel::after{bottom:-1px;right:-1px;border-bottom:2px solid var(--sys);border-right:2px solid var(--sys);}
.panel.mana::before,.panel.mana::after{border-color:var(--mana);}
.panel.gold::before,.panel.gold::after{border-color:var(--gold);}

/* ---------- topo ---------- */
header{padding:20px 18px 10px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.brand{display:flex;align-items:center;gap:9px;}
.brand .mark{width:25px;height:25px;flex:none;}
.brand h1{font-family:var(--display);font-weight:700;font-size:25px;letter-spacing:5px;
  line-height:1;color:var(--sys-hi);text-shadow:0 0 16px var(--sys-glow);}
.stamp{font-family:var(--display);font-size:11px;letter-spacing:1.6px;color:var(--faint);
  text-align:right;line-height:1.3;text-transform:uppercase;}
.stamp b{display:block;color:var(--dim);font-size:16px;font-weight:600;letter-spacing:1px;}

/* ---------- status ---------- */
.status{margin:6px 18px 4px;padding:16px 15px 15px;overflow:hidden;}
.status .bg{position:absolute;inset:0;opacity:.5;pointer-events:none;
  background:repeating-linear-gradient(180deg,transparent 0 3px,rgba(76,201,255,.035) 3px 4px);}
.st-top{display:flex;align-items:center;gap:13px;position:relative;}
.rank{width:66px;height:66px;flex:none;position:relative;display:flex;align-items:center;justify-content:center;}
.rank svg{position:absolute;inset:0;width:100%;height:100%;}
.rank b{font-family:var(--display);font-weight:700;font-size:34px;line-height:1;
  color:var(--gold);text-shadow:0 0 18px rgba(255,203,92,.55);}
.rank.r-E b,.rank.r-D b{color:var(--sys-hi);text-shadow:0 0 14px var(--sys-glow);}
.st-id{flex:1;min-width:0;}
.st-id .lv{font-family:var(--display);font-size:13px;letter-spacing:2.4px;color:var(--sys);text-transform:uppercase;}
.st-id .lvn{font-family:var(--display);font-weight:700;font-size:33px;line-height:1;letter-spacing:1px;color:#fff;}
.st-id .cls{font-size:12px;color:var(--dim);margin-top:2px;}
.xp{margin-top:13px;position:relative;}
.xpbar{height:7px;background:rgba(0,0,0,.45);border:1px solid var(--edge);overflow:hidden;}
.xpbar i{display:block;height:100%;background:linear-gradient(90deg,var(--sys-dim),var(--sys) 70%,var(--sys-hi));
  box-shadow:0 0 12px var(--sys-glow);transition:width .6s cubic-bezier(.2,.8,.2,1);}
.xp .lbl{display:flex;justify-content:space-between;margin-top:6px;font-size:11px;color:var(--faint);
  font-family:var(--display);letter-spacing:.8px;}

/* stats */
.stats{margin-top:15px;display:flex;flex-direction:column;gap:9px;position:relative;}
.stat{display:flex;align-items:center;gap:10px;}
.stat .k{width:92px;flex:none;font-family:var(--display);font-size:11.5px;letter-spacing:.9px;
  color:var(--dim);text-transform:uppercase;}
.stat .track{flex:1;height:6px;background:rgba(0,0,0,.45);border:1px solid var(--edge);overflow:hidden;}
.stat .track i{display:block;height:100%;transition:width .7s cubic-bezier(.2,.8,.2,1);
  background:linear-gradient(90deg,var(--sys-dim),var(--sys));}
.stat.m .track i{background:linear-gradient(90deg,#6A4FBF,var(--mana));}
.stat .v{width:34px;flex:none;text-align:right;font-family:var(--display);font-weight:600;
  font-size:15px;color:var(--text);letter-spacing:.5px;}

/* ---------- mapa do corpo ---------- */
.bodycard{margin:14px 18px;padding:14px 12px 10px;}
.bodycard h3{font-family:var(--display);font-size:14px;letter-spacing:2px;color:var(--sys);
  text-transform:uppercase;margin-bottom:2px;}
.bodycard .sub{font-size:12px;color:var(--dim);margin-bottom:10px;}
.figs{display:flex;justify-content:center;gap:6px;}
.bodycard.slim{padding:11px 10px 8px;}
.bodycard.slim .figs svg{max-width:96px;}
.bodycard.slim .mlist{display:none;}
.bodycard.slim .sub{margin-bottom:6px;}
.figs svg{width:50%;max-width:132px;height:auto;}
.fig .base{fill:#101B2E;stroke:#22334D;stroke-width:1;}
.fig .m{fill:#16233A;stroke:#25384F;stroke-width:.8;transition:fill .5s;}
.fig .m.sec{fill:#1E4E6B;}
.fig .m.pri{fill:#4CC9FF;stroke:#DFF6FF;stroke-width:.9;filter:url(#glow);}
.fig .m.sec{stroke:#2F6E8E;}
.fig .lbl{fill:#4B5C73;font-family:"Chakra Petch",sans-serif;font-size:7.5px;letter-spacing:1px;}
.legend{display:flex;justify-content:center;gap:16px;margin-top:8px;font-size:11px;color:var(--faint);}
.legend span{display:flex;align-items:center;gap:5px;}
.legend i{width:9px;height:9px;display:block;}
.legend .p{background:var(--sys);box-shadow:0 0 8px var(--sys-glow);}
.legend .s{background:#1E4E6B;}
.mlist{margin-top:9px;display:flex;flex-wrap:wrap;gap:5px;justify-content:center;}
.mtag{font-family:var(--display);font-size:11px;letter-spacing:1px;text-transform:uppercase;
  padding:3px 8px;border:1px solid rgba(76,201,255,.3);color:var(--sys-hi);background:rgba(76,201,255,.07);}

/* ---------- títulos de seção ---------- */
.sec{display:flex;align-items:center;gap:9px;padding:16px 18px 10px;
  font-family:var(--display);font-size:13px;letter-spacing:2.4px;color:var(--dim);text-transform:uppercase;}
.sec::before{content:"";width:7px;height:7px;background:var(--sys);
  transform:rotate(45deg);flex:none;box-shadow:0 0 9px var(--sys-glow);}
.sec::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,var(--edge),transparent);}

/* ---------- dias / missões ---------- */
.days{padding:0 18px;display:flex;flex-direction:column;gap:9px;}
.day{display:flex;align-items:stretch;width:100%;text-align:left;padding:0;
  transition:transform .09s,border-color .18s;}
.day:active{transform:scale(.99);}
.day .edge{width:4px;flex:none;background:var(--edge);}
.day.done .edge{background:linear-gradient(var(--gold),var(--gold-hi));box-shadow:0 0 14px rgba(255,203,92,.45);}
.day.today .edge{background:linear-gradient(var(--sys),var(--sys-dim));box-shadow:0 0 14px var(--sys-glow);}
.day .b{flex:1;padding:13px 10px 13px 14px;min-width:0;}
.day .dow{font-family:var(--display);font-size:11px;letter-spacing:2.2px;color:var(--faint);text-transform:uppercase;}
.day.today .dow{color:var(--sys);}
.day .focus{font-family:var(--display);font-weight:600;font-size:19px;letter-spacing:.6px;margin-top:1px;color:#fff;}
.day .meta{font-size:12px;color:var(--dim);margin-top:3px;}
.day .r{display:flex;align-items:center;padding-right:13px;color:var(--faint);}
.day.rest{opacity:.55;}
.clear{display:inline-flex;align-items:center;gap:5px;color:var(--gold);font-weight:600;}
.clear svg{width:13px;height:13px;}

/* ---------- detalhe do dia ---------- */
.dhead{padding:14px 18px 6px;display:flex;align-items:center;gap:12px;}
.back{width:40px;height:40px;flex:none;display:flex;align-items:center;justify-content:center;
  background:var(--panel);border:1px solid var(--edge);}
.back:active{transform:scale(.95);}
.dhead .dow{font-family:var(--display);font-size:11px;letter-spacing:2.2px;color:var(--sys);text-transform:uppercase;}
.dhead h2{font-family:var(--display);font-weight:600;font-size:23px;letter-spacing:.6px;line-height:1.1;color:#fff;}
.exlist{padding:6px 18px 18px;display:flex;flex-direction:column;gap:11px;}
.ex{padding:14px 14px 12px;}
.ex .top{display:flex;justify-content:space-between;align-items:flex-start;gap:9px;}
.ex .name{font-family:var(--display);font-weight:600;font-size:17px;letter-spacing:.4px;line-height:1.2;color:#fff;}
.ex .tag{font-family:var(--display);font-size:12px;letter-spacing:1px;color:var(--sys-hi);
  border:1px solid rgba(76,201,255,.3);background:rgba(76,201,255,.08);padding:2px 8px;flex:none;}
.ex .goal{font-size:12.5px;color:var(--dim);margin-top:7px;display:flex;align-items:center;gap:6px;}
.ex .goal svg{width:13px;height:13px;color:var(--sys-dim);flex:none;}
.ex .goal b{color:var(--gold);font-family:var(--display);font-size:14px;letter-spacing:.5px;}
.ex .mini{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px;}
.ex .mini span{font-size:10.5px;letter-spacing:.8px;text-transform:uppercase;color:var(--sys-dim);
  border:1px solid var(--edge);padding:2px 6px;font-family:var(--display);}
.sets{margin-top:11px;display:flex;flex-direction:column;gap:7px;}
.setrow{display:flex;align-items:center;gap:7px;}
.setrow .i{width:23px;height:23px;flex:none;background:rgba(76,201,255,.08);border:1px solid var(--edge);
  color:var(--sys);font-family:var(--display);font-size:12px;font-weight:600;
  display:flex;align-items:center;justify-content:center;}
.field{flex:1;display:flex;align-items:center;background:rgba(0,0,0,.4);border:1px solid var(--edge);
  padding:0 10px;height:44px;transition:border-color .15s,box-shadow .15s;min-width:0;}
.field:focus-within{border-color:var(--sys);box-shadow:0 0 0 1px var(--sys-glow),0 0 14px var(--sys-glow);}
.field input{width:100%;min-width:0;background:none;border:none;color:#fff;outline:none;
  font-family:var(--display);font-weight:600;font-size:18px;letter-spacing:.5px;}
.field input::placeholder{color:var(--faint);font-family:var(--body);font-weight:400;font-size:13.5px;letter-spacing:0;}
.field .u{font-size:10.5px;color:var(--faint);padding-left:6px;flex:none;font-family:var(--display);letter-spacing:1px;}
.setrow .rm{width:30px;height:30px;flex:none;color:var(--faint);display:flex;align-items:center;justify-content:center;}
.setrow .rm:active{background:var(--panel-2);}
.addset{margin-top:10px;width:100%;border:1px dashed var(--sys-dim);color:var(--sys);
  padding:8px;font-size:12.5px;font-family:var(--display);font-weight:600;letter-spacing:1px;
  text-transform:uppercase;display:flex;align-items:center;justify-content:center;gap:6px;}
.addset:active{background:rgba(76,201,255,.07);}
.addset svg{width:14px;height:14px;}

.savebar{position:fixed;left:0;right:0;bottom:66px;z-index:20;max-width:540px;margin:0 auto;
  padding:12px 18px calc(12px + env(safe-area-inset-bottom));pointer-events:none;
  background:linear-gradient(to top,var(--void) 58%,transparent);}
.save{pointer-events:auto;width:100%;padding:15px;position:relative;
  background:linear-gradient(100deg,rgba(76,201,255,.16),rgba(76,201,255,.06));
  border:1px solid var(--sys);color:var(--sys-hi);
  font-family:var(--display);font-weight:700;font-size:16px;letter-spacing:3px;text-transform:uppercase;
  box-shadow:0 0 26px -4px var(--sys-glow),inset 0 0 22px rgba(76,201,255,.09);}
.save:active{transform:translateY(1px);}

/* ---------- dieta ---------- */
.pad{padding:4px 18px 26px;}
.fuel{padding:16px 15px 15px;margin-bottom:13px;}
.fuel .row{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:12px;}
.fuel .big{font-family:var(--display);font-weight:700;font-size:38px;line-height:.95;
  letter-spacing:.5px;color:var(--mana-hi);white-space:nowrap;text-shadow:0 0 20px rgba(155,123,255,.4);}
.fuel .big small{font-size:15px;color:var(--dim);font-weight:500;}
.fuel .note{font-size:12px;color:var(--dim);margin-top:5px;}
.fuel .pr{text-align:right;}
.fuel .pr .v{font-family:var(--display);font-weight:600;font-size:23px;line-height:1;color:var(--text);white-space:nowrap;}
.fuel .pr .v small{font-size:12px;color:var(--dim);}
.fuel .pr .l{font-size:11px;color:var(--faint);margin-top:4px;font-family:var(--display);letter-spacing:1.4px;text-transform:uppercase;}
.gauge{height:11px;background:rgba(0,0,0,.45);border:1px solid var(--edge);overflow:hidden;}
.gauge i{display:block;height:100%;background:linear-gradient(90deg,#4A3A7A,var(--mana) 65%,var(--mana-hi));
  box-shadow:0 0 14px rgba(155,123,255,.5);transition:width .6s cubic-bezier(.2,.8,.2,1);}
.gauge.full i{background:linear-gradient(90deg,var(--mana),var(--gold));}
.glbl{display:flex;justify-content:space-between;margin-top:7px;font-size:11px;color:var(--faint);
  font-family:var(--display);letter-spacing:.8px;}
.meals{display:flex;flex-direction:column;gap:7px;}
.meal{display:flex;align-items:flex-start;gap:11px;width:100%;text-align:left;padding:12px 13px;
  transition:border-color .2s,background .2s;}
.meal .box{width:23px;height:23px;flex:none;border:1px solid var(--edge);background:rgba(0,0,0,.35);
  display:flex;align-items:center;justify-content:center;margin-top:1px;transition:.2s;}
.meal .box svg{width:13px;height:13px;opacity:0;color:#0B1424;}
.meal.on{border-color:rgba(155,123,255,.5);background:linear-gradient(160deg,rgba(155,123,255,.1),rgba(8,13,24,.9));}
.meal.on .box{background:var(--mana);border-color:var(--mana);box-shadow:0 0 12px rgba(155,123,255,.5);}
.meal.on .box svg{opacity:1;}
.meal .t{flex:1;min-width:0;}
.meal .n{font-size:14.5px;font-weight:600;color:var(--text);}
.meal.on .n{color:var(--mana-hi);}
.meal .d{font-size:12px;color:var(--dim);margin-top:2px;line-height:1.4;}
.meal .k{font-family:var(--display);font-size:15px;font-weight:600;color:var(--dim);flex:none;
  letter-spacing:.5px;text-align:right;line-height:1.1;}
.meal .k span{display:block;font-size:9.5px;color:var(--faint);letter-spacing:1px;font-weight:400;}
.bell{display:flex;align-items:center;gap:12px;padding:13px;margin-top:13px;}
.bell .ic{width:36px;height:36px;flex:none;border:1px solid var(--edge);background:rgba(155,123,255,.09);
  display:flex;align-items:center;justify-content:center;color:var(--mana);}
.bell .ic svg{width:18px;height:18px;}
.bell .t{flex:1;min-width:0;}
.bell .t b{font-size:13.5px;display:block;}
.bell .t span{font-size:11.5px;color:var(--dim);line-height:1.4;display:block;margin-top:2px;}
.sw{width:48px;height:27px;flex:none;background:var(--edge);position:relative;transition:background .2s;}
.sw::after{content:"";position:absolute;top:3px;left:3px;width:21px;height:21px;
  background:var(--faint);transition:.2s;}
.sw.on{background:rgba(155,123,255,.35);}
.sw.on::after{left:24px;background:var(--mana-hi);box-shadow:0 0 12px rgba(155,123,255,.7);}
.times{margin-top:9px;display:flex;flex-direction:column;gap:6px;}
.timerow{display:flex;align-items:center;gap:10px;padding:8px 12px;}
.timerow span{flex:1;font-size:13px;}
.timerow input{background:rgba(0,0,0,.4);border:1px solid var(--edge);color:var(--text);
  padding:6px 8px;font-family:var(--display);font-weight:600;font-size:14px;color-scheme:dark;}
.ghost{width:100%;margin-top:10px;border:1px solid var(--edge);color:var(--dim);padding:11px;
  font-size:12.5px;font-family:var(--display);letter-spacing:1.2px;text-transform:uppercase;}
.ghost:active{background:var(--panel);}
.fine{font-size:11.5px;color:var(--faint);line-height:1.5;margin-top:11px;}

/* ---------- progresso ---------- */
.seg{display:flex;gap:5px;border:1px solid var(--edge);padding:4px;margin-bottom:14px;background:rgba(0,0,0,.3);}
.seg button{flex:1;color:var(--dim);padding:9px 4px;font-family:var(--display);font-size:12.5px;
  letter-spacing:1.4px;text-transform:uppercase;transition:.18s;}
.seg button.on{background:rgba(76,201,255,.13);color:var(--sys-hi);box-shadow:inset 0 0 14px rgba(76,201,255,.12);}
.selwrap{position:relative;margin-bottom:13px;}
.selwrap select{width:100%;appearance:none;-webkit-appearance:none;background:var(--panel);
  border:1px solid var(--edge);color:var(--text);padding:14px 42px 14px 14px;
  font-family:var(--display);font-weight:600;font-size:16px;letter-spacing:.5px;}
.selwrap::after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;
  border-right:2px solid var(--sys);border-bottom:2px solid var(--sys);
  transform:translateY(-70%) rotate(45deg);pointer-events:none;}
.chartcard{padding:16px 14px 11px;margin-bottom:13px;}
.chead{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:12px;gap:12px;}
.chead .l{font-size:11px;color:var(--faint);font-family:var(--display);letter-spacing:1.6px;text-transform:uppercase;}
.chead .v{font-family:var(--display);font-weight:700;font-size:32px;line-height:.95;letter-spacing:.5px;white-space:nowrap;}
.chead .v small{font-size:15px;}
.c-sys .v{color:var(--sys-hi);text-shadow:0 0 16px var(--sys-glow);}
.c-sys .v small{color:var(--sys);}
.c-mana .v{color:var(--mana-hi);text-shadow:0 0 16px rgba(155,123,255,.4);}
.c-mana .v small{color:var(--mana);}
svg.chart{width:100%;height:auto;display:block;}
.delta{font-size:12px;color:var(--dim);margin-top:4px;}
.delta b{color:var(--gold);}

/* barra de rank do exercício */
.rankbar{margin-top:12px;}
.rankbar .head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:7px;}
.rankbar .head .a{font-size:11.5px;color:var(--dim);}
.rankbar .head .a b{color:var(--sys-hi);font-family:var(--display);font-size:14px;}
.rankbar .head .z{font-family:var(--display);font-size:12px;letter-spacing:1.4px;color:var(--gold);}
.ladder{display:flex;gap:3px;}
.ladder div{flex:1;height:26px;border:1px solid var(--edge);display:flex;align-items:center;
  justify-content:center;font-family:var(--display);font-weight:600;font-size:12px;color:var(--faint);
  background:rgba(0,0,0,.3);transition:.3s;}
.ladder div.hit{border-color:var(--sys-dim);color:var(--sys-hi);background:rgba(76,201,255,.12);}
.ladder div.now{border-color:var(--gold);color:var(--gold);background:rgba(255,203,92,.14);
  box-shadow:0 0 14px rgba(255,203,92,.3);}
.next{font-size:12px;color:var(--dim);margin-top:8px;}
.next b{color:var(--sys-hi);}

.wform{display:flex;gap:8px;margin-bottom:13px;}
.wform .field{height:48px;}
.wform button{flex:none;padding:0 18px;border:1px solid var(--mana);color:var(--mana-hi);
  background:rgba(155,123,255,.12);font-family:var(--display);font-weight:700;font-size:14px;
  letter-spacing:1.6px;text-transform:uppercase;}
.rows{display:flex;flex-direction:column;gap:7px;}
.row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 13px;}
.row .d{font-size:12px;color:var(--dim);}
.row .d b{display:block;color:var(--text);font-family:var(--display);font-size:15px;letter-spacing:.5px;}
.row .v{font-family:var(--display);font-weight:600;font-size:18px;letter-spacing:.5px;text-align:right;white-space:nowrap;}
.row .v small{font-size:11px;color:var(--dim);}
.row.pr{border-color:rgba(255,203,92,.45);}
.row.pr .v{color:var(--gold);}
.row .pr-t{font-size:10.5px;color:var(--gold);font-family:var(--display);letter-spacing:1.2px;text-transform:uppercase;}

/* ---------- histórico ---------- */
.hg{margin-bottom:15px;}
.hd{font-family:var(--display);font-weight:600;font-size:15px;letter-spacing:.8px;color:var(--sys-hi);
  margin-bottom:7px;text-transform:capitalize;}
.hd span{font-size:11.5px;color:var(--faint);letter-spacing:.4px;text-transform:none;font-weight:400;}
.hc{overflow:hidden;}
.he{padding:10px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;
  border-top:1px solid var(--edge);}
.he:first-child{border-top:none;}
.he .n{font-size:13px;}
.he .s{font-family:var(--display);font-size:14px;color:var(--dim);letter-spacing:.5px;flex:none;}
.he .s b{color:var(--text);}

/* ---------- vazio ---------- */
.empty{text-align:center;padding:54px 28px;color:var(--dim);}
.empty svg{width:42px;height:42px;color:var(--edge);margin-bottom:14px;}
.empty h3{font-family:var(--display);font-weight:600;font-size:19px;color:var(--text);letter-spacing:1px;margin-bottom:7px;}
.empty p{font-size:13px;line-height:1.55;max-width:250px;margin:0 auto;}
.danger{display:block;margin:24px auto 0;border:1px solid var(--edge);color:var(--faint);
  font-size:12px;padding:10px 17px;font-family:var(--display);letter-spacing:1.2px;text-transform:uppercase;}
.danger:active{background:var(--panel);}

/* ---------- nav ---------- */
nav{position:fixed;left:0;right:0;bottom:0;z-index:30;max-width:540px;margin:0 auto;display:flex;
  background:rgba(5,8,15,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--edge);padding-bottom:env(safe-area-inset-bottom);}
nav button{flex:1;color:var(--faint);padding:10px 0 9px;display:flex;flex-direction:column;
  align-items:center;gap:4px;font-family:var(--display);font-size:10.5px;letter-spacing:1.4px;
  text-transform:uppercase;transition:color .18s;}
nav button svg{width:21px;height:21px;}
nav button.active{color:var(--sys);text-shadow:0 0 12px var(--sys-glow);}
nav button[data-tab="dieta"].active{color:var(--mana);text-shadow:0 0 12px rgba(155,123,255,.5);}

/* ---------- alerta do sistema ---------- */
#alert{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;
  padding:26px;background:rgba(3,6,12,.82);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);}
#alert.show{display:flex;}
.alertbox{width:100%;max-width:330px;padding:26px 22px 22px;text-align:center;position:relative;
  animation:rise .38s cubic-bezier(.2,.9,.25,1);
  box-shadow:0 0 60px -10px var(--sys-glow),inset 0 0 40px rgba(76,201,255,.07);}
@keyframes rise{from{opacity:0;transform:translateY(14px) scale(.96);}to{opacity:1;transform:none;}}
.alertbox .kicker{font-family:var(--display);font-size:11px;letter-spacing:4px;color:var(--sys);
  text-transform:uppercase;margin-bottom:12px;}
.alertbox .big{font-family:var(--display);font-weight:700;font-size:44px;line-height:1;
  color:#fff;letter-spacing:1px;text-shadow:0 0 26px var(--sys-glow);}
.alertbox.gold .big{color:var(--gold);text-shadow:0 0 30px rgba(255,203,92,.6);}
.alertbox.gold .kicker{color:var(--gold);}
.alertbox .msg{font-size:13.5px;color:var(--dim);margin-top:11px;line-height:1.5;}
.alertbox .ok{margin-top:19px;width:100%;padding:12px;border:1px solid var(--sys);color:var(--sys-hi);
  background:rgba(76,201,255,.1);font-family:var(--display);font-weight:600;font-size:14px;
  letter-spacing:2.4px;text-transform:uppercase;}
.alertbox.gold .ok{border-color:var(--gold);color:var(--gold-hi);background:rgba(255,203,92,.1);}

/* ---------- toast ---------- */
#toast{position:fixed;left:50%;bottom:130px;transform:translateX(-50%) translateY(16px);z-index:50;
  display:flex;align-items:center;gap:9px;max-width:88%;
  background:var(--panel-2);border:1px solid var(--sys);color:var(--text);
  padding:12px 18px;font-size:13.5px;font-weight:600;
  opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;
  box-shadow:0 0 28px -6px var(--sys-glow);}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
#toast svg{width:17px;height:17px;color:var(--sys);flex:none;}
#toast.mana{border-color:var(--mana);box-shadow:0 0 28px -6px rgba(155,123,255,.5);}
#toast.mana svg{color:var(--mana);}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}}
@media (max-width:360px){
  .stat .k{width:84px;font-size:10.5px;letter-spacing:.4px;}
  .brand h1{font-size:22px;letter-spacing:3px;}
}

/* ---------- carteira de caçador ---------- */
.carteira{padding:16px 15px 15px;margin-bottom:14px;}
.cart-top{display:flex;align-items:center;gap:13px;margin-bottom:15px;}
.cart-id{flex:1;min-width:0;}
.cart-id .l{font-family:var(--display);font-size:11px;letter-spacing:2.4px;color:var(--gold);text-transform:uppercase;}
.cart-id .t{font-family:var(--display);font-weight:700;font-size:26px;line-height:1.05;color:#fff;letter-spacing:.5px;}
.cart-id .s{font-size:11.5px;color:var(--dim);margin-top:3px;line-height:1.4;}
.axes{display:flex;flex-direction:column;gap:11px;}
.axis-h{display:flex;justify-content:space-between;align-items:baseline;gap:9px;margin-bottom:5px;}
.axis-h .an{font-family:var(--display);font-weight:600;font-size:13px;letter-spacing:1.4px;
  color:var(--sys-hi);text-transform:uppercase;}
.axis-h .ad{font-size:11px;color:var(--faint);text-align:right;flex:none;white-space:nowrap;}
.axis .ladder div{height:22px;font-size:11px;}
.bottle{margin-top:14px;padding:11px 12px;border:1px solid rgba(255,203,92,.3);
  background:rgba(255,203,92,.06);font-size:12.5px;color:var(--dim);line-height:1.5;}
.bottle b{display:block;font-family:var(--display);font-size:13px;letter-spacing:1.4px;
  color:var(--gold);text-transform:uppercase;margin-bottom:3px;}

/* ---------- manequim anatômico ---------- */
.fig .skin{fill:#121D30;stroke:#22334C;stroke-width:1.1;stroke-linejoin:round;}
.fig .m{fill:#1A2941;stroke:#283B56;stroke-width:.9;stroke-linejoin:round;transition:fill .55s ease, stroke .55s ease;}
.fig .m.sec{fill:#1D5474;stroke:#2E7C9E;}
.fig .m.pri{fill:#4CC9FF;stroke:#EAFAFF;stroke-width:1.1;}
.fig-mus .m.pri{filter:drop-shadow(0 0 5px rgba(76,201,255,.85));}
.fig .ln{fill:none;stroke:#22334C;stroke-width:.8;stroke-linecap:round;}
.fig .scan{animation:scanline 4.2s cubic-bezier(.5,0,.5,1) infinite;}
@keyframes scanline{0%{transform:translateY(0)}100%{transform:translateY(530px)}}
.fig .m.pri{animation:respira 2.8s ease-in-out infinite;}
@keyframes respira{0%,100%{opacity:1}50%{opacity:.78}}

/* ---------- sugestão e cronômetro ---------- */
.chips{display:flex;gap:7px;margin-top:10px;flex-wrap:wrap;}
.sug,.rest{display:inline-flex;align-items:center;gap:6px;padding:7px 11px;
  border:1px solid var(--edge);background:rgba(0,0,0,.3);color:var(--dim);
  font-family:var(--display);font-weight:600;font-size:12.5px;letter-spacing:.6px;}
.sug svg,.rest svg{width:14px;height:14px;}
.sug{border-color:rgba(76,201,255,.35);color:var(--sys-hi);background:rgba(76,201,255,.08);}
.sug.up{border-color:var(--gold);color:var(--gold);background:rgba(255,203,92,.1);
  box-shadow:0 0 14px -3px rgba(255,203,92,.45);}
.sug:active,.rest:active{transform:translateY(1px);}
.timer{display:flex;align-items:center;gap:9px;padding:10px 12px;margin-bottom:9px;
  border:1px solid var(--sys);background:rgba(11,20,36,.97);
  box-shadow:0 0 26px -6px var(--sys-glow);pointer-events:auto;}
.timer .tm{font-family:var(--display);font-weight:700;font-size:25px;letter-spacing:1px;
  color:var(--sys-hi);min-width:62px;}
.timer .tn{flex:1;min-width:0;font-size:12px;color:var(--dim);overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;}
.timer .tb{flex:none;border:1px solid var(--edge);color:var(--dim);padding:6px 10px;
  font-family:var(--display);font-size:12px;letter-spacing:.8px;}
.timer.fim{border-color:var(--gold);box-shadow:0 0 26px -6px rgba(255,203,92,.6);}
.timer.fim .tm{color:var(--gold);}

/* ---------- avisos ---------- */
.aviso{margin:0 18px 12px;padding:13px 14px;border:1px solid rgba(255,203,92,.32);
  background:rgba(255,203,92,.06);}
.pad .aviso{margin:0 0 13px;}
.aviso b{display:flex;align-items:center;gap:7px;font-family:var(--display);font-size:13.5px;
  letter-spacing:1.2px;text-transform:uppercase;color:var(--gold);margin-bottom:5px;}
.aviso b svg{width:15px;height:15px;flex:none;}
.aviso p{font-size:12.5px;color:var(--dim);line-height:1.55;}
.aviso.st{border-color:rgba(76,201,255,.3);background:rgba(76,201,255,.05);}
.aviso.st b{color:var(--sys-hi);}
.av-btn{margin-top:10px;border:1px solid var(--edge);color:var(--text);padding:9px 14px;
  font-family:var(--display);font-size:12.5px;letter-spacing:1.2px;text-transform:uppercase;
  background:rgba(0,0,0,.25);}
.av-btn:active{background:var(--panel-2);}

/* ---------- mapa de volume ---------- */
.fig .m.v0{fill:#141F33;stroke:#22334C;}
.fig .m.v1{fill:#8A4A2A;stroke:#C2703C;}
.fig .m.v2{fill:#2C86B0;stroke:#5FC6EE;}
.fig .m.v3{fill:#C69A34;stroke:#FFD97A;}
.legend i.l1{background:#C2703C;}
.legend i.l2{background:#5FC6EE;}
.legend i.l3{background:#FFD97A;}
.vlist{display:flex;flex-direction:column;gap:6px;}
.vrow{display:flex;align-items:center;gap:10px;padding:9px 12px;
  border:1px solid var(--edge);background:var(--panel);}
.vrow .vn{width:108px;flex:none;font-size:12.5px;}
.vrow .vb{flex:1;height:6px;background:rgba(0,0,0,.45);border:1px solid var(--edge);overflow:hidden;}
.vrow .vb i{display:block;height:100%;background:var(--sys-dim);}
.vrow .vv{width:28px;flex:none;text-align:right;font-family:var(--display);font-weight:600;
  font-size:14px;color:var(--dim);}
.vrow.f1 .vb i{background:#C2703C;} .vrow.f1 .vv{color:#E08A4C;}
.vrow.f2 .vb i{background:var(--sys);} .vrow.f2 .vv{color:var(--sys-hi);}
.vrow.f3 .vb i{background:var(--gold);} .vrow.f3 .vv{color:var(--gold);}
.vrow.f0{opacity:.55;}

/* ---------- backup ---------- */
.bkp{padding:14px;margin-top:6px;}
.bkp b{display:flex;align-items:center;gap:7px;font-family:var(--display);font-size:13.5px;
  letter-spacing:1.4px;text-transform:uppercase;color:var(--sys-hi);margin-bottom:6px;}
.bkp b svg{width:16px;height:16px;}
.bkp p{font-size:12.5px;color:var(--dim);line-height:1.55;}
.bkp-b{display:flex;gap:8px;}
.bkp-b .av-btn{flex:1;}
.seg button{font-size:11.5px;letter-spacing:.9px;padding:9px 2px;}

/* ---------- ficha de status ---------- */
.ficha{padding:18px 15px 14px;margin-bottom:14px;overflow:hidden;}
.scanbg{position:absolute;inset:0;pointer-events:none;opacity:.55;
  background:repeating-linear-gradient(180deg,transparent 0 3px,rgba(76,201,255,.04) 3px 4px);}
.f-top{display:flex;align-items:center;gap:15px;position:relative;margin-bottom:15px;}
.f-selo{width:86px;height:86px;flex:none;position:relative;display:flex;align-items:center;justify-content:center;}
.f-selo .selo{position:absolute;inset:0;width:100%;height:100%;}
.f-selo b{font-family:var(--display);font-weight:700;font-size:44px;line-height:1;
  color:var(--gold);text-shadow:0 0 24px rgba(255,203,92,.6);}
.f-selo.r-E b,.f-selo.r-D b{color:var(--sys-hi);text-shadow:0 0 20px var(--sys-glow);}
.f-id{flex:1;min-width:0;}
.f-k{font-family:var(--display);font-size:11.5px;letter-spacing:2.4px;color:var(--sys);text-transform:uppercase;}
.f-t{font-family:var(--display);font-weight:700;font-size:30px;line-height:1.05;color:#fff;letter-spacing:.5px;}
.f-lv{font-size:13px;color:var(--dim);margin-top:3px;}
.f-lv b{font-family:var(--display);font-size:19px;color:var(--sys-hi);letter-spacing:.5px;}
.f-xp{position:relative;margin-bottom:6px;}
.f-xpl{display:flex;justify-content:space-between;margin-top:6px;font-family:var(--display);
  font-size:11.5px;letter-spacing:.7px;color:var(--faint);}
.radar{width:100%;height:auto;display:block;margin:2px auto 0;max-width:340px;position:relative;}
.radar .rl{fill:#8A94A6;font-family:"Chakra Petch",sans-serif;font-size:11px;letter-spacing:.6px;}
.radar .rv{fill:#A8ECFF;font-family:"Chakra Petch",sans-serif;font-size:14px;font-weight:700;}
.radar .area{filter:drop-shadow(0 0 7px rgba(76,201,255,.55));animation:pulsar 3.4s ease-in-out infinite;}
@keyframes pulsar{0%,100%{opacity:1}50%{opacity:.85}}

/* ---------- próxima conquista ---------- */
.alvo{padding:15px;margin-bottom:14px;}
.al-k{font-family:var(--display);font-size:11px;letter-spacing:2.6px;color:var(--gold);text-transform:uppercase;}
.al-t{font-family:var(--display);font-weight:700;font-size:24px;color:#fff;letter-spacing:.5px;line-height:1.1;margin-top:2px;}
.al-d{font-size:12.5px;color:var(--dim);margin:3px 0 11px;}
.al-v{font-size:12px;color:var(--gold-hi);margin-top:7px;font-family:var(--display);letter-spacing:.6px;}

/* ---------- como ganhar xp ---------- */
.xpbox{padding:4px 14px;margin-bottom:4px;}
.xpf{display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:11px 0;border-top:1px solid var(--edge);font-size:13px;color:var(--dim);}
.xpf:first-child{border-top:none;}
.xpf b{font-family:var(--display);font-size:16px;color:var(--sys-hi);letter-spacing:.5px;flex:none;}

/* ---------- conquistas ---------- */
.cqgrid{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
.cq{padding:12px 11px;border:1px solid var(--edge);background:var(--panel);position:relative;}
.cq-t{font-family:var(--display);font-weight:600;font-size:14.5px;color:var(--dim);letter-spacing:.4px;line-height:1.15;}
.cq-d{font-size:11px;color:var(--faint);line-height:1.35;margin:3px 0 8px;min-height:30px;}
.cq-b{height:5px;background:rgba(0,0,0,.5);border:1px solid var(--edge);overflow:hidden;}
.cq-b i{display:block;height:100%;background:var(--sys-dim);transition:width .6s ease;}
.cq-b.big{height:9px;}
.cq-b.big i{background:linear-gradient(90deg,var(--amber,#D98A1F),var(--gold));box-shadow:0 0 12px rgba(255,203,92,.5);}
.cq-v{font-family:var(--display);font-size:11px;color:var(--faint);letter-spacing:.5px;margin-top:5px;}
.cq.on{border-color:rgba(255,203,92,.5);background:linear-gradient(160deg,rgba(255,203,92,.1),rgba(8,13,24,.9));
  box-shadow:0 0 18px -6px rgba(255,203,92,.45);}
.cq.on .cq-t{color:var(--gold);}
.cq.on .cq-b i{background:var(--gold);}
.cq.on .cq-v{color:var(--gold-hi);}
.cq.on::after{content:"";position:absolute;top:-1px;right:-1px;width:11px;height:11px;
  border-top:2px solid var(--gold);border-right:2px solid var(--gold);}

/* ---------- rank por levantamento ---------- */
.rkrow{display:flex;align-items:center;gap:10px;padding:11px 13px;
  border:1px solid var(--edge);background:var(--panel);}
.rkrow .rn{flex:1;min-width:0;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rkrow .rq{font-family:var(--display);font-size:13.5px;color:var(--dim);letter-spacing:.5px;flex:none;}
.rkrow .rr{width:26px;height:26px;flex:none;display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:700;font-size:14px;border:1px solid var(--sys-dim);
  color:var(--sys-hi);background:rgba(76,201,255,.1);}
.rkrow .rr.r-B,.rkrow .rr.r-A,.rkrow .rr.r-S{border-color:var(--gold);color:var(--gold);background:rgba(255,203,92,.12);}
@media (max-width:340px){.cqgrid{grid-template-columns:1fr;}}

/* ---------- configurações ---------- */
.cfg{padding:14px;margin-top:6px;margin-bottom:10px;}
.cfg > b{display:flex;align-items:center;gap:7px;font-family:var(--display);font-size:13.5px;
  letter-spacing:1.4px;text-transform:uppercase;color:var(--sys-hi);margin-bottom:6px;}
.cfg > b svg{width:16px;height:16px;}
.cfg > p{font-size:12.5px;color:var(--dim);line-height:1.55;margin-bottom:12px;}
.cfgrow{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--edge);}
.cfgrow label{flex:1;font-size:13px;color:var(--dim);}
.cfgin{display:flex;align-items:center;gap:6px;background:rgba(0,0,0,.4);
  border:1px solid var(--edge);padding:0 10px;height:40px;width:132px;flex:none;}
.cfgin:focus-within{border-color:var(--sys);}
.cfgin input{width:100%;min-width:0;background:none;border:none;color:#fff;outline:none;
  font-family:var(--display);font-weight:600;font-size:16px;text-align:right;}
.cfgin span{font-size:11px;color:var(--faint);font-family:var(--display);letter-spacing:.8px;flex:none;}
.sexo{display:flex;gap:5px;flex:none;}
.sexo button{border:1px solid var(--edge);color:var(--dim);padding:9px 13px;
  font-family:var(--display);font-size:12.5px;letter-spacing:.8px;background:rgba(0,0,0,.3);}
.sexo button.on{border-color:var(--sys);color:var(--sys-hi);background:rgba(76,201,255,.12);}

/* ---------- anilhas, nota, editar ---------- */
.anil{margin-top:8px;padding:9px 11px;border:1px solid var(--edge);background:rgba(0,0,0,.3);
  font-size:12.5px;color:var(--dim);}
.anil b{font-family:var(--display);font-size:15px;color:var(--sys-hi);letter-spacing:1px;}
.nota{padding:13px 14px;}
.nota label{display:block;font-family:var(--display);font-size:12.5px;letter-spacing:1.4px;
  text-transform:uppercase;color:var(--dim);margin-bottom:7px;}
.nota textarea{width:100%;background:rgba(0,0,0,.4);border:1px solid var(--edge);color:var(--text);
  font-family:var(--body);font-size:13.5px;padding:10px;resize:vertical;outline:none;line-height:1.5;}
.nota textarea:focus{border-color:var(--sys);}
.hedit{width:100%;border-top:1px solid var(--edge);color:var(--sys);padding:11px;
  display:flex;align-items:center;justify-content:center;gap:7px;
  font-family:var(--display);font-size:12.5px;letter-spacing:1.2px;text-transform:uppercase;}
.hedit svg{width:14px;height:14px;}
.hedit:active{background:rgba(76,201,255,.07);}
.he.hn{display:block;font-size:12.5px;color:var(--dim);font-style:italic;line-height:1.5;}
.sug.dl{border-color:var(--mana);color:var(--mana-hi);background:rgba(155,123,255,.1);
  box-shadow:0 0 14px -4px rgba(155,123,255,.5);}
