/* ============================================================
   MIRRIM · Онбординг франчайзи — стеклянный мастер (6 шагов)
   Самодостаточный: ambient bg + glass + wizard. Префикс .ob-
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#2A2A2A; --ink-2:#5A5567; --ink-3:#8B8698; --ink-4:#ABA6B8;
  --purple-700:#5B21B6; --purple-500:#7C3AED; --purple-400:#8B5CF6; --purple-300:#A78BFA; --purple-200:#C9B8FF; --purple-100:#E7DEFF;
  --lime:#C6F432; --lime-deep:#9CC400;
  --success:#5DD33C; --warning:#F59E0B; --error:#EF4444; --info:#2563EB;
  --glass:rgba(255,255,255,.66);
  --glass-strong:rgba(255,255,255,.82);
  --glass-soft:rgba(255,255,255,.44);
  --glass-line:rgba(255,255,255,.85);
  --glass-line-bot:rgba(124,58,237,.08);
  --blur:22px;
  --shadow:0 8px 32px rgba(46,24,92,.12);
  --shadow-sm:0 4px 18px rgba(46,24,92,.08);
  --shadow-pop:0 24px 60px -18px rgba(91,33,182,.4);
  --r-sm:14px; --r-md:20px; --r-lg:24px; --r-xl:28px;
  --font:"Manrope",system-ui,-apple-system,sans-serif;
}
html,body{height:100%}
body{font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased;background:#EEE9F7;min-height:100vh}
a{text-decoration:none;color:inherit}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
input,textarea,select{font-family:inherit}
img{display:block;max-width:100%}

/* ambient background */
.bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:linear-gradient(160deg,#F3EFFB 0%,#ECE6F8 50%,#F0F4E6 100%)}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.85}
.blob.b1{width:560px;height:560px;background:radial-gradient(circle,#A78BFA,transparent 68%);top:-160px;left:-120px;animation:obf1 22s ease-in-out infinite}
.blob.b2{width:520px;height:520px;background:radial-gradient(circle,#C9B8FF,transparent 70%);top:6%;right:-140px;animation:obf2 26s ease-in-out infinite}
.blob.b3{width:600px;height:600px;background:radial-gradient(circle,#E7DEFF,transparent 72%);bottom:-220px;left:34%;animation:obf1 30s ease-in-out infinite}
.blob.b4{width:360px;height:360px;background:radial-gradient(circle,rgba(198,244,50,.5),transparent 66%);bottom:-40px;right:12%;animation:obf2 24s ease-in-out infinite}
@keyframes obf1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(1.07)}}
@keyframes obf2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-46px,34px) scale(1.05)}}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.5;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}

.glass{position:relative;background:var(--glass);-webkit-backdrop-filter:blur(var(--blur)) saturate(140%);backdrop-filter:blur(var(--blur)) saturate(140%);border:1px solid var(--glass-line);border-radius:var(--r-lg);box-shadow:var(--shadow),inset 0 1px 0 rgba(255,255,255,.5)}

/* ── layout ── */
.ob{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;max-width:920px;margin:0 auto;padding:22px 22px 120px}

/* top bar */
.ob-top{display:flex;align-items:center;gap:14px;margin-bottom:22px}
.ob-logo{display:flex;align-items:center;gap:11px}
.ob-logo img{width:42px;height:42px;border-radius:13px;box-shadow:0 10px 22px -8px rgba(124,58,237,.7)}
.ob-logo b{font:800 18px/1 var(--font)}
.ob-logo span{font:600 12px/1 var(--font);color:var(--purple-500);display:block;margin-top:4px}
.ob-exit{margin-left:auto;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:999px;background:var(--glass-soft);border:1px solid var(--glass-line);font:700 13px/1 var(--font);color:var(--ink-2);transition:.16s}
.ob-exit:hover{background:var(--glass-strong);color:var(--purple-500)}
.ob-exit svg{width:16px;height:16px;stroke-width:2.2;fill:none;stroke:currentColor}

/* progress master */
.ob-prog{display:flex;align-items:flex-start;gap:0;margin-bottom:24px;padding:18px 22px}
.ob-prog__step{flex:1;display:flex;flex-direction:column;align-items:center;gap:9px;position:relative;text-align:center}
.ob-prog__line{position:absolute;top:17px;left:calc(-50% + 18px);right:calc(50% + 18px);height:3px;background:var(--glass-line);border-radius:3px;overflow:hidden}
.ob-prog__line i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--purple-500),var(--lime));transition:width .5s ease}
.ob-prog__step:first-child .ob-prog__line{display:none}
.ob-prog__dot{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--glass-strong);border:2px solid var(--glass-line);color:var(--ink-3);font:800 13px/1 var(--font);flex-shrink:0;transition:.25s;z-index:1}
.ob-prog__dot svg{width:16px;height:16px;stroke-width:2.6;fill:none;stroke:currentColor}
.ob-prog__lbl{font:700 11.5px/1.15 var(--font);color:var(--ink-3);transition:.2s;max-width:74px}
.ob-prog__step.done .ob-prog__dot{background:linear-gradient(150deg,var(--purple-500),var(--purple-700));border-color:transparent;color:#fff}
.ob-prog__step.done .ob-prog__line i{width:100%}
.ob-prog__step.active .ob-prog__dot{background:var(--lime);border-color:transparent;color:#0A0A0A;box-shadow:0 8px 20px -6px rgba(198,244,50,.8),0 0 0 5px rgba(198,244,50,.2)}
.ob-prog__step.active .ob-prog__lbl{color:var(--purple-700)}

/* card / panel */
.ob-panel{padding:34px 38px;margin-bottom:18px;animation:obIn .4s cubic-bezier(.2,.8,.3,1)}
@keyframes obIn{from{transform:translateY(16px)}to{transform:none}}
@media (prefers-reduced-motion: reduce){.ob-panel,.ob-paystate.show{animation:none}}
.ob-step{display:none}
.ob-step.on{display:block}
.ob-h{font:800 27px/1.12 var(--font);letter-spacing:-.02em;margin-bottom:8px}
.ob-h span{background:linear-gradient(90deg,var(--purple-500),var(--purple-300));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ob-sub{font:500 15px/1.5 var(--font);color:var(--ink-2);margin-bottom:26px;max-width:560px}
.ob-eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 11px/1 var(--font);letter-spacing:1.4px;text-transform:uppercase;color:var(--purple-500);margin-bottom:14px}
.ob-eyebrow::before{content:"";width:18px;height:3px;border-radius:3px;background:var(--lime)}

/* limited banner */
.ob-banner{display:flex;align-items:center;gap:13px;padding:14px 18px;border-radius:var(--r-md);background:linear-gradient(120deg,rgba(198,244,50,.16),rgba(167,139,250,.12));border:1px solid rgba(198,244,50,.35);margin-bottom:22px}
.ob-banner svg{width:22px;height:22px;stroke:var(--lime-deep);stroke-width:2;fill:none;flex-shrink:0}
.ob-banner b{font:700 14px/1.3 var(--font);color:var(--ink)}
.ob-banner span{font:500 12.5px/1.4 var(--font);color:var(--ink-2);display:block;margin-top:2px}

/* fields */
.ob-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ob-f{display:flex;flex-direction:column;gap:7px}
.ob-f.full{grid-column:1 / -1}
.ob-f label{font:700 12px/1 var(--font);color:var(--ink-2);text-transform:uppercase;letter-spacing:.6px}
.ob-f label .req{color:var(--purple-500)}
.ob-inp,.ob-ta,.ob-sel{height:52px;border-radius:var(--r-sm);border:1.5px solid var(--glass-line);background:var(--glass-soft);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:0 16px;font:500 15px/1 var(--font);color:var(--ink);transition:.16s;width:100%}
.ob-ta{height:auto;min-height:96px;padding:14px 16px;resize:vertical;line-height:1.5}
.ob-inp::placeholder,.ob-ta::placeholder{color:var(--ink-4)}
.ob-inp:focus,.ob-ta:focus,.ob-sel:focus{outline:none;border-color:var(--purple-300);background:var(--glass-strong);box-shadow:0 0 0 4px rgba(167,139,250,.18)}
.ob-inp.bad,.ob-ta.bad{border-color:var(--error);box-shadow:0 0 0 4px rgba(239,68,68,.12)}
.ob-err{font:600 11.5px/1 var(--font);color:var(--error);min-height:13px}
.ob-hint{font:500 12px/1.4 var(--font);color:var(--ink-3);display:flex;align-items:center;gap:7px}
.ob-hint svg{width:14px;height:14px;stroke:var(--ink-4);stroke-width:2;fill:none;flex-shrink:0}

/* auth inline: email → otp */
.ob-otp{display:flex;gap:9px;margin:6px 0 4px}
.ob-otp__box{flex:1;aspect-ratio:1/1.15;max-width:56px;border-radius:14px;border:1.5px solid var(--glass-line);background:var(--glass-soft);display:grid;place-items:center;font:800 22px/1 var(--font);color:var(--ink);outline:none;transition:.15s;text-align:center;padding:0}
.ob-otp__box:focus{border-color:var(--purple-300);box-shadow:0 0 0 4px rgba(167,139,250,.18)}
.ob-otp__box.filled{border-color:var(--purple-200)}
.ob-otp.err .ob-otp__box{border-color:var(--error);box-shadow:0 0 0 4px rgba(239,68,68,.12)}
.ob-resend{font:600 12.5px/1.4 var(--font);color:var(--ink-3);margin-top:10px}
.ob-linkbtn{background:none;border:none;padding:0;font:700 12.5px/1 var(--font);color:var(--purple-500);cursor:pointer}
.ob-linkbtn:hover{text-decoration:underline}

/* auth tabs / method */
.ob-tabs{display:inline-flex;gap:4px;padding:5px;border-radius:14px;background:var(--glass-soft);border:1px solid var(--glass-line);margin-bottom:22px}
.ob-tabs button{font:700 13.5px/1 var(--font);padding:11px 20px;border-radius:10px;color:var(--ink-3);transition:.16s}
.ob-tabs button.on{background:var(--glass-strong);color:var(--purple-500);box-shadow:var(--shadow-sm)}

/* code input row */
.ob-code{display:flex;gap:10px;margin-top:6px}
.ob-code input{width:52px;height:60px;text-align:center;font:800 22px/1 var(--font);border-radius:12px;border:1.5px solid var(--glass-line);background:var(--glass-soft);color:var(--ink)}
.ob-code input:focus{outline:none;border-color:var(--purple-400);background:var(--glass-strong)}

/* choice cards (experience etc.) */
.ob-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ob-choice{padding:14px 14px;border-radius:14px;border:1.5px solid var(--glass-line);background:var(--glass-soft);text-align:left;transition:.16s;font:600 13.5px/1.3 var(--font);color:var(--ink-2)}
.ob-choice:hover{border-color:var(--purple-200);background:var(--glass-strong)}
.ob-choice.on{border-color:var(--purple-500);background:rgba(124,58,237,.08);color:var(--purple-700);box-shadow:0 6px 18px -8px rgba(124,58,237,.4)}
.ob-choice b{display:block;font:700 14px/1.2 var(--font);color:var(--ink);margin-bottom:3px}
.ob-choice.on b{color:var(--purple-700)}

/* ── city selection ── */
.ob-city-top{display:flex;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.ob-search{flex:1;min-width:220px;position:relative}
.ob-search svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:17px;height:17px;stroke:var(--ink-3);stroke-width:2;fill:none}
.ob-search input{width:100%;height:48px;border-radius:999px;border:1.5px solid var(--glass-line);background:var(--glass-soft);padding:0 18px 0 42px;font:500 14px/1 var(--font);color:var(--ink);outline:none}
.ob-search input:focus{border-color:var(--purple-300);background:var(--glass-strong)}
.ob-filter{display:flex;gap:7px}
.ob-filter button{height:48px;padding:0 15px;border-radius:999px;background:var(--glass-soft);border:1.5px solid var(--glass-line);font:700 13px/1 var(--font);color:var(--ink-3);transition:.16s;display:inline-flex;align-items:center;gap:7px}
.ob-filter button .d{width:8px;height:8px;border-radius:50%}
.ob-filter button.on{background:var(--purple-500);color:#fff;border-color:transparent}
.ob-cities{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-height:360px;overflow-y:auto;padding:2px;scrollbar-width:thin}
.ob-cities::-webkit-scrollbar{width:8px}.ob-cities::-webkit-scrollbar-thumb{background:rgba(124,58,237,.22);border-radius:99px}
.ob-cc{padding:16px 16px;border-radius:16px;border:1.5px solid var(--glass-line);background:var(--glass-soft);text-align:left;transition:.16s;position:relative}
.ob-cc__st{display:inline-flex;align-items:center;gap:6px;font:700 10px/1 var(--font);letter-spacing:.4px;text-transform:uppercase;padding:4px 8px;border-radius:999px;margin-bottom:10px}
.ob-cc__st .d{width:7px;height:7px;border-radius:50%}
.ob-cc__st.free{color:#2E9E1E;background:rgba(93,211,60,.16)} .ob-cc__st.free .d{background:var(--success)}
.ob-cc__st.busy{color:var(--ink-3);background:var(--glass-soft)} .ob-cc__st.busy .d{background:var(--ink-4)}
.ob-cc__st.hold{color:var(--warning);background:rgba(245,158,11,.16)} .ob-cc__st.hold .d{background:var(--warning)}
.ob-cc b{display:block;font:800 16px/1.2 var(--font);color:var(--ink)}
.ob-cc .ob-cc__region{display:block;font:500 11px/1.2 var(--font);color:var(--ink-4);margin:1px 0 3px}
.ob-cc span{font:500 12px/1.3 var(--font);color:var(--ink-3)}
.ob-cc.free{cursor:pointer}
.ob-cc.free:hover{border-color:var(--purple-300);background:var(--glass-strong);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.ob-cc.busy{opacity:.55;cursor:not-allowed}
.ob-cc.sel{border-color:var(--purple-500);background:rgba(124,58,237,.1);box-shadow:0 8px 22px -8px rgba(124,58,237,.5)}
.ob-cc.sel::after{content:"";position:absolute;top:12px;right:12px;width:20px;height:20px;border-radius:50%;background:var(--purple-500);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3'%3E%3Cpath d='M5 12l5 5L20 6'/%3E%3C/svg%3E");background-size:13px;background-repeat:no-repeat;background-position:center}

.ob-city-suggest{margin:14px 0;padding:16px 18px;border-radius:14px;background:rgba(245,158,11,.08);border:1.5px solid rgba(245,158,11,.25)}
.ob-city-suggest p{font:600 13px/1.4 var(--font);color:var(--ink-2);margin-bottom:10px}
.ob-city-suggest .chips{display:flex;gap:8px;flex-wrap:wrap}
.ob-city-suggest .chip{height:40px;padding:0 16px;border-radius:999px;background:#fff;border:1.5px solid var(--glass-line);font:700 13px/1 var(--font);color:var(--purple-700);cursor:pointer;transition:.16s}
.ob-city-suggest .chip:hover{border-color:var(--purple-400);background:rgba(124,58,237,.06)}

/* ── order summary / payment ── */
.ob-order{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;align-items:start}
.ob-order-rows{display:flex;flex-direction:column}
.ob-order-r{display:flex;justify-content:space-between;align-items:baseline;padding:15px 0;border-bottom:1px dashed var(--glass-line-bot);font:500 14.5px/1.3 var(--font);color:var(--ink-2)}
.ob-order-r:first-child{padding-top:0}
.ob-order-r b{font:700 14.5px/1 var(--font);color:var(--ink);text-align:right}
.ob-order-r .est{font:600 11px/1 var(--font);color:var(--purple-400);display:block;margin-top:4px}
.ob-incl{margin-top:16px}
.ob-incl h4{font:700 13px/1 var(--font);color:var(--ink-2);text-transform:uppercase;letter-spacing:.6px;margin-bottom:12px}
.ob-incl ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.ob-incl li{display:flex;align-items:flex-start;gap:10px;font:500 13.5px/1.4 var(--font);color:var(--ink-2)}
.ob-incl li svg{width:17px;height:17px;stroke:var(--success);stroke-width:2.6;fill:none;flex-shrink:0;margin-top:1px}
.ob-pay{padding:22px 22px;border-radius:var(--r-md);background:var(--glass-strong);border:1px solid var(--glass-line)}
.ob-pay-total{text-align:center;padding-bottom:18px;border-bottom:1px solid var(--glass-line-bot);margin-bottom:18px}
.ob-pay-total .l{font:600 12px/1 var(--font);color:var(--ink-3);text-transform:uppercase;letter-spacing:.8px}
.ob-pay-total .v{font:800 34px/1 var(--font);color:var(--purple-700);margin:8px 0 4px;letter-spacing:-.02em}
.ob-pay-total .n{font:500 11px/1.3 var(--font);color:var(--ink-3)}
.ob-yk{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;height:56px;border-radius:14px;background:linear-gradient(150deg,#7C3AED,#5B21B6);color:#fff;font:800 15px/1 var(--font);box-shadow:0 14px 30px -10px rgba(124,58,237,.7);transition:.16s}
.ob-yk:hover{transform:translateY(-1px);box-shadow:0 18px 36px -10px rgba(124,58,237,.9)}
.ob-yk small{background:rgba(255,255,255,.2);padding:4px 8px;border-radius:6px;font:800 12px/1 var(--font)}
.ob-pay-safe{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:14px;font:500 11.5px/1.4 var(--font);color:var(--ink-3);text-align:center}
.ob-pay-safe svg{width:14px;height:14px;stroke:var(--success);stroke-width:2;fill:none;flex-shrink:0}

/* payment states overlay */
.ob-paystate{display:none;text-align:center;padding:20px 10px}
.ob-paystate.show{display:block;animation:obIn .35s ease both}
.ob-paystate .ring{width:76px;height:76px;border-radius:50%;margin:0 auto 20px;display:grid;place-items:center}
.ob-paystate.redirect .ring{border:4px solid rgba(124,58,237,.2);border-top-color:var(--purple-500);animation:obSpin 1s linear infinite}
@keyframes obSpin{to{transform:rotate(360deg)}}
.ob-paystate.ok .ring{background:rgba(93,211,60,.16)}
.ob-paystate.ok .ring svg{width:38px;height:38px;stroke:var(--success);stroke-width:2.6;fill:none}
.ob-paystate.err .ring{background:rgba(239,68,68,.14)}
.ob-paystate.err .ring svg{width:34px;height:34px;stroke:var(--error);stroke-width:2.6;fill:none}
.ob-paystate h3{font:800 21px/1.2 var(--font);margin-bottom:8px}
.ob-paystate p{font:500 14px/1.5 var(--font);color:var(--ink-2);max-width:400px;margin:0 auto}
.ob-yk-badge{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:8px 14px;border-radius:999px;background:var(--glass-soft);border:1px solid var(--glass-line);font:700 12px/1 var(--font);color:var(--ink-2)}
.ob-yk-badge b{color:var(--purple-500)}

/* payment demo state switcher (design aid) */
.ob-demo{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:22px;padding:12px 14px;border-radius:12px;background:var(--glass-soft);border:1px dashed var(--purple-200)}
.ob-demo span{font:700 10.5px/1 var(--font);letter-spacing:.5px;text-transform:uppercase;color:var(--ink-3)}
.ob-demo button{font:700 12px/1 var(--font);padding:7px 12px;border-radius:8px;background:var(--glass-strong);border:1px solid var(--glass-line);color:var(--ink-2);transition:.14s}
.ob-demo button:hover{color:var(--purple-500);border-color:var(--purple-200)}

/* ── documents ── */
.ob-docs{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}
.ob-doc{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:16px;border:1.5px solid var(--glass-line);background:var(--glass-soft)}
.ob-doc__ic{width:44px;height:44px;border-radius:12px;background:rgba(124,58,237,.1);color:var(--purple-500);display:grid;place-items:center;flex-shrink:0}
.ob-doc__ic svg{width:22px;height:22px;stroke-width:2;fill:none;stroke:currentColor}
.ob-doc__tx{flex:1}
.ob-doc__tx b{font:700 14.5px/1.2 var(--font);display:block}
.ob-doc__tx span{font:500 12.5px/1.3 var(--font);color:var(--ink-3);margin-top:3px;display:block}
.ob-doc__act{display:flex;gap:8px;flex-shrink:0}
.ob-doc__act a,.ob-doc__act button{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border-radius:10px;background:var(--glass-strong);border:1px solid var(--glass-line);font:700 12.5px/1 var(--font);color:var(--ink-2);transition:.14s}
.ob-doc__act a:hover,.ob-doc__act button:hover{color:var(--purple-500);border-color:var(--purple-200)}
.ob-doc__act svg{width:15px;height:15px;stroke-width:2.2;fill:none;stroke:currentColor}
.ob-doc__badge{font:700 10.5px/1 var(--font);letter-spacing:.4px;text-transform:uppercase;padding:5px 9px;border-radius:999px}
.ob-doc__badge.pending{color:var(--warning);background:rgba(245,158,11,.16)}
.ob-doc__badge.signed{color:#2E9E1E;background:rgba(93,211,60,.16)}
.ob-consent{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border-radius:16px;background:var(--glass-soft);border:1.5px solid var(--glass-line);margin-bottom:16px;cursor:pointer;transition:.16s}
.ob-consent:hover{border-color:var(--purple-200)}
.ob-consent.on{border-color:var(--purple-400);background:rgba(124,58,237,.06)}
.ob-check{width:24px;height:24px;border-radius:7px;border:2px solid var(--ink-4);flex-shrink:0;display:grid;place-items:center;transition:.14s;margin-top:1px}
.ob-consent.on .ob-check{background:var(--purple-500);border-color:var(--purple-500)}
.ob-check svg{width:14px;height:14px;stroke:#fff;stroke-width:3;fill:none;opacity:0;transition:.14s}
.ob-consent.on .ob-check svg{opacity:1}
.ob-consent p{font:500 13.5px/1.5 var(--font);color:var(--ink-2)}
.ob-consent p b{color:var(--ink)}
.ob-sign-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end}

/* ── done ── */
.ob-done{text-align:center;padding:20px 10px 6px}
.ob-done__ring{width:96px;height:96px;border-radius:50%;background:radial-gradient(circle,rgba(198,244,50,.3),rgba(124,58,237,.15));display:grid;place-items:center;margin:0 auto 22px;position:relative}
.ob-done__ring::after{content:"";position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(198,244,50,.4);animation:obPulse 2.4s ease-out infinite}
@keyframes obPulse{0%{transform:scale(.9);opacity:.8}100%{transform:scale(1.25);opacity:0}}
.ob-done__ring svg{width:46px;height:46px;stroke:var(--purple-700);stroke-width:2.4;fill:none}
.ob-done h2{font:800 28px/1.15 var(--font);letter-spacing:-.02em;margin-bottom:10px}
.ob-done p{font:500 15px/1.55 var(--font);color:var(--ink-2);max-width:480px;margin:0 auto 22px}
.ob-done-status{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border-radius:999px;background:rgba(245,158,11,.14);border:1px solid rgba(245,158,11,.3);font:700 13.5px/1 var(--font);color:#B7791F;margin-bottom:26px}
.ob-done-status .d{width:9px;height:9px;border-radius:50%;background:var(--warning);animation:obBlink 1.4s ease-in-out infinite}
@keyframes obBlink{0%,100%{opacity:1}50%{opacity:.3}}
.ob-done-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* limited/full access explainer */
.ob-access{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:26px;text-align:left}
.ob-access-c{padding:20px 20px;border-radius:16px;border:1.5px solid var(--glass-line);background:var(--glass-soft)}
.ob-access-c h4{font:700 14px/1 var(--font);display:flex;align-items:center;gap:8px;margin-bottom:14px}
.ob-access-c h4 svg{width:17px;height:17px;stroke-width:2.2;fill:none}
.ob-access-c.now h4 svg{stroke:var(--success)}
.ob-access-c.later h4 svg{stroke:var(--ink-4)}
.ob-access-c ul{list-style:none;display:flex;flex-direction:column;gap:9px}
.ob-access-c li{display:flex;align-items:center;gap:9px;font:500 13px/1.3 var(--font);color:var(--ink-2)}
.ob-access-c li .di{width:16px;height:16px;flex-shrink:0}
.ob-access-c li .di svg{width:16px;height:16px;stroke-width:2.2;fill:none}
.ob-access-c.now li .di svg{stroke:var(--success)}
.ob-access-c.later li{color:var(--ink-3)}
.ob-access-c.later li .di svg{stroke:var(--ink-4)}

/* ── nav footer (sticky) ── */
.ob-nav{position:fixed;left:0;right:0;bottom:0;z-index:20;padding:16px 22px calc(16px + env(safe-area-inset-bottom));background:linear-gradient(0deg,rgba(238,233,247,.96),rgba(238,233,247,.7));backdrop-filter:blur(12px);border-top:1px solid var(--glass-line-bot)}
.ob-nav-in{max-width:920px;margin:0 auto;display:flex;align-items:center;gap:14px}
.ob-back{display:inline-flex;align-items:center;gap:8px;height:52px;padding:0 22px;border-radius:14px;background:var(--glass);border:1px solid var(--glass-line);font:700 14px/1 var(--font);color:var(--ink-2);transition:.16s}
.ob-back:hover{background:var(--glass-strong);color:var(--purple-500)}
.ob-back svg{width:17px;height:17px;stroke-width:2.4;fill:none;stroke:currentColor}
.ob-back[disabled]{opacity:.4;pointer-events:none}
.ob-saved{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font:600 12.5px/1 var(--font);color:var(--ink-3)}
.ob-saved svg{width:15px;height:15px;stroke:var(--success);stroke-width:2.4;fill:none}
.ob-next{display:inline-flex;align-items:center;gap:9px;height:52px;padding:0 30px;border-radius:14px;background:var(--lime);color:#0A0A0A;font:800 15px/1 var(--font);box-shadow:0 12px 26px -10px rgba(198,244,50,.9),inset 0 1px 0 rgba(255,255,255,.5);transition:.16s}
.ob-next:hover{transform:translateY(-1px);box-shadow:0 16px 34px -10px rgba(198,244,50,1)}
.ob-next:active{transform:scale(.98)}
.ob-next svg{width:17px;height:17px;stroke-width:2.6;fill:none;stroke:currentColor}
.ob-next[disabled]{opacity:.45;pointer-events:none;filter:grayscale(.3)}

/* responsive */
@media (max-width:768px){
  .ob{padding:16px 16px 130px}
  .ob-panel{padding:26px 22px}
  .ob-prog{padding:14px 10px}
  .ob-prog__lbl{display:none}
  .ob-prog__line{left:calc(-50% + 17px);right:calc(50% + 17px)}
  .ob-grid{grid-template-columns:1fr}
  .ob-choices{grid-template-columns:1fr}
  .ob-cities{grid-template-columns:1fr 1fr}
  .ob-order{grid-template-columns:1fr}
  .ob-access{grid-template-columns:1fr}
  .ob-h{font-size:23px}
}
@media (max-width:430px){
  .ob-cities{grid-template-columns:1fr}
  .ob-next{padding:0 20px;flex:1;justify-content:center}
  .ob-city-top{flex-direction:column}
  .ob-doc{flex-wrap:wrap}
  .ob-doc__act{width:100%}
}