/* iframe screen shell — calibrates the real app chrome inside a phone-sized iframe */
html, body { margin: 0; background: #1a1a1a; }
body { font-family: "Noto Sans JP", sans-serif; -webkit-font-smoothing: antialiased; overflow-x: hidden; scrollbar-width: none; }
body::-webkit-scrollbar { display: none; }

/* fake iOS status bar so the app logo isn't clipped at the very top */
.os-status {
  position: fixed; top: 0; left: 0; right: 0; z-index: 60; height: 36px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 9px 24px 0; background: #1a1a1a; color: #fff;
  font-family: "Inter", system-ui, sans-serif; font-size: 14px; font-weight: 600; letter-spacing: .01em;
}
.os-status .os-icons { display: flex; align-items: center; gap: 6px; }
.os-status .os-batt { display: inline-flex; align-items: center; gap: 3px; }
.os-status .os-batt-n { font-size: 13px; font-weight: 600; }

/* chrome pinned to the iframe viewport, content offset below status bar + header */
.iznm-header { position: fixed; top: 36px; left: 0; right: 0; z-index: 50; padding-top: 0; }
.iznm-footer-nav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 50; }
.iznm-wrap { padding: calc(36px + var(--iznm-header-height, 56px) + 14px) 18px 88px; max-width: none; box-sizing: border-box; }