/* Halaman /2fa-generate — dimuat khusus di halaman ini (setelah beli.css). Warna mengikuti tema (--pri, --card, dst). */
.tfa .cek-hero{margin-bottom:14px}
.tfa .stp2 .f{margin:0}
.tfa .stp2 .f>label{display:block;margin:0 0 8px}
.tfa .stp2 .fi{display:block;position:relative}
.tfa .stp2 .fi textarea.input{
  display:block;width:100%;box-sizing:border-box;min-height:120px;padding:14px 16px;resize:vertical;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14.5px;line-height:1.55;font-weight:600;
  color:var(--ink);background:var(--card2);border:1.5px solid var(--line);border-radius:var(--r-s)}
.tfa .stp2 .fi textarea.input:focus{border-color:var(--pri);background:var(--card);box-shadow:0 0 0 4px var(--pri-l)}
.tfa .stp2 .fi textarea.input::placeholder{font-weight:500;opacity:.5}
.tfa .tl-go{display:flex;width:100%;margin-top:14px}
.tfa .alert{margin-top:12px}

/* hitung mundur */
.tfa .tfa-tm{display:flex;align-items:center;gap:14px;margin:0 0 12px;padding:12px 16px;
  border-radius:var(--r-s);background:var(--card2);border:1px solid var(--line)}
.tfa .tfa-tm span{flex:none;display:flex;align-items:baseline;gap:5px;white-space:nowrap;font-size:13.5px;font-weight:600;color:var(--muted)}
.tfa .tfa-tm b{font-size:22px;font-weight:800;line-height:1;min-width:26px;text-align:center;color:var(--pri);font-variant-numeric:tabular-nums}
.tfa .tfa-bar{flex:1;min-width:0;display:block;height:9px;border-radius:99px;overflow:hidden;
  background:color-mix(in srgb,var(--ink) 12%,transparent)}
.tfa .tfa-bar i{display:block;height:100%;width:100%;border-radius:99px;
  background:linear-gradient(90deg,var(--ok),var(--pri2));transition:width 1s linear}
.tfa .tfa-tm.low b{color:var(--warn)}
.tfa .tfa-tm.low .tfa-bar i{background:linear-gradient(90deg,var(--warn),var(--bad))}

/* daftar kode */
.tfa .tfa-l{display:flex;flex-direction:column;gap:10px;margin:0}
.tfa .tfa-r{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 16px;
  border-radius:var(--r-s);background:var(--card2);border:1.5px solid color-mix(in srgb,var(--pri) 25%,transparent)}
.tfa .tfa-r>div{flex:1;min-width:0}
.tfa .tfa-r small{display:block;margin:0 0 2px;font-size:12.5px;font-weight:700;color:var(--pri);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tfa .tfa-r b{display:block;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:30px;font-weight:800;letter-spacing:.1em;line-height:1.25;color:var(--ink);white-space:nowrap}
.tfa .tfa-r .pnl-cp{flex:none;width:46px;height:46px;display:grid;place-items:center;border-radius:13px;font-size:17px;
  color:var(--pri);background:var(--card);border:1.5px solid color-mix(in srgb,var(--pri) 40%,transparent)}
.tfa .tfa-r.bad{border-color:color-mix(in srgb,var(--bad) 45%,transparent)}
.tfa .tfa-r.bad small{color:var(--muted)}
.tfa .tfa-r.bad b{font-family:inherit;font-size:13.5px;font-weight:700;letter-spacing:0;white-space:normal;color:var(--bad)}

/* semua kode + tombol */
.tfa .tfa-all{margin-top:18px}
.tfa .tfa-all .fi textarea.input{min-height:96px}
.tfa .tfa-bt{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.tfa .tfa-bt .btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin:0;padding:14px 10px;
  font-size:15px;font-weight:700;white-space:nowrap}
.tfa .tfa-bt .btn.ghost{background:var(--card2);color:var(--ink);border:1.5px solid var(--line);box-shadow:none}
@media(max-width:360px){.tfa .tfa-r b{font-size:25px}}