.pf .hc{width:100%;max-width:380px;margin-inline:auto;--ph:144px}.pf .hc-switch{position:relative;display:grid;grid-template-columns:1fr 1fr;width:min(100%,260px);padding:4px;margin:0 auto 16px;background:var(--bt-paper);border-radius:999px}.pf .hc-switch button{position:relative;z-index:1;min-height:44px;padding:0 12px;border:0;background:none;border-radius:999px;font:inherit;font-weight:600;font-size:calc(15.5px * var(--pf-k));line-height:1.2;white-space:nowrap;color:var(--bt-muted);cursor:pointer;transition:color .2s ease,transform .16s var(--bt-ease-out);touch-action:manipulation;-webkit-tap-highlight-color:transparent}.pf .hc-switch button[aria-pressed=true]{color:#fff}.pf .hc-switch button:active{transform:scale(.97)}.pf .hc-switch button:focus-visible{outline-offset:2px;border-radius:999px}@media (hover:hover) and (pointer:fine){.pf .hc-switch button:not([aria-pressed=true]):hover{color:var(--bt-ink)}}.pf .hc-pill{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--hw-dark);transition:transform .32s var(--bt-ease-out)}.pf .hc[data-side=hyva] .hc-pill{transform:translateX(100%)}.pf .hc-stage{display:grid}.pf .hc-face{grid-area:1/1;min-width:0;margin:0;transition:opacity .28s var(--bt-ease-out),transform .28s var(--bt-ease-out)}.pf .hc-face:not(.is-on){opacity:0;transform:translateY(6px);pointer-events:none}.pf .hc-face figcaption{margin-top:12px;text-align:center;font-size:calc(14.5px * var(--pf-k));line-height:1.45;color:var(--bt-muted)}.pf .hc-face figcaption b{color:var(--bt-ink);font-weight:600}.pf .hc-page{position:relative;overflow:hidden;display:grid;gap:12px;padding:16px;background:#fff;border:1px solid var(--bt-line-warm);border-radius:14px;box-shadow:0 18px 44px -28px rgba(26,18,16,.35)}.pf .hc-page i{display:block}.pf .hc-bar{position:absolute;top:0;left:0;right:0;height:3px;background:var(--bt-orange);transform:scaleX(0);transform-origin:left;opacity:0}.pf .hc-head{display:flex;align-items:center;gap:8px;height:22px}.pf .hc-head i{height:10px;border-radius:3px;background:var(--bt-ink)}.pf .hc-head i:first-child{width:56px}.pf .hc-head i:nth-child(2){margin-left:auto}.pf .hc-head i:nth-child(2),.pf .hc-head i:nth-child(3){width:18px;background:var(--bt-line-warm)}.pf .hc-photo{height:calc(var(--ph) - 12px);border-radius:9px;background:linear-gradient(135deg,var(--bt-paper),#ebe3da)}.pf .hc-below{display:grid;gap:12px}.pf .hc-title{display:grid;gap:7px}.pf .hc-title i{height:12px;border-radius:3px;background:var(--bt-ink)}.pf .hc-title i:first-child{width:82%}.pf .hc-title i:last-child{width:52%}.pf .hc-price{width:30%;height:16px;border-radius:3px;background:var(--bt-orange-dk)}.pf .hc-btn{width:62%;height:36px;border-radius:var(--pf-r,8px);background:var(--bt-orange)}.pf .hc-text{display:grid;gap:7px}.pf .hc-text i{height:7px;border-radius:3px;background:var(--bt-line-warm)}.pf .hc-text i:nth-child(2){width:92%}.pf .hc-text i:nth-child(3){width:68%}.pf .hc-code{display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding-top:12px;border-top:1px solid var(--bt-line-warm)}.pf .hc-code span{margin-right:6px;font-family:var(--font-jb-mono),monospace;font-size:11px;line-height:1;color:var(--bt-muted)}.pf .hc-code i{width:16px;height:8px;border-radius:2px;background:var(--bt-muted);opacity:.55}.pf .hc-face--hyva .hc-code i{background:var(--bt-orange);opacity:1}@media (prefers-reduced-motion:no-preference){html.js .pf .hc:not(.is-run) .hc-face--luma :is(.hc-b,.hc-code i){opacity:0}html.js .pf .hc.is-run .hc-face--luma .hc-bar{animation:hc-bar 2.7s cubic-bezier(.3,.1,.3,1) both}html.js .pf .hc.is-run .hc-face--luma .hc-b{animation:hc-in .26s var(--bt-ease-out) both;animation-delay:var(--t)}html.js .pf .hc.is-run .hc-face--luma .hc-head{--t:250ms}html.js .pf .hc.is-run .hc-face--luma .hc-title{--t:650ms}html.js .pf .hc.is-run .hc-face--luma .hc-price{--t:900ms}html.js .pf .hc.is-run .hc-face--luma .hc-photo{--t:1400ms}html.js .pf .hc.is-run .hc-face--luma .hc-btn{--t:1850ms}html.js .pf .hc.is-run .hc-face--luma .hc-text{--t:2300ms}html.js .pf .hc.is-run .hc-face--luma .hc-below{animation:hc-shift 1.52s both}html.js .pf .hc.is-run .hc-face--luma .hc-code i{animation:hc-in .2s var(--bt-ease-out) both;animation-delay:calc(.2s + var(--i) * .19s)}html.js .pf .hc[data-side=hyva] .hc-face--hyva .hc-page{animation:hc-in .22s var(--bt-ease-out) both}}@keyframes hc-in{0%{opacity:0}to{opacity:1}}@keyframes hc-bar{0%{opacity:1;transform:scaleX(0)}90%{opacity:1;transform:scaleX(1)}to{opacity:0;transform:scaleX(1)}}@keyframes hc-shift{0%,91%{transform:translateY(calc(-1 * var(--ph)));animation-timing-function:var(--bt-ease-out)}to{transform:none}}html:not(.js) .pf .hc{max-width:620px}html:not(.js) .pf .hc-switch{display:none}html:not(.js) .pf .hc-stage{grid-template-columns:1fr 1fr;gap:16px}html:not(.js) .pf .hc-face,html:not(.js) .pf .hc-face:not(.is-on){grid-area:auto;opacity:1;transform:none;pointer-events:auto}@media (prefers-reduced-motion:reduce){.pf .hc-face,.pf .hc-pill,.pf .hc-switch button{transition:none}.pf .hc-face:not(.is-on){transform:none}}.pf .hc-switch{width:min(100%,360px)}.pf .hc-switch button{padding:0 8px;font-size:clamp(13px,1.1vw,14.5px)}@media (max-width:480px){.pf .hc-switch{width:100%}.pf .hc-switch button{padding:0 4px;font-size:12.5px;letter-spacing:-.01em}}