html,body{height:100%;}
  .startup-notice{position:fixed;inset:16px 16px auto;z-index:2000;max-width:560px;margin:auto;padding:20px;background:#fff;border:1px solid var(--ml-border);border-radius:var(--ml-radius);box-shadow:var(--ml-shadow);}
  .startup-notice p{margin:8px 0 0;}
  body{margin:0;background:#CBD5E1;color:var(--ml-text);font-family:var(--bs-body-font-family);}

  /* ---------- Marco de teléfono ---------- */
  .stage{min-height:100%;display:flex;align-items:center;justify-content:center;padding:24px 0;}
  .phone{
    position:relative;width:390px;height:780px;background:var(--ml-bg);
    border-radius:36px;overflow:hidden;box-shadow:0 20px 60px rgba(15,23,42,.35),0 0 0 10px #0F172A;
  }
  @media (max-width:575.98px){
    body{background:var(--ml-bg);}
    .stage{padding:0;min-height:100dvh;}
    .phone{width:100%;height:100dvh;border-radius:0;box-shadow:none;}
  }
  .proto-tag{
    position:absolute;top:8px;right:14px;z-index:40;font-size:11px;color:#64748B;
    background:rgba(248,250,252,.85);padding:2px 8px;border-radius:999px;pointer-events:none;
  }

  /* ---------- Pantallas ---------- */
  .screen{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;display:none;
    padding:0 16px calc(var(--nav-h) + 56px);scroll-behavior:smooth;}
  .screen.active{display:block;animation:fadeIn .18s ease-out;}
  .screen[data-nav="0"]{padding-bottom:24px;}
  @keyframes fadeIn{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}
  .topbar{display:flex;align-items:center;gap:8px;min-height:56px;padding:12px 0 4px;}
  .topbar h1{font-size:20px;font-weight:700;margin:0;line-height:1.2;}
  .topbar .btn-icon{margin-left:-8px;}