/* Every device remains intact; only the mobile presentation changes. */
.phone-detail-dialog:not([open]){display:none}
@media(max-width:760px){
  .features-page [id^="feature-"],.features-page #capture,.features-page #your-way{scroll-margin-top:calc(84px + env(safe-area-inset-top,0px))}
  .mobile-phone-story{gap:24px!important;padding-block:36px!important}
  .features-page .mobile-phone-story .screen-copy h3{font-size:clamp(30px,8.6vw,36px);line-height:1.12;margin:12px 0}
  .features-page .mobile-phone-story .screen-intro{font-size:1rem;line-height:1.55;margin:0;max-width:none}
  .mobile-phone-story .screen-copy>.screen-loupe{display:none}
  .mobile-phone-unit{min-width:0;width:100%}
  .mobile-phone-story .screen-art{padding:0!important;gap:10px;isolation:isolate}
  .mobile-phone-story .screen-phone{width:min(100%,300px,30svh)!important;max-width:100%;flex:none;margin:0!important;aspect-ratio:2187/4219}
  .mobile-phone-story .screen-original{display:block;width:100%;height:auto}
  .features-page .mobile-phone-story .mobile-phone-open{position:absolute;inset:0;z-index:2;width:100%;height:100%;padding:0;border:0;border-radius:14%;background:transparent;cursor:zoom-in}
  .features-page .mobile-phone-story .mobile-phone-open:hover{background:transparent;border:0}
  .features-page .mobile-phone-story .mobile-phone-open:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}
  .mobile-phone-story .screen-halo{inset:8% 0 4%;background:radial-gradient(ellipse,#17425670,transparent 68%)}
  .mobile-phone-story .screen-art:before{display:none}
  .mobile-phone-story .playbook-example-label{font-size:.75rem;line-height:1.5}
  .features-page .mobile-phone-story .screen-focus-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:14px 0 0;padding:5px;border:1px solid #2b4654;border-radius:12px;background:#0e1a23}
  .features-page .mobile-phone-story .screen-focus-nav button{align-items:center;justify-content:center;text-align:center;gap:4px;font-size:.875rem;line-height:1.25;min-height:58px;padding:7px 4px;border:1px solid transparent;border-radius:7px;color:var(--muted);background:transparent}
  .features-page .mobile-phone-story .screen-focus-nav button span{font-size:.75rem;line-height:1}
  .features-page .mobile-phone-story .screen-focus-nav button[aria-pressed=true]{background:#163642;border-color:#4a94a9;color:#c2f1fb}
  .features-page .mobile-phone-story .screen-focus-nav button:focus-visible{outline-offset:1px}
  .features-page .mobile-phone-story .screen-focus-caption{padding:18px 0 0;min-height:0}
  .features-page .mobile-phone-story .screen-focus-caption h4{font-size:1.0625rem;line-height:1.35;margin:0 0 7px}
  .features-page .mobile-phone-story .screen-focus-caption p{font-size:1rem;line-height:1.5;margin:0;max-width:none}
  .mobile-phone-actions{margin-top:12px}
  .features-page .mobile-phone-actions .screen-expand{display:inline-flex;align-items:center;gap:18px;min-height:44px;font-size:.875rem;margin:0;padding:8px 14px;border:1px solid #365666;border-radius:8px}
  .mobile-phone-more{margin-top:8px;border-bottom:1px solid var(--border);padding-bottom:5px}
  .mobile-phone-more summary{min-height:44px;padding:12px 0;cursor:pointer;color:var(--muted);font-size:.875rem;line-height:1.4}
  .features-page .mobile-phone-more p{font-size:1rem;line-height:1.6;margin:8px 0 15px;color:var(--muted)}
  .features-page .mobile-phone-story .screen-disclosure{font-size:.75rem;line-height:1.5;margin:12px 0 0}
  .features-page .mobile-phone-story .review-question{margin:24px 0 0}
  .feature-nav-details{border-block:1px solid var(--border);margin:8px 0;padding:4px 0}
  .feature-nav-details summary{padding:14px 4px;min-height:48px;font-size:18px;color:var(--cyan);cursor:pointer}
  .mobile-nav .feature-nav-details a{padding-left:14px;font-size:16px;min-height:44px;border-left:1px solid #365666;margin-left:4px}
}
html.phone-detail-open{overflow:hidden}
.phone-detail-dialog{width:min(680px,100%);height:94dvh;max-height:94dvh;max-width:100%;margin:auto auto 0;padding:0;border:1px solid #355563;border-bottom:0;border-radius:20px 20px 0 0;background:#09131b;color:var(--text);box-shadow:0 -20px 80px #0008;overflow:hidden}
.phone-detail-dialog[open]{display:flex;flex-direction:column}
.phone-detail-dialog::backdrop{background:#02080ddd;backdrop-filter:blur(8px)}
.phone-detail-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 16px 12px;flex:none}
.phone-detail-kicker{font:.75rem var(--mono);color:var(--muted)}
.features-page .phone-detail-header h2{font-size:1.125rem;line-height:1.3;letter-spacing:-.02em;margin:5px 0 0}
.features-page button.phone-detail-close{flex:none;min-height:44px;font-size:.875rem;padding:8px 10px;border:1px solid #355563;border-radius:8px;white-space:nowrap;background:transparent}
.phone-detail-close span{margin-left:6px;font-size:1.25rem}
.phone-detail-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:0 12px 12px;padding:4px;background:#101f29;border:1px solid #2b4654;border-radius:10px;flex:none}
.features-page .phone-detail-steps button{min-height:44px;font-size:.875rem;line-height:1.25;padding:8px 4px;border:1px solid transparent;background:none;border-radius:6px;color:var(--muted)}
.features-page .phone-detail-steps button[aria-pressed=true]{background:#163642;border-color:#4a94a9;color:#c2f1fb}
.phone-detail-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 12px 10px;border-bottom:1px solid var(--border);flex:none}
.phone-detail-toolbar>div{display:flex;gap:4px}
.features-page .phone-detail-toolbar button{font-size:.875rem;min-height:44px;padding:8px;border:1px solid transparent;background:none;color:var(--muted);border-radius:6px;line-height:1.25}
.features-page .phone-detail-toolbar button[aria-pressed=true]{color:var(--cyan);border-color:#355563}
.phone-detail-body{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:20px 14px calc(24px + env(safe-area-inset-bottom,0px));touch-action:pan-x pan-y pinch-zoom}
.phone-detail-body:focus-visible{outline:2px solid var(--cyan);outline-offset:-3px}
.phone-detail-stage{width:100%;max-width:540px;margin:auto;min-height:0}
.phone-detail-stage.is-zoomed{width:850px;max-width:none;margin:0}
.phone-detail-crop{width:100%;position:relative;overflow:hidden;background:#0d1720}
.phone-detail-crop img{position:absolute;max-width:none;height:auto;pointer-events:none}
.phone-detail-full{width:100%;position:relative}
.phone-detail-full>img{width:100%;height:auto;display:block}
.phone-detail-caption{padding-top:24px;max-width:540px;margin:auto}
.features-page .phone-detail-caption h3{font-size:1.125rem;line-height:1.4;letter-spacing:-.02em;margin:0 0 8px}
.features-page .phone-detail-caption p{font-size:1rem;line-height:1.6;margin:0;color:var(--muted)}
@media(prefers-reduced-motion:reduce){.phone-detail-dialog *, .mobile-phone-story *{scroll-behavior:auto!important;transition:none!important}}
