/* Topupsmith — navigasi melayang untuk halaman blog (dibuat dari app.css). */
.ts-app{
  --pri:var(--ts-pri,#021476);--acc:var(--ts-acc,#F4343A);--max:var(--ts-max,1280px);
  --bg:#f3f5fa;--card:#fff;--ink:#0d1530;--ink2:#2b3550;--mut:#5f6b85;--line:#e6e9f2;--soft:#eef1f9;--tint:#eaeeff;
  --ok:#0f9d58;--okbg:#e6f6ee;--warn:#b45f00;--warnbg:#fff3e0;--bad:#d92d20;--badbg:#fdecea;--info:#1d4ed8;--infobg:#e8eefe;
  --sh:0 1px 2px rgba(13,21,48,.05),0 2px 8px rgba(13,21,48,.04);--sh2:0 24px 48px -12px rgba(2,20,118,.22);--r:20px;--rs:12px;
  --hero:linear-gradient(135deg,#010b45 0%,var(--pri) 45%,#1730b8 100%);
  font-family:var(--ts-ff,'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif);font-size:var(--ts-fs,15px);line-height:1.55;color:var(--ink);
  background:var(--bg);width:100%;box-sizing:border-box;-webkit-font-smoothing:antialiased;position:relative;text-align:left;
}
.ts-app[data-theme=dark]{--bg:#060a1c;--card:#0d1330;--ink:#eef0ff;--ink2:#cfd5f2;--mut:#98a2c6;--line:#1c2452;--soft:#131a3e;--tint:#18205a;
  --okbg:#0d2a1d;--warnbg:#33230a;--badbg:#3a1414;--infobg:#142058;--ok:#3ddc97;--warn:#ffb454;--bad:#ff6b63;--info:var(--lt,#8aa2ff);--sh:0 1px 2px rgba(0,0,0,.4);--sh2:0 24px 48px -12px rgba(0,0,0,.7)}
@media(prefers-color-scheme:dark){.ts-app[data-theme=auto]{--bg:#060a1c;--card:#0d1330;--ink:#eef0ff;--ink2:#cfd5f2;--mut:#98a2c6;--line:#1c2452;--soft:#131a3e;--tint:#18205a;
  --okbg:#0d2a1d;--warnbg:#33230a;--badbg:#3a1414;--infobg:#142058;--ok:#3ddc97;--warn:#ffb454;--bad:#ff6b63;--info:var(--lt,#8aa2ff)}}
.ts-app *,.ts-app *::before,.ts-app *::after{box-sizing:border-box}
.ts-bhost{background:transparent!important;position:static!important;width:auto!important;margin:0!important;padding:0!important}
.ts-bhost .ts-bnav,.ts-bhost .ts-bnav-sp{display:none}
@media(max-width:820px){
  .ts-app{--navh:68px}
  .ts-app .ts-bnav{display:block;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:9985;pointer-events:none;transition:transform .32s cubic-bezier(.2,.8,.2,1),opacity .25s}
  .ts-app .ts-bnav.hide{transform:translateY(calc(100% + 36px));opacity:0}
  .ts-app .ts-bnav-in{pointer-events:auto;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:end;max-width:480px;margin:0 auto;padding:7px 6px;background:color-mix(in srgb,var(--card) 94%,transparent);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);border:1px solid var(--line);border-radius:26px;box-shadow:0 16px 40px -12px rgba(13,21,48,.42),0 2px 6px rgba(13,21,48,.06)}
  .ts-app .ts-bn{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;min-height:52px;padding:7px 2px 6px;border-radius:18px;color:var(--mut);font-size:11px;font-weight:700;line-height:1.1;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:color .15s,background .15s}
  .ts-app .ts-bn svg{display:block;width:22px;height:22px;transition:transform .2s}
  .ts-app .ts-bn:active svg{transform:scale(.88)}
  .ts-app .ts-bn.on{color:var(--pri);background:var(--tint)}
  .ts-app .ts-bn.on svg{stroke-width:2.3}
  .ts-app .ts-bn span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .ts-app .ts-bn-c{background:transparent!important;color:var(--ink2);padding-top:0}
  .ts-app .ts-bn-c i{display:grid;place-items:center;width:54px;height:54px;margin-top:-26px;border-radius:50%;background:var(--acc);color:var(--onacc,#fff);border:4px solid var(--card);box-shadow:0 10px 22px -6px color-mix(in srgb,var(--acc) 70%,transparent);transition:transform .2s}
  .ts-app .ts-bn-c:active i{transform:scale(.92)}
  .ts-app .ts-bn-c.on{color:var(--pri)}
  .ts-app .ts-bn-c.on i{background:var(--pri);box-shadow:0 10px 22px -6px color-mix(in srgb,var(--pri) 70%,transparent)}
  .ts-app .ts-bn-c svg{width:24px;height:24px}
  .ts-app .ts-bnav-sp{display:block;height:calc(var(--navh) + 34px + env(safe-area-inset-bottom))}
  .ts-app .ts-bnav-sp.f{background:#020a3a}
  .ts-app:not(.ts-product) .ts-sp{left:12px;right:auto;bottom:calc(var(--navh) + 30px + env(safe-area-inset-bottom))}
  .ts-app:not(.ts-product) .ts-sp .ts-spc.compact{padding-top:6px;padding-bottom:6px}
  body:has(.ts-ov) .ts-bnav{opacity:0;pointer-events:none}
}
@media(max-width:820px) and (prefers-reduced-motion:reduce){.ts-app .ts-bnav{transition:none}}