/* ============================================================
   Sentinela · Moldura de smartphone (pré-visualização Web do app)
   Selo de honestidade P1: deixa explícito que é simulação Web.
   ============================================================ */
.stage{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  gap:14px;padding:28px 16px 48px;background:var(--canvas)}
.stage-head{max-width:430px;text-align:center}
.stage-head .brand{display:inline-flex;align-items:center;gap:9px;margin-bottom:6px}
.stage-head .brand b{font:700 18px var(--font-sans);color:var(--blue-900)}
.stage-head .seal{font:600 11px var(--font-mono);letter-spacing:.04em;color:var(--offline-text);
  background:var(--offline-bg);border:1px solid var(--offline-bd);padding:5px 11px;border-radius:var(--r-pill);display:inline-block}
.stage-head .links{margin-top:8px;font:500 12px var(--font-sans)}
.stage-head .links a{color:var(--blue-800);text-decoration:underline;margin:0 6px}

/* Device */
.device{width:390px;max-width:100%;height:780px;max-height:88vh;background:#0E1726;border-radius:46px;
  padding:11px;box-shadow:var(--sh-3);position:relative;flex:none}
.device .screen{position:relative;width:100%;height:100%;background:var(--surface-2);
  border-radius:36px;overflow:hidden;display:flex;flex-direction:column}
/* status bar fake */
.statusbar{height:30px;flex:none;display:flex;align-items:center;justify-content:space-between;
  padding:6px 22px 0;font:600 13px var(--font-sans);color:var(--ink);z-index:30}
.statusbar .right{display:flex;gap:5px;align-items:center;font:600 11px var(--font-mono)}
/* notch */
.notch{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:128px;height:26px;
  background:#0E1726;border-radius:0 0 16px 16px;z-index:31}
/* home indicator */
.home-ind{position:absolute;bottom:7px;left:50%;transform:translateX(-50%);width:128px;height:5px;
  border-radius:999px;background:rgba(20,33,58,.32);z-index:30}
.device .seal-foot{position:absolute;bottom:14px;left:0;right:0;text-align:center;
  font:600 9px var(--font-mono);letter-spacing:.03em;color:var(--muted-2);z-index:20;pointer-events:none}

@media (max-width:440px){
  .stage{padding:0;background:var(--surface-2)}
  .device{width:100%;height:100vh;max-height:none;border-radius:0;padding:0;box-shadow:none}
  .device .screen{border-radius:0}
  .notch,.home-ind,.device .seal-foot{display:none}
}