body { min-height: 100vh; background: #e9edf3; }
.mobile-shell { width: min(760px, 100%); min-height: 100vh; margin: 0 auto; background: var(--paper); box-shadow: 0 0 40px rgba(2,20,48,.12); padding-bottom: 82px; }
.mobile-shell > header { position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.15rem; background: var(--navy-deep); color: var(--white); border-bottom: 2px solid var(--gold); }
.mobile-shell header .eyebrow { color: var(--gold-light); margin-bottom: .25rem; }
.mobile-shell header h1 { margin: 0; font-size: 1.35rem; }
.mobile-shell main { padding: 1rem; }
.mobile-hero { padding: 1.4rem; color: var(--white); background: var(--navy); border-bottom: 4px solid var(--gold); }
.mobile-hero h2 { margin: .2rem 0 .5rem; font-size: 1.55rem; }
.mobile-hero p { line-height: 1.45; color: #dce6f2; }
.mobile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin: .75rem 0; }
.mobile-metric, .mobile-card { padding: 1rem; background: var(--white); border: 1px solid var(--line); }
.mobile-metric strong { display: block; margin-top: .25rem; color: var(--navy); font-size: 1.65rem; font-family: Georgia, serif; }
.mobile-card { margin-bottom: .75rem; }
.mobile-card h2, .mobile-card h3 { color: var(--navy); }
.mobile-card h2 { margin-top: 0; font-size: 1.05rem; }
.mobile-card h3 { margin: .3rem 0; font-size: 1rem; }
.mobile-card p { line-height: 1.45; color: var(--muted); }
.mobile-actions { display: flex; gap: .6rem; margin-top: 1rem; }
.mobile-actions .button { flex: 1; }
.mobile-shell nav { position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 3; width: min(760px, 100%); display: grid; grid-template-columns: repeat(4, 1fr); padding: .45rem env(safe-area-inset-right) calc(.45rem + env(safe-area-inset-bottom)) env(safe-area-inset-left); background: var(--white); border-top: 1px solid var(--line); }
.mobile-shell nav button { min-height: 54px; border: 0; border-top: 3px solid transparent; background: transparent; color: var(--muted); font-size: .72rem; }
.mobile-shell nav button.active { color: var(--navy); border-color: var(--gold); font-weight: 800; }
.mobile-shell nav span { display: inline-grid; place-items: center; min-width: 18px; height: 18px; border-radius: 50%; color: var(--white); background: var(--danger); }
@media (min-width: 700px) { .mobile-shell { margin-top: 2rem; min-height: calc(100vh - 4rem); } }