/* PWA screen layout: native selectors copied from the original CSS. */
/* original-css-01.css */
html[data-pwa-layout="native"],html[data-pwa-layout="native"] body{height:100%;overflow:hidden}
html[data-pwa-layout="native"] .app{height:100%;max-height:100%;width:100%;border:0}
html[data-pwa-layout="native"] body{height:100%;padding:0;overflow:hidden}
html[data-pwa-layout="native"] .app{height:100%;max-height:100%;padding:0}
html[data-pwa-layout="native"] .home-create-form,html[data-pwa-layout="native"] .home-contact-picker{padding-top:0}
html[data-pwa-layout="native"] .app>.overlay.home-editor-overlay{top:0}
html[data-pwa-layout="native"] .app{max-width:none}
html[data-pwa-layout="native"] .app[data-page="服务"]{min-height:0;height:100%;padding:0}
html[data-pwa-layout="native"] .app{--screen-bottom-inset:var(--native-bottom-inset,0px);--screen-top-inset:0px}
html[data-pwa-layout="native"] .app[data-page="分付"]{--split-external-top:var(--native-top-inset,0px)}
html[data-pwa-layout="native"] .app{height:var(--app-height,100%);max-height:none}
html[data-pwa-layout="native"] .app[data-page="聊天"]{height:100%;max-height:100%}
html[data-pwa-layout="native"] .app[data-page="好友朋友圈"]{--cp-external-top:var(--native-top-inset,64px)}
html[data-pwa-layout="native"] .lc-screen{--lc-top-inset:var(--native-top-inset,0px)}
/* original-css-02.css */
html[data-pwa-layout="native"] .app:is([data-page="设置"],[data-page="发现"],[data-page="微信"],[data-page="聊天"],[data-page="联系人资料"],[data-page="好友朋友圈"])>.header{margin-top:-3.095238cqw}
html[data-pwa-layout="native"] .app[data-page="好友朋友圈"]{--cp-external-top:calc(var(--native-top-inset,0px) + var(--pwa-system-top-gap,0px))}
/* original-css-03.css */
html[data-pwa-layout="native"] .nc-pay-editor>.nc-header,html[data-pwa-layout="native"] .nc-success>.nc-header,html[data-pwa-layout="native"] .wf-layer[data-funding-kind="recharge"] .wf-header,html[data-pwa-layout="native"] .pf-outgoing>.pf-transfer-head{margin-top:-3.095238cqw}
html[data-pwa-layout="native"] .nc-processing>div,html[data-pwa-layout="native"] .wf-loading[data-payment="yes"]>div,html[data-pwa-layout="native"] .pf-detail-loading>div{transform:translateY(calc(-.5 * var(--native-top-inset,68px)))!important}
html[data-pwa-layout="native"] .pf-packet-reference.pf-payment-scroll-page .packet-detail-top{height:14.761905cqw}
html[data-pwa-layout="native"] .pf-packet-reference.pf-payment-scroll-page .packet-detail-top:before{height:calc(14.761905cqw + var(--pf-header-pull,0px))}
html[data-pwa-layout="native"] .pf-packet-reference .packet-detail-nav{transform:translateY(-3.095238cqw)}
html[data-pwa-layout="native"] .pf-packet-reference .pf-payment-scroll{top:14.761905cqw!important}
/* original-css-06.css */
html[data-pwa-layout="native"] .app[data-page]>.md-detail-page .cp-editor-nav{height:7.142857cqw;min-height:7.142857cqw}
/* original-css-09.css */
html[data-pwa-layout="native"] .app:is([data-page="零钱通"],[data-page="分付"]){--finance-top:var(--native-top-inset,0px)}
/* original-css-11.css */
html[data-pwa-layout="native"] .app[data-page="微信"]>.header>button[data-action="menu"]>img{transform:translateY(.952381cqw)}
/* original-css-14.css */
html[data-pwa-layout="native"] .app[data-page="零钱通"]>.wf-layer[data-funding-kind^="fund-"]>.wf-screen{top:var(--native-top-inset,62px)}
html[data-pwa-layout="native"] .app[data-page="零钱通"]>.wf-layer[data-funding-kind="fund-in"]>.wf-screen>.wf-header{margin-top:-1.904762cqw}

/* UIKit normally places this screen below its top safe area. The PWA frame
   supplies that same rectangle; individual pages retain their original rules. */
html[data-pwa-layout="native"],html[data-pwa-layout="native"] body {
  width:100%;height:100%;margin:0;padding:0;overflow:hidden;
}
html[data-pwa-layout="native"] #app:not(.navigation-screen) {
  position:fixed;left:50%;top:var(--viewport-top,0px);
  width:100%;max-width:none;height:var(--pwa-canvas-height,var(--app-height,100%));max-height:none;
  min-height:0;margin:0;padding:0;transform:translateX(-50%);
  border:0;border-radius:0;box-shadow:none;
}
/* Only audio-call artwork: give the system edge sampler the same solid colour
   as the call's existing base, then blend into its original avatar backdrop.
   Keep this behind every control; it changes no call geometry or video pixels. */
html[data-pwa-layout="native"] .lc-screen.audio .lc-audio-shade {
  background:linear-gradient(180deg,#3b3b39 0px,#3b3b39 16px,rgba(59,59,57,0) 64px),radial-gradient(ellipse 32% 34% at 50% 40%,rgba(95,43,14,.24),transparent),linear-gradient(180deg,transparent 40%,rgba(24,25,30,.15) 56%,rgba(24,25,30,.6) 74%,rgba(24,25,30,.65));
}
/* The background grows above the former content rectangle. Existing call
   formulas use (1 - percentage) * top inset, so the negative extension keeps
   every avatar, label and top button at its previous physical-screen position.
   Bottom controls already stay anchored to the same physical bottom edge. */
html[data-pwa-layout="native"][data-pwa-edge-to-edge] .lc-screen {
  --lc-top-inset:calc(-1 * var(--pwa-call-top-extension,0px))!important;
}
/* A bottom-only canvas extension must not move the existing percentage-based
   call header/avatar/status positions. Bottom controls follow the true bottom. */
html[data-pwa-layout="native"][data-pwa-bottom-extended] .lc-screen .lc-person {
  top:calc(27.522% - .72478 * var(--lc-top-inset) - .27522 * var(--pwa-bottom-extension));
}
html[data-pwa-layout="native"][data-pwa-bottom-extended] .lc-screen.video .lc-person {
  top:calc(15.2412% - .847588 * var(--lc-top-inset) - .152412 * var(--pwa-bottom-extension));
}
html[data-pwa-layout="native"][data-pwa-bottom-extended] .lc-screen .lc-status {
  top:calc(61.4035% - .385965 * var(--lc-top-inset) - .614035 * var(--pwa-bottom-extension));
}

/* The root canvas is shorter in affected iOS shells. Keep tab controls inside
   it; only the root background supplies the otherwise exposed bottom colour.
   The existing body, top tint, navigation and theme colours stay unchanged. */
html[data-pwa-layout="native"][data-pwa-bottom-layout-clipped]:has(#app>.tabs) {
  background-color:var(--pwa-safe-bottom,#f7f7f7)!important;
}

/* Match tab presence directly, before the viewport adapter's next animation
   frame. No extra frame event or status-colour refresh is introduced. */
html[data-pwa-layout="native"][data-pwa-bottom-layout-clipped] #app:not(.navigation-screen):has(>.tabs) {
  height:var(--app-height,100%);
}

/* Packet detail alone: continue its existing #fcfcfc background over the
   reserved bottom safe area. An outer shadow changes no content geometry. */
html[data-pwa-layout="native"] #app .packet-detail-page.pf-packet-reference {
  box-shadow:0 var(--native-bottom-inset,0px) 0 0 #fcfcfc;
}
