/* پاپ‌آپ راهنمای نصب وب‌اپلیکیشن (js/install.js) — با متغیرهای همان styles.css، روشن و تیره */
.ins{position:fixed;inset:0;z-index:200}
.ins-back{position:absolute;inset:0;background:rgba(0,0,0,.32);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .26s ease}
.ins-sheet{position:absolute;inset-inline:0;bottom:0;margin:0 auto;max-width:520px;max-height:92vh;overflow:auto;
  background:var(--card);color:var(--ink);border-radius:28px 28px 0 0;box-shadow:var(--glass-shadow);
  padding:14px 24px calc(22px + env(safe-area-inset-bottom,0px));text-align:center;font-family:var(--font);
  transform:translateY(100%);transition:transform .32s cubic-bezier(.2,.8,.2,1)}
.ins.on .ins-back{opacity:1}.ins.on .ins-sheet{transform:none}
.ins-grab{display:block;width:40px;height:5px;border-radius:3px;background:var(--line);margin:0 auto 18px}
.ins-logo{display:block;margin:6px auto 18px;width:76px;height:76px;border-radius:20px;background:#fff;box-shadow:0 0 0 .5px rgba(0,0,0,.08),0 8px 24px rgba(0,113,227,.18)}
.ins-sheet h2{font-size:20px;line-height:1.7;font-weight:800;margin:0 auto 8px;max-width:22em}
.ins-lead{color:var(--ink-2);font-size:14px;line-height:1.9;margin:0 auto 6px;max-width:26em}
.ins-steps{list-style:none;margin:14px 0 0;padding:14px 0 0;border-top:.5px solid var(--line);text-align:start}
.ins-steps li{display:flex;align-items:center;gap:14px;padding:12px 0}
.ins-ic{flex:0 0 40px;height:40px;display:grid;place-items:center;border-radius:12px;background:var(--tint,#eef5ff);color:var(--blue)}
.ins-ic svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ins-ic svg circle{fill:currentColor;stroke:none}
.ins-add{font-weight:700;font-size:11px;color:var(--blue)}
.ins-t b[dir=ltr]{white-space:nowrap}
.ins-t{font-size:15px;line-height:1.9;color:var(--ink-2)}.ins-t b{color:var(--ink);font-weight:700}
.ins-n{display:inline-block;min-width:1.4em;color:var(--blue)!important}
.ins-actions{display:grid;gap:10px;margin-top:20px}.ins-actions .btn{width:100%}
@media (prefers-reduced-motion:reduce){.ins-back,.ins-sheet{transition:none}}

/* پاپ‌آپ «کمپ چطور کار می‌کند؟» (app.js: openHow) */
.howlink{display:inline-flex;align-items:center;gap:6px;margin:12px auto 0;padding:6px 12px;border:0;border-radius:var(--r-pill,999px);background:transparent;color:var(--blue-ink,var(--blue));font:600 14px/1.6 var(--font);cursor:pointer}
.howlink svg{width:18px;height:18px}
.howlink:active{transform:scale(.97)}
.how-sheet{text-align:start}
.how-sheet h2{text-align:center;font-size:21px;margin:4px 0 6px}
.how-lead{text-align:center;color:var(--ink-2);font-size:14.5px;line-height:1.9;margin:0 auto 6px;max-width:28em}
.how-list{list-style:none;margin:10px 0 0;padding:0;counter-reset:none}
.how-list li{display:flex;gap:14px;padding:12px 0;border-top:.5px solid var(--line)}
.how-list li:first-child{border-top:0}
.how-ic{flex:0 0 30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff;font-weight:700;font-size:14px;margin-top:2px}
.how-list b{display:block;font-size:15.5px;color:var(--ink);margin-bottom:2px}
.how-list p{margin:0;font-size:14px;line-height:1.95;color:var(--ink-2)}

.how .ins-sheet{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.how .ins-back{touch-action:none}
.how .ins-grab{padding:8px 0;margin-top:-8px;background-clip:content-box;height:21px;box-sizing:border-box;cursor:grab}
