/* ============================================================
   FRITME app — app.css
   Tokens extraídos do protótipo fritme-app.jsx
============================================================ */
:root{
  --violet:#7C3AED; --violet-dark:#6D28D9; --violet-soft:#F5F3FF;
  --ink:#111114; --text:#18181B; --sub:#6B7280; --faint:#9CA3AF;
  --line:#EAEAEE; --surface:#FFFFFF; --wash:#F7F7F9;
  --v-verd:#059669; --v-verd-bg:#ECFDF5; --v-verd-ring:#A7F3D0;
  --v-susp:#D97706; --v-susp-bg:#FFFBEB; --v-susp-ring:#FDE68A;
  --v-falso:#DC2626; --v-falso-bg:#FEF2F2; --v-falso-ring:#FECACA;
  --v-inc:#6B7280;  --v-inc-bg:#F3F4F6;  --v-inc-ring:#E5E7EB;
  --display:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --body:'Inter',ui-sans-serif,system-ui,sans-serif;
  --sat:env(safe-area-inset-top,0px);
  --sab:env(safe-area-inset-bottom,0px);
}

*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  font-family:var(--body); color:var(--text); background:var(--surface);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overscroll-behavior:none;
}
button{font-family:inherit}
img{max-width:100%}
::-webkit-scrollbar{width:0;height:0}

/* ---------- shell ---------- */
.app{
  position:fixed; inset:0;
  display:grid; grid-template-rows:auto 1fr auto;
  background:var(--surface); overflow:hidden;
}

/* header */
.hdr{
  display:flex; align-items:center; justify-content:space-between;
  padding:calc(12px + var(--sat)) 18px 12px;
  border-bottom:1px solid var(--line); background:var(--surface); z-index:5;
}
.hdr__logo{height:34px; width:auto; display:block}
.hdr__menu{
  background:var(--wash); border:none; width:36px; height:36px; border-radius:11px;
  display:grid; place-items:center; cursor:pointer; color:var(--text);
}
.hdr__menu:active{transform:scale(.94)}

/* main scroll */
.main{overflow-y:auto; -webkit-overflow-scrolling:touch; background:var(--surface)}
.screen{display:none}
.screen.active{display:block}

/* tab bar */
.tabbar{
  display:flex; border-top:1px solid var(--line); background:var(--surface);
  padding-bottom:calc(10px + var(--sab)); z-index:5;
}
.tabbar__btn{
  flex:1; background:none; border:none; cursor:pointer;
  display:flex; flex-direction:column; align-items:center; gap:3px;
  padding:10px 0 6px; color:var(--faint); transition:color .15s;
}
.tabbar__btn span{font-family:var(--display); font-size:10.5px; font-weight:500; letter-spacing:.2px}
.tabbar__btn.active{color:var(--violet)}
.tabbar__btn.active span{font-weight:600}
.tabbar__btn.active svg{stroke-width:2.4}

/* ---------- seal (selo do veredito) ---------- */
.seal{
  display:inline-flex; align-items:center; gap:6px; padding:6px 14px;
  border-radius:999px; font-family:var(--display); font-weight:700; font-size:14px;
  letter-spacing:.3px; transform:rotate(-3deg); white-space:nowrap; border:1.5px solid;
}
.seal--sm{gap:4px; padding:3px 9px; font-size:10.5px}
.seal.VERDADEIRO{color:var(--v-verd); background:var(--v-verd-bg); border-color:var(--v-verd-ring)}
.seal.SUSPEITO{color:var(--v-susp); background:var(--v-susp-bg); border-color:var(--v-susp-ring)}
.seal.FALSO{color:var(--v-falso); background:var(--v-falso-bg); border-color:var(--v-falso-ring)}
.seal.INCONCLUSIVO{color:var(--v-inc); background:var(--v-inc-bg); border-color:var(--v-inc-ring)}

/* ---------- Verificar ---------- */
.pad{padding:18px 16px 28px}
.h1{font-family:var(--display); font-size:21px; font-weight:600; color:var(--text); margin:2px 0 14px; letter-spacing:-.4px}
.h1--sm{font-size:20px}

.segmented{display:flex; gap:6px; background:var(--wash); padding:4px; border-radius:14px; margin-bottom:16px}
.seg{
  flex:1; display:flex; align-items:center; justify-content:center; gap:7px;
  padding:10px 0; border:none; border-radius:11px; cursor:pointer; background:transparent;
  color:var(--faint); font-family:var(--display); font-weight:600; font-size:14.5px; transition:all .18s;
}
.seg.active{background:var(--surface); color:var(--text); box-shadow:0 1px 3px rgba(0,0,0,.08)}

.panel{display:none}
.panel.active{display:block}

.dropzone{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  min-height:180px; border:2px dashed #D9D9E0; border-radius:18px; background:var(--surface);
  cursor:pointer; transition:all .18s; text-align:center; padding:14px;
}
.dropzone.has-file, .dropzone.drag-over{border-color:var(--violet); background:var(--violet-soft)}
.dropzone__ic{width:46px; height:46px; border-radius:14px; background:var(--wash); display:grid; place-items:center; color:var(--faint)}
.dropzone.has-file .dropzone__ic{background:var(--violet); color:#fff}
.dropzone__main{font-family:var(--display); font-weight:600; font-size:14.5px; color:var(--text)}
.dropzone__sub{font-size:12.5px; color:var(--faint)}
.dropzone input[type=file]{display:none}
.preview{margin-top:14px; border-radius:16px; overflow:hidden; border:1px solid var(--line)}
.preview img{width:100%; max-height:300px; object-fit:contain; display:block; background:var(--wash)}

/* recorte — miniatura do resultado (inline, na tela Verificar) */
.cropresult{margin-top:14px; text-align:center}
.cropresult img{max-width:100%; max-height:260px; object-fit:contain; border-radius:12px; border:1px solid var(--line); background:var(--wash); display:block; margin:0 auto}
.crop-tools{display:flex; gap:8px; margin-top:10px; justify-content:center}
.crop-btn{padding:9px 14px; border:1.5px solid var(--line); background:var(--surface); border-radius:10px; font-family:var(--display); font-weight:600; font-size:12.5px; color:var(--text); cursor:pointer}
.crop-btn:active{background:var(--wash)}

/* modal de recorte (popup grande) */
.crop-overlay{align-items:center; justify-content:center; padding:14px; z-index:70}
.crop-modal{background:var(--surface); border-radius:18px; width:100%; max-width:560px; max-height:94vh; display:flex; flex-direction:column; overflow:hidden}
.crop-modal__head{display:flex; align-items:center; justify-content:space-between; padding:13px 16px; border-bottom:1px solid var(--line); font-family:var(--display); font-weight:600; font-size:14px; color:var(--text)}
.crop-modal__body{flex:1; min-height:0; display:flex; align-items:center; justify-content:center; padding:14px; background:var(--wash); overflow:auto}
.stage{position:relative; display:inline-block; max-width:100%; overflow:hidden; border-radius:10px; touch-action:none; user-select:none; -webkit-user-select:none; cursor:crosshair; line-height:0}
.stage img{display:block; max-width:100%; max-height:66vh; object-fit:contain}
.stage .sel{position:absolute; border:2px dashed #fff; outline:2px dashed var(--violet); background:rgba(124,58,237,.10); box-shadow:0 0 0 9999px rgba(0,0,0,.5); display:none; pointer-events:none}
.crop-modal__hint{font-size:12px; color:var(--faint); padding:9px 16px 0; text-align:center; line-height:1.5}
.crop-modal__actions{display:flex; gap:10px; padding:14px 16px}
.crop-modal__actions .crop-btn{flex:1; padding:12px}
.btn-usar{flex:1.4; padding:12px; border:none; border-radius:12px; background:var(--violet); color:#fff; font-family:var(--display); font-weight:600; font-size:14px; cursor:pointer}

.textarea{
  width:100%; min-height:180px; padding:14px; resize:none; border:1.5px solid var(--line);
  border-radius:18px; background:var(--surface); font-family:var(--body); font-size:14.5px;
  color:var(--text); outline:none; line-height:1.5;
}
.textarea:focus{border-color:var(--violet)}

.btn-cta{
  width:100%; margin-top:14px; padding:15px 0; border:none; border-radius:16px;
  background:var(--ink); color:#fff; font-family:var(--display); font-weight:600; font-size:15.5px;
  letter-spacing:.2px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:9px;
  transition:background .18s;
}
.btn-cta[disabled]{background:#D4D4D8; cursor:default}

.how{
  width:100%; margin-top:18px; background:none; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; padding:2px;
}
.how__lbl{font-family:var(--display); font-size:11px; font-weight:600; letter-spacing:1.2px; color:var(--faint); text-transform:uppercase}
.how__chev{transition:transform .2s; color:var(--faint)}
.how.open .how__chev{transform:rotate(180deg)}
.how-body{font-family:var(--body); font-size:13px; line-height:1.6; color:var(--sub); margin:10px 2px 0; display:none}
.how-body.open{display:block}

.nudge{
  margin-top:18px; padding:14px; border-radius:16px; background:var(--violet-soft);
  border:1px solid #E9E4FE; display:flex; align-items:center; gap:12px; cursor:pointer; width:100%; text-align:left;
}
.nudge__t{font-family:var(--display); font-weight:600; font-size:13.5px; color:var(--violet-dark)}
.nudge__d{font-size:12px; color:var(--sub); margin-top:2px}
.nudge svg{color:var(--violet); flex-shrink:0}

/* ---------- Resultado ---------- */
.back{background:none; border:none; color:var(--violet); font-family:var(--display); font-weight:600; font-size:13.5px; cursor:pointer; padding:2px 0 12px}
.verdict-head{display:flex; flex-direction:column; align-items:center; gap:12px; padding:8px 0 18px}
.verdict-head .seal{transform:rotate(-3deg) scale(1.15)}
.conf{width:100%; max-width:240px}
.conf__row{display:flex; justify-content:space-between; font-size:11.5px; color:var(--faint); font-family:var(--display); font-weight:600; margin-bottom:5px}
.conf__track{height:7px; border-radius:99px; background:var(--wash); overflow:hidden}
.conf__fill{height:100%; width:0; border-radius:99px; transition:width .6s ease}

.summary{font-family:var(--body); font-size:14px; line-height:1.6; color:var(--text); margin:0 2px 16px}
.factors{display:none; margin-bottom:16px}
.factors.open{display:block}
/* acordeão do detalhamento por afirmação */
.claims-toggle{width:100%; background:none; border:1px solid var(--line); border-radius:12px; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 14px; margin-bottom:14px}
.claims-toggle span{font-family:var(--display); font-weight:600; font-size:11.5px; letter-spacing:.5px; text-transform:uppercase; color:var(--text); text-align:left}
.claims-toggle svg{color:var(--violet); flex-shrink:0; transition:transform .2s}
.claims-toggle.open svg{transform:rotate(180deg)}
/* botão "Nova análise" do rodapé */
.btn-nova-bottom{width:100%; margin-top:12px; padding:13px 0; border:1.5px solid var(--line); border-radius:14px; background:var(--surface); color:var(--text); font-family:var(--display); font-weight:600; font-size:14.5px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px}
.btn-nova-bottom:active{background:var(--wash)}
.factor{display:flex; flex-direction:column; gap:2px; padding:9px 0; border-bottom:1px solid var(--line)}
.factor:last-child{border-bottom:none}
.factor__lbl{font-family:var(--display); font-weight:600; font-size:11px; letter-spacing:.6px; text-transform:uppercase; color:var(--violet)}
.factor__txt{font-family:var(--body); font-size:13.5px; color:var(--text); line-height:1.45}

.kicker{font-family:var(--display); font-size:11px; font-weight:600; letter-spacing:1px; color:var(--faint); text-transform:uppercase; margin-bottom:8px}
.sources{display:flex; flex-wrap:wrap; gap:7px; margin-bottom:18px}
.source{font-family:var(--body); font-size:12.5px; color:var(--sub); background:var(--surface); border:1px solid var(--line); padding:6px 11px; border-radius:99px}

.rec{margin:0 0 16px; padding:14px; border-radius:16px; background:var(--wash)}
.rec b{display:block; font-family:var(--display); font-size:11px; font-weight:600; letter-spacing:1px; color:var(--faint); text-transform:uppercase; margin-bottom:6px}
.rec span{font-family:var(--body); font-size:14px; color:var(--text); line-height:1.5}

/* alerta de enquadramento (o sinal_de_alerta da Etapa 1) */
.alert{margin:0 0 16px; padding:12px 14px; border-radius:14px; background:#FFF7ED; border:1px solid #FED7AA; display:flex; gap:10px; align-items:flex-start}
.alert svg{color:#D97706; flex-shrink:0; margin-top:1px}
.alert__t{font-family:var(--display); font-weight:600; font-size:11px; color:#B45309; text-transform:uppercase; letter-spacing:.5px; margin-bottom:2px}
.alert__d{font-size:13px; color:#7C2D12; line-height:1.5}

/* veredito por afirmação */
.claim{padding:11px 0; border-bottom:1px solid var(--line)}
.claim:last-child{border-bottom:none}
.claim__head{display:flex; align-items:center; gap:8px; margin-bottom:5px}
.claim__badge{font-family:var(--display); font-size:10px; font-weight:700; letter-spacing:.4px; padding:2px 8px; border-radius:99px; text-transform:uppercase}
.claim__txt{font-family:var(--body); font-size:13.5px; color:var(--text); line-height:1.4}
.claim__srcs{display:flex; flex-wrap:wrap; gap:5px; margin-top:7px}
.claim__src{font-size:11px; color:var(--sub); background:var(--wash); border-radius:99px; padding:3px 9px}
.claim__src b{color:var(--faint); font-weight:600}
.claim__peso{font-family:var(--display); font-size:9.5px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--faint); background:var(--wash); border:1px solid var(--line); padding:2px 6px; border-radius:6px}

/* placar (tally das afirmações) */
.placar{text-align:center; font-family:var(--body); font-size:12.5px; color:var(--sub); margin:2px 0 16px; line-height:1.5}
.placar b{font-family:var(--display); font-weight:700; white-space:nowrap}

/* miniatura do conteúdo analisado */
.r-thumb{margin:0 0 16px; text-align:center}
.r-thumb img{max-width:100%; max-height:180px; border-radius:12px; border:1px solid var(--line); object-fit:contain; background:var(--wash)}

/* selo "checagem em tempo real" */
.rt-tag{display:inline-flex; align-items:center; gap:6px; background:var(--violet-soft); color:var(--violet-dark); font-family:var(--display); font-weight:600; font-size:11.5px; padding:5px 11px; border-radius:99px; margin-bottom:10px; letter-spacing:.2px}
.rt-tag svg{color:var(--violet)}

.btn-share{
  width:100%; padding:13px 0; border:none; border-radius:14px; background:var(--violet); color:#fff;
  font-family:var(--display); font-weight:600; font-size:14.5px; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:8px; text-decoration:none;
}
.share-copy-confirm{text-align:center; font-size:12.5px; color:var(--v-verd); margin-top:10px; min-height:16px; font-family:var(--display); font-weight:600}

/* refazer (inconclusivo) */
.refazer{margin:18px 0 0; padding:20px; border:1.5px solid #e8e0ff; border-radius:14px; background:#faf8ff}
.refazer__top{display:flex; align-items:center; gap:10px; margin-bottom:8px}
.refazer__badge{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--violet); background:#ede9fe; padding:3px 8px; border-radius:6px; font-family:var(--display)}
.refazer__title{font-family:var(--display); font-size:14px; font-weight:600; color:#1a0050}
.refazer__desc{font-size:13px; color:var(--sub); line-height:1.6; margin-bottom:16px}
.refazer__prog{height:3px; background:#ede9fe; border-radius:3px; overflow:hidden; margin-bottom:14px}
.refazer__fill{height:100%; background:var(--violet); border-radius:3px; transition:width 1s linear; width:100%}
.refazer__acoes{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.btn-refazer{display:inline-flex; align-items:center; gap:6px; background:var(--violet); color:#fff; font-family:var(--display); font-size:13px; font-weight:600; padding:9px 16px; border-radius:10px; border:none; cursor:pointer}
.btn-refazer-cancel{font-family:var(--display); font-size:13px; font-weight:600; color:var(--sub); background:none; border:none; cursor:pointer; padding:8px 0}

/* loading / log */
.loading{padding:24px 4px}
.log{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12.5px; line-height:1.9; color:var(--sub)}
.log-line{opacity:0; transform:translateY(4px); transition:opacity .3s, transform .3s; display:flex; gap:8px}
.log-line.visible{opacity:1; transform:none}
.log-line.done{color:var(--v-verd)}
.log-ts{color:var(--faint)}
.log-cursor{display:inline-block; width:7px; height:14px; background:var(--violet); margin-left:2px; vertical-align:-2px; animation:blink 1s step-end infinite}
@keyframes blink{50%{opacity:0}}

/* ---------- Feed ---------- */
.feed-head{padding:0 16px}
.feed-sub{font-size:12.5px; color:var(--faint); margin:0 0 14px}
.chips{display:flex; gap:8px; padding:0 16px 16px; overflow-x:auto}
.chip{
  flex-shrink:0; padding:7px 14px; border-radius:99px; cursor:pointer; border:1.5px solid var(--line);
  background:var(--surface); color:var(--sub); font-family:var(--display); font-weight:600; font-size:12.5px; letter-spacing:.3px; transition:all .16s;
}
.chip.active{color:#fff}
.chip.active[data-k=TUDO]{background:var(--text); border-color:var(--text)}
.chip.active[data-k=VERDADEIRO]{background:var(--v-verd); border-color:var(--v-verd)}
.chip.active[data-k=SUSPEITO]{background:var(--v-susp); border-color:var(--v-susp)}
.chip.active[data-k=FALSO]{background:var(--v-falso); border-color:var(--v-falso)}

.grid{display:grid; grid-template-columns:1fr 1fr; gap:11px; padding:0 16px}
.card{text-align:left; padding:0; border:1px solid var(--line); border-radius:16px; overflow:hidden; background:var(--surface); cursor:pointer}
.card__top{height:78px; display:grid; place-items:center; border-bottom:1px solid var(--line)}
.card__body{padding:10px}
.card__claim{font-family:var(--body); font-size:12.5px; color:var(--text); line-height:1.4; margin-top:8px}

/* ---------- Dúvidas ---------- */
.faq{border-bottom:1px solid var(--line)}
.faq__q{width:100%; background:none; border:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 2px; text-align:left}
.faq__q span{font-family:var(--display); font-weight:600; font-size:14px; color:var(--text); line-height:1.35}
.faq__chev{flex-shrink:0; color:var(--faint); transition:transform .2s}
.faq.open .faq__chev{transform:rotate(180deg)}
.faq__a{font-family:var(--body); font-size:13.5px; line-height:1.6; color:var(--sub); margin:0 2px 15px; display:none}
.faq.open .faq__a{display:block}

/* ---------- Candidato ---------- */
.hero{background:linear-gradient(160deg,var(--violet),var(--violet-dark)); padding:26px 18px 24px; color:#fff}
.hero__badge{display:inline-flex; align-items:center; gap:6px; background:rgba(255,255,255,.16); padding:5px 11px; border-radius:99px; font-size:11.5px; font-family:var(--display); font-weight:600; letter-spacing:.5px; margin-bottom:14px}
.hero__h1{font-family:var(--display); font-size:25px; font-weight:700; line-height:1.12; margin:0 0 10px; letter-spacing:-.5px}
.hero__p{font-family:var(--body); font-size:14px; line-height:1.55; color:rgba(255,255,255,.9); margin:0}
.feat{display:flex; gap:13px; padding:12px 0; border-bottom:1px solid var(--line)}
.feat:last-of-type{border-bottom:none}
.feat__ic{width:42px; height:42px; border-radius:12px; background:var(--violet-soft); display:grid; place-items:center; flex-shrink:0; color:var(--violet)}
.feat__t{font-family:var(--display); font-weight:600; font-size:14.5px; color:var(--text)}
.feat__d{font-family:var(--body); font-size:13px; color:var(--sub); margin-top:2px; line-height:1.45}
.btn-black{width:100%; margin-top:18px; padding:15px 0; border:none; border-radius:16px; background:var(--ink); color:#fff; font-family:var(--display); font-weight:600; font-size:15px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px}
.hint{text-align:center; font-size:12px; color:var(--faint); margin-top:10px}

/* ---------- overlays: modal feed + drawer ---------- */
.overlay{position:fixed; inset:0; background:rgba(15,10,25,.45); z-index:40; display:none}
.overlay.open{display:flex}
.sheet{width:100%; background:var(--surface); border-radius:24px 24px 0 0; padding:20px 18px calc(30px + var(--sab)); margin-top:auto}
.sheet__grip{width:40px; height:4px; border-radius:99px; background:var(--line); margin:0 auto 18px}
.sheet__row{display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:14px}
.sheet__claim{font-family:var(--display); font-size:17px; font-weight:600; color:var(--text); line-height:1.35; margin-bottom:10px}
.sheet__p{font-family:var(--body); font-size:13.5px; line-height:1.6; color:var(--sub); margin-bottom:18px}
.icon-btn{background:var(--wash); border:none; width:32px; height:32px; border-radius:10px; display:grid; place-items:center; cursor:pointer; color:var(--sub); flex-shrink:0}

.drawer-ov{justify-content:flex-end}
.drawer{width:300px; max-width:86%; height:100%; background:var(--surface); display:flex; flex-direction:column; overflow-y:auto; padding-top:var(--sat)}
.drawer__head{display:flex; align-items:center; justify-content:space-between; padding:20px 18px 14px}
.drawer__title{font-family:var(--display); font-weight:700; font-size:16px; color:var(--text)}
.acct{margin:0 14px 8px; padding:14px; border-radius:16px; background:var(--violet-soft); border:1px solid #E9E4FE}
.acct__row{display:flex; align-items:center; gap:11px; margin-bottom:12px}
.acct__av{width:40px; height:40px; border-radius:99px; background:var(--violet); display:grid; place-items:center; color:#fff; flex-shrink:0}
.acct__t{font-family:var(--display); font-weight:600; font-size:14px; color:var(--text)}
.acct__d{font-size:11.5px; color:var(--sub); margin-top:1px}
.acct__btn{width:100%; padding:11px 0; border:none; border-radius:12px; background:var(--violet); color:#fff; font-family:var(--display); font-weight:600; font-size:13.5px; cursor:pointer}
.drawer__nav{padding:8px}
.drawer__item{width:100%; background:none; border:none; cursor:pointer; display:flex; align-items:center; gap:12px; padding:12px 10px; border-radius:12px; color:var(--sub)}
.drawer__item span.lbl{flex:1; text-align:left; font-family:var(--display); font-weight:600; font-size:14px; color:var(--text)}
.drawer__item.active{color:var(--violet)}
.drawer__item.active span.lbl{color:var(--violet)}
.drawer__item .chev{color:var(--faint)}
.soon{font-family:var(--display); font-size:9.5px; font-weight:700; letter-spacing:.5px; color:var(--violet); background:var(--violet-soft); padding:2px 6px; border-radius:6px}
.drawer__sep{height:1px; background:var(--line); margin:8px 10px}
.drawer__foot{margin-top:auto; padding:14px}
.loc{display:flex; align-items:flex-start; gap:10px; padding:12px; border-radius:14px; background:var(--wash)}
.loc svg{color:var(--violet); margin-top:1px; flex-shrink:0}
.loc__t{font-family:var(--display); font-weight:600; font-size:12.5px; color:var(--text)}
.loc__d{font-size:11px; color:var(--sub); margin-top:2px; line-height:1.45}

/* ---------- anim ---------- */
@keyframes spin{to{transform:rotate(360deg)}}
.spin{animation:spin .8s linear infinite}
@keyframes fade{from{opacity:0; transform:translateY(6px)}to{opacity:1; transform:none}}
.fade{animation:fade .28s ease}
@keyframes slide{from{transform:translateX(100%)}to{transform:none}}
.slide{animation:slide .26s ease}
.toast{
  position:fixed; left:16px; right:16px; top:calc(12px + var(--sat)); z-index:60;
  background:var(--ink); color:#fff; padding:12px 16px; border-radius:12px; font-size:13.5px; font-weight:600;
  font-family:var(--body); box-shadow:0 10px 40px rgba(0,0,0,.2); text-align:center;
  opacity:0; transform:translateY(-12px); transition:opacity .25s, transform .25s; pointer-events:none;
}
.toast.show{opacity:1; transform:none}
.toast.err{background:var(--v-falso)}

@media (prefers-reduced-motion: reduce){
  .spin,.fade,.slide,.conf__fill,.refazer__fill,.log-line{animation:none!important; transition:none!important}
}
@media (min-width:520px){
  /* Em telas grandes, centraliza o "app" como um cartão, mas sem moldura de celular */
  .app{max-width:440px; left:50%; transform:translateX(-50%); border-left:1px solid var(--line); border-right:1px solid var(--line)}
}