/* Faithful phone · "Your preview". Scoped under .app; the phone type scale
   (12/13/15/17/22/28) and weights (400/600/700) only. */

/* While a visitor's version shows, the app stays whole: only what is Maya's
   alone is hidden (marked .fyp-personal by faithful-mobile-your-preview.js),
   plus her menu (her profile lives in the drawer), her notification bells and
   counts, her overlays, and the GRACE bar (its answers could use her profile). */
.app[data-preview-mode="yours"] .fyp-personal,
.app[data-preview-mode="yours"] .menu-btn,
.app[data-preview-mode="yours"] .home-nav-bell,
.app[data-preview-mode="yours"] .nav-badge,
.app[data-preview-mode="yours"] .tab-badge,
.app[data-preview-mode="yours"] > .social-notify-overlay,
.app[data-preview-mode="yours"] > .cn-moment-overlay,
.app[data-preview-mode="yours"] > .cn-story-viewer-overlay,
.app[data-preview-mode="yours"] > .impact-float,
.app[data-preview-mode="yours"] > .fm-grace-dock,
.app[data-preview-mode="yours"] > .app-drawer,
.app[data-preview-mode="yours"] > .app-drawer-backdrop,
.app[data-preview-mode="yours"] .fw-page-tour{display:none!important}

.app .fyp-banner{position:absolute;left:12px;right:12px;bottom:var(--fyp-banner-bottom,96px);z-index:60;display:flex;align-items:center;gap:10px;padding:8px 8px 8px 14px;border-radius:999px;background:#10283f;color:#fff;font:600 12px/1.35 var(--font-body);box-shadow:0 6px 18px #10283f33}
.app .fyp-banner.is-offline{background:#6b4a12}
.app .fyp-banner-text{flex:1}
.app .fyp-forget{flex:0 0 auto;min-height:36px;padding:6px 10px;border-radius:999px;border:1px solid #ffffff80;background:transparent;color:#fff;font:600 12px/1.2 var(--font-body)}

.app .fyp-foryou{margin:14px 16px;display:grid;gap:10px;background:#fff;border:1px solid #d9e6f1;border-radius:18px;padding:14px}
.app .fyp-home h1{margin:0;font-family:var(--font-display);font-size:28px;line-height:1.15;color:#193654}
.app .fyp-tab h2{margin:0;font-family:var(--font-display);font-size:22px;line-height:1.2;color:#193654}
.app .fyp-eyebrow{margin:0;font:600 12px/1.4 var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:#5b7a92}
.app .fyp-lede{margin:0;font:400 15px/1.5 var(--font-body);color:#27516f}
.app .fyp-tile{display:grid;gap:2px;background:#fff;border:1px solid #d9e6f1;border-radius:14px;padding:12px 14px}
.app .fyp-tile strong{font:600 15px/1.35 var(--font-body);color:#193654}
.app .fyp-tile small,.app .fyp-tile em{font:400 13px/1.45 var(--font-body);color:#5b7a92}
.app .fyp-tile em{font-style:italic;color:#27516f}
.app .fyp-neutral,.app .fyp-note{margin:0;font:400 13px/1.55 var(--font-body);color:#27516f;background:#eef4fa;border-radius:12px;padding:10px 12px}

.app .fyp-layer{position:absolute;inset:0;z-index:70;background:linear-gradient(180deg,#eaf3fc,#fff 45%);padding:56px 24px 32px;display:flex;flex-direction:column;gap:14px;overflow:auto}
.app .fyp-layer h1{margin:0;font-family:var(--font-display);font-size:28px;line-height:1.15;color:#193654}
.app .fyp-layer p{margin:0;font:400 15px/1.55 var(--font-body);color:#27516f}
.app .fyp-layer .fyp-eyebrow{font:600 12px/1.4 var(--font-body)}
.app .fyp-layer .fyp-note{font:400 13px/1.55 var(--font-body)}
.app .fyp-primary{min-height:48px;border:0;border-radius:999px;background:#10283f;color:#fff;font:600 15px/1.2 var(--font-body);padding:12px 18px}
.app .fyp-primary[disabled]{opacity:.6}
.app .fyp-secondary{min-height:44px;border:1px solid #cddced;border-radius:999px;background:#fff;color:#193654;font:600 15px/1.2 var(--font-body);padding:10px 18px}
.app .fyp-status{min-height:20px;font:400 13px/1.5 var(--font-body)}
/* Inside a "For you" card the suggestions are rows, not cards within a card. */
.app .fyp-foryou .fyp-tile{border:0;border-top:1px solid #e6eef6;border-radius:0;padding:10px 0 0;background:none}
.app .fyp-foryou .fyp-eyebrow + .fyp-tile{border-top:0;padding-top:2px}
