/* Sign-up flow (/start/): «Починаємо» form → full-screen questionnaire → waiting → created. */
.start-body{background:#fff}
.start-top{border-bottom:1px solid var(--line)}
.start-top .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:14px;padding-bottom:14px}
.start-help{font-size:13.5px;color:var(--muted);text-decoration:none}
.start-shell{max-width:560px;padding-top:28px;padding-bottom:60px}
.s-step h1{font-size:clamp(28px,7vw,36px);margin-bottom:10px}
.s-step .sub{font-size:15.5px;margin-bottom:22px}
.sform{display:grid;gap:16px}
.sform label{font-weight:600;font-size:14.5px;display:grid;gap:6px}
.sform input:not([type=checkbox]){font:inherit;font-weight:500;padding:13px 14px;border:1.5px solid #cfd7d3;border-radius:12px;background:#fff;min-width:0;width:100%}
.sform input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.sform input.bad{border-color:var(--danger)}
.sform .hint{font-weight:500;font-size:12.5px;color:var(--muted)}
.phone-row{display:flex;align-items:center;border:1.5px solid #cfd7d3;border-radius:12px;overflow:hidden}
.phone-row:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.phone-row .flag{padding:0 10px 0 12px;font-weight:600;color:var(--muted);white-space:nowrap;border-right:1px solid var(--line);align-self:stretch;display:flex;align-items:center}
.phone-row input.phone-row input,.phone-row input{border:0!important;border-radius:0!important;box-shadow:none!important}
.consent{display:flex!important;gap:10px;align-items:flex-start;font-weight:500!important;font-size:14px!important}
.consent input{width:20px;height:20px;margin-top:2px;accent-color:var(--brand);flex:none}
.hp{position:absolute;left:-9999px}
.ferr{color:var(--danger);background:var(--danger-soft);border-radius:10px;padding:10px 12px;font-size:14px}
.center{text-align:center}
.login-note{margin-top:34px;padding-top:20px;border-top:1px solid var(--line);font-size:13.5px;color:var(--muted)}
.wait-card{display:flex;gap:16px;align-items:center;background:var(--brand-soft);border:1px solid var(--brand-100);border-radius:16px;padding:20px}
.wait-card b{font-size:17px}
.wait-card p{font-size:14px;margin-top:4px}
.spin{width:28px;height:28px;border:3.5px solid var(--brand-100);border-top-color:var(--brand);border-radius:50%;animation:sp 1s linear infinite;flex:none}
@keyframes sp{to{transform:rotate(360deg)}}
.prep{margin-top:26px}
.prep h3{font-size:17px;margin-bottom:6px}
.prep .check-list li{font-size:14.5px}
.linkbtn{background:none;border:0;color:var(--brand);font:inherit;font-weight:700;cursor:pointer;padding:0;text-decoration:underline}
.done-card{text-align:center;padding-top:20px}
.done-card h1{font-size:clamp(26px,7vw,34px)}
.creds{display:grid;grid-template-columns:auto 1fr;gap:10px 14px;text-align:left;background:var(--paper-2);border:1px solid var(--line);border-radius:16px;padding:18px;margin:22px 0 10px;font-size:15px}
.creds dt{color:var(--muted)}
.creds dd{font-weight:600;overflow-wrap:anywhere}
.creds code{font-size:15px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:2px 8px}
.copy{margin-left:6px;border:1px solid var(--brand-100);background:#fff;color:var(--brand);border-radius:8px;padding:3px 10px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
#go-admin{margin-top:16px}

/* questionnaire */
.q-overlay{position:fixed;inset:0;background:#fff;z-index:50;display:flex;flex-direction:column}
.q-progress{height:6px;background:#e6ecea;display:flex;gap:4px;padding:0 4px}
.q-progress span{display:block;height:100%;background:var(--brand);border-radius:3px;transition:width .3s;width:0}
.q-close{position:absolute;top:14px;right:14px;width:40px;height:40px;border:0;background:transparent;font-size:30px;line-height:1;color:var(--ink);cursor:pointer}
.q-body{flex:1;overflow:auto;padding:70px 22px 20px;max-width:620px;width:100%;margin:0 auto}
.q-num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:7px;background:var(--brand);color:#fff;font-weight:800;font-size:13px;margin-bottom:12px}
.q-body h2{font-size:clamp(22px,5.8vw,28px);margin-bottom:8px}
.q-body h2::after{content:" *";color:var(--brand)}
.q-sub{color:var(--muted);font-size:15px;margin-bottom:22px}
.q-options{display:grid;gap:10px}
.q-opt{display:flex;align-items:flex-start;gap:12px;background:var(--brand-soft);border:2px solid transparent;border-radius:12px;padding:14px 14px;cursor:pointer;font:inherit;text-align:left;color:var(--brand-deep);font-size:16px;font-weight:600;width:100%}
.q-opt .k{flex:none;width:28px;height:28px;border:1.5px solid var(--brand-100);border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:var(--brand)}
.q-opt[aria-pressed="true"]{border-color:var(--brand);background:var(--brand-100)}
.q-opt[aria-pressed="true"] .k{background:var(--brand);color:#fff;border-color:var(--brand)}
.q-foot{display:flex;gap:10px;padding:14px 22px calc(14px + env(safe-area-inset-bottom));max-width:620px;width:100%;margin:0 auto}
.q-back{width:58px;flex:none;border:0;border-radius:12px;background:var(--brand);color:#fff;font-size:26px;cursor:pointer}
.q-back[disabled]{opacity:.35;cursor:default}
.q-next{flex:1;font-size:18px;padding:16px}
@media(min-width:700px){.q-body{padding-top:110px}}
.shake{animation:shake .35s}
@keyframes shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}

/* 2026-09-11: a way out of the form — the sign-up page is the only one without the site menu */
.start-back{margin-left:16px;color:var(--muted);text-decoration:none;font-weight:600;font-size:14px}
.start-back:hover{color:var(--brand)}
@media(max-width:600px){ .start-back{display:none} }
