:root{--hijau:#06392f;--hijau-2:#0b4a3c;--hijau-3:#12634f;--hijau-tinta:#042a22;--oranye:#f29a1f;--wa:#1faf5a;--wa-tua:#178a46;--kertas:#f5f7f3;--putih:#fff;--garis:#dce3dc;--tinta:#0d1f1a;--tinta-2:#46574f;--tinta-3:#74837b;--mudah:cubic-bezier(.2,.7,.2,1)}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--hijau-tinta);color:var(--tinta);margin:0;font:15px/1.6 Plus Jakarta Sans,system-ui,-apple-system,Segoe UI,sans-serif}h2{letter-spacing:-.01em;text-wrap:balance;margin:0;font:700 19px/1.2 Outfit,Plus Jakarta Sans,system-ui,sans-serif}p{margin:0}:focus-visible{outline:3px solid var(--oranye);outline-offset:3px;border-radius:8px}svg{flex:none}[hidden]{display:none!important}.bio{background:var(--kertas);max-width:480px;min-height:100vh;margin:0 auto;box-shadow:0 0 80px #00000059}.bio-kepala{padding:calc(36px + env(safe-area-inset-top,0px)) 20px 30px;text-align:center;color:#fff;background:radial-gradient(120% 90% at 85% 0%,#0f5544 0%,var(--hijau) 50%,var(--hijau-tinta) 100%);position:relative;overflow:hidden}.bio-kepala:before{content:"";pointer-events:none;border:1px dashed #ffffff29;border-radius:50%;width:340px;height:340px;position:absolute;top:-170px;right:-140px}.bio-kepala img{width:auto;height:56px;margin:0 auto 16px;display:block}.bio-kepala p{color:#fffc;font-size:14.5px}.bio-angka{flex-wrap:wrap;justify-content:center;gap:8px;margin:20px 0 0;padding:0;list-style:none;display:flex}.bio-angka li{color:#ffffffbf;background:#ffffff14;border-radius:12px;padding:8px 12px;font-size:11.5px;line-height:1.25;box-shadow:inset 0 0 0 1px #ffffff24}.bio-angka b{color:var(--oranye);font:700 17px/1.1 Outfit,sans-serif;display:block}.bio-isi{gap:14px;margin-top:-6px;padding:16px 16px 8px;display:grid}.bio-bagian{background:var(--putih);box-shadow:0 1px 0 var(--garis),0 12px 30px -24px #06392f80;border-radius:20px;padding:20px 16px}.bio-sub{color:var(--tinta-2);margin-top:4px;font-size:13.5px}.bio-cs{gap:10px;margin:16px 0 0;padding:0;list-style:none;display:grid}.bio-cs a{color:var(--tinta);background:var(--kertas);box-shadow:inset 0 0 0 1px var(--garis);transition:transform .2s var(--mudah),box-shadow .2s,background .2s;border-radius:16px;align-items:center;gap:12px;padding:12px;text-decoration:none;display:flex}.bio-cs a:hover{box-shadow:inset 0 0 0 1.5px var(--hijau-3);background:#eef3ec;transform:translateY(-1px)}.bio-cs a:active{transform:scale(.99)}.bio-wa{background:var(--wa);color:#fff;border-radius:12px;flex:none;place-items:center;width:42px;height:42px;display:grid}.bio-wa svg{width:22px;height:22px}.bio-cs-teks{flex-direction:column;flex:1;min-width:0;display:flex}.bio-cs-teks b{font:700 15.5px/1.25 Outfit,sans-serif}.bio-cs-teks span{color:var(--tinta-3);margin-top:2px;font-size:12.5px;line-height:1.45}.bio-panah{width:18px;height:18px;color:var(--tinta-3)}.bio-form{grid-template-columns:1fr 1fr;gap:10px;margin-top:16px;display:grid}.bio-form label{color:var(--tinta-2);align-content:end;gap:6px;min-width:0;font-size:13px;font-weight:600;display:grid}.bio-form label i{color:var(--tinta-3);font-style:normal;font-weight:500}.bio-form input{border:1px solid var(--garis);background:var(--kertas);width:100%;min-width:0;height:46px;color:var(--tinta);appearance:none;border-radius:12px;padding:0 12px;font:500 15px Plus Jakarta Sans,sans-serif}.bio-form input:focus{border-color:var(--hijau-3);background:#fff;outline:none;box-shadow:0 0 0 3px #12634f26}.bio-form .bio-tombol,.bio-galat{grid-column:1/-1}.bio-tombol{background:var(--hijau);color:#fff;cursor:pointer;height:48px;transition:background .2s,transform .2s var(--mudah);border:0;border-radius:14px;justify-content:center;align-items:center;gap:8px;font:700 15px Plus Jakarta Sans,sans-serif;text-decoration:none;display:inline-flex}.bio-tombol:hover{background:var(--hijau-3)}.bio-tombol:active{transform:scale(.99)}.bio-tombol svg{width:20px;height:20px}.bio-galat{color:#b4231a;font-size:13px}.bio-hasil{border-top:1px dashed var(--garis);animation:muncul .45s var(--mudah) both;gap:12px;margin-top:16px;padding-top:16px;display:grid}.bio-hasil ol{gap:8px;margin:0;padding:0;list-style:none;display:grid}.bio-hasil li{background:var(--kertas);border-radius:14px;grid-template-columns:auto 1fr;grid-template-areas:"hari sisa""tgl tgl";gap:2px 10px;padding:12px 14px;display:grid}.bio-hasil li:first-child{background:#fff4e2;box-shadow:inset 0 0 0 1px #f6d7a6}.bio-hari{letter-spacing:.08em;text-transform:uppercase;color:var(--hijau-3);grid-area:hari;font-size:12px;font-weight:700}.bio-hasil li b{grid-area:tgl;font:700 16.5px/1.3 Outfit,sans-serif}.bio-sisa{color:var(--hijau-3);grid-area:sisa;justify-self:end;font-size:12px;font-weight:600}.bio-sisa.kini{color:var(--oranye)}.bio-sisa.lewat{color:var(--tinta-3)}.bio-catatan{color:var(--tinta-2);font-size:12.5px}.bio-tombol-wa{background:var(--wa)}.bio-tombol-wa:hover{background:var(--wa-tua)}@keyframes muncul{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.bio-testi{gap:10px;margin:14px 0 0;padding:0;list-style:none;display:grid}.bio-testi li{background:var(--kertas);border-radius:14px;padding:14px}.bio-testi p{color:var(--tinta);font-size:13.5px}.bio-testi span{color:var(--tinta-3);margin-top:6px;font-size:12px;font-weight:600;display:block}.bio-lain{gap:8px;display:grid}.bio-lain a{background:var(--putih);box-shadow:inset 0 0 0 1px var(--garis);color:var(--hijau);border-radius:14px;justify-content:space-between;align-items:center;padding:14px 16px;font-size:14px;font-weight:600;text-decoration:none;display:flex}.bio-lain a:hover{box-shadow:inset 0 0 0 1.5px var(--hijau-3)}.bio-lain svg{width:16px;height:16px}.bio-kaki{padding:20px 16px calc(28px + env(safe-area-inset-bottom,0px));text-align:center;color:var(--tinta-3);font-size:12px}@media (max-width:360px){.bio-form{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}