/* "שדרגו את המערכת" (public/upgrade.js): הפס בסוף בית העסק, כרטיסי השדרוג והחלון המזדמן.
 * דולב אישר את הדמו 20/10/2026. בטלפון גיליון מלמטה, במחשב חלון בשני טורים. צבעים מהטוקנים של המערכת. */
.upg-strip{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:4px 14px;width:100%;margin:26px 0 0;padding:16px;text-align:right;
  border:1px solid var(--accent-t3);border-radius:16px;background:linear-gradient(135deg,var(--accent-t2),var(--surface,var(--card)) 70%);
  box-shadow:var(--sh1);color:var(--ink);font:inherit;cursor:pointer;box-sizing:border-box;min-width:0}
.upg-strip .upg-ic{grid-row:1/3;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--accent);color:var(--on-accent)}
.upg-strip b{font-size:17px;font-weight:800;min-width:0}
.upg-strip .upg-sub{grid-column:2;font-size:13px;color:var(--ink2);min-width:0}
.upg-strip em{grid-row:1/3;grid-column:3;font-style:normal;font-weight:700;color:var(--accent-ink);white-space:nowrap}
.upg-chips{grid-column:1/4;display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;min-width:0}
.upg-chips span{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:4px 9px 4px 10px;border-radius:99px;background:var(--surface,var(--card));border:1px solid var(--line);color:var(--ink2);max-width:100%}
.upg-chips svg{width:14px;height:14px;color:var(--accent-ink);flex:none}
.upg-i{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}

.upg-scrim{position:fixed;inset:0;z-index:84;background:var(--scrim,rgba(14,22,18,.46));animation:upg-fade .2s ease}
@keyframes upg-fade{from{opacity:0}}
@keyframes upg-rise{from{transform:translateY(24px);opacity:0}}

/* כרטיסי השדרוג: גיליון מלמטה בטלפון */
.upg-viewer{position:fixed;z-index:85;inset-inline:0;bottom:0;top:max(12px,env(safe-area-inset-top));display:flex;flex-direction:column;
  background:var(--surface,var(--bg2));color:var(--ink);border-radius:22px 22px 0 0;box-shadow:var(--sh2);overflow:hidden;animation:upg-rise .25s ease}
.upg-head{display:flex;align-items:center;gap:10px;padding:14px 16px 6px}
.upg-head h2{margin:0;font-size:15px;font-weight:700;flex:1;min-width:0}
.upg-head small{font-size:12.5px;color:var(--ink3);font-variant-numeric:tabular-nums}
.upg-x{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--surface2,var(--surface3));display:grid;place-items:center;color:var(--ink2);flex:none;cursor:pointer;padding:0}
.upg-x svg{width:18px;height:18px}
.upg-track{flex:1;min-height:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain}
.upg-track::-webkit-scrollbar{display:none}
.upg-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;overflow-y:auto;padding:4px 16px 12px;display:grid;grid-template-areas:"media" "text";align-content:start;gap:14px;box-sizing:border-box}
.upg-media{grid-area:media;position:relative;height:clamp(210px,36vh,330px);border-radius:16px;overflow:hidden;
  background:radial-gradient(120% 90% at 50% 0%,var(--accent-t2),var(--surface2,var(--surface3)) 70%);border:1px solid var(--line)}
.upg-phone{position:absolute;top:14px;left:50%;transform:translateX(-50%);height:calc(100% + 30px);aspect-ratio:780/1240;border-radius:16px 16px 0 0;overflow:hidden;
  background:#fff;box-shadow:0 10px 26px rgba(0,0,0,.18);border:5px solid #1b1f1d;border-bottom:0;box-sizing:border-box}
.upg-phone img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;transition:opacity .7s ease}
.upg-phone img.on{opacity:1}
.upg-ph{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;text-align:center;color:var(--ink2);font-size:13px}
.upg-ph .upg-big{width:84px;height:84px;border-radius:24px;display:grid;place-items:center;background:var(--surface,var(--bg2));border:1px solid var(--line);color:var(--accent-ink);box-shadow:var(--sh1)}
.upg-ph .upg-big svg{width:42px;height:42px}
.upg-text{grid-area:text;min-width:0}
.upg-text h3{margin:0;font-size:21px;font-weight:800;line-height:1.25}
.upg-why{margin:6px 0 12px;font-size:15px;color:var(--ink2)}
.upg-steps{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:8px;counter-reset:upg}
.upg-steps li{display:flex;gap:10px;align-items:flex-start;font-size:14px;counter-increment:upg}
.upg-steps li::before{content:counter(upg);flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;background:var(--accent-t2);color:var(--accent-ink);margin-top:1px}
.upg-want{width:100%;min-height:50px;border:0;border-radius:12px;background:var(--accent-deep,var(--accent));color:var(--on-accent);font:inherit;font-size:16px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}
.upg-want[disabled]{background:var(--accent-t2);color:var(--accent-ink);cursor:default}
.upg-nav{display:flex;align-items:center;gap:10px;padding:10px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line)}
.upg-nb{min-width:44px;height:44px;padding:0 12px;border-radius:12px;border:1px solid var(--line2);background:var(--surface,var(--bg2));color:var(--ink);font:inherit;font-weight:600;font-size:14px;display:flex;align-items:center;gap:4px;cursor:pointer}
.upg-nb[disabled]{opacity:.35;cursor:default}
.upg-dots{flex:1;display:flex;justify-content:center;gap:7px}
.upg-dots button{width:8px;height:8px;padding:0;border-radius:99px;border:0;background:var(--line2);transition:width .2s,background .2s;cursor:pointer}
/* מטרת מגע רחבה סביב הנקודה הקטנה */
.upg-dots button{position:relative}.upg-dots button::after{content:"";position:absolute;inset:-12px -4px}
.upg-dots button[aria-current="true"]{width:22px;background:var(--accent)}

/* החלון המזדמן */
.upg-pop{position:fixed;z-index:85;left:50%;top:50%;transform:translate(-50%,-50%);width:min(360px,calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;
  background:var(--surface,var(--bg2));color:var(--ink);border-radius:20px;box-shadow:var(--sh2);padding:14px 14px 12px;box-sizing:border-box;animation:upg-fade .25s ease}
.upg-pop .upg-x{position:absolute;top:10px;inset-inline-end:10px;z-index:3}
.upg-kicker{display:inline-block;font-size:12px;font-weight:700;color:var(--accent-ink);background:var(--accent-t2);padding:3px 10px;border-radius:99px;margin:2px 0 10px}
.upg-pop .upg-media{height:190px;margin-bottom:12px}
.upg-pop h3{margin:0;font-size:19px;font-weight:800}
.upg-pop .upg-why{margin:6px 0 14px;font-size:14.5px}
.upg-row{display:flex;gap:8px;margin-top:8px}
.upg-row button{flex:1;min-height:44px;border-radius:12px;border:1px solid var(--line2);background:var(--surface,var(--bg2));color:var(--ink);font:inherit;font-weight:600;font-size:14px;cursor:pointer}
.upg-row .upg-all{color:var(--accent-ink)}

/* הפוקוס עובר לחלון עצמו בפתיחה (לא לכפתור), בלי מסגרת */
.upg-viewer:focus,.upg-pop:focus{outline:none}
/* ההודעה של המערכת (80) מעל הגיליון */
body:has(.upg-viewer) .toast,body:has(.upg-pop) .toast{z-index:19990}

@media (min-width:760px){
  .upg-strip{padding:18px 20px}
  .upg-chips{grid-column:2/3;margin-top:6px}
  .upg-viewer{top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);width:min(860px,calc(100vw - 48px));height:min(560px,calc(100vh - 48px));border-radius:22px;animation:upg-fade .2s ease}
  .upg-slide{grid-template-areas:"text media";grid-template-columns:1fr 1fr;gap:28px;padding:8px 24px 16px;align-content:stretch;overflow:hidden}
  .upg-slide .upg-media{height:100%;min-height:0}
  .upg-slide .upg-text{display:flex;flex-direction:column;justify-content:center}
  .upg-text h3{font-size:26px}
  .upg-slide .upg-want{max-width:320px}
  .upg-head{padding:16px 24px 8px}.upg-nav{padding:12px 24px 16px}
}
@media (prefers-reduced-motion:reduce){.upg-scrim,.upg-viewer,.upg-pop{animation:none}.upg-phone img,.upg-dots button{transition:none}}