@layer components{.cover.has-img:after{display:none}[dir=rtl] .cover-cat{left:auto;right:12px}[dir=rtl] .cover-dari{left:12px;right:auto}.doc-paper,.rules-paper{--ob-accent:#3b82f6;--ob-accent-text:#2563eb;--ob-accent-dim:#3b82f61a;--ob-ok-text:#047857}.blk.sec.tf-band{padding-bottom:0;overflow:hidden}.tf-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:clamp(32px,5vw,48px);display:grid}.tf-copy{justify-items:start;gap:20px;min-width:0;padding-bottom:clamp(56px,7vw,96px);display:grid}.tf-copy .hero-h{max-width:15ch}.tf-type{max-width:100%;display:inline-block;position:relative}.tf-type:after{content:"";background:var(--ob-accent);inset-inline-end:-6px;width:3px;animation:1s steps(2,end) 2.5s 6 both tf-caret;position:absolute;top:10%;bottom:10%}.tf-band .tf-type{clip-path:inset(0 100% 0 0);animation:tf-type 1.6s steps(var(--n,13)).9s forwards}[dir=rtl] .tf-band .tf-type{clip-path:inset(0 0 0 100%);animation-name:tf-type-rtl}.tf-desk{min-width:0;height:520px;position:relative}.tf-sheets{justify-items:center;display:grid;position:absolute;inset:0}.tf-under{--rot:-4deg;background:var(--ob-raised-2);border:1px solid var(--ob-line);width:380px;height:520px;transform:rotate(var(--rot));animation:tf-up 1.3s var(--ob-ease).1s both;border-radius:6px;margin-inline-start:-52px;position:absolute;bottom:-40px}.tf-paper{--ink:#172033;--soft:#5b6475;--rule:#d9dde4;--edge:#c7ccd5;--pen:#1d4ed8;width:410px;height:560px;color:var(--ink);box-shadow:var(--ob-shadow-bezel);animation:tf-up 1.3s var(--ob-ease).25s both;background:#fbfaf7;border-radius:6px;align-content:start;gap:14px;padding:34px 36px;display:grid;position:absolute;bottom:-60px}.tf-pl{font:600 10.5px var(--ob-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--soft);justify-content:space-between;gap:12px;display:flex}.tf-t{background:var(--ink);opacity:.85;border-radius:3px;width:62%;height:12px;display:block}.tf-l{background:var(--rule);transform-origin:0;border-radius:3px;height:7px;display:block}[dir=rtl] .tf-l{transform-origin:100%}.tf-paper[dir=ltr] .tf-l{transform-origin:0}.tf-gap{height:4px;display:block}.tf-desk.in .tf-l{animation:tf-line .8s var(--ob-ease)both;animation-delay:calc(1s + var(--k,0)*90ms)}.tf-sig{grid-template-columns:1fr 1fr;gap:22px;margin-top:14px;display:grid}.tf-sig.one{grid-template-columns:minmax(0,.6fr);justify-content:end}.tf-sigbox{gap:6px;display:grid}.tf-sigbox span{font:600 9.5px var(--ob-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--soft)}.tf-sigbox svg{border-bottom:1.5px solid var(--ink);width:100%;height:46px;overflow:visible}.tf-sigbox path{fill:none;stroke:var(--pen);stroke-width:2.2px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:260;stroke-dashoffset:0}.tf-desk.in .tf-sigbox path{animation:tf-sign 6s var(--ob-ease)var(--d,2s)infinite both}.tf-rules{gap:12px;margin:6px 0 0;padding:0;list-style:none;display:grid}.tf-rules li{grid-template-columns:18px 1fr;align-items:center;gap:10px;display:grid}.tf-rules b{background:var(--ink);color:#fbfaf7;width:18px;height:18px;font:700 9.5px var(--ob-mono);border-radius:50%;place-items:center;display:grid}.tf-card{text-align:center;justify-items:center;width:360px;height:500px;bottom:-40px}.tf-card .tf-pl{justify-self:stretch}.tf-wifi{width:64px;height:64px;color:var(--pen);background:#e8eefc;border-radius:50%;place-items:center;margin-top:8px;display:grid}.tf-wifi svg{width:30px;height:30px}.tf-field{justify-items:center;gap:8px;width:100%;display:grid}.tf-field span{font:600 10px var(--ob-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--soft)}.tf-field .tf-l{transform-origin:50%;height:10px}.tf-qr{grid-template-columns:repeat(7,14px);gap:3px;margin-top:6px;display:grid}.tf-qr i{border-radius:2px;width:14px;height:14px}.tf-qr i.on{background:var(--ink)}.tf-desk.in .tf-qr i.on{animation:tf-cell .4s var(--ob-ease)both;animation-delay:calc(1.2s + var(--q,0)*25ms)}.tf-ledger{gap:14px;margin-top:8px;display:grid}.tf-ledger>div{border-bottom:1px dashed var(--edge);justify-content:space-between;align-items:center;gap:16px;padding-bottom:12px;display:flex}.tf-ledger .tf-l.v{background:var(--edge)}.tf-ledger>.tf-total{border-bottom:2px solid var(--ink)}.tf-total b{font:700 11px var(--ob-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}.tf-l.acc{background:var(--pen);height:12px}.tf-bars{align-items:flex-end;gap:10px;height:110px;margin-top:18px;display:flex}.tf-bars i{height:var(--h);transform-origin:50% 100%;background:#c9d6f5;border-radius:4px 4px 0 0;flex:1}.tf-bars i:last-child{background:var(--pen)}.tf-desk.in .tf-bars i{animation:tf-bar .9s var(--ob-ease)both;animation-delay:calc(1.4s + var(--k,0)*90ms)}.tf-dari{z-index:3;inset-inline-end:0;animation:1s cubic-bezier(.2,.8,.2,1) 1.6s both tf-peek;position:absolute;bottom:40px}[dir=rtl] .tf-dari{animation-name:tf-peek-rtl}@keyframes tf-up{0%{opacity:0;transform:translateY(120px)rotate(var(--rot,0deg))}to{opacity:1;transform:translateY(0)rotate(var(--rot,0deg))}}@keyframes tf-type{to{clip-path:inset(0 -12px 0 0)}}@keyframes tf-type-rtl{to{clip-path:inset(0 0 0 -12px)}}@keyframes tf-caret{50%{opacity:0}}@keyframes tf-line{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes tf-sign{0%{stroke-dashoffset:260px}30%,85%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:0;opacity:0}}@keyframes tf-cell{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes tf-bar{0%{transform:scaleY(0)}to{transform:scaleY(1)}}@keyframes tf-peek{0%{opacity:0;translate:30px}to{opacity:1;translate:0}}@keyframes tf-peek-rtl{0%{opacity:0;translate:-30px}to{opacity:1;translate:0}}@media (max-width:900px){.tf-grid{grid-template-columns:1fr}.tf-copy{padding-bottom:8px}.tf-desk{height:340px}.tf-paper{width:320px;height:440px;padding:26px 28px}.tf-card{width:300px}.tf-under{width:300px;height:420px}}@media (max-width:520px){.tf-desk{height:300px}.tf-paper{width:280px}.tf-dari{bottom:20px}}@media (prefers-reduced-motion:reduce){.tf-band .tf-type{clip-path:none;animation:none}.tf-type:after{display:none}.tf-under,.tf-paper,.tf-dari,.tf-desk.in .tf-l,.tf-desk.in .tf-sigbox path,.tf-desk.in .tf-qr i.on,.tf-desk.in .tf-bars i{animation:none}}.up-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:clamp(36px,6vw,64px);display:grid}.up-desk{justify-self:center;width:100%;max-width:470px;height:500px;position:relative}.up-sheets{position:absolute;inset:0}.up-sheet{background:var(--ob-raised);border:1px solid var(--ob-line);box-shadow:var(--ob-shadow-card);border-radius:12px;position:absolute;inset:20px 40px 40px 60px}.up-sheet.s3{transform:translate(34px,-14px)rotate(5deg)}.up-sheet.s2{transform:translate(16px,-6px)rotate(2.5deg)}[dir=rtl] .up-sheet.s3{transform:translate(-34px,-14px)rotate(-5deg)}[dir=rtl] .up-sheet.s2{transform:translate(-16px,-6px)rotate(-2.5deg)}.up-sheet.s1{background:var(--ob-bg);align-content:start;gap:12px;padding:28px 28px 22px;display:grid;overflow:hidden}.up-k{font:500 10px var(--ob-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ob-faint)}.up-t{letter-spacing:-.02em;font-size:1.06rem;font-weight:700;line-height:1.25}.up-ln{background:var(--ob-raised-2);transform-origin:0;border-radius:4px;height:8px;display:block}[dir=rtl] .up-ln{transform-origin:100%}.up-gap{height:2px;display:block}.up-sig{grid-template-columns:1fr 1fr;gap:18px;margin-top:10px;display:grid}.up-sig span{font:500 9.5px var(--ob-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ob-faint);gap:6px;display:grid}.up-sig i{border-bottom:1px solid var(--ob-line-strong);height:28px;display:block}.up-stamp{border:2px solid var(--ob-ok-ring);color:var(--ob-ok-text);font:700 12px var(--ob-mono);letter-spacing:.14em;text-transform:uppercase;inset-inline-end:28px;border-radius:10px;padding:8px 14px;position:absolute;bottom:68px;transform:rotate(-8deg)}.up-stamp:before{content:"";border:1px solid var(--ob-ok-ring);border-radius:7px;position:absolute;inset:3px}.up-dari{z-index:2;inset-inline-start:-18px;justify-items:center;gap:6px;display:grid;position:absolute;bottom:-6px}.up-desk.in .up-sheet.s3{animation:up-fan3 7s var(--ob-ease)infinite}.up-desk.in .up-sheet.s2{animation:up-fan2 7s var(--ob-ease)infinite}[dir=rtl] .up-desk.in .up-sheet.s3{animation-name:up-fan3-rtl}[dir=rtl] .up-desk.in .up-sheet.s2{animation-name:up-fan2-rtl}.up-desk.in .up-ln{animation:up-write 7s var(--ob-ease)infinite;animation-delay:calc(var(--k,0)*.11s)}.up-desk.in .up-stamp{animation:up-stamp 7s var(--ob-ease)infinite}@keyframes up-fan3{0%,to{transform:translate(34px,-14px)rotate(5deg)}50%{transform:translate(40px,-18px)rotate(6.5deg)}}@keyframes up-fan2{0%,to{transform:translate(16px,-6px)rotate(2.5deg)}50%{transform:translate(20px,-9px)rotate(3.4deg)}}@keyframes up-fan3-rtl{0%,to{transform:translate(-34px,-14px)rotate(-5deg)}50%{transform:translate(-40px,-18px)rotate(-6.5deg)}}@keyframes up-fan2-rtl{0%,to{transform:translate(-16px,-6px)rotate(-2.5deg)}50%{transform:translate(-20px,-9px)rotate(-3.4deg)}}@keyframes up-write{0%,4%{transform:scaleX(0)}16%,92%{transform:scaleX(1)}to{opacity:.4;transform:scaleX(1)}}@keyframes up-stamp{0%,40%{opacity:0;transform:rotate(-8deg)scale(1.8)}46%{opacity:1;transform:rotate(-8deg)scale(.94)}50%,92%{opacity:1;transform:rotate(-8deg)scale(1)}to{opacity:0;transform:rotate(-8deg)scale(1)}}.up-copy{justify-items:start;gap:22px;min-width:0;display:grid}.up-led{border-top:1px solid var(--ob-line);width:100%;margin:0;padding:0;list-style:none;display:grid}.up-row{border-bottom:1px solid var(--ob-line);transition:background .3s var(--ob-ease);grid-template-columns:44px 1fr;gap:14px;padding:16px 0;display:grid}.up-row:hover{background:var(--ob-stripe)}.up-row .n{font:500 12px var(--ob-mono);color:var(--ob-accent-text);padding-top:3px}.up-row b{letter-spacing:-.01em;font-size:15.5px;display:block}.up-row p{color:var(--ob-muted);margin-top:2px;font-size:14px}.up-more{min-height:36px;color:var(--ob-accent-text);align-items:center;gap:6px;font-size:13.5px;font-weight:600;display:inline-flex}.up-more svg{width:14px;height:14px;transition:translate .4s var(--ob-ease)}.up-more:hover svg{translate:3px}[dir=rtl] .up-more:hover svg{translate:-3px}.up-proof{font:500 12px var(--ob-mono);color:var(--ob-faint);flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0;padding:0;list-style:none;display:flex}.up-proof li{align-items:center;gap:6px;display:inline-flex}.up-proof svg{width:13px;height:13px;color:var(--ob-ok-text)}@media (max-width:900px){.up-grid{grid-template-columns:1fr}.up-desk{max-width:400px;height:380px}}@media (max-width:520px){.up-desk{height:320px}.up-sheet{inset:16px 24px 32px 40px}.up-sheet.s1{gap:10px;padding:20px 20px 16px}.up-dari{inset-inline-start:-8px}}@media (prefers-reduced-motion:reduce){.up-desk.in .up-sheet.s3,.up-desk.in .up-sheet.s2,.up-desk.in .up-ln,.up-desk.in .up-stamp{animation:none}.up-row,.up-more svg{transition:none}}}
