/* Telegram mini app «Автотерапевт · Запись» (owner 2026-11-02). Glass style like the site; follows Telegram's light/dark. */
:root{--bg:#F2F3F5;--ink:#16181D;--muted:#5C616C;--line:rgba(22,24,29,.10);--accent:#C8001A;--accent-soft:#FBE3E5;
 --glass:rgba(255,255,255,.58);--glass-line:rgba(255,255,255,.7);--shadow:0 8px 28px rgba(22,24,29,.10),inset 0 1px 0 rgba(255,255,255,.8);
 --f-display:"Russo One","Arial Black",system-ui,sans-serif;--f-body:"Golos Text","Segoe UI",system-ui,-apple-system,sans-serif}
html.dark{--bg:#0F1114;--ink:#ECEDF0;--muted:#9BA0AA;--line:rgba(255,255,255,.08);--accent:#F2414B;--accent-soft:#3A1519;
 --glass:rgba(28,31,38,.55);--glass-line:rgba(255,255,255,.10);--shadow:0 8px 28px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.06)}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.45 var(--f-body);-webkit-tap-highlight-color:transparent}
.bg{position:fixed;inset:-20%;z-index:-1;pointer-events:none;filter:blur(10px);
 background:radial-gradient(38% 30% at 18% 18%,rgba(200,0,26,.22),transparent 70%),radial-gradient(34% 30% at 85% 30%,rgba(80,110,255,.16),transparent 70%),radial-gradient(40% 34% at 70% 85%,rgba(200,0,26,.14),transparent 70%);
 animation:drift 26s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate3d(3%,-2%,0) scale(1.05)}}
@media (prefers-reduced-motion:reduce){.bg{animation:none}}
#app{max-width:560px;margin:0 auto;padding:14px 14px calc(24px + env(safe-area-inset-bottom))}
.glass{background:var(--glass);-webkit-backdrop-filter:blur(18px) saturate(170%);backdrop-filter:blur(18px) saturate(170%);border:1px solid var(--glass-line);border-radius:20px;box-shadow:var(--shadow)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass{background:var(--bg)}}
h2{font:400 1.5rem/1.15 var(--f-display);text-transform:uppercase;margin:6px 4px 14px}
.muted{color:var(--muted)}.small{font-size:.88rem;margin:10px 4px}
[hidden]{display:none!important}
.scr{display:grid;gap:12px;animation:in .35s cubic-bezier(.2,.8,.2,1)}
@keyframes in{from{opacity:0;transform:translateY(10px)}}
.hero{padding:20px 18px;display:grid;gap:10px;text-align:center}
.logo{height:56px;margin:0 auto}
.logo-d{display:none}
html.dark .logo-l{display:none}
html.dark .logo-d{display:block}
.chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.chips span{font-size:.8rem;padding:5px 10px;border-radius:99px;background:var(--accent-soft);color:var(--accent);font-weight:600}
.btn{display:block;width:100%;border:0;border-radius:16px;padding:15px 18px;font:700 1.05rem var(--f-body);color:#fff;background:var(--accent);
 box-shadow:0 8px 22px rgba(200,0,26,.30),inset 0 1px 0 rgba(255,255,255,.3);cursor:pointer;transition:transform .15s}
.btn:active{transform:scale(.98)}
.btn.ghost{background:var(--glass);color:var(--ink);box-shadow:var(--shadow);border:1px solid var(--glass-line)}
.btn[disabled]{opacity:.6}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tile,.row{display:grid;gap:3px;text-align:left;padding:14px;border:1px solid var(--glass-line);color:var(--ink);font:inherit;cursor:pointer;text-decoration:none}
.tile b,.row b{font-size:.98rem}
.tile span,.row span{font-size:.82rem;color:var(--muted)}
.list{display:grid;gap:8px}
.row{padding:14px 16px;position:relative}
.row::after{content:"›";position:absolute;right:16px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:1.4rem}
.info{padding:12px 16px;display:grid;gap:8px;font-size:.9rem}
.info div{display:flex;justify-content:space-between;gap:12px}
.info b{font-weight:600;color:var(--muted)}
.info a{color:var(--accent);text-decoration:none;font-weight:600}
.promo{padding:12px 16px;font-size:.88rem;margin:0}
.promo b{color:var(--accent)}
.card{padding:16px;display:grid;gap:12px}
label{display:grid;gap:5px;font-size:.85rem;color:var(--muted)}
.lbl{font-size:.85rem;color:var(--muted)}
input,select,textarea{width:100%;font:400 1rem var(--f-body);color:var(--ink);background:rgba(255,255,255,.55);border:1px solid var(--line);border-radius:12px;padding:12px}
html.dark input,html.dark select,html.dark textarea{background:rgba(255,255,255,.06)}
select:disabled{opacity:.5}
textarea{resize:vertical}
.check{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-size:.82rem}
.check input{width:20px;height:20px;flex:none;margin:0;accent-color:var(--accent)}
.check a{color:var(--accent)}
.gain{gap:8px}
.gain-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.gain-row b{font:600 1rem ui-monospace,"JetBrains Mono",monospace}
.gain-row b em{font-style:normal;color:var(--accent)}
.note{font-size:.8rem;color:var(--muted);margin:2px 0 0}
.link{color:var(--accent);font-weight:600;text-decoration:none;font-size:.9rem}
.days{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 6px;scroll-snap-type:x mandatory}
.day{flex:none;scroll-snap-align:start;min-width:66px;padding:9px 6px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.45);
 display:grid;gap:1px;text-align:center;font:inherit;color:var(--ink);cursor:pointer}
html.dark .day{background:rgba(255,255,255,.05)}
.day small{font-size:.72rem;color:var(--muted)}
.day b{font-size:1.05rem}
.day i{font-style:normal;font-size:.68rem;color:var(--muted)}
.day.busy{opacity:.45}
.day.busy i{color:var(--accent)}
.day.sel{background:var(--accent);border-color:var(--accent);color:#fff}
.day.sel small,.day.sel i{color:rgba(255,255,255,.85)}
.err{color:var(--accent);font-size:.88rem;margin:0}
.done{text-align:center;padding:26px 18px}
.done h2{margin:6px 0 4px}
.done a{color:var(--accent)}
.ok{width:64px;height:64px;margin:0 auto;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#fff;font-size:2rem;box-shadow:0 8px 22px rgba(200,0,26,.35)}
.hours{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.hour{padding:10px 4px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.45);font:600 .95rem var(--f-body);color:var(--ink);cursor:pointer}
html.dark .hour{background:rgba(255,255,255,.05)}
.hour:disabled{opacity:.35;text-decoration:line-through;cursor:default}
.hour.sel{background:var(--accent);border-color:var(--accent);color:#fff}
